@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
@@ -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:
@@ -169,7 +169,7 @@ body {
169
169
 
170
170
  /**
171
171
  * Do not edit directly
172
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
172
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
173
173
  */
174
174
  /**
175
175
  * TOKENS:
@@ -288,7 +288,7 @@ body {
288
288
 
289
289
  /**
290
290
  * Do not edit directly
291
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
291
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
292
292
  */
293
293
  /**
294
294
  * TOKENS:
@@ -313,7 +313,7 @@ body {
313
313
  }
314
314
  /**
315
315
  * Do not edit directly
316
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
316
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
317
317
  */
318
318
  /**
319
319
  * TOKENS:
@@ -567,7 +567,7 @@ body {
567
567
 
568
568
  /**
569
569
  * Do not edit directly
570
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
570
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
571
571
  */
572
572
  /**
573
573
  * TOKENS:
@@ -577,7 +577,7 @@ body {
577
577
  */
578
578
  /**
579
579
  * Do not edit directly
580
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
580
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
581
581
  */
582
582
  /**
583
583
  * TOKENS:
@@ -602,7 +602,7 @@ body {
602
602
  }
603
603
  /**
604
604
  * Do not edit directly
605
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
605
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
606
606
  */
607
607
  /**
608
608
  * TOKENS:
@@ -892,7 +892,7 @@ body {
892
892
 
893
893
  /**
894
894
  * Do not edit directly
895
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
895
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
896
896
  */
897
897
  /**
898
898
  * TOKENS:
@@ -1022,7 +1022,7 @@ body {
1022
1022
 
1023
1023
  /**
1024
1024
  * Do not edit directly
1025
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
1025
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1026
1026
  */
1027
1027
  /**
1028
1028
  * TOKENS:
@@ -1031,37 +1031,75 @@ body {
1031
1031
  * MAPS:
1032
1032
  */
1033
1033
  .ilo--card {
1034
- margin: 0;
1034
+ box-sizing: border-box;
1035
+ position: relative;
1036
+ max-width: var(--max-width);
1037
+ flex: 1 1 var(--max-width);
1038
+ }
1039
+ .ilo--card__size__fluid {
1040
+ --max-width: 100% !important;
1035
1041
  }
1036
1042
  .right-to-left .ilo--card {
1037
1043
  text-align: right;
1038
1044
  }
1039
- .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) {
1045
+ .ilo--card__action:hover, .ilo--card__action:focus, .ilo--card__action:focus-within {
1040
1046
  background: rgb(255, 255, 255);
1041
- color: rgb(30, 45, 190);
1042
1047
  outline: none;
1043
1048
  text-decoration: none;
1044
1049
  }
1045
- .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) {
1050
+ .ilo--card__action:hover.ilo--card__dark, .ilo--card__action:focus.ilo--card__dark, .ilo--card__action:focus-within.ilo--card__dark {
1046
1051
  background: rgb(255, 255, 255);
1047
1052
  }
1048
- .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 {
1049
- 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");
1050
- }
1051
- .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 {
1053
+ .ilo--card__action:hover .ilo--card--eyebrow,
1054
+ .ilo--card__action:hover .ilo--card--title,
1055
+ .ilo--card__action:hover .ilo--card--intro,
1056
+ .ilo--card__action:hover .ilo--card--date,
1057
+ .ilo--card__action:hover .ilo--card--date-extra, .ilo--card__action:focus .ilo--card--eyebrow,
1058
+ .ilo--card__action:focus .ilo--card--title,
1059
+ .ilo--card__action:focus .ilo--card--intro,
1060
+ .ilo--card__action:focus .ilo--card--date,
1061
+ .ilo--card__action:focus .ilo--card--date-extra, .ilo--card__action:focus-within .ilo--card--eyebrow,
1062
+ .ilo--card__action:focus-within .ilo--card--title,
1063
+ .ilo--card__action:focus-within .ilo--card--intro,
1064
+ .ilo--card__action:focus-within .ilo--card--date,
1065
+ .ilo--card__action:focus-within .ilo--card--date-extra {
1052
1066
  color: rgb(30, 45, 190);
1053
1067
  }
1054
- .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 {
1055
- color: rgb(30, 45, 190);
1068
+ .ilo--card__theme__light {
1069
+ background: rgb(255, 255, 255);
1056
1070
  }
1057
- .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 {
1058
- color: rgb(30, 45, 190);
1071
+ .ilo--card__theme__dark {
1072
+ background: rgb(35, 0, 80);
1073
+ transition: background 150ms ease-out;
1059
1074
  }
1060
- .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 {
1061
- color: rgb(30, 45, 190);
1075
+ .ilo--card__theme__dark .ilo--card--eyebrow,
1076
+ .ilo--card__theme__dark .ilo--card--title,
1077
+ .ilo--card__theme__dark .ilo--card--intro,
1078
+ .ilo--card__theme__dark .ilo--card--date,
1079
+ .ilo--card__theme__dark .ilo--card--eventdate {
1080
+ color: rgb(237, 240, 242);
1081
+ transition: color 150ms ease-out;
1062
1082
  }
1063
- .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 {
1064
- color: rgb(30, 45, 190);
1083
+ .ilo--card__isvideo .ilo--card--image--wrapper {
1084
+ position: relative;
1085
+ }
1086
+ .ilo--card__isvideo .ilo--card--image--wrapper::before {
1087
+ 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");
1088
+ background-color: rgb(45, 45, 45);
1089
+ background-position: center;
1090
+ background-size: 18px 20px;
1091
+ background-repeat: no-repeat;
1092
+ content: "";
1093
+ display: block;
1094
+ height: 40px;
1095
+ left: 0;
1096
+ position: absolute;
1097
+ top: 0;
1098
+ width: 40px;
1099
+ z-index: 1;
1100
+ }
1101
+ .ilo--card--wrapper:hover, .ilo--card--wrapper:focus, .ilo--card--wrapper:focus-within {
1102
+ 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));
1065
1103
  }
1066
1104
  .ilo--card--link {
1067
1105
  background: none;
@@ -1083,6 +1121,21 @@ body {
1083
1121
  transition-duration: 150ms;
1084
1122
  transition-timing-function: ease-out;
1085
1123
  }
1124
+ .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 {
1125
+ color: rgb(30, 45, 190);
1126
+ }
1127
+ .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 {
1128
+ color: rgb(30, 45, 190);
1129
+ }
1130
+ .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 {
1131
+ color: rgb(30, 45, 190);
1132
+ }
1133
+ .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 {
1134
+ color: rgb(30, 45, 190);
1135
+ }
1136
+ .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 {
1137
+ color: rgb(30, 45, 190);
1138
+ }
1086
1139
  .ilo--card--link--text {
1087
1140
  width: 1px;
1088
1141
  height: 1px;
@@ -1093,176 +1146,6 @@ body {
1093
1146
  clip: rect(0 0 0 0);
1094
1147
  overflow: hidden;
1095
1148
  }
1096
- .ilo--card--light {
1097
- background: rgb(255, 255, 255);
1098
- }
1099
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) {
1100
- background: rgb(35, 0, 80);
1101
- outline: none;
1102
- transition: background 150ms ease-out;
1103
- }
1104
- .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 {
1105
- color: rgb(237, 240, 242);
1106
- transition: color 150ms ease-out;
1107
- }
1108
- .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 {
1109
- color: rgb(255, 255, 255);
1110
- transition: color 150ms ease-out;
1111
- }
1112
- .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 {
1113
- color: rgb(237, 240, 242);
1114
- transition: color 150ms ease-out;
1115
- }
1116
- .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 {
1117
- color: rgb(237, 240, 242);
1118
- transition: color 150ms ease-out;
1119
- }
1120
- .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 {
1121
- color: rgb(237, 240, 242);
1122
- transition: color 150ms ease-out;
1123
- }
1124
- .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 {
1125
- background: rgb(35, 0, 80);
1126
- outline: none;
1127
- transition: background 150ms ease-out;
1128
- }
1129
- .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 {
1130
- color: rgb(237, 240, 242);
1131
- transition: color 150ms ease-out;
1132
- }
1133
- .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 {
1134
- color: rgb(255, 255, 255);
1135
- transition: color 150ms ease-out;
1136
- }
1137
- .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 {
1138
- color: rgb(237, 240, 242);
1139
- transition: color 150ms ease-out;
1140
- }
1141
- .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 {
1142
- color: rgb(237, 240, 242);
1143
- transition: color 150ms ease-out;
1144
- }
1145
- .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 {
1146
- color: rgb(237, 240, 242);
1147
- transition: color 150ms ease-out;
1148
- }
1149
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
1150
- margin-top: 2.1436227224rem;
1151
- padding-top: 0;
1152
- position: relative;
1153
- }
1154
- .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 {
1155
- background: inherit;
1156
- content: "";
1157
- display: block;
1158
- height: 40px;
1159
- position: absolute;
1160
- width: calc(100% - 73px);
1161
- }
1162
- .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 {
1163
- 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");
1164
- background-position: bottom right;
1165
- background-size: cover;
1166
- content: "";
1167
- height: 40px;
1168
- display: block;
1169
- position: absolute;
1170
- width: 73.4px;
1171
- }
1172
- .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 {
1173
- 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");
1174
- }
1175
- @media screen and (min-width: 610px) {
1176
- .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) {
1177
- margin-top: 2.5723472669rem;
1178
- }
1179
- .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 {
1180
- background: inherit;
1181
- content: "";
1182
- display: block;
1183
- height: 48px;
1184
- position: absolute;
1185
- width: calc(100% - 87px);
1186
- }
1187
- .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 {
1188
- 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");
1189
- background-position: bottom right;
1190
- background-size: cover;
1191
- content: "";
1192
- height: 48px;
1193
- display: block;
1194
- position: absolute;
1195
- width: 87.4px;
1196
- }
1197
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1198
- 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");
1199
- }
1200
- }
1201
- @media screen and (min-width: 1024px) {
1202
- .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) {
1203
- margin-top: 3.4297963558rem;
1204
- }
1205
- .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 {
1206
- background: inherit;
1207
- content: "";
1208
- display: block;
1209
- height: 64px;
1210
- position: absolute;
1211
- width: calc(100% - 116px);
1212
- }
1213
- .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 {
1214
- 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");
1215
- background-position: bottom right;
1216
- background-size: cover;
1217
- content: "";
1218
- height: 64px;
1219
- display: block;
1220
- position: absolute;
1221
- width: 116.4px;
1222
- }
1223
- .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 {
1224
- 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");
1225
- }
1226
- }
1227
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1228
- left: 0;
1229
- top: -2.1436227224rem;
1230
- transition: background-image 150ms ease-out;
1231
- }
1232
- .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 {
1233
- left: auto;
1234
- right: 0;
1235
- }
1236
- @media screen and (min-width: 610px) {
1237
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1238
- top: -2.5562700965rem;
1239
- }
1240
- }
1241
- @media screen and (min-width: 1024px) {
1242
- .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 {
1243
- top: -3.4137191854rem;
1244
- }
1245
- }
1246
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1247
- right: 0;
1248
- top: -2.1436227224rem;
1249
- transition: background-image 150ms ease-out;
1250
- }
1251
- .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 {
1252
- left: 0;
1253
- right: auto;
1254
- transform: rotateY(180deg);
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)::after {
1258
- top: -2.5562700965rem;
1259
- }
1260
- }
1261
- @media screen and (min-width: 1024px) {
1262
- .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 {
1263
- top: -3.4137191854rem;
1264
- }
1265
- }
1266
1149
  .ilo--card--eyebrow {
1267
1150
  color: rgb(150, 10, 85);
1268
1151
  font-size: 16px;
@@ -1335,7 +1218,7 @@ body {
1335
1218
  line-height: 23.36px;
1336
1219
  margin-bottom: 1.3742266073rem;
1337
1220
  }
1338
- .ilo--card--image {
1221
+ .ilo--card--picture {
1339
1222
  max-width: 100%;
1340
1223
  width: 100%;
1341
1224
  }
@@ -1343,190 +1226,131 @@ body {
1343
1226
  position: relative;
1344
1227
  z-index: 2;
1345
1228
  }
1346
- .ilo--card--isvideo .ilo--card--image--wrapper {
1229
+
1230
+ /**
1231
+ * Do not edit directly
1232
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1233
+ */
1234
+ /**
1235
+ * TOKENS:
1236
+ */
1237
+ /**
1238
+ * MAPS:
1239
+ */
1240
+ .ilo--card__type__feature {
1241
+ --max-width: 22.0793140407rem;
1242
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1243
+ display: flex;
1244
+ margin-top: 0;
1347
1245
  position: relative;
1348
1246
  }
1349
- .ilo--card--isvideo .ilo--card--image--wrapper::before {
1350
- 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");
1351
- background-color: rgb(45, 45, 45);
1352
- background-position: center;
1353
- background-size: 18px 20px;
1354
- background-repeat: no-repeat;
1355
- content: "";
1356
- display: block;
1357
- height: 40px;
1358
- left: 0;
1359
- position: absolute;
1360
- top: 0;
1361
- width: 40px;
1362
- z-index: 1;
1247
+ .ilo--card__type__feature.ilo--card__theme__dark {
1248
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1363
1249
  }
1364
- .ilo--card--multilink {
1365
- padding: 1.2861736334rem;
1250
+ .ilo--card__type__feature.ilo--card__theme__dark .ilo--link-list {
1251
+ border-top: 2px solid rgba(237, 240, 242, 0.25);
1366
1252
  }
1367
- .ilo--card--multilink .ilo--card--image--wrapper {
1368
- display: none;
1253
+ .ilo--card__type__feature.ilo--card__theme__dark .ilo--link-list--link {
1254
+ color: rgb(255, 255, 255);
1255
+ 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");
1369
1256
  }
1370
- .ilo--card--multilink .ilo--card--content .ilo--card--image--wrapper {
1371
- display: block;
1257
+ .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 {
1258
+ color: rgb(30, 45, 190);
1259
+ 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");
1372
1260
  }
1373
- @media screen and (min-width: 610px) {
1374
- .ilo--card--multilink {
1375
- padding: 2.1436227224rem;
1376
- }
1261
+ .ilo--card__type__feature picture::before {
1262
+ transition-property: opacity;
1263
+ transition-duration: 150ms;
1264
+ transition-timing-function: ease-out;
1377
1265
  }
1378
- @media screen and (min-width: 1024px) {
1379
- .ilo--card--multilink {
1380
- padding: 3.0010718114rem 2.5723472669rem;
1381
- }
1266
+ .ilo--card__type__feature:hover, .ilo--card__type__feature:focus, .ilo--card__type__feature:focus-within {
1267
+ background-color: rgb(255, 255, 255);
1268
+ border-bottom: 0.1607717042rem solid rgb(30, 45, 190);
1269
+ 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));
1382
1270
  }
1383
- .ilo--card--multilink .ilo--card--title {
1384
- font-size: 23.32px;
1385
- letter-spacing: -0.035em;
1386
- line-height: 29.15px;
1387
- margin-bottom: 0.7188906752rem;
1388
- color: rgb(45, 45, 45);
1271
+ .ilo--card__type__feature:hover picture::before, .ilo--card__type__feature:focus picture::before, .ilo--card__type__feature:focus-within picture::before {
1272
+ opacity: 0.4;
1273
+ z-index: 1;
1274
+ transition-property: opacity;
1275
+ transition-duration: 150ms;
1276
+ transition-timing-function: ease-out;
1389
1277
  }
1390
- @media screen and (min-width: 610px) {
1391
- .ilo--card--multilink .ilo--card--title {
1392
- font-size: 29.16px;
1393
- letter-spacing: -0.035em;
1394
- line-height: 36.45px;
1395
- margin-bottom: 0.5741425509rem;
1396
- }
1278
+ .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 {
1279
+ filter: saturate(0);
1397
1280
  }
1398
- .ilo--card--multilink .ilo--card--intro {
1399
- font-size: 16px;
1400
- letter-spacing: normal;
1401
- line-height: 23.36px;
1402
- margin-bottom: 1.910132288rem;
1403
- color: rgb(45, 45, 45);
1281
+ .ilo--card__type__feature .ilo--link-list {
1282
+ border-top: 0.1071811361rem solid rgb(237, 240, 242);
1283
+ margin-left: -1.2861736334rem;
1284
+ margin-right: -1.2861736334rem;
1285
+ margin-top: 1.822079314rem;
1286
+ position: relative;
1287
+ z-index: 2;
1404
1288
  }
1405
- @media screen and (min-width: 610px) {
1406
- .ilo--card--multilink .ilo--card--intro {
1407
- font-size: 18.66px;
1408
- letter-spacing: normal;
1409
- line-height: 27.24px;
1410
- margin-bottom: 1.8685411561rem;
1411
- }
1289
+ .ilo--card__type__feature .ilo--link-list--link, .ilo--card__type__feature .ilo--link-list--link:hover {
1290
+ border-bottom: none;
1291
+ padding-left: 1.2861736334rem;
1292
+ padding-right: 1.2861736334rem;
1412
1293
  }
1413
- .ilo--card--multilink.ilo--card--dark {
1414
- background: rgb(255, 255, 255);
1294
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--wrap {
1295
+ display: flex;
1296
+ flex-wrap: wrap;
1297
+ width: 100%;
1415
1298
  }
1416
- .ilo--card--multilink.ilo--card--dark .ilo--card--title {
1417
- color: rgb(45, 45, 45);
1299
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--content {
1300
+ width: 100%;
1418
1301
  }
1419
- .ilo--card--multilink.ilo--card--dark .ilo--card--intro {
1420
- color: rgb(45, 45, 45);
1302
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--image--wrapper {
1303
+ width: 100%;
1421
1304
  }
1422
- .ilo--card--multilink.ilo--card--wide {
1423
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1305
+ .ilo--card__type__feature.ilo--card__size__wide, .ilo--card__type__feature.ilo--card__size__fluid {
1306
+ --max-width: 40.4072883173rem;
1424
1307
  }
1425
1308
  @media screen and (min-width: 610px) {
1426
- .ilo--card--multilink.ilo--card--wide {
1427
- padding: 3.0010718114rem 2.5723472669rem;
1428
- }
1429
- .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1430
- flex-direction: row-reverse;
1431
- }
1432
- .right-to-left .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1309
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--wrap, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--wrap {
1433
1310
  flex-direction: row;
1434
1311
  }
1435
- .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1436
- display: flex;
1437
- column-gap: 1.7148981779rem;
1438
- }
1439
- .right-to-left .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1312
+ .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 {
1440
1313
  flex-direction: row-reverse;
1441
1314
  }
1442
- .ilo--card--multilink.ilo--card--wide .ilo--card--image--wrapper {
1443
- display: block;
1315
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--content, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--content {
1316
+ display: flex;
1317
+ flex-direction: row;
1318
+ flex-wrap: wrap;
1319
+ position: relative;
1444
1320
  width: 50%;
1445
1321
  }
1446
- .ilo--card--multilink.ilo--card--wide .ilo--card--content {
1322
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--image--wrapper {
1447
1323
  width: 50%;
1448
1324
  }
1449
- .ilo--card--multilink.ilo--card--wide .ilo--card--content .ilo--card--image--wrapper {
1450
- display: none;
1325
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--image, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--image {
1326
+ object-fit: cover;
1451
1327
  }
1452
- }
1453
- .ilo--card--multilink.ilo--card--standard {
1454
- padding: 2.5723472669rem 2.1436227224rem;
1455
- }
1456
- @media screen and (min-width: 610px) {
1457
- .ilo--card--multilink.ilo--card--standard {
1458
- padding: 2.5723472669rem 2.1436227224rem;
1459
- }
1460
- }
1461
- @media screen and (min-width: 1024px) {
1462
- .ilo--card--multilink.ilo--card--standard {
1463
- padding: 2.5723472669rem 2.1436227224rem;
1464
- }
1465
- }
1466
- .ilo--card--multilink.ilo--card--narrow {
1467
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1468
- }
1469
- @media screen and (min-width: 610px) {
1470
- .ilo--card--multilink.ilo--card--narrow {
1471
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1472
- }
1473
- }
1474
- @media screen and (min-width: 1024px) {
1475
- .ilo--card--multilink.ilo--card--narrow {
1476
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1328
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--date, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--date {
1329
+ align-self: flex-end;
1330
+ width: 100%;
1477
1331
  }
1478
- }
1479
- .ilo--card--multilink.ilo--card--narrow .ilo--card--image--wrapper {
1480
- display: none;
1481
- }
1482
- .ilo--card--multilink.ilo--card--narrow .ilo--card--content .ilo--card--image--wrapper {
1483
- display: block;
1484
- margin-bottom: 1.2861736334rem;
1485
- }
1486
- @media screen and (min-width: 610px) {
1487
- .ilo--card--multilink.ilo--card--narrow .ilo--card--title {
1488
- font-size: 23.32px;
1489
- letter-spacing: -0.035em;
1490
- line-height: 29.15px;
1491
- margin-bottom: 0.7188906752rem;
1332
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--eyebrow, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--eyebrow {
1333
+ width: 100%;
1492
1334
  }
1493
- }
1494
- @media screen and (min-width: 610px) {
1495
- .ilo--card--multilink.ilo--card--narrow .ilo--card--intro {
1496
- font-size: 16px;
1497
- letter-spacing: normal;
1498
- line-height: 23.36px;
1499
- margin-bottom: 1.910132288rem;
1335
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--title, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--title {
1336
+ width: 100%;
1500
1337
  }
1501
- }
1502
- .ilo--card--multilink .ilo--link-list {
1503
- margin-top: 1.8756698821rem;
1504
- }
1505
- .ilo--card--detail {
1506
- border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1507
- padding: 1.2861736334rem 0;
1508
- position: relative;
1509
- }
1510
- @media screen and (min-width: 1024px) {
1511
- .ilo--card--detail {
1512
- padding: 1.7148981779rem 0;
1338
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--link-list, .ilo--card__type__feature.ilo--card__size__fluid .ilo--link-list {
1339
+ width: calc(100% + 48px);
1340
+ align-self: flex-end;
1513
1341
  }
1514
1342
  }
1515
- .ilo--card--detail:hover, .ilo--card--detail:focus, .ilo--card--detail:focus-within {
1516
- 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));
1517
- }
1518
- .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before, .ilo--card--detail:focus-within picture::before {
1519
- opacity: 0.4;
1520
- z-index: 2;
1521
- }
1522
- .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 {
1523
- 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");
1343
+ .ilo--card__type__feature .ilo--card--wrap {
1344
+ display: flex;
1345
+ flex-direction: column;
1346
+ width: 100%;
1524
1347
  }
1525
- .ilo--card--detail picture {
1348
+ .ilo--card__type__feature picture {
1526
1349
  display: flex;
1350
+ height: 100%;
1527
1351
  position: relative;
1528
1352
  }
1529
- .ilo--card--detail picture::before {
1353
+ .ilo--card__type__feature picture::before {
1530
1354
  background-color: rgb(30, 45, 190);
1531
1355
  content: "";
1532
1356
  display: block;
@@ -1535,725 +1359,590 @@ body {
1535
1359
  opacity: 0;
1536
1360
  position: absolute;
1537
1361
  top: 0;
1362
+ transition: opacity 150ms ease-in-out;
1538
1363
  width: 100%;
1539
1364
  z-index: -1;
1540
- transition-property: opacity;
1541
- transition-duration: 150ms;
1542
- transition-timing-function: ease-out;
1543
1365
  }
1544
- .ilo--card--detail .ilo--card--wrap {
1366
+ .ilo--card__type__feature .ilo--card--content {
1545
1367
  display: flex;
1368
+ flex: 1 1 auto;
1369
+ flex-direction: column;
1370
+ padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
1546
1371
  }
1547
- .right-to-left .ilo--card--detail .ilo--card--wrap {
1548
- flex-direction: row-reverse;
1372
+ .ilo--card__type__feature.ilo--card__linklist .ilo--card--content {
1373
+ padding-bottom: 0;
1549
1374
  }
1550
- .ilo--card--detail .ilo--card--image {
1551
- object-fit: contain;
1552
- width: 4.1264737406rem;
1375
+ .ilo--card__type__feature .ilo--card--title {
1376
+ font-size: 23.32px;
1377
+ letter-spacing: -0.035em;
1378
+ line-height: 29.15px;
1379
+ margin-bottom: 1.5763397642rem;
1380
+ font-family: Overpass;
1381
+ font-weight: 700;
1553
1382
  }
1554
- @media screen and (min-width: 1024px) {
1555
- .ilo--card--detail .ilo--card--image {
1556
- width: 10.718113612rem;
1383
+ .ilo--card__type__feature .ilo--card--eyebrow {
1384
+ font-size: 14.93px;
1385
+ letter-spacing: normal;
1386
+ line-height: 19.71px;
1387
+ margin-bottom: 0.3376482577rem;
1388
+ }
1389
+ .ilo--card__type__feature .ilo--card--date {
1390
+ margin-bottom: 0;
1391
+ margin-top: auto;
1392
+ }
1393
+
1394
+ /**
1395
+ * Do not edit directly
1396
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1397
+ */
1398
+ /**
1399
+ * TOKENS:
1400
+ */
1401
+ /**
1402
+ * MAPS:
1403
+ */
1404
+ .ilo--card__type__text {
1405
+ --max-width: 16.1307609861rem;
1406
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1407
+ padding: 1.2861736334rem 2.1436227224rem;
1408
+ clip-path: polygon(0 0, calc(100% - 73px) 0, 100% 40px, 100% 100%, 0 100%);
1409
+ }
1410
+ .ilo--card__type__text [class$=profile--contents--light] * {
1411
+ color: rgb(45, 45, 45);
1412
+ }
1413
+ .ilo--card__type__text [class$=profile--contents--dark] * {
1414
+ color: rgb(255, 255, 255);
1415
+ }
1416
+ .ilo--card__type__text:hover, .ilo--card__type__text:focus, .ilo--card__type__text:focus-within {
1417
+ 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));
1418
+ }
1419
+ .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] * {
1420
+ color: rgb(30, 45, 190);
1421
+ }
1422
+ @media screen and (min-width: 610px) {
1423
+ .ilo--card__type__text {
1424
+ padding: 1.7148981779rem 2.1436227224rem;
1557
1425
  }
1558
1426
  }
1559
- .ilo--card--detail .ilo--card--image--wrapper {
1560
- max-width: 4.1264737406rem;
1561
- width: 100%;
1427
+ .ilo--card__type__text.ilo--card__size__wide, .ilo--card__type__text.ilo--card__size__fluid {
1428
+ --max-width: 28.0278670954rem;
1429
+ padding: 1.7148981779rem 2.1436227224rem;
1562
1430
  }
1563
- @media screen and (min-width: 1024px) {
1564
- .ilo--card--detail .ilo--card--image--wrapper {
1565
- max-width: 10.718113612rem;
1431
+ @media screen and (min-width: 610px) {
1432
+ .ilo--card__type__text.ilo--card__size__wide, .ilo--card__type__text.ilo--card__size__fluid {
1433
+ padding: 1.7148981779rem 2.1436227224rem;
1566
1434
  }
1567
1435
  }
1568
- .ilo--card--detail .ilo--card--content {
1569
- padding: 0 1.2861736334rem;
1436
+ .ilo--card__type__text.ilo--card__size__narrow {
1437
+ --max-width: 16.1307609861rem;
1438
+ padding: 1.2861736334rem 2.1436227224rem;
1570
1439
  }
1571
- .ilo--card--detail .ilo--card--title {
1440
+ @media screen and (min-width: 610px) {
1441
+ .ilo--card__type__text.ilo--card__size__narrow {
1442
+ padding: 1.2861736334rem 2.1436227224rem;
1443
+ }
1444
+ }
1445
+ .ilo--card__type__text.ilo--card__size__narrow .ilo--card--title {
1572
1446
  font-size: 18.66px;
1573
1447
  letter-spacing: -0.035em;
1574
1448
  line-height: 24.26px;
1449
+ margin-bottom: 1.674953518rem;
1575
1450
  }
1576
- @media screen and (min-width: 1024px) {
1577
- .ilo--card--detail .ilo--card--title {
1451
+ .ilo--card__type__text.ilo--card__dark {
1452
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1453
+ }
1454
+ .ilo--card__type__text .ilo--card--eyebrow {
1455
+ margin-bottom: 1.0110920672rem;
1456
+ }
1457
+ .ilo--card__type__text .ilo--card--title {
1458
+ font-size: 18.66px;
1459
+ letter-spacing: -0.035em;
1460
+ line-height: 24.26px;
1461
+ margin-bottom: 1.674953518rem;
1462
+ }
1463
+ @media screen and (min-width: 610px) {
1464
+ .ilo--card__type__text .ilo--card--title {
1578
1465
  font-size: 23.32px;
1579
1466
  letter-spacing: -0.035em;
1580
1467
  line-height: 29.15px;
1468
+ margin-bottom: 1.5763397642rem;
1581
1469
  }
1582
1470
  }
1583
- .ilo--card--detail .ilo--card--event-date {
1584
- font-size: 16px;
1585
- letter-spacing: normal;
1586
- line-height: 23.36px;
1587
- margin-bottom: 0;
1588
- padding-left: 1.2861736334rem;
1589
- position: relative;
1590
- }
1591
- .ilo--card--detail .ilo--card--event-date::before {
1592
- background-repeat: no-repeat;
1593
- content: "";
1594
- display: inline-block;
1595
- height: 0.7502679528rem;
1596
- left: 0;
1597
- position: absolute;
1598
- top: 50%;
1599
- transform: rotate(-90deg) translateX(50%);
1600
- width: 0.6430868167rem;
1601
- 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");
1602
- }
1603
- .ilo--card--detail .ilo--card--date {
1604
- font-size: 16px;
1605
- letter-spacing: normal;
1606
- line-height: 23.36px;
1607
- }
1608
- .ilo--card--graphic {
1609
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1610
- margin-top: 2.1436227224rem;
1611
- padding: 0 1.2861736334rem 2.1436227224rem;
1612
- position: relative;
1613
- }
1614
- .ilo--card--graphic::before {
1615
- background: inherit;
1616
- content: "";
1471
+ .ilo--card__type__text .ilo--card--date {
1617
1472
  display: block;
1618
- height: 40px;
1619
- position: absolute;
1620
- width: calc(100% - 73px);
1621
- }
1622
- .ilo--card--graphic::after {
1623
- 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");
1624
- background-position: bottom right;
1625
- background-size: cover;
1626
- content: "";
1627
- height: 40px;
1628
- display: block;
1629
- position: absolute;
1630
- width: 73.4px;
1631
- }
1632
- .ilo--card--graphic.ilo--card--dark::after {
1633
- 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");
1634
- }
1635
- .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 {
1636
- 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");
1637
- }
1638
- .ilo--card--graphic::before {
1639
- left: 0;
1640
- top: -39.7px;
1473
+ margin-bottom: 1.4398166117rem;
1641
1474
  }
1642
- .right-to-left .ilo--card--graphic::before {
1643
- left: auto;
1644
- right: 0;
1475
+ .ilo--card__type__text .ilo--card--content {
1476
+ display: flex;
1477
+ flex-direction: column;
1478
+ position: relative;
1645
1479
  }
1646
- .ilo--card--graphic::after {
1647
- right: 0;
1648
- top: -39.7px;
1649
- transition: background-image 150ms ease-out;
1480
+ .ilo--card__type__text .ilo--card--content > * {
1481
+ justify-self: flex-start;
1650
1482
  }
1651
- .right-to-left .ilo--card--graphic::after {
1652
- left: 0;
1653
- right: auto;
1654
- transform: rotateY(180deg);
1483
+ .ilo--card__type__text .ilo--card--content > *:last-child {
1484
+ justify-self: flex-end;
1485
+ margin-bottom: 0;
1655
1486
  }
1656
- .ilo--card--graphic .ilo--profile--contents--light * {
1657
- color: rgb(45, 45, 45);
1487
+
1488
+ /**
1489
+ * Do not edit directly
1490
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1491
+ */
1492
+ /**
1493
+ * TOKENS:
1494
+ */
1495
+ /**
1496
+ * MAPS:
1497
+ */
1498
+ .ilo--card__type__detail {
1499
+ --max-width: 18.3815648446rem;
1500
+ border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1501
+ padding: 1.2861736334rem 0;
1502
+ position: relative;
1658
1503
  }
1659
- .ilo--card--graphic .ilo--profile--contents--dark * {
1660
- color: rgb(255, 255, 255);
1504
+ @media screen and (min-width: 1024px) {
1505
+ .ilo--card__type__detail {
1506
+ padding: 1.7148981779rem 0;
1507
+ }
1661
1508
  }
1662
- .ilo--card--graphic:hover, .ilo--card--graphic:focus, .ilo--card--graphic:focus-within {
1509
+ .ilo--card__type__detail:hover, .ilo--card__type__detail:focus, .ilo--card__type__detail:focus-within {
1663
1510
  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));
1664
1511
  }
1665
- .ilo--card--graphic:hover .ilo--profile--contents *, .ilo--card--graphic:focus .ilo--profile--contents *, .ilo--card--graphic:focus-within .ilo--profile--contents * {
1666
- color: rgb(30, 45, 190);
1512
+ .ilo--card__type__detail:hover picture::before, .ilo--card__type__detail:focus picture::before, .ilo--card__type__detail:focus-within picture::before {
1513
+ opacity: 0.4;
1514
+ z-index: 2;
1667
1515
  }
1668
- @media screen and (min-width: 610px) {
1669
- .ilo--card--graphic {
1670
- padding: 0 1.7148981779rem 2.1436227224rem;
1671
- }
1672
- .ilo--card--graphic::before {
1673
- background: inherit;
1674
- content: "";
1675
- display: block;
1676
- height: 40px;
1677
- position: absolute;
1678
- width: calc(100% - 73px);
1679
- }
1680
- .ilo--card--graphic::after {
1681
- 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");
1682
- background-position: bottom right;
1683
- background-size: cover;
1684
- content: "";
1685
- height: 40px;
1686
- display: block;
1687
- position: absolute;
1688
- width: 73.4px;
1689
- }
1690
- .ilo--card--graphic.ilo--card--dark::after {
1691
- 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");
1692
- }
1693
- .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 {
1694
- 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");
1695
- }
1696
- .ilo--card--graphic::before {
1697
- left: 0;
1698
- top: -39.7px;
1699
- }
1700
- .right-to-left .ilo--card--graphic::before {
1701
- left: auto;
1702
- right: 0;
1703
- }
1704
- .ilo--card--graphic::after {
1705
- right: 0;
1706
- top: -39.7px;
1707
- }
1708
- .right-to-left .ilo--card--graphic::after {
1709
- left: 0;
1710
- right: auto;
1711
- transform: rotateY(180deg);
1712
- }
1516
+ .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 {
1517
+ 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");
1518
+ }
1519
+ .ilo--card__type__detail .ilo--card--title {
1520
+ font-size: 18.66px;
1521
+ letter-spacing: -0.035em;
1522
+ line-height: 24.26px;
1713
1523
  }
1714
1524
  @media screen and (min-width: 1024px) {
1715
- .ilo--card--graphic::before {
1716
- background: inherit;
1717
- content: "";
1718
- display: block;
1719
- height: 40px;
1720
- position: absolute;
1721
- width: calc(100% - 73px);
1722
- }
1723
- .ilo--card--graphic::after {
1724
- 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");
1725
- background-position: bottom right;
1726
- background-size: cover;
1727
- content: "";
1728
- height: 40px;
1729
- display: block;
1730
- position: absolute;
1731
- width: 73.4px;
1732
- }
1733
- .ilo--card--graphic.ilo--card--dark::after {
1734
- 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");
1735
- }
1736
- .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 {
1737
- 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");
1738
- }
1739
- .ilo--card--graphic::before {
1740
- left: 0;
1741
- top: -39.7px;
1742
- }
1743
- .right-to-left .ilo--card--graphic::before {
1744
- left: auto;
1745
- right: 0;
1746
- }
1747
- .ilo--card--graphic::after {
1748
- right: 0;
1749
- top: -39.7px;
1525
+ .ilo--card__size__wide .ilo--card__type__detail .ilo--card--title {
1526
+ font-size: 23.32px;
1527
+ letter-spacing: -0.035em;
1528
+ line-height: 29.15px;
1750
1529
  }
1751
- .right-to-left .ilo--card--graphic::after {
1752
- left: 0;
1753
- right: auto;
1754
- transform: rotateY(180deg);
1530
+ .ilo--card__size__wide .ilo--card__type__detail .ilo--card--title {
1531
+ font-size: 18.66px;
1532
+ letter-spacing: -0.035em;
1533
+ line-height: 24.26px;
1755
1534
  }
1756
1535
  }
1757
- .ilo--card--graphic.ilo--card--wide {
1758
- padding: 0 1.7148981779rem 2.1436227224rem;
1536
+ .ilo--card__type__detail.ilo--card__size__wide, .ilo--card__type__detail.ilo--card__size__fluid {
1537
+ --max-width: 39.9249732047rem;
1759
1538
  }
1760
- @media screen and (min-width: 610px) {
1761
- .ilo--card--graphic.ilo--card--wide {
1762
- padding: 0 1.7148981779rem 2.1436227224rem;
1539
+ @media screen and (min-width: 1024px) {
1540
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--title, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--title {
1541
+ font-size: 23.32px;
1542
+ letter-spacing: -0.035em;
1543
+ line-height: 29.15px;
1763
1544
  }
1764
1545
  }
1765
- .ilo--card--graphic.ilo--card--standard {
1766
- padding: 0 1.7148981779rem 2.1436227224rem;
1546
+ @media screen and (min-width: 1024px) {
1547
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--image--wrapper {
1548
+ flex: 0 0 10.5037513398rem;
1549
+ }
1767
1550
  }
1768
- @media screen and (min-width: 610px) {
1769
- .ilo--card--graphic.ilo--card--standard {
1770
- padding: 0 1.7148981779rem 2.1436227224rem;
1551
+ @media screen and (min-width: 1024px) {
1552
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--picture, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--picture {
1553
+ width: 10.5037513398rem;
1771
1554
  }
1772
1555
  }
1773
- .ilo--card--graphic.ilo--card--narrow {
1774
- padding: 0 1.2861736334rem 2.1436227224rem;
1556
+ .ilo--card__type__detail.ilo--card__size__narrow {
1557
+ --max-width: 18.3815648446rem;
1775
1558
  }
1776
- @media screen and (min-width: 610px) {
1777
- .ilo--card--graphic.ilo--card--narrow {
1778
- padding: 0 1.2861736334rem 2.1436227224rem;
1779
- }
1559
+ .ilo--card__type__detail picture {
1560
+ display: flex;
1561
+ position: relative;
1780
1562
  }
1781
- .ilo--card--graphic.ilo--card--narrow .ilo--card--title {
1782
- font-size: 18.66px;
1783
- letter-spacing: -0.035em;
1784
- line-height: 24.26px;
1785
- margin-bottom: 1.674953518rem;
1563
+ .ilo--card__type__detail picture::before {
1564
+ background-color: rgb(30, 45, 190);
1565
+ content: "";
1566
+ display: block;
1567
+ height: 100%;
1568
+ left: 0;
1569
+ opacity: 0;
1570
+ position: absolute;
1571
+ top: 0;
1572
+ width: 100%;
1573
+ z-index: -1;
1574
+ transition-property: opacity;
1575
+ transition-duration: 150ms;
1576
+ transition-timing-function: ease-out;
1786
1577
  }
1787
- .ilo--card--graphic.ilo--card--dark {
1788
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1578
+ .ilo--card__type__detail .ilo--card--wrap {
1579
+ display: flex;
1789
1580
  }
1790
- .ilo--card--graphic .ilo--card--eyebrow {
1791
- margin-bottom: 1.0110920672rem;
1581
+ .right-to-left .ilo--card__type__detail .ilo--card--wrap {
1582
+ flex-direction: row-reverse;
1792
1583
  }
1793
- .ilo--card--graphic .ilo--card--title {
1584
+ .ilo--card__type__detail .ilo--card--title {
1794
1585
  font-size: 18.66px;
1795
1586
  letter-spacing: -0.035em;
1796
1587
  line-height: 24.26px;
1797
- margin-bottom: 1.674953518rem;
1798
1588
  }
1799
- @media screen and (min-width: 610px) {
1800
- .ilo--card--graphic .ilo--card--title {
1801
- font-size: 23.32px;
1802
- letter-spacing: -0.035em;
1803
- line-height: 29.15px;
1804
- margin-bottom: 1.5763397642rem;
1805
- }
1589
+ .ilo--card__type__detail .ilo--card--image--wrapper {
1590
+ flex: 0 0 4.1264737406rem;
1806
1591
  }
1807
- .ilo--card--graphic .ilo--card--date {
1808
- display: block;
1809
- margin-bottom: 1.4398166117rem;
1592
+ .ilo--card__type__detail .ilo--card--picture {
1593
+ object-fit: contain;
1594
+ width: 4.1264737406rem;
1810
1595
  }
1811
- .ilo--card--graphic .ilo--card--content {
1812
- display: flex;
1813
- flex-direction: column;
1596
+ .ilo--card__type__detail .ilo--card--content {
1597
+ padding: 0 1.2861736334rem;
1598
+ }
1599
+ .ilo--card__type__detail .ilo--card--date-extra {
1600
+ font-size: 16px;
1601
+ letter-spacing: normal;
1602
+ line-height: 23.36px;
1603
+ margin-bottom: 0;
1604
+ padding-left: 1.2861736334rem;
1814
1605
  position: relative;
1815
1606
  }
1816
- .ilo--card--graphic .ilo--card--content > * {
1817
- justify-self: flex-start;
1607
+ .ilo--card__type__detail .ilo--card--date-extra::before {
1608
+ background-repeat: no-repeat;
1609
+ content: "";
1610
+ display: inline-block;
1611
+ height: 0.7502679528rem;
1612
+ left: 0;
1613
+ position: absolute;
1614
+ top: 50%;
1615
+ transform: rotate(-90deg) translateX(50%);
1616
+ width: 0.6430868167rem;
1617
+ 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");
1818
1618
  }
1819
- .ilo--card--graphic .ilo--card--content > *:last-child {
1820
- justify-self: flex-end;
1821
- margin-bottom: 0;
1619
+ .ilo--card__type__detail .ilo--card--date {
1620
+ font-size: 16px;
1621
+ letter-spacing: normal;
1622
+ line-height: 23.36px;
1822
1623
  }
1823
- .ilo--card--graphicpromo {
1824
- max-width: 49.3033226152rem;
1624
+
1625
+ /**
1626
+ * Do not edit directly
1627
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1628
+ */
1629
+ /**
1630
+ * TOKENS:
1631
+ */
1632
+ /**
1633
+ * MAPS:
1634
+ */
1635
+ .ilo--card__type__promo {
1636
+ --max-width: 18.3815648446rem;
1825
1637
  padding: 2.1436227224rem 1.2861736334rem;
1826
1638
  width: 100%;
1827
1639
  }
1828
- .ilo--card--graphicpromo:hover, .ilo--card--graphicpromo:focus, .ilo--card--graphicpromo:focus-within {
1829
- 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));
1830
- }
1831
1640
  @media screen and (min-width: 610px) {
1832
- .ilo--card--graphicpromo {
1641
+ .ilo--card__type__promo {
1833
1642
  padding: 2.5723472669rem;
1834
1643
  }
1835
1644
  }
1836
1645
  @media screen and (min-width: 1024px) {
1837
- .ilo--card--graphicpromo {
1646
+ .ilo--card__type__promo {
1838
1647
  padding: 3.4297963558rem 3.8585209003rem;
1839
1648
  }
1840
1649
  }
1841
- .ilo--card--graphicpromo.ilo--card--wide {
1842
- padding: 3.4297963558rem 3.8585209003rem;
1650
+ .ilo--card__type__promo.ilo--card__size__standard {
1651
+ --max-width: 33.9764201501rem;
1652
+ padding: 2.5723472669rem;
1843
1653
  }
1844
1654
  @media screen and (min-width: 610px) {
1845
- .ilo--card--graphicpromo.ilo--card--wide {
1846
- padding: 3.4297963558rem 3.8585209003rem;
1655
+ .ilo--card__type__promo.ilo--card__size__standard {
1656
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1847
1657
  }
1848
1658
  }
1849
1659
  @media screen and (min-width: 1024px) {
1850
- .ilo--card--graphicpromo.ilo--card--wide {
1851
- padding: 3.4297963558rem 3.8585209003rem;
1660
+ .ilo--card__type__promo.ilo--card__size__standard {
1661
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1852
1662
  }
1853
1663
  }
1854
- .ilo--card--graphicpromo.ilo--card--standard {
1855
- padding: 2.5723472669rem;
1664
+ .ilo--card__type__promo.ilo--card__size__standard.ilo--card__cornercut {
1665
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
1666
+ }
1667
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1668
+ --max-width: 49.3033226152rem;
1669
+ padding: 3.4297963558rem 3.8585209003rem;
1856
1670
  }
1857
1671
  @media screen and (min-width: 610px) {
1858
- .ilo--card--graphicpromo.ilo--card--standard {
1859
- padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem 2.5723472669rem;
1672
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1673
+ padding: 3.4297963558rem 3.8585209003rem;
1860
1674
  }
1861
1675
  }
1862
1676
  @media screen and (min-width: 1024px) {
1863
- .ilo--card--graphicpromo.ilo--card--standard {
1864
- padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem 2.5723472669rem;
1677
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1678
+ padding: 3.4297963558rem 3.8585209003rem;
1865
1679
  }
1866
1680
  }
1867
- .ilo--card--graphicpromo.ilo--card--narrow {
1681
+ .ilo--card__type__promo.ilo--card__size__wide.ilo--card__cornercut, .ilo--card__type__promo.ilo--card__size__fluid.ilo--card__cornercut {
1682
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
1683
+ }
1684
+ .ilo--card__type__promo.ilo--card__size__narrow {
1685
+ --max-width: 18.3815648446rem;
1868
1686
  padding: 2.1436227224rem 1.2861736334rem;
1869
1687
  }
1870
1688
  @media screen and (min-width: 610px) {
1871
- .ilo--card--graphicpromo.ilo--card--narrow {
1689
+ .ilo--card__type__promo.ilo--card__size__narrow {
1872
1690
  padding: 2.1436227224rem 1.2861736334rem;
1873
1691
  }
1874
1692
  }
1875
1693
  @media screen and (min-width: 1024px) {
1876
- .ilo--card--graphicpromo.ilo--card--narrow {
1694
+ .ilo--card__type__promo.ilo--card__size__narrow {
1877
1695
  padding: 2.1436227224rem 1.2861736334rem;
1878
1696
  }
1879
1697
  }
1880
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1698
+ .ilo--card__type__promo.ilo--card__size__narrow.ilo--card__cornercut {
1699
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
1700
+ }
1701
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1881
1702
  font-size: 29.16px;
1882
1703
  letter-spacing: -0.035em;
1883
1704
  line-height: 36.45px;
1884
1705
  margin-bottom: 0.5741425509rem;
1885
1706
  }
1886
1707
  @media screen and (min-width: 610px) {
1887
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1708
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1888
1709
  font-size: 36.45px;
1889
1710
  letter-spacing: -0.035em;
1890
1711
  line-height: 43.74px;
1891
1712
  margin-bottom: 0.4278063594rem;
1892
1713
  }
1893
1714
  }
1894
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--intro {
1715
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--intro {
1895
1716
  font-size: 16px;
1896
1717
  letter-spacing: normal;
1897
1718
  line-height: 23.36px;
1898
1719
  margin-bottom: 1.910132288rem;
1899
1720
  }
1900
- .ilo--card--graphicpromo.ilo--card--light:not(:hover) .ilo--card--title {
1721
+ .ilo--card__type__promo.ilo--card__theme__light:not(:hover) .ilo--card--title {
1901
1722
  color: rgb(45, 45, 45);
1902
1723
  transition-property: color;
1903
1724
  transition-duration: 150ms;
1904
1725
  transition-timing-function: ease-out;
1905
1726
  }
1906
- .ilo--card--graphicpromo .ilo--card--title {
1727
+ .ilo--card__type__promo .ilo--card--title {
1907
1728
  font-size: 29.16px;
1908
1729
  letter-spacing: -0.035em;
1909
1730
  line-height: 36.45px;
1910
1731
  margin-bottom: 0.5741425509rem;
1911
1732
  }
1912
1733
  @media screen and (min-width: 610px) {
1913
- .ilo--card--graphicpromo .ilo--card--title {
1734
+ .ilo--card__type__promo .ilo--card--title {
1914
1735
  font-size: 36.45px;
1915
1736
  letter-spacing: -0.035em;
1916
1737
  line-height: 43.74px;
1917
1738
  margin-bottom: 0.8565309039rem;
1918
1739
  }
1919
1740
  }
1920
- .ilo--card--graphicpromo .ilo--card--intro {
1741
+ .ilo--card__type__promo .ilo--card--intro {
1921
1742
  font-size: 16px;
1922
1743
  letter-spacing: normal;
1923
1744
  line-height: 23.36px;
1924
1745
  margin-bottom: 1.910132288rem;
1925
1746
  }
1926
1747
  @media screen and (min-width: 610px) {
1927
- .ilo--card--graphicpromo .ilo--card--intro {
1748
+ .ilo--card__type__promo .ilo--card--intro {
1928
1749
  font-size: 18.66px;
1929
1750
  letter-spacing: normal;
1930
1751
  line-height: 27.24px;
1931
1752
  margin-bottom: 1.8685411561rem;
1932
1753
  }
1933
1754
  }
1934
- .ilo--card--factlist {
1935
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1936
- max-width: 45.8735262594rem;
1937
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1938
- pointer-events: none;
1939
- }
1940
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1941
- height: 40px;
1942
- top: -2.127545552rem;
1943
- width: calc(100% - 73px);
1944
- }
1945
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1946
- height: 40px;
1947
- top: -2.127545552rem;
1948
- width: 73.3px;
1949
- }
1950
- .ilo--card--factlist.ilo--card--dark {
1951
- background: rgb(35, 0, 80);
1952
- }
1953
- @media screen and (min-width: 1024px) {
1954
- .ilo--card--factlist {
1955
- padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1956
- }
1957
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1958
- height: 48px;
1959
- top: -2.5562700965rem;
1960
- width: calc(100% - 87px);
1961
- }
1962
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1963
- height: 48px;
1964
- top: -2.5562700965rem;
1965
- width: 87.3px;
1966
- }
1967
- }
1968
- .ilo--card--factlist.ilo--card--wide {
1969
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1755
+
1756
+ /**
1757
+ * Do not edit directly
1758
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1759
+ */
1760
+ /**
1761
+ * TOKENS:
1762
+ */
1763
+ /**
1764
+ * MAPS:
1765
+ */
1766
+ .ilo--card__type__multilink {
1767
+ --max-width: 28.7245444802rem;
1768
+ padding: 1.2861736334rem;
1970
1769
  }
1971
- @media screen and (min-width: 610px) {
1972
- .ilo--card--factlist.ilo--card--wide {
1973
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1974
- }
1770
+ .ilo--card__type__multilink .ilo--card--image--wrapper {
1771
+ display: none;
1975
1772
  }
1976
- .ilo--card--factlist.ilo--card--standard {
1977
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1773
+ .ilo--card__type__multilink .ilo--card--content .ilo--card--image--wrapper {
1774
+ display: block;
1978
1775
  }
1979
1776
  @media screen and (min-width: 610px) {
1980
- .ilo--card--factlist.ilo--card--standard {
1981
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1777
+ .ilo--card__type__multilink {
1778
+ padding: 2.1436227224rem;
1982
1779
  }
1983
1780
  }
1984
- .ilo--card--factlist.ilo--card--narrow {
1985
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1986
- }
1987
- @media screen and (min-width: 610px) {
1988
- .ilo--card--factlist.ilo--card--narrow {
1989
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1781
+ @media screen and (min-width: 1024px) {
1782
+ .ilo--card__type__multilink {
1783
+ padding: 3.0010718114rem 2.5723472669rem;
1990
1784
  }
1991
1785
  }
1992
- .ilo--card--factlist.ilo--card--dark {
1993
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1994
- }
1995
- .ilo--card--factlist.ilo--card--dark .ilo--card--title {
1996
- color: rgb(255, 255, 255);
1997
- transition-property: color;
1998
- transition-duration: 150ms;
1999
- transition-timing-function: ease-out;
2000
- }
2001
- .ilo--card--factlist.ilo--card--dark .ilo--list__item {
2002
- color: rgb(255, 255, 255);
2003
- }
2004
- .ilo--card--factlist.ilo--card--dark .ilo--list__item:last-of-type {
2005
- margin-bottom: 0;
2006
- }
2007
- .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 {
2008
- color: rgb(255, 255, 255);
2009
- transition-property: color;
2010
- transition-duration: 150ms;
2011
- transition-timing-function: ease-out;
2012
- }
2013
- .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 {
2014
- color: rgb(255, 255, 255);
2015
- }
2016
- .ilo--card--factlist .ilo--card--title {
2017
- color: rgb(45, 45, 45);
1786
+ .ilo--card__type__multilink .ilo--card--title {
2018
1787
  font-size: 23.32px;
2019
1788
  letter-spacing: -0.035em;
2020
1789
  line-height: 29.15px;
2021
- margin-bottom: 1.1476152197rem;
1790
+ margin-bottom: 0.7188906752rem;
1791
+ color: rgb(45, 45, 45);
2022
1792
  }
2023
- @media screen and (min-width: 1024px) {
2024
- .ilo--card--factlist .ilo--card--title {
1793
+ @media screen and (min-width: 610px) {
1794
+ .ilo--card__type__multilink .ilo--card--title {
2025
1795
  font-size: 29.16px;
2026
1796
  letter-spacing: -0.035em;
2027
1797
  line-height: 36.45px;
2028
- margin-bottom: 1.4315916399rem;
1798
+ margin-bottom: 0.5741425509rem;
2029
1799
  }
2030
1800
  }
2031
- .ilo--card--stat {
2032
- border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
2033
- margin-top: 2.1436227224rem;
2034
- padding: 0 1.2861736334rem 2.1436227224rem 1.1789924973rem;
2035
- position: relative;
2036
- width: 100%;
2037
- }
2038
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2039
- left: 0;
2040
- top: -2.127545552rem;
2041
- }
2042
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2043
- left: auto;
2044
- right: 0;
2045
- }
2046
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2047
- right: 0;
2048
- top: -2.127545552rem;
2049
- }
2050
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2051
- left: 0;
2052
- right: auto;
2053
- transform: rotateY(180deg);
2054
- }
2055
- .ilo--card--stat.ilo--card--blue {
2056
- background: rgb(235, 245, 253);
2057
- }
2058
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2059
- background: inherit;
2060
- content: "";
2061
- display: block;
2062
- height: 40px;
2063
- position: absolute;
2064
- width: calc(100% - 73px);
2065
- }
2066
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2067
- 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");
2068
- background-position: bottom right;
2069
- background-size: cover;
2070
- content: "";
2071
- height: 40px;
2072
- display: block;
2073
- position: absolute;
2074
- width: 73.4px;
2075
- }
2076
- .ilo--card--stat.ilo--card--yellow {
2077
- background: rgb(255, 205, 45);
2078
- }
2079
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2080
- background: inherit;
2081
- content: "";
2082
- display: block;
2083
- height: 40px;
2084
- position: absolute;
2085
- width: calc(100% - 73px);
2086
- }
2087
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2088
- 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");
2089
- background-position: bottom right;
2090
- background-size: cover;
2091
- content: "";
2092
- height: 40px;
2093
- display: block;
2094
- position: absolute;
2095
- width: 73.4px;
2096
- }
2097
- .ilo--card--stat.ilo--card--green {
2098
- background: rgb(140, 225, 100);
2099
- }
2100
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2101
- background: inherit;
2102
- content: "";
2103
- display: block;
2104
- height: 40px;
2105
- position: absolute;
2106
- width: calc(100% - 73px);
2107
- }
2108
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2109
- 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");
2110
- background-position: bottom right;
2111
- background-size: cover;
2112
- content: "";
2113
- height: 40px;
2114
- display: block;
2115
- position: absolute;
2116
- width: 73.4px;
2117
- }
2118
- .ilo--card--stat.ilo--card--turquoise {
2119
- background: rgb(5, 210, 210);
2120
- }
2121
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
2122
- background: inherit;
2123
- content: "";
2124
- display: block;
2125
- height: 40px;
2126
- position: absolute;
2127
- width: calc(100% - 73px);
2128
- }
2129
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
2130
- 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");
2131
- background-position: bottom right;
2132
- background-size: cover;
2133
- content: "";
2134
- height: 40px;
2135
- display: block;
2136
- position: absolute;
2137
- width: 73.4px;
2138
- }
2139
- .ilo--card--stat .ilo--card--content {
2140
- display: flex;
2141
- flex-wrap: wrap;
2142
- height: 100%;
1801
+ .ilo--card__type__multilink .ilo--card--intro {
1802
+ font-size: 16px;
1803
+ letter-spacing: normal;
1804
+ line-height: 23.36px;
1805
+ margin-bottom: 1.910132288rem;
1806
+ color: rgb(45, 45, 45);
2143
1807
  }
2144
- .right-to-left .ilo--card--stat .ilo--card--content {
2145
- flex-direction: row-reverse;
1808
+ @media screen and (min-width: 610px) {
1809
+ .ilo--card__type__multilink .ilo--card--intro {
1810
+ font-size: 18.66px;
1811
+ letter-spacing: normal;
1812
+ line-height: 27.24px;
1813
+ margin-bottom: 1.8685411561rem;
1814
+ }
2146
1815
  }
2147
- .ilo--card--stat .ilo--card--title {
2148
- color: rgb(35, 0, 80);
2149
- font-size: 36.45px;
2150
- letter-spacing: -0.035em;
2151
- line-height: 43.74px;
2152
- margin-bottom: 0.4278063594rem;
2153
- width: 100%;
1816
+ .ilo--card__type__multilink.ilo--card__size__standard {
1817
+ --max-width: 28.7245444802rem;
1818
+ padding: 2.5723472669rem 2.1436227224rem;
2154
1819
  }
2155
- .ilo--card--stat .ilo--card--intro {
2156
- color: rgb(35, 0, 80);
2157
- font-family: Overpass;
2158
- font-size: 18.66px;
2159
- letter-spacing: normal;
2160
- line-height: 27.24px;
2161
- margin-bottom: 1.6734954235rem;
2162
- width: 100%;
1820
+ @media screen and (min-width: 610px) {
1821
+ .ilo--card__type__multilink.ilo--card__size__standard {
1822
+ padding: 2.5723472669rem 2.1436227224rem;
1823
+ }
2163
1824
  }
2164
- .ilo--card--stat .ilo--link {
2165
- font-size: 11.94px;
2166
- letter-spacing: -0.02em;
2167
- line-height: 16.24px;
2168
- align-self: flex-end;
1825
+ @media screen and (min-width: 1024px) {
1826
+ .ilo--card__type__multilink.ilo--card__size__standard {
1827
+ padding: 2.5723472669rem 2.1436227224rem;
1828
+ }
2169
1829
  }
2170
- .ilo--card--data {
2171
- background: rgb(235, 245, 253);
2172
- border-bottom: 0.1607717042rem solid #82afdc;
2173
- margin-top: 2.1436227224rem;
2174
- max-width: 32.154340836rem;
2175
- padding: 0 1.2861736334rem 3.0010718114rem;
2176
- position: relative;
1830
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1831
+ --max-width: 20.0964630225rem;
1832
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
2177
1833
  }
2178
- .ilo--card--data::before {
2179
- background: inherit;
2180
- content: "";
2181
- display: block;
2182
- height: 40px;
2183
- position: absolute;
2184
- width: calc(100% - 73px);
1834
+ @media screen and (min-width: 610px) {
1835
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1836
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1837
+ }
2185
1838
  }
2186
- .ilo--card--data::after {
2187
- 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");
2188
- background-position: bottom right;
2189
- background-size: cover;
2190
- content: "";
2191
- height: 40px;
2192
- display: block;
2193
- position: absolute;
2194
- width: 73.4px;
1839
+ @media screen and (min-width: 1024px) {
1840
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1841
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1842
+ }
2195
1843
  }
2196
- .ilo--card--data:hover, .ilo--card--data:focus, .ilo--card--data:focus-within {
2197
- background: rgb(235, 245, 253);
1844
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--image--wrapper {
1845
+ display: none;
2198
1846
  }
2199
- .ilo--card--data::before {
2200
- left: 0;
2201
- top: -2.127545552rem;
1847
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--content .ilo--card--image--wrapper {
1848
+ display: block;
1849
+ margin-bottom: 1.2861736334rem;
2202
1850
  }
2203
- .right-to-left .ilo--card--data::before {
2204
- left: auto;
2205
- right: 0;
1851
+ @media screen and (min-width: 610px) {
1852
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--title {
1853
+ font-size: 23.32px;
1854
+ letter-spacing: -0.035em;
1855
+ line-height: 29.15px;
1856
+ margin-bottom: 0.7188906752rem;
1857
+ }
2206
1858
  }
2207
- .ilo--card--data::after {
2208
- right: 0;
2209
- top: -2.127545552rem;
1859
+ @media screen and (min-width: 610px) {
1860
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--intro {
1861
+ font-size: 16px;
1862
+ letter-spacing: normal;
1863
+ line-height: 23.36px;
1864
+ margin-bottom: 1.910132288rem;
1865
+ }
2210
1866
  }
2211
- .right-to-left .ilo--card--data::after {
2212
- left: 0;
2213
- right: auto;
2214
- transform: rotateY(180deg);
1867
+ .ilo--card__type__multilink.ilo--card__size__wide, .ilo--card__type__multilink.ilo--card__size__fluid {
1868
+ --max-width: 59.1639871383rem;
1869
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
2215
1870
  }
2216
1871
  @media screen and (min-width: 610px) {
2217
- .ilo--card--data::before {
2218
- background: inherit;
2219
- content: "";
2220
- display: block;
2221
- height: 48px;
2222
- position: absolute;
2223
- width: calc(100% - 84px);
1872
+ .ilo--card__type__multilink.ilo--card__size__wide, .ilo--card__type__multilink.ilo--card__size__fluid {
1873
+ padding: 3.0010718114rem 2.5723472669rem;
2224
1874
  }
2225
- .ilo--card--data::after {
2226
- 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");
2227
- background-position: bottom right;
2228
- background-size: cover;
2229
- content: "";
2230
- height: 48px;
1875
+ .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 {
1876
+ flex-direction: row-reverse;
1877
+ }
1878
+ .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 {
1879
+ flex-direction: row;
1880
+ }
1881
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--wrap, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--wrap {
1882
+ display: flex;
1883
+ column-gap: 1.7148981779rem;
1884
+ }
1885
+ .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 {
1886
+ flex-direction: row-reverse;
1887
+ }
1888
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--image--wrapper {
2231
1889
  display: block;
2232
- position: absolute;
2233
- width: 84.4px;
1890
+ width: 50%;
2234
1891
  }
2235
- .ilo--card--data::before {
2236
- top: -2.5562700965rem;
1892
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--content, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--content {
1893
+ width: 50%;
2237
1894
  }
2238
- .ilo--card--data::after {
2239
- top: -2.5562700965rem;
1895
+ .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 {
1896
+ display: none;
2240
1897
  }
2241
1898
  }
2242
- .ilo--card--data .ilo--card--image--wrapper {
2243
- display: none;
2244
- width: max(10.9860664523rem, 50%);
1899
+ .ilo--card__type__multilink .ilo--link-list {
1900
+ margin-top: 1.8756698821rem;
1901
+ position: relative;
1902
+ z-index: 3;
2245
1903
  }
2246
- .ilo--card--data .ilo--card--content .ilo--card--image--wrapper {
2247
- display: block;
1904
+
1905
+ /**
1906
+ * Do not edit directly
1907
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1908
+ */
1909
+ /**
1910
+ * TOKENS:
1911
+ */
1912
+ /**
1913
+ * MAPS:
1914
+ */
1915
+ .ilo--card__type__data {
1916
+ --max-width: 16.1307609861rem;
1917
+ background: rgb(235, 245, 253);
1918
+ border-bottom: 0.1607717042rem solid #82afdc;
1919
+ margin-top: 2.1436227224rem;
1920
+ padding: 1.2861736334rem 3.0010718114rem;
1921
+ position: relative;
1922
+ width: 100%;
1923
+ }
1924
+ .ilo--card__type__data:hover, .ilo--card__type__data:focus, .ilo--card__type__data:focus-within {
1925
+ background: rgb(235, 245, 253);
1926
+ }
1927
+ .ilo--card__type__data.ilo--card__size__narrow {
1928
+ --max-width: 16.1307609861rem;
1929
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
1930
+ }
1931
+ .ilo--card__type__data.ilo--card__size__wide, .ilo--card__type__data.ilo--card__size__fluid {
1932
+ --max-width: 32.154340836rem;
1933
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
1934
+ }
1935
+ .ilo--card__type__data .ilo--card--image--wrapper {
1936
+ width: max(10.9860664523rem, 50%);
2248
1937
  }
2249
- .ilo--card--data--content-label {
1938
+ .ilo--card__type__data--content-label {
2250
1939
  font-size: 14.93px;
2251
1940
  letter-spacing: normal;
2252
1941
  line-height: 20.3px;
2253
1942
  margin-bottom: 0.6540478038rem;
2254
1943
  color: rgb(109, 109, 109);
2255
1944
  }
2256
- .ilo--card--data--content-copy {
1945
+ .ilo--card__type__data--content-copy {
2257
1946
  font-size: 23.32px;
2258
1947
  letter-spacing: -0.035em;
2259
1948
  line-height: 29.15px;
@@ -2262,175 +1951,161 @@ body {
2262
1951
  font-family: Overpass;
2263
1952
  font-weight: 500;
2264
1953
  }
2265
- .ilo--card--data--content-files {
1954
+ .ilo--card__type__data--content-files {
2266
1955
  margin-bottom: 2.1436227224rem;
2267
1956
  }
2268
- .ilo--card--data .ilo--link {
1957
+ .ilo--card__type__data .ilo--link {
2269
1958
  font-size: 18.66px;
2270
1959
  letter-spacing: -0.035em;
2271
1960
  line-height: 24.26px;
2272
1961
  }
2273
- .ilo--card--data--file {
1962
+ .ilo--card__type__data--file {
2274
1963
  margin: 0.2143622722rem 0.4287245445rem 0.2143622722rem 0;
2275
1964
  }
2276
- .ilo--card--data--file:last-of-type {
1965
+ .ilo--card__type__data--file:last-of-type {
2277
1966
  margin-right: 0;
2278
1967
  }
2279
- .ilo--card--feature {
2280
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2281
- display: flex;
2282
- margin-top: 0;
1968
+
1969
+ /**
1970
+ * Do not edit directly
1971
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1972
+ */
1973
+ /**
1974
+ * TOKENS:
1975
+ */
1976
+ /**
1977
+ * MAPS:
1978
+ */
1979
+ .ilo--card__type__stat {
1980
+ --max-width: 18.3815648446rem;
1981
+ border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1982
+ padding: 1.2861736334rem 2.1436227224rem 1.1789924973rem;
2283
1983
  position: relative;
1984
+ width: 100%;
1985
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2284
1986
  }
2285
- .ilo--card--feature::before {
2286
- display: none;
1987
+ .ilo--card__type__stat.ilo--card__color__blue {
1988
+ background: rgb(235, 245, 253);
2287
1989
  }
2288
- .ilo--card--feature.ilo--card--dark {
2289
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1990
+ .ilo--card__type__stat.ilo--card__color__yellow {
1991
+ background: rgb(255, 205, 45);
2290
1992
  }
2291
- .ilo--card--feature.ilo--card--dark .ilo--link-list {
2292
- border-top: 2px solid rgba(237, 240, 242, 0.25);
1993
+ .ilo--card__type__stat.ilo--card__color__green {
1994
+ background: rgb(140, 225, 100);
2293
1995
  }
2294
- .ilo--card--feature.ilo--card--dark .ilo--link-list--link {
2295
- color: rgb(255, 255, 255);
2296
- 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");
1996
+ .ilo--card__type__stat.ilo--card__color__turquoise {
1997
+ background: rgb(5, 210, 210);
2297
1998
  }
2298
- .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 {
2299
- color: rgb(30, 45, 190);
2300
- 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");
1999
+ .ilo--card__type__stat .ilo--card--content {
2000
+ display: flex;
2001
+ flex-wrap: wrap;
2002
+ height: 100%;
2301
2003
  }
2302
- .ilo--card--feature picture::before {
2303
- transition-property: opacity;
2304
- transition-duration: 150ms;
2305
- transition-timing-function: ease-out;
2004
+ .right-to-left .ilo--card__type__stat .ilo--card--content {
2005
+ flex-direction: row-reverse;
2306
2006
  }
2307
- .ilo--card--feature:hover, .ilo--card--feature:focus, .ilo--card--feature:focus-within {
2308
- background-color: rgb(255, 255, 255);
2309
- 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));
2310
- border-bottom: 0.1607717042rem solid rgb(30, 45, 190);
2007
+ .ilo--card__type__stat .ilo--card--title {
2008
+ color: rgb(35, 0, 80);
2009
+ font-size: 36.45px;
2010
+ letter-spacing: -0.035em;
2011
+ line-height: 43.74px;
2012
+ margin-bottom: 0.4278063594rem;
2013
+ width: 100%;
2311
2014
  }
2312
- .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before, .ilo--card--feature:focus-within picture::before {
2313
- opacity: 0.4;
2314
- z-index: 1;
2315
- transition-property: opacity;
2316
- transition-duration: 150ms;
2317
- transition-timing-function: ease-out;
2015
+ .ilo--card__type__stat .ilo--card--intro {
2016
+ color: rgb(35, 0, 80);
2017
+ font-family: Overpass;
2018
+ font-size: 18.66px;
2019
+ letter-spacing: normal;
2020
+ line-height: 27.24px;
2021
+ margin-bottom: 1.6734954235rem;
2022
+ width: 100%;
2318
2023
  }
2319
- .ilo--card--feature:hover .ilo--card--image, .ilo--card--feature:focus .ilo--card--image, .ilo--card--feature:focus-within .ilo--card--image {
2320
- filter: saturate(0);
2024
+ .ilo--card__type__stat .ilo--link {
2025
+ font-size: 11.94px;
2026
+ letter-spacing: -0.02em;
2027
+ line-height: 16.24px;
2028
+ align-self: flex-end;
2321
2029
  }
2322
- .ilo--card--feature .ilo--link-list {
2323
- border-top: 0.1071811361rem solid rgb(237, 240, 242);
2324
- margin-left: -1.2861736334rem;
2325
- margin-right: -1.2861736334rem;
2326
- margin-top: 1.822079314rem;
2327
- position: relative;
2328
- z-index: 2;
2030
+
2031
+ /**
2032
+ * Do not edit directly
2033
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2034
+ */
2035
+ /**
2036
+ * TOKENS:
2037
+ */
2038
+ /**
2039
+ * MAPS:
2040
+ */
2041
+ .ilo--card__type__factlist {
2042
+ --max-width: 20.0964630225rem;
2043
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2044
+ padding: 1.2861736334rem 2.5723472669rem;
2045
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2329
2046
  }
2330
- .ilo--card--feature .ilo--link-list--link, .ilo--card--feature .ilo--link-list--link:hover {
2331
- border-bottom: none;
2332
- padding-left: 1.2861736334rem;
2333
- padding-right: 1.2861736334rem;
2047
+ @media screen and (min-width: 1024px) {
2048
+ .ilo--card__type__factlist {
2049
+ padding: 2.1436227224rem 3.0010718114rem;
2050
+ }
2334
2051
  }
2335
- .ilo--card--feature.ilo--card--narrow .ilo--card--wrap, .ilo--card--feature.ilo--card--standard .ilo--card--wrap {
2336
- display: flex;
2337
- flex-wrap: wrap;
2338
- width: 100%;
2052
+ .ilo--card__type__factlist.ilo--card__size__wide {
2053
+ --max-width: 45.8735262594rem;
2054
+ padding: 2.1436227224rem 2.7867095391rem;
2339
2055
  }
2340
- .ilo--card--feature.ilo--card--narrow .ilo--card--content, .ilo--card--feature.ilo--card--standard .ilo--card--content {
2341
- width: 100%;
2056
+ @media screen and (min-width: 610px) {
2057
+ .ilo--card__type__factlist.ilo--card__size__wide {
2058
+ padding: 2.1436227224rem 3.2154340836rem;
2059
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
2060
+ }
2342
2061
  }
2343
- .ilo--card--feature.ilo--card--narrow .ilo--card--image--wrapper, .ilo--card--feature.ilo--card--standard .ilo--card--image--wrapper {
2344
- width: 100%;
2062
+ .ilo--card__type__factlist.ilo--card__size__narrow {
2063
+ --max-width: 20.0964630225rem;
2064
+ padding: 1.2861736334rem 2.5723472669rem;
2065
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2345
2066
  }
2346
2067
  @media screen and (min-width: 610px) {
2347
- .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2348
- flex-direction: row;
2349
- }
2350
- .right-to-left .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2351
- flex-direction: row-reverse;
2352
- }
2353
- .ilo--card--feature.ilo--card--wide .ilo--card--content {
2354
- display: flex;
2355
- flex-direction: row;
2356
- flex-wrap: wrap;
2357
- position: relative;
2358
- width: 50%;
2359
- }
2360
- .ilo--card--feature.ilo--card--wide .ilo--card--image--wrapper {
2361
- width: 50%;
2362
- }
2363
- .ilo--card--feature.ilo--card--wide .ilo--card--image {
2364
- object-fit: cover;
2365
- }
2366
- .ilo--card--feature.ilo--card--wide .ilo--card--date {
2367
- align-self: flex-end;
2368
- width: 100%;
2369
- }
2370
- .ilo--card--feature.ilo--card--wide .ilo--card--eyebrow {
2371
- width: 100%;
2372
- }
2373
- .ilo--card--feature.ilo--card--wide .ilo--card--title {
2374
- width: 100%;
2375
- }
2376
- .ilo--card--feature.ilo--card--wide .ilo--link-list {
2377
- width: calc(100% + 48px);
2068
+ .ilo--card__type__factlist.ilo--card__size__narrow {
2069
+ padding: 1.2861736334rem 2.5723472669rem;
2378
2070
  }
2379
2071
  }
2380
- .ilo--card--feature .ilo--card--wrap {
2381
- display: flex;
2382
- flex-direction: column;
2383
- width: 100%;
2072
+ .ilo--card__type__factlist.ilo--card__theme__dark {
2073
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
2384
2074
  }
2385
- .ilo--card--feature picture {
2386
- display: flex;
2387
- height: 100%;
2388
- position: relative;
2075
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--card--title {
2076
+ color: rgb(255, 255, 255);
2389
2077
  }
2390
- .ilo--card--feature picture::before {
2391
- background-color: rgb(30, 45, 190);
2392
- content: "";
2393
- display: block;
2394
- height: 100%;
2395
- left: 0;
2396
- opacity: 0;
2397
- position: absolute;
2398
- top: 0;
2399
- transition: opacity 150ms ease-in-out;
2400
- width: 100%;
2401
- z-index: -1;
2078
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item {
2079
+ color: rgb(255, 255, 255);
2402
2080
  }
2403
- .ilo--card--feature .ilo--card--content {
2404
- display: flex;
2405
- flex: 1 1 auto;
2406
- flex-direction: column;
2407
- padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
2081
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item:last-of-type {
2082
+ margin-bottom: 0;
2408
2083
  }
2409
- .ilo--card--feature.ilo--card--linklist .ilo--card--content {
2410
- padding-bottom: 0;
2084
+ .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 {
2085
+ color: rgb(255, 255, 255);
2086
+ }
2087
+ .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 {
2088
+ color: rgb(255, 255, 255);
2411
2089
  }
2412
- .ilo--card--feature .ilo--card--title {
2090
+ .ilo--card__type__factlist .ilo--card--title {
2091
+ color: rgb(45, 45, 45);
2413
2092
  font-size: 23.32px;
2414
2093
  letter-spacing: -0.035em;
2415
2094
  line-height: 29.15px;
2416
- margin-bottom: 1.5763397642rem;
2417
- font-family: Overpass;
2418
- font-weight: 700;
2419
- }
2420
- .ilo--card--feature .ilo--card--eyebrow {
2421
- font-size: 14.93px;
2422
- letter-spacing: normal;
2423
- line-height: 19.71px;
2424
- margin-bottom: 0.3376482577rem;
2095
+ margin-bottom: 1.1476152197rem;
2425
2096
  }
2426
- .ilo--card--feature .ilo--card--date {
2427
- margin-bottom: 0;
2428
- margin-top: auto;
2097
+ @media screen and (min-width: 1024px) {
2098
+ .ilo--card__type__factlist .ilo--card--title {
2099
+ font-size: 29.16px;
2100
+ letter-spacing: -0.035em;
2101
+ line-height: 36.45px;
2102
+ margin-bottom: 1.4315916399rem;
2103
+ }
2429
2104
  }
2430
2105
 
2431
2106
  /**
2432
2107
  * Do not edit directly
2433
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2108
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2434
2109
  */
2435
2110
  /**
2436
2111
  * TOKENS:
@@ -2438,33 +2113,53 @@ body {
2438
2113
  /**
2439
2114
  * MAPS:
2440
2115
  */
2441
- .ilo--cardgroup--inner {
2442
- display: flex;
2443
- flex-wrap: wrap;
2444
- justify-content: space-between;
2445
- margin: auto;
2446
- row-gap: 1.7148981779rem;
2116
+ .ilo--cardgroup__collapsed .ilo--cardgroup--inner {
2117
+ gap: 0 !important;
2447
2118
  }
2448
- .right-to-left .ilo--cardgroup--inner {
2449
- flex-direction: row-reverse;
2119
+ .ilo--cardgroup__justify__start .ilo--cardgroup--inner {
2120
+ justify-content: flex-start;
2450
2121
  }
2451
- .ilo--cardgroup--inner .ilo--card {
2452
- width: 100%;
2122
+ .ilo--cardgroup__justify__between .ilo--cardgroup--inner {
2123
+ justify-content: space-between;
2453
2124
  }
2454
- @media screen and (min-width: 1024px) {
2455
- .ilo--cardgroup--two .ilo--card {
2456
- width: calc(50% - 16px);
2457
- }
2125
+ .ilo--cardgroup__justify__center .ilo--cardgroup--inner {
2126
+ justify-content: center;
2458
2127
  }
2459
2128
  @media screen and (min-width: 1024px) {
2460
- .ilo--cardgroup--three .ilo--card {
2461
- width: calc(33.333% - 21px);
2129
+ .ilo--cardgroup__count__one .ilo--cardgroup--inner {
2130
+ gap: 0;
2462
2131
  }
2463
- }
2464
- @media screen and (min-width: 1024px) {
2465
- .ilo--cardgroup--four .ilo--card {
2466
- width: calc(25% - 24px);
2132
+ .ilo--cardgroup__count__one .ilo--cardgroup--card {
2133
+ flex: 1 1 100%;
2134
+ }
2135
+ .ilo--cardgroup__count__two .ilo--cardgroup--inner {
2136
+ gap: 16px;
2137
+ }
2138
+ .ilo--cardgroup__count__two .ilo--cardgroup--card {
2139
+ flex: 0 1 calc(50% - 16px);
2140
+ }
2141
+ .ilo--cardgroup__count__three .ilo--cardgroup--inner {
2142
+ gap: 21px;
2467
2143
  }
2144
+ .ilo--cardgroup__count__three .ilo--cardgroup--card {
2145
+ flex: 0 1 calc(33.3333% - 21px);
2146
+ }
2147
+ .ilo--cardgroup__count__four .ilo--cardgroup--inner {
2148
+ gap: 24px;
2149
+ }
2150
+ .ilo--cardgroup__count__four .ilo--cardgroup--card {
2151
+ flex: 0 1 calc(25% - 24px);
2152
+ }
2153
+ }
2154
+ .ilo--cardgroup--inner {
2155
+ display: flex;
2156
+ flex-flow: row wrap;
2157
+ justify-content: center;
2158
+ margin: auto;
2159
+ width: 100%;
2160
+ }
2161
+ .right-to-left .ilo--cardgroup--inner {
2162
+ flex-direction: row-reverse;
2468
2163
  }
2469
2164
  .ilo--cardgroup--button-wrap {
2470
2165
  display: flex;
@@ -2475,7 +2170,7 @@ body {
2475
2170
 
2476
2171
  /**
2477
2172
  * Do not edit directly
2478
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2173
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2479
2174
  */
2480
2175
  /**
2481
2176
  * TOKENS:
@@ -2580,7 +2275,7 @@ body {
2580
2275
 
2581
2276
  /**
2582
2277
  * Do not edit directly
2583
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2278
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2584
2279
  */
2585
2280
  /**
2586
2281
  * 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:
@@ -2671,7 +2366,7 @@ body {
2671
2366
  */
2672
2367
  /**
2673
2368
  * Do not edit directly
2674
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2369
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2675
2370
  */
2676
2371
  /**
2677
2372
  * TOKENS:
@@ -2681,7 +2376,7 @@ body {
2681
2376
  */
2682
2377
  /**
2683
2378
  * Do not edit directly
2684
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2379
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2685
2380
  */
2686
2381
  /**
2687
2382
  * TOKENS:
@@ -2691,7 +2386,7 @@ body {
2691
2386
  */
2692
2387
  /**
2693
2388
  * Do not edit directly
2694
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2389
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2695
2390
  */
2696
2391
  /**
2697
2392
  * TOKENS:
@@ -2817,7 +2512,7 @@ body {
2817
2512
 
2818
2513
  /**
2819
2514
  * Do not edit directly
2820
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2515
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2821
2516
  */
2822
2517
  /**
2823
2518
  * TOKENS:
@@ -2845,7 +2540,7 @@ body {
2845
2540
 
2846
2541
  /**
2847
2542
  * Do not edit directly
2848
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2543
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2849
2544
  */
2850
2545
  /**
2851
2546
  * TOKENS:
@@ -2933,7 +2628,7 @@ body {
2933
2628
 
2934
2629
  /**
2935
2630
  * Do not edit directly
2936
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2631
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2937
2632
  */
2938
2633
  /**
2939
2634
  * TOKENS:
@@ -2943,7 +2638,7 @@ body {
2943
2638
  */
2944
2639
  /**
2945
2640
  * Do not edit directly
2946
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2641
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2947
2642
  */
2948
2643
  /**
2949
2644
  * TOKENS:
@@ -2953,7 +2648,7 @@ body {
2953
2648
  */
2954
2649
  /**
2955
2650
  * Do not edit directly
2956
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2651
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2957
2652
  */
2958
2653
  /**
2959
2654
  * TOKENS:
@@ -3006,7 +2701,7 @@ body {
3006
2701
 
3007
2702
  /**
3008
2703
  * Do not edit directly
3009
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2704
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3010
2705
  */
3011
2706
  /**
3012
2707
  * TOKENS:
@@ -3081,7 +2776,7 @@ body {
3081
2776
 
3082
2777
  /**
3083
2778
  * Do not edit directly
3084
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2779
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3085
2780
  */
3086
2781
  /**
3087
2782
  * TOKENS:
@@ -3187,7 +2882,7 @@ body {
3187
2882
 
3188
2883
  /**
3189
2884
  * Do not edit directly
3190
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2885
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3191
2886
  */
3192
2887
  /**
3193
2888
  * TOKENS:
@@ -3210,7 +2905,7 @@ body {
3210
2905
 
3211
2906
  /**
3212
2907
  * Do not edit directly
3213
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2908
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3214
2909
  */
3215
2910
  /**
3216
2911
  * TOKENS:
@@ -3224,7 +2919,7 @@ body {
3224
2919
 
3225
2920
  /**
3226
2921
  * Do not edit directly
3227
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2922
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3228
2923
  */
3229
2924
  /**
3230
2925
  * TOKENS:
@@ -3234,7 +2929,7 @@ body {
3234
2929
  */
3235
2930
  /**
3236
2931
  * Do not edit directly
3237
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2932
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3238
2933
  */
3239
2934
  /**
3240
2935
  * TOKENS:
@@ -3259,7 +2954,7 @@ body {
3259
2954
  }
3260
2955
  /**
3261
2956
  * Do not edit directly
3262
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2957
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3263
2958
  */
3264
2959
  /**
3265
2960
  * TOKENS:
@@ -3583,7 +3278,7 @@ body {
3583
3278
 
3584
3279
  /**
3585
3280
  * Do not edit directly
3586
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3281
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3587
3282
  */
3588
3283
  /**
3589
3284
  * TOKENS:
@@ -3706,7 +3401,7 @@ body {
3706
3401
 
3707
3402
  /**
3708
3403
  * Do not edit directly
3709
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3404
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3710
3405
  */
3711
3406
  /**
3712
3407
  * TOKENS:
@@ -3912,7 +3607,7 @@ body {
3912
3607
 
3913
3608
  /**
3914
3609
  * Do not edit directly
3915
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3610
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3916
3611
  */
3917
3612
  /**
3918
3613
  * TOKENS:
@@ -3923,7 +3618,7 @@ body {
3923
3618
  .ilo--hero-card {
3924
3619
  height: 100%;
3925
3620
  position: relative;
3926
- padding: 39px 16px;
3621
+ padding: 40px 16px;
3927
3622
  }
3928
3623
  @media screen and (min-width: 1024px) {
3929
3624
  .ilo--hero-card {
@@ -3968,12 +3663,7 @@ body {
3968
3663
  }
3969
3664
  }
3970
3665
  .ilo--hero-card__cornercut {
3971
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 39px, 100% 100%, 0 100%);
3972
- }
3973
- @media screen and (min-width: 1024px) {
3974
- .ilo--hero-card__cornercut {
3975
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 64px, 100% 100%, 0 100%);
3976
- }
3666
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
3977
3667
  }
3978
3668
  .ilo--hero-card--datecopy {
3979
3669
  font-size: 16px;
@@ -4038,7 +3728,7 @@ body {
4038
3728
 
4039
3729
  /**
4040
3730
  * Do not edit directly
4041
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3731
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4042
3732
  */
4043
3733
  /**
4044
3734
  * TOKENS:
@@ -4094,7 +3784,7 @@ body {
4094
3784
 
4095
3785
  /**
4096
3786
  * Do not edit directly
4097
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3787
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4098
3788
  */
4099
3789
  /**
4100
3790
  * TOKENS:
@@ -4236,7 +3926,7 @@ body {
4236
3926
 
4237
3927
  /**
4238
3928
  * Do not edit directly
4239
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3929
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4240
3930
  */
4241
3931
  /**
4242
3932
  * TOKENS:
@@ -4246,7 +3936,7 @@ body {
4246
3936
  */
4247
3937
  /**
4248
3938
  * Do not edit directly
4249
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3939
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4250
3940
  */
4251
3941
  /**
4252
3942
  * TOKENS:
@@ -4271,7 +3961,7 @@ body {
4271
3961
  }
4272
3962
  /**
4273
3963
  * Do not edit directly
4274
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3964
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4275
3965
  */
4276
3966
  /**
4277
3967
  * TOKENS:
@@ -4429,7 +4119,7 @@ body {
4429
4119
 
4430
4120
  /**
4431
4121
  * Do not edit directly
4432
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4122
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4433
4123
  */
4434
4124
  /**
4435
4125
  * TOKENS:
@@ -4524,7 +4214,7 @@ body {
4524
4214
 
4525
4215
  /**
4526
4216
  * Do not edit directly
4527
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4217
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4528
4218
  */
4529
4219
  /**
4530
4220
  * TOKENS:
@@ -4534,7 +4224,7 @@ body {
4534
4224
  */
4535
4225
  /**
4536
4226
  * Do not edit directly
4537
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4227
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4538
4228
  */
4539
4229
  /**
4540
4230
  * TOKENS:
@@ -4544,7 +4234,7 @@ body {
4544
4234
  */
4545
4235
  /**
4546
4236
  * Do not edit directly
4547
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4237
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4548
4238
  */
4549
4239
  /**
4550
4240
  * TOKENS:
@@ -4715,7 +4405,7 @@ body {
4715
4405
 
4716
4406
  /**
4717
4407
  * Do not edit directly
4718
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4408
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4719
4409
  */
4720
4410
  /**
4721
4411
  * TOKENS:
@@ -4762,7 +4452,7 @@ body {
4762
4452
 
4763
4453
  /**
4764
4454
  * Do not edit directly
4765
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4455
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4766
4456
  */
4767
4457
  /**
4768
4458
  * TOKENS:
@@ -4772,7 +4462,7 @@ body {
4772
4462
  */
4773
4463
  /**
4774
4464
  * Do not edit directly
4775
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4465
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4776
4466
  */
4777
4467
  /**
4778
4468
  * TOKENS:
@@ -4782,7 +4472,7 @@ body {
4782
4472
  */
4783
4473
  /**
4784
4474
  * Do not edit directly
4785
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4475
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4786
4476
  */
4787
4477
  /**
4788
4478
  * TOKENS:
@@ -4879,7 +4569,7 @@ body {
4879
4569
 
4880
4570
  /**
4881
4571
  * Do not edit directly
4882
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4572
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4883
4573
  */
4884
4574
  /**
4885
4575
  * TOKENS:
@@ -5769,7 +5459,7 @@ body {
5769
5459
 
5770
5460
  /**
5771
5461
  * Do not edit directly
5772
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5462
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5773
5463
  */
5774
5464
  /**
5775
5465
  * TOKENS:
@@ -5779,7 +5469,7 @@ body {
5779
5469
  */
5780
5470
  /**
5781
5471
  * Do not edit directly
5782
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5472
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5783
5473
  */
5784
5474
  /**
5785
5475
  * TOKENS:
@@ -5789,7 +5479,7 @@ body {
5789
5479
  */
5790
5480
  /**
5791
5481
  * Do not edit directly
5792
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5482
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5793
5483
  */
5794
5484
  /**
5795
5485
  * TOKENS:
@@ -5981,7 +5671,7 @@ body {
5981
5671
 
5982
5672
  /**
5983
5673
  * Do not edit directly
5984
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5674
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5985
5675
  */
5986
5676
  /**
5987
5677
  * TOKENS:
@@ -6121,7 +5811,7 @@ body {
6121
5811
 
6122
5812
  /**
6123
5813
  * Do not edit directly
6124
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5814
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6125
5815
  */
6126
5816
  /**
6127
5817
  * TOKENS:
@@ -6131,7 +5821,7 @@ body {
6131
5821
  */
6132
5822
  /**
6133
5823
  * Do not edit directly
6134
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5824
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6135
5825
  */
6136
5826
  /**
6137
5827
  * TOKENS:
@@ -6156,7 +5846,7 @@ body {
6156
5846
  }
6157
5847
  /**
6158
5848
  * Do not edit directly
6159
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5849
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6160
5850
  */
6161
5851
  /**
6162
5852
  * TOKENS:
@@ -6323,7 +6013,7 @@ body {
6323
6013
 
6324
6014
  /**
6325
6015
  * Do not edit directly
6326
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6016
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6327
6017
  */
6328
6018
  /**
6329
6019
  * TOKENS:
@@ -6430,7 +6120,7 @@ body {
6430
6120
 
6431
6121
  /**
6432
6122
  * Do not edit directly
6433
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6123
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6434
6124
  */
6435
6125
  /**
6436
6126
  * TOKENS:
@@ -6440,7 +6130,7 @@ body {
6440
6130
  */
6441
6131
  /**
6442
6132
  * Do not edit directly
6443
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6133
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6444
6134
  */
6445
6135
  /**
6446
6136
  * TOKENS:
@@ -6465,7 +6155,7 @@ body {
6465
6155
  }
6466
6156
  /**
6467
6157
  * Do not edit directly
6468
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6158
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6469
6159
  */
6470
6160
  /**
6471
6161
  * TOKENS:
@@ -6526,7 +6216,7 @@ body {
6526
6216
 
6527
6217
  /**
6528
6218
  * Do not edit directly
6529
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6219
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6530
6220
  */
6531
6221
  /**
6532
6222
  * TOKENS:
@@ -6941,7 +6631,7 @@ body {
6941
6631
 
6942
6632
  /**
6943
6633
  * Do not edit directly
6944
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6634
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6945
6635
  */
6946
6636
  /**
6947
6637
  * TOKENS:
@@ -6995,7 +6685,7 @@ body {
6995
6685
 
6996
6686
  /**
6997
6687
  * Do not edit directly
6998
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6688
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6999
6689
  */
7000
6690
  /**
7001
6691
  * TOKENS:
@@ -7153,7 +6843,7 @@ body {
7153
6843
 
7154
6844
  /**
7155
6845
  * Do not edit directly
7156
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6846
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7157
6847
  */
7158
6848
  /**
7159
6849
  * TOKENS:
@@ -7504,7 +7194,7 @@ body {
7504
7194
 
7505
7195
  /**
7506
7196
  * Do not edit directly
7507
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7197
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7508
7198
  */
7509
7199
  /**
7510
7200
  * TOKENS:
@@ -7690,7 +7380,7 @@ body {
7690
7380
 
7691
7381
  /**
7692
7382
  * Do not edit directly
7693
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7383
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7694
7384
  */
7695
7385
  /**
7696
7386
  * TOKENS:
@@ -7748,7 +7438,7 @@ body {
7748
7438
 
7749
7439
  /**
7750
7440
  * Do not edit directly
7751
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7441
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7752
7442
  */
7753
7443
  /**
7754
7444
  * TOKENS:
@@ -7922,7 +7612,7 @@ body {
7922
7612
 
7923
7613
  /**
7924
7614
  * Do not edit directly
7925
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7615
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7926
7616
  */
7927
7617
  /**
7928
7618
  * TOKENS:
@@ -8097,7 +7787,7 @@ body {
8097
7787
 
8098
7788
  /**
8099
7789
  * Do not edit directly
8100
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7790
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
8101
7791
  */
8102
7792
  /**
8103
7793
  * TOKENS:
@@ -9007,7 +8697,7 @@ body {
9007
8697
 
9008
8698
  /**
9009
8699
  * Do not edit directly
9010
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8700
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
9011
8701
  */
9012
8702
  /**
9013
8703
  * TOKENS:
@@ -9017,7 +8707,7 @@ body {
9017
8707
  */
9018
8708
  /**
9019
8709
  * Do not edit directly
9020
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8710
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
9021
8711
  */
9022
8712
  /**
9023
8713
  * TOKENS:
@@ -9042,7 +8732,7 @@ body {
9042
8732
  }
9043
8733
  /**
9044
8734
  * Do not edit directly
9045
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8735
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
9046
8736
  */
9047
8737
  /**
9048
8738
  * TOKENS: