@ilo-org/styles 0.0.3 → 0.1.1

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 Tue, 25 Oct 2022 15:49:45 GMT
154
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
155
155
  */
156
156
  /**
157
157
  * TOKENS:
@@ -250,7 +250,7 @@ body {
250
250
 
251
251
  /**
252
252
  * Do not edit directly
253
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
253
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
254
254
  */
255
255
  /**
256
256
  * TOKENS:
@@ -277,7 +277,7 @@ body {
277
277
  line-height: 21.6px;
278
278
  justify-content: space-between;
279
279
  margin: 0;
280
- padding: 1.0718113612rem 1.9292604502rem 1.0718113612rem 0;
280
+ padding: 0.8038585209rem 1.9292604502rem 0.8038585209rem 0;
281
281
  text-align: left;
282
282
  transition: border 0.15s ease-out, background 0.15s ease-out, color 0.15s ease-out;
283
283
  width: 100%;
@@ -350,7 +350,7 @@ body {
350
350
 
351
351
  /**
352
352
  * Do not edit directly
353
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
353
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
354
354
  */
355
355
  /**
356
356
  * TOKENS:
@@ -567,7 +567,42 @@ body {
567
567
 
568
568
  /**
569
569
  * Do not edit directly
570
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
570
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
571
+ */
572
+ /**
573
+ * TOKENS:
574
+ */
575
+ /**
576
+ * MAPS:
577
+ */
578
+ /**
579
+ * Do not edit directly
580
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
581
+ */
582
+ /**
583
+ * TOKENS:
584
+ */
585
+ /**
586
+ * MAPS:
587
+ */
588
+ @keyframes emptygradient {
589
+ 0% {
590
+ opacity: 1;
591
+ }
592
+ 100% {
593
+ opacity: 0;
594
+ }
595
+ }
596
+ @keyframes spin {
597
+ 100% {
598
+ -moz-transform: rotate(360deg);
599
+ -webkit-transform: rotate(360deg);
600
+ transform: rotate(360deg);
601
+ }
602
+ }
603
+ /**
604
+ * Do not edit directly
605
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
571
606
  */
572
607
  /**
573
608
  * TOKENS:
@@ -685,8 +720,8 @@ body {
685
720
  .ilo--button--small .link__label,
686
721
  .ilo--button--small .button__label {
687
722
  padding-bottom: 3px;
688
- padding-left: 16px;
689
- padding-right: 16px;
723
+ padding-left: 13px;
724
+ padding-right: 13px;
690
725
  padding-top: 3px;
691
726
  font-size: 14.93px;
692
727
  letter-spacing: -0.02em;
@@ -732,6 +767,9 @@ body {
732
767
  box-shadow: 4px 4px 0 1px rgb(255, 205, 45) inset, -4px -4px 0 1px rgb(255, 205, 45) inset;
733
768
  color: rgb(35, 0, 80);
734
769
  outline: none;
770
+ transition-property: color, background-color, border-color;
771
+ transition-duration: 150ms;
772
+ transition-timing-function: ease-out;
735
773
  }
736
774
  .ilo--button:focus.ilo--button--small {
737
775
  box-shadow: 3px 3px 0 1px rgb(255, 205, 45) inset, -3px -3px 0 1px rgb(255, 205, 45) inset;
@@ -742,6 +780,9 @@ body {
742
780
  box-shadow: none;
743
781
  color: rgb(30, 45, 190);
744
782
  cursor: pointer;
783
+ transition-property: color, background-color, border-color;
784
+ transition-duration: 150ms;
785
+ transition-timing-function: ease-out;
745
786
  }
746
787
  .ilo--button:hover.ilo--button--small {
747
788
  box-shadow: none;
@@ -751,6 +792,9 @@ body {
751
792
  border: 2px rgb(30, 45, 190) solid;
752
793
  box-shadow: none;
753
794
  color: rgb(235, 245, 253);
795
+ transition-property: color, background-color, border-color;
796
+ transition-duration: 150ms;
797
+ transition-timing-function: ease-out;
754
798
  }
755
799
  .ilo--button:active.ilo--button--small {
756
800
  box-shadow: none;
@@ -763,16 +807,25 @@ body {
763
807
  background-color: rgb(255, 255, 255);
764
808
  border: 1.5px rgb(184, 196, 204) solid;
765
809
  color: rgb(35, 0, 80);
810
+ transition-property: color, background-color, border-color;
811
+ transition-duration: 150ms;
812
+ transition-timing-function: ease-out;
766
813
  }
767
814
  .ilo--button--secondary:hover {
768
815
  background-color: rgb(235, 245, 253);
769
816
  border: 1.5px rgb(30, 45, 190) solid;
817
+ transition-property: color, background-color, border-color;
818
+ transition-duration: 150ms;
819
+ transition-timing-function: ease-out;
770
820
  }
771
821
  .ilo--button--secondary:active {
772
822
  background-color: rgb(30, 45, 190);
773
823
  border: 2px rgb(30, 45, 190) solid;
774
824
  box-shadow: none;
775
825
  color: rgb(235, 245, 253);
826
+ transition-property: color, background-color, border-color;
827
+ transition-duration: 150ms;
828
+ transition-timing-function: ease-out;
776
829
  }
777
830
  .ilo--button--secondary:active.ilo--button--small {
778
831
  box-shadow: none;
@@ -781,28 +834,43 @@ body {
781
834
  background-color: rgb(237, 240, 242);
782
835
  border: 2px rgb(237, 240, 242) solid;
783
836
  color: rgb(35, 0, 80);
837
+ transition-property: color, background-color, border-color;
838
+ transition-duration: 150ms;
839
+ transition-timing-function: ease-out;
784
840
  }
785
841
  .ilo--button--alert {
786
842
  background-color: rgb(200, 48, 60);
787
843
  border: 1.5px rgb(200, 48, 60) solid;
788
844
  color: rgb(255, 255, 255);
845
+ transition-property: color, background-color, border-color;
846
+ transition-duration: 150ms;
847
+ transition-timing-function: ease-out;
789
848
  }
790
849
  .ilo--button--alert:hover {
791
850
  background-color: rgb(235, 245, 253);
792
851
  border: 1.5px rgb(30, 45, 190) solid;
793
852
  color: rgb(30, 45, 190);
853
+ transition-property: color, background-color, border-color;
854
+ transition-duration: 150ms;
855
+ transition-timing-function: ease-out;
794
856
  }
795
857
  .ilo--button--alert:focus {
796
858
  background-color: rgb(255, 255, 255);
797
859
  border: 2px rgb(255, 205, 45) solid;
798
860
  color: rgb(35, 0, 80);
799
861
  outline: none;
862
+ transition-property: color, background-color, border-color;
863
+ transition-duration: 150ms;
864
+ transition-timing-function: ease-out;
800
865
  }
801
866
  .ilo--button--alert:active {
802
867
  background-color: rgb(30, 45, 190);
803
868
  border: 2px rgb(30, 45, 190) solid;
804
869
  box-shadow: none;
805
870
  color: rgb(235, 245, 253);
871
+ transition-property: color, background-color, border-color;
872
+ transition-duration: 150ms;
873
+ transition-timing-function: ease-out;
806
874
  }
807
875
  .ilo--button--alert:active.ilo--button--small {
808
876
  box-shadow: none;
@@ -824,7 +892,7 @@ body {
824
892
 
825
893
  /**
826
894
  * Do not edit directly
827
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
895
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
828
896
  */
829
897
  /**
830
898
  * TOKENS:
@@ -954,7 +1022,7 @@ body {
954
1022
 
955
1023
  /**
956
1024
  * Do not edit directly
957
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
1025
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
958
1026
  */
