@ilo-org/styles 0.5.0 → 0.7.0

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 (45) hide show
  1. package/build/css/components/index.css +805 -1088
  2. package/build/css/components/index.css.map +1 -1
  3. package/build/css/global.css +1 -1
  4. package/build/css/index.css +805 -1088
  5. package/build/css/index.css.map +1 -1
  6. package/build/css/monorepo.css +805 -1088
  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/accordion.css +1 -1
  13. package/css/components/card.css +1 -1
  14. package/css/components/cardgroup.css +1 -1
  15. package/css/components/datacard.css +1 -0
  16. package/css/components/detailcard.css +1 -0
  17. package/css/components/factlistcard.css +1 -0
  18. package/css/components/featurecard.css +1 -0
  19. package/css/components/herocard.css +1 -1
  20. package/css/components/logogrid.css +1 -0
  21. package/css/components/multilinkcard.css +1 -0
  22. package/css/components/promocard.css +1 -0
  23. package/css/components/statcard.css +1 -0
  24. package/css/components/textcard.css +1 -0
  25. package/css/global.css.map +1 -1
  26. package/css/index.css +1 -1
  27. package/css/index.css.map +1 -1
  28. package/css/monorepo.css +1 -1
  29. package/css/monorepo.css.map +1 -1
  30. package/package.json +1 -1
  31. package/scss/_mixins.scss +19 -20
  32. package/scss/components/_accordion.scss +8 -0
  33. package/scss/components/_card.scss +79 -1377
  34. package/scss/components/_cardgroup.scss +26 -26
  35. package/scss/components/_datacard.scss +90 -0
  36. package/scss/components/_detailcard.scss +150 -0
  37. package/scss/components/_factlistcard.scss +110 -0
  38. package/scss/components/_featurecard.scss +218 -0
  39. package/scss/components/_herocard.scss +3 -19
  40. package/scss/components/_logogrid.scss +52 -0
  41. package/scss/components/_multilinkcard.scss +189 -0
  42. package/scss/components/_promocard.scss +157 -0
  43. package/scss/components/_statcard.scss +76 -0
  44. package/scss/components/_textcard.scss +135 -0
  45. package/scss/components/index.scss +9 -0
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4
4
  */
5
5
  /**
6
6
  * TOKENS:
@@ -10,7 +10,7 @@
10
10
  */
11
11
  /**
12
12
  * Do not edit directly
13
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
13
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
14
14
  */
15
15
  /**
16
16
  * TOKENS:
@@ -86,6 +86,7 @@
86
86
  --height: auto;
87
87
  color: rgb(109, 109, 109);
88
88
  font-family: Noto Sans;
89
+ position: relative;
89
90
  height: 0px;
90
91
  overflow: hidden;
91
92
  transition: height 225ms ease-out, padding 225ms ease-out;
@@ -101,6 +102,11 @@
101
102
  height: var(--height);
102
103
  transition: height 225ms ease-out, padding 225ms ease-out;
103
104
  }
105
+ .ilo--accordion--panel__scroll {
106
+ max-height: 500px;
107
+ overflow-y: auto;
108
+ padding-right: 1.7148981779rem;
109
+ }
104
110
  .ilo--accordion--panel.collapsing, .ilo--accordion--panel.expanding {
105
111
  height: 0;
106
112
  position: relative;
@@ -123,7 +129,7 @@
123
129
 
124
130
  /**
125
131
  * Do not edit directly
126
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
132
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
127
133
  */
128
134
  /**
129
135
  * TOKENS:
@@ -148,7 +154,7 @@
148
154
  }
149
155
  /**
150
156
  * Do not edit directly
151
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
157
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
152
158
  */
153
159
  /**
154
160
  * TOKENS:
@@ -402,7 +408,7 @@
402
408
 
403
409
  /**
404
410
  * Do not edit directly
405
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
411
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
406
412
  */
407
413
  /**
408
414
  * TOKENS:
@@ -412,7 +418,7 @@
412
418
  */
413
419
  /**
414
420
  * Do not edit directly
415
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
421
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
416
422
  */
417
423
  /**
418
424
  * TOKENS:
@@ -437,7 +443,7 @@
437
443
  }
438
444
  /**
439
445
  * Do not edit directly
440
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
446
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
441
447
  */
442
448
  /**
443
449
  * TOKENS:
@@ -727,7 +733,7 @@
727
733
 
728
734
  /**
729
735
  * Do not edit directly
730
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
736
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
731
737
  */
732
738
  /**
733
739
  * TOKENS:
@@ -857,7 +863,7 @@
857
863
 
858
864
  /**
859
865
  * Do not edit directly
860
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
866
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
861
867
  */
862
868
  /**
863
869
  * TOKENS:
@@ -866,38 +872,75 @@
866
872
  * MAPS:
867
873
  */
868
874
  .ilo--card {
869
- margin: 0;
870
- max-width: 49.3033226152rem;
875
+ box-sizing: border-box;
876
+ position: relative;
877
+ max-width: var(--max-width);
878
+ flex: 1 1 var(--max-width);
879
+ }
880
+ .ilo--card__size__fluid {
881
+ --max-width: 100% !important;
871
882
  }
872
883
  .right-to-left .ilo--card {
873
884
  text-align: right;
874
885
  }
875
- .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) {
886
+ .ilo--card__action:hover, .ilo--card__action:focus, .ilo--card__action:focus-within {
876
887
  background: rgb(255, 255, 255);
877
- color: rgb(30, 45, 190);
878
888
  outline: none;
879
889
  text-decoration: none;
880
890
  }
881
- .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) {
891
+ .ilo--card__action:hover.ilo--card__dark, .ilo--card__action:focus.ilo--card__dark, .ilo--card__action:focus-within.ilo--card__dark {
882
892
  background: rgb(255, 255, 255);
883
893
  }
884
- .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 {
885
- 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");
886
- }
887
- .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 {
894
+ .ilo--card__action:hover .ilo--card--eyebrow,
895
+ .ilo--card__action:hover .ilo--card--title,
896
+ .ilo--card__action:hover .ilo--card--intro,
897
+ .ilo--card__action:hover .ilo--card--date,
898
+ .ilo--card__action:hover .ilo--card--date-extra, .ilo--card__action:focus .ilo--card--eyebrow,
899
+ .ilo--card__action:focus .ilo--card--title,
900
+ .ilo--card__action:focus .ilo--card--intro,
901
+ .ilo--card__action:focus .ilo--card--date,
902
+ .ilo--card__action:focus .ilo--card--date-extra, .ilo--card__action:focus-within .ilo--card--eyebrow,
903
+ .ilo--card__action:focus-within .ilo--card--title,
904
+ .ilo--card__action:focus-within .ilo--card--intro,
905
+ .ilo--card__action:focus-within .ilo--card--date,
906
+ .ilo--card__action:focus-within .ilo--card--date-extra {
888
907
  color: rgb(30, 45, 190);
889
908
  }
890
- .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 {
891
- color: rgb(30, 45, 190);
909
+ .ilo--card__theme__light {
910
+ background: rgb(255, 255, 255);
892
911
  }
893
- .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 {
894
- color: rgb(30, 45, 190);
912
+ .ilo--card__theme__dark {
913
+ background: rgb(35, 0, 80);
914
+ transition: background 150ms ease-out;
895
915
  }
896
- .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 {
897
- color: rgb(30, 45, 190);
916
+ .ilo--card__theme__dark .ilo--card--eyebrow,
917
+ .ilo--card__theme__dark .ilo--card--title,
918
+ .ilo--card__theme__dark .ilo--card--intro,
919
+ .ilo--card__theme__dark .ilo--card--date,
920
+ .ilo--card__theme__dark .ilo--card--eventdate {
921
+ color: rgb(237, 240, 242);
922
+ transition: color 150ms ease-out;
898
923
  }
899
- .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 {
900
- color: rgb(30, 45, 190);
924
+ .ilo--card__isvideo .ilo--card--image--wrapper {
925
+ position: relative;
926
+ }
927
+ .ilo--card__isvideo .ilo--card--image--wrapper::before {
928
+ 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");
929
+ background-color: rgb(45, 45, 45);
930
+ background-position: center;
931
+ background-size: 18px 20px;
932
+ background-repeat: no-repeat;
933
+ content: "";
934
+ display: block;
935
+ height: 40px;
936
+ left: 0;
937
+ position: absolute;
938
+ top: 0;
939
+ width: 40px;
940
+ z-index: 1;
941
+ }
942
+ .ilo--card--wrapper:hover, .ilo--card--wrapper:focus, .ilo--card--wrapper:focus-within {
943
+ 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));
901
944
  }
902
945
  .ilo--card--link {
903
946
  background: none;
@@ -919,6 +962,21 @@
919
962
  transition-duration: 150ms;
920
963
  transition-timing-function: ease-out;
921
964
  }
965
+ .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 {
966
+ color: rgb(30, 45, 190);
967
+ }
968
+ .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 {
969
+ color: rgb(30, 45, 190);
970
+ }
971
+ .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 {
972
+ color: rgb(30, 45, 190);
973
+ }
974
+ .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 {
975
+ color: rgb(30, 45, 190);
976
+ }
977
+ .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 {
978
+ color: rgb(30, 45, 190);
979
+ }
922
980
  .ilo--card--link--text {
923
981
  width: 1px;
924
982
  height: 1px;
@@ -929,176 +987,6 @@
929
987
  clip: rect(0 0 0 0);
930
988
  overflow: hidden;
931
989
  }
932
- .ilo--card--light {
933
- background: rgb(255, 255, 255);
934
- }
935
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) {
936
- background: rgb(35, 0, 80);
937
- outline: none;
938
- transition: background 150ms ease-out;
939
- }
940
- .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 {
941
- color: rgb(237, 240, 242);
942
- transition: color 150ms ease-out;
943
- }
944
- .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 {
945
- color: rgb(255, 255, 255);
946
- transition: color 150ms ease-out;
947
- }
948
- .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 {
949
- color: rgb(237, 240, 242);
950
- transition: color 150ms ease-out;
951
- }
952
- .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 {
953
- color: rgb(237, 240, 242);
954
- transition: color 150ms ease-out;
955
- }
956
- .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 {
957
- color: rgb(237, 240, 242);
958
- transition: color 150ms ease-out;
959
- }
960
- .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 {
961
- background: rgb(35, 0, 80);
962
- outline: none;
963
- transition: background 150ms ease-out;
964
- }
965
- .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 {
966
- color: rgb(237, 240, 242);
967
- transition: color 150ms ease-out;
968
- }
969
- .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 {
970
- color: rgb(255, 255, 255);
971
- transition: color 150ms ease-out;
972
- }
973
- .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 {
974
- color: rgb(237, 240, 242);
975
- transition: color 150ms ease-out;
976
- }
977
- .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 {
978
- color: rgb(237, 240, 242);
979
- transition: color 150ms ease-out;
980
- }
981
- .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 {
982
- color: rgb(237, 240, 242);
983
- transition: color 150ms ease-out;
984
- }
985
- .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) {
986
- margin-top: 2.1436227224rem;
987
- padding-top: 0;
988
- position: relative;
989
- }
990
- .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 {
991
- background: inherit;
992
- content: "";
993
- display: block;
994
- height: 40px;
995
- position: absolute;
996
- width: calc(100% - 73px);
997
- }
998
- .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 {
999
- 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");
1000
- background-position: bottom right;
1001
- background-size: cover;
1002
- content: "";
1003
- height: 40px;
1004
- display: block;
1005
- position: absolute;
1006
- width: 73.4px;
1007
- }
1008
- .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 {
1009
- 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");
1010
- }
1011
- @media screen and (min-width: 610px) {
1012
- .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) {
1013
- margin-top: 2.5723472669rem;
1014
- }
1015
- .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 {
1016
- background: inherit;
1017
- content: "";
1018
- display: block;
1019
- height: 48px;
1020
- position: absolute;
1021
- width: calc(100% - 87px);
1022
- }
1023
- .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 {
1024
- 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");
1025
- background-position: bottom right;
1026
- background-size: cover;
1027
- content: "";
1028
- height: 48px;
1029
- display: block;
1030
- position: absolute;
1031
- width: 87.4px;
1032
- }
1033
- .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 {
1034
- 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");
1035
- }
1036
- }
1037
- @media screen and (min-width: 1024px) {
1038
- .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) {
1039
- margin-top: 3.4297963558rem;
1040
- }
1041
- .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 {
1042
- background: inherit;
1043
- content: "";
1044
- display: block;
1045
- height: 64px;
1046
- position: absolute;
1047
- width: calc(100% - 116px);
1048
- }
1049
- .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 {
1050
- 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");
1051
- background-position: bottom right;
1052
- background-size: cover;
1053
- content: "";
1054
- height: 64px;
1055
- display: block;
1056
- position: absolute;
1057
- width: 116.4px;
1058
- }
1059
- .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 {
1060
- 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");
1061
- }
1062
- }
1063
- .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 {
1064
- left: 0;
1065
- top: -2.1436227224rem;
1066
- transition: background-image 150ms ease-out;
1067
- }
1068
- .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 {
1069
- left: auto;
1070
- right: 0;
1071
- }
1072
- @media screen and (min-width: 610px) {
1073
- .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 {
1074
- top: -2.5562700965rem;
1075
- }
1076
- }
1077
- @media screen and (min-width: 1024px) {
1078
- .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 {
1079
- top: -3.4137191854rem;
1080
- }
1081
- }
1082
- .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 {
1083
- right: 0;
1084
- top: -2.1436227224rem;
1085
- transition: background-image 150ms ease-out;
1086
- }
1087
- .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 {
1088
- left: 0;
1089
- right: auto;
1090
- transform: rotateY(180deg);
1091
- }
1092
- @media screen and (min-width: 610px) {
1093
- .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 {
1094
- top: -2.5562700965rem;
1095
- }
1096
- }
1097
- @media screen and (min-width: 1024px) {
1098
- .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 {
1099
- top: -3.4137191854rem;
1100
- }
1101
- }
1102
990
  .ilo--card--eyebrow {
1103
991
  color: rgb(150, 10, 85);
1104
992
  font-size: 16px;
@@ -1171,7 +1059,7 @@
1171
1059
  line-height: 23.36px;
1172
1060
  margin-bottom: 1.3742266073rem;
1173
1061
  }
1174
- .ilo--card--image {
1062
+ .ilo--card--picture {
1175
1063
  max-width: 100%;
1176
1064
  width: 100%;
1177
1065
  }
@@ -1179,190 +1067,131 @@
1179
1067
  position: relative;
1180
1068
  z-index: 2;
1181
1069
  }
1182
- .ilo--card--isvideo .ilo--card--image--wrapper {
1070
+
1071
+ /**
1072
+ * Do not edit directly
1073
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1074
+ */
1075
+ /**
1076
+ * TOKENS:
1077
+ */
1078
+ /**
1079
+ * MAPS:
1080
+ */
1081
+ .ilo--card__type__feature {
1082
+ --max-width: 22.0793140407rem;
1083
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1084
+ display: flex;
1085
+ margin-top: 0;
1183
1086
  position: relative;
1184
1087
  }
1185
- .ilo--card--isvideo .ilo--card--image--wrapper::before {
1186
- 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");
1187
- background-color: rgb(45, 45, 45);
1188
- background-position: center;
1189
- background-size: 18px 20px;
1190
- background-repeat: no-repeat;
1191
- content: "";
1192
- display: block;
1193
- height: 40px;
1194
- left: 0;
1195
- position: absolute;
1196
- top: 0;
1197
- width: 40px;
1198
- z-index: 1;
1088
+ .ilo--card__type__feature.ilo--card__theme__dark {
1089
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1199
1090
  }
1200
- .ilo--card--multilink {
1201
- padding: 1.2861736334rem;
1091
+ .ilo--card__type__feature.ilo--card__theme__dark .ilo--link-list {
1092
+ border-top: 2px solid rgba(237, 240, 242, 0.25);
1202
1093
  }
1203
- .ilo--card--multilink .ilo--card--image--wrapper {
1204
- display: none;
1094
+ .ilo--card__type__feature.ilo--card__theme__dark .ilo--link-list--link {
1095
+ color: rgb(255, 255, 255);
1096
+ 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");
1205
1097
  }
1206
- .ilo--card--multilink .ilo--card--content .ilo--card--image--wrapper {
1207
- display: block;
1098
+ .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 {
1099
+ color: rgb(30, 45, 190);
1100
+ 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");
1208
1101
  }
1209
- @media screen and (min-width: 610px) {
1210
- .ilo--card--multilink {
1211
- padding: 2.1436227224rem;
1212
- }
1102
+ .ilo--card__type__feature picture::before {
1103
+ transition-property: opacity;
1104
+ transition-duration: 150ms;
1105
+ transition-timing-function: ease-out;
1213
1106
  }
1214
- @media screen and (min-width: 1024px) {
1215
- .ilo--card--multilink {
1216
- padding: 3.0010718114rem 2.5723472669rem;
1217
- }
1107
+ .ilo--card__type__feature:hover, .ilo--card__type__feature:focus, .ilo--card__type__feature:focus-within {
1108
+ background-color: rgb(255, 255, 255);
1109
+ border-bottom: 0.1607717042rem solid rgb(30, 45, 190);
1110
+ 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));
1218
1111
  }
1219
- .ilo--card--multilink .ilo--card--title {
1220
- font-size: 23.32px;
1221
- letter-spacing: -0.035em;
1222
- line-height: 29.15px;
1223
- margin-bottom: 0.7188906752rem;
1224
- color: rgb(45, 45, 45);
1112
+ .ilo--card__type__feature:hover picture::before, .ilo--card__type__feature:focus picture::before, .ilo--card__type__feature:focus-within picture::before {
1113
+ opacity: 0.4;
1114
+ z-index: 1;
1115
+ transition-property: opacity;
1116
+ transition-duration: 150ms;
1117
+ transition-timing-function: ease-out;
1225
1118
  }
1226
- @media screen and (min-width: 610px) {
1227
- .ilo--card--multilink .ilo--card--title {
1228
- font-size: 29.16px;
1229
- letter-spacing: -0.035em;
1230
- line-height: 36.45px;
1231
- margin-bottom: 0.5741425509rem;
1232
- }
1119
+ .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 {
1120
+ filter: saturate(0);
1233
1121
  }
1234
- .ilo--card--multilink .ilo--card--intro {
1235
- font-size: 16px;
1236
- letter-spacing: normal;
1237
- line-height: 23.36px;
1238
- margin-bottom: 1.910132288rem;
1239
- color: rgb(45, 45, 45);
1122
+ .ilo--card__type__feature .ilo--link-list {
1123
+ border-top: 0.1071811361rem solid rgb(237, 240, 242);
1124
+ margin-left: -1.2861736334rem;
1125
+ margin-right: -1.2861736334rem;
1126
+ margin-top: 1.822079314rem;
1127
+ position: relative;
1128
+ z-index: 2;
1240
1129
  }
1241
- @media screen and (min-width: 610px) {
1242
- .ilo--card--multilink .ilo--card--intro {
1243
- font-size: 18.66px;
1244
- letter-spacing: normal;
1245
- line-height: 27.24px;
1246
- margin-bottom: 1.8685411561rem;
1247
- }
1130
+ .ilo--card__type__feature .ilo--link-list--link, .ilo--card__type__feature .ilo--link-list--link:hover {
1131
+ border-bottom: none;
1132
+ padding-left: 1.2861736334rem;
1133
+ padding-right: 1.2861736334rem;
1248
1134
  }
1249
- .ilo--card--multilink.ilo--card--dark {
1250
- background: rgb(255, 255, 255);
1135
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--wrap {
1136
+ display: flex;
1137
+ flex-wrap: wrap;
1138
+ width: 100%;
1251
1139
  }
1252
- .ilo--card--multilink.ilo--card--dark .ilo--card--title {
1253
- color: rgb(45, 45, 45);
1140
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--content {
1141
+ width: 100%;
1254
1142
  }
1255
- .ilo--card--multilink.ilo--card--dark .ilo--card--intro {
1256
- color: rgb(45, 45, 45);
1143
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--image--wrapper {
1144
+ width: 100%;
1257
1145
  }
1258
- .ilo--card--multilink.ilo--card--wide {
1259
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1146
+ .ilo--card__type__feature.ilo--card__size__wide, .ilo--card__type__feature.ilo--card__size__fluid {
1147
+ --max-width: 40.4072883173rem;
1260
1148
  }
1261
1149
  @media screen and (min-width: 610px) {
1262
- .ilo--card--multilink.ilo--card--wide {
1263
- padding: 3.0010718114rem 2.5723472669rem;
1264
- }
1265
- .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1266
- flex-direction: row-reverse;
1267
- }
1268
- .right-to-left .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1150
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--wrap, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--wrap {
1269
1151
  flex-direction: row;
1270
1152
  }
1271
- .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1272
- display: flex;
1273
- column-gap: 1.7148981779rem;
1274
- }
1275
- .right-to-left .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1153
+ .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 {
1276
1154
  flex-direction: row-reverse;
1277
1155
  }
1278
- .ilo--card--multilink.ilo--card--wide .ilo--card--image--wrapper {
1279
- display: block;
1156
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--content, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--content {
1157
+ display: flex;
1158
+ flex-direction: row;
1159
+ flex-wrap: wrap;
1160
+ position: relative;
1280
1161
  width: 50%;
1281
1162
  }
1282
- .ilo--card--multilink.ilo--card--wide .ilo--card--content {
1163
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--image--wrapper {
1283
1164
  width: 50%;
1284
1165
  }
1285
- .ilo--card--multilink.ilo--card--wide .ilo--card--content .ilo--card--image--wrapper {
1286
- display: none;
1166
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--image, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--image {
1167
+ object-fit: cover;
1287
1168
  }
1288
- }
1289
- .ilo--card--multilink.ilo--card--standard {
1290
- padding: 2.5723472669rem 2.1436227224rem;
1291
- }
1292
- @media screen and (min-width: 610px) {
1293
- .ilo--card--multilink.ilo--card--standard {
1294
- padding: 2.5723472669rem 2.1436227224rem;
1295
- }
1296
- }
1297
- @media screen and (min-width: 1024px) {
1298
- .ilo--card--multilink.ilo--card--standard {
1299
- padding: 2.5723472669rem 2.1436227224rem;
1300
- }
1301
- }
1302
- .ilo--card--multilink.ilo--card--narrow {
1303
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1304
- }
1305
- @media screen and (min-width: 610px) {
1306
- .ilo--card--multilink.ilo--card--narrow {
1307
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1308
- }
1309
- }
1310
- @media screen and (min-width: 1024px) {
1311
- .ilo--card--multilink.ilo--card--narrow {
1312
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1169
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--date, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--date {
1170
+ align-self: flex-end;
1171
+ width: 100%;
1313
1172
  }
1314
- }
1315
- .ilo--card--multilink.ilo--card--narrow .ilo--card--image--wrapper {
1316
- display: none;
1317
- }
1318
- .ilo--card--multilink.ilo--card--narrow .ilo--card--content .ilo--card--image--wrapper {
1319
- display: block;
1320
- margin-bottom: 1.2861736334rem;
1321
- }
1322
- @media screen and (min-width: 610px) {
1323
- .ilo--card--multilink.ilo--card--narrow .ilo--card--title {
1324
- font-size: 23.32px;
1325
- letter-spacing: -0.035em;
1326
- line-height: 29.15px;
1327
- margin-bottom: 0.7188906752rem;
1173
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--eyebrow, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--eyebrow {
1174
+ width: 100%;
1328
1175
  }
1329
- }
1330
- @media screen and (min-width: 610px) {
1331
- .ilo--card--multilink.ilo--card--narrow .ilo--card--intro {
1332
- font-size: 16px;
1333
- letter-spacing: normal;
1334
- line-height: 23.36px;
1335
- margin-bottom: 1.910132288rem;
1176
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--card--title, .ilo--card__type__feature.ilo--card__size__fluid .ilo--card--title {
1177
+ width: 100%;
1336
1178
  }
1337
- }
1338
- .ilo--card--multilink .ilo--link-list {
1339
- margin-top: 1.8756698821rem;
1340
- }
1341
- .ilo--card--detail {
1342
- border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1343
- padding: 1.2861736334rem 0;
1344
- position: relative;
1345
- }
1346
- @media screen and (min-width: 1024px) {
1347
- .ilo--card--detail {
1348
- padding: 1.7148981779rem 0;
1179
+ .ilo--card__type__feature.ilo--card__size__wide .ilo--link-list, .ilo--card__type__feature.ilo--card__size__fluid .ilo--link-list {
1180
+ width: calc(100% + 48px);
1181
+ align-self: flex-end;
1349
1182
  }
1350
1183
  }
1351
- .ilo--card--detail:hover, .ilo--card--detail:focus, .ilo--card--detail:focus-within {
1352
- 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));
1353
- }
1354
- .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before, .ilo--card--detail:focus-within picture::before {
1355
- opacity: 0.4;
1356
- z-index: 2;
1357
- }
1358
- .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 {
1359
- 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");
1184
+ .ilo--card__type__feature .ilo--card--wrap {
1185
+ display: flex;
1186
+ flex-direction: column;
1187
+ width: 100%;
1360
1188
  }
1361
- .ilo--card--detail picture {
1189
+ .ilo--card__type__feature picture {
1362
1190
  display: flex;
1191
+ height: 100%;
1363
1192
  position: relative;
1364
1193
  }
1365
- .ilo--card--detail picture::before {
1194
+ .ilo--card__type__feature picture::before {
1366
1195
  background-color: rgb(30, 45, 190);
1367
1196
  content: "";
1368
1197
  display: block;
@@ -1371,725 +1200,590 @@
1371
1200
  opacity: 0;
1372
1201
  position: absolute;
1373
1202
  top: 0;
1203
+ transition: opacity 150ms ease-in-out;
1374
1204
  width: 100%;
1375
1205
  z-index: -1;
1376
- transition-property: opacity;
1377
- transition-duration: 150ms;
1378
- transition-timing-function: ease-out;
1379
1206
  }
1380
- .ilo--card--detail .ilo--card--wrap {
1207
+ .ilo--card__type__feature .ilo--card--content {
1381
1208
  display: flex;
1209
+ flex: 1 1 auto;
1210
+ flex-direction: column;
1211
+ padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
1382
1212
  }
1383
- .right-to-left .ilo--card--detail .ilo--card--wrap {
1384
- flex-direction: row-reverse;
1385
- }
1386
- .ilo--card--detail .ilo--card--image {
1387
- object-fit: contain;
1388
- width: 4.1264737406rem;
1389
- }
1390
- @media screen and (min-width: 1024px) {
1391
- .ilo--card--detail .ilo--card--image {
1392
- width: 10.718113612rem;
1393
- }
1394
- }
1395
- .ilo--card--detail .ilo--card--image--wrapper {
1396
- max-width: 4.1264737406rem;
1397
- width: 100%;
1398
- }
1399
- @media screen and (min-width: 1024px) {
1400
- .ilo--card--detail .ilo--card--image--wrapper {
1401
- max-width: 10.718113612rem;
1402
- }
1403
- }
1404
- .ilo--card--detail .ilo--card--content {
1405
- padding: 0 1.2861736334rem;
1213
+ .ilo--card__type__feature.ilo--card__linklist .ilo--card--content {
1214
+ padding-bottom: 0;
1406
1215
  }
1407
- .ilo--card--detail .ilo--card--title {
1408
- font-size: 18.66px;
1216
+ .ilo--card__type__feature .ilo--card--title {
1217
+ font-size: 23.32px;
1409
1218
  letter-spacing: -0.035em;
1410
- line-height: 24.26px;
1411
- }
1412
- @media screen and (min-width: 1024px) {
1413
- .ilo--card--detail .ilo--card--title {
1414
- font-size: 23.32px;
1415
- letter-spacing: -0.035em;
1416
- line-height: 29.15px;
1417
- }
1219
+ line-height: 29.15px;
1220
+ margin-bottom: 1.5763397642rem;
1221
+ font-family: Overpass;
1222
+ font-weight: 700;
1418
1223
  }
1419
- .ilo--card--detail .ilo--card--event-date {
1420
- font-size: 16px;
1224
+ .ilo--card__type__feature .ilo--card--eyebrow {
1225
+ font-size: 14.93px;
1421
1226
  letter-spacing: normal;
1422
- line-height: 23.36px;
1423
- margin-bottom: 0;
1424
- padding-left: 1.2861736334rem;
1425
- position: relative;
1426
- }
1427
- .ilo--card--detail .ilo--card--event-date::before {
1428
- background-repeat: no-repeat;
1429
- content: "";
1430
- display: inline-block;
1431
- height: 0.7502679528rem;
1432
- left: 0;
1433
- position: absolute;
1434
- top: 50%;
1435
- transform: rotate(-90deg) translateX(50%);
1436
- width: 0.6430868167rem;
1437
- 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");
1227
+ line-height: 19.71px;
1228
+ margin-bottom: 0.3376482577rem;
1438
1229
  }
1439
- .ilo--card--detail .ilo--card--date {
1440
- font-size: 16px;
1441
- letter-spacing: normal;
1442
- line-height: 23.36px;
1230
+ .ilo--card__type__feature .ilo--card--date {
1231
+ margin-bottom: 0;
1232
+ margin-top: auto;
1443
1233
  }
1444
- .ilo--card--graphic {
1234
+
1235
+ /**
1236
+ * Do not edit directly
1237
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1238
+ */
1239
+ /**
1240
+ * TOKENS:
1241
+ */
1242
+ /**
1243
+ * MAPS:
1244
+ */
1245
+ .ilo--card__type__text {
1246
+ --max-width: 16.1307609861rem;
1445
1247
  border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1446
- margin-top: 2.1436227224rem;
1447
- padding: 0 1.2861736334rem 2.1436227224rem;
1448
- position: relative;
1449
- }
1450
- .ilo--card--graphic::before {
1451
- background: inherit;
1452
- content: "";
1453
- display: block;
1454
- height: 40px;
1455
- position: absolute;
1456
- width: calc(100% - 73px);
1457
- }
1458
- .ilo--card--graphic::after {
1459
- 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");
1460
- background-position: bottom right;
1461
- background-size: cover;
1462
- content: "";
1463
- height: 40px;
1464
- display: block;
1465
- position: absolute;
1466
- width: 73.4px;
1467
- }
1468
- .ilo--card--graphic.ilo--card--dark::after {
1469
- 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");
1470
- }
1471
- .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 {
1472
- 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");
1473
- }
1474
- .ilo--card--graphic::before {
1475
- left: 0;
1476
- top: -39.7px;
1477
- }
1478
- .right-to-left .ilo--card--graphic::before {
1479
- left: auto;
1480
- right: 0;
1481
- }
1482
- .ilo--card--graphic::after {
1483
- right: 0;
1484
- top: -39.7px;
1485
- transition: background-image 150ms ease-out;
1248
+ padding: 1.2861736334rem 2.1436227224rem;
1249
+ clip-path: polygon(0 0, calc(100% - 73px) 0, 100% 40px, 100% 100%, 0 100%);
1486
1250
  }
1487
- .right-to-left .ilo--card--graphic::after {
1488
- left: 0;
1489
- right: auto;
1490
- transform: rotateY(180deg);
1491
- }
1492
- .ilo--card--graphic .ilo--profile--contents--light * {
1251
+ .ilo--card__type__text [class$=profile--contents--light] * {
1493
1252
  color: rgb(45, 45, 45);
1494
1253
  }
1495
- .ilo--card--graphic .ilo--profile--contents--dark * {
1254
+ .ilo--card__type__text [class$=profile--contents--dark] * {
1496
1255
  color: rgb(255, 255, 255);
1497
1256
  }
1498
- .ilo--card--graphic:hover, .ilo--card--graphic:focus, .ilo--card--graphic:focus-within {
1257
+ .ilo--card__type__text:hover, .ilo--card__type__text:focus, .ilo--card__type__text:focus-within {
1499
1258
  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));
1500
1259
  }
1501
- .ilo--card--graphic:hover .ilo--profile--contents *, .ilo--card--graphic:focus .ilo--profile--contents *, .ilo--card--graphic:focus-within .ilo--profile--contents * {
1260
+ .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] * {
1502
1261
  color: rgb(30, 45, 190);
1503
1262
  }
1504
1263
  @media screen and (min-width: 610px) {
1505
- .ilo--card--graphic {
1506
- padding: 0 1.7148981779rem 2.1436227224rem;
1507
- }
1508
- .ilo--card--graphic::before {
1509
- background: inherit;
1510
- content: "";
1511
- display: block;
1512
- height: 40px;
1513
- position: absolute;
1514
- width: calc(100% - 73px);
1515
- }
1516
- .ilo--card--graphic::after {
1517
- 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");
1518
- background-position: bottom right;
1519
- background-size: cover;
1520
- content: "";
1521
- height: 40px;
1522
- display: block;
1523
- position: absolute;
1524
- width: 73.4px;
1525
- }
1526
- .ilo--card--graphic.ilo--card--dark::after {
1527
- 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");
1528
- }
1529
- .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 {
1530
- 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");
1531
- }
1532
- .ilo--card--graphic::before {
1533
- left: 0;
1534
- top: -39.7px;
1535
- }
1536
- .right-to-left .ilo--card--graphic::before {
1537
- left: auto;
1538
- right: 0;
1539
- }
1540
- .ilo--card--graphic::after {
1541
- right: 0;
1542
- top: -39.7px;
1543
- }
1544
- .right-to-left .ilo--card--graphic::after {
1545
- left: 0;
1546
- right: auto;
1547
- transform: rotateY(180deg);
1548
- }
1549
- }
1550
- @media screen and (min-width: 1024px) {
1551
- .ilo--card--graphic::before {
1552
- background: inherit;
1553
- content: "";
1554
- display: block;
1555
- height: 40px;
1556
- position: absolute;
1557
- width: calc(100% - 73px);
1558
- }
1559
- .ilo--card--graphic::after {
1560
- 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");
1561
- background-position: bottom right;
1562
- background-size: cover;
1563
- content: "";
1564
- height: 40px;
1565
- display: block;
1566
- position: absolute;
1567
- width: 73.4px;
1568
- }
1569
- .ilo--card--graphic.ilo--card--dark::after {
1570
- 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");
1571
- }
1572
- .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 {
1573
- 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");
1574
- }
1575
- .ilo--card--graphic::before {
1576
- left: 0;
1577
- top: -39.7px;
1578
- }
1579
- .right-to-left .ilo--card--graphic::before {
1580
- left: auto;
1581
- right: 0;
1582
- }
1583
- .ilo--card--graphic::after {
1584
- right: 0;
1585
- top: -39.7px;
1586
- }
1587
- .right-to-left .ilo--card--graphic::after {
1588
- left: 0;
1589
- right: auto;
1590
- transform: rotateY(180deg);
1591
- }
1592
- }
1593
- .ilo--card--graphic.ilo--card--wide {
1594
- padding: 0 1.7148981779rem 2.1436227224rem;
1595
- }
1596
- @media screen and (min-width: 610px) {
1597
- .ilo--card--graphic.ilo--card--wide {
1598
- padding: 0 1.7148981779rem 2.1436227224rem;
1264
+ .ilo--card__type__text {
1265
+ padding: 1.7148981779rem 2.1436227224rem;
1599
1266
  }
1600
1267
  }
1601
- .ilo--card--graphic.ilo--card--standard {
1602
- padding: 0 1.7148981779rem 2.1436227224rem;
1268
+ .ilo--card__type__text.ilo--card__size__wide, .ilo--card__type__text.ilo--card__size__fluid {
1269
+ --max-width: 28.0278670954rem;
1270
+ padding: 1.7148981779rem 2.1436227224rem;
1603
1271
  }
1604
1272
  @media screen and (min-width: 610px) {
1605
- .ilo--card--graphic.ilo--card--standard {
1606
- padding: 0 1.7148981779rem 2.1436227224rem;
1273
+ .ilo--card__type__text.ilo--card__size__wide, .ilo--card__type__text.ilo--card__size__fluid {
1274
+ padding: 1.7148981779rem 2.1436227224rem;
1607
1275
  }
1608
1276
  }
1609
- .ilo--card--graphic.ilo--card--narrow {
1610
- padding: 0 1.2861736334rem 2.1436227224rem;
1277
+ .ilo--card__type__text.ilo--card__size__narrow {
1278
+ --max-width: 16.1307609861rem;
1279
+ padding: 1.2861736334rem 2.1436227224rem;
1611
1280
  }
1612
1281
  @media screen and (min-width: 610px) {
1613
- .ilo--card--graphic.ilo--card--narrow {
1614
- padding: 0 1.2861736334rem 2.1436227224rem;
1282
+ .ilo--card__type__text.ilo--card__size__narrow {
1283
+ padding: 1.2861736334rem 2.1436227224rem;
1615
1284
  }
1616
1285
  }
1617
- .ilo--card--graphic.ilo--card--narrow .ilo--card--title {
1286
+ .ilo--card__type__text.ilo--card__size__narrow .ilo--card--title {
1618
1287
  font-size: 18.66px;
1619
1288
  letter-spacing: -0.035em;
1620
1289
  line-height: 24.26px;
1621
1290
  margin-bottom: 1.674953518rem;
1622
1291
  }
1623
- .ilo--card--graphic.ilo--card--dark {
1292
+ .ilo--card__type__text.ilo--card__dark {
1624
1293
  border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1625
1294
  }
1626
- .ilo--card--graphic .ilo--card--eyebrow {
1295
+ .ilo--card__type__text .ilo--card--eyebrow {
1627
1296
  margin-bottom: 1.0110920672rem;
1628
1297
  }
1629
- .ilo--card--graphic .ilo--card--title {
1298
+ .ilo--card__type__text .ilo--card--title {
1630
1299
  font-size: 18.66px;
1631
1300
  letter-spacing: -0.035em;
1632
1301
  line-height: 24.26px;
1633
1302
  margin-bottom: 1.674953518rem;
1634
1303
  }
1635
1304
  @media screen and (min-width: 610px) {
1636
- .ilo--card--graphic .ilo--card--title {
1305
+ .ilo--card__type__text .ilo--card--title {
1637
1306
  font-size: 23.32px;
1638
1307
  letter-spacing: -0.035em;
1639
1308
  line-height: 29.15px;
1640
1309
  margin-bottom: 1.5763397642rem;
1641
1310
  }
1642
1311
  }
1643
- .ilo--card--graphic .ilo--card--date {
1644
- display: block;
1645
- margin-bottom: 1.4398166117rem;
1312
+ .ilo--card__type__text .ilo--card--date {
1313
+ display: block;
1314
+ margin-bottom: 1.4398166117rem;
1315
+ }
1316
+ .ilo--card__type__text .ilo--card--content {
1317
+ display: flex;
1318
+ flex-direction: column;
1319
+ position: relative;
1320
+ }
1321
+ .ilo--card__type__text .ilo--card--content > * {
1322
+ justify-self: flex-start;
1323
+ }
1324
+ .ilo--card__type__text .ilo--card--content > *:last-child {
1325
+ justify-self: flex-end;
1326
+ margin-bottom: 0;
1327
+ }
1328
+
1329
+ /**
1330
+ * Do not edit directly
1331
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1332
+ */
1333
+ /**
1334
+ * TOKENS:
1335
+ */
1336
+ /**
1337
+ * MAPS:
1338
+ */
1339
+ .ilo--card__type__detail {
1340
+ --max-width: 18.3815648446rem;
1341
+ border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1342
+ padding: 1.2861736334rem 0;
1343
+ position: relative;
1344
+ }
1345
+ @media screen and (min-width: 1024px) {
1346
+ .ilo--card__type__detail {
1347
+ padding: 1.7148981779rem 0;
1348
+ }
1349
+ }
1350
+ .ilo--card__type__detail:hover, .ilo--card__type__detail:focus, .ilo--card__type__detail:focus-within {
1351
+ 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));
1352
+ }
1353
+ .ilo--card__type__detail:hover picture::before, .ilo--card__type__detail:focus picture::before, .ilo--card__type__detail:focus-within picture::before {
1354
+ opacity: 0.4;
1355
+ z-index: 2;
1356
+ }
1357
+ .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 {
1358
+ 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");
1359
+ }
1360
+ .ilo--card__type__detail .ilo--card--title {
1361
+ font-size: 18.66px;
1362
+ letter-spacing: -0.035em;
1363
+ line-height: 24.26px;
1364
+ }
1365
+ @media screen and (min-width: 1024px) {
1366
+ .ilo--card__size__wide .ilo--card__type__detail .ilo--card--title {
1367
+ font-size: 23.32px;
1368
+ letter-spacing: -0.035em;
1369
+ line-height: 29.15px;
1370
+ }
1371
+ .ilo--card__size__wide .ilo--card__type__detail .ilo--card--title {
1372
+ font-size: 18.66px;
1373
+ letter-spacing: -0.035em;
1374
+ line-height: 24.26px;
1375
+ }
1376
+ }
1377
+ .ilo--card__type__detail.ilo--card__size__wide, .ilo--card__type__detail.ilo--card__size__fluid {
1378
+ --max-width: 39.9249732047rem;
1379
+ }
1380
+ @media screen and (min-width: 1024px) {
1381
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--title, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--title {
1382
+ font-size: 23.32px;
1383
+ letter-spacing: -0.035em;
1384
+ line-height: 29.15px;
1385
+ }
1386
+ }
1387
+ @media screen and (min-width: 1024px) {
1388
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--image--wrapper {
1389
+ flex: 0 0 10.5037513398rem;
1390
+ }
1391
+ }
1392
+ @media screen and (min-width: 1024px) {
1393
+ .ilo--card__type__detail.ilo--card__size__wide .ilo--card--picture, .ilo--card__type__detail.ilo--card__size__fluid .ilo--card--picture {
1394
+ width: 10.5037513398rem;
1395
+ }
1396
+ }
1397
+ .ilo--card__type__detail.ilo--card__size__narrow {
1398
+ --max-width: 18.3815648446rem;
1399
+ }
1400
+ .ilo--card__type__detail picture {
1401
+ display: flex;
1402
+ position: relative;
1403
+ }
1404
+ .ilo--card__type__detail picture::before {
1405
+ background-color: rgb(30, 45, 190);
1406
+ content: "";
1407
+ display: block;
1408
+ height: 100%;
1409
+ left: 0;
1410
+ opacity: 0;
1411
+ position: absolute;
1412
+ top: 0;
1413
+ width: 100%;
1414
+ z-index: -1;
1415
+ transition-property: opacity;
1416
+ transition-duration: 150ms;
1417
+ transition-timing-function: ease-out;
1418
+ }
1419
+ .ilo--card__type__detail .ilo--card--wrap {
1420
+ display: flex;
1421
+ }
1422
+ .right-to-left .ilo--card__type__detail .ilo--card--wrap {
1423
+ flex-direction: row-reverse;
1424
+ }
1425
+ .ilo--card__type__detail .ilo--card--title {
1426
+ font-size: 18.66px;
1427
+ letter-spacing: -0.035em;
1428
+ line-height: 24.26px;
1429
+ }
1430
+ .ilo--card__type__detail .ilo--card--image--wrapper {
1431
+ flex: 0 0 4.1264737406rem;
1432
+ }
1433
+ .ilo--card__type__detail .ilo--card--picture {
1434
+ object-fit: contain;
1435
+ width: 4.1264737406rem;
1436
+ }
1437
+ .ilo--card__type__detail .ilo--card--content {
1438
+ padding: 0 1.2861736334rem;
1646
1439
  }
1647
- .ilo--card--graphic .ilo--card--content {
1648
- display: flex;
1649
- flex-direction: column;
1440
+ .ilo--card__type__detail .ilo--card--date-extra {
1441
+ font-size: 16px;
1442
+ letter-spacing: normal;
1443
+ line-height: 23.36px;
1444
+ margin-bottom: 0;
1445
+ padding-left: 1.2861736334rem;
1650
1446
  position: relative;
1651
1447
  }
1652
- .ilo--card--graphic .ilo--card--content > * {
1653
- justify-self: flex-start;
1448
+ .ilo--card__type__detail .ilo--card--date-extra::before {
1449
+ background-repeat: no-repeat;
1450
+ content: "";
1451
+ display: inline-block;
1452
+ height: 0.7502679528rem;
1453
+ left: 0;
1454
+ position: absolute;
1455
+ top: 50%;
1456
+ transform: rotate(-90deg) translateX(50%);
1457
+ width: 0.6430868167rem;
1458
+ 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");
1654
1459
  }
1655
- .ilo--card--graphic .ilo--card--content > *:last-child {
1656
- justify-self: flex-end;
1657
- margin-bottom: 0;
1460
+ .ilo--card__type__detail .ilo--card--date {
1461
+ font-size: 16px;
1462
+ letter-spacing: normal;
1463
+ line-height: 23.36px;
1658
1464
  }
1659
- .ilo--card--graphicpromo {
1660
- max-width: 49.3033226152rem;
1465
+
1466
+ /**
1467
+ * Do not edit directly
1468
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1469
+ */
1470
+ /**
1471
+ * TOKENS:
1472
+ */
1473
+ /**
1474
+ * MAPS:
1475
+ */
1476
+ .ilo--card__type__promo {
1477
+ --max-width: 18.3815648446rem;
1661
1478
  padding: 2.1436227224rem 1.2861736334rem;
1662
1479
  width: 100%;
1663
1480
  }
1664
- .ilo--card--graphicpromo:hover, .ilo--card--graphicpromo:focus, .ilo--card--graphicpromo:focus-within {
1665
- 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));
1666
- }
1667
1481
  @media screen and (min-width: 610px) {
1668
- .ilo--card--graphicpromo {
1482
+ .ilo--card__type__promo {
1669
1483
  padding: 2.5723472669rem;
1670
1484
  }
1671
1485
  }
1672
1486
  @media screen and (min-width: 1024px) {
1673
- .ilo--card--graphicpromo {
1487
+ .ilo--card__type__promo {
1674
1488
  padding: 3.4297963558rem 3.8585209003rem;
1675
1489
  }
1676
1490
  }
1677
- .ilo--card--graphicpromo.ilo--card--wide {
1678
- padding: 3.4297963558rem 3.8585209003rem;
1491
+ .ilo--card__type__promo.ilo--card__size__standard {
1492
+ --max-width: 33.9764201501rem;
1493
+ padding: 2.5723472669rem;
1679
1494
  }
1680
1495
  @media screen and (min-width: 610px) {
1681
- .ilo--card--graphicpromo.ilo--card--wide {
1682
- padding: 3.4297963558rem 3.8585209003rem;
1496
+ .ilo--card__type__promo.ilo--card__size__standard {
1497
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1683
1498
  }
1684
1499
  }
1685
1500
  @media screen and (min-width: 1024px) {
1686
- .ilo--card--graphicpromo.ilo--card--wide {
1687
- padding: 3.4297963558rem 3.8585209003rem;
1501
+ .ilo--card__type__promo.ilo--card__size__standard {
1502
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1688
1503
  }
1689
1504
  }
1690
- .ilo--card--graphicpromo.ilo--card--standard {
1691
- padding: 2.5723472669rem;
1505
+ .ilo--card__type__promo.ilo--card__size__standard.ilo--card__cornercut {
1506
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
1507
+ }
1508
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1509
+ --max-width: 49.3033226152rem;
1510
+ padding: 3.4297963558rem 3.8585209003rem;
1692
1511
  }
1693
1512
  @media screen and (min-width: 610px) {
1694
- .ilo--card--graphicpromo.ilo--card--standard {
1695
- padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem 2.5723472669rem;
1513
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1514
+ padding: 3.4297963558rem 3.8585209003rem;
1696
1515
  }
1697
1516
  }
1698
1517
  @media screen and (min-width: 1024px) {
1699
- .ilo--card--graphicpromo.ilo--card--standard {
1700
- padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem 2.5723472669rem;
1518
+ .ilo--card__type__promo.ilo--card__size__wide, .ilo--card__type__promo.ilo--card__size__fluid {
1519
+ padding: 3.4297963558rem 3.8585209003rem;
1701
1520
  }
1702
1521
  }
1703
- .ilo--card--graphicpromo.ilo--card--narrow {
1522
+ .ilo--card__type__promo.ilo--card__size__wide.ilo--card__cornercut, .ilo--card__type__promo.ilo--card__size__fluid.ilo--card__cornercut {
1523
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
1524
+ }
1525
+ .ilo--card__type__promo.ilo--card__size__narrow {
1526
+ --max-width: 18.3815648446rem;
1704
1527
  padding: 2.1436227224rem 1.2861736334rem;
1705
1528
  }
1706
1529
  @media screen and (min-width: 610px) {
1707
- .ilo--card--graphicpromo.ilo--card--narrow {
1530
+ .ilo--card__type__promo.ilo--card__size__narrow {
1708
1531
  padding: 2.1436227224rem 1.2861736334rem;
1709
1532
  }
1710
1533
  }
1711
1534
  @media screen and (min-width: 1024px) {
1712
- .ilo--card--graphicpromo.ilo--card--narrow {
1535
+ .ilo--card__type__promo.ilo--card__size__narrow {
1713
1536
  padding: 2.1436227224rem 1.2861736334rem;
1714
1537
  }
1715
1538
  }
1716
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1539
+ .ilo--card__type__promo.ilo--card__size__narrow.ilo--card__cornercut {
1540
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
1541
+ }
1542
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1717
1543
  font-size: 29.16px;
1718
1544
  letter-spacing: -0.035em;
1719
1545
  line-height: 36.45px;
1720
1546
  margin-bottom: 0.5741425509rem;
1721
1547
  }
1722
1548
  @media screen and (min-width: 610px) {
1723
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1549
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1724
1550
  font-size: 36.45px;
1725
1551
  letter-spacing: -0.035em;
1726
1552
  line-height: 43.74px;
1727
1553
  margin-bottom: 0.4278063594rem;
1728
1554
  }
1729
1555
  }
1730
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--intro {
1556
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--intro {
1731
1557
  font-size: 16px;
1732
1558
  letter-spacing: normal;
1733
1559
  line-height: 23.36px;
1734
1560
  margin-bottom: 1.910132288rem;
1735
1561
  }
1736
- .ilo--card--graphicpromo.ilo--card--light:not(:hover) .ilo--card--title {
1562
+ .ilo--card__type__promo.ilo--card__theme__light:not(:hover) .ilo--card--title {
1737
1563
  color: rgb(45, 45, 45);
1738
1564
  transition-property: color;
1739
1565
  transition-duration: 150ms;
1740
1566
  transition-timing-function: ease-out;
1741
1567
  }
1742
- .ilo--card--graphicpromo .ilo--card--title {
1568
+ .ilo--card__type__promo .ilo--card--title {
1743
1569
  font-size: 29.16px;
1744
1570
  letter-spacing: -0.035em;
1745
1571
  line-height: 36.45px;
1746
1572
  margin-bottom: 0.5741425509rem;
1747
1573
  }
1748
1574
  @media screen and (min-width: 610px) {
1749
- .ilo--card--graphicpromo .ilo--card--title {
1575
+ .ilo--card__type__promo .ilo--card--title {
1750
1576
  font-size: 36.45px;
1751
1577
  letter-spacing: -0.035em;
1752
1578
  line-height: 43.74px;
1753
1579
  margin-bottom: 0.8565309039rem;
1754
1580
  }
1755
1581
  }
1756
- .ilo--card--graphicpromo .ilo--card--intro {
1582
+ .ilo--card__type__promo .ilo--card--intro {
1757
1583
  font-size: 16px;
1758
1584
  letter-spacing: normal;
1759
1585
  line-height: 23.36px;
1760
1586
  margin-bottom: 1.910132288rem;
1761
1587
  }
1762
1588
  @media screen and (min-width: 610px) {
1763
- .ilo--card--graphicpromo .ilo--card--intro {
1589
+ .ilo--card__type__promo .ilo--card--intro {
1764
1590
  font-size: 18.66px;
1765
1591
  letter-spacing: normal;
1766
1592
  line-height: 27.24px;
1767
1593
  margin-bottom: 1.8685411561rem;
1768
1594
  }
1769
1595
  }
1770
- .ilo--card--factlist {
1771
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1772
- max-width: 45.8735262594rem;
1773
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1774
- pointer-events: none;
1775
- }
1776
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1777
- height: 40px;
1778
- top: -2.127545552rem;
1779
- width: calc(100% - 73px);
1780
- }
1781
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1782
- height: 40px;
1783
- top: -2.127545552rem;
1784
- width: 73.3px;
1785
- }
1786
- .ilo--card--factlist.ilo--card--dark {
1787
- background: rgb(35, 0, 80);
1788
- }
1789
- @media screen and (min-width: 1024px) {
1790
- .ilo--card--factlist {
1791
- padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1792
- }
1793
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1794
- height: 48px;
1795
- top: -2.5562700965rem;
1796
- width: calc(100% - 87px);
1797
- }
1798
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1799
- height: 48px;
1800
- top: -2.5562700965rem;
1801
- width: 87.3px;
1802
- }
1803
- }
1804
- .ilo--card--factlist.ilo--card--wide {
1805
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1596
+
1597
+ /**
1598
+ * Do not edit directly
1599
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1600
+ */
1601
+ /**
1602
+ * TOKENS:
1603
+ */
1604
+ /**
1605
+ * MAPS:
1606
+ */
1607
+ .ilo--card__type__multilink {
1608
+ --max-width: 28.7245444802rem;
1609
+ padding: 1.2861736334rem;
1806
1610
  }
1807
- @media screen and (min-width: 610px) {
1808
- .ilo--card--factlist.ilo--card--wide {
1809
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1810
- }
1611
+ .ilo--card__type__multilink .ilo--card--image--wrapper {
1612
+ display: none;
1811
1613
  }
1812
- .ilo--card--factlist.ilo--card--standard {
1813
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1614
+ .ilo--card__type__multilink .ilo--card--content .ilo--card--image--wrapper {
1615
+ display: block;
1814
1616
  }
1815
1617
  @media screen and (min-width: 610px) {
1816
- .ilo--card--factlist.ilo--card--standard {
1817
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1618
+ .ilo--card__type__multilink {
1619
+ padding: 2.1436227224rem;
1818
1620
  }
1819
1621
  }
1820
- .ilo--card--factlist.ilo--card--narrow {
1821
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1822
- }
1823
- @media screen and (min-width: 610px) {
1824
- .ilo--card--factlist.ilo--card--narrow {
1825
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1622
+ @media screen and (min-width: 1024px) {
1623
+ .ilo--card__type__multilink {
1624
+ padding: 3.0010718114rem 2.5723472669rem;
1826
1625
  }
1827
1626
  }
1828
- .ilo--card--factlist.ilo--card--dark {
1829
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1830
- }
1831
- .ilo--card--factlist.ilo--card--dark .ilo--card--title {
1832
- color: rgb(255, 255, 255);
1833
- transition-property: color;
1834
- transition-duration: 150ms;
1835
- transition-timing-function: ease-out;
1836
- }
1837
- .ilo--card--factlist.ilo--card--dark .ilo--list__item {
1838
- color: rgb(255, 255, 255);
1839
- }
1840
- .ilo--card--factlist.ilo--card--dark .ilo--list__item:last-of-type {
1841
- margin-bottom: 0;
1842
- }
1843
- .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 {
1844
- color: rgb(255, 255, 255);
1845
- transition-property: color;
1846
- transition-duration: 150ms;
1847
- transition-timing-function: ease-out;
1848
- }
1849
- .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 {
1850
- color: rgb(255, 255, 255);
1851
- }
1852
- .ilo--card--factlist .ilo--card--title {
1853
- color: rgb(45, 45, 45);
1627
+ .ilo--card__type__multilink .ilo--card--title {
1854
1628
  font-size: 23.32px;
1855
1629
  letter-spacing: -0.035em;
1856
1630
  line-height: 29.15px;
1857
- margin-bottom: 1.1476152197rem;
1631
+ margin-bottom: 0.7188906752rem;
1632
+ color: rgb(45, 45, 45);
1858
1633
  }
1859
- @media screen and (min-width: 1024px) {
1860
- .ilo--card--factlist .ilo--card--title {
1634
+ @media screen and (min-width: 610px) {
1635
+ .ilo--card__type__multilink .ilo--card--title {
1861
1636
  font-size: 29.16px;
1862
1637
  letter-spacing: -0.035em;
1863
1638
  line-height: 36.45px;
1864
- margin-bottom: 1.4315916399rem;
1639
+ margin-bottom: 0.5741425509rem;
1865
1640
  }
1866
1641
  }
1867
- .ilo--card--stat {
1868
- border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1869
- margin-top: 2.1436227224rem;
1870
- padding: 0 1.2861736334rem 2.1436227224rem 1.1789924973rem;
1871
- position: relative;
1872
- width: 100%;
1873
- }
1874
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1875
- left: 0;
1876
- top: -2.127545552rem;
1877
- }
1878
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1879
- left: auto;
1880
- right: 0;
1881
- }
1882
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1883
- right: 0;
1884
- top: -2.127545552rem;
1885
- }
1886
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1887
- left: 0;
1888
- right: auto;
1889
- transform: rotateY(180deg);
1890
- }
1891
- .ilo--card--stat.ilo--card--blue {
1892
- background: rgb(235, 245, 253);
1893
- }
1894
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1895
- background: inherit;
1896
- content: "";
1897
- display: block;
1898
- height: 40px;
1899
- position: absolute;
1900
- width: calc(100% - 73px);
1901
- }
1902
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1903
- 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");
1904
- background-position: bottom right;
1905
- background-size: cover;
1906
- content: "";
1907
- height: 40px;
1908
- display: block;
1909
- position: absolute;
1910
- width: 73.4px;
1642
+ .ilo--card__type__multilink .ilo--card--intro {
1643
+ font-size: 16px;
1644
+ letter-spacing: normal;
1645
+ line-height: 23.36px;
1646
+ margin-bottom: 1.910132288rem;
1647
+ color: rgb(45, 45, 45);
1911
1648
  }
1912
- .ilo--card--stat.ilo--card--yellow {
1913
- background: rgb(255, 205, 45);
1649
+ @media screen and (min-width: 610px) {
1650
+ .ilo--card__type__multilink .ilo--card--intro {
1651
+ font-size: 18.66px;
1652
+ letter-spacing: normal;
1653
+ line-height: 27.24px;
1654
+ margin-bottom: 1.8685411561rem;
1655
+ }
1914
1656
  }
1915
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1916
- background: inherit;
1917
- content: "";
1918
- display: block;
1919
- height: 40px;
1920
- position: absolute;
1921
- width: calc(100% - 73px);
1657
+ .ilo--card__type__multilink.ilo--card__size__standard {
1658
+ --max-width: 28.7245444802rem;
1659
+ padding: 2.5723472669rem 2.1436227224rem;
1922
1660
  }
1923
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1924
- 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");
1925
- background-position: bottom right;
1926
- background-size: cover;
1927
- content: "";
1928
- height: 40px;
1929
- display: block;
1930
- position: absolute;
1931
- width: 73.4px;
1661
+ @media screen and (min-width: 610px) {
1662
+ .ilo--card__type__multilink.ilo--card__size__standard {
1663
+ padding: 2.5723472669rem 2.1436227224rem;
1664
+ }
1932
1665
  }
1933
- .ilo--card--stat.ilo--card--green {
1934
- background: rgb(140, 225, 100);
1666
+ @media screen and (min-width: 1024px) {
1667
+ .ilo--card__type__multilink.ilo--card__size__standard {
1668
+ padding: 2.5723472669rem 2.1436227224rem;
1669
+ }
1935
1670
  }
1936
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1937
- background: inherit;
1938
- content: "";
1939
- display: block;
1940
- height: 40px;
1941
- position: absolute;
1942
- width: calc(100% - 73px);
1671
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1672
+ --max-width: 20.0964630225rem;
1673
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1943
1674
  }
1944
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1945
- 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");
1946
- background-position: bottom right;
1947
- background-size: cover;
1948
- content: "";
1949
- height: 40px;
1950
- display: block;
1951
- position: absolute;
1952
- width: 73.4px;
1675
+ @media screen and (min-width: 610px) {
1676
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1677
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1678
+ }
1953
1679
  }
1954
- .ilo--card--stat.ilo--card--turquoise {
1955
- background: rgb(5, 210, 210);
1680
+ @media screen and (min-width: 1024px) {
1681
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1682
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1683
+ }
1956
1684
  }
1957
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1958
- background: inherit;
1959
- content: "";
1960
- display: block;
1961
- height: 40px;
1962
- position: absolute;
1963
- width: calc(100% - 73px);
1685
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--image--wrapper {
1686
+ display: none;
1964
1687
  }
1965
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1966
- 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");
1967
- background-position: bottom right;
1968
- background-size: cover;
1969
- content: "";
1970
- height: 40px;
1688
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--content .ilo--card--image--wrapper {
1971
1689
  display: block;
1972
- position: absolute;
1973
- width: 73.4px;
1690
+ margin-bottom: 1.2861736334rem;
1974
1691
  }
1975
- .ilo--card--stat .ilo--card--content {
1976
- display: flex;
1977
- flex-wrap: wrap;
1978
- height: 100%;
1692
+ @media screen and (min-width: 610px) {
1693
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--title {
1694
+ font-size: 23.32px;
1695
+ letter-spacing: -0.035em;
1696
+ line-height: 29.15px;
1697
+ margin-bottom: 0.7188906752rem;
1698
+ }
1979
1699
  }
1980
- .right-to-left .ilo--card--stat .ilo--card--content {
1981
- flex-direction: row-reverse;
1700
+ @media screen and (min-width: 610px) {
1701
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--intro {
1702
+ font-size: 16px;
1703
+ letter-spacing: normal;
1704
+ line-height: 23.36px;
1705
+ margin-bottom: 1.910132288rem;
1706
+ }
1982
1707
  }
1983
- .ilo--card--stat .ilo--card--title {
1984
- color: rgb(35, 0, 80);
1985
- font-size: 36.45px;
1986
- letter-spacing: -0.035em;
1987
- line-height: 43.74px;
1988
- margin-bottom: 0.4278063594rem;
1989
- width: 100%;
1708
+ .ilo--card__type__multilink.ilo--card__size__wide, .ilo--card__type__multilink.ilo--card__size__fluid {
1709
+ --max-width: 59.1639871383rem;
1710
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1990
1711
  }
1991
- .ilo--card--stat .ilo--card--intro {
1992
- color: rgb(35, 0, 80);
1993
- font-family: Overpass;
1994
- font-size: 18.66px;
1995
- letter-spacing: normal;
1996
- line-height: 27.24px;
1997
- margin-bottom: 1.6734954235rem;
1998
- width: 100%;
1712
+ @media screen and (min-width: 610px) {
1713
+ .ilo--card__type__multilink.ilo--card__size__wide, .ilo--card__type__multilink.ilo--card__size__fluid {
1714
+ padding: 3.0010718114rem 2.5723472669rem;
1715
+ }
1716
+ .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 {
1717
+ flex-direction: row-reverse;
1718
+ }
1719
+ .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 {
1720
+ flex-direction: row;
1721
+ }
1722
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--wrap, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--wrap {
1723
+ display: flex;
1724
+ column-gap: 1.7148981779rem;
1725
+ }
1726
+ .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 {
1727
+ flex-direction: row-reverse;
1728
+ }
1729
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--image--wrapper, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--image--wrapper {
1730
+ display: block;
1731
+ width: 50%;
1732
+ }
1733
+ .ilo--card__type__multilink.ilo--card__size__wide .ilo--card--content, .ilo--card__type__multilink.ilo--card__size__fluid .ilo--card--content {
1734
+ width: 50%;
1735
+ }
1736
+ .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 {
1737
+ display: none;
1738
+ }
1999
1739
  }
2000
- .ilo--card--stat .ilo--link {
2001
- font-size: 11.94px;
2002
- letter-spacing: -0.02em;
2003
- line-height: 16.24px;
2004
- align-self: flex-end;
1740
+ .ilo--card__type__multilink .ilo--link-list {
1741
+ margin-top: 1.8756698821rem;
1742
+ position: relative;
1743
+ z-index: 3;
2005
1744
  }
2006
- .ilo--card--data {
1745
+
1746
+ /**
1747
+ * Do not edit directly
1748
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1749
+ */
1750
+ /**
1751
+ * TOKENS:
1752
+ */
1753
+ /**
1754
+ * MAPS:
1755
+ */
1756
+ .ilo--card__type__data {
1757
+ --max-width: 16.1307609861rem;
2007
1758
  background: rgb(235, 245, 253);
2008
1759
  border-bottom: 0.1607717042rem solid #82afdc;
2009
1760
  margin-top: 2.1436227224rem;
2010
- max-width: 32.154340836rem;
2011
- padding: 0 1.2861736334rem 3.0010718114rem;
1761
+ padding: 1.2861736334rem 3.0010718114rem;
2012
1762
  position: relative;
1763
+ width: 100%;
2013
1764
  }
2014
- .ilo--card--data::before {
2015
- background: inherit;
2016
- content: "";
2017
- display: block;
2018
- height: 40px;
2019
- position: absolute;
2020
- width: calc(100% - 73px);
2021
- }
2022
- .ilo--card--data::after {
2023
- 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");
2024
- background-position: bottom right;
2025
- background-size: cover;
2026
- content: "";
2027
- height: 40px;
2028
- display: block;
2029
- position: absolute;
2030
- width: 73.4px;
2031
- }
2032
- .ilo--card--data:hover, .ilo--card--data:focus, .ilo--card--data:focus-within {
1765
+ .ilo--card__type__data:hover, .ilo--card__type__data:focus, .ilo--card__type__data:focus-within {
2033
1766
  background: rgb(235, 245, 253);
2034
1767
  }
2035
- .ilo--card--data::before {
2036
- left: 0;
2037
- top: -2.127545552rem;
2038
- }
2039
- .right-to-left .ilo--card--data::before {
2040
- left: auto;
2041
- right: 0;
2042
- }
2043
- .ilo--card--data::after {
2044
- right: 0;
2045
- top: -2.127545552rem;
2046
- }
2047
- .right-to-left .ilo--card--data::after {
2048
- left: 0;
2049
- right: auto;
2050
- transform: rotateY(180deg);
1768
+ .ilo--card__type__data.ilo--card__size__narrow {
1769
+ --max-width: 16.1307609861rem;
1770
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2051
1771
  }
2052
- @media screen and (min-width: 610px) {
2053
- .ilo--card--data::before {
2054
- background: inherit;
2055
- content: "";
2056
- display: block;
2057
- height: 48px;
2058
- position: absolute;
2059
- width: calc(100% - 84px);
2060
- }
2061
- .ilo--card--data::after {
2062
- 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");
2063
- background-position: bottom right;
2064
- background-size: cover;
2065
- content: "";
2066
- height: 48px;
2067
- display: block;
2068
- position: absolute;
2069
- width: 84.4px;
2070
- }
2071
- .ilo--card--data::before {
2072
- top: -2.5562700965rem;
2073
- }
2074
- .ilo--card--data::after {
2075
- top: -2.5562700965rem;
2076
- }
1772
+ .ilo--card__type__data.ilo--card__size__wide, .ilo--card__type__data.ilo--card__size__fluid {
1773
+ --max-width: 32.154340836rem;
1774
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
2077
1775
  }
2078
- .ilo--card--data .ilo--card--image--wrapper {
2079
- display: none;
1776
+ .ilo--card__type__data .ilo--card--image--wrapper {
2080
1777
  width: max(10.9860664523rem, 50%);
2081
1778
  }
2082
- .ilo--card--data .ilo--card--content .ilo--card--image--wrapper {
2083
- display: block;
2084
- }
2085
- .ilo--card--data--content-label {
1779
+ .ilo--card__type__data--content-label {
2086
1780
  font-size: 14.93px;
2087
1781
  letter-spacing: normal;
2088
1782
  line-height: 20.3px;
2089
1783
  margin-bottom: 0.6540478038rem;
2090
1784
  color: rgb(109, 109, 109);
2091
1785
  }
2092
- .ilo--card--data--content-copy {
1786
+ .ilo--card__type__data--content-copy {
2093
1787
  font-size: 23.32px;
2094
1788
  letter-spacing: -0.035em;
2095
1789
  line-height: 29.15px;
@@ -2098,175 +1792,161 @@
2098
1792
  font-family: Overpass;
2099
1793
  font-weight: 500;
2100
1794
  }
2101
- .ilo--card--data--content-files {
1795
+ .ilo--card__type__data--content-files {
2102
1796
  margin-bottom: 2.1436227224rem;
2103
1797
  }
2104
- .ilo--card--data .ilo--link {
1798
+ .ilo--card__type__data .ilo--link {
2105
1799
  font-size: 18.66px;
2106
1800
  letter-spacing: -0.035em;
2107
1801
  line-height: 24.26px;
2108
1802
  }
2109
- .ilo--card--data--file {
1803
+ .ilo--card__type__data--file {
2110
1804
  margin: 0.2143622722rem 0.4287245445rem 0.2143622722rem 0;
2111
1805
  }
2112
- .ilo--card--data--file:last-of-type {
1806
+ .ilo--card__type__data--file:last-of-type {
2113
1807
  margin-right: 0;
2114
1808
  }
2115
- .ilo--card--feature {
2116
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2117
- display: flex;
2118
- margin-top: 0;
1809
+
1810
+ /**
1811
+ * Do not edit directly
1812
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1813
+ */
1814
+ /**
1815
+ * TOKENS:
1816
+ */
1817
+ /**
1818
+ * MAPS:
1819
+ */
1820
+ .ilo--card__type__stat {
1821
+ --max-width: 18.3815648446rem;
1822
+ border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1823
+ padding: 1.2861736334rem 2.1436227224rem 1.1789924973rem;
2119
1824
  position: relative;
1825
+ width: 100%;
1826
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2120
1827
  }
2121
- .ilo--card--feature::before {
2122
- display: none;
1828
+ .ilo--card__type__stat.ilo--card__color__blue {
1829
+ background: rgb(235, 245, 253);
2123
1830
  }
2124
- .ilo--card--feature.ilo--card--dark {
2125
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1831
+ .ilo--card__type__stat.ilo--card__color__yellow {
1832
+ background: rgb(255, 205, 45);
2126
1833
  }
2127
- .ilo--card--feature.ilo--card--dark .ilo--link-list {
2128
- border-top: 2px solid rgba(237, 240, 242, 0.25);
1834
+ .ilo--card__type__stat.ilo--card__color__green {
1835
+ background: rgb(140, 225, 100);
2129
1836
  }
2130
- .ilo--card--feature.ilo--card--dark .ilo--link-list--link {
2131
- color: rgb(255, 255, 255);
2132
- 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");
1837
+ .ilo--card__type__stat.ilo--card__color__turquoise {
1838
+ background: rgb(5, 210, 210);
2133
1839
  }
2134
- .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 {
2135
- color: rgb(30, 45, 190);
2136
- 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");
1840
+ .ilo--card__type__stat .ilo--card--content {
1841
+ display: flex;
1842
+ flex-wrap: wrap;
1843
+ height: 100%;
2137
1844
  }
2138
- .ilo--card--feature picture::before {
2139
- transition-property: opacity;
2140
- transition-duration: 150ms;
2141
- transition-timing-function: ease-out;
1845
+ .right-to-left .ilo--card__type__stat .ilo--card--content {
1846
+ flex-direction: row-reverse;
2142
1847
  }
2143
- .ilo--card--feature:hover, .ilo--card--feature:focus, .ilo--card--feature:focus-within {
2144
- background-color: rgb(255, 255, 255);
2145
- 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));
2146
- border-bottom: 0.1607717042rem solid rgb(30, 45, 190);
1848
+ .ilo--card__type__stat .ilo--card--title {
1849
+ color: rgb(35, 0, 80);
1850
+ font-size: 36.45px;
1851
+ letter-spacing: -0.035em;
1852
+ line-height: 43.74px;
1853
+ margin-bottom: 0.4278063594rem;
1854
+ width: 100%;
2147
1855
  }
2148
- .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before, .ilo--card--feature:focus-within picture::before {
2149
- opacity: 0.4;
2150
- z-index: 1;
2151
- transition-property: opacity;
2152
- transition-duration: 150ms;
2153
- transition-timing-function: ease-out;
1856
+ .ilo--card__type__stat .ilo--card--intro {
1857
+ color: rgb(35, 0, 80);
1858
+ font-family: Overpass;
1859
+ font-size: 18.66px;
1860
+ letter-spacing: normal;
1861
+ line-height: 27.24px;
1862
+ margin-bottom: 1.6734954235rem;
1863
+ width: 100%;
2154
1864
  }
2155
- .ilo--card--feature:hover .ilo--card--image, .ilo--card--feature:focus .ilo--card--image, .ilo--card--feature:focus-within .ilo--card--image {
2156
- filter: saturate(0);
1865
+ .ilo--card__type__stat .ilo--link {
1866
+ font-size: 11.94px;
1867
+ letter-spacing: -0.02em;
1868
+ line-height: 16.24px;
1869
+ align-self: flex-end;
2157
1870
  }
2158
- .ilo--card--feature .ilo--link-list {
2159
- border-top: 0.1071811361rem solid rgb(237, 240, 242);
2160
- margin-left: -1.2861736334rem;
2161
- margin-right: -1.2861736334rem;
2162
- margin-top: 1.822079314rem;
2163
- position: relative;
2164
- z-index: 2;
1871
+
1872
+ /**
1873
+ * Do not edit directly
1874
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
1875
+ */
1876
+ /**
1877
+ * TOKENS:
1878
+ */
1879
+ /**
1880
+ * MAPS:
1881
+ */
1882
+ .ilo--card__type__factlist {
1883
+ --max-width: 20.0964630225rem;
1884
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1885
+ padding: 1.2861736334rem 2.5723472669rem;
1886
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2165
1887
  }
2166
- .ilo--card--feature .ilo--link-list--link, .ilo--card--feature .ilo--link-list--link:hover {
2167
- border-bottom: none;
2168
- padding-left: 1.2861736334rem;
2169
- padding-right: 1.2861736334rem;
1888
+ @media screen and (min-width: 1024px) {
1889
+ .ilo--card__type__factlist {
1890
+ padding: 2.1436227224rem 3.0010718114rem;
1891
+ }
2170
1892
  }
2171
- .ilo--card--feature.ilo--card--narrow .ilo--card--wrap, .ilo--card--feature.ilo--card--standard .ilo--card--wrap {
2172
- display: flex;
2173
- flex-wrap: wrap;
2174
- width: 100%;
1893
+ .ilo--card__type__factlist.ilo--card__size__wide {
1894
+ --max-width: 45.8735262594rem;
1895
+ padding: 2.1436227224rem 2.7867095391rem;
2175
1896
  }
2176
- .ilo--card--feature.ilo--card--narrow .ilo--card--content, .ilo--card--feature.ilo--card--standard .ilo--card--content {
2177
- width: 100%;
1897
+ @media screen and (min-width: 610px) {
1898
+ .ilo--card__type__factlist.ilo--card__size__wide {
1899
+ padding: 2.1436227224rem 3.2154340836rem;
1900
+ clip-path: polygon(0 0, calc(100% - 87px) 0, 100% 48px, 100% 100%, 0 100%);
1901
+ }
2178
1902
  }
2179
- .ilo--card--feature.ilo--card--narrow .ilo--card--image--wrapper, .ilo--card--feature.ilo--card--standard .ilo--card--image--wrapper {
2180
- width: 100%;
1903
+ .ilo--card__type__factlist.ilo--card__size__narrow {
1904
+ --max-width: 20.0964630225rem;
1905
+ padding: 1.2861736334rem 2.5723472669rem;
1906
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2181
1907
  }
2182
1908
  @media screen and (min-width: 610px) {
2183
- .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2184
- flex-direction: row;
2185
- }
2186
- .right-to-left .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2187
- flex-direction: row-reverse;
2188
- }
2189
- .ilo--card--feature.ilo--card--wide .ilo--card--content {
2190
- display: flex;
2191
- flex-direction: row;
2192
- flex-wrap: wrap;
2193
- position: relative;
2194
- width: 50%;
2195
- }
2196
- .ilo--card--feature.ilo--card--wide .ilo--card--image--wrapper {
2197
- width: 50%;
2198
- }
2199
- .ilo--card--feature.ilo--card--wide .ilo--card--image {
2200
- object-fit: cover;
2201
- }
2202
- .ilo--card--feature.ilo--card--wide .ilo--card--date {
2203
- align-self: flex-end;
2204
- width: 100%;
2205
- }
2206
- .ilo--card--feature.ilo--card--wide .ilo--card--eyebrow {
2207
- width: 100%;
2208
- }
2209
- .ilo--card--feature.ilo--card--wide .ilo--card--title {
2210
- width: 100%;
2211
- }
2212
- .ilo--card--feature.ilo--card--wide .ilo--link-list {
2213
- width: calc(100% + 48px);
1909
+ .ilo--card__type__factlist.ilo--card__size__narrow {
1910
+ padding: 1.2861736334rem 2.5723472669rem;
2214
1911
  }
2215
1912
  }
2216
- .ilo--card--feature .ilo--card--wrap {
2217
- display: flex;
2218
- flex-direction: column;
2219
- width: 100%;
1913
+ .ilo--card__type__factlist.ilo--card__theme__dark {
1914
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
2220
1915
  }
2221
- .ilo--card--feature picture {
2222
- display: flex;
2223
- height: 100%;
2224
- position: relative;
1916
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--card--title {
1917
+ color: rgb(255, 255, 255);
2225
1918
  }
2226
- .ilo--card--feature picture::before {
2227
- background-color: rgb(30, 45, 190);
2228
- content: "";
2229
- display: block;
2230
- height: 100%;
2231
- left: 0;
2232
- opacity: 0;
2233
- position: absolute;
2234
- top: 0;
2235
- transition: opacity 150ms ease-in-out;
2236
- width: 100%;
2237
- z-index: -1;
1919
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item {
1920
+ color: rgb(255, 255, 255);
2238
1921
  }
2239
- .ilo--card--feature .ilo--card--content {
2240
- display: flex;
2241
- flex: 1 1 auto;
2242
- flex-direction: column;
2243
- padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
1922
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item:last-of-type {
1923
+ margin-bottom: 0;
2244
1924
  }
2245
- .ilo--card--feature.ilo--card--linklist .ilo--card--content {
2246
- padding-bottom: 0;
1925
+ .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 {
1926
+ color: rgb(255, 255, 255);
2247
1927
  }
2248
- .ilo--card--feature .ilo--card--title {
1928
+ .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 {
1929
+ color: rgb(255, 255, 255);
1930
+ }
1931
+ .ilo--card__type__factlist .ilo--card--title {
1932
+ color: rgb(45, 45, 45);
2249
1933
  font-size: 23.32px;
2250
1934
  letter-spacing: -0.035em;
2251
1935
  line-height: 29.15px;
2252
- margin-bottom: 1.5763397642rem;
2253
- font-family: Overpass;
2254
- font-weight: 700;
2255
- }
2256
- .ilo--card--feature .ilo--card--eyebrow {
2257
- font-size: 14.93px;
2258
- letter-spacing: normal;
2259
- line-height: 19.71px;
2260
- margin-bottom: 0.3376482577rem;
1936
+ margin-bottom: 1.1476152197rem;
2261
1937
  }
2262
- .ilo--card--feature .ilo--card--date {
2263
- margin-bottom: 0;
2264
- margin-top: auto;
1938
+ @media screen and (min-width: 1024px) {
1939
+ .ilo--card__type__factlist .ilo--card--title {
1940
+ font-size: 29.16px;
1941
+ letter-spacing: -0.035em;
1942
+ line-height: 36.45px;
1943
+ margin-bottom: 1.4315916399rem;
1944
+ }
2265
1945
  }
2266
1946
 
2267
1947
  /**
2268
1948
  * Do not edit directly
2269
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
1949
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2270
1950
  */
2271
1951
  /**
2272
1952
  * TOKENS:
@@ -2274,34 +1954,29 @@
2274
1954
  /**
2275
1955
  * MAPS:
2276
1956
  */
1957
+ .ilo--cardgroup__collapsed .ilo--cardgroup--inner {
1958
+ gap: 0;
1959
+ }
1960
+ .ilo--cardgroup__justify__start .ilo--cardgroup--inner {
1961
+ justify-content: flex-start;
1962
+ }
1963
+ .ilo--cardgroup__justify__between .ilo--cardgroup--inner {
1964
+ justify-content: space-between;
1965
+ }
1966
+ .ilo--cardgroup__justify__center .ilo--cardgroup--inner {
1967
+ justify-content: center;
1968
+ }
2277
1969
  .ilo--cardgroup--inner {
2278
1970
  display: flex;
2279
- flex-wrap: wrap;
2280
- justify-content: space-between;
1971
+ flex-flow: row wrap;
1972
+ justify-content: center;
2281
1973
  margin: auto;
2282
- row-gap: 1.7148981779rem;
1974
+ gap: 1.7148981779rem;
1975
+ width: 100%;
2283
1976
  }
2284
1977
  .right-to-left .ilo--cardgroup--inner {
2285
1978
  flex-direction: row-reverse;
2286
1979
  }
2287
- .ilo--cardgroup--inner .ilo--card {
2288
- width: 100%;
2289
- }
2290
- @media screen and (min-width: 1024px) {
2291
- .ilo--cardgroup--two .ilo--card {
2292
- width: calc(50% - 24px);
2293
- }
2294
- }
2295
- @media screen and (min-width: 1024px) {
2296
- .ilo--cardgroup--three .ilo--card {
2297
- width: calc(33.333% - 24px);
2298
- }
2299
- }
2300
- @media screen and (min-width: 1024px) {
2301
- .ilo--cardgroup--four .ilo--card {
2302
- width: calc(25% - 24px);
2303
- }
2304
- }
2305
1980
  .ilo--cardgroup--button-wrap {
2306
1981
  display: flex;
2307
1982
  justify-content: center;
@@ -2311,7 +1986,7 @@
2311
1986
 
2312
1987
  /**
2313
1988
  * Do not edit directly
2314
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
1989
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2315
1990
  */
2316
1991
  /**
2317
1992
  * TOKENS:
@@ -2416,7 +2091,7 @@
2416
2091
 
2417
2092
  /**
2418
2093
  * Do not edit directly
2419
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2094
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2420
2095
  */
2421
2096
  /**
2422
2097
  * TOKENS:
@@ -2497,7 +2172,7 @@
2497
2172
 
2498
2173
  /**
2499
2174
  * Do not edit directly
2500
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2175
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2501
2176
  */
2502
2177
  /**
2503
2178
  * TOKENS:
@@ -2507,7 +2182,7 @@
2507
2182
  */
2508
2183
  /**
2509
2184
  * Do not edit directly
2510
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2185
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2511
2186
  */
2512
2187
  /**
2513
2188
  * TOKENS:
@@ -2517,7 +2192,7 @@
2517
2192
  */
2518
2193
  /**
2519
2194
  * Do not edit directly
2520
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2195
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2521
2196
  */
2522
2197
  /**
2523
2198
  * TOKENS:
@@ -2527,7 +2202,7 @@
2527
2202
  */
2528
2203
  /**
2529
2204
  * Do not edit directly
2530
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2205
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2531
2206
  */
2532
2207
  /**
2533
2208
  * TOKENS:
@@ -2653,7 +2328,7 @@
2653
2328
 
2654
2329
  /**
2655
2330
  * Do not edit directly
2656
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2331
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2657
2332
  */
2658
2333
  /**
2659
2334
  * TOKENS:
@@ -2681,7 +2356,7 @@
2681
2356
 
2682
2357
  /**
2683
2358
  * Do not edit directly
2684
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2359
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2685
2360
  */
2686
2361
  /**
2687
2362
  * TOKENS:
@@ -2769,7 +2444,7 @@
2769
2444
 
2770
2445
  /**
2771
2446
  * Do not edit directly
2772
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2447
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2773
2448
  */
2774
2449
  /**
2775
2450
  * TOKENS:
@@ -2779,7 +2454,7 @@
2779
2454
  */
2780
2455
  /**
2781
2456
  * Do not edit directly
2782
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2457
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2783
2458
  */
2784
2459
  /**
2785
2460
  * TOKENS:
@@ -2789,7 +2464,7 @@
2789
2464
  */
2790
2465
  /**
2791
2466
  * Do not edit directly
2792
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2467
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2793
2468
  */
2794
2469
  /**
2795
2470
  * TOKENS:
@@ -2842,7 +2517,7 @@
2842
2517
 
2843
2518
  /**
2844
2519
  * Do not edit directly
2845
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2520
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2846
2521
  */
2847
2522
  /**
2848
2523
  * TOKENS:
@@ -2917,7 +2592,7 @@
2917
2592
 
2918
2593
  /**
2919
2594
  * Do not edit directly
2920
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2595
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2921
2596
  */
2922
2597
  /**
2923
2598
  * TOKENS:
@@ -3023,7 +2698,7 @@
3023
2698
 
3024
2699
  /**
3025
2700
  * Do not edit directly
3026
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2701
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3027
2702
  */
3028
2703
  /**
3029
2704
  * TOKENS:
@@ -3046,7 +2721,7 @@
3046
2721
 
3047
2722
  /**
3048
2723
  * Do not edit directly
3049
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2724
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3050
2725
  */
3051
2726
  /**
3052
2727
  * TOKENS:
@@ -3060,7 +2735,7 @@
3060
2735
 
3061
2736
  /**
3062
2737
  * Do not edit directly
3063
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2738
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3064
2739
  */
3065
2740
  /**
3066
2741
  * TOKENS:
@@ -3070,7 +2745,7 @@
3070
2745
  */
3071
2746
  /**
3072
2747
  * Do not edit directly
3073
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2748
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3074
2749
  */
3075
2750
  /**
3076
2751
  * TOKENS:
@@ -3095,7 +2770,7 @@
3095
2770
  }
3096
2771
  /**
3097
2772
  * Do not edit directly
3098
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
2773
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3099
2774
  */
3100
2775
  /**
3101
2776
  * TOKENS:
@@ -3419,7 +3094,7 @@
3419
3094
 
3420
3095
  /**
3421
3096
  * Do not edit directly
3422
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3097
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3423
3098
  */
3424
3099
  /**
3425
3100
  * TOKENS:
@@ -3542,7 +3217,7 @@
3542
3217
 
3543
3218
  /**
3544
3219
  * Do not edit directly
3545
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3220
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3546
3221
  */
3547
3222
  /**
3548
3223
  * TOKENS:
@@ -3748,7 +3423,7 @@
3748
3423
 
3749
3424
  /**
3750
3425
  * Do not edit directly
3751
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3426
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3752
3427
  */
3753
3428
  /**
3754
3429
  * TOKENS:
@@ -3759,7 +3434,7 @@
3759
3434
  .ilo--hero-card {
3760
3435
  height: 100%;
3761
3436
  position: relative;
3762
- padding: 39px 16px;
3437
+ padding: 40px 16px;
3763
3438
  }
3764
3439
  @media screen and (min-width: 1024px) {
3765
3440
  .ilo--hero-card {
@@ -3804,12 +3479,7 @@
3804
3479
  }
3805
3480
  }
3806
3481
  .ilo--hero-card__cornercut {
3807
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 39px, 100% 100%, 0 100%);
3808
- }
3809
- @media screen and (min-width: 1024px) {
3810
- .ilo--hero-card__cornercut {
3811
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 64px, 100% 100%, 0 100%);
3812
- }
3482
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
3813
3483
  }
3814
3484
  .ilo--hero-card--datecopy {
3815
3485
  font-size: 16px;
@@ -3874,7 +3544,7 @@
3874
3544
 
3875
3545
  /**
3876
3546
  * Do not edit directly
3877
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3547
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3878
3548
  */
3879
3549
  /**
3880
3550
  * TOKENS:
@@ -3930,7 +3600,7 @@
3930
3600
 
3931
3601
  /**
3932
3602
  * Do not edit directly
3933
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3603
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3934
3604
  */
3935
3605
  /**
3936
3606
  * TOKENS:
@@ -4072,7 +3742,7 @@
4072
3742
 
4073
3743
  /**
4074
3744
  * Do not edit directly
4075
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3745
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4076
3746
  */
4077
3747
  /**
4078
3748
  * TOKENS:
@@ -4082,7 +3752,7 @@
4082
3752
  */
4083
3753
  /**
4084
3754
  * Do not edit directly
4085
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3755
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4086
3756
  */
4087
3757
  /**
4088
3758
  * TOKENS:
@@ -4107,7 +3777,7 @@
4107
3777
  }
4108
3778
  /**
4109
3779
  * Do not edit directly
4110
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3780
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4111
3781
  */
4112
3782
  /**
4113
3783
  * TOKENS:
@@ -4265,7 +3935,7 @@
4265
3935
 
4266
3936
  /**
4267
3937
  * Do not edit directly
4268
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
3938
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4269
3939
  */
4270
3940
  /**
4271
3941
  * TOKENS:
@@ -4360,7 +4030,7 @@
4360
4030
 
4361
4031
  /**
4362
4032
  * Do not edit directly
4363
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
4033
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4364
4034
  */
4365
4035
  /**
4366
4036
  * TOKENS:
@@ -4370,7 +4040,7 @@
4370
4040
  */
4371
4041
  /**
4372
4042
  * Do not edit directly
4373
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
4043
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4374
4044
  */
4375
4045
  /**
4376
4046
  * TOKENS:
@@ -4380,7 +4050,7 @@
4380
4050
  */
4381
4051
  /**
4382
4052
  * Do not edit directly
4383
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
4053
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4384
4054
  */
4385
4055
  /**
4386
4056
  * TOKENS:
@@ -4551,7 +4221,54 @@
4551
4221
 
4552
4222
  /**
4553
4223
  * Do not edit directly
4554
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
4224
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4225
+ */
4226
+ /**
4227
+ * TOKENS:
4228
+ */
4229
+ /**
4230
+ * MAPS:
4231
+ */
4232
+ .ilo--logo-grid--logos {
4233
+ display: flex;
4234
+ flex-flow: row wrap;
4235
+ grid-gap: 0.857449089rem;
4236
+ }
4237
+ .ilo--logo-grid--link {
4238
+ text-decoration: none;
4239
+ transition: background-color 0.2s ease-in-out;
4240
+ }
4241
+ .ilo--logo-grid__theme__light .ilo--logo-grid--link:hover, .ilo--logo-grid__theme__dark .ilo--logo-grid--link:hover {
4242
+ background-color: rgb(235, 245, 253);
4243
+ }
4244
+ .ilo--logo-grid--item {
4245
+ display: flex;
4246
+ align-items: center;
4247
+ justify-content: center;
4248
+ height: 7.18113612rem;
4249
+ flex: 100%;
4250
+ }
4251
+ @media screen and (min-width: 414px) {
4252
+ .ilo--logo-grid--item {
4253
+ flex: 0 0 12.7545551983rem;
4254
+ }
4255
+ }
4256
+ .ilo--logo-grid__theme__light .ilo--logo-grid--item {
4257
+ background-color: rgb(237, 240, 242);
4258
+ }
4259
+ .ilo--logo-grid__theme__dark .ilo--logo-grid--item {
4260
+ background-color: rgb(255, 255, 255);
4261
+ }
4262
+ .ilo--logo-grid--item img {
4263
+ width: auto;
4264
+ height: auto;
4265
+ max-width: 8.038585209rem;
4266
+ max-height: 2.679528403rem;
4267
+ }
4268
+
4269
+ /**
4270
+ * Do not edit directly
4271
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4555
4272
  */
4556
4273
  /**
4557
4274
  * TOKENS:
@@ -4561,7 +4278,7 @@
4561
4278
  */
4562
4279
  /**
4563
4280
  * Do not edit directly
4564
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
4281
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4565
4282
  */
4566
4283
  /**
4567
4284
  * TOKENS:
@@ -4571,7 +4288,7 @@
4571
4288
  */
4572
4289
  /**
4573
4290
  * Do not edit directly
4574
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
4291
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4575
4292
  */
4576
4293
  /**
4577
4294
  * TOKENS:
@@ -4668,7 +4385,7 @@
4668
4385
 
4669
4386
  /**
4670
4387
  * Do not edit directly
4671
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
4388
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4672
4389
  */
4673
4390
  /**
4674
4391
  * TOKENS:
@@ -5558,7 +5275,7 @@
5558
5275
 
5559
5276
  /**
5560
5277
  * Do not edit directly
5561
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5278
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5562
5279
  */
5563
5280
  /**
5564
5281
  * TOKENS:
@@ -5568,7 +5285,7 @@
5568
5285
  */
5569
5286
  /**
5570
5287
  * Do not edit directly
5571
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5288
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5572
5289
  */
5573
5290
  /**
5574
5291
  * TOKENS:
@@ -5578,7 +5295,7 @@
5578
5295
  */
5579
5296
  /**
5580
5297
  * Do not edit directly
5581
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5298
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5582
5299
  */
5583
5300
  /**
5584
5301
  * TOKENS:
@@ -5770,7 +5487,7 @@
5770
5487
 
5771
5488
  /**
5772
5489
  * Do not edit directly
5773
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5490
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5774
5491
  */
5775
5492
  /**
5776
5493
  * TOKENS:
@@ -5910,7 +5627,7 @@
5910
5627
 
5911
5628
  /**
5912
5629
  * Do not edit directly
5913
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5630
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5914
5631
  */
5915
5632
  /**
5916
5633
  * TOKENS:
@@ -5920,7 +5637,7 @@
5920
5637
  */
5921
5638
  /**
5922
5639
  * Do not edit directly
5923
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5640
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5924
5641
  */
5925
5642
  /**
5926
5643
  * TOKENS:
@@ -5945,7 +5662,7 @@
5945
5662
  }
5946
5663
  /**
5947
5664
  * Do not edit directly
5948
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5665
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5949
5666
  */
5950
5667
  /**
5951
5668
  * TOKENS:
@@ -6112,7 +5829,7 @@
6112
5829
 
6113
5830
  /**
6114
5831
  * Do not edit directly
6115
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5832
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6116
5833
  */
6117
5834
  /**
6118
5835
  * TOKENS:
@@ -6219,7 +5936,7 @@
6219
5936
 
6220
5937
  /**
6221
5938
  * Do not edit directly
6222
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5939
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6223
5940
  */
6224
5941
  /**
6225
5942
  * TOKENS:
@@ -6229,7 +5946,7 @@
6229
5946
  */
6230
5947
  /**
6231
5948
  * Do not edit directly
6232
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5949
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6233
5950
  */
6234
5951
  /**
6235
5952
  * TOKENS:
@@ -6254,7 +5971,7 @@
6254
5971
  }
6255
5972
  /**
6256
5973
  * Do not edit directly
6257
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
5974
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6258
5975
  */
6259
5976
  /**
6260
5977
  * TOKENS:
@@ -6315,7 +6032,7 @@
6315
6032
 
6316
6033
  /**
6317
6034
  * Do not edit directly
6318
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
6035
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6319
6036
  */
6320
6037
  /**
6321
6038
  * TOKENS:
@@ -6730,7 +6447,7 @@
6730
6447
 
6731
6448
  /**
6732
6449
  * Do not edit directly
6733
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
6450
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6734
6451
  */
6735
6452
  /**
6736
6453
  * TOKENS:
@@ -6784,7 +6501,7 @@
6784
6501
 
6785
6502
  /**
6786
6503
  * Do not edit directly
6787
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
6504
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6788
6505
  */
6789
6506
  /**
6790
6507
  * TOKENS:
@@ -6942,7 +6659,7 @@
6942
6659
 
6943
6660
  /**
6944
6661
  * Do not edit directly
6945
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
6662
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6946
6663
  */
6947
6664
  /**
6948
6665
  * TOKENS:
@@ -7293,7 +7010,7 @@
7293
7010
 
7294
7011
  /**
7295
7012
  * Do not edit directly
7296
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
7013
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7297
7014
  */
7298
7015
  /**
7299
7016
  * TOKENS:
@@ -7479,7 +7196,7 @@
7479
7196
 
7480
7197
  /**
7481
7198
  * Do not edit directly
7482
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
7199
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7483
7200
  */
7484
7201
  /**
7485
7202
  * TOKENS:
@@ -7537,7 +7254,7 @@
7537
7254
 
7538
7255
  /**
7539
7256
  * Do not edit directly
7540
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
7257
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7541
7258
  */
7542
7259
  /**
7543
7260
  * TOKENS:
@@ -7711,7 +7428,7 @@
7711
7428
 
7712
7429
  /**
7713
7430
  * Do not edit directly
7714
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
7431
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7715
7432
  */
7716
7433
  /**
7717
7434
  * TOKENS:
@@ -7886,7 +7603,7 @@
7886
7603
 
7887
7604
  /**
7888
7605
  * Do not edit directly
7889
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
7606
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7890
7607
  */
7891
7608
  /**
7892
7609
  * TOKENS:
@@ -8796,7 +8513,7 @@
8796
8513
 
8797
8514
  /**
8798
8515
  * Do not edit directly
8799
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
8516
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
8800
8517
  */
8801
8518
  /**
8802
8519
  * TOKENS:
@@ -8806,7 +8523,7 @@
8806
8523
  */
8807
8524
  /**
8808
8525
  * Do not edit directly
8809
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
8526
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
8810
8527
  */
8811
8528
  /**
8812
8529
  * TOKENS:
@@ -8831,7 +8548,7 @@
8831
8548
  }
8832
8549
  /**
8833
8550
  * Do not edit directly
8834
- * Generated on Wed, 19 Jul 2023 07:35:24 GMT
8551
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
8835
8552
  */
8836
8553
  /**
8837
8554
  * TOKENS: