@ilo-org/styles 0.1.11 → 0.1.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -151,7 +151,7 @@ select {
151
151
  }
152
152
  /**
153
153
  * Do not edit directly
154
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
154
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
155
155
  */
156
156
  /**
157
157
  * TOKENS:
@@ -169,7 +169,7 @@ body {
169
169
 
170
170
  /**
171
171
  * Do not edit directly
172
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
172
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
173
173
  */
174
174
  /**
175
175
  * TOKENS:
@@ -282,7 +282,7 @@ body {
282
282
 
283
283
  /**
284
284
  * Do not edit directly
285
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
285
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
286
286
  */
287
287
  /**
288
288
  * TOKENS:
@@ -307,7 +307,7 @@ body {
307
307
  }
308
308
  /**
309
309
  * Do not edit directly
310
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
310
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
311
311
  */
312
312
  /**
313
313
  * TOKENS:
@@ -342,6 +342,11 @@ body {
342
342
  text-decoration-thickness: 0.1071811361rem;
343
343
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 16'%3e%3cpath fill='rgb(35, 0, 80)' d='M1.73149 16L0.613281 15.1855L5.83848 8L0.613281 0.814495L1.73149 0L7.25349 7.59275C7.33987 7.71097 7.38643 7.85359 7.38643 8C7.38643 8.14641 7.33987 8.28903 7.25349 8.40725L1.73149 16Z'/%3e%3c/svg%3e");
344
344
  }
345
+ .right-to-left .ilo--breadcrumb--link {
346
+ background-position: 0 52%;
347
+ padding: 0 0.5359056806rem 0 1.2861736334rem;
348
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 16'%3e%3cpath fill='rgb(35, 0, 80)' d='M0.7%2c8.4C0.7%2c8.3%2c0.6%2c8.1%2c0.6%2c8s0-0.3%2c0.1-0.4L6.3%2c0l1.1%2c0.8L2.2%2c8l5.2%2c7.2L6.3%2c16L0.7%2c8.4z'/%3e%3c/svg%3e");
349
+ }
345
350
  .ilo--breadcrumb--link--label {
346
351
  font-family: Noto Sans;
347
352
  font-weight: 400;
@@ -355,6 +360,9 @@ body {
355
360
  text-decoration-thickness: 0.1071811361rem;
356
361
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 16'%3e%3cpath fill='rgb(30, 45, 190)' d='M1.73149 16L0.613281 15.1855L5.83848 8L0.613281 0.814495L1.73149 0L7.25349 7.59275C7.33987 7.71097 7.38643 7.85359 7.38643 8C7.38643 8.14641 7.33987 8.28903 7.25349 8.40725L1.73149 16Z'/%3e%3c/svg%3e");
357
362
  }
363
+ .right-to-left .ilo--breadcrumb--link:hover, .right-to-left .ilo--breadcrumb--link:focus {
364
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 16'%3e%3cpath fill='rgb(30, 45, 190)' d='M0.7%2c8.4C0.7%2c8.3%2c0.6%2c8.1%2c0.6%2c8s0-0.3%2c0.1-0.4L6.3%2c0l1.1%2c0.8L2.2%2c8l5.2%2c7.2L6.3%2c16L0.7%2c8.4z'/%3e%3c/svg%3e");
365
+ }
358
366
  .ilo--breadcrumb--item {
359
367
  align-items: center;
360
368
  display: flex;
@@ -427,6 +435,11 @@ body {
427
435
  width: 0.857449089rem;
428
436
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 16'%3e%3cpath fill='rgb(35, 0, 80)' d='M1.73149 16L0.613281 15.1855L5.83848 8L0.613281 0.814495L1.73149 0L7.25349 7.59275C7.33987 7.71097 7.38643 7.85359 7.38643 8C7.38643 8.14641 7.33987 8.28903 7.25349 8.40725L1.73149 16Z'/%3e%3c/svg%3e");
429
437
  }
438
+ .right-to-left .ilo--breadcrumb.contextmenu .ilo--breadcrumb--item--context:after {
439
+ right: auto;
440
+ left: -7px;
441
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 16'%3e%3cpath fill='rgb(35, 0, 80)' d='M0.7%2c8.4C0.7%2c8.3%2c0.6%2c8.1%2c0.6%2c8s0-0.3%2c0.1-0.4L6.3%2c0l1.1%2c0.8L2.2%2c8l5.2%2c7.2L6.3%2c16L0.7%2c8.4z'/%3e%3c/svg%3e");
442
+ }
430
443
  .ilo--breadcrumb.contextmenu .ilo--breadcrumb--item--context .context--menu {
431
444
  border-radius: 0.1071811361rem;
432
445
  background-color: rgb(237, 240, 242);
@@ -515,6 +528,9 @@ body {
515
528
  text-decoration: underline;
516
529
  text-decoration-thickness: 0.1071811361rem;
517
530
  }
531
+ .right-to-left .ilo--breadcrumb.contextmenu .ilo--breadcrumb--item--context .context--menu .ilo--breadcrumb--link {
532
+ text-align: center;
533
+ }
518
534
  @media screen and (min-width: 610px) {
519
535
  .ilo--breadcrumb--items:after {
520
536
  background: linear-gradient(to bottom right, white 50%, transparent 50%);
@@ -526,10 +542,18 @@ body {
526
542
  top: 0;
527
543
  width: 47px;
528
544
  }
545
+ .right-to-left .ilo--breadcrumb--items:after {
546
+ right: auto;
547
+ left: -47px;
548
+ transform: scaleX(-1);
549
+ }
529
550
  .ilo--breadcrumb--items.context--menu:after {
530
551
  content: none;
531
552
  }
532
553
  }
554
+ .right-to-left .ilo--breadcrumb {
555
+ direction: rtl;
556
+ }
533
557
  .ilo--breadcrumb.storybook {
534
558
  background-color: rgb(184, 196, 204);
535
559
  height: 100vh;
@@ -537,7 +561,7 @@ body {
537
561
 
538
562
  /**
539
563
  * Do not edit directly
540
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
564
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
541
565
  */
542
566
  /**
543
567
  * TOKENS:
@@ -547,7 +571,7 @@ body {
547
571
  */
548
572
  /**
549
573
  * Do not edit directly
550
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
574
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
551
575
  */
552
576
  /**
553
577
  * TOKENS:
@@ -572,7 +596,7 @@ body {
572
596
  }
573
597
  /**
574
598
  * Do not edit directly
575
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
599
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
576
600
  */
577
601
  /**
578
602
  * TOKENS:
@@ -862,7 +886,7 @@ body {
862
886
 
863
887
  /**
864
888
  * Do not edit directly
865
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
889
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
866
890
  */
867
891
  /**
868
892
  * TOKENS:
@@ -992,7 +1016,7 @@ body {
992
1016
 
993
1017
  /**
994
1018
  * Do not edit directly
995
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
1019
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
996
1020
  */
997
1021
  /**
998
1022
  * TOKENS:
@@ -1007,27 +1031,31 @@ body {
1007
1031
  .right-to-left .ilo--card {
1008
1032
  text-align: right;
1009
1033
  }
1010
- .ilo--card--action:hover:not(.ilo--card--data), .ilo--card--action:focus:not(.ilo--card--data) {
1034
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat), .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat), .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) {
1011
1035
  background: rgb(255, 255, 255);
1012
1036
  color: rgb(30, 45, 190);
1037
+ outline: none;
1013
1038
  text-decoration: none;
1014
1039
  }
1015
- .ilo--card--action:hover:not(.ilo--card--data).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist), .ilo--card--action:focus:not(.ilo--card--data).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist) {
1040
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist), .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist), .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist) {
1016
1041
  background: rgb(255, 255, 255);
1017
1042
  }
1018
- .ilo--card--action:hover:not(.ilo--card--data) .ilo--card--eyebrow, .ilo--card--action:focus:not(.ilo--card--data) .ilo--card--eyebrow {
1043
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist).ilo--card--cornercut::after, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist).ilo--card--cornercut::after, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist).ilo--card--cornercut::after {
1044
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1045
+ }
1046
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eyebrow, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eyebrow, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eyebrow {
1019
1047
  color: rgb(30, 45, 190);
1020
1048
  }
1021
- .ilo--card--action:hover:not(.ilo--card--data) .ilo--card--title, .ilo--card--action:focus:not(.ilo--card--data) .ilo--card--title {
1049
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--title, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--title, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--title {
1022
1050
  color: rgb(30, 45, 190);
1023
1051
  }
1024
- .ilo--card--action:hover:not(.ilo--card--data) .ilo--card--intro, .ilo--card--action:focus:not(.ilo--card--data) .ilo--card--intro {
1052
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--intro, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--intro, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--intro {
1025
1053
  color: rgb(30, 45, 190);
1026
1054
  }
1027
- .ilo--card--action:hover:not(.ilo--card--data) .ilo--card--date, .ilo--card--action:focus:not(.ilo--card--data) .ilo--card--date {
1055
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--date, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--date, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--date {
1028
1056
  color: rgb(30, 45, 190);
1029
1057
  }
1030
- .ilo--card--action:hover:not(.ilo--card--data) .ilo--card--eventdate, .ilo--card--action:focus:not(.ilo--card--data) .ilo--card--eventdate {
1058
+ .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eventdate, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eventdate, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eventdate {
1031
1059
  color: rgb(30, 45, 190);
1032
1060
  }
1033
1061
  .ilo--card--link {
@@ -1044,7 +1072,8 @@ body {
1044
1072
  transition-duration: 150ms;
1045
1073
  transition-timing-function: ease-out;
1046
1074
  }
1047
- .ilo--card--link:hover, .ilo--card--link:focus {
1075
+ .ilo--card--link:hover, .ilo--card--link:focus, .ilo--card--link:focus-within {
1076
+ outline: none;
1048
1077
  transition-property: color, background-color, border-color, opacity;
1049
1078
  transition-duration: 150ms;
1050
1079
  transition-timing-function: ease-out;
@@ -1062,69 +1091,171 @@ body {
1062
1091
  .ilo--card--light {
1063
1092
  background: rgb(255, 255, 255);
1064
1093
  }
1065
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus) {
1094
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) {
1066
1095
  background: rgb(35, 0, 80);
1096
+ outline: none;
1067
1097
  transition: background 150ms ease-out;
1068
1098
  }
1069
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus) .ilo--card--eyebrow {
1099
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--eyebrow {
1070
1100
  color: rgb(237, 240, 242);
1071
1101
  transition: color 150ms ease-out;
1072
1102
  }
1073
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus) .ilo--card--title {
1103
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--title {
1074
1104
  color: rgb(255, 255, 255);
1075
1105
  transition: color 150ms ease-out;
1076
1106
  }
1077
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus) .ilo--card--intro {
1107
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--intro {
1078
1108
  color: rgb(237, 240, 242);
1079
1109
  transition: color 150ms ease-out;
1080
1110
  }
1081
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus) .ilo--card--date {
1111
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--date {
1082
1112
  color: rgb(237, 240, 242);
1083
1113
  transition: color 150ms ease-out;
1084
1114
  }
1085
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus) .ilo--card--eventdate {
1115
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--eventdate {
1086
1116
  color: rgb(237, 240, 242);
1087
1117
  transition: color 150ms ease-out;
1088
1118
  }
1089
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature) {
1119
+ .ilo--card--dark:not(.ilo--card--action), .ilo--card--dark:not(.ilo--card--action):hover, .ilo--card--dark:not(.ilo--card--action):focus, .ilo--card--dark:not(.ilo--card--action):focus-within {
1120
+ background: rgb(35, 0, 80);
1121
+ outline: none;
1122
+ transition: background 150ms ease-out;
1123
+ }
1124
+ .ilo--card--dark:not(.ilo--card--action) .ilo--card--eyebrow, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--eyebrow, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--eyebrow, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--eyebrow {
1125
+ color: rgb(237, 240, 242);
1126
+ transition: color 150ms ease-out;
1127
+ }
1128
+ .ilo--card--dark:not(.ilo--card--action) .ilo--card--title, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--title, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--title, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--title {
1129
+ color: rgb(255, 255, 255);
1130
+ transition: color 150ms ease-out;
1131
+ }
1132
+ .ilo--card--dark:not(.ilo--card--action) .ilo--card--intro, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--intro, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--intro, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--intro {
1133
+ color: rgb(237, 240, 242);
1134
+ transition: color 150ms ease-out;
1135
+ }
1136
+ .ilo--card--dark:not(.ilo--card--action) .ilo--card--date, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--date, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--date, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--date {
1137
+ color: rgb(237, 240, 242);
1138
+ transition: color 150ms ease-out;
1139
+ }
1140
+ .ilo--card--dark:not(.ilo--card--action) .ilo--card--eventdate, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--eventdate, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--eventdate, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--eventdate {
1141
+ color: rgb(237, 240, 242);
1142
+ transition: color 150ms ease-out;
1143
+ }
1144
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
1090
1145
  margin-top: 2.1436227224rem;
1091
1146
  padding-top: 0;
1092
1147
  position: relative;
1093
1148
  }
1149
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1150
+ background: inherit;
1151
+ content: "";
1152
+ display: block;
1153
+ height: 40px;
1154
+ position: absolute;
1155
+ width: calc(100% - 73px);
1156
+ }
1157
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1158
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1159
+ background-position: bottom right;
1160
+ background-size: cover;
1161
+ content: "";
1162
+ height: 40px;
1163
+ display: block;
1164
+ position: absolute;
1165
+ width: 73.4px;
1166
+ }
1167
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1168
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1169
+ }
1094
1170
  @media screen and (min-width: 610px) {
1095
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature) {
1171
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
1096
1172
  margin-top: 2.5723472669rem;
1097
1173
  }
1174
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1175
+ background: inherit;
1176
+ content: "";
1177
+ display: block;
1178
+ height: 48px;
1179
+ position: absolute;
1180
+ width: calc(100% - 87px);
1181
+ }
1182
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1183
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1184
+ background-position: bottom right;
1185
+ background-size: cover;
1186
+ content: "";
1187
+ height: 48px;
1188
+ display: block;
1189
+ position: absolute;
1190
+ width: 87.4px;
1191
+ }
1192
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1193
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1194
+ }
1098
1195
  }
1099
1196
  @media screen and (min-width: 1024px) {
1100
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature) {
1197
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
1101
1198
  margin-top: 3.4297963558rem;
1102
1199
  }
1200
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1201
+ background: inherit;
1202
+ content: "";
1203
+ display: block;
1204
+ height: 64px;
1205
+ position: absolute;
1206
+ width: calc(100% - 116px);
1207
+ }
1208
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1209
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1210
+ background-position: bottom right;
1211
+ background-size: cover;
1212
+ content: "";
1213
+ height: 64px;
1214
+ display: block;
1215
+ position: absolute;
1216
+ width: 116.4px;
1217
+ }
1218
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1219
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1220
+ }
1103
1221
  }
1104
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1105
- background: inherit;
1106
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1107
- content: "";
1108
- display: block;
1109
- height: 1.6077170418rem;
1222
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1110
1223
  left: 0;
1111
- position: absolute;
1112
- top: -1.5916398714rem;
1113
- width: 100%;
1224
+ top: -2.1436227224rem;
1225
+ transition: background-image 150ms ease-out;
1114
1226
  }
1115
- .right-to-left .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1116
- clip-path: polygon(100% 0, 100% 100%, 100% 100%, 0% 100%, 10% 0%);
1227
+ .right-to-left .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1228
+ left: auto;
1229
+ right: 0;
1117
1230
  }
1118
1231
  @media screen and (min-width: 610px) {
1119
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1120
- height: 2.0364415863rem;
1121
- top: -2.0203644159rem;
1232
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1233
+ top: -2.5562700965rem;
1122
1234
  }
1123
1235
  }
1124
1236
  @media screen and (min-width: 1024px) {
1125
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1126
- height: 3.1082529475rem;
1127
- top: -3.0921757771rem;
1237
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1238
+ top: -3.4137191854rem;
1239
+ }
1240
+ }
1241
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1242
+ right: 0;
1243
+ top: -2.1436227224rem;
1244
+ transition: background-image 150ms ease-out;
1245
+ }
1246
+ .right-to-left .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1247
+ left: 0;
1248
+ right: auto;
1249
+ transform: rotateY(180deg);
1250
+ }
1251
+ @media screen and (min-width: 610px) {
1252
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1253
+ top: -2.5562700965rem;
1254
+ }
1255
+ }
1256
+ @media screen and (min-width: 1024px) {
1257
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1258
+ top: -3.4137191854rem;
1128
1259
  }
1129
1260
  }
1130
1261
  .ilo--card--eyebrow {
@@ -1137,7 +1268,7 @@ body {
1137
1268
  transition-duration: 150ms;
1138
1269
  transition-timing-function: ease-out;
1139
1270
  }
1140
- .ilo--card--link:hover .ilo--card--eyebrow, .ilo--card--link:focus .ilo--card--eyebrow {
1271
+ .ilo--card--link:hover .ilo--card--eyebrow, .ilo--card--link:focus .ilo--card--eyebrow, .ilo--card--link:focus-within .ilo--card--eyebrow {
1141
1272
  color: rgb(30, 45, 190);
1142
1273
  transition-property: color;
1143
1274
  transition-duration: 150ms;
@@ -1155,7 +1286,7 @@ body {
1155
1286
  transition-duration: 150ms;
1156
1287
  transition-timing-function: ease-out;
1157
1288
  }
1158
- .ilo--card--link:hover .ilo--card--title, .ilo--card--link:focus .ilo--card--title {
1289
+ .ilo--card--link:hover .ilo--card--title, .ilo--card--link:focus .ilo--card--title, .ilo--card--link:focus-within .ilo--card--title {
1159
1290
  color: rgb(30, 45, 190);
1160
1291
  transition-property: color;
1161
1292
  transition-duration: 150ms;
@@ -1171,7 +1302,7 @@ body {
1171
1302
  transition-duration: 150ms;
1172
1303
  transition-timing-function: ease-out;
1173
1304
  }
1174
- .ilo--card--link:hover .ilo--card--intro, .ilo--card--link:focus .ilo--card--intro {
1305
+ .ilo--card--link:hover .ilo--card--intro, .ilo--card--link:focus .ilo--card--intro, .ilo--card--link:focus-within .ilo--card--intro {
1175
1306
  color: rgb(30, 45, 190);
1176
1307
  transition-property: color;
1177
1308
  transition-duration: 150ms;
@@ -1187,7 +1318,7 @@ body {
1187
1318
  transition-duration: 150ms;
1188
1319
  transition-timing-function: ease-out;
1189
1320
  }
1190
- .ilo--card--link:hover .ilo--card--date, .ilo--card--link:focus .ilo--card--date {
1321
+ .ilo--card--link:hover .ilo--card--date, .ilo--card--link:focus .ilo--card--date, .ilo--card--link:focus-within .ilo--card--date {
1191
1322
  color: rgb(30, 45, 190);
1192
1323
  transition-property: color;
1193
1324
  transition-duration: 150ms;
@@ -1376,14 +1507,14 @@ body {
1376
1507
  padding: 1.7148981779rem 0;
1377
1508
  }
1378
1509
  }
1379
- .ilo--card--detail:hover, .ilo--card--detail:focus {
1510
+ .ilo--card--detail:hover, .ilo--card--detail:focus, .ilo--card--detail:focus-within {
1380
1511
  filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1381
1512
  }
1382
- .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before {
1513
+ .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before, .ilo--card--detail:focus-within picture::before {
1383
1514
  opacity: 0.4;
1384
1515
  z-index: 2;
1385
1516
  }
1386
- .ilo--card--detail:hover .ilo--card--event-date::before, .ilo--card--detail:focus .ilo--card--event-date::before {
1517
+ .ilo--card--detail:hover .ilo--card--event-date::before, .ilo--card--detail:focus .ilo--card--event-date::before, .ilo--card--detail:focus-within .ilo--card--event-date::before {
1387
1518
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 11'%3e%3cpath fill='rgb(30, 45, 190)' d='M6.00007 10.8462L12 0L0 0L6.00007 10.8462Z'/%3e%3c/svg%3e");
1388
1519
  }
1389
1520
  .ilo--card--detail picture {
@@ -1477,28 +1608,143 @@ body {
1477
1608
  }
1478
1609
  .ilo--card--graphic::before {
1479
1610
  background: inherit;
1480
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1481
1611
  content: "";
1482
1612
  display: block;
1483
1613
  height: 40px;
1484
- left: 0;
1485
1614
  position: absolute;
1615
+ width: calc(100% - 73px);
1616
+ }
1617
+ .ilo--card--graphic::after {
1618
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1619
+ background-position: bottom right;
1620
+ background-size: cover;
1621
+ content: "";
1622
+ height: 40px;
1623
+ display: block;
1624
+ position: absolute;
1625
+ width: 73.4px;
1626
+ }
1627
+ .ilo--card--graphic.ilo--card--dark::after {
1628
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1629
+ }
1630
+ .ilo--card--graphic.ilo--card--dark:hover::after, .ilo--card--graphic.ilo--card--dark:focus::after, .ilo--card--graphic.ilo--card--dark:focus-within::after {
1631
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1632
+ }
1633
+ .ilo--card--graphic::before {
1634
+ left: 0;
1486
1635
  top: -39.7px;
1487
- width: 100%;
1636
+ }
1637
+ .right-to-left .ilo--card--graphic::before {
1638
+ left: auto;
1639
+ right: 0;
1640
+ }
1641
+ .ilo--card--graphic::after {
1642
+ right: 0;
1643
+ top: -39.7px;
1644
+ transition: background-image 150ms ease-out;
1645
+ }
1646
+ .right-to-left .ilo--card--graphic::after {
1647
+ left: 0;
1648
+ right: auto;
1649
+ transform: rotateY(180deg);
1488
1650
  }
1489
1651
  .ilo--card--graphic .ilo--profile--contents * {
1490
1652
  color: rgb(255, 255, 255);
1491
1653
  }
1492
- .ilo--card--graphic:hover, .ilo--card--graphic:focus {
1654
+ .ilo--card--graphic:hover, .ilo--card--graphic:focus, .ilo--card--graphic:focus-within {
1493
1655
  filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1494
1656
  }
1495
- .ilo--card--graphic:hover .ilo--profile--contents *, .ilo--card--graphic:focus .ilo--profile--contents * {
1657
+ .ilo--card--graphic:hover .ilo--profile--contents *, .ilo--card--graphic:focus .ilo--profile--contents *, .ilo--card--graphic:focus-within .ilo--profile--contents * {
1496
1658
  color: rgb(30, 45, 190);
1497
1659
  }
1498
1660
  @media screen and (min-width: 610px) {
1499
1661
  .ilo--card--graphic {
1500
1662
  padding: 0 1.7148981779rem 2.1436227224rem;
1501
1663
  }
1664
+ .ilo--card--graphic::before {
1665
+ background: inherit;
1666
+ content: "";
1667
+ display: block;
1668
+ height: 40px;
1669
+ position: absolute;
1670
+ width: calc(100% - 73px);
1671
+ }
1672
+ .ilo--card--graphic::after {
1673
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1674
+ background-position: bottom right;
1675
+ background-size: cover;
1676
+ content: "";
1677
+ height: 40px;
1678
+ display: block;
1679
+ position: absolute;
1680
+ width: 73.4px;
1681
+ }
1682
+ .ilo--card--graphic.ilo--card--dark::after {
1683
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1684
+ }
1685
+ .ilo--card--graphic.ilo--card--dark:hover::after, .ilo--card--graphic.ilo--card--dark:focus::after, .ilo--card--graphic.ilo--card--dark:focus-within::after {
1686
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1687
+ }
1688
+ .ilo--card--graphic::before {
1689
+ left: 0;
1690
+ top: -39.7px;
1691
+ }
1692
+ .right-to-left .ilo--card--graphic::before {
1693
+ left: auto;
1694
+ right: 0;
1695
+ }
1696
+ .ilo--card--graphic::after {
1697
+ right: 0;
1698
+ top: -39.7px;
1699
+ }
1700
+ .right-to-left .ilo--card--graphic::after {
1701
+ left: 0;
1702
+ right: auto;
1703
+ transform: rotateY(180deg);
1704
+ }
1705
+ }
1706
+ @media screen and (min-width: 1024px) {
1707
+ .ilo--card--graphic::before {
1708
+ background: inherit;
1709
+ content: "";
1710
+ display: block;
1711
+ height: 40px;
1712
+ position: absolute;
1713
+ width: calc(100% - 73px);
1714
+ }
1715
+ .ilo--card--graphic::after {
1716
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1717
+ background-position: bottom right;
1718
+ background-size: cover;
1719
+ content: "";
1720
+ height: 40px;
1721
+ display: block;
1722
+ position: absolute;
1723
+ width: 73.4px;
1724
+ }
1725
+ .ilo--card--graphic.ilo--card--dark::after {
1726
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1727
+ }
1728
+ .ilo--card--graphic.ilo--card--dark:hover::after, .ilo--card--graphic.ilo--card--dark:focus::after, .ilo--card--graphic.ilo--card--dark:focus-within::after {
1729
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1730
+ }
1731
+ .ilo--card--graphic::before {
1732
+ left: 0;
1733
+ top: -39.7px;
1734
+ }
1735
+ .right-to-left .ilo--card--graphic::before {
1736
+ left: auto;
1737
+ right: 0;
1738
+ }
1739
+ .ilo--card--graphic::after {
1740
+ right: 0;
1741
+ top: -39.7px;
1742
+ }
1743
+ .right-to-left .ilo--card--graphic::after {
1744
+ left: 0;
1745
+ right: auto;
1746
+ transform: rotateY(180deg);
1747
+ }
1502
1748
  }
1503
1749
  .ilo--card--graphic.ilo--card--wide {
1504
1750
  padding: 0 1.7148981779rem 2.1436227224rem;
@@ -1554,35 +1800,35 @@ body {
1554
1800
  display: block;
1555
1801
  margin-bottom: 1.4398166117rem;
1556
1802
  }
1803
+ .ilo--card--graphic .ilo--card--content {
1804
+ display: flex;
1805
+ flex-direction: column;
1806
+ position: relative;
1807
+ }
1808
+ .ilo--card--graphic .ilo--card--content > * {
1809
+ justify-self: flex-start;
1810
+ }
1811
+ .ilo--card--graphic .ilo--card--content > *:last-child {
1812
+ justify-self: flex-end;
1813
+ margin-bottom: 0;
1814
+ }
1557
1815
  .ilo--card--graphicpromo {
1558
1816
  max-width: 49.3033226152rem;
1559
1817
  padding: 2.1436227224rem 1.2861736334rem;
1560
1818
  width: 100%;
1561
1819
  }
1562
- .ilo--card--graphicpromo.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1563
- height: 2.1436227224rem;
1564
- top: -2.127545552rem;
1565
- }
1566
- .ilo--card--graphicpromo:hover, .ilo--card--graphicpromo:focus {
1820
+ .ilo--card--graphicpromo:hover, .ilo--card--graphicpromo:focus, .ilo--card--graphicpromo:focus-within {
1567
1821
  filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1568
1822
  }
1569
1823
  @media screen and (min-width: 610px) {
1570
1824
  .ilo--card--graphicpromo {
1571
1825
  padding: 2.5723472669rem;
1572
1826
  }
1573
- .ilo--card--graphicpromo.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1574
- height: 3.4297963558rem;
1575
- top: -3.4137191854rem;
1576
- }
1577
1827
  }
1578
1828
  @media screen and (min-width: 1024px) {
1579
1829
  .ilo--card--graphicpromo {
1580
1830
  padding: 3.4297963558rem 3.8585209003rem;
1581
1831
  }
1582
- .ilo--card--graphicpromo.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1583
- height: 3.4297963558rem;
1584
- top: -3.4137191854rem;
1585
- }
1586
1832
  }
1587
1833
  .ilo--card--graphicpromo.ilo--card--wide {
1588
1834
  padding: 3.4297963558rem 3.8585209003rem;
@@ -1684,9 +1930,14 @@ body {
1684
1930
  pointer-events: none;
1685
1931
  }
1686
1932
  .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1687
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1688
- height: 2.1436227224rem;
1933
+ height: 40px;
1934
+ top: -2.127545552rem;
1935
+ width: calc(100% - 73px);
1936
+ }
1937
+ .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1938
+ height: 40px;
1689
1939
  top: -2.127545552rem;
1940
+ width: 73.3px;
1690
1941
  }
1691
1942
  .ilo--card--factlist.ilo--card--dark {
1692
1943
  background: rgb(35, 0, 80);
@@ -1696,9 +1947,14 @@ body {
1696
1947
  padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1697
1948
  }
1698
1949
  .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1699
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1700
- height: 2.1972132905rem;
1701
- top: -2.18113612rem;
1950
+ height: 48px;
1951
+ top: -2.5562700965rem;
1952
+ width: calc(100% - 87px);
1953
+ }
1954
+ .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1955
+ height: 48px;
1956
+ top: -2.5562700965rem;
1957
+ width: 87.3px;
1702
1958
  }
1703
1959
  }
1704
1960
  .ilo--card--factlist.ilo--card--wide {
@@ -1740,13 +1996,13 @@ body {
1740
1996
  .ilo--card--factlist.ilo--card--dark .ilo--list__item:last-of-type {
1741
1997
  margin-bottom: 0;
1742
1998
  }
1743
- .ilo--card--factlist.ilo--card--dark:hover .ilo--card--title, .ilo--card--factlist.ilo--card--dark:focus .ilo--card--title {
1999
+ .ilo--card--factlist.ilo--card--dark:hover .ilo--card--title, .ilo--card--factlist.ilo--card--dark:focus .ilo--card--title, .ilo--card--factlist.ilo--card--dark:focus-within .ilo--card--title {
1744
2000
  color: rgb(255, 255, 255);
1745
2001
  transition-property: color;
1746
2002
  transition-duration: 150ms;
1747
2003
  transition-timing-function: ease-out;
1748
2004
  }
1749
- .ilo--card--factlist.ilo--card--dark:hover .ilo--list__item, .ilo--card--factlist.ilo--card--dark:focus .ilo--list__item {
2005
+ .ilo--card--factlist.ilo--card--dark:hover .ilo--list__item, .ilo--card--factlist.ilo--card--dark:focus .ilo--list__item, .ilo--card--factlist.ilo--card--dark:focus-within .ilo--list__item {
1750
2006
  color: rgb(255, 255, 255);
1751
2007
  }
1752
2008
  .ilo--card--factlist .ilo--card--title {
@@ -1766,26 +2022,112 @@ body {
1766
2022
  }
1767
2023
  .ilo--card--stat {
1768
2024
  border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
2025
+ margin-top: 2.1436227224rem;
1769
2026
  padding: 0 1.2861736334rem 2.1436227224rem 1.1789924973rem;
2027
+ position: relative;
1770
2028
  width: 100%;
1771
2029
  }
1772
2030
  .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1773
- clip-path: polygon(75% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1774
- height: 2.1436227224rem;
2031
+ left: 0;
2032
+ top: -2.127545552rem;
2033
+ }
2034
+ .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2035
+ left: auto;
2036
+ right: 0;
2037
+ }
2038
+ .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2039
+ right: 0;
1775
2040
  top: -2.127545552rem;
1776
2041
  }
2042
+ .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2043
+ left: 0;
2044
+ right: auto;
2045
+ transform: rotateY(180deg);
2046
+ }
1777
2047
  .ilo--card--stat.ilo--card--blue {
1778
2048
  background: rgb(235, 245, 253);
1779
2049
  }
2050
+ .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2051
+ background: inherit;
2052
+ content: "";
2053
+ display: block;
2054
+ height: 40px;
2055
+ position: absolute;
2056
+ width: calc(100% - 73px);
2057
+ }
2058
+ .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2059
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(235, 245, 253)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2060
+ background-position: bottom right;
2061
+ background-size: cover;
2062
+ content: "";
2063
+ height: 40px;
2064
+ display: block;
2065
+ position: absolute;
2066
+ width: 73.4px;
2067
+ }
1780
2068
  .ilo--card--stat.ilo--card--yellow {
1781
2069
  background: rgb(255, 205, 45);
1782
2070
  }
2071
+ .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2072
+ background: inherit;
2073
+ content: "";
2074
+ display: block;
2075
+ height: 40px;
2076
+ position: absolute;
2077
+ width: calc(100% - 73px);
2078
+ }
2079
+ .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2080
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 205, 45)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2081
+ background-position: bottom right;
2082
+ background-size: cover;
2083
+ content: "";
2084
+ height: 40px;
2085
+ display: block;
2086
+ position: absolute;
2087
+ width: 73.4px;
2088
+ }
1783
2089
  .ilo--card--stat.ilo--card--green {
1784
2090
  background: rgb(140, 225, 100);
1785
2091
  }
2092
+ .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2093
+ background: inherit;
2094
+ content: "";
2095
+ display: block;
2096
+ height: 40px;
2097
+ position: absolute;
2098
+ width: calc(100% - 73px);
2099
+ }
2100
+ .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2101
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(140, 225, 100)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2102
+ background-position: bottom right;
2103
+ background-size: cover;
2104
+ content: "";
2105
+ height: 40px;
2106
+ display: block;
2107
+ position: absolute;
2108
+ width: 73.4px;
2109
+ }
1786
2110
  .ilo--card--stat.ilo--card--turquoise {
1787
2111
  background: rgb(5, 210, 210);
1788
2112
  }
2113
+ .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2114
+ background: inherit;
2115
+ content: "";
2116
+ display: block;
2117
+ height: 40px;
2118
+ position: absolute;
2119
+ width: calc(100% - 73px);
2120
+ }
2121
+ .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2122
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(5, 210, 210)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2123
+ background-position: bottom right;
2124
+ background-size: cover;
2125
+ content: "";
2126
+ height: 40px;
2127
+ display: block;
2128
+ position: absolute;
2129
+ width: 73.4px;
2130
+ }
1789
2131
  .ilo--card--stat .ilo--card--content {
1790
2132
  display: flex;
1791
2133
  flex-wrap: wrap;
@@ -1804,9 +2146,10 @@ body {
1804
2146
  }
1805
2147
  .ilo--card--stat .ilo--card--intro {
1806
2148
  color: rgb(35, 0, 80);
1807
- font-size: 14.93px;
1808
- letter-spacing: -0.02em;
1809
- line-height: 20.16px;
2149
+ font-family: Overpass;
2150
+ font-size: 18.66px;
2151
+ letter-spacing: normal;
2152
+ line-height: 27.24px;
1810
2153
  margin-bottom: 1.6734954235rem;
1811
2154
  width: 100%;
1812
2155
  }
@@ -1816,30 +2159,75 @@ body {
1816
2159
  line-height: 16.24px;
1817
2160
  align-self: flex-end;
1818
2161
  }
1819
- @media screen and (min-width: 1024px) {
1820
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1821
- height: 2.5723472669rem;
1822
- top: -2.5562700965rem;
1823
- }
1824
- }
1825
2162
  .ilo--card--data {
1826
2163
  background: rgb(235, 245, 253);
1827
2164
  border-bottom: 0.1607717042rem solid #82afdc;
2165
+ margin-top: 2.1436227224rem;
1828
2166
  max-width: 32.154340836rem;
1829
2167
  padding: 0 1.2861736334rem 3.0010718114rem;
2168
+ position: relative;
1830
2169
  }
1831
- .ilo--card--data:hover, .ilo--card--data:focus {
2170
+ .ilo--card--data::before {
2171
+ background: inherit;
2172
+ content: "";
2173
+ display: block;
2174
+ height: 40px;
2175
+ position: absolute;
2176
+ width: calc(100% - 73px);
2177
+ }
2178
+ .ilo--card--data::after {
2179
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(235, 245, 253)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2180
+ background-position: bottom right;
2181
+ background-size: cover;
2182
+ content: "";
2183
+ height: 40px;
2184
+ display: block;
2185
+ position: absolute;
2186
+ width: 73.4px;
2187
+ }
2188
+ .ilo--card--data:hover, .ilo--card--data:focus, .ilo--card--data:focus-within {
1832
2189
  background: rgb(235, 245, 253);
1833
2190
  }
1834
2191
  .ilo--card--data::before {
1835
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1836
- height: 2.1436227224rem;
2192
+ left: 0;
1837
2193
  top: -2.127545552rem;
1838
2194
  }
1839
- @media screen and (min-width: 1024px) {
2195
+ .right-to-left .ilo--card--data::before {
2196
+ left: auto;
2197
+ right: 0;
2198
+ }
2199
+ .ilo--card--data::after {
2200
+ right: 0;
2201
+ top: -2.127545552rem;
2202
+ }
2203
+ .right-to-left .ilo--card--data::after {
2204
+ left: 0;
2205
+ right: auto;
2206
+ transform: rotateY(180deg);
2207
+ }
2208
+ @media screen and (min-width: 610px) {
1840
2209
  .ilo--card--data::before {
1841
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1842
- height: 2.5723472669rem;
2210
+ background: inherit;
2211
+ content: "";
2212
+ display: block;
2213
+ height: 48px;
2214
+ position: absolute;
2215
+ width: calc(100% - 84px);
2216
+ }
2217
+ .ilo--card--data::after {
2218
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(235, 245, 253)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2219
+ background-position: bottom right;
2220
+ background-size: cover;
2221
+ content: "";
2222
+ height: 48px;
2223
+ display: block;
2224
+ position: absolute;
2225
+ width: 84.4px;
2226
+ }
2227
+ .ilo--card--data::before {
2228
+ top: -2.5562700965rem;
2229
+ }
2230
+ .ilo--card--data::after {
1843
2231
  top: -2.5562700965rem;
1844
2232
  }
1845
2233
  }
@@ -1899,7 +2287,7 @@ body {
1899
2287
  color: rgb(255, 255, 255);
1900
2288
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(255, 255, 255)' d='M8.63792 19.9964L7.6499 19.0082L14.6571 11.9999L7.6499 4.99159L8.63792 4.00342L16.1426 11.5023C16.2083 11.5675 16.2604 11.645 16.296 11.7304C16.3316 11.8158 16.3499 11.9074 16.3499 11.9999C16.3499 12.0924 16.3316 12.184 16.296 12.2694C16.2604 12.3548 16.2083 12.4324 16.1426 12.4975L8.63792 19.9964Z'/%3e%3c/svg%3e");
1901
2289
  }
1902
- .ilo--card--feature.ilo--card--dark:hover .ilo--link-list--link, .ilo--card--feature.ilo--card--dark:focus .ilo--link-list--link {
2290
+ .ilo--card--feature.ilo--card--dark:hover .ilo--link-list--link, .ilo--card--feature.ilo--card--dark:focus .ilo--link-list--link, .ilo--card--feature.ilo--card--dark:focus-within .ilo--link-list--link {
1903
2291
  color: rgb(30, 45, 190);
1904
2292
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(30, 45, 190)' d='M8.63792 19.9964L7.6499 19.0082L14.6571 11.9999L7.6499 4.99159L8.63792 4.00342L16.1426 11.5023C16.2083 11.5675 16.2604 11.645 16.296 11.7304C16.3316 11.8158 16.3499 11.9074 16.3499 11.9999C16.3499 12.0924 16.3316 12.184 16.296 12.2694C16.2604 12.3548 16.2083 12.4324 16.1426 12.4975L8.63792 19.9964Z'/%3e%3c/svg%3e");
1905
2293
  }
@@ -1908,19 +2296,19 @@ body {
1908
2296
  transition-duration: 150ms;
1909
2297
  transition-timing-function: ease-out;
1910
2298
  }
1911
- .ilo--card--feature:hover, .ilo--card--feature:focus {
2299
+ .ilo--card--feature:hover, .ilo--card--feature:focus, .ilo--card--feature:focus-within {
1912
2300
  background-color: rgb(255, 255, 255);
1913
2301
  filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1914
2302
  border-bottom: 0.1607717042rem solid rgb(30, 45, 190);
1915
2303
  }
1916
- .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before {
2304
+ .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before, .ilo--card--feature:focus-within picture::before {
1917
2305
  opacity: 0.4;
1918
2306
  z-index: 1;
1919
2307
  transition-property: opacity;
1920
2308
  transition-duration: 150ms;
1921
2309
  transition-timing-function: ease-out;
1922
2310
  }
1923
- .ilo--card--feature:hover .ilo--card--image, .ilo--card--feature:focus .ilo--card--image {
2311
+ .ilo--card--feature:hover .ilo--card--image, .ilo--card--feature:focus .ilo--card--image, .ilo--card--feature:focus-within .ilo--card--image {
1924
2312
  filter: saturate(0);
1925
2313
  }
1926
2314
  .ilo--card--feature .ilo--link-list {
@@ -1956,7 +2344,9 @@ body {
1956
2344
  }
1957
2345
  .ilo--card--feature.ilo--card--wide .ilo--card--content {
1958
2346
  display: flex;
2347
+ flex-direction: row;
1959
2348
  flex-wrap: wrap;
2349
+ position: relative;
1960
2350
  width: 50%;
1961
2351
  }
1962
2352
  .ilo--card--feature.ilo--card--wide .ilo--card--image--wrapper {
@@ -1967,6 +2357,7 @@ body {
1967
2357
  }
1968
2358
  .ilo--card--feature.ilo--card--wide .ilo--card--date {
1969
2359
  align-self: flex-end;
2360
+ width: 100%;
1970
2361
  }
1971
2362
  .ilo--card--feature.ilo--card--wide .ilo--card--eyebrow {
1972
2363
  width: 100%;
@@ -1974,6 +2365,9 @@ body {
1974
2365
  .ilo--card--feature.ilo--card--wide .ilo--card--title {
1975
2366
  width: 100%;
1976
2367
  }
2368
+ .ilo--card--feature.ilo--card--wide .ilo--link-list {
2369
+ width: calc(100% + 48px);
2370
+ }
1977
2371
  }
1978
2372
  .ilo--card--feature .ilo--card--wrap {
1979
2373
  display: flex;
@@ -2028,7 +2422,7 @@ body {
2028
2422
 
2029
2423
  /**
2030
2424
  * Do not edit directly
2031
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2425
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2032
2426
  */
2033
2427
  /**
2034
2428
  * TOKENS:
@@ -2051,17 +2445,17 @@ body {
2051
2445
  }
2052
2446
  @media screen and (min-width: 1024px) {
2053
2447
  .ilo--cardgroup--two .ilo--card {
2054
- width: calc(50% - 32px);
2448
+ width: calc(50% - 24px);
2055
2449
  }
2056
2450
  }
2057
2451
  @media screen and (min-width: 1024px) {
2058
2452
  .ilo--cardgroup--three .ilo--card {
2059
- width: calc(33.333% - 32px);
2453
+ width: calc(33.333% - 24px);
2060
2454
  }
2061
2455
  }
2062
2456
  @media screen and (min-width: 1024px) {
2063
2457
  .ilo--cardgroup--four .ilo--card {
2064
- width: calc(25% - 32px);
2458
+ width: calc(25% - 24px);
2065
2459
  }
2066
2460
  }
2067
2461
  .ilo--cardgroup--button-wrap {
@@ -2073,7 +2467,7 @@ body {
2073
2467
 
2074
2468
  /**
2075
2469
  * Do not edit directly
2076
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2470
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2077
2471
  */
2078
2472
  /**
2079
2473
  * TOKENS:
@@ -2178,7 +2572,7 @@ body {
2178
2572
 
2179
2573
  /**
2180
2574
  * Do not edit directly
2181
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2575
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2182
2576
  */
2183
2577
  /**
2184
2578
  * TOKENS:
@@ -2210,10 +2604,12 @@ body {
2210
2604
  padding: 0 0.4287245445rem;
2211
2605
  }
2212
2606
  .ilo--context-menu--item:first-of-type {
2213
- border-radius: 2px 2px 0 0;
2607
+ border-top-left-radius: 2px;
2608
+ border-top-right-radius: 2px;
2214
2609
  }
2215
2610
  .ilo--context-menu--item:last-of-type {
2216
- border-radius: 0 0 2px 2px;
2611
+ border-bottom-left-radius: 2px;
2612
+ border-bottom-right-radius: 2px;
2217
2613
  }
2218
2614
  .ilo--context-menu--item:last-of-type a {
2219
2615
  border-bottom: none;
@@ -2257,7 +2653,7 @@ body {
2257
2653
 
2258
2654
  /**
2259
2655
  * Do not edit directly
2260
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2656
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2261
2657
  */
2262
2658
  /**
2263
2659
  * TOKENS:
@@ -2267,7 +2663,7 @@ body {
2267
2663
  */
2268
2664
  /**
2269
2665
  * Do not edit directly
2270
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2666
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2271
2667
  */
2272
2668
  /**
2273
2669
  * TOKENS:
@@ -2277,7 +2673,7 @@ body {
2277
2673
  */
2278
2674
  /**
2279
2675
  * Do not edit directly
2280
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2676
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2281
2677
  */
2282
2678
  /**
2283
2679
  * TOKENS:
@@ -2287,7 +2683,7 @@ body {
2287
2683
  */
2288
2684
  /**
2289
2685
  * Do not edit directly
2290
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2686
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2291
2687
  */
2292
2688
  /**
2293
2689
  * TOKENS:
@@ -2413,7 +2809,7 @@ body {
2413
2809
 
2414
2810
  /**
2415
2811
  * Do not edit directly
2416
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2812
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2417
2813
  */
2418
2814
  /**
2419
2815
  * TOKENS:
@@ -2441,7 +2837,7 @@ body {
2441
2837
 
2442
2838
  /**
2443
2839
  * Do not edit directly
2444
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2840
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2445
2841
  */
2446
2842
  /**
2447
2843
  * TOKENS:
@@ -2492,6 +2888,7 @@ body {
2492
2888
  border-left: 0.1607717042rem solid rgb(30, 45, 190);
2493
2889
  border-right: 0.1071811361rem solid rgb(184, 196, 204);
2494
2890
  border-top: 0.1071811361rem solid rgb(184, 196, 204);
2891
+ border-left-width: 2px;
2495
2892
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(30, 45, 190)' d='M12 16.7791L4 8.77914L5.45455 7.2207L12 13.7662L18.5455 7.2207L20 8.77914L12 16.7791Z'/%3e%3c/svg%3e"), linear-gradient(to right, transparent 0%, transparent calc(50% - 0.81px), rgb(184, 196, 204) calc(50% - 0.8px), rgb(184, 196, 204) calc(50% + 0.8px), transparent calc(50% + 0.81px), transparent 100%);
2496
2893
  cursor: pointer;
2497
2894
  }
@@ -2501,6 +2898,7 @@ body {
2501
2898
  border-left: 0.1607717042rem solid rgb(30, 45, 190);
2502
2899
  border-right: 0.1071811361rem solid rgb(184, 196, 204);
2503
2900
  border-top: 0.1071811361rem solid rgb(184, 196, 204);
2901
+ border-left-width: 2px;
2504
2902
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(30, 45, 190)' d='M12 16.7791L4 8.77914L5.45455 7.2207L12 13.7662L18.5455 7.2207L20 8.77914L12 16.7791Z'/%3e%3c/svg%3e"), linear-gradient(to right, transparent 0%, transparent calc(50% - 0.81px), rgb(184, 196, 204) calc(50% - 0.8px), rgb(184, 196, 204) calc(50% + 0.8px), transparent calc(50% + 0.81px), transparent 100%);
2505
2903
  }
2506
2904
  .ilo--dropdown:active {
@@ -2527,7 +2925,7 @@ body {
2527
2925
 
2528
2926
  /**
2529
2927
  * Do not edit directly
2530
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2928
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2531
2929
  */
2532
2930
  /**
2533
2931
  * TOKENS:
@@ -2537,7 +2935,7 @@ body {
2537
2935
  */
2538
2936
  /**
2539
2937
  * Do not edit directly
2540
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2938
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2541
2939
  */
2542
2940
  /**
2543
2941
  * TOKENS:
@@ -2547,7 +2945,7 @@ body {
2547
2945
  */
2548
2946
  /**
2549
2947
  * Do not edit directly
2550
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
2948
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2551
2949
  */
2552
2950
  /**
2553
2951
  * TOKENS:
@@ -2600,7 +2998,7 @@ body {
2600
2998
 
2601
2999
  /**
2602
3000
  * Do not edit directly
2603
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3001
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2604
3002
  */
2605
3003
  /**
2606
3004
  * TOKENS:
@@ -2675,7 +3073,7 @@ body {
2675
3073
 
2676
3074
  /**
2677
3075
  * Do not edit directly
2678
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3076
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2679
3077
  */
2680
3078
  /**
2681
3079
  * TOKENS:
@@ -2781,7 +3179,7 @@ body {
2781
3179
 
2782
3180
  /**
2783
3181
  * Do not edit directly
2784
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3182
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2785
3183
  */
2786
3184
  /**
2787
3185
  * TOKENS:
@@ -2804,7 +3202,7 @@ body {
2804
3202
 
2805
3203
  /**
2806
3204
  * Do not edit directly
2807
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3205
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2808
3206
  */
2809
3207
  /**
2810
3208
  * TOKENS:
@@ -2818,7 +3216,7 @@ body {
2818
3216
 
2819
3217
  /**
2820
3218
  * Do not edit directly
2821
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3219
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2822
3220
  */
2823
3221
  /**
2824
3222
  * TOKENS:
@@ -2828,7 +3226,7 @@ body {
2828
3226
  */
2829
3227
  /**
2830
3228
  * Do not edit directly
2831
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3229
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2832
3230
  */
2833
3231
  /**
2834
3232
  * TOKENS:
@@ -2853,7 +3251,7 @@ body {
2853
3251
  }
2854
3252
  /**
2855
3253
  * Do not edit directly
2856
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3254
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
2857
3255
  */
2858
3256
  /**
2859
3257
  * TOKENS:
@@ -3253,7 +3651,7 @@ body {
3253
3651
 
3254
3652
  /**
3255
3653
  * Do not edit directly
3256
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3654
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
3257
3655
  */
3258
3656
  /**
3259
3657
  * TOKENS:
@@ -3376,7 +3774,7 @@ body {
3376
3774
 
3377
3775
  /**
3378
3776
  * Do not edit directly
3379
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
3777
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
3380
3778
  */
3381
3779
  /**
3382
3780
  * TOKENS:
@@ -3514,16 +3912,20 @@ body {
3514
3912
  }
3515
3913
  }
3516
3914
  .ilo--hero .ilo--breadcrumb {
3517
- left: 0;
3518
- max-width: 560px;
3519
- position: absolute;
3520
- top: 0;
3521
3915
  width: 100%;
3522
3916
  }
3523
3917
  .right-to-left .ilo--hero .ilo--breadcrumb {
3524
3918
  left: auto;
3525
3919
  right: 0;
3526
3920
  }
3921
+ @media screen and (min-width: 610px) {
3922
+ .ilo--hero .ilo--breadcrumb {
3923
+ left: 0;
3924
+ max-width: 560px;
3925
+ position: absolute;
3926
+ top: 0;
3927
+ }
3928
+ }
3527
3929
 
3528
3930
  .ilo--hero-card {
3529
3931
  background: rgb(255, 255, 255);
@@ -3534,30 +3936,70 @@ body {
3534
3936
  }
3535
3937
  .ilo--hero-card::before {
3536
3938
  background: inherit;
3537
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
3538
3939
  content: "";
3539
3940
  display: block;
3540
3941
  height: 40px;
3541
- left: 0;
3542
3942
  position: absolute;
3943
+ width: calc(100% - 73px);
3944
+ }
3945
+ .ilo--hero-card::after {
3946
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
3947
+ background-position: bottom right;
3948
+ background-size: cover;
3949
+ content: "";
3950
+ height: 40px;
3951
+ display: block;
3952
+ position: absolute;
3953
+ width: 73.4px;
3954
+ }
3955
+ .ilo--hero-card::before {
3956
+ left: 0;
3543
3957
  top: -39.7px;
3544
- width: 100%;
3545
3958
  }
3546
3959
  .right-to-left .ilo--hero-card::before {
3547
- clip-path: polygon(100% 0, 100% 100%, 100% 100%, 0% 100%, 10% 0%);
3548
3960
  left: auto;
3549
3961
  right: 0;
3550
3962
  }
3551
3963
  @media screen and (min-width: 1024px) {
3552
3964
  .ilo--hero-card::before {
3553
- height: 56px;
3554
- top: -55.7px;
3965
+ top: -63.7px;
3966
+ }
3967
+ }
3968
+ .ilo--hero-card::after {
3969
+ right: 0;
3970
+ top: -39.7px;
3971
+ }
3972
+ .right-to-left .ilo--hero-card::after {
3973
+ left: 0;
3974
+ right: auto;
3975
+ }
3976
+ @media screen and (min-width: 1024px) {
3977
+ .ilo--hero-card::after {
3978
+ top: -63.7px;
3555
3979
  }
3556
3980
  }
3557
3981
  @media screen and (min-width: 1024px) {
3558
3982
  .ilo--hero-card {
3559
3983
  padding: 0 70px 70px 56px;
3560
3984
  }
3985
+ .ilo--hero-card::before {
3986
+ background: inherit;
3987
+ content: "";
3988
+ display: block;
3989
+ height: 64px;
3990
+ position: absolute;
3991
+ width: calc(100% - 116px);
3992
+ }
3993
+ .ilo--hero-card::after {
3994
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
3995
+ background-position: bottom right;
3996
+ background-size: cover;
3997
+ content: "";
3998
+ height: 64px;
3999
+ display: block;
4000
+ position: absolute;
4001
+ width: 116.4px;
4002
+ }
3561
4003
  .ilo--hero-card.ilo--hero-card--graphic {
3562
4004
  padding: 0 70px 44px 56px;
3563
4005
  }
@@ -3573,6 +4015,9 @@ body {
3573
4015
  border-bottom: 3px solid rgb(250, 60, 75);
3574
4016
  color: rgb(255, 255, 255);
3575
4017
  }
4018
+ .ilo--hero-card--dark::after {
4019
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
4020
+ }
3576
4021
  .ilo--hero-card--dark .ilo--hero-card--link.icon {
3577
4022
  color: rgb(255, 255, 255);
3578
4023
  }
@@ -3613,6 +4058,15 @@ body {
3613
4058
  .ilo--hero-card--home::before {
3614
4059
  display: none;
3615
4060
  }
4061
+ .ilo--hero-card--home.ilo--hero-card--nobackground {
4062
+ background: transparent;
4063
+ }
4064
+ .ilo--hero-card--home.ilo--hero-card--nobackground > * {
4065
+ filter: drop-shadow(0px 12px 32px rgba(0, 0, 0, 0.16)) drop-shadow(0px 0.8px 1.6px rgba(0, 0, 0, 0.02)) drop-shadow(0px 2.7px 4.8px rgba(0, 0, 0, 0.04)) drop-shadow(0px 8px 16px rgba(0, 0, 0, 0.08));
4066
+ }
4067
+ .ilo--hero-card--home.ilo--hero-card--nobackground::before, .ilo--hero-card--home.ilo--hero-card--nobackground::after {
4068
+ content: "";
4069
+ }
3616
4070
  @media screen and (min-width: 1024px) {
3617
4071
  .ilo--hero-card--home {
3618
4072
  bottom: 72px;
@@ -3623,20 +4077,38 @@ body {
3623
4077
  }
3624
4078
  .ilo--hero-card--home::before {
3625
4079
  background: inherit;
3626
- clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
3627
4080
  content: "";
3628
4081
  display: block;
3629
- height: 59px;
3630
- left: 0;
4082
+ height: 48px;
3631
4083
  position: absolute;
3632
- top: -58.7px;
3633
- width: 100%;
4084
+ width: calc(100% - 87.4px);
4085
+ }
4086
+ .ilo--hero-card--home::after {
4087
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
4088
+ background-position: bottom right;
4089
+ background-size: cover;
4090
+ content: "";
4091
+ height: 48px;
4092
+ display: block;
4093
+ position: absolute;
4094
+ width: 87.8px;
4095
+ }
4096
+ .ilo--hero-card--home::before {
4097
+ left: 0;
4098
+ top: -48px;
3634
4099
  }
3635
4100
  .right-to-left .ilo--hero-card--home::before {
3636
- clip-path: polygon(100% 0, 100% 100%, 100% 100%, 0% 100%, 10% 0%);
3637
4101
  left: auto;
3638
4102
  right: 0;
3639
4103
  }
4104
+ .ilo--hero-card--home::after {
4105
+ right: 0;
4106
+ top: -48px;
4107
+ }
4108
+ .right-to-left .ilo--hero-card--home::after {
4109
+ left: 0;
4110
+ right: auto;
4111
+ }
3640
4112
  .ilo--hero-card--home.ilo--hero-card--center {
3641
4113
  left: 50%;
3642
4114
  right: auto;
@@ -3650,11 +4122,26 @@ body {
3650
4122
  left: auto;
3651
4123
  right: 0;
3652
4124
  }
4125
+ .ilo--hero-card--home.ilo--hero-card--nobackground {
4126
+ background: transparent;
4127
+ }
4128
+ .ilo--hero-card--home.ilo--hero-card--nobackground::before, .ilo--hero-card--home.ilo--hero-card--nobackground::after {
4129
+ content: "";
4130
+ }
3653
4131
  }
3654
4132
  @media screen and (min-width: 1024px) {
3655
4133
  .ilo--hero-card--home.ilo--hero-card--dark {
3656
4134
  background: rgba(35, 0, 80, 0.55);
3657
4135
  }
4136
+ .ilo--hero-card--home.ilo--hero-card--dark.ilo--hero-card--nobackground {
4137
+ background: transparent;
4138
+ }
4139
+ .ilo--hero-card--home.ilo--hero-card--dark.ilo--hero-card--nobackground::before, .ilo--hero-card--home.ilo--hero-card--dark.ilo--hero-card--nobackground::after {
4140
+ content: "";
4141
+ }
4142
+ }
4143
+ .ilo--hero-card--home.ilo--hero-card--dark::after {
4144
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgba(35, 0, 80, 0.55)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
3658
4145
  }
3659
4146
  .ilo--hero-card--portal {
3660
4147
  background: rgb(35, 0, 80);
@@ -3664,18 +4151,22 @@ body {
3664
4151
  @media screen and (min-width: 1024px) {
3665
4152
  .ilo--hero-card--portal {
3666
4153
  max-width: 625px;
3667
- padding: 0 48px 48px 72px;
4154
+ padding: 0 48px 42px 72px;
3668
4155
  width: 100%;
3669
4156
  }
3670
4157
  }
3671
4158
  .ilo--hero-card--publication {
3672
4159
  padding: 24px;
3673
4160
  }
4161
+ .ilo--hero-card--publication .ilo--hero-card--eyebrow {
4162
+ margin-bottom: 0.3215434084rem;
4163
+ }
3674
4164
  @media screen and (min-width: 1024px) {
3675
4165
  .ilo--hero-card--publication {
4166
+ margin-left: 106px;
3676
4167
  margin-top: -64px;
3677
4168
  max-width: 720px;
3678
- padding: 0 48px 48px 72px;
4169
+ padding: 0 48px 48px 48px;
3679
4170
  width: 100%;
3680
4171
  }
3681
4172
  }
@@ -3726,7 +4217,7 @@ body {
3726
4217
  }
3727
4218
  .ilo--hero-card--list--item {
3728
4219
  display: inline-block;
3729
- margin-right: 32px;
4220
+ margin-right: 24px;
3730
4221
  }
3731
4222
  .ilo--hero-card--list--item:last-of-type {
3732
4223
  margin-right: 0;
@@ -3774,7 +4265,7 @@ body {
3774
4265
 
3775
4266
  /**
3776
4267
  * Do not edit directly
3777
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4268
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
3778
4269
  */
3779
4270
  /**
3780
4271
  * TOKENS:
@@ -3830,7 +4321,7 @@ body {
3830
4321
 
3831
4322
  /**
3832
4323
  * Do not edit directly
3833
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4324
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
3834
4325
  */
3835
4326
  /**
3836
4327
  * TOKENS:
@@ -3972,7 +4463,7 @@ body {
3972
4463
 
3973
4464
  /**
3974
4465
  * Do not edit directly
3975
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4466
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
3976
4467
  */
3977
4468
  /**
3978
4469
  * TOKENS:
@@ -3982,7 +4473,7 @@ body {
3982
4473
  */
3983
4474
  /**
3984
4475
  * Do not edit directly
3985
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4476
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
3986
4477
  */
3987
4478
  /**
3988
4479
  * TOKENS:
@@ -4007,7 +4498,7 @@ body {
4007
4498
  }
4008
4499
  /**
4009
4500
  * Do not edit directly
4010
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4501
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4011
4502
  */
4012
4503
  /**
4013
4504
  * TOKENS:
@@ -4165,7 +4656,7 @@ body {
4165
4656
 
4166
4657
  /**
4167
4658
  * Do not edit directly
4168
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4659
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4169
4660
  */
4170
4661
  /**
4171
4662
  * TOKENS:
@@ -4220,12 +4711,20 @@ body {
4220
4711
  padding-left: 0;
4221
4712
  }
4222
4713
  .ilo--list__title {
4223
- font-size: 23.32px;
4714
+ font-size: 18.66px;
4224
4715
  letter-spacing: -0.035em;
4225
- line-height: 29.15px;
4716
+ line-height: 24.26px;
4717
+ margin-bottom: 1.1254019293rem;
4226
4718
  font-family: Overpass;
4227
4719
  font-weight: 700;
4228
- margin-bottom: 1.5763397642rem;
4720
+ }
4721
+ @media screen and (min-width: 610px) {
4722
+ .ilo--list__title {
4723
+ font-size: 23.32px;
4724
+ letter-spacing: -0.035em;
4725
+ line-height: 29.15px;
4726
+ margin-bottom: 1.4469453376rem;
4727
+ }
4229
4728
  }
4230
4729
  .ilo--list__item {
4231
4730
  font-size: 16px;
@@ -4246,13 +4745,13 @@ body {
4246
4745
  font-size: 18.66px;
4247
4746
  letter-spacing: normal;
4248
4747
  line-height: 27.24px;
4249
- margin-bottom: 1.0110920672rem;
4748
+ margin-bottom: 0.7967297949rem;
4250
4749
  }
4251
4750
  }
4252
4751
 
4253
4752
  /**
4254
4753
  * Do not edit directly
4255
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4754
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4256
4755
  */
4257
4756
  /**
4258
4757
  * TOKENS:
@@ -4262,7 +4761,7 @@ body {
4262
4761
  */
4263
4762
  /**
4264
4763
  * Do not edit directly
4265
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4764
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4266
4765
  */
4267
4766
  /**
4268
4767
  * TOKENS:
@@ -4272,7 +4771,7 @@ body {
4272
4771
  */
4273
4772
  /**
4274
4773
  * Do not edit directly
4275
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4774
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4276
4775
  */
4277
4776
  /**
4278
4777
  * TOKENS:
@@ -4380,7 +4879,7 @@ body {
4380
4879
 
4381
4880
  /**
4382
4881
  * Do not edit directly
4383
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4882
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4384
4883
  */
4385
4884
  /**
4386
4885
  * TOKENS:
@@ -4390,7 +4889,7 @@ body {
4390
4889
  */
4391
4890
  /**
4392
4891
  * Do not edit directly
4393
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4892
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4394
4893
  */
4395
4894
  /**
4396
4895
  * TOKENS:
@@ -4400,7 +4899,7 @@ body {
4400
4899
  */
4401
4900
  /**
4402
4901
  * Do not edit directly
4403
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4902
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4404
4903
  */
4405
4904
  /**
4406
4905
  * TOKENS:
@@ -4497,7 +4996,7 @@ body {
4497
4996
 
4498
4997
  /**
4499
4998
  * Do not edit directly
4500
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
4999
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
4501
5000
  */
4502
5001
  /**
4503
5002
  * TOKENS:
@@ -4511,7 +5010,12 @@ body {
4511
5010
  z-index: 4;
4512
5011
  }
4513
5012
  .ilo--header.ilo--mobile--open {
4514
- height: 100vh;
5013
+ height: 100%;
5014
+ left: 0;
5015
+ min-height: 100vh;
5016
+ position: fixed;
5017
+ top: 0;
5018
+ width: 100%;
4515
5019
  }
4516
5020
  @media screen and (min-width: 1024px) {
4517
5021
  .ilo--header {
@@ -4620,6 +5124,45 @@ body {
4620
5124
  .ilo--header--utility-bar--local .ilo--language-switcher {
4621
5125
  display: none;
4622
5126
  }
5127
+ .ilo--header--utility-bar--local .ilo--language-switcher--link {
5128
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(255, 255, 255)' d='m7.9 12.5-.2-.2c0-.1-.1-.2-.1-.3s0-.2.1-.3c0-.1.1-.2.2-.2L15.4 4l1 1-7 7 7 7-1 1-7.5-7.5z'/%3e%3c/svg%3e");
5129
+ font-size: 11.94px;
5130
+ letter-spacing: -0.02em;
5131
+ line-height: 16.12px;
5132
+ appearance: none;
5133
+ background-color: inherit;
5134
+ background-position: 16px 50%;
5135
+ background-repeat: no-repeat;
5136
+ background-size: 24px;
5137
+ border: none;
5138
+ color: rgb(255, 255, 255);
5139
+ cursor: pointer;
5140
+ font-family: Overpass;
5141
+ font-weight: 500;
5142
+ padding: 16px 16px 16px 36px;
5143
+ text-decoration: none;
5144
+ transition: all 150ms ease-out;
5145
+ width: 100%;
5146
+ }
5147
+ .ilo--header--utility-bar--local .ilo--language-switcher--link:focus, .ilo--header--utility-bar--local .ilo--language-switcher--link:hover {
5148
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(30, 45, 190)' d='m7.9 12.5-.2-.2c0-.1-.1-.2-.1-.3s0-.2.1-.3c0-.1.1-.2.2-.2L15.4 4l1 1-7 7 7 7-1 1-7.5-7.5z'/%3e%3c/svg%3e");
5149
+ background-color: rgb(235, 245, 253);
5150
+ color: rgb(30, 45, 190);
5151
+ }
5152
+ .right-to-left .ilo--header--utility-bar--local .ilo--language-switcher--link {
5153
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(255, 255, 255)' d='M8.63792 19.9964L7.6499 19.0082L14.6571 11.9999L7.6499 4.99159L8.63792 4.00342L16.1426 11.5023C16.2083 11.5675 16.2604 11.645 16.296 11.7304C16.3316 11.8158 16.3499 11.9074 16.3499 11.9999C16.3499 12.0924 16.3316 12.184 16.296 12.2694C16.2604 12.3548 16.2083 12.4324 16.1426 12.4975L8.63792 19.9964Z'/%3e%3c/svg%3e");
5154
+ background-position: calc(100% - 16px) 50%;
5155
+ padding: 16px 36px 16px 16px;
5156
+ }
5157
+ .right-to-left .ilo--header--utility-bar--local .ilo--language-switcher--link:focus, .right-to-left .ilo--header--utility-bar--local .ilo--language-switcher--link:hover {
5158
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(30, 45, 190)' d='M8.63792 19.9964L7.6499 19.0082L14.6571 11.9999L7.6499 4.99159L8.63792 4.00342L16.1426 11.5023C16.2083 11.5675 16.2604 11.645 16.296 11.7304C16.3316 11.8158 16.3499 11.9074 16.3499 11.9999C16.3499 12.0924 16.3316 12.184 16.296 12.2694C16.2604 12.3548 16.2083 12.4324 16.1426 12.4975L8.63792 19.9964Z'/%3e%3c/svg%3e");
5159
+ background-color: rgb(235, 245, 253);
5160
+ color: rgb(30, 45, 190);
5161
+ }
5162
+ .ilo--header--utility-bar--local .ilo--language-switcher--link--wrap {
5163
+ align-items: center;
5164
+ display: flex;
5165
+ }
4623
5166
  @media screen and (min-width: 1024px) {
4624
5167
  .ilo--header--utility-bar--local .ilo--language-switcher {
4625
5168
  display: flex;
@@ -4662,9 +5205,12 @@ body {
4662
5205
  }
4663
5206
  .ilo--header--navigation {
4664
5207
  background: rgb(255, 255, 255);
5208
+ height: 100%;
5209
+ left: 0;
5210
+ overflow-x: hidden;
5211
+ overflow-y: scroll;
4665
5212
  position: absolute;
4666
5213
  top: 0;
4667
- left: 0;
4668
5214
  transform: translateX(100%);
4669
5215
  transition: transform 225ms ease-out;
4670
5216
  width: 100%;
@@ -4680,6 +5226,7 @@ body {
4680
5226
  @media screen and (min-width: 1024px) {
4681
5227
  .ilo--header--navigation {
4682
5228
  background: rgb(35, 0, 80);
5229
+ overflow: visible;
4683
5230
  position: static;
4684
5231
  transform: none;
4685
5232
  }
@@ -4788,7 +5335,7 @@ body {
4788
5335
  background-color: rgb(255, 255, 255);
4789
5336
  background-position: calc(100% - 16px) 55%;
4790
5337
  background-repeat: no-repeat;
4791
- background-size: 16px;
5338
+ background-size: 24px;
4792
5339
  border: none;
4793
5340
  color: rgb(35, 0, 80);
4794
5341
  cursor: pointer;
@@ -4864,6 +5411,14 @@ body {
4864
5411
  display: flex;
4865
5412
  justify-content: space-between;
4866
5413
  }
5414
+ .right-to-left .ilo--nav--local {
5415
+ direction: rtl;
5416
+ }
5417
+ @media screen and (min-width: 1024px) {
5418
+ .right-to-left .ilo--nav--local {
5419
+ padding: 0 max((100% - 1260px) / 2, 20px) 0 0;
5420
+ }
5421
+ }
4867
5422
  @media screen and (min-width: 1024px) {
4868
5423
  .ilo--nav--local {
4869
5424
  padding: 0 0 0 max((100% - 1260px) / 2, 20px);
@@ -5039,7 +5594,11 @@ body {
5039
5594
  transition: opacity 150ms ease-out;
5040
5595
  z-index: -1;
5041
5596
  }
5042
- .ilo--context--open .ilo--language-switcher .ilo--context-menu {
5597
+ .ilo--context--open .ilo--language-switcher .ilo--context-menu, .ilo--language-switcher:focus-within .ilo--language-switcher .ilo--context-menu, .ilo--language-switcher .ilo--context-menu:focus-within {
5598
+ opacity: 1;
5599
+ z-index: 1;
5600
+ }
5601
+ .ilo--language-switcher .ilo--language-switcher--button:focus + .ilo--context-menu {
5043
5602
  opacity: 1;
5044
5603
  z-index: 1;
5045
5604
  }
@@ -5063,7 +5622,6 @@ body {
5063
5622
  }
5064
5623
  @media screen and (min-width: 1024px) {
5065
5624
  .ilo--subnav {
5066
- filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08));
5067
5625
  height: auto;
5068
5626
  left: 0;
5069
5627
  padding: 32px 0;
@@ -5073,6 +5631,11 @@ body {
5073
5631
  z-index: -1;
5074
5632
  }
5075
5633
  .ilo--header.ilo--subnav--open .ilo--subnav {
5634
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
5635
+ filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08));
5636
+ transform: translateY(0);
5637
+ }
5638
+ .ilo--subnav:has(.ilo--subnav--link:focus) {
5076
5639
  transform: translateY(0);
5077
5640
  }
5078
5641
  }
@@ -5228,6 +5791,9 @@ body {
5228
5791
  .ilo--header.ilo--search--open .ilo--search-box {
5229
5792
  transform: translateY(0);
5230
5793
  }
5794
+ .ilo--search-box:has(.ilo--input:focus), .ilo--search-box:has(.ilo--searchfield--button:focus) {
5795
+ transform: translateY(0);
5796
+ }
5231
5797
  }
5232
5798
  .ilo--search-box .ilo--header--inner {
5233
5799
  align-items: center;
@@ -5256,7 +5822,7 @@ body {
5256
5822
  background-color: transparent;
5257
5823
  background-position: center;
5258
5824
  background-repeat: no-repeat;
5259
- background-size: 21.5px 21.5px;
5825
+ background-size: 32px 32px;
5260
5826
  border: none;
5261
5827
  border-radius: 0;
5262
5828
  cursor: pointer;
@@ -5274,16 +5840,31 @@ body {
5274
5840
  background-color: rgb(255, 255, 255);
5275
5841
  background-position: center;
5276
5842
  background-repeat: no-repeat;
5277
- background-size: 21.5px 21.5px;
5843
+ background-size: 32px 32px;
5278
5844
  }
5279
5845
  .ilo--search--open .ilo--search--button:hover, .ilo--search--open .ilo--search--button:focus {
5280
5846
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(30, 45, 190)' d='M16.9497 15.5356L13.4142 12L16.9497 8.46451L15.5355 7.05029L12 10.5858L8.46446 7.05029L7.05025 8.46451L10.5858 12L7.05025 15.5356L8.46446 16.9498L12 13.4143L15.5355 16.9498L16.9497 15.5356Z'/%3e%3c/svg%3e");
5281
5847
  background-color: rgb(235, 245, 253);
5282
5848
  }
5283
5849
 
5850
+ .ilo--menu--open {
5851
+ height: 100%;
5852
+ padding-top: 85px;
5853
+ overflow: hidden;
5854
+ width: 100%;
5855
+ }
5856
+
5857
+ #anchor--components-navigation--navigation .docs-story > div:first-child {
5858
+ padding-top: 0;
5859
+ }
5860
+
5861
+ .sb-show-main.sb-main-padded {
5862
+ padding-top: 0;
5863
+ }
5864
+
5284
5865
  /**
5285
5866
  * Do not edit directly
5286
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
5867
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5287
5868
  */
5288
5869
  /**
5289
5870
  * TOKENS:
@@ -5293,7 +5874,7 @@ body {
5293
5874
  */
5294
5875
  /**
5295
5876
  * Do not edit directly
5296
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
5877
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5297
5878
  */
5298
5879
  /**
5299
5880
  * TOKENS:
@@ -5303,7 +5884,7 @@ body {
5303
5884
  */
5304
5885
  /**
5305
5886
  * Do not edit directly
5306
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
5887
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5307
5888
  */
5308
5889
  /**
5309
5890
  * TOKENS:
@@ -5495,7 +6076,7 @@ body {
5495
6076
 
5496
6077
  /**
5497
6078
  * Do not edit directly
5498
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6079
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5499
6080
  */
5500
6081
  /**
5501
6082
  * TOKENS:
@@ -5627,10 +6208,15 @@ body {
5627
6208
  font-weight: 400;
5628
6209
  line-height: 45px;
5629
6210
  }
6211
+ .ilo--pagination--previous-set,
6212
+ .ilo--pagination .ilo--next-set {
6213
+ display: flex;
6214
+ justify-content: flex-start;
6215
+ }
5630
6216
 
5631
6217
  /**
5632
6218
  * Do not edit directly
5633
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6219
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5634
6220
  */
5635
6221
  /**
5636
6222
  * TOKENS:
@@ -5640,7 +6226,7 @@ body {
5640
6226
  */
5641
6227
  /**
5642
6228
  * Do not edit directly
5643
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6229
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5644
6230
  */
5645
6231
  /**
5646
6232
  * TOKENS:
@@ -5665,7 +6251,7 @@ body {
5665
6251
  }
5666
6252
  /**
5667
6253
  * Do not edit directly
5668
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6254
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5669
6255
  */
5670
6256
  /**
5671
6257
  * TOKENS:
@@ -5810,7 +6396,7 @@ body {
5810
6396
 
5811
6397
  /**
5812
6398
  * Do not edit directly
5813
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6399
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5814
6400
  */
5815
6401
  /**
5816
6402
  * TOKENS:
@@ -5917,7 +6503,7 @@ body {
5917
6503
 
5918
6504
  /**
5919
6505
  * Do not edit directly
5920
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6506
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5921
6507
  */
5922
6508
  /**
5923
6509
  * TOKENS:
@@ -5927,7 +6513,7 @@ body {
5927
6513
  */
5928
6514
  /**
5929
6515
  * Do not edit directly
5930
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6516
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5931
6517
  */
5932
6518
  /**
5933
6519
  * TOKENS:
@@ -5952,7 +6538,7 @@ body {
5952
6538
  }
5953
6539
  /**
5954
6540
  * Do not edit directly
5955
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6541
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
5956
6542
  */
5957
6543
  /**
5958
6544
  * TOKENS:
@@ -6013,7 +6599,7 @@ body {
6013
6599
 
6014
6600
  /**
6015
6601
  * Do not edit directly
6016
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
6602
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
6017
6603
  */
6018
6604
  /**
6019
6605
  * TOKENS:
@@ -6428,7 +7014,7 @@ body {
6428
7014
 
6429
7015
  /**
6430
7016
  * Do not edit directly
6431
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
7017
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
6432
7018
  */
6433
7019
  /**
6434
7020
  * TOKENS:
@@ -6479,7 +7065,7 @@ body {
6479
7065
 
6480
7066
  /**
6481
7067
  * Do not edit directly
6482
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
7068
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
6483
7069
  */
6484
7070
  /**
6485
7071
  * TOKENS:
@@ -6636,7 +7222,7 @@ body {
6636
7222
 
6637
7223
  /**
6638
7224
  * Do not edit directly
6639
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
7225
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
6640
7226
  */
6641
7227
  /**
6642
7228
  * TOKENS:
@@ -6987,7 +7573,7 @@ body {
6987
7573
 
6988
7574
  /**
6989
7575
  * Do not edit directly
6990
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
7576
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
6991
7577
  */
6992
7578
  /**
6993
7579
  * TOKENS:
@@ -7173,7 +7759,7 @@ body {
7173
7759
 
7174
7760
  /**
7175
7761
  * Do not edit directly
7176
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
7762
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
7177
7763
  */
7178
7764
  /**
7179
7765
  * TOKENS:
@@ -7231,7 +7817,7 @@ body {
7231
7817
 
7232
7818
  /**
7233
7819
  * Do not edit directly
7234
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
7820
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
7235
7821
  */
7236
7822
  /**
7237
7823
  * TOKENS:
@@ -7405,7 +7991,7 @@ body {
7405
7991
 
7406
7992
  /**
7407
7993
  * Do not edit directly
7408
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
7994
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
7409
7995
  */
7410
7996
  /**
7411
7997
  * TOKENS:
@@ -7426,12 +8012,17 @@ body {
7426
8012
  opacity: 0;
7427
8013
  padding: 0.4287245445rem 0.6430868167rem;
7428
8014
  position: absolute;
7429
- transition: opacity 150ms ease-out;
7430
8015
  visibility: hidden;
7431
8016
  width: auto;
8017
+ transition-property: opacity;
8018
+ transition-duration: 150ms;
8019
+ transition-timing-function: ease-out;
7432
8020
  }
7433
8021
  .ilo--tooltip--fade {
7434
8022
  opacity: 1;
8023
+ transition-property: opacity;
8024
+ transition-duration: 150ms;
8025
+ transition-timing-function: ease-out;
7435
8026
  }
7436
8027
  .ilo--tooltip--visible {
7437
8028
  visibility: visible;
@@ -7564,9 +8155,13 @@ body {
7564
8155
  border-right-color: rgb(45, 45, 45);
7565
8156
  }
7566
8157
 
8158
+ .docs-story div[height] {
8159
+ min-height: 150px;
8160
+ }
8161
+
7567
8162
  /**
7568
8163
  * Do not edit directly
7569
- * Generated on Thu, 24 Nov 2022 13:10:27 GMT
8164
+ * Generated on Wed, 30 Nov 2022 00:59:20 GMT
7570
8165
  */
7571
8166
  /**
7572
8167
  * TOKENS:
@@ -8436,7 +9031,8 @@ body {
8436
9031
  }
8437
9032
  .ilo--video:hover .ilo--video--controls,
8438
9033
  .ilo--video:hover .vjs-control-bar, .ilo--video:focus .ilo--video--controls,
8439
- .ilo--video:focus .vjs-control-bar {
9034
+ .ilo--video:focus .vjs-control-bar, .ilo--video:focus-within .ilo--video--controls,
9035
+ .ilo--video:focus-within .vjs-control-bar {
8440
9036
  opacity: 1;
8441
9037
  transition: opacity 150ms ease-out;
8442
9038
  }