959
1027
  /**
960
1028
  * TOKENS:
@@ -965,12 +1033,15 @@ body {
965
1033
  .ilo--card {
966
1034
  margin: 0;
967
1035
  }
1036
+ .right-to-left .ilo--card {
1037
+ text-align: right;
1038
+ }
968
1039
  .ilo--card--action:hover, .ilo--card--action:focus {
969
1040
  background: rgb(255, 255, 255);
970
1041
  color: rgb(30, 45, 190);
971
1042
  text-decoration: none;
972
1043
  }
973
- .ilo--card--action:hover .ilo--card--dark, .ilo--card--action:focus .ilo--card--dark {
1044
+ .ilo--card--action:hover .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink), .ilo--card--action:focus .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink) {
974
1045
  background: rgb(255, 255, 255);
975
1046
  }
976
1047
  .ilo--card--action:hover .ilo--card--eyebrow, .ilo--card--action:focus .ilo--card--eyebrow {
@@ -999,63 +1070,76 @@ body {
999
1070
  width: 100%;
1000
1071
  z-index: 2;
1001
1072
  }
1073
+ .ilo--card--link--text {
1074
+ width: 1px;
1075
+ height: 1px;
1076
+ margin: -1px;
1077
+ padding: 0;
1078
+ border: 0;
1079
+ position: absolute;
1080
+ clip: rect(0 0 0 0);
1081
+ overflow: hidden;
1082
+ }
1002
1083
  .ilo--card--light {
1003
1084
  background: rgb(255, 255, 255);
1004
1085
  }
1005
- .ilo--card--dark {
1086
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink) {
1006
1087
  background: rgb(35, 0, 80);
1007
1088
  }
1008
- .ilo--card--dark .ilo--card--eyebrow {
1089
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink) .ilo--card--eyebrow {
1009
1090
  color: rgb(237, 240, 242);
1010
1091
  }
1011
- .ilo--card--dark .ilo--card--title {
1092
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink) .ilo--card--title {
1012
1093
  color: rgb(255, 255, 255);
1013
1094
  }
1014
- .ilo--card--dark .ilo--card--intro {
1095
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink) .ilo--card--intro {
1015
1096
  color: rgb(237, 240, 242);
1016
1097
  }
1017
- .ilo--card--dark .ilo--card--date {
1098
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink) .ilo--card--date {
1018
1099
  color: rgb(237, 240, 242);
1019
1100
  }
1020
- .ilo--card--dark .ilo--card--eventdate {
1101
+ .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink) .ilo--card--eventdate {
1021
1102
  color: rgb(237, 240, 242);
1022
1103
  }
1023
- .ilo--card--cornercut {
1024
- margin-top: 40px;
1025
- padding-top: 0 !important;
1104
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature) {
1105
+ margin-top: 2.1436227224rem;
1106
+ padding-top: 0;
1026
1107
  position: relative;
1027
1108
  }
1028
1109
  @media screen and (min-width: 610px) {
1029
- .ilo--card--cornercut {
1030
- margin-top: 48px;
1110
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature) {
1111
+ margin-top: 2.5723472669rem;
1031
1112
  }
1032
1113
  }
1033
1114
  @media screen and (min-width: 1024px) {
1034
- .ilo--card--cornercut {
1035
- margin-top: 64px;
1115
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature) {
1116
+ margin-top: 3.4297963558rem;
1036
1117
  }
1037
1118
  }
1038
- .ilo--card--cornercut::before {
1119
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1039
1120
  background: inherit;
1040
1121
  clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1041
1122
  content: "";
1042
1123
  display: block;
1043
- height: 40px;
1124
+ height: 2.1436227224rem;
1044
1125
  left: 0;
1045
1126
  position: absolute;
1046
- top: -39.7px;
1127
+ top: -2.127545552rem;
1047
1128
  width: 100%;
1048
1129
  }
1130
+ .right-to-left .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1131
+ clip-path: polygon(100% 0, 100% 100%, 100% 100%, 0% 100%, 10% 0%);
1132
+ }
1049
1133
  @media screen and (min-width: 610px) {
1050
- .ilo--card--cornercut::before {
1051
- height: 48px;
1052
- top: -47.7px;
1134
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1135
+ height: 2.5723472669rem;
1136
+ top: -2.5562700965rem;
1053
1137
  }
1054
1138
  }
1055
1139
  @media screen and (min-width: 1024px) {
1056
- .ilo--card--cornercut::before {
1057
- height: 64px;
1058
- top: -63.7px;
1140
+ .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1141
+ height: 3.4297963558rem;
1142
+ top: -3.4137191854rem;
1059
1143
  }
1060
1144
  }
1061
1145
  .ilo--card--eyebrow {
@@ -1115,25 +1199,116 @@ body {
1115
1199
  z-index: 2;
1116
1200
  }
1117
1201
  .ilo--card--multilink {
1118
- padding: 24px;
1202
+ padding: 1.2861736334rem;
1203
+ }
1204
+ .ilo--card--multilink .ilo--card--image--wrapper {
1205
+ display: none;
1206
+ }
1207
+ .ilo--card--multilink .ilo--card--content .ilo--card--image--wrapper {
1208
+ display: block;
1119
1209
  }
1120
1210
  @media screen and (min-width: 610px) {
1121
1211
  .ilo--card--multilink {
1122
- padding: 40px;
1212
+ padding: 2.1436227224rem;
1123
1213
  }
1124
1214
  }
1125
1215
  @media screen and (min-width: 1024px) {
1126
1216
  .ilo--card--multilink {
1127
- padding: 56px 48px;
1217
+ padding: 3.0010718114rem 2.5723472669rem;
1128
1218
  }
1129
1219
  }
1130
- .ilo--card--detail {
1131
- border-bottom: 3px solid rgb(109, 109, 109);
1132
- margin: 32px 0;
1220
+ .ilo--card--multilink .ilo--card--title {
1221
+ color: rgb(45, 45, 45);
1222
+ margin-bottom: 0.7188906752rem;
1223
+ }
1224
+ .ilo--card--multilink .ilo--card--intro {
1225
+ color: rgb(45, 45, 45);
1226
+ }
1227
+ .ilo--card--multilink.ilo--card--dark {
1228
+ background: rgb(255, 255, 255);
1229
+ }
1230
+ .ilo--card--multilink.ilo--card--dark .ilo--card--title {
1231
+ color: rgb(45, 45, 45);
1232
+ }
1233
+ .ilo--card--multilink.ilo--card--dark .ilo--card--intro {
1234
+ color: rgb(45, 45, 45);
1235
+ }
1236
+ .ilo--card--multilink.ilo--card--wide {
1237
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1238
+ }
1239
+ @media screen and (min-width: 610px) {
1240
+ .ilo--card--multilink.ilo--card--wide {
1241
+ padding: 3.0010718114rem 2.5723472669rem;
1242
+ }
1243
+ .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1244
+ flex-direction: row-reverse;
1245
+ }
1246
+ .right-to-left .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1247
+ flex-direction: row;
1248
+ }
1249
+ .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1250
+ display: flex;
1251
+ column-gap: 1.7148981779rem;
1252
+ }
1253
+ .right-to-left .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1254
+ flex-direction: row-reverse;
1255
+ }
1256
+ .ilo--card--multilink.ilo--card--wide .ilo--card--image--wrapper {
1257
+ display: block;
1258
+ width: 50%;
1259
+ }
1260
+ .ilo--card--multilink.ilo--card--wide .ilo--card--content {
1261
+ width: 50%;
1262
+ }
1263
+ .ilo--card--multilink.ilo--card--wide .ilo--card--content .ilo--card--image--wrapper {
1264
+ display: none;
1265
+ }
1266
+ }
1267
+ .ilo--card--multilink.ilo--card--standard {
1268
+ padding: 2.5723472669rem 2.1436227224rem;
1269
+ }
1270
+ @media screen and (min-width: 610px) {
1271
+ .ilo--card--multilink.ilo--card--standard {
1272
+ padding: 2.5723472669rem 2.1436227224rem;
1273
+ }
1274
+ }
1275
+ @media screen and (min-width: 1024px) {
1276
+ .ilo--card--multilink.ilo--card--standard {
1277
+ padding: 2.5723472669rem 2.1436227224rem;
1278
+ }
1133
1279
  }
1134
- .ilo--card--detail::before {
1280
+ .ilo--card--multilink.ilo--card--narrow {
1281
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1282
+ }
1283
+ .ilo--card--multilink.ilo--card--narrow .ilo--card--image--wrapper {
1135
1284
  display: none;
1136
1285
  }
1286
+ .ilo--card--multilink.ilo--card--narrow .ilo--card--content .ilo--card--image--wrapper {
1287
+ display: block;
1288
+ margin-bottom: 1.2861736334rem;
1289
+ }
1290
+ @media screen and (min-width: 610px) {
1291
+ .ilo--card--multilink.ilo--card--narrow {
1292
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1293
+ }
1294
+ }
1295
+ @media screen and (min-width: 1024px) {
1296
+ .ilo--card--multilink.ilo--card--narrow {
1297
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1298
+ }
1299
+ }
1300
+ .ilo--card--multilink .ilo--link-list {
1301
+ margin-top: 1.8756698821rem;
1302
+ }
1303
+ .ilo--card--detail {
1304
+ border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1305
+ padding: 1.2861736334rem 0;
1306
+ }
1307
+ @media screen and (min-width: 1024px) {
1308
+ .ilo--card--detail {
1309
+ padding: 1.7148981779rem 0;
1310
+ }
1311
+ }
1137
1312
  .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before {
1138
1313
  opacity: 0.4;
1139
1314
  z-index: 2;
@@ -1161,31 +1336,29 @@ body {
1161
1336
  .ilo--card--detail .ilo--card--wrap {
1162
1337
  display: flex;
1163
1338
  }
1339
+ .right-to-left .ilo--card--detail .ilo--card--wrap {
1340
+ flex-direction: row-reverse;
1341
+ }
1164
1342
  .ilo--card--detail .ilo--card--image {
1165
1343
  object-fit: contain;
1166
- width: 77px;
1344
+ width: 4.1264737406rem;
1167
1345
  }
1168
1346
  @media screen and (min-width: 1024px) {
1169
1347
  .ilo--card--detail .ilo--card--image {
1170
- width: 200px;
1348
+ width: 10.718113612rem;
1171
1349
  }
1172
1350
  }
1173
1351
  .ilo--card--detail .ilo--card--image--wrapper {
1174
- max-width: 77px;
1352
+ max-width: 4.1264737406rem;
1175
1353
  width: 100%;
1176
1354
  }
1177
1355
  @media screen and (min-width: 1024px) {
1178
1356
  .ilo--card--detail .ilo--card--image--wrapper {
1179
- max-width: 200px;
1357
+ max-width: 10.718113612rem;
1180
1358
  }
1181
1359
  }
1182
1360
  .ilo--card--detail .ilo--card--content {
1183
- padding: 16px 24px 40px;
1184
- }
1185
- @media screen and (min-width: 1024px) {
1186
- .ilo--card--detail .ilo--card--content {
1187
- padding: 24px 24px 64px;
1188
- }
1361
+ padding: 0 1.2861736334rem;
1189
1362
  }
1190
1363
  .ilo--card--detail .ilo--card--title {
1191
1364
  font-size: 18.66px;
@@ -1204,7 +1377,7 @@ body {
1204
1377
  letter-spacing: normal;
1205
1378
  line-height: 23.36px;
1206
1379
  margin-bottom: 0;
1207
- padding-left: 24px;
1380
+ padding-left: 1.2861736334rem;
1208
1381
  position: relative;
1209
1382
  }
1210
1383
  .ilo--card--detail .ilo--card--event-date::before {
@@ -1225,9 +1398,9 @@ body {
1225
1398
  line-height: 23.36px;
1226
1399
  }
1227
1400
  .ilo--card--graphic {
1228
- border-bottom: 3px solid rgb(184, 196, 204);
1229
- margin-top: 40px;
1230
- padding: 0 24px 40px;
1401
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1402
+ margin-top: 2.1436227224rem;
1403
+ padding: 0 1.2861736334rem 2.1436227224rem;
1231
1404
  position: relative;
1232
1405
  }
1233
1406
  .ilo--card--graphic::before {
@@ -1243,11 +1416,41 @@ body {
1243
1416
  }
1244
1417
  @media screen and (min-width: 610px) {
1245
1418
  .ilo--card--graphic {
1246
- padding: 0 32px 40px;
1419
+ padding: 0 1.7148981779rem 2.1436227224rem;
1420
+ }
1421
+ }
1422
+ .ilo--card--graphic.ilo--card--wide {
1423
+ padding: 0 1.7148981779rem 2.1436227224rem;
1424
+ }
1425
+ @media screen and (min-width: 610px) {
1426
+ .ilo--card--graphic.ilo--card--wide {
1427
+ padding: 0 1.7148981779rem 2.1436227224rem;
1428
+ }
1429
+ }
1430
+ .ilo--card--graphic.ilo--card--standard {
1431
+ padding: 0 1.7148981779rem 2.1436227224rem;
1432
+ }
1433
+ @media screen and (min-width: 610px) {
1434
+ .ilo--card--graphic.ilo--card--standard {
1435
+ padding: 0 1.7148981779rem 2.1436227224rem;
1436
+ }
1437
+ }
1438
+ .ilo--card--graphic.ilo--card--narrow {
1439
+ padding: 0 1.2861736334rem 2.1436227224rem;
1440
+ }
1441
+ @media screen and (min-width: 610px) {
1442
+ .ilo--card--graphic.ilo--card--narrow {
1443
+ padding: 0 1.2861736334rem 2.1436227224rem;
1247
1444
  }
1248
1445
  }
1446
+ .ilo--card--graphic.ilo--card--narrow .ilo--card--title {
1447
+ font-size: 18.66px;
1448
+ letter-spacing: -0.035em;
1449
+ line-height: 24.26px;
1450
+ margin-bottom: 1.674953518rem;
1451
+ }
1249
1452
  .ilo--card--graphic.ilo--card--dark {
1250
- border-bottom: 3px solid rgb(150, 10, 85);
1453
+ border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1251
1454
  }
1252
1455
  .ilo--card--graphic .ilo--card--eyebrow {
1253
1456
  margin-bottom: 1.0110920672rem;
@@ -1270,20 +1473,71 @@ body {
1270
1473
  margin-bottom: 1.4398166117rem;
1271
1474
  }
1272
1475
  .ilo--card--graphicpromo {
1273
- max-width: 920px;
1274
- padding: 40px 24px;
1476
+ max-width: 49.3033226152rem;
1477
+ padding: 2.1436227224rem 1.2861736334rem;
1275
1478
  width: 100%;
1276
1479
  }
1277
1480
  @media screen and (min-width: 610px) {
1278
1481
  .ilo--card--graphicpromo {
1279
- padding: 48px;
1482
+ padding: 2.5723472669rem;
1280
1483
  }
1281
1484
  }
1282
1485
  @media screen and (min-width: 1024px) {
1283
1486
  .ilo--card--graphicpromo {
1284
- padding: 64px 72px;
1487
+ padding: 3.4297963558rem 3.8585209003rem;
1488
+ }
1489
+ }
1490
+ .ilo--card--graphicpromo.ilo--card--wide {
1491
+ padding: 3.4297963558rem 3.8585209003rem;
1492
+ }
1493
+ @media screen and (min-width: 610px) {
1494
+ .ilo--card--graphicpromo.ilo--card--wide {
1495
+ padding: 3.4297963558rem 3.8585209003rem;
1496
+ }
1497
+ }
1498
+ @media screen and (min-width: 1024px) {
1499
+ .ilo--card--graphicpromo.ilo--card--wide {
1500
+ padding: 3.4297963558rem 3.8585209003rem;
1501
+ }
1502
+ }
1503
+ .ilo--card--graphicpromo.ilo--card--standard {
1504
+ padding: 2.5723472669rem;
1505
+ }
1506
+ @media screen and (min-width: 610px) {
1507
+ .ilo--card--graphicpromo.ilo--card--standard {
1508
+ padding: 2.5723472669rem;
1509
+ }
1510
+ }
1511
+ @media screen and (min-width: 1024px) {
1512
+ .ilo--card--graphicpromo.ilo--card--standard {
1513
+ padding: 2.5723472669rem;
1514
+ }
1515
+ }
1516
+ .ilo--card--graphicpromo.ilo--card--narrow {
1517
+ padding: 2.1436227224rem 1.2861736334rem;
1518
+ }
1519
+ @media screen and (min-width: 610px) {
1520
+ .ilo--card--graphicpromo.ilo--card--narrow {
1521
+ padding: 2.1436227224rem 1.2861736334rem;
1522
+ }
1523
+ }
1524
+ @media screen and (min-width: 1024px) {
1525
+ .ilo--card--graphicpromo.ilo--card--narrow {
1526
+ padding: 2.1436227224rem 1.2861736334rem;
1285
1527
  }
1286
1528
  }
1529
+ .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1530
+ font-size: 29.16px;
1531
+ letter-spacing: -0.035em;
1532
+ line-height: 36.45px;
1533
+ margin-bottom: 0.5741425509rem;
1534
+ }
1535
+ .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--intro {
1536
+ font-size: 16px;
1537
+ letter-spacing: normal;
1538
+ line-height: 23.36px;
1539
+ margin-bottom: 1.910132288rem;
1540
+ }
1287
1541
  .ilo--card--graphicpromo.ilo--card--light:not(:hover) .ilo--card--title {
1288
1542
  color: rgb(45, 45, 45);
1289
1543
  }
@@ -1316,24 +1570,58 @@ body {
1316
1570
  }
1317
1571
  }
1318
1572
  .ilo--card--factlist {
1319
- padding: 0 24px 48px 24px;
1320
- max-width: 856px;
1573
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1574
+ max-width: 45.8735262594rem;
1575
+ padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1321
1576
  }
1322
1577
  .ilo--card--factlist::before {
1323
1578
  clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1324
- height: 40px;
1325
- top: -39.7px;
1579
+ height: 2.1436227224rem;
1580
+ top: -2.127545552rem;
1326
1581
  }
1327
1582
  @media screen and (min-width: 1024px) {
1328
1583
  .ilo--card--factlist {
1329
- padding: 0 40px 56px 40px;
1584
+ padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1330
1585
  }
1331
1586
  .ilo--card--factlist::before {
1332
1587
  clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1333
- height: 48px;
1334
- top: -47.7px;
1588
+ height: 2.5723472669rem;
1589
+ top: -2.5562700965rem;
1590
+ }
1591
+ }
1592
+ .ilo--card--factlist.ilo--card--wide {
1593
+ padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1594
+ }
1595
+ @media screen and (min-width: 610px) {
1596
+ .ilo--card--factlist.ilo--card--wide {
1597
+ padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1598
+ }
1599
+ }
1600
+ .ilo--card--factlist.ilo--card--standard {
1601
+ padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1602
+ }
1603
+ @media screen and (min-width: 610px) {
1604
+ .ilo--card--factlist.ilo--card--standard {
1605
+ padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1335
1606
  }
1336
1607
  }
1608
+ .ilo--card--factlist.ilo--card--narrow {
1609
+ padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1610
+ }
1611
+ @media screen and (min-width: 610px) {
1612
+ .ilo--card--factlist.ilo--card--narrow {
1613
+ padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1614
+ }
1615
+ }
1616
+ .ilo--card--factlist.ilo--card--dark {
1617
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1618
+ }
1619
+ .ilo--card--factlist.ilo--card--dark .ilo--card--title {
1620
+ color: rgb(255, 255, 255);
1621
+ }
1622
+ .ilo--card--factlist.ilo--card--dark .ilo--list__item {
1623
+ color: rgb(255, 255, 255);
1624
+ }
1337
1625
  .ilo--card--factlist .ilo--card--title {
1338
1626
  color: rgb(45, 45, 45);
1339
1627
  font-size: 23.32px;
@@ -1350,14 +1638,14 @@ body {
1350
1638
  }
1351
1639
  }
1352
1640
  .ilo--card--stat {
1353
- border-bottom: 3px solid rgb(150, 10, 85);
1354
- padding: 0 24px 24px 30px;
1641
+ border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1642
+ padding: 0 1.2861736334rem 1.2861736334rem 1.6077170418rem;
1355
1643
  width: 100%;
1356
1644
  }
1357
1645
  .ilo--card--stat::before {
1358
1646
  clip-path: polygon(75% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1359
- height: 40px;
1360
- top: -39.7px;
1647
+ height: 2.1436227224rem;
1648
+ top: -2.127545552rem;
1361
1649
  }
1362
1650
  .ilo--card--stat.ilo--card--blue {
1363
1651
  background: rgb(235, 245, 253);
@@ -1376,6 +1664,9 @@ body {
1376
1664
  flex-wrap: wrap;
1377
1665
  height: 100%;
1378
1666
  }
1667
+ .right-to-left .ilo--card--stat .ilo--card--content {
1668
+ flex-direction: row-reverse;
1669
+ }
1379
1670
  .ilo--card--stat .ilo--card--title {
1380
1671
  color: rgb(35, 0, 80);
1381
1672
  font-size: 36.45px;
@@ -1400,24 +1691,24 @@ body {
1400
1691
  }
1401
1692
  .ilo--card--data {
1402
1693
  background: rgb(235, 245, 253);
1403
- border-bottom: 3px solid #82afdc;
1404
- max-width: 600px;
1405
- padding: 0 24px 56px;
1694
+ border-bottom: 0.1607717042rem solid #82afdc;
1695
+ max-width: 32.154340836rem;
1696
+ padding: 0 1.2861736334rem 3.0010718114rem;
1406
1697
  }
1407
1698
  .ilo--card--data::before {
1408
1699
  clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1409
- height: 40px;
1410
- top: -39.7px;
1700
+ height: 2.1436227224rem;
1701
+ top: -2.127545552rem;
1411
1702
  }
1412
1703
  @media screen and (min-width: 1024px) {
1413
1704
  .ilo--card--data::before {
1414
1705
  clip-path: polygon(90% 0, 100% 100%, 100% 100%, 0% 100%, 0% 0%);
1415
- height: 48px;
1416
- top: -47.7px;
1706
+ height: 2.5723472669rem;
1707
+ top: -2.5562700965rem;
1417
1708
  }
1418
1709
  }
1419
1710
  .ilo--card--data .ilo--card--image--wrapper {
1420
- width: max(205px, 50%);
1711
+ width: max(10.9860664523rem, 50%);
1421
1712
  }
1422
1713
  .ilo--card--data--content-label {
1423
1714
  font-size: 14.93px;
@@ -1436,7 +1727,7 @@ body {
1436
1727
  font-weight: 500;
1437
1728
  }
1438
1729
  .ilo--card--data--content-files {
1439
- margin-bottom: 40px;
1730
+ margin-bottom: 2.1436227224rem;
1440
1731
  }
1441
1732
  .ilo--card--data .ilo--link {
1442
1733
  font-size: 18.66px;
@@ -1444,23 +1735,73 @@ body {
1444
1735
  line-height: 24.26px;
1445
1736
  }
1446
1737
  .ilo--card--data--file {
1447
- margin: 4px 8px 4px 0;
1738
+ margin: 0.2143622722rem 0.4287245445rem 0.2143622722rem 0;
1448
1739
  }
1449
1740
  .ilo--card--data--file:last-of-type {
1450
1741
  margin-right: 0;
1451
1742
  }
1452
1743
  .ilo--card--feature {
1744
+ border-bottom: 0.1607717042rem solid rgb(109, 109, 109);
1745
+ display: flex;
1453
1746
  margin-top: 0;
1747
+ position: relative;
1454
1748
  }
1455
1749
  .ilo--card--feature::before {
1456
1750
  display: none;
1457
1751
  }
1752
+ .ilo--card--feature.ilo--card--dark {
1753
+ border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1754
+ }
1458
1755
  .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before {
1459
1756
  opacity: 0.4;
1460
1757
  z-index: 1;
1461
1758
  }
1759
+ .ilo--card--feature.ilo--card--narrow .ilo--card--wrap, .ilo--card--feature.ilo--card--standard .ilo--card--wrap {
1760
+ display: flex;
1761
+ flex-wrap: wrap;
1762
+ width: 100%;
1763
+ }
1764
+ .ilo--card--feature.ilo--card--narrow .ilo--card--content, .ilo--card--feature.ilo--card--standard .ilo--card--content {
1765
+ width: 100%;
1766
+ }
1767
+ .ilo--card--feature.ilo--card--narrow .ilo--card--image--wrapper, .ilo--card--feature.ilo--card--standard .ilo--card--image--wrapper {
1768
+ width: 100%;
1769
+ }
1770
+ @media screen and (min-width: 610px) {
1771
+ .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
1772
+ display: flex;
1773
+ width: 100%;
1774
+ }
1775
+ .right-to-left .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
1776
+ flex-direction: row-reverse;
1777
+ }
1778
+ .ilo--card--feature.ilo--card--wide .ilo--card--content {
1779
+ display: flex;
1780
+ flex-wrap: wrap;
1781
+ width: 50%;
1782
+ }
1783
+ .right-to-left .ilo--card--feature.ilo--card--wide .ilo--card--content {
1784
+ flex-direction: row-reverse;
1785
+ }
1786
+ .ilo--card--feature.ilo--card--wide .ilo--card--image--wrapper {
1787
+ width: 50%;
1788
+ }
1789
+ .ilo--card--feature.ilo--card--wide .ilo--card--image {
1790
+ object-fit: cover;
1791
+ }
1792
+ .ilo--card--feature.ilo--card--wide .ilo--card--date {
1793
+ align-self: flex-end;
1794
+ }
1795
+ .ilo--card--feature.ilo--card--wide .ilo--card--eyebrow {
1796
+ width: 100%;
1797
+ }
1798
+ .ilo--card--feature.ilo--card--wide .ilo--card--title {
1799
+ width: 100%;
1800
+ }
1801
+ }
1462
1802
  .ilo--card--feature picture {
1463
1803
  display: flex;
1804
+ height: 100%;
1464
1805
  position: relative;
1465
1806
  }
1466
1807
  .ilo--card--feature picture::before {
@@ -1472,12 +1813,12 @@ body {
1472
1813
  opacity: 0;
1473
1814
  position: absolute;
1474
1815
  top: 0;
1475
- transition: opacity 0.15s ease-in-out;
1816
+ transition: opacity 150ms ease-in-out;
1476
1817
  width: 100%;
1477
1818
  z-index: -1;
1478
1819
  }
1479
1820
  .ilo--card--feature .ilo--card--content {
1480
- padding: 24px 24px 40px;
1821
+ padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
1481
1822
  }
1482
1823
  .ilo--card--feature .ilo--card--title {
1483
1824
  font-size: 23.32px;
@@ -1499,7 +1840,7 @@ body {
1499
1840
 
1500
1841
  /**
1501
1842
  * Do not edit directly
1502
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
1843
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1503
1844
  */
1504
1845
  /**
1505
1846
  * TOKENS:
@@ -1512,6 +1853,10 @@ body {
1512
1853
  flex-wrap: wrap;
1513
1854
  justify-content: space-between;
1514
1855
  margin: auto;
1856
+ row-gap: 1.7148981779rem;
1857
+ }
1858
+ .right-to-left .ilo--cardgroup--inner {
1859
+ flex-direction: row-reverse;
1515
1860
  }
1516
1861
  .ilo--cardgroup--inner .ilo--card {
1517
1862
  width: 100%;
@@ -1531,10 +1876,16 @@ body {
1531
1876
  width: calc(25% - 16px);
1532
1877
  }
1533
1878
  }
1879
+ .ilo--cardgroup--button-wrap {
1880
+ display: flex;
1881
+ justify-content: center;
1882
+ margin-top: 3.4297963558rem;
1883
+ width: 100%;
1884
+ }
1534
1885
 
1535
1886
  /**
1536
1887
  * Do not edit directly
1537
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
1888
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1538
1889
  */
1539
1890
  /**
1540
1891
  * TOKENS:
@@ -1638,7 +1989,7 @@ body {
1638
1989
 
1639
1990
  /**
1640
1991
  * Do not edit directly
1641
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
1992
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1642
1993
  */
1643
1994
  /**
1644
1995
  * TOKENS:
@@ -1710,7 +2061,7 @@ body {
1710
2061
 
1711
2062
  /**
1712
2063
  * Do not edit directly
1713
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2064
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1714
2065
  */
1715
2066
  /**
1716
2067
  * TOKENS:
@@ -1720,7 +2071,7 @@ body {
1720
2071
  */
1721
2072
  /**
1722
2073
  * Do not edit directly
1723
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2074
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1724
2075
  */
1725
2076
  /**
1726
2077
  * TOKENS:
@@ -1730,7 +2081,7 @@ body {
1730
2081
  */
1731
2082
  /**
1732
2083
  * Do not edit directly
1733
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2084
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1734
2085
  */
1735
2086
  /**
1736
2087
  * TOKENS:
@@ -1740,7 +2091,7 @@ body {
1740
2091
  */
1741
2092
  /**
1742
2093
  * Do not edit directly
1743
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2094
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1744
2095
  */
1745
2096
  /**
1746
2097
  * TOKENS:
@@ -1839,7 +2190,7 @@ body {
1839
2190
 
1840
2191
  /**
1841
2192
  * Do not edit directly
1842
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2193
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1843
2194
  */
1844
2195
  /**
1845
2196
  * TOKENS:
@@ -1859,7 +2210,7 @@ body {
1859
2210
 
1860
2211
  /**
1861
2212
  * Do not edit directly
1862
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2213
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1863
2214
  */
1864
2215
  /**
1865
2216
  * TOKENS:
@@ -1934,7 +2285,7 @@ body {
1934
2285
 
1935
2286
  /**
1936
2287
  * Do not edit directly
1937
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2288
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1938
2289
  */
1939
2290
  /**
1940
2291
  * TOKENS:
@@ -1944,7 +2295,7 @@ body {
1944
2295
  */
1945
2296
  /**
1946
2297
  * Do not edit directly
1947
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2298
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1948
2299
  */
1949
2300
  /**
1950
2301
  * TOKENS:
@@ -1954,7 +2305,7 @@ body {
1954
2305
  */
1955
2306
  /**
1956
2307
  * Do not edit directly
1957
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2308
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
1958
2309
  */
1959
2310
  /**
1960
2311
  * TOKENS:
@@ -2007,7 +2358,7 @@ body {
2007
2358
 
2008
2359
  /**
2009
2360
  * Do not edit directly
2010
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2361
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2011
2362
  */
2012
2363
  /**
2013
2364
  * TOKENS:
@@ -2072,7 +2423,7 @@ body {
2072
2423
 
2073
2424
  /**
2074
2425
  * Do not edit directly
2075
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2426
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2076
2427
  */
2077
2428
  /**
2078
2429
  * TOKENS:
@@ -2178,7 +2529,7 @@ body {
2178
2529
 
2179
2530
  /**
2180
2531
  * Do not edit directly
2181
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2532
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2182
2533
  */
2183
2534
  /**
2184
2535
  * TOKENS:
@@ -2198,7 +2549,7 @@ body {
2198
2549
 
2199
2550
  /**
2200
2551
  * Do not edit directly
2201
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2552
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2202
2553
  */
2203
2554
  /**
2204
2555
  * TOKENS:
@@ -2206,30 +2557,75 @@ body {
2206
2557
  /**
2207
2558
  * MAPS:
2208
2559
  */
2209
- .ilo--footer--main {
2210
- background-color: rgb(35, 0, 80);
2211
- border-bottom: 0.3215434084rem solid rgb(250, 60, 75);
2212
- padding: 0 1.7148981779rem;
2213
- position: relative;
2214
- }
2215
- .ilo--footer--main > * {
2216
- position: relative;
2217
- z-index: 1;
2560
+ /**
2561
+ * Do not edit directly
2562
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2563
+ */
2564
+ /**
2565
+ * TOKENS:
2566
+ */
2567
+ /**
2568
+ * MAPS:
2569
+ */
2570
+ @keyframes emptygradient {
2571
+ 0% {
2572
+ opacity: 1;
2573
+ }
2574
+ 100% {
2575
+ opacity: 0;
2576
+ }
2218
2577
  }
2219
- .ilo--footer--main:after {
2220
- background-color: rgb(30, 45, 190);
2221
- clip-path: polygon(63.75% 0%, 100% 63.75%, 100% 0);
2222
- content: "";
2223
- height: 100%;
2224
- left: 0;
2578
+ @keyframes spin {
2579
+ 100% {
2580
+ -moz-transform: rotate(360deg);
2581
+ -webkit-transform: rotate(360deg);
2582
+ transform: rotate(360deg);
2583
+ }
2584
+ }
2585
+ /**
2586
+ * Do not edit directly
2587
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2588
+ */
2589
+ /**
2590
+ * TOKENS:
2591
+ */
2592
+ /**
2593
+ * MAPS:
2594
+ */
2595
+ .ilo--footer {
2596
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2597
+ }
2598
+ .ilo--footer--main {
2599
+ background-color: rgb(35, 0, 80);
2600
+ border-bottom: 0.3215434084rem solid rgb(250, 60, 75);
2601
+ padding: 2.1436227224rem 1.7148981779rem 0 1.7148981779rem;
2602
+ position: relative;
2603
+ }
2604
+ .ilo--footer--main > * {
2605
+ position: relative;
2606
+ z-index: 1;
2607
+ }
2608
+ .ilo--footer--main:after {
2609
+ background-size: contain;
2610
+ background-repeat: no-repeat;
2611
+ bottom: 0;
2612
+ content: "";
2613
+ height: 100%;
2614
+ min-width: 409.5px;
2615
+ right: 0;
2225
2616
  position: absolute;
2226
- top: 0;
2227
- width: 100%;
2617
+ transform: scaleY(-1);
2618
+ width: 28.8%;
2228
2619
  z-index: 0;
2620
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 409.5 236'%3e%3cpath fill='rgb(30, 45, 190)' d='M409.5 236c-1.7-.6-3.5-1.1-5.1-2-5.3-2.9-10.5-5.9-15.7-9-4.8-2.8-9.5-5.8-14.3-8.7-4.3-2.6-8.5-5.1-12.9-7.5-4.9-2.7-10-5.2-14.9-8-3.8-2.2-7.4-4.8-11.2-7.1-5.7-3.3-11.6-6.4-17.3-9.7-3.9-2.2-7.6-4.6-11.5-6.9-4-2.3-8.1-4.4-12-6.7-3.8-2.2-7.5-4.5-11.3-6.7-2.4-1.4-4.9-2.5-7.3-3.9-2.8-1.6-5.5-3.3-8.2-4.9-3.8-2.3-7.5-4.6-11.4-6.8-3.9-2.3-7.9-4.5-11.9-6.8-6.1-3.5-12.2-6.8-18.2-10.4-4.8-2.8-9.4-5.8-14.2-8.5-4.8-2.8-9.8-5.3-14.6-8.1-3.6-2.1-7.2-4.3-10.8-6.4-5.9-3.5-11.8-6.9-17.7-10.3-4.8-2.8-9.6-5.7-14.4-8.5-3.8-2.2-7.8-4.4-11.6-6.6-3-1.7-5.9-3.6-8.9-5.4-3-1.8-6.2-3.4-9.2-5.1-3.9-2.2-7.8-4.4-11.6-6.6-4.1-2.4-8.1-4.8-12.2-7.2-5.8-3.4-11.5-6.9-17.3-10.2-4.9-2.8-9.9-5.4-14.7-8.2-3.7-2.1-7.3-4.5-11-6.6-4.9-2.9-9.8-5.6-14.7-8.4-4.7-2.7-9.4-5.6-14.2-8.3-5-2.9-10-5.7-15-8.6C10.3 5.6 6.6 3.3 2.8 1 2 .5 1 .3 0 0h409.5v236z'/%3e%3c/svg%3e");
2621
+ }
2622
+ .ilo--footer--logo {
2623
+ max-width: 100%;
2229
2624
  }
2230
2625
  .ilo--footer--secondary {
2231
2626
  background-color: rgb(255, 255, 255);
2232
2627
  padding: 1.9292604502rem 0.857449089rem 0 0.857449089rem;
2628
+ min-height: 3.0010718114rem;
2233
2629
  }
2234
2630
  .ilo--footer--headline {
2235
2631
  color: rgb(255, 255, 255);
@@ -2276,15 +2672,6 @@ body {
2276
2672
  display: flex;
2277
2673
  margin-bottom: 2.4115755627rem;
2278
2674
  }
2279
- .ilo--footer .social--links--item {
2280
- height: 0.857449089rem;
2281
- margin-right: 1.0718113612rem;
2282
- position: relative;
2283
- width: 0.857449089rem;
2284
- }
2285
- .ilo--footer .social--links--item:last-of-type {
2286
- margin-right: none;
2287
- }
2288
2675
  .ilo--footer .social--links--link {
2289
2676
  background-repeat: no-repeat;
2290
2677
  background-size: contain;
@@ -2310,6 +2697,35 @@ body {
2310
2697
  .ilo--footer .social--links--link.youtube {
2311
2698
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3e%3cpath fill='rgb(255, 255, 255)' d='M15.8 2.8C15.6 1.5 15 0.6 13.6 0.4C11.4 8.9407e-08 8 0 8 0C8 0 4.6 8.9407e-08 2.4 0.4C1 0.6 0.3 1.5 0.2 2.8C0 4.1 0 6 0 6C0 6 0 7.9 0.2 9.2C0.4 10.5 1 11.4 2.4 11.6C4.6 12 8 12 8 12C8 12 11.4 12 13.6 11.6C15 11.3 15.6 10.5 15.8 9.2C16 7.9 16 6 16 6C16 6 16 4.1 15.8 2.8ZM6 9V3L11 6L6 9Z'/%3e%3c/svg%3e");
2312
2699
  }
2700
+ .ilo--footer .social--links--item {
2701
+ align-items: center;
2702
+ background-color: transparent;
2703
+ border-radius: 0.1607717042rem;
2704
+ display: flex;
2705
+ height: 1.2861736334rem;
2706
+ justify-content: center;
2707
+ margin-right: 1.0718113612rem;
2708
+ position: relative;
2709
+ width: 1.2861736334rem;
2710
+ }
2711
+ .ilo--footer .social--links--item:last-of-type {
2712
+ margin-right: none;
2713
+ }
2714
+ .ilo--footer .social--links--item:hover, .ilo--footer .social--links--item:focus {
2715
+ background-color: rgb(235, 245, 253);
2716
+ }
2717
+ .ilo--footer .social--links--item:hover .social--links--link.facebook, .ilo--footer .social--links--item:focus .social--links--link.facebook {
2718
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='rgb(30, 45, 190)' d='M15.9999 8.02727C15.9989 6.4988 15.56 5.00262 14.7352 3.71579C13.9104 2.42896 12.7343 1.40534 11.3459 0.766059C9.95758 0.126781 8.41516 -0.101394 6.90119 0.108536C5.38721 0.318466 3.96507 0.957714 2.80304 1.95063C1.64102 2.94355 0.787752 4.24858 0.344223 5.71127C-0.0993054 7.17397 -0.114533 8.73312 0.300343 10.2042C0.715219 11.6753 1.54283 12.9967 2.68524 14.0121C3.82766 15.0276 5.23704 15.6945 6.74663 15.9339V10.3406H4.74664V8.02727H6.74663V6.26727C6.74663 4.26727 7.94662 3.15393 9.77328 3.15393C10.3719 3.16359 10.9691 3.21707 11.5599 3.31393V5.31393H10.5533C10.4026 5.29332 10.2494 5.30269 10.1024 5.34152C9.95536 5.38035 9.81748 5.44787 9.69666 5.54019C9.57584 5.63251 9.47446 5.74781 9.39837 5.87945C9.32228 6.0111 9.27297 6.15649 9.25328 6.30727C9.24653 6.39158 9.24653 6.47629 9.25328 6.5606V8.0606H11.4666L11.1133 10.3739H9.24661V15.9673C11.1354 15.6693 12.855 14.7047 14.0939 13.2481C15.3327 11.7915 16.0089 9.93941 15.9999 8.02727Z'/%3e%3c/svg%3e");
2719
+ }
2720
+ .ilo--footer .social--links--item:hover .social--links--link.instagram, .ilo--footer .social--links--item:focus .social--links--link.instagram {
2721
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 16'%3e%3cpath fill='rgb(30, 45, 190)' d='M8.998 1.441c2.136 0 2.389.009 3.233.047.507.006 1.01.1 1.485.276.348.128.662.334.92.6.267.258.472.572.6.92.177.475.27.978.276 1.485.038.844.047 1.1.047 3.233s-.009 2.389-.047 3.233c-.006.507-.1 1.01-.276 1.485a2.644 2.644 0 0 1-1.518 1.518 4.42 4.42 0 0 1-1.485.276c-.844.038-1.1.047-3.233.047s-2.389-.009-3.233-.047a4.42 4.42 0 0 1-1.485-.276 2.472 2.472 0 0 1-.92-.6 2.472 2.472 0 0 1-.6-.92 4.419 4.419 0 0 1-.276-1.485c-.038-.844-.047-1.1-.047-3.233s.009-2.389.047-3.233c.006-.507.1-1.01.276-1.485.129-.348.334-.662.6-.92.258-.266.572-.472.92-.6.476-.177.978-.27 1.485-.276.844-.038 1.1-.047 3.233-.047l-.002.002Zm0-1.441c-2.173 0-2.445.009-3.3.048a5.868 5.868 0 0 0-1.94.372c-.534.2-1.018.516-1.417.923-.407.4-.722.883-.923 1.417a5.868 5.868 0 0 0-.372 1.94C1.007 5.555.998 5.827.998 8s.01 2.445.048 3.3c.014.663.14 1.319.372 1.94.2.534.516 1.018.923 1.417.4.407.883.722 1.417.923a5.868 5.868 0 0 0 1.942.372c.853.039 1.125.048 3.298.048s2.445-.009 3.3-.048a5.867 5.867 0 0 0 1.942-.372 4.093 4.093 0 0 0 2.34-2.34 5.865 5.865 0 0 0 .372-1.942c.039-.853.048-1.125.048-3.3s-.009-2.445-.048-3.3a5.867 5.867 0 0 0-.374-1.938 3.907 3.907 0 0 0-.923-1.417A3.907 3.907 0 0 0 14.238.42a5.868 5.868 0 0 0-1.94-.372C11.443.009 11.171 0 8.998 0Z'/%3e%3cpath fill='rgb(30, 45, 190)' d='M8.999 3.892a4.108 4.108 0 1 0 0 8.216 4.108 4.108 0 0 0 0-8.216Zm0 6.775a2.667 2.667 0 1 1 0-5.333 2.667 2.667 0 0 1 0 5.333ZM13.269 4.69a.96.96 0 1 0 0-1.92.96.96 0 0 0 0 1.92Z'/%3e%3c/svg%3e");
2722
+ }
2723
+ .ilo--footer .social--links--item:hover .social--links--link.twitter, .ilo--footer .social--links--item:focus .social--links--link.twitter {
2724
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3e%3cpath fill='rgb(30, 45, 190)' d='M16 2.06654C15.4109 2.34447 14.7804 2.5246 14.1333 2.59987C14.8103 2.18143 15.3269 1.54744 15.6 0.799871C14.9662 1.19144 14.2656 1.46265 13.5333 1.59987C13.2304 1.26374 12.8602 0.995069 12.4468 0.811305C12.0333 0.62754 11.5858 0.532789 11.1333 0.533204C10.2675 0.534966 9.43763 0.879698 8.8254 1.49193C8.21316 2.10417 7.86843 2.93404 7.86667 3.79987C7.85257 4.04627 7.87504 4.29339 7.93333 4.53321C6.61791 4.47523 5.33022 4.13577 4.15716 3.53774C2.98411 2.93971 1.95297 2.09702 1.13333 1.06654C0.817783 1.56434 0.655503 2.14392 0.666667 2.7332C0.671269 3.27357 0.807176 3.80471 1.06268 4.28087C1.31818 4.75704 1.68562 5.16394 2.13333 5.46654C1.61599 5.47834 1.10639 5.33935 0.666667 5.06654V5.1332C0.659852 5.88583 0.915814 6.61725 1.39043 7.2014C1.86505 7.78554 2.52859 8.18581 3.26667 8.3332C2.98479 8.41509 2.69345 8.45991 2.4 8.46654C2.1977 8.47738 1.99499 8.45486 1.8 8.39987C1.99454 9.06013 2.39935 9.6388 2.95288 10.0479C3.50641 10.4571 4.17839 10.6743 4.86667 10.6665C3.703 11.5697 2.273 12.062 0.8 12.0665C0.531602 12.0775 0.262882 12.0551 0 11.9999C1.49363 12.9535 3.22789 13.4622 5 13.4665C6.22889 13.4781 7.44776 13.2446 8.58536 12.7797C9.72296 12.3147 10.7565 11.6277 11.6255 10.7587C12.4945 9.88967 13.1815 8.85616 13.6465 7.71856C14.1114 6.58096 14.3449 5.3621 14.3333 4.1332V3.7332C14.9691 3.26412 15.5309 2.70231 16 2.06654Z'/%3e%3c/svg%3e");
2725
+ }
2726
+ .ilo--footer .social--links--item:hover .social--links--link.youtube, .ilo--footer .social--links--item:focus .social--links--link.youtube {
2727
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12'%3e%3cpath fill='rgb(30, 45, 190)' d='M15.8 2.8C15.6 1.5 15 0.6 13.6 0.4C11.4 8.9407e-08 8 0 8 0C8 0 4.6 8.9407e-08 2.4 0.4C1 0.6 0.3 1.5 0.2 2.8C0 4.1 0 6 0 6C0 6 0 7.9 0.2 9.2C0.4 10.5 1 11.4 2.4 11.6C4.6 12 8 12 8 12C8 12 11.4 12 13.6 11.6C15 11.3 15.6 10.5 15.8 9.2C16 7.9 16 6 16 6C16 6 16 4.1 15.8 2.8ZM6 9V3L11 6L6 9Z'/%3e%3c/svg%3e");
2728
+ }
2313
2729
  .ilo--footer .legal,
2314
2730
  .ilo--footer .secondarylinks {
2315
2731
  color: rgb(109, 109, 109);
@@ -2329,20 +2745,35 @@ body {
2329
2745
  }
2330
2746
  .ilo--footer .secondarylinks--list--item a {
2331
2747
  color: rgb(109, 109, 109);
2748
+ transition-property: color, border-color;
2749
+ transition-duration: 150ms;
2750
+ transition-timing-function: ease-out;
2332
2751
  }
2333
2752
  .ilo--footer .secondarylinks--list--item a:visited {
2334
2753
  color: rgb(150, 10, 85);
2754
+ transition-property: color, border-color;
2755
+ transition-duration: 150ms;
2756
+ transition-timing-function: ease-out;
2335
2757
  }
2336
2758
  .ilo--footer .secondarylinks--list--item a:hover {
2337
2759
  color: rgb(30, 45, 190);
2760
+ transition-property: color, border-color;
2761
+ transition-duration: 150ms;
2762
+ transition-timing-function: ease-out;
2338
2763
  }
2339
2764
  .ilo--footer .secondarylinks--list--item a:active {
2340
2765
  color: rgb(35, 0, 80);
2341
2766
  outline: none;
2767
+ transition-property: color, border-color;
2768
+ transition-duration: 150ms;
2769
+ transition-timing-function: ease-out;
2342
2770
  }
2343
2771
  .ilo--footer .secondarylinks--list--item a:focus {
2344
2772
  color: rgb(35, 0, 80);
2345
2773
  outline: none;
2774
+ transition-property: color, border-color;
2775
+ transition-duration: 150ms;
2776
+ transition-timing-function: ease-out;
2346
2777
  }
2347
2778
  .ilo--footer .anchorlink {
2348
2779
  background: rgba(0, 0, 0, 0);
@@ -2379,7 +2810,9 @@ body {
2379
2810
  border-bottom: 0.1071811361rem solid rgb(30, 45, 190);
2380
2811
  color: rgb(30, 45, 190);
2381
2812
  cursor: pointer;
2382
- transition: background 150ms linear, border 150ms linear, color 150ms linear;
2813
+ transition-property: color, background-color, border-color;
2814
+ transition-duration: 150ms;
2815
+ transition-timing-function: ease-out;
2383
2816
  }
2384
2817
  .ilo--footer .anchorlink:hover:after {
2385
2818
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 25'%3e%3cpath fill='rgb(30, 45, 190)' d='M4.00391 9.13792L4.99208 8.1499L12.0004 15.1571L19.0087 8.1499L19.9969 9.13792L12.498 16.6426C12.4328 16.7083 12.3553 16.7604 12.2699 16.796C12.1845 16.8316 12.0929 16.8499 12.0004 16.8499C11.9079 16.8499 11.8163 16.8316 11.7309 16.796C11.6455 16.7604 11.568 16.7083 11.5028 16.6426L4.00391 9.13792Z'/%3e%3c/svg%3e");
@@ -2439,6 +2872,12 @@ body {
2439
2872
  grid-template-areas: "site-info address connect" "site-info links connect";
2440
2873
  padding: 3.0010718114rem 3.7513397642rem 3.4297963558rem 3.7513397642rem;
2441
2874
  }
2875
+ .ilo--footer--main:after {
2876
+ background-position: right top;
2877
+ bottom: auto;
2878
+ top: 0;
2879
+ transform: scaleY(1);
2880
+ }
2442
2881
  .ilo--footer--logo {
2443
2882
  width: 100%;
2444
2883
  }
@@ -2471,10 +2910,49 @@ body {
2471
2910
  top: 0;
2472
2911
  }
2473
2912
  }
2913
+ .right-to-left .ilo--footer * {
2914
+ text-align: right;
2915
+ }
2916
+ .right-to-left .ilo--footer .social--links {
2917
+ flex-direction: row-reverse;
2918
+ }
2919
+ .right-to-left .ilo--footer .social--links--link {
2920
+ text-indent: 999em;
2921
+ }
2922
+ .right-to-left .ilo--footer--main:after {
2923
+ bottom: 0;
2924
+ left: 0;
2925
+ right: auto;
2926
+ top: auto;
2927
+ transform: scale(-1, -1);
2928
+ }
2929
+ @media screen and (min-width: 610px) {
2930
+ .right-to-left .ilo--footer--main {
2931
+ grid-template-areas: "address site-info" "links site-info" "connect site-info";
2932
+ }
2933
+ }
2934
+ @media screen and (min-width: 1024px) {
2935
+ .right-to-left .ilo--footer--main {
2936
+ grid-template-columns: calc(32.5% + 64px) 25.1% 19.2%;
2937
+ grid-template-areas: "connect address site-info" "connect links site-info";
2938
+ }
2939
+ .right-to-left .ilo--footer--main:after {
2940
+ left: 0;
2941
+ right: auto;
2942
+ transform: scale(-1, 1);
2943
+ }
2944
+ .right-to-left .ilo--footer .connect {
2945
+ grid-template-columns: 60%, minmax(0, 40%);
2946
+ margin: 0 calc(18.9% + 64px) 0 0;
2947
+ }
2948
+ .right-to-left .ilo--footer .ilo--button {
2949
+ justify-self: end;
2950
+ }
2951
+ }
2474
2952
 
2475
2953
  /**
2476
2954
  * Do not edit directly
2477
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
2955
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2478
2956
  */
2479
2957
  /**
2480
2958
  * TOKENS:
@@ -2597,7 +3075,7 @@ body {
2597
3075
 
2598
3076
  /**
2599
3077
  * Do not edit directly
2600
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3078
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2601
3079
  */
2602
3080
  /**
2603
3081
  * TOKENS:
@@ -2617,9 +3095,6 @@ body {
2617
3095
  position: relative;
2618
3096
  }
2619
3097
  @media screen and (min-width: 1024px) {
2620
- .ilo--hero--portal {
2621
- padding-top: 128px;
2622
- }
2623
3098
  .ilo--hero--portal .ilo--image {
2624
3099
  height: calc(100% - 80px);
2625
3100
  left: 0;
@@ -2696,12 +3171,10 @@ body {
2696
3171
  background-color: rgba(0, 0, 0, 0);
2697
3172
  }
2698
3173
  @media screen and (min-width: 1024px) {
2699
- .ilo--hero--image {
2700
- padding-top: 128px;
2701
- }
2702
3174
  .ilo--hero--image .ilo--image {
2703
3175
  height: 100%;
2704
3176
  max-height: 592px;
3177
+ overflow: hidden;
2705
3178
  width: 100%;
2706
3179
  }
2707
3180
  .ilo--hero--image .ilo--image--wrapper {
@@ -2935,7 +3408,7 @@ body {
2935
3408
 
2936
3409
  /**
2937
3410
  * Do not edit directly
2938
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3411
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2939
3412
  */
2940
3413
  /**
2941
3414
  * TOKENS:
@@ -2981,7 +3454,7 @@ body {
2981
3454
 
2982
3455
  /**
2983
3456
  * Do not edit directly
2984
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3457
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
2985
3458
  */
2986
3459
  /**
2987
3460
  * TOKENS:
@@ -3131,7 +3604,42 @@ body {
3131
3604
 
3132
3605
  /**
3133
3606
  * Do not edit directly
3134
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3607
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3608
+ */
3609
+ /**
3610
+ * TOKENS:
3611
+ */
3612
+ /**
3613
+ * MAPS:
3614
+ */
3615
+ /**
3616
+ * Do not edit directly
3617
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3618
+ */
3619
+ /**
3620
+ * TOKENS:
3621
+ */
3622
+ /**
3623
+ * MAPS:
3624
+ */
3625
+ @keyframes emptygradient {
3626
+ 0% {
3627
+ opacity: 1;
3628
+ }
3629
+ 100% {
3630
+ opacity: 0;
3631
+ }
3632
+ }
3633
+ @keyframes spin {
3634
+ 100% {
3635
+ -moz-transform: rotate(360deg);
3636
+ -webkit-transform: rotate(360deg);
3637
+ transform: rotate(360deg);
3638
+ }
3639
+ }
3640
+ /**
3641
+ * Do not edit directly
3642
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3135
3643
  */
3136
3644
  /**
3137
3645
  * TOKENS:
@@ -3201,10 +3709,16 @@ body {
3201
3709
  }
3202
3710
  .ilo--link-list--link:visited {
3203
3711
  color: rgb(35, 0, 80);
3712
+ transition-property: color;
3713
+ transition-duration: 150ms;
3714
+ transition-timing-function: ease-out;
3204
3715
  }
3205
3716
  .ilo--link-list--link:active {
3206
3717
  color: rgb(35, 0, 80);
3207
3718
  outline: none;
3719
+ transition-property: color;
3720
+ transition-duration: 150ms;
3721
+ transition-timing-function: ease-out;
3208
3722
  }
3209
3723
  .ilo--link-list--link:hover, .ilo--link-list--link:focus {
3210
3724
  border-bottom: 0.1071811361rem solid rgb(30, 45, 190);
@@ -3212,6 +3726,16 @@ body {
3212
3726
  color: rgb(30, 45, 190);
3213
3727
  outline: none;
3214
3728
  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");
3729
+ transition-property: color, background-color, border-color;
3730
+ transition-duration: 150ms;
3731
+ transition-timing-function: ease-out;
3732
+ }
3733
+ .right-to-left .ilo--link-list--link {
3734
+ background-position: 4px center;
3735
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(35, 0, 80)' 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");
3736
+ }
3737
+ .right-to-left .ilo--link-list--link:hover, .right-to-left .ilo--link-list--link:focus {
3738
+ 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");
3215
3739
  }
3216
3740
  .ilo--link-list--dark .ilo--link-list--headline,
3217
3741
  .ilo--link-list--dark .ilo--link-list--links--headline {
@@ -3229,12 +3753,18 @@ body {
3229
3753
  }
3230
3754
  .ilo--link-list--dark .ilo--link-list--link:visited .ilo--link-list--label {
3231
3755
  color: rgb(255, 255, 255);
3756
+ transition-property: color;
3757
+ transition-duration: 150ms;
3758
+ transition-timing-function: ease-out;
3232
3759
  }
3233
3760
  .ilo--link-list--dark .ilo--link-list--link:active {
3234
3761
  outline: none;
3235
3762
  }
3236
3763
  .ilo--link-list--dark .ilo--link-list--link:active .ilo--link-list--label {
3237
3764
  color: rgb(35, 0, 80);
3765
+ transition-property: color;
3766
+ transition-duration: 150ms;
3767
+ transition-timing-function: ease-out;
3238
3768
  }
3239
3769
  .ilo--link-list--dark .ilo--link-list--link:hover, .ilo--link-list--dark .ilo--link-list--link:focus {
3240
3770
  outline: none;
@@ -3242,11 +3772,24 @@ body {
3242
3772
  }
3243
3773
  .ilo--link-list--dark .ilo--link-list--link:hover .ilo--link-list--label, .ilo--link-list--dark .ilo--link-list--link:focus .ilo--link-list--label {
3244
3774
  color: rgb(30, 45, 190);
3775
+ transition-property: color;
3776
+ transition-duration: 150ms;
3777
+ transition-timing-function: ease-out;
3778
+ }
3779
+ .right-to-left .ilo--link-list--dark .ilo--link-list--link {
3780
+ background-position: 4px center;
3781
+ 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");
3782
+ }
3783
+ .right-to-left .ilo--link-list--dark .ilo--link-list--link:hover, .right-to-left .ilo--link-list--dark .ilo--link-list--link:focus {
3784
+ 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");
3785
+ }
3786
+ .right-to-left .ilo--link-list * {
3787
+ text-align: right;
3245
3788
  }
3246
3789
 
3247
3790
  /**
3248
3791
  * Do not edit directly
3249
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3792
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3250
3793
  */
3251
3794
  /**
3252
3795
  * TOKENS:
@@ -3309,7 +3852,7 @@ body {
3309
3852
 
3310
3853
  /**
3311
3854
  * Do not edit directly
3312
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3855
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3313
3856
  */
3314
3857
  /**
3315
3858
  * TOKENS:
@@ -3319,7 +3862,7 @@ body {
3319
3862
  */
3320
3863
  /**
3321
3864
  * Do not edit directly
3322
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3865
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3323
3866
  */
3324
3867
  /**
3325
3868
  * TOKENS:
@@ -3329,7 +3872,7 @@ body {
3329
3872
  */
3330
3873
  /**
3331
3874
  * Do not edit directly
3332
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3875
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3333
3876
  */
3334
3877
  /**
3335
3878
  * TOKENS:
@@ -3426,126 +3969,725 @@ body {
3426
3969
  background-size: contain;
3427
3970
  content: "";
3428
3971
  display: block;
3429
- height: 1.2861736334rem;
3430
- margin-right: 0.6430868167rem;
3431
- width: 1.2861736334rem;
3972
+ height: 1.2861736334rem;
3973
+ margin-right: 0.6430868167rem;
3974
+ width: 1.2861736334rem;
3975
+ }
3976
+ .ilo--loading.storybook {
3977
+ height: 400px;
3978
+ width: 100%;
3979
+ }
3980
+
3981
+ /**
3982
+ * Do not edit directly
3983
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3984
+ */
3985
+ /**
3986
+ * TOKENS:
3987
+ */
3988
+ /**
3989
+ * MAPS:
3990
+ */
3991
+ /**
3992
+ * Do not edit directly
3993
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3994
+ */
3995
+ /**
3996
+ * TOKENS:
3997
+ */
3998
+ /**
3999
+ * MAPS:
4000
+ */
4001
+ /**
4002
+ * Do not edit directly
4003
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
4004
+ */
4005
+ /**
4006
+ * TOKENS:
4007
+ */
4008
+ /**
4009
+ * MAPS:
4010
+ */
4011
+ @keyframes emptygradient {
4012
+ 0% {
4013
+ opacity: 1;
4014
+ }
4015
+ 100% {
4016
+ opacity: 0;
4017
+ }
4018
+ }
4019
+ @keyframes spin {
4020
+ 100% {
4021
+ -moz-transform: rotate(360deg);
4022
+ -webkit-transform: rotate(360deg);
4023
+ transform: rotate(360deg);
4024
+ }
4025
+ }
4026
+ .ilo--modal--wrapper {
4027
+ display: none;
4028
+ }
4029
+ .ilo--modal--wrapper > * {
4030
+ opacity: 0;
4031
+ }
4032
+ .ilo--modal.show .ilo--modal--wrapper {
4033
+ display: block;
4034
+ height: 100vh;
4035
+ left: 0;
4036
+ position: fixed;
4037
+ top: 0;
4038
+ width: 100vw;
4039
+ z-index: 10001;
4040
+ }
4041
+ .ilo--modal.show.fadein .ilo--modal--wrapper > * {
4042
+ opacity: 1;
4043
+ transition: opacity 1.5s ease-out 125ms;
4044
+ }
4045
+ .ilo--modal--background {
4046
+ background-color: rgba(0, 0, 0, 0.85);
4047
+ height: 100%;
4048
+ left: 0;
4049
+ position: absolute;
4050
+ top: 0;
4051
+ width: 100%;
4052
+ z-index: 10002;
4053
+ }
4054
+ .ilo--modal--contents {
4055
+ background-color: rgb(255, 255, 255);
4056
+ left: 0;
4057
+ position: absolute;
4058
+ margin: 0 4.2%;
4059
+ max-height: 96%;
4060
+ overflow: scroll;
4061
+ top: 50%;
4062
+ transform: translateY(-50%);
4063
+ width: 91.4%;
4064
+ z-index: 10003;
4065
+ }
4066
+ .ilo--modal .modal--close {
4067
+ right: 0;
4068
+ position: absolute;
4069
+ top: 0;
4070
+ z-index: 10004;
4071
+ }
4072
+ @media screen and (min-width: 610px) {
4073
+ .ilo--modal--contents {
4074
+ margin: 0 23.2%;
4075
+ width: 53.58%;
4076
+ }
4077
+ }
4078
+ @media screen and (min-width: 1024px) {
4079
+ .ilo--modal--contents {
4080
+ margin: 0 18.05%;
4081
+ width: 63.888%;
4082
+ }
4083
+ }
4084
+ .ilo--modal.storybook {
4085
+ height: 400px;
4086
+ width: 100%;
4087
+ }
4088
+
4089
+ /**
4090
+ * Do not edit directly
4091
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
4092
+ */
4093
+ /**
4094
+ * TOKENS:
4095
+ */
4096
+ /**
4097
+ * MAPS:
4098
+ */
4099
+ .ilo--header {
4100
+ overflow-x: hidden;
4101
+ position: relative;
4102
+ z-index: 4;
4103
+ }
4104
+ .ilo--header.ilo--mobile--open {
4105
+ height: 100vh;
4106
+ }
4107
+ @media screen and (min-width: 1024px) {
4108
+ .ilo--header {
4109
+ overflow: visible;
4110
+ }
4111
+ }
4112
+ .ilo--header--nav {
4113
+ background: rgb(35, 0, 80);
4114
+ }
4115
+ .ilo--header--menu {
4116
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='rgb(255, 255, 255)' d='M24 8H17.3333 14.6667 8V10.6667H14.6667 17.3333 24V8zM24 14.667H17.3333 14.6667 8V17.3337H14.6667 17.3333 24V14.667zM24 21.333H17.3333 14.6667 8V23.9997H14.6667 17.3333 24V21.333z'/%3e%3c/svg%3e");
4117
+ background-color: transparent;
4118
+ background-position: center;
4119
+ background-repeat: no-repeat;
4120
+ background-size: 32px;
4121
+ border: none;
4122
+ cursor: pointer;
4123
+ overflow: hidden;
4124
+ position: relative;
4125
+ text-indent: -999%;
4126
+ transition: all 150ms ease-out;
4127
+ }
4128
+ .ilo--header--menu:hover, .ilo--header--menu:focus {
4129
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='rgb(30, 45, 190)' d='M24 8H17.3333 14.6667 8V10.6667H14.6667 17.3333 24V8zM24 14.667H17.3333 14.6667 8V17.3337H14.6667 17.3333 24V14.667zM24 21.333H17.3333 14.6667 8V23.9997H14.6667 17.3333 24V21.333z'/%3e%3c/svg%3e");
4130
+ background-color: rgb(235, 245, 253);
4131
+ background-position: center;
4132
+ background-repeat: no-repeat;
4133
+ background-size: 32px;
4134
+ }
4135
+ @media screen and (min-width: 1024px) {
4136
+ .ilo--header--menu {
4137
+ display: none;
4138
+ }
4139
+ }
4140
+ .ilo--header--menu--close {
4141
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(35, 0, 80)' 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");
4142
+ background-color: rgb(237, 240, 242);
4143
+ background-position: center;
4144
+ background-repeat: no-repeat;
4145
+ background-size: 32px;
4146
+ border: none;
4147
+ cursor: pointer;
4148
+ height: 32px;
4149
+ overflow: hidden;
4150
+ position: relative;
4151
+ text-indent: -999%;
4152
+ transition: all 150ms ease-out;
4153
+ width: 32px;
4154
+ }
4155
+ .ilo--header--menu--close:hover, .ilo--header--menu--close:focus {
4156
+ 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");
4157
+ background-color: rgb(235, 245, 253);
4158
+ background-position: center;
4159
+ background-repeat: no-repeat;
4160
+ background-size: 32px;
4161
+ }
4162
+ @media screen and (min-width: 1024px) {
4163
+ .ilo--header--menu--close {
4164
+ display: none;
4165
+ }
4166
+ }
4167
+ .ilo--header--logo {
4168
+ display: block;
4169
+ max-width: 150px;
4170
+ }
4171
+ @media screen and (min-width: 1024px) {
4172
+ .ilo--header--logo {
4173
+ max-width: 200px;
4174
+ }
4175
+ }
4176
+ .ilo--header--logo-link {
4177
+ display: block;
4178
+ padding: 16px 0;
4179
+ }
4180
+ .ilo--header--logo-bar {
4181
+ background: rgb(30, 45, 190);
4182
+ display: flex;
4183
+ width: 100%;
4184
+ }
4185
+ .ilo--header--logo-bar .ilo--header--inner {
4186
+ display: flex;
4187
+ justify-content: space-between;
4188
+ }
4189
+ @media screen and (min-width: 1024px) {
4190
+ .ilo--header--logo-bar {
4191
+ background: rgb(30, 45, 190);
4192
+ }
4193
+ }
4194
+ .ilo--header--utility-bar {
4195
+ display: none;
4196
+ }
4197
+ @media screen and (min-width: 1024px) {
4198
+ .ilo--header--utility-bar {
4199
+ background: rgb(30, 45, 190);
4200
+ display: flex;
4201
+ justify-content: flex-end;
4202
+ width: 100%;
4203
+ }
4204
+ .ilo--header--utility-bar--local {
4205
+ justify-content: space-between;
4206
+ }
4207
+ }
4208
+ .ilo--header--inner {
4209
+ margin: auto;
4210
+ max-width: 1300px;
4211
+ padding: 0 16px;
4212
+ width: 100%;
4213
+ }
4214
+ @media screen and (min-width: 1024px) {
4215
+ .ilo--header--inner {
4216
+ display: flex;
4217
+ justify-content: space-between;
4218
+ padding: 0 20px;
4219
+ }
4220
+ }
4221
+ .ilo--header--navigation {
4222
+ background: rgb(255, 255, 255);
4223
+ position: absolute;
4224
+ top: 0;
4225
+ left: 0;
4226
+ transform: translateX(100%);
4227
+ transition: transform 225ms ease-out;
4228
+ width: 100%;
4229
+ }
4230
+ .ilo--header.ilo--mobile--open .ilo--header--navigation {
4231
+ transform: translateX(0);
4232
+ }
4233
+ @media screen and (min-width: 1024px) {
4234
+ .ilo--header--navigation {
4235
+ background: rgb(35, 0, 80);
4236
+ position: static;
4237
+ transform: none;
4238
+ }
4239
+ }
4240
+ .ilo--header--logo-tagline {
4241
+ font-size: 18.66px;
4242
+ letter-spacing: -0.035em;
4243
+ line-height: 24.26px;
4244
+ color: rgb(255, 255, 255);
4245
+ display: none;
4246
+ font-family: Overpass;
4247
+ font-weight: 700;
4248
+ padding: 20px 0;
4249
+ text-align: right;
4250
+ }
4251
+ @media screen and (min-width: 1024px) {
4252
+ .ilo--header--logo-tagline {
4253
+ display: block;
4254
+ }
4255
+ }
4256
+ .ilo--header--logo-tagline--small {
4257
+ font-size: 11.9px;
4258
+ letter-spacing: -0.02em;
4259
+ line-height: 19.4px;
4260
+ display: block;
4261
+ font-weight: 500;
4262
+ }
4263
+
4264
+ .ilo--nav {
4265
+ width: 100%;
4266
+ }
4267
+ @media screen and (min-width: 1024px) {
4268
+ .ilo--nav {
4269
+ width: auto;
4270
+ }
4271
+ }
4272
+ .ilo--nav--label:not(:focus):not(:active) {
4273
+ clip: rect(0 0 0 0);
4274
+ clip-path: inset(50%);
4275
+ height: 1px;
4276
+ overflow: hidden;
4277
+ position: absolute;
4278
+ white-space: nowrap;
4279
+ width: 1px;
4280
+ }
4281
+ .ilo--nav--set {
4282
+ width: 100%;
4283
+ }
4284
+ @media screen and (min-width: 1024px) {
4285
+ .ilo--nav--set {
4286
+ display: flex;
4287
+ width: auto;
4288
+ }
4289
+ }
4290
+ .ilo--nav--items {
4291
+ font-size: 16px;
4292
+ letter-spacing: -0.02em;
4293
+ line-height: 21.6px;
4294
+ font-family: Overpass;
4295
+ font-weight: 500;
4296
+ }
4297
+ @media screen and (min-width: 1024px) {
4298
+ .ilo--nav--items {
4299
+ display: flex;
4300
+ align-items: center;
4301
+ }
4302
+ .ilo--nav--items:first-of-type {
4303
+ margin-left: -20px;
4304
+ }
4305
+ }
4306
+ .ilo--nav--link {
4307
+ color: rgb(35, 0, 80);
4308
+ display: block;
4309
+ padding: 16px 36px 16px 8px;
4310
+ text-decoration: none;
4311
+ }
4312
+ .ilo--nav--link:hover, .ilo--nav--link:focus {
4313
+ background: rgb(235, 245, 253);
4314
+ color: rgb(30, 45, 190);
4315
+ text-decoration: none;
4316
+ }
4317
+ @media screen and (min-width: 1024px) {
4318
+ .ilo--nav--link {
4319
+ background: rgb(35, 0, 80);
4320
+ color: rgb(255, 255, 255);
4321
+ display: inline-block;
4322
+ padding: 21.5px 24px 20.5px;
4323
+ }
4324
+ .ilo--nav--link:hover, .ilo--nav--link:focus {
4325
+ background: rgb(255, 255, 255);
4326
+ color: rgb(30, 45, 190);
4327
+ text-decoration: none;
4328
+ }
4329
+ }
4330
+ .ilo--nav--trigger {
4331
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(35, 0, 80)' 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");
4332
+ font-size: 16px;
4333
+ letter-spacing: -0.02em;
4334
+ line-height: 21.6px;
4335
+ appearance: none;
4336
+ background-color: rgb(255, 255, 255);
4337
+ background-position: 90% 55%;
4338
+ background-repeat: no-repeat;
4339
+ background-size: 16px;
4340
+ border: none;
4341
+ color: rgb(35, 0, 80);
4342
+ cursor: pointer;
4343
+ display: block;
4344
+ font-family: Overpass;
4345
+ font-weight: 500;
4346
+ padding: 16px 36px 16px 8px;
4347
+ text-align: left;
4348
+ transition: all 150ms ease-out;
4349
+ width: 100%;
4350
+ }
4351
+ .ilo--nav--trigger:focus, .ilo--nav--trigger:hover {
4352
+ 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");
4353
+ background-color: rgb(235, 245, 253);
4354
+ color: rgb(30, 45, 190);
4355
+ }
4356
+ @media screen and (min-width: 1024px) {
4357
+ .ilo--nav--trigger {
4358
+ 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='M18 11H13V6H11V11H6V13H11V18H13V13H18V11Z'/%3e%3c/svg%3e");
4359
+ font-size: 14.93px;
4360
+ letter-spacing: -0.02em;
4361
+ line-height: 20.16px;
4362
+ background-color: rgb(35, 0, 80);
4363
+ background-position: 90% 55%;
4364
+ background-repeat: no-repeat;
4365
+ background-size: 20px;
4366
+ border: 1.5px solid rgba(184, 196, 204, 0.5);
4367
+ border-radius: 2px;
4368
+ color: rgb(255, 255, 255);
4369
+ cursor: pointer;
4370
+ display: inline-block;
4371
+ font-weight: 700;
4372
+ margin-left: 20px;
4373
+ padding: 7px 32px 5px 15px;
4374
+ text-align: center;
4375
+ transition: all 150ms ease-out;
4376
+ width: auto;
4377
+ }
4378
+ .ilo--nav--trigger:focus, .ilo--nav--trigger:hover {
4379
+ 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='M18 11H13V6H11V11H6V13H11V18H13V13H18V11Z'/%3e%3c/svg%3e");
4380
+ background-color: rgb(255, 255, 255);
4381
+ border-color: rgb(255, 255, 255);
4382
+ color: rgb(30, 45, 190);
4383
+ }
4384
+ }
4385
+ .ilo--nav--local {
4386
+ display: flex;
4387
+ justify-content: space-between;
4388
+ padding: 0 0 0 max((100% - 1260px) / 2, 20px);
4389
+ }
4390
+ .ilo--nav--local--logo-link {
4391
+ display: flex;
4392
+ }
4393
+ .ilo--nav--local--set {
4394
+ display: flex;
4395
+ justify-content: space-between;
4396
+ }
4397
+ .ilo--nav--local--item {
4398
+ font-size: 16px;
4399
+ letter-spacing: -0.02em;
4400
+ line-height: 21.6px;
4401
+ color: rgb(255, 255, 255);
4402
+ font-family: Overpass;
4403
+ font-weight: 500;
4404
+ }
4405
+ .ilo--nav--local--link {
4406
+ background: rgb(30, 45, 190);
4407
+ color: rgb(255, 255, 255);
4408
+ display: flex;
4409
+ padding: 13px 24px;
4410
+ text-decoration: none;
4411
+ transition: all 150ms ease-out;
4412
+ }
4413
+ .ilo--nav--local--link:hover, .ilo--nav--local--link:focus {
4414
+ background: rgb(235, 245, 253);
4415
+ color: rgb(30, 45, 190);
4416
+ }
4417
+
4418
+ .ilo--mobile--nav--logo {
4419
+ align-items: center;
4420
+ display: flex;
4421
+ justify-content: space-between;
4422
+ }
4423
+ @media screen and (min-width: 1024px) {
4424
+ .ilo--mobile--nav {
4425
+ display: none;
4426
+ }
4427
+ }
4428
+
4429
+ .ilo--language-switcher {
4430
+ background: rgb(35, 0, 80);
4431
+ display: flex;
4432
+ padding: 0 max((100% - 1300px) / 2, 20px) 0 0;
4433
+ position: relative;
4434
+ }
4435
+ .ilo--language-switcher::before {
4436
+ background: rgb(35, 0, 80);
4437
+ clip-path: polygon(0 0, 100% 0, 100% 100%);
4438
+ content: "";
4439
+ display: block;
4440
+ height: 100%;
4441
+ left: -32px;
4442
+ position: absolute;
4443
+ top: 0;
4444
+ width: 32px;
4445
+ }
4446
+ .ilo--language-switcher--wrap {
4447
+ display: flex;
4448
+ position: relative;
4449
+ }
4450
+ .ilo--language-switcher--button {
4451
+ font-size: 11.94px;
4452
+ letter-spacing: -0.02em;
4453
+ line-height: 16.24px;
4454
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='rgb(255, 255, 255)' fill-rule='evenodd' d='M1.08687 7.46667H3.21031C3.2851 5.53749 3.76315 3.78006 4.51995 2.45566C4.65969 2.21111 4.81092 1.97841 4.97289 1.76064C2.81175 2.81109 1.27822 4.9513 1.08687 7.46667ZM8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0ZM7.46667 1.1413C6.74082 1.34466 6.03016 1.96273 5.44607 2.98488C4.79279 4.12812 4.35217 5.69751 4.27783 7.46667H7.46667V1.1413ZM7.46667 8.53333H4.27783C4.35217 10.3025 4.79279 11.8719 5.44607 13.0151C6.03016 14.0373 6.74082 14.6553 7.46667 14.8587V8.53333ZM4.97289 14.2394C4.81093 14.0216 4.65969 13.7889 4.51995 13.5443C3.76315 12.2199 3.2851 10.4625 3.21031 8.53333H1.08687C1.27822 11.0487 2.81176 13.1889 4.97289 14.2394ZM8.53333 14.8587V8.53333H11.7222C11.6478 10.3025 11.2072 11.8719 10.5539 13.0151C9.96984 14.0373 9.25918 14.6553 8.53333 14.8587ZM11.7222 7.46667H8.53333V1.1413C9.25918 1.34466 9.96984 1.96273 10.5539 2.98488C11.2072 4.12812 11.6478 5.69751 11.7222 7.46667ZM12.7897 7.46667C12.7149 5.53749 12.2369 3.78006 11.4801 2.45566C11.3403 2.21111 11.1891 1.97841 11.0271 1.76064C13.1883 2.81109 14.7218 4.95129 14.9131 7.46667H12.7897ZM12.7897 8.53333C12.7149 10.4625 12.2369 12.2199 11.4801 13.5443C11.3403 13.7889 11.1891 14.0216 11.0271 14.2394C13.1883 13.1889 14.7218 11.0487 14.9131 8.53333H12.7897Z' clip-rule='evenodd'/%3e%3c/svg%3e");
4455
+ appearance: none;
4456
+ background-color: rgb(35, 0, 80);
4457
+ background-repeat: no-repeat;
4458
+ background-position: 15px center;
4459
+ background-size: 16px 16px;
4460
+ border: none;
4461
+ color: rgb(255, 255, 255);
4462
+ cursor: pointer;
4463
+ display: block;
4464
+ font-weight: 500;
4465
+ padding: 8px 30px 8px 40px;
4466
+ transition: all 150ms ease-out;
3432
4467
  }
3433
- .ilo--loading.storybook {
3434
- height: 400px;
3435
- width: 100%;
4468
+ .ilo--language-switcher--button:hover, .ilo--language-switcher--button:focus {
4469
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='rgb(30, 45, 190)' fill-rule='evenodd' d='M1.08687 7.46667H3.21031C3.2851 5.53749 3.76315 3.78006 4.51995 2.45566C4.65969 2.21111 4.81092 1.97841 4.97289 1.76064C2.81175 2.81109 1.27822 4.9513 1.08687 7.46667ZM8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0ZM7.46667 1.1413C6.74082 1.34466 6.03016 1.96273 5.44607 2.98488C4.79279 4.12812 4.35217 5.69751 4.27783 7.46667H7.46667V1.1413ZM7.46667 8.53333H4.27783C4.35217 10.3025 4.79279 11.8719 5.44607 13.0151C6.03016 14.0373 6.74082 14.6553 7.46667 14.8587V8.53333ZM4.97289 14.2394C4.81093 14.0216 4.65969 13.7889 4.51995 13.5443C3.76315 12.2199 3.2851 10.4625 3.21031 8.53333H1.08687C1.27822 11.0487 2.81176 13.1889 4.97289 14.2394ZM8.53333 14.8587V8.53333H11.7222C11.6478 10.3025 11.2072 11.8719 10.5539 13.0151C9.96984 14.0373 9.25918 14.6553 8.53333 14.8587ZM11.7222 7.46667H8.53333V1.1413C9.25918 1.34466 9.96984 1.96273 10.5539 2.98488C11.2072 4.12812 11.6478 5.69751 11.7222 7.46667ZM12.7897 7.46667C12.7149 5.53749 12.2369 3.78006 11.4801 2.45566C11.3403 2.21111 11.1891 1.97841 11.0271 1.76064C13.1883 2.81109 14.7218 4.95129 14.9131 7.46667H12.7897ZM12.7897 8.53333C12.7149 10.4625 12.2369 12.2199 11.4801 13.5443C11.3403 13.7889 11.1891 14.0216 11.0271 14.2394C13.1883 13.1889 14.7218 11.0487 14.9131 8.53333H12.7897Z' clip-rule='evenodd'/%3e%3c/svg%3e");
4470
+ background-color: rgb(235, 245, 253);
4471
+ color: rgb(30, 45, 190);
4472
+ }
4473
+ .ilo--language-switcher .ilo--context-menu {
4474
+ opacity: 0;
4475
+ position: absolute;
4476
+ right: 0;
4477
+ top: calc(100% + 12px);
4478
+ transition: opacity 150ms ease-out;
4479
+ z-index: -1;
4480
+ }
4481
+ .ilo--context--open .ilo--language-switcher .ilo--context-menu {
4482
+ opacity: 1;
4483
+ z-index: 1;
3436
4484
  }
3437
4485
 
3438
- /**
3439
- * Do not edit directly
3440
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3441
- */
3442
- /**
3443
- * TOKENS:
3444
- */
3445
- /**
3446
- * MAPS:
3447
- */
3448
- /**
3449
- * Do not edit directly
3450
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3451
- */
3452
- /**
3453
- * TOKENS:
3454
- */
3455
- /**
3456
- * MAPS:
3457
- */
3458
- /**
3459
- * Do not edit directly
3460
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
3461
- */
3462
- /**
3463
- * TOKENS:
3464
- */
3465
- /**
3466
- * MAPS:
3467
- */
3468
- @keyframes emptygradient {
3469
- 0% {
3470
- opacity: 1;
4486
+ .ilo--subnav {
4487
+ background: rgb(255, 255, 255);
4488
+ padding: 0 0 32px;
4489
+ position: absolute;
4490
+ top: 0;
4491
+ transform: translateX(100%);
4492
+ transition: transform 225ms ease-out;
4493
+ width: 100%;
4494
+ }
4495
+ .ilo--subnav--open .ilo--subnav {
4496
+ transform: translateX(0);
4497
+ }
4498
+ @media screen and (min-width: 1024px) {
4499
+ .ilo--subnav {
4500
+ left: 0;
4501
+ padding: 32px 0;
4502
+ top: auto;
4503
+ transform: translateY(-100%);
4504
+ transition: transform 225ms ease-out;
4505
+ z-index: -1;
3471
4506
  }
3472
- 100% {
3473
- opacity: 0;
4507
+ .ilo--header.ilo--subnav--open .ilo--subnav {
4508
+ transform: translateY(0);
3474
4509
  }
3475
4510
  }
3476
- @keyframes spin {
3477
- 100% {
3478
- -moz-transform: rotate(360deg);
3479
- -webkit-transform: rotate(360deg);
3480
- transform: rotate(360deg);
4511
+ .ilo--subnav--inner {
4512
+ margin: auto;
4513
+ max-width: 1300px;
4514
+ padding: 0 20px;
4515
+ width: 100%;
4516
+ }
4517
+ @media screen and (min-width: 1024px) {
4518
+ .ilo--subnav--inner {
4519
+ display: flex;
4520
+ justify-content: space-between;
3481
4521
  }
3482
4522
  }
3483
- .ilo--modal--wrapper {
3484
- display: none;
4523
+ .ilo--subnav--set {
4524
+ display: grid;
4525
+ grid-template-columns: 1fr;
4526
+ width: 100%;
3485
4527
  }
3486
- .ilo--modal--wrapper > * {
3487
- opacity: 0;
4528
+ @media screen and (min-width: 1024px) {
4529
+ .ilo--subnav--set {
4530
+ grid-auto-flow: column;
4531
+ grid-template-columns: repeat(5, 1fr);
4532
+ grid-template-rows: repeat(5, 1fr);
4533
+ }
3488
4534
  }
3489
- .ilo--modal.show .ilo--modal--wrapper {
3490
- display: block;
3491
- height: 100vh;
3492
- left: 0;
3493
- position: fixed;
3494
- top: 0;
3495
- width: 100vw;
3496
- z-index: 10001;
4535
+ .ilo--subnav--link {
4536
+ font-size: 16px;
4537
+ letter-spacing: -0.02em;
4538
+ line-height: 21.6px;
4539
+ background: rgb(255, 255, 255);
4540
+ color: rgb(35, 0, 80);
4541
+ display: flex;
4542
+ font-family: Overpass;
4543
+ font-weight: 500;
4544
+ padding: 18px 8px;
4545
+ text-decoration: none;
4546
+ transition: all 150ms ease-out;
3497
4547
  }
3498
- .ilo--modal.show.fadein .ilo--modal--wrapper > * {
3499
- opacity: 1;
3500
- transition: opacity 1.5s ease-out 125ms;
4548
+ .ilo--subnav--link:hover, .ilo--subnav--link:focus {
4549
+ background: rgb(235, 245, 253);
4550
+ color: rgb(30, 45, 190);
4551
+ text-decoration: none;
3501
4552
  }
3502
- .ilo--modal--background {
3503
- background-color: rgba(0, 0, 0, 0.85);
3504
- height: 100%;
3505
- left: 0;
3506
- position: absolute;
3507
- top: 0;
3508
- width: 100%;
3509
- z-index: 10002;
4553
+
4554
+ @media screen and (min-width: 1024px) {
4555
+ .ilo--mobile--subnav {
4556
+ display: none;
4557
+ }
3510
4558
  }
3511
- .ilo--modal--contents {
4559
+ .ilo--mobile--subnav--menu {
4560
+ align-items: center;
4561
+ display: flex;
4562
+ flex-wrap: wrap;
4563
+ justify-content: space-between;
4564
+ }
4565
+ .ilo--mobile--subnav--back {
4566
+ font-size: 16px;
4567
+ letter-spacing: -0.02em;
4568
+ line-height: 21.6px;
3512
4569
  background-color: rgb(255, 255, 255);
4570
+ border: none;
4571
+ color: rgb(35, 0, 80);
4572
+ cursor: pointer;
4573
+ padding: 16px 16px 16px 32px;
4574
+ position: relative;
4575
+ transition: all 150ms ease-out;
4576
+ }
4577
+ .ilo--mobile--subnav--back::before {
4578
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(35, 0, 80)' 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");
4579
+ background-position: 10% center;
4580
+ background-repeat: no-repeat;
4581
+ background-size: 24px;
4582
+ content: "";
4583
+ display: block;
4584
+ height: 24px;
3513
4585
  left: 0;
3514
4586
  position: absolute;
3515
- margin: 0 4.2%;
3516
- max-height: 96%;
3517
- overflow: scroll;
3518
4587
  top: 50%;
3519
- transform: translateY(-50%);
3520
- width: 91.4%;
3521
- z-index: 10003;
4588
+ transform: translateY(-50%) rotate(180deg);
4589
+ width: 24px;
3522
4590
  }
3523
- .ilo--modal .modal--close {
3524
- right: 0;
4591
+ .ilo--mobile--subnav--back:hover, .ilo--mobile--subnav--back:focus {
4592
+ background-color: rgb(235, 245, 253);
4593
+ color: rgb(30, 45, 190);
4594
+ }
4595
+ .ilo--mobile--subnav--back:hover::before, .ilo--mobile--subnav--back:focus::before {
4596
+ 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");
4597
+ background-position: 10% center;
4598
+ background-repeat: no-repeat;
4599
+ background-size: 24px;
4600
+ }
4601
+ @media screen and (min-width: 1024px) {
4602
+ .ilo--mobile--subnav--back {
4603
+ display: none;
4604
+ }
4605
+ }
4606
+ .ilo--mobile--subnav--label {
4607
+ font-size: 18.66px;
4608
+ letter-spacing: -0.035em;
4609
+ line-height: 24.26px;
4610
+ border-bottom: 3px solid rgb(237, 240, 242);
4611
+ color: rgb(45, 45, 45);
4612
+ font-family: Overpass;
4613
+ font-weight: 700;
4614
+ margin-bottom: 16px;
4615
+ padding: 20px 8px;
4616
+ width: 100%;
4617
+ }
4618
+
4619
+ .ilo--search-box {
4620
+ background: rgb(255, 255, 255);
3525
4621
  position: absolute;
3526
4622
  top: 0;
3527
- z-index: 10004;
4623
+ transform: translateX(100%);
4624
+ transition: transform 225ms ease-out;
4625
+ width: 100%;
3528
4626
  }
3529
- @media screen and (min-width: 610px) {
3530
- .ilo--modal--contents {
3531
- margin: 0 23.2%;
3532
- width: 53.58%;
4627
+ .ilo--search--open .ilo--search-box {
4628
+ transform: translateX(0);
4629
+ }
4630
+ @media screen and (min-width: 1024px) {
4631
+ .ilo--search-box {
4632
+ left: 0;
4633
+ padding: 32px 0;
4634
+ top: auto;
4635
+ transform: translateY(-100%);
4636
+ transition: transform 225ms ease-out;
4637
+ z-index: -1;
4638
+ }
4639
+ .ilo--header.ilo--search--open .ilo--search-box {
4640
+ transform: translateY(0);
3533
4641
  }
3534
4642
  }
4643
+ .ilo--search-box .ilo--header--inner {
4644
+ align-items: center;
4645
+ justify-content: center;
4646
+ padding: 80px 20px;
4647
+ }
4648
+
4649
+ .ilo--search {
4650
+ display: none;
4651
+ }
3535
4652
  @media screen and (min-width: 1024px) {
3536
- .ilo--modal--contents {
3537
- margin: 0 18.05%;
3538
- width: 63.888%;
4653
+ .ilo--search {
4654
+ display: flex;
3539
4655
  }
3540
4656
  }
3541
- .ilo--modal.storybook {
3542
- height: 400px;
3543
- width: 100%;
4657
+ .ilo--search--button {
4658
+ 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='M16.7068 15.257C17.6255 14.0506 18.1179 12.5734 18.1068 11.057C18.1201 10.1294 17.9488 9.20838 17.603 8.34753C17.2571 7.48667 16.7436 6.70315 16.0923 6.04251C15.4409 5.38187 14.6648 4.8573 13.8089 4.49928C12.9531 4.14126 12.0346 3.95694 11.1068 3.95703C9.2238 3.95703 7.41789 4.70506 6.08638 6.03657C4.75487 7.36808 4.00684 9.17399 4.00684 11.057C4.00684 12.9401 4.75487 14.746 6.08638 16.0775C7.41789 17.409 9.2238 18.157 11.1068 18.157C12.6258 18.1846 14.1082 17.6904 15.3068 16.757L18.3068 19.757C18.4938 19.9403 18.7451 20.0429 19.0068 20.0429C19.2686 20.0429 19.5199 19.9403 19.7068 19.757C19.8901 19.5701 19.9927 19.3188 19.9927 19.057C19.9927 18.7953 19.8901 18.544 19.7068 18.357L16.7068 15.257ZM11.1068 16.057C10.4419 16.0703 9.78091 15.9508 9.16269 15.7055C8.54448 15.4602 7.98142 15.094 7.50648 14.6284C7.03154 14.1628 6.65428 13.6071 6.39677 12.9938C6.13927 12.3806 6.0067 11.7221 6.00684 11.057C6.00684 9.70443 6.54416 8.40722 7.50059 7.45079C8.45703 6.49435 9.75423 5.95703 11.1068 5.95703C12.4594 5.95703 13.7566 6.49435 14.7131 7.45079C15.6695 8.40722 16.2068 9.70443 16.2068 11.057C16.207 11.7221 16.0744 12.3806 15.8169 12.9938C15.5594 13.6071 15.1821 14.1628 14.7072 14.6284C14.2323 15.094 13.6692 15.4602 13.051 15.7055C12.4328 15.9508 11.7718 16.0703 11.1068 16.057Z'/%3e%3c/svg%3e");
4659
+ appearance: none;
4660
+ background-color: transparent;
4661
+ background-position: center;
4662
+ background-repeat: no-repeat;
4663
+ background-size: 21.5px 21.5px;
4664
+ border: none;
4665
+ border-radius: 0;
4666
+ cursor: pointer;
4667
+ overflow: hidden;
4668
+ position: relative;
4669
+ text-indent: -999%;
4670
+ transition: all 150ms ease-out;
4671
+ }
4672
+ .ilo--search--button:hover, .ilo--search--button:focus {
4673
+ 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.7068 15.257C17.6255 14.0506 18.1179 12.5734 18.1068 11.057C18.1201 10.1294 17.9488 9.20838 17.603 8.34753C17.2571 7.48667 16.7436 6.70315 16.0923 6.04251C15.4409 5.38187 14.6648 4.8573 13.8089 4.49928C12.9531 4.14126 12.0346 3.95694 11.1068 3.95703C9.2238 3.95703 7.41789 4.70506 6.08638 6.03657C4.75487 7.36808 4.00684 9.17399 4.00684 11.057C4.00684 12.9401 4.75487 14.746 6.08638 16.0775C7.41789 17.409 9.2238 18.157 11.1068 18.157C12.6258 18.1846 14.1082 17.6904 15.3068 16.757L18.3068 19.757C18.4938 19.9403 18.7451 20.0429 19.0068 20.0429C19.2686 20.0429 19.5199 19.9403 19.7068 19.757C19.8901 19.5701 19.9927 19.3188 19.9927 19.057C19.9927 18.7953 19.8901 18.544 19.7068 18.357L16.7068 15.257ZM11.1068 16.057C10.4419 16.0703 9.78091 15.9508 9.16269 15.7055C8.54448 15.4602 7.98142 15.094 7.50648 14.6284C7.03154 14.1628 6.65428 13.6071 6.39677 12.9938C6.13927 12.3806 6.0067 11.7221 6.00684 11.057C6.00684 9.70443 6.54416 8.40722 7.50059 7.45079C8.45703 6.49435 9.75423 5.95703 11.1068 5.95703C12.4594 5.95703 13.7566 6.49435 14.7131 7.45079C15.6695 8.40722 16.2068 9.70443 16.2068 11.057C16.207 11.7221 16.0744 12.3806 15.8169 12.9938C15.5594 13.6071 15.1821 14.1628 14.7072 14.6284C14.2323 15.094 13.6692 15.4602 13.051 15.7055C12.4328 15.9508 11.7718 16.0703 11.1068 16.057Z'/%3e%3c/svg%3e");
4674
+ background-color: rgb(235, 245, 253);
4675
+ }
4676
+ .ilo--search--open .ilo--search--button {
4677
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(35, 0, 80)' d='M18 11H13V6H11V11H6V13H11V18H13V13H18V11Z'/%3e%3c/svg%3e");
4678
+ background-color: rgb(255, 255, 255);
4679
+ background-position: center;
4680
+ background-repeat: no-repeat;
4681
+ background-size: 21.5px 21.5px;
4682
+ }
4683
+ .ilo--search--open .ilo--search--button:hover, .ilo--search--open .ilo--search--button:focus {
4684
+ 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='M18 11H13V6H11V11H6V13H11V18H13V13H18V11Z'/%3e%3c/svg%3e");
4685
+ background-color: rgb(235, 245, 253);
3544
4686
  }
3545
4687
 
3546
4688
  /**
3547
4689
  * Do not edit directly
3548
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
4690
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3549
4691
  */
3550
4692
  /**
3551
4693
  * TOKENS:
@@ -3555,7 +4697,7 @@ body {
3555
4697
  */
3556
4698
  /**
3557
4699
  * Do not edit directly
3558
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
4700
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3559
4701
  */
3560
4702
  /**
3561
4703
  * TOKENS:
@@ -3565,7 +4707,7 @@ body {
3565
4707
  */
3566
4708
  /**
3567
4709
  * Do not edit directly
3568
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
4710
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3569
4711
  */
3570
4712
  /**
3571
4713
  * TOKENS:
@@ -3608,13 +4750,22 @@ body {
3608
4750
  padding: calc(1.2861736334rem + 2px) 1.2861736334rem;
3609
4751
  }
3610
4752
  .ilo--notification--inline {
3611
- width: 100%;
4753
+ max-width: 340px;
3612
4754
  }
3613
4755
  .ilo--notification--inline .ilo--notification--content {
3614
- align-items: center;
3615
- display: flex;
3616
- justify-items: space-between;
3617
- padding: 0.7502679528rem 1.2861736334rem;
4756
+ padding: calc(1.2861736334rem + 2px) 1.2861736334rem;
4757
+ }
4758
+ @media screen and (min-width: 610px) {
4759
+ .ilo--notification--inline {
4760
+ max-width: 100%;
4761
+ width: 100%;
4762
+ }
4763
+ .ilo--notification--inline .ilo--notification--content {
4764
+ align-items: center;
4765
+ display: flex;
4766
+ justify-items: space-between;
4767
+ padding: 0.7502679528rem 1.2861736334rem;
4768
+ }
3618
4769
  }
3619
4770
  .ilo--notification--content {
3620
4771
  margin-left: 2.1436227224rem;
@@ -3633,8 +4784,10 @@ body {
3633
4784
  width: 2.1436227224rem;
3634
4785
  top: 0;
3635
4786
  }
3636
- .ilo--notification--inline .ilo--notification--content:before {
3637
- background-position: center;
4787
+ @media screen and (min-width: 610px) {
4788
+ .ilo--notification--inline .ilo--notification--content:before {
4789
+ background-position: center;
4790
+ }
3638
4791
  }
3639
4792
  .icon--error .ilo--notification--content:before {
3640
4793
  background-color: rgb(250, 60, 75);
@@ -3657,26 +4810,34 @@ body {
3657
4810
  font-size: 16px;
3658
4811
  letter-spacing: normal;
3659
4812
  line-height: 23.36px;
3660
- }
3661
- .ilo--notification--dialog .ilo--notification--headline {
3662
4813
  margin-bottom: 0.6430868167rem;
3663
4814
  }
4815
+ @media screen and (min-width: 610px) {
4816
+ .ilo--notification--inline .ilo--notification--headline {
4817
+ margin-bottom: 0;
4818
+ }
4819
+ }
3664
4820
  .ilo--notification--copy {
3665
4821
  font-weight: 400;
3666
4822
  font-size: 14.93px;
3667
4823
  letter-spacing: normal;
3668
4824
  line-height: 20.3px;
3669
4825
  }
3670
- .ilo--notification--inline .ilo--notification--copy {
3671
- margin-left: 1.2861736334rem;
4826
+ @media screen and (min-width: 610px) {
4827
+ .ilo--notification--inline .ilo--notification--copy {
4828
+ margin-left: 1.2861736334rem;
4829
+ }
3672
4830
  }
3673
- .ilo--notification--dialog .ilo--notification--copy:not(:last-child) {
4831
+ .ilo--notification--copy:not(:last-child) {
3674
4832
  margin-bottom: 1.2861736334rem;
3675
4833
  }
3676
- .ilo--notification--inline .ilo--notification--copy:not(:last-child) {
3677
- max-width: 24%;
4834
+ @media screen and (min-width: 610px) {
4835
+ .ilo--notification--inline .ilo--notification--copy:not(:last-child) {
4836
+ margin-bottom: 0;
4837
+ max-width: 24%;
4838
+ }
3678
4839
  }
3679
- @media screen and (min-width: 1024px) {
4840
+ @media screen and (min-width: 610px) and (min-width: 1024px) {
3680
4841
  .ilo--notification--inline .ilo--notification--copy:not(:last-child) {
3681
4842
  max-width: 40%;
3682
4843
  }
@@ -3689,14 +4850,23 @@ body {
3689
4850
  letter-spacing: normal;
3690
4851
  line-height: 20.3px;
3691
4852
  }
3692
- .ilo--notification--inline .ilo--notification--date {
3693
- margin-left: 0.857449089rem;
4853
+ @media screen and (min-width: 610px) {
4854
+ .ilo--notification--inline .ilo--notification--date {
4855
+ margin-left: 0.857449089rem;
4856
+ }
3694
4857
  }
3695
- .ilo--notification--dialog .ilo--notification--date:not(:last-child) {
4858
+ .ilo--notification--date:not(:last-child) {
3696
4859
  margin-bottom: 1.0182207931rem;
3697
4860
  }
3698
- .ilo--notification--inline .ilo--notification--cta {
3699
- margin-left: 1.2861736334rem;
4861
+ @media screen and (min-width: 610px) {
4862
+ .ilo--notification--inline .ilo--notification--date {
4863
+ margin-bottom: 0;
4864
+ }
4865
+ }
4866
+ @media screen and (min-width: 610px) {
4867
+ .ilo--notification--inline .ilo--notification--cta {
4868
+ margin-left: 1.2861736334rem;
4869
+ }
3700
4870
  }
3701
4871
  .ilo--notification--close {
3702
4872
  background-color: rgb(237, 240, 242);
@@ -3729,7 +4899,7 @@ body {
3729
4899
 
3730
4900
  /**
3731
4901
  * Do not edit directly
3732
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
4902
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3733
4903
  */
3734
4904
  /**
3735
4905
  * TOKENS:
@@ -3864,7 +5034,7 @@ body {
3864
5034
 
3865
5035
  /**
3866
5036
  * Do not edit directly
3867
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
5037
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3868
5038
  */
3869
5039
  /**
3870
5040
  * TOKENS:
@@ -3993,7 +5163,7 @@ body {
3993
5163
 
3994
5164
  /**
3995
5165
  * Do not edit directly
3996
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
5166
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
3997
5167
  */
3998
5168
  /**
3999
5169
  * TOKENS:
@@ -4094,7 +5264,7 @@ body {
4094
5264
 
4095
5265
  /**
4096
5266
  * Do not edit directly
4097
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
5267
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
4098
5268
  */
4099
5269
  /**
4100
5270
  * TOKENS:
@@ -4153,7 +5323,7 @@ body {
4153
5323
 
4154
5324
  /**
4155
5325
  * Do not edit directly
4156
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
5326
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
4157
5327
  */
4158
5328
  /**
4159
5329
  * TOKENS:
@@ -4522,7 +5692,7 @@ body {
4522
5692
 
4523
5693
  /**
4524
5694
  * Do not edit directly
4525
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
5695
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
4526
5696
  */
4527
5697
  /**
4528
5698
  * TOKENS:
@@ -4566,7 +5736,7 @@ body {
4566
5736
 
4567
5737
  /**
4568
5738
  * Do not edit directly
4569
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
5739
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
4570
5740
  */
4571
5741
  /**
4572
5742
  * TOKENS:
@@ -4722,7 +5892,7 @@ Note that the styles for this component rely on CSS container queries, which cur
4722
5892
 
4723
5893
  /**
4724
5894
  * Do not edit directly
4725
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
5895
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
4726
5896
  */
4727
5897
  /**
4728
5898
  * TOKENS:
@@ -4737,7 +5907,7 @@ Note that the styles for this component rely on CSS container queries, which cur
4737
5907
  }
4738
5908
  .ilo--table--header {
4739
5909
  background-color: rgb(255, 255, 255);
4740
- padding: 24px 8px 24px 8px;
5910
+ padding: 19px 8px 24px 8px;
4741
5911
  }
4742
5912
  .ilo--table--wrapper {
4743
5913
  max-height: 380px;
@@ -4768,10 +5938,14 @@ Note that the styles for this component rely on CSS container queries, which cur
4768
5938
  font-size: 14.93px;
4769
5939
  letter-spacing: normal;
4770
5940
  line-height: 20.3px;
5941
+ letter-spacing: -0.02em;
4771
5942
  padding: 22px 11px 22px 11px;
4772
5943
  pointer-events: none;
4773
5944
  text-align: left;
4774
5945
  }
5946
+ .ilo--table--small .ilo--table--head--cell {
5947
+ padding: 13px 11px 13px 11px;
5948
+ }
4775
5949
  .ilo--table--head--cell:first-of-type {
4776
5950
  border-left: none;
4777
5951
  }
@@ -4816,19 +5990,28 @@ Note that the styles for this component rely on CSS container queries, which cur
4816
5990
  letter-spacing: normal;
4817
5991
  line-height: 20.3px;
4818
5992
  outline: 0;
4819
- padding: 14px 11px 14px 11px;
5993
+ padding: 22px 11px 22px 11px;
4820
5994
  position: relative;
4821
5995
  }
5996
+ .ilo--table--small .ilo--table--body--cell {
5997
+ padding: 13px 11px 13px 11px;
5998
+ }
4822
5999
  .ilo--table--body--cell:first-of-type {
4823
6000
  border-left: none;
4824
6001
  }
4825
6002
  .ilo--table--body--cell.numeric {
4826
6003
  text-align: right;
4827
6004
  }
6005
+ .ilo--table--body--cell:hover {
6006
+ background-color: rgb(190, 220, 250);
6007
+ border-bottom: 2px solid rgb(30, 45, 190);
6008
+ color: rgb(30, 45, 190);
6009
+ }
4828
6010
  .ilo--table--body--cell.selected {
4829
6011
  background-color: rgb(190, 220, 250);
4830
6012
  border-bottom: 2px solid rgb(30, 45, 190);
4831
6013
  color: rgb(30, 45, 190);
6014
+ cursor: pointer;
4832
6015
  }
4833
6016
  .ilo--table--body--cell.column--selected {
4834
6017
  background-color: rgb(235, 245, 253);
@@ -4931,6 +6114,7 @@ Note that the styles for this component rely on CSS container queries, which cur
4931
6114
  line-height: 24.26px;
4932
6115
  }
4933
6116
  .ilo--table--description {
6117
+ color: rgb(109, 109, 109);
4934
6118
  font-family: Noto Sans;
4935
6119
  font-weight: 400;
4936
6120
  font-size: 11.94px;
@@ -5027,7 +6211,7 @@ Note that the styles for this component rely on CSS container queries, which cur
5027
6211
  outline: none;
5028
6212
  }
5029
6213
  .ilo--table--zebra .ilo--table--body--row:nth-child(odd) {
5030
- background-color: rgb(237, 240, 242);
6214
+ background-color: rgb(246, 247, 248);
5031
6215
  }
5032
6216
  .ilo--table--zebra .ilo--table--body--row:nth-child(odd):hover, .ilo--table--zebra .ilo--table--body--row:nth-child(odd):focus {
5033
6217
  background-color: rgb(235, 245, 253);
@@ -5035,13 +6219,19 @@ Note that the styles for this component rely on CSS container queries, which cur
5035
6219
  .ilo--table--zebra .ilo--table--body--row:nth-child(odd) .ilo--table--body--cell {
5036
6220
  border-left: 0.0535905681rem solid rgb(255, 255, 255);
5037
6221
  }
5038
- .ilo--table--zebra .ilo--table--body--row:nth-child(odd) .ilo--table--body--cell:hover, .ilo--table--zebra .ilo--table--body--row:nth-child(odd) .ilo--table--body--cell:focus, .ilo--table--zebra .ilo--table--body--row:nth-child(odd) .ilo--table--body--cell.selected {
6222
+ .ilo--table--zebra .ilo--table--body--row:nth-child(odd) .ilo--table--body--cell:hover, .ilo--table--zebra .ilo--table--body--row:nth-child(odd) .ilo--table--body--cell:focus {
6223
+ background-color: rgb(190, 220, 250);
6224
+ }
6225
+ .ilo--table--zebra .ilo--table--body--row:nth-child(odd).selected .ilo--table--body--cell {
6226
+ background-color: rgb(235, 245, 253);
6227
+ }
6228
+ .ilo--table--zebra .ilo--table--body--row:nth-child(odd).selected .ilo--table--body--cell.selected {
5039
6229
  background-color: rgb(190, 220, 250);
5040
6230
  }
5041
6231
 
5042
6232
  /**
5043
6233
  * Do not edit directly
5044
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
6234
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
5045
6235
  */
5046
6236
  /**
5047
6237
  * TOKENS:
@@ -5106,7 +6296,7 @@ Note that the styles for this component rely on CSS container queries, which cur
5106
6296
 
5107
6297
  /**
5108
6298
  * Do not edit directly
5109
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
6299
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
5110
6300
  */
5111
6301
  /**
5112
6302
  * TOKENS:
@@ -5267,7 +6457,7 @@ Note that the styles for this component rely on CSS container queries, which cur
5267
6457
 
5268
6458
  /**
5269
6459
  * Do not edit directly
5270
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
6460
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
5271
6461
  */
5272
6462
  /**
5273
6463
  * TOKENS:
@@ -5426,7 +6616,7 @@ Note that the styles for this component rely on CSS container queries, which cur
5426
6616
 
5427
6617
  /**
5428
6618
  * Do not edit directly
5429
- * Generated on Tue, 25 Oct 2022 15:49:45 GMT
6619
+ * Generated on Tue, 01 Nov 2022 17:17:35 GMT
5430
6620
  */
5431
6621
  /**
5432
6622
  * TOKENS: