@ilo-org/styles 0.6.1 → 0.7.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.
Files changed (37) hide show
  1. package/build/css/components/index.css +782 -1092
  2. package/build/css/components/index.css.map +1 -1
  3. package/build/css/global.css +1 -1
  4. package/build/css/index.css +782 -1092
  5. package/build/css/index.css.map +1 -1
  6. package/build/css/monorepo.css +782 -1092
  7. package/build/css/monorepo.css.map +1 -1
  8. package/build/minified/index.css +1 -1
  9. package/build/minified/index.css.map +1 -1
  10. package/build/minified/monorepo.css +1 -1
  11. package/build/minified/monorepo.css.map +1 -1
  12. package/css/components/card.css +1 -1
  13. package/css/components/cardgroup.css +1 -1
  14. package/css/components/herocard.css +1 -1
  15. package/css/global.css.map +1 -1
  16. package/css/index.css +1 -1
  17. package/css/index.css.map +1 -1
  18. package/css/monorepo.css +1 -1
  19. package/css/monorepo.css.map +1 -1
  20. package/package.json +1 -1
  21. package/scss/_mixins.scss +19 -20
  22. package/scss/components/_card.scss +79 -1376
  23. package/scss/components/_cardgroup.scss +66 -24
  24. package/scss/components/_datacard.scss +90 -0
  25. package/scss/components/_detailcard.scss +150 -0
  26. package/scss/components/_factlistcard.scss +110 -0
  27. package/scss/components/_featurecard.scss +218 -0
  28. package/scss/components/_herocard.scss +3 -19
  29. package/scss/components/_multilinkcard.scss +189 -0
  30. package/scss/components/_promocard.scss +157 -0
  31. package/scss/components/_statcard.scss +76 -0
  32. package/scss/components/_textcard.scss +135 -0
  33. package/scss/components/index.scss +8 -0
  34. package/css/components/experiment.css +0 -1
  35. package/css/components/formcontrol.css +0 -1
  36. package/css/components/textinput.css +0 -1
  37. package/css/components/toggle.css +0 -1
package/build/css/monorepo.css CHANGED
@@ -151,7 +151,7 @@ select {
151
151
  }
152
152
  /**
153
153
  * Do not edit directly
154
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
154
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
253
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
254
254
  */
255
255
  /**
256
256
  * TOKENS:
@@ -369,7 +369,7 @@ body {
369
369
 
370
370
  /**
371
371
  * Do not edit directly
372
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
372
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
373
373
  */
374
374
  /**
375
375
  * TOKENS:
@@ -394,7 +394,7 @@ body {
394
394
  }
395
395
  /**
396
396
  * Do not edit directly
397
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
397
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
398
398
  */
399
399
  /**
400
400
  * TOKENS:
@@ -648,7 +648,7 @@ body {
648
648
 
649
649
  /**
650
650
  * Do not edit directly
651
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
651
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
652
652
  */
653
653
  /**
654
654
  * TOKENS:
@@ -658,7 +658,7 @@ body {
658
658
  */
659
659
  /**
660
660
  * Do not edit directly
661
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
661
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
662
662
  */
663
663
  /**
664
664
  * TOKENS:
@@ -683,7 +683,7 @@ body {
683
683
  }
684
684
  /**
685
685
  * Do not edit directly
686
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
686
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
687
687
  */
688
688
  /**
689
689
  * TOKENS:
@@ -973,7 +973,7 @@ body {
973
973
 
974
974
  /**
975
975
  * Do not edit directly
976
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
976
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
977
977
  */
978
978
  /**
979
979
  * TOKENS:
@@ -1103,7 +1103,7 @@ body {
1103
1103
 
1104
1104
  /**
1105
1105
  * Do not edit directly
1106
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
1106
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1107
1107
  */
1108
1108
  /**
1109
1109
  * TOKENS:
@@ -1112,37 +1112,75 @@ body {
1112
1112
  * MAPS:
1113
1113
  */
1114
1114
  .ilo--card {
1115
- margin: 0;
1115
+ box-sizing: border-box;
1116
+ position: relative;
1117
+ max-width: var(--max-width);
1118
+ flex: 1 1 var(--max-width);
1119
+ }
1120
+ .ilo--card__size__fluid {
1121
+ --max-width: 100% !important;
1116
1122
  }
1117
1123
  .right-to-left .ilo--card {
1118
1124
  text-align: right;
1119
1125
  }
1120
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat), .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat), .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) {
1126
+ .ilo--card__action:hover, .ilo--card__action:focus, .ilo--card__action:focus-within {
1121
1127
  background: rgb(255, 255, 255);
1122
- color: rgb(30, 45, 190);
1123
1128
  outline: none;
1124
1129
  text-decoration: none;
1125
1130
  }
1126
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist), .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist), .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist) {
1131
+ .ilo--card__action:hover.ilo--card__dark, .ilo--card__action:focus.ilo--card__dark, .ilo--card__action:focus-within.ilo--card__dark {
1127
1132
  background: rgb(255, 255, 255);
1128
1133
  }
1129
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist).ilo--card--cornercut::after, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist).ilo--card--cornercut::after, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat).ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(.ilo--card--factlist).ilo--card--cornercut::after {
1130
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1131
- }
1132
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eyebrow, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eyebrow, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eyebrow {
1134
+ .ilo--card__action:hover .ilo--card--eyebrow,
1135
+ .ilo--card__action:hover .ilo--card--title,
1136
+ .ilo--card__action:hover .ilo--card--intro,
1137
+ .ilo--card__action:hover .ilo--card--date,
1138
+ .ilo--card__action:hover .ilo--card--date-extra, .ilo--card__action:focus .ilo--card--eyebrow,
1139
+ .ilo--card__action:focus .ilo--card--title,
1140
+ .ilo--card__action:focus .ilo--card--intro,
1141
+ .ilo--card__action:focus .ilo--card--date,
1142
+ .ilo--card__action:focus .ilo--card--date-extra, .ilo--card__action:focus-within .ilo--card--eyebrow,
1143
+ .ilo--card__action:focus-within .ilo--card--title,
1144
+ .ilo--card__action:focus-within .ilo--card--intro,
1145
+ .ilo--card__action:focus-within .ilo--card--date,
1146
+ .ilo--card__action:focus-within .ilo--card--date-extra {
1133
1147
  color: rgb(30, 45, 190);
1134
1148
  }
1135
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--title, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--title, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--title {
1136
- color: rgb(30, 45, 190);
1149
+ .ilo--card__theme__light {
1150
+ background: rgb(255, 255, 255);
1137
1151
  }
1138
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--intro, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--intro, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--intro {
1139
- color: rgb(30, 45, 190);
1152
+ .ilo--card__theme__dark {
1153
+ background: rgb(35, 0, 80);
1154
+ transition: background 150ms ease-out;
1140
1155
  }
1141
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--date, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--date, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--date {
1142
- color: rgb(30, 45, 190);
1156
+ .ilo--card__theme__dark .ilo--card--eyebrow,
1157
+ .ilo--card__theme__dark .ilo--card--title,
1158
+ .ilo--card__theme__dark .ilo--card--intro,
1159
+ .ilo--card__theme__dark .ilo--card--date,
1160
+ .ilo--card__theme__dark .ilo--card--eventdate {
1161
+ color: rgb(237, 240, 242);
1162
+ transition: color 150ms ease-out;
1143
1163
  }
1144
- .ilo--card--action:hover:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eventdate, .ilo--card--action:focus:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eventdate, .ilo--card--action:focus-within:not(.ilo--card--data):not(.ilo--card--stat) .ilo--card--eventdate {
1145
- color: rgb(30, 45, 190);
1164
+ .ilo--card__isvideo .ilo--card--image--wrapper {
1165
+ position: relative;
1166
+ }
1167
+ .ilo--card__isvideo .ilo--card--image--wrapper::before {
1168
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(237, 240, 242)' d='M22 11.9999L4 2V22L22 11.9999Z'/%3e%3c/svg%3e");
1169
+ background-color: rgb(45, 45, 45);
1170
+ background-position: center;
1171
+ background-size: 18px 20px;
1172
+ background-repeat: no-repeat;
1173
+ content: "";
1174
+ display: block;
1175
+ height: 40px;
1176
+ left: 0;
1177
+ position: absolute;
1178
+ top: 0;
1179
+ width: 40px;
1180
+ z-index: 1;
1181
+ }
1182
+ .ilo--card--wrapper:hover, .ilo--card--wrapper:focus, .ilo--card--wrapper:focus-within {
1183
+ filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1146
1184
  }
1147
1185
  .ilo--card--link {
1148
1186
  background: none;
@@ -1164,6 +1202,21 @@ body {
1164
1202
  transition-duration: 150ms;
1165
1203
  transition-timing-function: ease-out;
1166
1204
  }
1205
+ .ilo--card--link:hover + .ilo--card--wrap .ilo--card--eyebrow, .ilo--card--link:focus + .ilo--card--wrap .ilo--card--eyebrow, .ilo--card--link:focus-within + .ilo--card--wrap .ilo--card--eyebrow {
1206
+ color: rgb(30, 45, 190);
1207
+ }
1208
+ .ilo--card--link:hover + .ilo--card--wrap .ilo--card--title, .ilo--card--link:focus + .ilo--card--wrap .ilo--card--title, .ilo--card--link:focus-within + .ilo--card--wrap .ilo--card--title {
1209
+ color: rgb(30, 45, 190);
1210
+ }
1211
+ .ilo--card--link:hover + .ilo--card--wrap .ilo--card--intro, .ilo--card--link:focus + .ilo--card--wrap .ilo--card--intro, .ilo--card--link:focus-within + .ilo--card--wrap .ilo--card--intro {
1212
+ color: rgb(30, 45, 190);
1213
+ }
1214
+ .ilo--card--link:hover + .ilo--card--wrap .ilo--card--date, .ilo--card--link:focus + .ilo--card--wrap .ilo--card--date, .ilo--card--link:focus-within + .ilo--card--wrap .ilo--card--date {
1215
+ color: rgb(30, 45, 190);
1216
+ }
1217
+ .ilo--card--link:hover + .ilo--card--wrap .ilo--card--eventdate, .ilo--card--link:focus + .ilo--card--wrap .ilo--card--eventdate, .ilo--card--link:focus-within + .ilo--card--wrap .ilo--card--eventdate {
1218
+ color: rgb(30, 45, 190);
1219
+ }
1167
1220
  .ilo--card--link--text {
1168
1221
  width: 1px;
1169
1222
  height: 1px;
@@ -1174,176 +1227,6 @@ body {
1174
1227
  clip: rect(0 0 0 0);
1175
1228
  overflow: hidden;
1176
1229
  }
1177
- .ilo--card--light {
1178
- background: rgb(255, 255, 255);
1179
- }
1180
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) {
1181
- background: rgb(35, 0, 80);
1182
- outline: none;
1183
- transition: background 150ms ease-out;
1184
- }
1185
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--eyebrow {
1186
- color: rgb(237, 240, 242);
1187
- transition: color 150ms ease-out;
1188
- }
1189
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--title {
1190
- color: rgb(255, 255, 255);
1191
- transition: color 150ms ease-out;
1192
- }
1193
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--intro {
1194
- color: rgb(237, 240, 242);
1195
- transition: color 150ms ease-out;
1196
- }
1197
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--date {
1198
- color: rgb(237, 240, 242);
1199
- transition: color 150ms ease-out;
1200
- }
1201
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) .ilo--card--eventdate {
1202
- color: rgb(237, 240, 242);
1203
- transition: color 150ms ease-out;
1204
- }
1205
- .ilo--card--dark:not(.ilo--card--action), .ilo--card--dark:not(.ilo--card--action):hover, .ilo--card--dark:not(.ilo--card--action):focus, .ilo--card--dark:not(.ilo--card--action):focus-within {
1206
- background: rgb(35, 0, 80);
1207
- outline: none;
1208
- transition: background 150ms ease-out;
1209
- }
1210
- .ilo--card--dark:not(.ilo--card--action) .ilo--card--eyebrow, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--eyebrow, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--eyebrow, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--eyebrow {
1211
- color: rgb(237, 240, 242);
1212
- transition: color 150ms ease-out;
1213
- }
1214
- .ilo--card--dark:not(.ilo--card--action) .ilo--card--title, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--title, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--title, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--title {
1215
- color: rgb(255, 255, 255);
1216
- transition: color 150ms ease-out;
1217
- }
1218
- .ilo--card--dark:not(.ilo--card--action) .ilo--card--intro, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--intro, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--intro, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--intro {
1219
- color: rgb(237, 240, 242);
1220
- transition: color 150ms ease-out;
1221
- }
1222
- .ilo--card--dark:not(.ilo--card--action) .ilo--card--date, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--date, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--date, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--date {
1223
- color: rgb(237, 240, 242);
1224
- transition: color 150ms ease-out;
1225
- }
1226
- .ilo--card--dark:not(.ilo--card--action) .ilo--card--eventdate, .ilo--card--dark:not(.ilo--card--action):hover .ilo--card--eventdate, .ilo--card--dark:not(.ilo--card--action):focus .ilo--card--eventdate, .ilo--card--dark:not(.ilo--card--action):focus-within .ilo--card--eventdate {
1227
- color: rgb(237, 240, 242);
1228
- transition: color 150ms ease-out;
1229
- }
1230
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
1231
- margin-top: 2.1436227224rem;
1232
- padding-top: 0;
1233
- position: relative;
1234
- }
1235
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1236
- background: inherit;
1237
- content: "";
1238
- display: block;
1239
- height: 40px;
1240
- position: absolute;
1241
- width: calc(100% - 73px);
1242
- }
1243
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1244
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1245
- background-position: bottom right;
1246
- background-size: cover;
1247
- content: "";
1248
- height: 40px;
1249
- display: block;
1250
- position: absolute;
1251
- width: 73.4px;
1252
- }
1253
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1254
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1255
- }
1256
- @media screen and (min-width: 610px) {
1257
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
1258
- margin-top: 2.5723472669rem;
1259
- }
1260
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1261
- background: inherit;
1262
- content: "";
1263
- display: block;
1264
- height: 48px;
1265
- position: absolute;
1266
- width: calc(100% - 87px);
1267
- }
1268
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1269
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1270
- background-position: bottom right;
1271
- background-size: cover;
1272
- content: "";
1273
- height: 48px;
1274
- display: block;
1275
- position: absolute;
1276
- width: 87.4px;
1277
- }
1278
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1279
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1280
- }
1281
- }
1282
- @media screen and (min-width: 1024px) {
1283
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
1284
- margin-top: 3.4297963558rem;
1285
- }
1286
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1287
- background: inherit;
1288
- content: "";
1289
- display: block;
1290
- height: 64px;
1291
- position: absolute;
1292
- width: calc(100% - 116px);
1293
- }
1294
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1295
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1296
- background-position: bottom right;
1297
- background-size: cover;
1298
- content: "";
1299
- height: 64px;
1300
- display: block;
1301
- position: absolute;
1302
- width: 116.4px;
1303
- }
1304
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1305
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1306
- }
1307
- }
1308
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1309
- left: 0;
1310
- top: -2.1436227224rem;
1311
- transition: background-image 150ms ease-out;
1312
- }
1313
- .right-to-left .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1314
- left: auto;
1315
- right: 0;
1316
- }
1317
- @media screen and (min-width: 610px) {
1318
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1319
- top: -2.5562700965rem;
1320
- }
1321
- }
1322
- @media screen and (min-width: 1024px) {
1323
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1324
- top: -3.4137191854rem;
1325
- }
1326
- }
1327
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1328
- right: 0;
1329
- top: -2.1436227224rem;
1330
- transition: background-image 150ms ease-out;
1331
- }
1332
- .right-to-left .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1333
- left: 0;
1334
- right: auto;
1335
- transform: rotateY(180deg);
1336
- }
1337
- @media screen and (min-width: 610px) {
1338
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1339
- top: -2.5562700965rem;
1340
- }
1341
- }
1342
- @media screen and (min-width: 1024px) {
1343
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1344
- top: -3.4137191854rem;
1345
- }
1346
- }
1347
1230
  .ilo--card--eyebrow {
1348
1231
  color: rgb(150, 10, 85);
1349
1232
  font-size: 16px;
@@ -1416,7 +1299,7 @@ body {
1416
1299
  line-height: 23.36px;
1417
1300
  margin-bottom: 1.3742266073rem;
1418
1301
  }
1419
- .ilo--card--image {
1302
+ .ilo--card--picture {
1420
1303
  max-width: 100%;
1421
1304
  width: 100%;
1422
1305
  }
@@ -1424,190 +1307,131 @@ body {
1424
1307
  position: relative;
1425
1308
  z-index: 2;
1426
1309
  }
1427
- .ilo--card--isvideo .ilo--card--image--wrapper {
1310
+
1311
+ /**
1312
+ * Do not edit directly
1313
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1314
+ */
1315
+ /**
1316
+ * TOKENS:
1317
+ */
1318
+ /**
1319
+ * MAPS:
1320
+ */
1321
+ .ilo--card__type__feature {
1322
+ --max-width: 22.0793140407rem;
1323
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1324
+ display: flex;
1325
+ margin-top: 0;
1428
1326
  position: relative;
1429
1327
  }
1430
- .ilo--card--isvideo .ilo--card--image--wrapper::before {
1431
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(237, 240, 242)' d='M22 11.9999L4 2V22L22 11.9999Z'/%3e%3c/svg%3e");
1432
- background-color: rgb(45, 45, 45);
1433
- background-position: center;
1434
- background-size: 18px 20px;
1435
- background-repeat: no-repeat;
1436
- content: "";
1437
- display: block;
1438
- height: 40px;
1439
- left: 0;
1440
- position: absolute;
1441
- top: 0;
1442
- width: 40px;
1443
- z-index: 1;
1328
+ .ilo--card__type__feature.ilo--card__theme__dark {
1329
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1444
1330
  }
1445
- .ilo--card--multilink {
1446
- padding: 1.2861736334rem;
1331
+ .ilo--card__type__feature.ilo--card__theme__dark .ilo--link-list {
1332
+ border-top: 2px solid rgba(237, 240, 242, 0.25);
1447
1333
  }
1448
- .ilo--card--multilink .ilo--card--image--wrapper {
1449
- display: none;
1334
+ .ilo--card__type__feature.ilo--card__theme__dark .ilo--link-list--link {
1335
+ color: rgb(255, 255, 255);
1336
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(255, 255, 255)' d='M8.63792 19.9964L7.6499 19.0082L14.6571 11.9999L7.6499 4.99159L8.63792 4.00342L16.1426 11.5023C16.2083 11.5675 16.2604 11.645 16.296 11.7304C16.3316 11.8158 16.3499 11.9074 16.3499 11.9999C16.3499 12.0924 16.3316 12.184 16.296 12.2694C16.2604 12.3548 16.2083 12.4324 16.1426 12.4975L8.63792 19.9964Z'/%3e%3c/svg%3e");
1450
1337
  }
1451
- .ilo--card--multilink .ilo--card--content .ilo--card--image--wrapper {
1452
- display: block;
1338
+ .ilo--card__type__feature.ilo--card__theme__dark:hover .ilo--link-list--link, .ilo--card__type__feature.ilo--card__theme__dark:focus .ilo--link-list--link, .ilo--card__type__feature.ilo--card__theme__dark:focus-within .ilo--link-list--link {
1339
+ color: rgb(30, 45, 190);
1340
+ 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");
1453
1341
  }
1454
- @media screen and (min-width: 610px) {
1455
- .ilo--card--multilink {
1456
- padding: 2.1436227224rem;
1457
- }
1342
+ .ilo--card__type__feature picture::before {
1343
+ transition-property: opacity;
1344
+ transition-duration: 150ms;
1345
+ transition-timing-function: ease-out;
1458
1346
  }
1459
- @media screen and (min-width: 1024px) {
1460
- .ilo--card--multilink {
1461
- padding: 3.0010718114rem 2.5723472669rem;
1462
- }
1347
+ .ilo--card__type__feature:hover, .ilo--card__type__feature:focus, .ilo--card__type__feature:focus-within {
1348
+ background-color: rgb(255, 255, 255);
1349
+ border-bottom: 0.1607717042rem solid rgb(30, 45, 190);
1350
+ filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1463
1351
  }
1464
- .ilo--card--multilink .ilo--card--title {
1465
- font-size: 23.32px;
1466
- letter-spacing: -0.035em;
1467
- line-height: 29.15px;
1468
- margin-bottom: 0.7188906752rem;
1469
- color: rgb(45, 45, 45);
1352
+ .ilo--card__type__feature:hover picture::before, .ilo--card__type__feature:focus picture::before, .ilo--card__type__feature:focus-within picture::before {
1353
+ opacity: 0.4;
1354
+ z-index: 1;
1355
+ transition-property: opacity;
1356
+ transition-duration: 150ms;
1357
+ transition-timing-function: ease-out;
1470
1358
  }
1471
- @media screen and (min-width: 610px) {
1472
- .ilo--card--multilink .ilo--card--title {
1473
- font-size: 29.16px;
1474
- letter-spacing: -0.035em;
1475
- line-height: 36.45px;
1476
- margin-bottom: 0.5741425509rem;
1477
- }
1359
+ .ilo--card__type__feature:hover .ilo--card--picture, .ilo--card__type__feature:focus .ilo--card--picture, .ilo--card__type__feature:focus-within .ilo--card--picture {
1360
+ filter: saturate(0);
1478
1361
  }
1479
- .ilo--card--multilink .ilo--card--intro {
1480
- font-size: 16px;
1481
- letter-spacing: normal;
1482
- line-height: 23.36px;
1483
- margin-bottom: 1.910132288rem;
1484
- color: rgb(45, 45, 45);
1362
+ .ilo--card__type__feature .ilo--link-list {
1363
+ border-top: 0.1071811361rem solid rgb(237, 240, 242);
1364
+ margin-left: -1.2861736334rem;
1365
+ margin-right: -1.2861736334rem;
1366
+ margin-top: 1.822079314rem;
1367
+ position: relative;
1368
+ z-index: 2;
1485
1369
  }
1486
- @media screen and (min-width: 610px) {
1487
- .ilo--card--multilink .ilo--card--intro {
1488
- font-size: 18.66px;
1489
- letter-spacing: normal;
1490
- line-height: 27.24px;
1491
- margin-bottom: 1.8685411561rem;
1492
- }
1370
+ .ilo--card__type__feature .ilo--link-list--link, .ilo--card__type__feature .ilo--link-list--link:hover {
1371
+ border-bottom: none;
1372
+ padding-left: 1.2861736334rem;
1373
+ padding-right: 1.2861736334rem;
1493
1374
  }
1494
- .ilo--card--multilink.ilo--card--dark {
1495
- background: rgb(255, 255, 255);
1375
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--wrap {
1376
+ display: flex;
1377
+ flex-wrap: wrap;
1378
+ width: 100%;
1496
1379
  }
1497
- .ilo--card--multilink.ilo--card--dark .ilo--card--title {
1498
- color: rgb(45, 45, 45);
1380
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--content {
1381
+ width: 100%;
1499
1382
  }
1500
- .ilo--card--multilink.ilo--card--dark .ilo--card--intro {
1501
- color: rgb(45, 45, 45);
1383
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--image--wrapper {
1384
+ width: 100%;
1502
1385
  }
1503
- .ilo--card--multilink.ilo--card--wide {
1504
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1386
+ .ilo--card__type__feature.ilo--card__size__wide, .ilo--card__type__feature.ilo--card__size__fluid {
1387
+ --max-width: 40.4072883173rem;
1505
1388
  }
1506
1389
  @media screen and (min-width: 610px) {
1507
- .ilo--card--multilink.ilo--card--wide {
1508
- padding: 3.0010718114rem 2.5723472669rem;
1509
- }
1510
- .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1511
- flex-direction: row-reverse;
1512
- }
1513
- .right-to-left .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1390
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--wrap, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--wrap {
1514
1391
  flex-direction: row;
1515
1392
  }
1516
- .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1517
- display: flex;
1518
- column-gap: 1.7148981779rem;
1519
- }
1520
- .right-to-left .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1393
+ .right-to-left .ilo--card__type__feature.ilo--card__size__wide .ilo--card--wrap, .right-to-left .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--wrap {
1521
1394
  flex-direction: row-reverse;
1522
1395
  }
1523
- .ilo--card--multilink.ilo--card--wide .ilo--card--image--wrapper {
1524
- display: block;
1396
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--content, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--content {
1397
+ display: flex;
1398
+ flex-direction: row;
1399
+ flex-wrap: wrap;
1400
+ position: relative;
1525
1401
  width: 50%;
1526
1402
  }
1527
- .ilo--card--multilink.ilo--card--wide .ilo--card--content {
1403
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--image--wrapper {
1528
1404
  width: 50%;
1529
1405
  }
1530
- .ilo--card--multilink.ilo--card--wide .ilo--card--content .ilo--card--image--wrapper {
1531
- display: none;
1406
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--image, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--image {
1407
+ object-fit: cover;
1532
1408
  }
1533
- }
1534
- .ilo--card--multilink.ilo--card--standard {
1535
- padding: 2.5723472669rem 2.1436227224rem;
1536
- }
1537
- @media screen and (min-width: 610px) {
1538
- .ilo--card--multilink.ilo--card--standard {
1539
- padding: 2.5723472669rem 2.1436227224rem;
1540
- }
1541
- }
1542
- @media screen and (min-width: 1024px) {
1543
- .ilo--card--multilink.ilo--card--standard {
1544
- padding: 2.5723472669rem 2.1436227224rem;
1545
- }
1546
- }
1547
- .ilo--card--multilink.ilo--card--narrow {
1548
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1549
- }
1550
- @media screen and (min-width: 610px) {
1551
- .ilo--card--multilink.ilo--card--narrow {
1552
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1553
- }
1554
- }
1555
- @media screen and (min-width: 1024px) {
1556
- .ilo--card--multilink.ilo--card--narrow {
1557
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1409
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--date, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--date {
1410
+ align-self: flex-end;
1411
+ width: 100%;
1558
1412
  }
1559
- }
1560
- .ilo--card--multilink.ilo--card--narrow .ilo--card--image--wrapper {
1561
- display: none;
1562
- }
1563
- .ilo--card--multilink.ilo--card--narrow .ilo--card--content .ilo--card--image--wrapper {
1564
- display: block;
1565
- margin-bottom: 1.2861736334rem;
1566
- }
1567
- @media screen and (min-width: 610px) {
1568
- .ilo--card--multilink.ilo--card--narrow .ilo--card--title {
1569
- font-size: 23.32px;
1570
- letter-spacing: -0.035em;
1571
- line-height: 29.15px;
1572
- margin-bottom: 0.7188906752rem;
1413
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--eyebrow, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--eyebrow {
1414
+ width: 100%;
1573
1415
  }
1574
- }
1575
- @media screen and (min-width: 610px) {
1576
- .ilo--card--multilink.ilo--card--narrow .ilo--card--intro {
1577
- font-size: 16px;
1578
- letter-spacing: normal;
1579
- line-height: 23.36px;
1580
- margin-bottom: 1.910132288rem;
1416
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--title, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--title {
1417
+ width: 100%;
1581
1418
  }
1582
- }
1583
- .ilo--card--multilink .ilo--link-list {
1584
- margin-top: 1.8756698821rem;
1585
- }
1586
- .ilo--card--detail {
1587
- border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1588
- padding: 1.2861736334rem 0;
1589
- position: relative;
1590
- }
1591
- @media screen and (min-width: 1024px) {
1592
- .ilo--card--detail {
1593
- padding: 1.7148981779rem 0;
1419
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--link-list, .ilo--card__type__feature.ilo--card__size__fluid .ilo--link-list {
1420
+ width: calc(100% + 48px);
1421
+ align-self: flex-end;
1594
1422
  }
1595
1423
  }
1596
- .ilo--card--detail:hover, .ilo--card--detail:focus, .ilo--card--detail:focus-within {
1597
- filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1598
- }
1599
- .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before, .ilo--card--detail:focus-within picture::before {
1600
- opacity: 0.4;
1601
- z-index: 2;
1602
- }
1603
- .ilo--card--detail:hover .ilo--card--event-date::before, .ilo--card--detail:focus .ilo--card--event-date::before, .ilo--card--detail:focus-within .ilo--card--event-date::before {
1604
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 11'%3e%3cpath fill='rgb(30, 45, 190)' d='M6.00007 10.8462L12 0L0 0L6.00007 10.8462Z'/%3e%3c/svg%3e");
1424
+ .ilo--card__type__feature .ilo--card--wrap {
1425
+ display: flex;
1426
+ flex-direction: column;
1427
+ width: 100%;
1605
1428
  }
1606
- .ilo--card--detail picture {
1429
+ .ilo--card__type__feature picture {
1607
1430
  display: flex;
1431
+ height: 100%;
1608
1432
  position: relative;
1609
1433
  }
1610
- .ilo--card--detail picture::before {
1434
+ .ilo--card__type__feature picture::before {
1611
1435
  background-color: rgb(30, 45, 190);
1612
1436
  content: "";
1613
1437
  display: block;
@@ -1616,725 +1440,590 @@ body {
1616
1440
  opacity: 0;
1617
1441
  position: absolute;
1618
1442
  top: 0;
1443
+ transition: opacity 150ms ease-in-out;
1619
1444
  width: 100%;
1620
1445
  z-index: -1;
1621
- transition-property: opacity;
1622
- transition-duration: 150ms;
1623
- transition-timing-function: ease-out;
1624
1446
  }
1625
- .ilo--card--detail .ilo--card--wrap {
1447
+ .ilo--card__type__feature .ilo--card--content {
1626
1448
  display: flex;
1449
+ flex: 1 1 auto;
1450
+ flex-direction: column;
1451
+ padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
1627
1452
  }
1628
- .right-to-left .ilo--card--detail .ilo--card--wrap {
1629
- flex-direction: row-reverse;
1453
+ .ilo--card__type__feature.ilo--card__linklist .ilo--card--content {
1454
+ padding-bottom: 0;
1630
1455
  }
1631
- .ilo--card--detail .ilo--card--image {
1632
- object-fit: contain;
1633
- width: 4.1264737406rem;
1456
+ .ilo--card__type__feature .ilo--card--title {
1457
+ font-size: 23.32px;
1458
+ letter-spacing: -0.035em;
1459
+ line-height: 29.15px;
1460
+ margin-bottom: 1.5763397642rem;
1461
+ font-family: Overpass;
1462
+ font-weight: 700;
1634
1463
  }
1635
- @media screen and (min-width: 1024px) {
1636
- .ilo--card--detail .ilo--card--image {
1637
- width: 10.718113612rem;
1464
+ .ilo--card__type__feature .ilo--card--eyebrow {
1465
+ font-size: 14.93px;
1466
+ letter-spacing: normal;
1467
+ line-height: 19.71px;
1468
+ margin-bottom: 0.3376482577rem;
1469
+ }
1470
+ .ilo--card__type__feature .ilo--card--date {
1471
+ margin-bottom: 0;
1472
+ margin-top: auto;
1473
+ }
1474
+
1475
+ /**
1476
+ * Do not edit directly
1477
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1478
+ */
1479
+ /**
1480
+ * TOKENS:
1481
+ */
1482
+ /**
1483
+ * MAPS:
1484
+ */
1485
+ .ilo--card__type__text {
1486
+ --max-width: 16.1307609861rem;
1487
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1488
+ padding: 1.2861736334rem 2.1436227224rem;
1489
+ clip-path: polygon(0 0, calc(100% - 73px) 0, 100% 40px, 100% 100%, 0 100%);
1490
+ }
1491
+ .ilo--card__type__text [class$=profile--contents--light] * {
1492
+ color: rgb(45, 45, 45);
1493
+ }
1494
+ .ilo--card__type__text [class$=profile--contents--dark] * {
1495
+ color: rgb(255, 255, 255);
1496
+ }
1497
+ .ilo--card__type__text:hover, .ilo--card__type__text:focus, .ilo--card__type__text:focus-within {
1498
+ filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1499
+ }
1500
+ .ilo--card__type__text:hover [class*=profile--contents] *, .ilo--card__type__text:focus [class*=profile--contents] *, .ilo--card__type__text:focus-within [class*=profile--contents] * {
1501
+ color: rgb(30, 45, 190);
1502
+ }
1503
+ @media screen and (min-width: 610px) {
1504
+ .ilo--card__type__text {
1505
+ padding: 1.7148981779rem 2.1436227224rem;
1638
1506
  }
1639
1507
  }
1640
- .ilo--card--detail .ilo--card--image--wrapper {
1641
- max-width: 4.1264737406rem;
1642
- width: 100%;
1508
+ .ilo--card__type__text.ilo--card__size__wide, .ilo--card__type__text.ilo--card__size__fluid {
1509
+ --max-width: 28.0278670954rem;
1510
+ padding: 1.7148981779rem 2.1436227224rem;
1643
1511
  }
1644
- @media screen and (min-width: 1024px) {
1645
- .ilo--card--detail .ilo--card--image--wrapper {
1646
- max-width: 10.718113612rem;
1512
+ @media screen and (min-width: 610px) {
1513
+ .ilo--card__type__text.ilo--card__size__wide, .ilo--card__type__text.ilo--card__size__fluid {
1514
+ padding: 1.7148981779rem 2.1436227224rem;
1647
1515
  }
1648
1516
  }
1649
- .ilo--card--detail .ilo--card--content {
1650
- padding: 0 1.2861736334rem;
1517
+ .ilo--card__type__text.ilo--card__size__narrow {
1518
+ --max-width: 16.1307609861rem;
1519
+ padding: 1.2861736334rem 2.1436227224rem;
1651
1520
  }
1652
- .ilo--card--detail .ilo--card--title {
1521
+ @media screen and (min-width: 610px) {
1522
+ .ilo--card__type__text.ilo--card__size__narrow {
1523
+ padding: 1.2861736334rem 2.1436227224rem;
1524
+ }
1525
+ }
1526
+ .ilo--card__type__text.ilo--card__size__narrow .ilo--card--title {
1653
1527
  font-size: 18.66px;
1654
1528
  letter-spacing: -0.035em;
1655
1529
  line-height: 24.26px;
1530
+ margin-bottom: 1.674953518rem;
1656
1531
  }
1657
- @media screen and (min-width: 1024px) {
1658
- .ilo--card--detail .ilo--card--title {
1532
+ .ilo--card__type__text.ilo--card__dark {
1533
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1534
+ }
1535
+ .ilo--card__type__text .ilo--card--eyebrow {
1536
+ margin-bottom: 1.0110920672rem;
1537
+ }
1538
+ .ilo--card__type__text .ilo--card--title {
1539
+ font-size: 18.66px;
1540
+ letter-spacing: -0.035em;
1541
+ line-height: 24.26px;
1542
+ margin-bottom: 1.674953518rem;
1543
+ }
1544
+ @media screen and (min-width: 610px) {
1545
+ .ilo--card__type__text .ilo--card--title {
1659
1546
  font-size: 23.32px;
1660
1547
  letter-spacing: -0.035em;
1661
1548
  line-height: 29.15px;
1549
+ margin-bottom: 1.5763397642rem;
1662
1550
  }
1663
1551
  }
1664
- .ilo--card--detail .ilo--card--event-date {
1665
- font-size: 16px;
1666
- letter-spacing: normal;
1667
- line-height: 23.36px;
1668
- margin-bottom: 0;
1669
- padding-left: 1.2861736334rem;
1670
- position: relative;
1671
- }
1672
- .ilo--card--detail .ilo--card--event-date::before {
1673
- background-repeat: no-repeat;
1674
- content: "";
1675
- display: inline-block;
1676
- height: 0.7502679528rem;
1677
- left: 0;
1678
- position: absolute;
1679
- top: 50%;
1680
- transform: rotate(-90deg) translateX(50%);
1681
- width: 0.6430868167rem;
1682
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 11'%3e%3cpath fill='rgb(45, 45, 45)' d='M6.00007 10.8462L12 0L0 0L6.00007 10.8462Z'/%3e%3c/svg%3e");
1683
- }
1684
- .ilo--card--detail .ilo--card--date {
1685
- font-size: 16px;
1686
- letter-spacing: normal;
1687
- line-height: 23.36px;
1688
- }
1689
- .ilo--card--graphic {
1690
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1691
- margin-top: 2.1436227224rem;
1692
- padding: 0 1.2861736334rem 2.1436227224rem;
1693
- position: relative;
1694
- }
1695
- .ilo--card--graphic::before {
1696
- background: inherit;
1697
- content: "";
1552
+ .ilo--card__type__text .ilo--card--date {
1698
1553
  display: block;
1699
- height: 40px;
1700
- position: absolute;
1701
- width: calc(100% - 73px);
1702
- }
1703
- .ilo--card--graphic::after {
1704
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1705
- background-position: bottom right;
1706
- background-size: cover;
1707
- content: "";
1708
- height: 40px;
1709
- display: block;
1710
- position: absolute;
1711
- width: 73.4px;
1712
- }
1713
- .ilo--card--graphic.ilo--card--dark::after {
1714
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1715
- }
1716
- .ilo--card--graphic.ilo--card--dark:hover::after, .ilo--card--graphic.ilo--card--dark:focus::after, .ilo--card--graphic.ilo--card--dark:focus-within::after {
1717
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1718
- }
1719
- .ilo--card--graphic::before {
1720
- left: 0;
1721
- top: -39.7px;
1554
+ margin-bottom: 1.4398166117rem;
1722
1555
  }
1723
- .right-to-left .ilo--card--graphic::before {
1724
- left: auto;
1725
- right: 0;
1556
+ .ilo--card__type__text .ilo--card--content {
1557
+ display: flex;
1558
+ flex-direction: column;
1559
+ position: relative;
1726
1560
  }
1727
- .ilo--card--graphic::after {
1728
- right: 0;
1729
- top: -39.7px;
1730
- transition: background-image 150ms ease-out;
1561
+ .ilo--card__type__text .ilo--card--content > * {
1562
+ justify-self: flex-start;
1731
1563
  }
1732
- .right-to-left .ilo--card--graphic::after {
1733
- left: 0;
1734
- right: auto;
1735
- transform: rotateY(180deg);
1564
+ .ilo--card__type__text .ilo--card--content > *:last-child {
1565
+ justify-self: flex-end;
1566
+ margin-bottom: 0;
1736
1567
  }
1737
- .ilo--card--graphic .ilo--profile--contents--light * {
1738
- color: rgb(45, 45, 45);
1568
+
1569
+ /**
1570
+ * Do not edit directly
1571
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1572
+ */
1573
+ /**
1574
+ * TOKENS:
1575
+ */
1576
+ /**
1577
+ * MAPS:
1578
+ */
1579
+ .ilo--card__type__detail {
1580
+ --max-width: 18.3815648446rem;
1581
+ border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1582
+ padding: 1.2861736334rem 0;
1583
+ position: relative;
1739
1584
  }
1740
- .ilo--card--graphic .ilo--profile--contents--dark * {
1741
- color: rgb(255, 255, 255);
1585
+ @media screen and (min-width: 1024px) {
1586
+ .ilo--card__type__detail {
1587
+ padding: 1.7148981779rem 0;
1588
+ }
1742
1589
  }
1743
- .ilo--card--graphic:hover, .ilo--card--graphic:focus, .ilo--card--graphic:focus-within {
1590
+ .ilo--card__type__detail:hover, .ilo--card__type__detail:focus, .ilo--card__type__detail:focus-within {
1744
1591
  filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1745
1592
  }
1746
- .ilo--card--graphic:hover .ilo--profile--contents *, .ilo--card--graphic:focus .ilo--profile--contents *, .ilo--card--graphic:focus-within .ilo--profile--contents * {
1747
- color: rgb(30, 45, 190);
1593
+ .ilo--card__type__detail:hover picture::before, .ilo--card__type__detail:focus picture::before, .ilo--card__type__detail:focus-within picture::before {
1594
+ opacity: 0.4;
1595
+ z-index: 2;
1748
1596
  }
1749
- @media screen and (min-width: 610px) {
1750
- .ilo--card--graphic {
1751
- padding: 0 1.7148981779rem 2.1436227224rem;
1752
- }
1753
- .ilo--card--graphic::before {
1754
- background: inherit;
1755
- content: "";
1756
- display: block;
1757
- height: 40px;
1758
- position: absolute;
1759
- width: calc(100% - 73px);
1760
- }
1761
- .ilo--card--graphic::after {
1762
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1763
- background-position: bottom right;
1764
- background-size: cover;
1765
- content: "";
1766
- height: 40px;
1767
- display: block;
1768
- position: absolute;
1769
- width: 73.4px;
1770
- }
1771
- .ilo--card--graphic.ilo--card--dark::after {
1772
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1773
- }
1774
- .ilo--card--graphic.ilo--card--dark:hover::after, .ilo--card--graphic.ilo--card--dark:focus::after, .ilo--card--graphic.ilo--card--dark:focus-within::after {
1775
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1776
- }
1777
- .ilo--card--graphic::before {
1778
- left: 0;
1779
- top: -39.7px;
1780
- }
1781
- .right-to-left .ilo--card--graphic::before {
1782
- left: auto;
1783
- right: 0;
1784
- }
1785
- .ilo--card--graphic::after {
1786
- right: 0;
1787
- top: -39.7px;
1788
- }
1789
- .right-to-left .ilo--card--graphic::after {
1790
- left: 0;
1791
- right: auto;
1792
- transform: rotateY(180deg);
1793
- }
1597
+ .ilo--card__type__detail:hover .ilo--card--date-extra::before, .ilo--card__type__detail:focus .ilo--card--date-extra::before, .ilo--card__type__detail:focus-within .ilo--card--date-extra::before {
1598
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 11'%3e%3cpath fill='rgb(30, 45, 190)' d='M6.00007 10.8462L12 0L0 0L6.00007 10.8462Z'/%3e%3c/svg%3e");
1599
+ }
1600
+ .ilo--card__type__detail .ilo--card--title {
1601
+ font-size: 18.66px;
1602
+ letter-spacing: -0.035em;
1603
+ line-height: 24.26px;
1794
1604
  }
1795
1605
  @media screen and (min-width: 1024px) {
1796
- .ilo--card--graphic::before {
1797
- background: inherit;
1798
- content: "";
1799
- display: block;
1800
- height: 40px;
1801
- position: absolute;
1802
- width: calc(100% - 73px);
1803
- }
1804
- .ilo--card--graphic::after {
1805
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1806
- background-position: bottom right;
1807
- background-size: cover;
1808
- content: "";
1809
- height: 40px;
1810
- display: block;
1811
- position: absolute;
1812
- width: 73.4px;
1813
- }
1814
- .ilo--card--graphic.ilo--card--dark::after {
1815
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(35, 0, 80)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1816
- }
1817
- .ilo--card--graphic.ilo--card--dark:hover::after, .ilo--card--graphic.ilo--card--dark:focus::after, .ilo--card--graphic.ilo--card--dark:focus-within::after {
1818
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 255, 255)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
1819
- }
1820
- .ilo--card--graphic::before {
1821
- left: 0;
1822
- top: -39.7px;
1823
- }
1824
- .right-to-left .ilo--card--graphic::before {
1825
- left: auto;
1826
- right: 0;
1827
- }
1828
- .ilo--card--graphic::after {
1829
- right: 0;
1830
- top: -39.7px;
1606
+ .ilo--card__size__wide .ilo--card__type__detail .ilo--card--title {
1607
+ font-size: 23.32px;
1608
+ letter-spacing: -0.035em;
1609
+ line-height: 29.15px;
1831
1610
  }
1832
- .right-to-left .ilo--card--graphic::after {
1833
- left: 0;
1834
- right: auto;
1835
- transform: rotateY(180deg);
1611
+ .ilo--card__size__wide .ilo--card__type__detail .ilo--card--title {
1612
+ font-size: 18.66px;
1613
+ letter-spacing: -0.035em;
1614
+ line-height: 24.26px;
1836
1615
  }
1837
1616
  }
1838
- .ilo--card--graphic.ilo--card--wide {
1839
- padding: 0 1.7148981779rem 2.1436227224rem;
1617
+ .ilo--card__type__detail.ilo--card__size__wide, .ilo--card__type__detail.ilo--card__size__fluid {
1618
+ --max-width: 39.9249732047rem;
1840
1619
  }
1841
- @media screen and (min-width: 610px) {
1842
- .ilo--card--graphic.ilo--card--wide {
1843
- padding: 0 1.7148981779rem 2.1436227224rem;
1620
+ @media screen and (min-width: 1024px) {
1621
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--title, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--title {
1622
+ font-size: 23.32px;
1623
+ letter-spacing: -0.035em;
1624
+ line-height: 29.15px;
1844
1625
  }
1845
1626
  }
1846
- .ilo--card--graphic.ilo--card--standard {
1847
- padding: 0 1.7148981779rem 2.1436227224rem;
1627
+ @media screen and (min-width: 1024px) {
1628
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--image--wrapper {
1629
+ flex: 0 0 10.5037513398rem;
1630
+ }
1848
1631
  }
1849
- @media screen and (min-width: 610px) {
1850
- .ilo--card--graphic.ilo--card--standard {
1851
- padding: 0 1.7148981779rem 2.1436227224rem;
1632
+ @media screen and (min-width: 1024px) {
1633
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--picture, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--picture {
1634
+ width: 10.5037513398rem;
1852
1635
  }
1853
1636
  }
1854
- .ilo--card--graphic.ilo--card--narrow {
1855
- padding: 0 1.2861736334rem 2.1436227224rem;
1637
+ .ilo--card__type__detail.ilo--card__size__narrow {
1638
+ --max-width: 18.3815648446rem;
1856
1639
  }
1857
- @media screen and (min-width: 610px) {
1858
- .ilo--card--graphic.ilo--card--narrow {
1859
- padding: 0 1.2861736334rem 2.1436227224rem;
1860
- }
1640
+ .ilo--card__type__detail picture {
1641
+ display: flex;
1642
+ position: relative;
1861
1643
  }
1862
- .ilo--card--graphic.ilo--card--narrow .ilo--card--title {
1863
- font-size: 18.66px;
1864
- letter-spacing: -0.035em;
1865
- line-height: 24.26px;
1866
- margin-bottom: 1.674953518rem;
1644
+ .ilo--card__type__detail picture::before {
1645
+ background-color: rgb(30, 45, 190);
1646
+ content: "";
1647
+ display: block;
1648
+ height: 100%;
1649
+ left: 0;
1650
+ opacity: 0;
1651
+ position: absolute;
1652
+ top: 0;
1653
+ width: 100%;
1654
+ z-index: -1;
1655
+ transition-property: opacity;
1656
+ transition-duration: 150ms;
1657
+ transition-timing-function: ease-out;
1867
1658
  }
1868
- .ilo--card--graphic.ilo--card--dark {
1869
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1659
+ .ilo--card__type__detail .ilo--card--wrap {
1660
+ display: flex;
1870
1661
  }
1871
- .ilo--card--graphic .ilo--card--eyebrow {
1872
- margin-bottom: 1.0110920672rem;
1662
+ .right-to-left .ilo--card__type__detail .ilo--card--wrap {
1663
+ flex-direction: row-reverse;
1873
1664
  }
1874
- .ilo--card--graphic .ilo--card--title {
1665
+ .ilo--card__type__detail .ilo--card--title {
1875
1666
  font-size: 18.66px;
1876
1667
  letter-spacing: -0.035em;
1877
1668
  line-height: 24.26px;
1878
- margin-bottom: 1.674953518rem;
1879
1669
  }
1880
- @media screen and (min-width: 610px) {
1881
- .ilo--card--graphic .ilo--card--title {
1882
- font-size: 23.32px;
1883
- letter-spacing: -0.035em;
1884
- line-height: 29.15px;
1885
- margin-bottom: 1.5763397642rem;
1886
- }
1670
+ .ilo--card__type__detail .ilo--card--image--wrapper {
1671
+ flex: 0 0 4.1264737406rem;
1887
1672
  }
1888
- .ilo--card--graphic .ilo--card--date {
1889
- display: block;
1890
- margin-bottom: 1.4398166117rem;
1673
+ .ilo--card__type__detail .ilo--card--picture {
1674
+ object-fit: contain;
1675
+ width: 4.1264737406rem;
1891
1676
  }
1892
- .ilo--card--graphic .ilo--card--content {
1893
- display: flex;
1894
- flex-direction: column;
1677
+ .ilo--card__type__detail .ilo--card--content {
1678
+ padding: 0 1.2861736334rem;
1679
+ }
1680
+ .ilo--card__type__detail .ilo--card--date-extra {
1681
+ font-size: 16px;
1682
+ letter-spacing: normal;
1683
+ line-height: 23.36px;
1684
+ margin-bottom: 0;
1685
+ padding-left: 1.2861736334rem;
1895
1686
  position: relative;
1896
1687
  }
1897
- .ilo--card--graphic .ilo--card--content > * {
1898
- justify-self: flex-start;
1688
+ .ilo--card__type__detail .ilo--card--date-extra::before {
1689
+ background-repeat: no-repeat;
1690
+ content: "";
1691
+ display: inline-block;
1692
+ height: 0.7502679528rem;
1693
+ left: 0;
1694
+ position: absolute;
1695
+ top: 50%;
1696
+ transform: rotate(-90deg) translateX(50%);
1697
+ width: 0.6430868167rem;
1698
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 11'%3e%3cpath fill='rgb(45, 45, 45)' d='M6.00007 10.8462L12 0L0 0L6.00007 10.8462Z'/%3e%3c/svg%3e");
1899
1699
  }
1900
- .ilo--card--graphic .ilo--card--content > *:last-child {
1901
- justify-self: flex-end;
1902
- margin-bottom: 0;
1700
+ .ilo--card__type__detail .ilo--card--date {
1701
+ font-size: 16px;
1702
+ letter-spacing: normal;
1703
+ line-height: 23.36px;
1903
1704
  }
1904
- .ilo--card--graphicpromo {
1905
- max-width: 49.3033226152rem;
1705
+
1706
+ /**
1707
+ * Do not edit directly
1708
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1709
+ */
1710
+ /**
1711
+ * TOKENS:
1712
+ */
1713
+ /**
1714
+ * MAPS:
1715
+ */
1716
+ .ilo--card__type__promo {
1717
+ --max-width: 18.3815648446rem;
1906
1718
  padding: 2.1436227224rem 1.2861736334rem;
1907
1719
  width: 100%;
1908
1720
  }
1909
- .ilo--card--graphicpromo:hover, .ilo--card--graphicpromo:focus, .ilo--card--graphicpromo:focus-within {
1910
- filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
1911
- }
1912
1721
  @media screen and (min-width: 610px) {
1913
- .ilo--card--graphicpromo {
1722
+ .ilo--card__type__promo {
1914
1723
  padding: 2.5723472669rem;
1915
1724
  }
1916
1725
  }
1917
1726
  @media screen and (min-width: 1024px) {
1918
- .ilo--card--graphicpromo {
1727
+ .ilo--card__type__promo {
1919
1728
  padding: 3.4297963558rem 3.8585209003rem;
1920
1729
  }
1921
1730
  }
1922
- .ilo--card--graphicpromo.ilo--card--wide {
1923
- padding: 3.4297963558rem 3.8585209003rem;
1731
+ .ilo--card__type__promo.ilo--card__size__standard {
1732
+ --max-width: 33.9764201501rem;
1733
+ padding: 2.5723472669rem;
1924
1734
  }
1925
1735
  @media screen and (min-width: 610px) {
1926
- .ilo--card--graphicpromo.ilo--card--wide {
1927
- padding: 3.4297963558rem 3.8585209003rem;
1736
+ .ilo--card__type__promo.ilo--card__size__standard {
1737
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1928
1738
  }
1929
1739
  }
1930
1740
  @media screen and (min-width: 1024px) {
1931
- .ilo--card--graphicpromo.ilo--card--wide {
1932
- padding: 3.4297963558rem 3.8585209003rem;
1741
+ .ilo--card__type__promo.ilo--card__size__standard {
1742
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1933
1743
  }
1934
1744
  }
1935
- .ilo--card--graphicpromo.ilo--card--standard {
1936
- padding: 2.5723472669rem;
1745
+ .ilo--card__type__promo.ilo--card__size__standard.ilo--card__cornercut {
1746
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
1747
+ }
1748
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1749
+ --max-width: 49.3033226152rem;
1750
+ padding: 3.4297963558rem 3.8585209003rem;
1937
1751
  }
1938
1752
  @media screen and (min-width: 610px) {
1939
- .ilo--card--graphicpromo.ilo--card--standard {
1940
- padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem 2.5723472669rem;
1753
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1754
+ padding: 3.4297963558rem 3.8585209003rem;
1941
1755
  }
1942
1756
  }
1943
1757
  @media screen and (min-width: 1024px) {
1944
- .ilo--card--graphicpromo.ilo--card--standard {
1945
- padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem 2.5723472669rem;
1758
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1759
+ padding: 3.4297963558rem 3.8585209003rem;
1946
1760
  }
1947
1761
  }
1948
- .ilo--card--graphicpromo.ilo--card--narrow {
1762
+ .ilo--card__type__promo.ilo--card__size__wide.ilo--card__cornercut, .ilo--card__type__promo.ilo--card__size__fluid.ilo--card__cornercut {
1763
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
1764
+ }
1765
+ .ilo--card__type__promo.ilo--card__size__narrow {
1766
+ --max-width: 18.3815648446rem;
1949
1767
  padding: 2.1436227224rem 1.2861736334rem;
1950
1768
  }
1951
1769
  @media screen and (min-width: 610px) {
1952
- .ilo--card--graphicpromo.ilo--card--narrow {
1770
+ .ilo--card__type__promo.ilo--card__size__narrow {
1953
1771
  padding: 2.1436227224rem 1.2861736334rem;
1954
1772
  }
1955
1773
  }
1956
1774
  @media screen and (min-width: 1024px) {
1957
- .ilo--card--graphicpromo.ilo--card--narrow {
1775
+ .ilo--card__type__promo.ilo--card__size__narrow {
1958
1776
  padding: 2.1436227224rem 1.2861736334rem;
1959
1777
  }
1960
1778
  }
1961
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1779
+ .ilo--card__type__promo.ilo--card__size__narrow.ilo--card__cornercut {
1780
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
1781
+ }
1782
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1962
1783
  font-size: 29.16px;
1963
1784
  letter-spacing: -0.035em;
1964
1785
  line-height: 36.45px;
1965
1786
  margin-bottom: 0.5741425509rem;
1966
1787
  }
1967
1788
  @media screen and (min-width: 610px) {
1968
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1789
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1969
1790
  font-size: 36.45px;
1970
1791
  letter-spacing: -0.035em;
1971
1792
  line-height: 43.74px;
1972
1793
  margin-bottom: 0.4278063594rem;
1973
1794
  }
1974
1795
  }
1975
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--intro {
1796
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--intro {
1976
1797
  font-size: 16px;
1977
1798
  letter-spacing: normal;
1978
1799
  line-height: 23.36px;
1979
1800
  margin-bottom: 1.910132288rem;
1980
1801
  }
1981
- .ilo--card--graphicpromo.ilo--card--light:not(:hover) .ilo--card--title {
1802
+ .ilo--card__type__promo.ilo--card__theme__light:not(:hover) .ilo--card--title {
1982
1803
  color: rgb(45, 45, 45);
1983
1804
  transition-property: color;
1984
1805
  transition-duration: 150ms;
1985
1806
  transition-timing-function: ease-out;
1986
1807
  }
1987
- .ilo--card--graphicpromo .ilo--card--title {
1808
+ .ilo--card__type__promo .ilo--card--title {
1988
1809
  font-size: 29.16px;
1989
1810
  letter-spacing: -0.035em;
1990
1811
  line-height: 36.45px;
1991
1812
  margin-bottom: 0.5741425509rem;
1992
1813
  }
1993
1814
  @media screen and (min-width: 610px) {
1994
- .ilo--card--graphicpromo .ilo--card--title {
1815
+ .ilo--card__type__promo .ilo--card--title {
1995
1816
  font-size: 36.45px;
1996
1817
  letter-spacing: -0.035em;
1997
1818
  line-height: 43.74px;
1998
1819
  margin-bottom: 0.8565309039rem;
1999
1820
  }
2000
1821
  }
2001
- .ilo--card--graphicpromo .ilo--card--intro {
1822
+ .ilo--card__type__promo .ilo--card--intro {
2002
1823
  font-size: 16px;
2003
1824
  letter-spacing: normal;
2004
1825
  line-height: 23.36px;
2005
1826
  margin-bottom: 1.910132288rem;
2006
1827
  }
2007
1828
  @media screen and (min-width: 610px) {
2008
- .ilo--card--graphicpromo .ilo--card--intro {
1829
+ .ilo--card__type__promo .ilo--card--intro {
2009
1830
  font-size: 18.66px;
2010
1831
  letter-spacing: normal;
2011
1832
  line-height: 27.24px;
2012
1833
  margin-bottom: 1.8685411561rem;
2013
1834
  }
2014
1835
  }
2015
- .ilo--card--factlist {
2016
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2017
- max-width: 45.8735262594rem;
2018
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
2019
- pointer-events: none;
2020
- }
2021
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2022
- height: 40px;
2023
- top: -2.127545552rem;
2024
- width: calc(100% - 73px);
2025
- }
2026
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2027
- height: 40px;
2028
- top: -2.127545552rem;
2029
- width: 73.3px;
2030
- }
2031
- .ilo--card--factlist.ilo--card--dark {
2032
- background: rgb(35, 0, 80);
2033
- }
2034
- @media screen and (min-width: 1024px) {
2035
- .ilo--card--factlist {
2036
- padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
2037
- }
2038
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2039
- height: 48px;
2040
- top: -2.5562700965rem;
2041
- width: calc(100% - 87px);
2042
- }
2043
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2044
- height: 48px;
2045
- top: -2.5562700965rem;
2046
- width: 87.3px;
2047
- }
2048
- }
2049
- .ilo--card--factlist.ilo--card--wide {
2050
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1836
+
1837
+ /**
1838
+ * Do not edit directly
1839
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1840
+ */
1841
+ /**
1842
+ * TOKENS:
1843
+ */
1844
+ /**
1845
+ * MAPS:
1846
+ */
1847
+ .ilo--card__type__multilink {
1848
+ --max-width: 28.7245444802rem;
1849
+ padding: 1.2861736334rem;
2051
1850
  }
2052
- @media screen and (min-width: 610px) {
2053
- .ilo--card--factlist.ilo--card--wide {
2054
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
2055
- }
1851
+ .ilo--card__type__multilink .ilo--card--image--wrapper {
1852
+ display: none;
2056
1853
  }
2057
- .ilo--card--factlist.ilo--card--standard {
2058
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1854
+ .ilo--card__type__multilink .ilo--card--content .ilo--card--image--wrapper {
1855
+ display: block;
2059
1856
  }
2060
1857
  @media screen and (min-width: 610px) {
2061
- .ilo--card--factlist.ilo--card--standard {
2062
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1858
+ .ilo--card__type__multilink {
1859
+ padding: 2.1436227224rem;
2063
1860
  }
2064
1861
  }
2065
- .ilo--card--factlist.ilo--card--narrow {
2066
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
2067
- }
2068
- @media screen and (min-width: 610px) {
2069
- .ilo--card--factlist.ilo--card--narrow {
2070
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1862
+ @media screen and (min-width: 1024px) {
1863
+ .ilo--card__type__multilink {
1864
+ padding: 3.0010718114rem 2.5723472669rem;
2071
1865
  }
2072
1866
  }
2073
- .ilo--card--factlist.ilo--card--dark {
2074
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
2075
- }
2076
- .ilo--card--factlist.ilo--card--dark .ilo--card--title {
2077
- color: rgb(255, 255, 255);
2078
- transition-property: color;
2079
- transition-duration: 150ms;
2080
- transition-timing-function: ease-out;
2081
- }
2082
- .ilo--card--factlist.ilo--card--dark .ilo--list__item {
2083
- color: rgb(255, 255, 255);
2084
- }
2085
- .ilo--card--factlist.ilo--card--dark .ilo--list__item:last-of-type {
2086
- margin-bottom: 0;
2087
- }
2088
- .ilo--card--factlist.ilo--card--dark:hover .ilo--card--title, .ilo--card--factlist.ilo--card--dark:focus .ilo--card--title, .ilo--card--factlist.ilo--card--dark:focus-within .ilo--card--title {
2089
- color: rgb(255, 255, 255);
2090
- transition-property: color;
2091
- transition-duration: 150ms;
2092
- transition-timing-function: ease-out;
2093
- }
2094
- .ilo--card--factlist.ilo--card--dark:hover .ilo--list__item, .ilo--card--factlist.ilo--card--dark:focus .ilo--list__item, .ilo--card--factlist.ilo--card--dark:focus-within .ilo--list__item {
2095
- color: rgb(255, 255, 255);
2096
- }
2097
- .ilo--card--factlist .ilo--card--title {
2098
- color: rgb(45, 45, 45);
1867
+ .ilo--card__type__multilink .ilo--card--title {
2099
1868
  font-size: 23.32px;
2100
1869
  letter-spacing: -0.035em;
2101
1870
  line-height: 29.15px;
2102
- margin-bottom: 1.1476152197rem;
1871
+ margin-bottom: 0.7188906752rem;
1872
+ color: rgb(45, 45, 45);
2103
1873
  }
2104
- @media screen and (min-width: 1024px) {
2105
- .ilo--card--factlist .ilo--card--title {
1874
+ @media screen and (min-width: 610px) {
1875
+ .ilo--card__type__multilink .ilo--card--title {
2106
1876
  font-size: 29.16px;
2107
1877
  letter-spacing: -0.035em;
2108
1878
  line-height: 36.45px;
2109
- margin-bottom: 1.4315916399rem;
1879
+ margin-bottom: 0.5741425509rem;
2110
1880
  }
2111
1881
  }
2112
- .ilo--card--stat {
2113
- border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
2114
- margin-top: 2.1436227224rem;
2115
- padding: 0 1.2861736334rem 2.1436227224rem 1.1789924973rem;
2116
- position: relative;
2117
- width: 100%;
2118
- }
2119
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2120
- left: 0;
2121
- top: -2.127545552rem;
2122
- }
2123
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2124
- left: auto;
2125
- right: 0;
2126
- }
2127
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2128
- right: 0;
2129
- top: -2.127545552rem;
2130
- }
2131
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2132
- left: 0;
2133
- right: auto;
2134
- transform: rotateY(180deg);
2135
- }
2136
- .ilo--card--stat.ilo--card--blue {
2137
- background: rgb(235, 245, 253);
2138
- }
2139
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2140
- background: inherit;
2141
- content: "";
2142
- display: block;
2143
- height: 40px;
2144
- position: absolute;
2145
- width: calc(100% - 73px);
2146
- }
2147
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2148
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(235, 245, 253)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2149
- background-position: bottom right;
2150
- background-size: cover;
2151
- content: "";
2152
- height: 40px;
2153
- display: block;
2154
- position: absolute;
2155
- width: 73.4px;
2156
- }
2157
- .ilo--card--stat.ilo--card--yellow {
2158
- background: rgb(255, 205, 45);
2159
- }
2160
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2161
- background: inherit;
2162
- content: "";
2163
- display: block;
2164
- height: 40px;
2165
- position: absolute;
2166
- width: calc(100% - 73px);
2167
- }
2168
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2169
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(255, 205, 45)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2170
- background-position: bottom right;
2171
- background-size: cover;
2172
- content: "";
2173
- height: 40px;
2174
- display: block;
2175
- position: absolute;
2176
- width: 73.4px;
2177
- }
2178
- .ilo--card--stat.ilo--card--green {
2179
- background: rgb(140, 225, 100);
2180
- }
2181
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2182
- background: inherit;
2183
- content: "";
2184
- display: block;
2185
- height: 40px;
2186
- position: absolute;
2187
- width: calc(100% - 73px);
2188
- }
2189
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2190
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(140, 225, 100)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2191
- background-position: bottom right;
2192
- background-size: cover;
2193
- content: "";
2194
- height: 40px;
2195
- display: block;
2196
- position: absolute;
2197
- width: 73.4px;
2198
- }
2199
- .ilo--card--stat.ilo--card--turquoise {
2200
- background: rgb(5, 210, 210);
2201
- }
2202
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2203
- background: inherit;
2204
- content: "";
2205
- display: block;
2206
- height: 40px;
2207
- position: absolute;
2208
- width: calc(100% - 73px);
2209
- }
2210
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2211
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(5, 210, 210)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2212
- background-position: bottom right;
2213
- background-size: cover;
2214
- content: "";
2215
- height: 40px;
2216
- display: block;
2217
- position: absolute;
2218
- width: 73.4px;
2219
- }
2220
- .ilo--card--stat .ilo--card--content {
2221
- display: flex;
2222
- flex-wrap: wrap;
2223
- height: 100%;
1882
+ .ilo--card__type__multilink .ilo--card--intro {
1883
+ font-size: 16px;
1884
+ letter-spacing: normal;
1885
+ line-height: 23.36px;
1886
+ margin-bottom: 1.910132288rem;
1887
+ color: rgb(45, 45, 45);
2224
1888
  }
2225
- .right-to-left .ilo--card--stat .ilo--card--content {
2226
- flex-direction: row-reverse;
1889
+ @media screen and (min-width: 610px) {
1890
+ .ilo--card__type__multilink .ilo--card--intro {
1891
+ font-size: 18.66px;
1892
+ letter-spacing: normal;
1893
+ line-height: 27.24px;
1894
+ margin-bottom: 1.8685411561rem;
1895
+ }
2227
1896
  }
2228
- .ilo--card--stat .ilo--card--title {
2229
- color: rgb(35, 0, 80);
2230
- font-size: 36.45px;
2231
- letter-spacing: -0.035em;
2232
- line-height: 43.74px;
2233
- margin-bottom: 0.4278063594rem;
2234
- width: 100%;
1897
+ .ilo--card__type__multilink.ilo--card__size__standard {
1898
+ --max-width: 28.7245444802rem;
1899
+ padding: 2.5723472669rem 2.1436227224rem;
2235
1900
  }
2236
- .ilo--card--stat .ilo--card--intro {
2237
- color: rgb(35, 0, 80);
2238
- font-family: Overpass;
2239
- font-size: 18.66px;
2240
- letter-spacing: normal;
2241
- line-height: 27.24px;
2242
- margin-bottom: 1.6734954235rem;
2243
- width: 100%;
1901
+ @media screen and (min-width: 610px) {
1902
+ .ilo--card__type__multilink.ilo--card__size__standard {
1903
+ padding: 2.5723472669rem 2.1436227224rem;
1904
+ }
2244
1905
  }
2245
- .ilo--card--stat .ilo--link {
2246
- font-size: 11.94px;
2247
- letter-spacing: -0.02em;
2248
- line-height: 16.24px;
2249
- align-self: flex-end;
1906
+ @media screen and (min-width: 1024px) {
1907
+ .ilo--card__type__multilink.ilo--card__size__standard {
1908
+ padding: 2.5723472669rem 2.1436227224rem;
1909
+ }
2250
1910
  }
2251
- .ilo--card--data {
2252
- background: rgb(235, 245, 253);
2253
- border-bottom: 0.1607717042rem solid #82afdc;
2254
- margin-top: 2.1436227224rem;
2255
- max-width: 32.154340836rem;
2256
- padding: 0 1.2861736334rem 3.0010718114rem;
2257
- position: relative;
1911
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1912
+ --max-width: 20.0964630225rem;
1913
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
2258
1914
  }
2259
- .ilo--card--data::before {
2260
- background: inherit;
2261
- content: "";
2262
- display: block;
2263
- height: 40px;
2264
- position: absolute;
2265
- width: calc(100% - 73px);
1915
+ @media screen and (min-width: 610px) {
1916
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1917
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1918
+ }
2266
1919
  }
2267
- .ilo--card--data::after {
2268
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(235, 245, 253)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2269
- background-position: bottom right;
2270
- background-size: cover;
2271
- content: "";
2272
- height: 40px;
2273
- display: block;
2274
- position: absolute;
2275
- width: 73.4px;
1920
+ @media screen and (min-width: 1024px) {
1921
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1922
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1923
+ }
2276
1924
  }
2277
- .ilo--card--data:hover, .ilo--card--data:focus, .ilo--card--data:focus-within {
2278
- background: rgb(235, 245, 253);
1925
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--image--wrapper {
1926
+ display: none;
2279
1927
  }
2280
- .ilo--card--data::before {
2281
- left: 0;
2282
- top: -2.127545552rem;
1928
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--content .ilo--card--image--wrapper {
1929
+ display: block;
1930
+ margin-bottom: 1.2861736334rem;
2283
1931
  }
2284
- .right-to-left .ilo--card--data::before {
2285
- left: auto;
2286
- right: 0;
1932
+ @media screen and (min-width: 610px) {
1933
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--title {
1934
+ font-size: 23.32px;
1935
+ letter-spacing: -0.035em;
1936
+ line-height: 29.15px;
1937
+ margin-bottom: 0.7188906752rem;
1938
+ }
2287
1939
  }
2288
- .ilo--card--data::after {
2289
- right: 0;
2290
- top: -2.127545552rem;
1940
+ @media screen and (min-width: 610px) {
1941
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--intro {
1942
+ font-size: 16px;
1943
+ letter-spacing: normal;
1944
+ line-height: 23.36px;
1945
+ margin-bottom: 1.910132288rem;
1946
+ }
2291
1947
  }
2292
- .right-to-left .ilo--card--data::after {
2293
- left: 0;
2294
- right: auto;
2295
- transform: rotateY(180deg);
1948
+ .ilo--card__type__multilink.ilo--card__size__wide, .ilo--card__type__multilink.ilo--card__size__fluid {
1949
+ --max-width: 59.1639871383rem;
1950
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
2296
1951
  }
2297
1952
  @media screen and (min-width: 610px) {
2298
- .ilo--card--data::before {
2299
- background: inherit;
2300
- content: "";
2301
- display: block;
2302
- height: 48px;
2303
- position: absolute;
2304
- width: calc(100% - 84px);
1953
+ .ilo--card__type__multilink.ilo--card__size__wide, .ilo--card__type__multilink.ilo--card__size__fluid {
1954
+ padding: 3.0010718114rem 2.5723472669rem;
2305
1955
  }
2306
- .ilo--card--data::after {
2307
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(235, 245, 253)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2308
- background-position: bottom right;
2309
- background-size: cover;
2310
- content: "";
2311
- height: 48px;
1956
+ .ilo--card__type__multilink.ilo--card__size__wide.ilo--card__align__right .ilo--card--wrap, .ilo--card__type__multilink.ilo--card__size__fluid.ilo--card__align__right .ilo--card--wrap {
1957
+ flex-direction: row-reverse;
1958
+ }
1959
+ .right-to-left .ilo--card__type__multilink.ilo--card__size__wide.ilo--card__align__right .ilo--card--wrap, .right-to-left .ilo--card__type__multilink.ilo--card__size__fluid.ilo--card__align__right .ilo--card--wrap {
1960
+ flex-direction: row;
1961
+ }
1962
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--wrap, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--wrap {
1963
+ display: flex;
1964
+ column-gap: 1.7148981779rem;
1965
+ }
1966
+ .right-to-left .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--wrap, .right-to-left .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--wrap {
1967
+ flex-direction: row-reverse;
1968
+ }
1969
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--image--wrapper {
2312
1970
  display: block;
2313
- position: absolute;
2314
- width: 84.4px;
1971
+ width: 50%;
2315
1972
  }
2316
- .ilo--card--data::before {
2317
- top: -2.5562700965rem;
1973
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--content, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--content {
1974
+ width: 50%;
2318
1975
  }
2319
- .ilo--card--data::after {
2320
- top: -2.5562700965rem;
1976
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--content .ilo--card--image--wrapper, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--content .ilo--card--image--wrapper {
1977
+ display: none;
2321
1978
  }
2322
1979
  }
2323
- .ilo--card--data .ilo--card--image--wrapper {
2324
- display: none;
2325
- width: max(10.9860664523rem, 50%);
1980
+ .ilo--card__type__multilink .ilo--link-list {
1981
+ margin-top: 1.8756698821rem;
1982
+ position: relative;
1983
+ z-index: 3;
2326
1984
  }
2327
- .ilo--card--data .ilo--card--content .ilo--card--image--wrapper {
2328
- display: block;
1985
+
1986
+ /**
1987
+ * Do not edit directly
1988
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1989
+ */
1990
+ /**
1991
+ * TOKENS:
1992
+ */
1993
+ /**
1994
+ * MAPS:
1995
+ */
1996
+ .ilo--card__type__data {
1997
+ --max-width: 16.1307609861rem;
1998
+ background: rgb(235, 245, 253);
1999
+ border-bottom: 0.1607717042rem solid #82afdc;
2000
+ margin-top: 2.1436227224rem;
2001
+ padding: 1.2861736334rem 3.0010718114rem;
2002
+ position: relative;
2003
+ width: 100%;
2004
+ }
2005
+ .ilo--card__type__data:hover, .ilo--card__type__data:focus, .ilo--card__type__data:focus-within {
2006
+ background: rgb(235, 245, 253);
2007
+ }
2008
+ .ilo--card__type__data.ilo--card__size__narrow {
2009
+ --max-width: 16.1307609861rem;
2010
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2011
+ }
2012
+ .ilo--card__type__data.ilo--card__size__wide, .ilo--card__type__data.ilo--card__size__fluid {
2013
+ --max-width: 32.154340836rem;
2014
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
2015
+ }
2016
+ .ilo--card__type__data .ilo--card--image--wrapper {
2017
+ width: max(10.9860664523rem, 50%);
2329
2018
  }
2330
- .ilo--card--data--content-label {
2019
+ .ilo--card__type__data--content-label {
2331
2020
  font-size: 14.93px;
2332
2021
  letter-spacing: normal;
2333
2022
  line-height: 20.3px;
2334
2023
  margin-bottom: 0.6540478038rem;
2335
2024
  color: rgb(109, 109, 109);
2336
2025
  }
2337
- .ilo--card--data--content-copy {
2026
+ .ilo--card__type__data--content-copy {
2338
2027
  font-size: 23.32px;
2339
2028
  letter-spacing: -0.035em;
2340
2029
  line-height: 29.15px;
@@ -2343,175 +2032,161 @@ body {
2343
2032
  font-family: Overpass;
2344
2033
  font-weight: 500;
2345
2034
  }
2346
- .ilo--card--data--content-files {
2035
+ .ilo--card__type__data--content-files {
2347
2036
  margin-bottom: 2.1436227224rem;
2348
2037
  }
2349
- .ilo--card--data .ilo--link {
2038
+ .ilo--card__type__data .ilo--link {
2350
2039
  font-size: 18.66px;
2351
2040
  letter-spacing: -0.035em;
2352
2041
  line-height: 24.26px;
2353
2042
  }
2354
- .ilo--card--data--file {
2043
+ .ilo--card__type__data--file {
2355
2044
  margin: 0.2143622722rem 0.4287245445rem 0.2143622722rem 0;
2356
2045
  }
2357
- .ilo--card--data--file:last-of-type {
2046
+ .ilo--card__type__data--file:last-of-type {
2358
2047
  margin-right: 0;
2359
2048
  }
2360
- .ilo--card--feature {
2361
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2362
- display: flex;
2363
- margin-top: 0;
2049
+
2050
+ /**
2051
+ * Do not edit directly
2052
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2053
+ */
2054
+ /**
2055
+ * TOKENS:
2056
+ */
2057
+ /**
2058
+ * MAPS:
2059
+ */
2060
+ .ilo--card__type__stat {
2061
+ --max-width: 18.3815648446rem;
2062
+ border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
2063
+ padding: 1.2861736334rem 2.1436227224rem 1.1789924973rem;
2364
2064
  position: relative;
2065
+ width: 100%;
2066
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2365
2067
  }
2366
- .ilo--card--feature::before {
2367
- display: none;
2068
+ .ilo--card__type__stat.ilo--card__color__blue {
2069
+ background: rgb(235, 245, 253);
2368
2070
  }
2369
- .ilo--card--feature.ilo--card--dark {
2370
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
2071
+ .ilo--card__type__stat.ilo--card__color__yellow {
2072
+ background: rgb(255, 205, 45);
2371
2073
  }
2372
- .ilo--card--feature.ilo--card--dark .ilo--link-list {
2373
- border-top: 2px solid rgba(237, 240, 242, 0.25);
2074
+ .ilo--card__type__stat.ilo--card__color__green {
2075
+ background: rgb(140, 225, 100);
2374
2076
  }
2375
- .ilo--card--feature.ilo--card--dark .ilo--link-list--link {
2376
- color: rgb(255, 255, 255);
2377
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='rgb(255, 255, 255)' d='M8.63792 19.9964L7.6499 19.0082L14.6571 11.9999L7.6499 4.99159L8.63792 4.00342L16.1426 11.5023C16.2083 11.5675 16.2604 11.645 16.296 11.7304C16.3316 11.8158 16.3499 11.9074 16.3499 11.9999C16.3499 12.0924 16.3316 12.184 16.296 12.2694C16.2604 12.3548 16.2083 12.4324 16.1426 12.4975L8.63792 19.9964Z'/%3e%3c/svg%3e");
2077
+ .ilo--card__type__stat.ilo--card__color__turquoise {
2078
+ background: rgb(5, 210, 210);
2378
2079
  }
2379
- .ilo--card--feature.ilo--card--dark:hover .ilo--link-list--link, .ilo--card--feature.ilo--card--dark:focus .ilo--link-list--link, .ilo--card--feature.ilo--card--dark:focus-within .ilo--link-list--link {
2380
- color: rgb(30, 45, 190);
2381
- 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");
2080
+ .ilo--card__type__stat .ilo--card--content {
2081
+ display: flex;
2082
+ flex-wrap: wrap;
2083
+ height: 100%;
2382
2084
  }
2383
- .ilo--card--feature picture::before {
2384
- transition-property: opacity;
2385
- transition-duration: 150ms;
2386
- transition-timing-function: ease-out;
2085
+ .right-to-left .ilo--card__type__stat .ilo--card--content {
2086
+ flex-direction: row-reverse;
2387
2087
  }
2388
- .ilo--card--feature:hover, .ilo--card--feature:focus, .ilo--card--feature:focus-within {
2389
- background-color: rgb(255, 255, 255);
2390
- filter: drop-shadow(0px 0.8px 1.6px rgba(30, 45, 190, 0.038)) drop-shadow(0px 4px 8px rgba(30, 45, 190, 0.054)) drop-shadow(0px 10px 20px rgba(30, 45, 190, 0.08)) drop-shadow(0px -4px 16px rgba(30, 45, 190, 0.054));
2391
- border-bottom: 0.1607717042rem solid rgb(30, 45, 190);
2088
+ .ilo--card__type__stat .ilo--card--title {
2089
+ color: rgb(35, 0, 80);
2090
+ font-size: 36.45px;
2091
+ letter-spacing: -0.035em;
2092
+ line-height: 43.74px;
2093
+ margin-bottom: 0.4278063594rem;
2094
+ width: 100%;
2392
2095
  }
2393
- .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before, .ilo--card--feature:focus-within picture::before {
2394
- opacity: 0.4;
2395
- z-index: 1;
2396
- transition-property: opacity;
2397
- transition-duration: 150ms;
2398
- transition-timing-function: ease-out;
2096
+ .ilo--card__type__stat .ilo--card--intro {
2097
+ color: rgb(35, 0, 80);
2098
+ font-family: Overpass;
2099
+ font-size: 18.66px;
2100
+ letter-spacing: normal;
2101
+ line-height: 27.24px;
2102
+ margin-bottom: 1.6734954235rem;
2103
+ width: 100%;
2399
2104
  }
2400
- .ilo--card--feature:hover .ilo--card--image, .ilo--card--feature:focus .ilo--card--image, .ilo--card--feature:focus-within .ilo--card--image {
2401
- filter: saturate(0);
2105
+ .ilo--card__type__stat .ilo--link {
2106
+ font-size: 11.94px;
2107
+ letter-spacing: -0.02em;
2108
+ line-height: 16.24px;
2109
+ align-self: flex-end;
2402
2110
  }
2403
- .ilo--card--feature .ilo--link-list {
2404
- border-top: 0.1071811361rem solid rgb(237, 240, 242);
2405
- margin-left: -1.2861736334rem;
2406
- margin-right: -1.2861736334rem;
2407
- margin-top: 1.822079314rem;
2408
- position: relative;
2409
- z-index: 2;
2111
+
2112
+ /**
2113
+ * Do not edit directly
2114
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2115
+ */
2116
+ /**
2117
+ * TOKENS:
2118
+ */
2119
+ /**
2120
+ * MAPS:
2121
+ */
2122
+ .ilo--card__type__factlist {
2123
+ --max-width: 20.0964630225rem;
2124
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2125
+ padding: 1.2861736334rem 2.5723472669rem;
2126
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2410
2127
  }
2411
- .ilo--card--feature .ilo--link-list--link, .ilo--card--feature .ilo--link-list--link:hover {
2412
- border-bottom: none;
2413
- padding-left: 1.2861736334rem;
2414
- padding-right: 1.2861736334rem;
2128
+ @media screen and (min-width: 1024px) {
2129
+ .ilo--card__type__factlist {
2130
+ padding: 2.1436227224rem 3.0010718114rem;
2131
+ }
2415
2132
  }
2416
- .ilo--card--feature.ilo--card--narrow .ilo--card--wrap, .ilo--card--feature.ilo--card--standard .ilo--card--wrap {
2417
- display: flex;
2418
- flex-wrap: wrap;
2419
- width: 100%;
2133
+ .ilo--card__type__factlist.ilo--card__size__wide {
2134
+ --max-width: 45.8735262594rem;
2135
+ padding: 2.1436227224rem 2.7867095391rem;
2420
2136
  }
2421
- .ilo--card--feature.ilo--card--narrow .ilo--card--content, .ilo--card--feature.ilo--card--standard .ilo--card--content {
2422
- width: 100%;
2137
+ @media screen and (min-width: 610px) {
2138
+ .ilo--card__type__factlist.ilo--card__size__wide {
2139
+ padding: 2.1436227224rem 3.2154340836rem;
2140
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
2141
+ }
2423
2142
  }
2424
- .ilo--card--feature.ilo--card--narrow .ilo--card--image--wrapper, .ilo--card--feature.ilo--card--standard .ilo--card--image--wrapper {
2425
- width: 100%;
2143
+ .ilo--card__type__factlist.ilo--card__size__narrow {
2144
+ --max-width: 20.0964630225rem;
2145
+ padding: 1.2861736334rem 2.5723472669rem;
2146
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2426
2147
  }
2427
2148
  @media screen and (min-width: 610px) {
2428
- .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2429
- flex-direction: row;
2430
- }
2431
- .right-to-left .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2432
- flex-direction: row-reverse;
2433
- }
2434
- .ilo--card--feature.ilo--card--wide .ilo--card--content {
2435
- display: flex;
2436
- flex-direction: row;
2437
- flex-wrap: wrap;
2438
- position: relative;
2439
- width: 50%;
2440
- }
2441
- .ilo--card--feature.ilo--card--wide .ilo--card--image--wrapper {
2442
- width: 50%;
2443
- }
2444
- .ilo--card--feature.ilo--card--wide .ilo--card--image {
2445
- object-fit: cover;
2446
- }
2447
- .ilo--card--feature.ilo--card--wide .ilo--card--date {
2448
- align-self: flex-end;
2449
- width: 100%;
2450
- }
2451
- .ilo--card--feature.ilo--card--wide .ilo--card--eyebrow {
2452
- width: 100%;
2453
- }
2454
- .ilo--card--feature.ilo--card--wide .ilo--card--title {
2455
- width: 100%;
2456
- }
2457
- .ilo--card--feature.ilo--card--wide .ilo--link-list {
2458
- width: calc(100% + 48px);
2149
+ .ilo--card__type__factlist.ilo--card__size__narrow {
2150
+ padding: 1.2861736334rem 2.5723472669rem;
2459
2151
  }
2460
2152
  }
2461
- .ilo--card--feature .ilo--card--wrap {
2462
- display: flex;
2463
- flex-direction: column;
2464
- width: 100%;
2153
+ .ilo--card__type__factlist.ilo--card__theme__dark {
2154
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
2465
2155
  }
2466
- .ilo--card--feature picture {
2467
- display: flex;
2468
- height: 100%;
2469
- position: relative;
2156
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--card--title {
2157
+ color: rgb(255, 255, 255);
2470
2158
  }
2471
- .ilo--card--feature picture::before {
2472
- background-color: rgb(30, 45, 190);
2473
- content: "";
2474
- display: block;
2475
- height: 100%;
2476
- left: 0;
2477
- opacity: 0;
2478
- position: absolute;
2479
- top: 0;
2480
- transition: opacity 150ms ease-in-out;
2481
- width: 100%;
2482
- z-index: -1;
2159
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item {
2160
+ color: rgb(255, 255, 255);
2483
2161
  }
2484
- .ilo--card--feature .ilo--card--content {
2485
- display: flex;
2486
- flex: 1 1 auto;
2487
- flex-direction: column;
2488
- padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
2162
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item:last-of-type {
2163
+ margin-bottom: 0;
2489
2164
  }
2490
- .ilo--card--feature.ilo--card--linklist .ilo--card--content {
2491
- padding-bottom: 0;
2165
+ .ilo--card__type__factlist.ilo--card__theme__dark:hover .ilo--card--title, .ilo--card__type__factlist.ilo--card__theme__dark:focus .ilo--card--title, .ilo--card__type__factlist.ilo--card__theme__dark:focus-within .ilo--card--title {
2166
+ color: rgb(255, 255, 255);
2167
+ }
2168
+ .ilo--card__type__factlist.ilo--card__theme__dark:hover .ilo--list__item, .ilo--card__type__factlist.ilo--card__theme__dark:focus .ilo--list__item, .ilo--card__type__factlist.ilo--card__theme__dark:focus-within .ilo--list__item {
2169
+ color: rgb(255, 255, 255);
2492
2170
  }
2493
- .ilo--card--feature .ilo--card--title {
2171
+ .ilo--card__type__factlist .ilo--card--title {
2172
+ color: rgb(45, 45, 45);
2494
2173
  font-size: 23.32px;
2495
2174
  letter-spacing: -0.035em;
2496
2175
  line-height: 29.15px;
2497
- margin-bottom: 1.5763397642rem;
2498
- font-family: Overpass;
2499
- font-weight: 700;
2500
- }
2501
- .ilo--card--feature .ilo--card--eyebrow {
2502
- font-size: 14.93px;
2503
- letter-spacing: normal;
2504
- line-height: 19.71px;
2505
- margin-bottom: 0.3376482577rem;
2176
+ margin-bottom: 1.1476152197rem;
2506
2177
  }
2507
- .ilo--card--feature .ilo--card--date {
2508
- margin-bottom: 0;
2509
- margin-top: auto;
2178
+ @media screen and (min-width: 1024px) {
2179
+ .ilo--card__type__factlist .ilo--card--title {
2180
+ font-size: 29.16px;
2181
+ letter-spacing: -0.035em;
2182
+ line-height: 36.45px;
2183
+ margin-bottom: 1.4315916399rem;
2184
+ }
2510
2185
  }
2511
2186
 
2512
2187
  /**
2513
2188
  * Do not edit directly
2514
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2189
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2515
2190
  */
2516
2191
  /**
2517
2192
  * TOKENS:
@@ -2519,33 +2194,53 @@ body {
2519
2194
  /**
2520
2195
  * MAPS:
2521
2196
  */
2522
- .ilo--cardgroup--inner {
2523
- display: flex;
2524
- flex-wrap: wrap;
2525
- justify-content: space-between;
2526
- margin: auto;
2527
- row-gap: 1.7148981779rem;
2197
+ .ilo--cardgroup__collapsed .ilo--cardgroup--inner {
2198
+ gap: 0 !important;
2528
2199
  }
2529
- .right-to-left .ilo--cardgroup--inner {
2530
- flex-direction: row-reverse;
2200
+ .ilo--cardgroup__justify__start .ilo--cardgroup--inner {
2201
+ justify-content: flex-start;
2531
2202
  }
2532
- .ilo--cardgroup--inner .ilo--card {
2533
- width: 100%;
2203
+ .ilo--cardgroup__justify__between .ilo--cardgroup--inner {
2204
+ justify-content: space-between;
2534
2205
  }
2535
- @media screen and (min-width: 1024px) {
2536
- .ilo--cardgroup--two .ilo--card {
2537
- width: calc(50% - 16px);
2538
- }
2206
+ .ilo--cardgroup__justify__center .ilo--cardgroup--inner {
2207
+ justify-content: center;
2539
2208
  }
2540
2209
  @media screen and (min-width: 1024px) {
2541
- .ilo--cardgroup--three .ilo--card {
2542
- width: calc(33.333% - 21px);
2210
+ .ilo--cardgroup__count__one .ilo--cardgroup--inner {
2211
+ gap: 0;
2543
2212
  }
2544
- }
2545
- @media screen and (min-width: 1024px) {
2546
- .ilo--cardgroup--four .ilo--card {
2547
- width: calc(25% - 24px);
2213
+ .ilo--cardgroup__count__one .ilo--cardgroup--card {
2214
+ flex: 1 1 100%;
2215
+ }
2216
+ .ilo--cardgroup__count__two .ilo--cardgroup--inner {
2217
+ gap: 16px;
2218
+ }
2219
+ .ilo--cardgroup__count__two .ilo--cardgroup--card {
2220
+ flex: 0 1 calc(50% - 16px);
2221
+ }
2222
+ .ilo--cardgroup__count__three .ilo--cardgroup--inner {
2223
+ gap: 21px;
2548
2224
  }
2225
+ .ilo--cardgroup__count__three .ilo--cardgroup--card {
2226
+ flex: 0 1 calc(33.3333% - 21px);
2227
+ }
2228
+ .ilo--cardgroup__count__four .ilo--cardgroup--inner {
2229
+ gap: 24px;
2230
+ }
2231
+ .ilo--cardgroup__count__four .ilo--cardgroup--card {
2232
+ flex: 0 1 calc(25% - 24px);
2233
+ }
2234
+ }
2235
+ .ilo--cardgroup--inner {
2236
+ display: flex;
2237
+ flex-flow: row wrap;
2238
+ justify-content: center;
2239
+ margin: auto;
2240
+ width: 100%;
2241
+ }
2242
+ .right-to-left .ilo--cardgroup--inner {
2243
+ flex-direction: row-reverse;
2549
2244
  }
2550
2245
  .ilo--cardgroup--button-wrap {
2551
2246
  display: flex;
@@ -2556,7 +2251,7 @@ body {
2556
2251
 
2557
2252
  /**
2558
2253
  * Do not edit directly
2559
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2254
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2560
2255
  */
2561
2256
  /**
2562
2257
  * TOKENS:
@@ -2661,7 +2356,7 @@ body {
2661
2356
 
2662
2357
  /**
2663
2358
  * Do not edit directly
2664
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2359
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2665
2360
  */
2666
2361
  /**
2667
2362
  * TOKENS:
@@ -2742,7 +2437,7 @@ body {
2742
2437
 
2743
2438
  /**
2744
2439
  * Do not edit directly
2745
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2440
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2746
2441
  */
2747
2442
  /**
2748
2443
  * TOKENS:
@@ -2752,7 +2447,7 @@ body {
2752
2447
  */
2753
2448
  /**
2754
2449
  * Do not edit directly
2755
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2450
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2756
2451
  */
2757
2452
  /**
2758
2453
  * TOKENS:
@@ -2762,7 +2457,7 @@ body {
2762
2457
  */
2763
2458
  /**
2764
2459
  * Do not edit directly
2765
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2460
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2766
2461
  */
2767
2462
  /**
2768
2463
  * TOKENS:
@@ -2772,7 +2467,7 @@ body {
2772
2467
  */
2773
2468
  /**
2774
2469
  * Do not edit directly
2775
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2470
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2776
2471
  */
2777
2472
  /**
2778
2473
  * TOKENS:
@@ -2898,7 +2593,7 @@ body {
2898
2593
 
2899
2594
  /**
2900
2595
  * Do not edit directly
2901
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2596
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2902
2597
  */
2903
2598
  /**
2904
2599
  * TOKENS:
@@ -2926,7 +2621,7 @@ body {
2926
2621
 
2927
2622
  /**
2928
2623
  * Do not edit directly
2929
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2624
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2930
2625
  */
2931
2626
  /**
2932
2627
  * TOKENS:
@@ -3014,7 +2709,7 @@ body {
3014
2709
 
3015
2710
  /**
3016
2711
  * Do not edit directly
3017
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2712
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3018
2713
  */
3019
2714
  /**
3020
2715
  * TOKENS:
@@ -3024,7 +2719,7 @@ body {
3024
2719
  */
3025
2720
  /**
3026
2721
  * Do not edit directly
3027
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2722
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3028
2723
  */
3029
2724
  /**
3030
2725
  * TOKENS:
@@ -3034,7 +2729,7 @@ body {
3034
2729
  */
3035
2730
  /**
3036
2731
  * Do not edit directly
3037
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2732
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3038
2733
  */
3039
2734
  /**
3040
2735
  * TOKENS:
@@ -3087,7 +2782,7 @@ body {
3087
2782
 
3088
2783
  /**
3089
2784
  * Do not edit directly
3090
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2785
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3091
2786
  */
3092
2787
  /**
3093
2788
  * TOKENS:
@@ -3162,7 +2857,7 @@ body {
3162
2857
 
3163
2858
  /**
3164
2859
  * Do not edit directly
3165
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2860
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3166
2861
  */
3167
2862
  /**
3168
2863
  * TOKENS:
@@ -3268,7 +2963,7 @@ body {
3268
2963
 
3269
2964
  /**
3270
2965
  * Do not edit directly
3271
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2966
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3272
2967
  */
3273
2968
  /**
3274
2969
  * TOKENS:
@@ -3291,7 +2986,7 @@ body {
3291
2986
 
3292
2987
  /**
3293
2988
  * Do not edit directly
3294
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2989
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3295
2990
  */
3296
2991
  /**
3297
2992
  * TOKENS:
@@ -3305,7 +3000,7 @@ body {
3305
3000
 
3306
3001
  /**
3307
3002
  * Do not edit directly
3308
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3003
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3309
3004
  */
3310
3005
  /**
3311
3006
  * TOKENS:
@@ -3315,7 +3010,7 @@ body {
3315
3010
  */
3316
3011
  /**
3317
3012
  * Do not edit directly
3318
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3013
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3319
3014
  */
3320
3015
  /**
3321
3016
  * TOKENS:
@@ -3340,7 +3035,7 @@ body {
3340
3035
  }
3341
3036
  /**
3342
3037
  * Do not edit directly
3343
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3038
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3344
3039
  */
3345
3040
  /**
3346
3041
  * TOKENS:
@@ -3664,7 +3359,7 @@ body {
3664
3359
 
3665
3360
  /**
3666
3361
  * Do not edit directly
3667
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3362
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3668
3363
  */
3669
3364
  /**
3670
3365
  * TOKENS:
@@ -3787,7 +3482,7 @@ body {
3787
3482
 
3788
3483
  /**
3789
3484
  * Do not edit directly
3790
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3485
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3791
3486
  */
3792
3487
  /**
3793
3488
  * TOKENS:
@@ -3993,7 +3688,7 @@ body {
3993
3688
 
3994
3689
  /**
3995
3690
  * Do not edit directly
3996
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3691
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3997
3692
  */
3998
3693
  /**
3999
3694
  * TOKENS:
@@ -4004,7 +3699,7 @@ body {
4004
3699
  .ilo--hero-card {
4005
3700
  height: 100%;
4006
3701
  position: relative;
4007
- padding: 39px 16px;
3702
+ padding: 40px 16px;
4008
3703
  }
4009
3704
  @media screen and (min-width: 1024px) {
4010
3705
  .ilo--hero-card {
@@ -4049,12 +3744,7 @@ body {
4049
3744
  }
4050
3745
  }
4051
3746
  .ilo--hero-card__cornercut {
4052
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 39px, 100% 100%, 0 100%);
4053
- }
4054
- @media screen and (min-width: 1024px) {
4055
- .ilo--hero-card__cornercut {
4056
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 64px, 100% 100%, 0 100%);
4057
- }
3747
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
4058
3748
  }
4059
3749
  .ilo--hero-card--datecopy {
4060
3750
  font-size: 16px;
@@ -4119,7 +3809,7 @@ body {
4119
3809
 
4120
3810
  /**
4121
3811
  * Do not edit directly
4122
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3812
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4123
3813
  */
4124
3814
  /**
4125
3815
  * TOKENS:
@@ -4175,7 +3865,7 @@ body {
4175
3865
 
4176
3866
  /**
4177
3867
  * Do not edit directly
4178
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3868
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4179
3869
  */
4180
3870
  /**
4181
3871
  * TOKENS:
@@ -4317,7 +4007,7 @@ body {
4317
4007
 
4318
4008
  /**
4319
4009
  * Do not edit directly
4320
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4010
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4321
4011
  */
4322
4012
  /**
4323
4013
  * TOKENS:
@@ -4327,7 +4017,7 @@ body {
4327
4017
  */
4328
4018
  /**
4329
4019
  * Do not edit directly
4330
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4020
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4331
4021
  */
4332
4022
  /**
4333
4023
  * TOKENS:
@@ -4352,7 +4042,7 @@ body {
4352
4042
  }
4353
4043
  /**
4354
4044
  * Do not edit directly
4355
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4045
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4356
4046
  */
4357
4047
  /**
4358
4048
  * TOKENS:
@@ -4510,7 +4200,7 @@ body {
4510
4200
 
4511
4201
  /**
4512
4202
  * Do not edit directly
4513
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4203
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4514
4204
  */
4515
4205
  /**
4516
4206
  * TOKENS:
@@ -4605,7 +4295,7 @@ body {
4605
4295
 
4606
4296
  /**
4607
4297
  * Do not edit directly
4608
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4298
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4609
4299
  */
4610
4300
  /**
4611
4301
  * TOKENS:
@@ -4615,7 +4305,7 @@ body {
4615
4305
  */
4616
4306
  /**
4617
4307
  * Do not edit directly
4618
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4308
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4619
4309
  */
4620
4310
  /**
4621
4311
  * TOKENS:
@@ -4625,7 +4315,7 @@ body {
4625
4315
  */
4626
4316
  /**
4627
4317
  * Do not edit directly
4628
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4318
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4629
4319
  */
4630
4320
  /**
4631
4321
  * TOKENS:
@@ -4796,7 +4486,7 @@ body {
4796
4486
 
4797
4487
  /**
4798
4488
  * Do not edit directly
4799
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4489
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4800
4490
  */
4801
4491
  /**
4802
4492
  * TOKENS:
@@ -4843,7 +4533,7 @@ body {
4843
4533
 
4844
4534
  /**
4845
4535
  * Do not edit directly
4846
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4536
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4847
4537
  */
4848
4538
  /**
4849
4539
  * TOKENS:
@@ -4853,7 +4543,7 @@ body {
4853
4543
  */
4854
4544
  /**
4855
4545
  * Do not edit directly
4856
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4546
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4857
4547
  */
4858
4548
  /**
4859
4549
  * TOKENS:
@@ -4863,7 +4553,7 @@ body {
4863
4553
  */
4864
4554
  /**
4865
4555
  * Do not edit directly
4866
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4556
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4867
4557
  */
4868
4558
  /**
4869
4559
  * TOKENS:
@@ -4960,7 +4650,7 @@ body {
4960
4650
 
4961
4651
  /**
4962
4652
  * Do not edit directly
4963
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4653
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4964
4654
  */
4965
4655
  /**
4966
4656
  * TOKENS:
@@ -5850,7 +5540,7 @@ body {
5850
5540
 
5851
5541
  /**
5852
5542
  * Do not edit directly
5853
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5543
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5854
5544
  */
5855
5545
  /**
5856
5546
  * TOKENS:
@@ -5860,7 +5550,7 @@ body {
5860
5550
  */
5861
5551
  /**
5862
5552
  * Do not edit directly
5863
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5553
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5864
5554
  */
5865
5555
  /**
5866
5556
  * TOKENS:
@@ -5870,7 +5560,7 @@ body {
5870
5560
  */
5871
5561
  /**
5872
5562
  * Do not edit directly
5873
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5563
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5874
5564
  */
5875
5565
  /**
5876
5566
  * TOKENS:
@@ -6062,7 +5752,7 @@ body {
6062
5752
 
6063
5753
  /**
6064
5754
  * Do not edit directly
6065
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5755
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6066
5756
  */
6067
5757
  /**
6068
5758
  * TOKENS:
@@ -6202,7 +5892,7 @@ body {
6202
5892
 
6203
5893
  /**
6204
5894
  * Do not edit directly
6205
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5895
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6206
5896
  */
6207
5897
  /**
6208
5898
  * TOKENS:
@@ -6212,7 +5902,7 @@ body {
6212
5902
  */
6213
5903
  /**
6214
5904
  * Do not edit directly
6215
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5905
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6216
5906
  */
6217
5907
  /**
6218
5908
  * TOKENS:
@@ -6237,7 +5927,7 @@ body {
6237
5927
  }
6238
5928
  /**
6239
5929
  * Do not edit directly
6240
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5930
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6241
5931
  */
6242
5932
  /**
6243
5933
  * TOKENS:
@@ -6404,7 +6094,7 @@ body {
6404
6094
 
6405
6095
  /**
6406
6096
  * Do not edit directly
6407
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6097
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6408
6098
  */
6409
6099
  /**
6410
6100
  * TOKENS:
@@ -6511,7 +6201,7 @@ body {
6511
6201
 
6512
6202
  /**
6513
6203
  * Do not edit directly
6514
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6204
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6515
6205
  */
6516
6206
  /**
6517
6207
  * TOKENS:
@@ -6521,7 +6211,7 @@ body {
6521
6211
  */
6522
6212
  /**
6523
6213
  * Do not edit directly
6524
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6214
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6525
6215
  */
6526
6216
  /**
6527
6217
  * TOKENS:
@@ -6546,7 +6236,7 @@ body {
6546
6236
  }
6547
6237
  /**
6548
6238
  * Do not edit directly
6549
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6239
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6550
6240
  */
6551
6241
  /**
6552
6242
  * TOKENS:
@@ -6607,7 +6297,7 @@ body {
6607
6297
 
6608
6298
  /**
6609
6299
  * Do not edit directly
6610
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6300
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6611
6301
  */
6612
6302
  /**
6613
6303
  * TOKENS:
@@ -7022,7 +6712,7 @@ body {
7022
6712
 
7023
6713
  /**
7024
6714
  * Do not edit directly
7025
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6715
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7026
6716
  */
7027
6717
  /**
7028
6718
  * TOKENS:
@@ -7076,7 +6766,7 @@ body {
7076
6766
 
7077
6767
  /**
7078
6768
  * Do not edit directly
7079
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6769
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7080
6770
  */
7081
6771
  /**
7082
6772
  * TOKENS:
@@ -7234,7 +6924,7 @@ body {
7234
6924
 
7235
6925
  /**
7236
6926
  * Do not edit directly
7237
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6927
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7238
6928
  */
7239
6929
  /**
7240
6930
  * TOKENS:
@@ -7585,7 +7275,7 @@ body {
7585
7275
 
7586
7276
  /**
7587
7277
  * Do not edit directly
7588
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7278
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7589
7279
  */
7590
7280
  /**
7591
7281
  * TOKENS:
@@ -7771,7 +7461,7 @@ body {
7771
7461
 
7772
7462
  /**
7773
7463
  * Do not edit directly
7774
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7464
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7775
7465
  */
7776
7466
  /**
7777
7467
  * TOKENS:
@@ -7829,7 +7519,7 @@ body {
7829
7519
 
7830
7520
  /**
7831
7521
  * Do not edit directly
7832
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7522
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7833
7523
  */
7834
7524
  /**
7835
7525
  * TOKENS:
@@ -8003,7 +7693,7 @@ body {
8003
7693
 
8004
7694
  /**
8005
7695
  * Do not edit directly
8006
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7696
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
8007
7697
  */
8008
7698
  /**
8009
7699
  * TOKENS:
@@ -8178,7 +7868,7 @@ body {
8178
7868
 
8179
7869
  /**
8180
7870
  * Do not edit directly
8181
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7871
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
8182
7872
  */
8183
7873
  /**
8184
7874
  * TOKENS:
@@ -9088,7 +8778,7 @@ body {
9088
8778
 
9089
8779
  /**
9090
8780
  * Do not edit directly
9091
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8781
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
9092
8782
  */
9093
8783
  /**
9094
8784
  * TOKENS:
@@ -9098,7 +8788,7 @@ body {
9098
8788
  */
9099
8789
  /**
9100
8790
  * Do not edit directly
9101
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8791
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
9102
8792
  */
9103
8793
  /**
9104
8794
  * TOKENS:
@@ -9123,7 +8813,7 @@ body {
9123
8813
  }
9124
8814
  /**
9125
8815
  * Do not edit directly
9126
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8816
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
9127
8817
  */
9128
8818
  /**
9129
8819
  * TOKENS: