@ilo-org/styles 0.6.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 (41) hide show
  1. package/build/css/components/index.css +759 -1095
  2. package/build/css/components/index.css.map +1 -1
  3. package/build/css/global.css +1 -1
  4. package/build/css/index.css +759 -1095
  5. package/build/css/index.css.map +1 -1
  6. package/build/css/monorepo.css +759 -1095
  7. package/build/css/monorepo.css.map +1 -1
  8. package/build/minified/index.css +1 -1
  9. package/build/minified/index.css.map +1 -1
  10. package/build/minified/monorepo.css +1 -1
  11. package/build/minified/monorepo.css.map +1 -1
  12. package/css/components/card.css +1 -1
  13. package/css/components/cardgroup.css +1 -1
  14. package/css/components/datacard.css +1 -0
  15. package/css/components/detailcard.css +1 -0
  16. package/css/components/factlistcard.css +1 -0
  17. package/css/components/featurecard.css +1 -0
  18. package/css/components/herocard.css +1 -1
  19. package/css/components/multilinkcard.css +1 -0
  20. package/css/components/promocard.css +1 -0
  21. package/css/components/statcard.css +1 -0
  22. package/css/components/textcard.css +1 -0
  23. package/css/global.css.map +1 -1
  24. package/css/index.css +1 -1
  25. package/css/index.css.map +1 -1
  26. package/css/monorepo.css +1 -1
  27. package/css/monorepo.css.map +1 -1
  28. package/package.json +1 -1
  29. package/scss/_mixins.scss +19 -20
  30. package/scss/components/_card.scss +79 -1377
  31. package/scss/components/_cardgroup.scss +26 -26
  32. package/scss/components/_datacard.scss +90 -0
  33. package/scss/components/_detailcard.scss +150 -0
  34. package/scss/components/_factlistcard.scss +110 -0
  35. package/scss/components/_featurecard.scss +218 -0
  36. package/scss/components/_herocard.scss +3 -19
  37. package/scss/components/_multilinkcard.scss +189 -0
  38. package/scss/components/_promocard.scss +157 -0
  39. package/scss/components/_statcard.scss +76 -0
  40. package/scss/components/_textcard.scss +135 -0
  41. package/scss/components/index.scss +8 -0
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 21 Jul 2023 14:22:03 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 Fri, 21 Jul 2023 14:22:03 GMT
13
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
14
14
  */
15
15
  /**
16
16
  * TOKENS:
@@ -129,7 +129,7 @@
129
129
 
130
130
  /**
131
131
  * Do not edit directly
132
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
132
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
133
133
  */
134
134
  /**
135
135
  * TOKENS:
@@ -154,7 +154,7 @@
154
154
  }
155
155
  /**
156
156
  * Do not edit directly
157
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
157
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
158
158
  */
159
159
  /**
160
160
  * TOKENS:
@@ -408,7 +408,7 @@
408
408
 
409
409
  /**
410
410
  * Do not edit directly
411
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
411
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
412
412
  */
413
413
  /**
414
414
  * TOKENS:
@@ -418,7 +418,7 @@
418
418
  */
419
419
  /**
420
420
  * Do not edit directly
421
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
421
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
422
422
  */
423
423
  /**
424
424
  * TOKENS:
@@ -443,7 +443,7 @@
443
443
  }
444
444
  /**
445
445
  * Do not edit directly
446
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
446
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
447
447
  */
448
448
  /**
449
449
  * TOKENS:
@@ -733,7 +733,7 @@
733
733
 
734
734
  /**
735
735
  * Do not edit directly
736
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
736
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
737
737
  */
738
738
  /**
739
739
  * TOKENS:
@@ -863,7 +863,7 @@
863
863
 
864
864
  /**
865
865
  * Do not edit directly
866
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
866
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
867
867
  */
868
868
  /**
869
869
  * TOKENS:
@@ -872,38 +872,75 @@
872
872
  * MAPS:
873
873
  */
874
874
  .ilo--card {
875
- margin: 0;
876
- 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;
877
882
  }
878
883
  .right-to-left .ilo--card {
879
884
  text-align: right;
880
885
  }
881
- .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 {
882
887
  background: rgb(255, 255, 255);
883
- color: rgb(30, 45, 190);
884
888
  outline: none;
885
889
  text-decoration: none;
886
890
  }
887
- .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 {
888
892
  background: rgb(255, 255, 255);
889
893
  }
890
- .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 {
891
- 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");
892
- }
893
- .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 {
894
907
  color: rgb(30, 45, 190);
895
908
  }
896
- .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 {
897
- color: rgb(30, 45, 190);
909
+ .ilo--card__theme__light {
910
+ background: rgb(255, 255, 255);
898
911
  }
899
- .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 {
900
- color: rgb(30, 45, 190);
912
+ .ilo--card__theme__dark {
913
+ background: rgb(35, 0, 80);
914
+ transition: background 150ms ease-out;
901
915
  }
902
- .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 {
903
- 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;
904
923
  }
905
- .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 {
906
- 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));
907
944
  }
908
945
  .ilo--card--link {
909
946
  background: none;
@@ -925,6 +962,21 @@
925
962
  transition-duration: 150ms;
926
963
  transition-timing-function: ease-out;
927
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
+ }
928
980
  .ilo--card--link--text {
929
981
  width: 1px;
930
982
  height: 1px;
@@ -935,176 +987,6 @@
935
987
  clip: rect(0 0 0 0);
936
988
  overflow: hidden;
937
989
  }
938
- .ilo--card--light {
939
- background: rgb(255, 255, 255);
940
- }
941
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) {
942
- background: rgb(35, 0, 80);
943
- outline: none;
944
- transition: background 150ms ease-out;
945
- }
946
- .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 {
947
- color: rgb(237, 240, 242);
948
- transition: color 150ms ease-out;
949
- }
950
- .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 {
951
- color: rgb(255, 255, 255);
952
- transition: color 150ms ease-out;
953
- }
954
- .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 {
955
- color: rgb(237, 240, 242);
956
- transition: color 150ms ease-out;
957
- }
958
- .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 {
959
- color: rgb(237, 240, 242);
960
- transition: color 150ms ease-out;
961
- }
962
- .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 {
963
- color: rgb(237, 240, 242);
964
- transition: color 150ms ease-out;
965
- }
966
- .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 {
967
- background: rgb(35, 0, 80);
968
- outline: none;
969
- transition: background 150ms ease-out;
970
- }
971
- .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 {
972
- color: rgb(237, 240, 242);
973
- transition: color 150ms ease-out;
974
- }
975
- .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 {
976
- color: rgb(255, 255, 255);
977
- transition: color 150ms ease-out;
978
- }
979
- .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 {
980
- color: rgb(237, 240, 242);
981
- transition: color 150ms ease-out;
982
- }
983
- .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 {
984
- color: rgb(237, 240, 242);
985
- transition: color 150ms ease-out;
986
- }
987
- .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 {
988
- color: rgb(237, 240, 242);
989
- transition: color 150ms ease-out;
990
- }
991
- .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) {
992
- margin-top: 2.1436227224rem;
993
- padding-top: 0;
994
- position: relative;
995
- }
996
- .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 {
997
- background: inherit;
998
- content: "";
999
- display: block;
1000
- height: 40px;
1001
- position: absolute;
1002
- width: calc(100% - 73px);
1003
- }
1004
- .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 {
1005
- 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");
1006
- background-position: bottom right;
1007
- background-size: cover;
1008
- content: "";
1009
- height: 40px;
1010
- display: block;
1011
- position: absolute;
1012
- width: 73.4px;
1013
- }
1014
- .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 {
1015
- 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");
1016
- }
1017
- @media screen and (min-width: 610px) {
1018
- .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) {
1019
- margin-top: 2.5723472669rem;
1020
- }
1021
- .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 {
1022
- background: inherit;
1023
- content: "";
1024
- display: block;
1025
- height: 48px;
1026
- position: absolute;
1027
- width: calc(100% - 87px);
1028
- }
1029
- .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 {
1030
- 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");
1031
- background-position: bottom right;
1032
- background-size: cover;
1033
- content: "";
1034
- height: 48px;
1035
- display: block;
1036
- position: absolute;
1037
- width: 87.4px;
1038
- }
1039
- .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 {
1040
- 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");
1041
- }
1042
- }
1043
- @media screen and (min-width: 1024px) {
1044
- .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) {
1045
- margin-top: 3.4297963558rem;
1046
- }
1047
- .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 {
1048
- background: inherit;
1049
- content: "";
1050
- display: block;
1051
- height: 64px;
1052
- position: absolute;
1053
- width: calc(100% - 116px);
1054
- }
1055
- .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 {
1056
- 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");
1057
- background-position: bottom right;
1058
- background-size: cover;
1059
- content: "";
1060
- height: 64px;
1061
- display: block;
1062
- position: absolute;
1063
- width: 116.4px;
1064
- }
1065
- .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 {
1066
- 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");
1067
- }
1068
- }
1069
- .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 {
1070
- left: 0;
1071
- top: -2.1436227224rem;
1072
- transition: background-image 150ms ease-out;
1073
- }
1074
- .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 {
1075
- left: auto;
1076
- right: 0;
1077
- }
1078
- @media screen and (min-width: 610px) {
1079
- .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 {
1080
- top: -2.5562700965rem;
1081
- }
1082
- }
1083
- @media screen and (min-width: 1024px) {
1084
- .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 {
1085
- top: -3.4137191854rem;
1086
- }
1087
- }
1088
- .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 {
1089
- right: 0;
1090
- top: -2.1436227224rem;
1091
- transition: background-image 150ms ease-out;
1092
- }
1093
- .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 {
1094
- left: 0;
1095
- right: auto;
1096
- transform: rotateY(180deg);
1097
- }
1098
- @media screen and (min-width: 610px) {
1099
- .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 {
1100
- top: -2.5562700965rem;
1101
- }
1102
- }
1103
- @media screen and (min-width: 1024px) {
1104
- .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 {
1105
- top: -3.4137191854rem;
1106
- }
1107
- }
1108
990
  .ilo--card--eyebrow {
1109
991
  color: rgb(150, 10, 85);
1110
992
  font-size: 16px;
@@ -1177,7 +1059,7 @@
1177
1059
  line-height: 23.36px;
1178
1060
  margin-bottom: 1.3742266073rem;
1179
1061
  }
1180
- .ilo--card--image {
1062
+ .ilo--card--picture {
1181
1063
  max-width: 100%;
1182
1064
  width: 100%;
1183
1065
  }
@@ -1185,190 +1067,131 @@
1185
1067
  position: relative;
1186
1068
  z-index: 2;
1187
1069
  }
1188
- .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;
1189
1086
  position: relative;
1190
1087
  }
1191
- .ilo--card--isvideo .ilo--card--image--wrapper::before {
1192
- 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");
1193
- background-color: rgb(45, 45, 45);
1194
- background-position: center;
1195
- background-size: 18px 20px;
1196
- background-repeat: no-repeat;
1197
- content: "";
1198
- display: block;
1199
- height: 40px;
1200
- left: 0;
1201
- position: absolute;
1202
- top: 0;
1203
- width: 40px;
1204
- z-index: 1;
1088
+ .ilo--card__type__feature.ilo--card__theme__dark {
1089
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1205
1090
  }
1206
- .ilo--card--multilink {
1207
- 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);
1208
1093
  }
1209
- .ilo--card--multilink .ilo--card--image--wrapper {
1210
- 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");
1211
1097
  }
1212
- .ilo--card--multilink .ilo--card--content .ilo--card--image--wrapper {
1213
- 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");
1214
1101
  }
1215
- @media screen and (min-width: 610px) {
1216
- .ilo--card--multilink {
1217
- padding: 2.1436227224rem;
1218
- }
1102
+ .ilo--card__type__feature picture::before {
1103
+ transition-property: opacity;
1104
+ transition-duration: 150ms;
1105
+ transition-timing-function: ease-out;
1219
1106
  }
1220
- @media screen and (min-width: 1024px) {
1221
- .ilo--card--multilink {
1222
- padding: 3.0010718114rem 2.5723472669rem;
1223
- }
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));
1224
1111
  }
1225
- .ilo--card--multilink .ilo--card--title {
1226
- font-size: 23.32px;
1227
- letter-spacing: -0.035em;
1228
- line-height: 29.15px;
1229
- margin-bottom: 0.7188906752rem;
1230
- 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;
1231
1118
  }
1232
- @media screen and (min-width: 610px) {
1233
- .ilo--card--multilink .ilo--card--title {
1234
- font-size: 29.16px;
1235
- letter-spacing: -0.035em;
1236
- line-height: 36.45px;
1237
- margin-bottom: 0.5741425509rem;
1238
- }
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);
1239
1121
  }
1240
- .ilo--card--multilink .ilo--card--intro {
1241
- font-size: 16px;
1242
- letter-spacing: normal;
1243
- line-height: 23.36px;
1244
- margin-bottom: 1.910132288rem;
1245
- 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;
1246
1129
  }
1247
- @media screen and (min-width: 610px) {
1248
- .ilo--card--multilink .ilo--card--intro {
1249
- font-size: 18.66px;
1250
- letter-spacing: normal;
1251
- line-height: 27.24px;
1252
- margin-bottom: 1.8685411561rem;
1253
- }
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;
1254
1134
  }
1255
- .ilo--card--multilink.ilo--card--dark {
1256
- 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%;
1257
1139
  }
1258
- .ilo--card--multilink.ilo--card--dark .ilo--card--title {
1259
- color: rgb(45, 45, 45);
1140
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--content {
1141
+ width: 100%;
1260
1142
  }
1261
- .ilo--card--multilink.ilo--card--dark .ilo--card--intro {
1262
- color: rgb(45, 45, 45);
1143
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--image--wrapper {
1144
+ width: 100%;
1263
1145
  }
1264
- .ilo--card--multilink.ilo--card--wide {
1265
- 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;
1266
1148
  }
1267
1149
  @media screen and (min-width: 610px) {
1268
- .ilo--card--multilink.ilo--card--wide {
1269
- padding: 3.0010718114rem 2.5723472669rem;
1270
- }
1271
- .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1272
- flex-direction: row-reverse;
1273
- }
1274
- .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 {
1275
1151
  flex-direction: row;
1276
1152
  }
1277
- .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1278
- display: flex;
1279
- column-gap: 1.7148981779rem;
1280
- }
1281
- .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 {
1282
1154
  flex-direction: row-reverse;
1283
1155
  }
1284
- .ilo--card--multilink.ilo--card--wide .ilo--card--image--wrapper {
1285
- 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;
1286
1161
  width: 50%;
1287
1162
  }
1288
- .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 {
1289
1164
  width: 50%;
1290
1165
  }
1291
- .ilo--card--multilink.ilo--card--wide .ilo--card--content .ilo--card--image--wrapper {
1292
- 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;
1293
1168
  }
1294
- }
1295
- .ilo--card--multilink.ilo--card--standard {
1296
- padding: 2.5723472669rem 2.1436227224rem;
1297
- }
1298
- @media screen and (min-width: 610px) {
1299
- .ilo--card--multilink.ilo--card--standard {
1300
- padding: 2.5723472669rem 2.1436227224rem;
1301
- }
1302
- }
1303
- @media screen and (min-width: 1024px) {
1304
- .ilo--card--multilink.ilo--card--standard {
1305
- padding: 2.5723472669rem 2.1436227224rem;
1306
- }
1307
- }
1308
- .ilo--card--multilink.ilo--card--narrow {
1309
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1310
- }
1311
- @media screen and (min-width: 610px) {
1312
- .ilo--card--multilink.ilo--card--narrow {
1313
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1314
- }
1315
- }
1316
- @media screen and (min-width: 1024px) {
1317
- .ilo--card--multilink.ilo--card--narrow {
1318
- 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%;
1319
1172
  }
1320
- }
1321
- .ilo--card--multilink.ilo--card--narrow .ilo--card--image--wrapper {
1322
- display: none;
1323
- }
1324
- .ilo--card--multilink.ilo--card--narrow .ilo--card--content .ilo--card--image--wrapper {
1325
- display: block;
1326
- margin-bottom: 1.2861736334rem;
1327
- }
1328
- @media screen and (min-width: 610px) {
1329
- .ilo--card--multilink.ilo--card--narrow .ilo--card--title {
1330
- font-size: 23.32px;
1331
- letter-spacing: -0.035em;
1332
- line-height: 29.15px;
1333
- 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%;
1334
1175
  }
1335
- }
1336
- @media screen and (min-width: 610px) {
1337
- .ilo--card--multilink.ilo--card--narrow .ilo--card--intro {
1338
- font-size: 16px;
1339
- letter-spacing: normal;
1340
- line-height: 23.36px;
1341
- 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%;
1342
1178
  }
1343
- }
1344
- .ilo--card--multilink .ilo--link-list {
1345
- margin-top: 1.8756698821rem;
1346
- }
1347
- .ilo--card--detail {
1348
- border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1349
- padding: 1.2861736334rem 0;
1350
- position: relative;
1351
- }
1352
- @media screen and (min-width: 1024px) {
1353
- .ilo--card--detail {
1354
- 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;
1355
1182
  }
1356
1183
  }
1357
- .ilo--card--detail:hover, .ilo--card--detail:focus, .ilo--card--detail:focus-within {
1358
- 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));
1359
- }
1360
- .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before, .ilo--card--detail:focus-within picture::before {
1361
- opacity: 0.4;
1362
- z-index: 2;
1363
- }
1364
- .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 {
1365
- 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%;
1366
1188
  }
1367
- .ilo--card--detail picture {
1189
+ .ilo--card__type__feature picture {
1368
1190
  display: flex;
1191
+ height: 100%;
1369
1192
  position: relative;
1370
1193
  }
1371
- .ilo--card--detail picture::before {
1194
+ .ilo--card__type__feature picture::before {
1372
1195
  background-color: rgb(30, 45, 190);
1373
1196
  content: "";
1374
1197
  display: block;
@@ -1377,725 +1200,590 @@
1377
1200
  opacity: 0;
1378
1201
  position: absolute;
1379
1202
  top: 0;
1203
+ transition: opacity 150ms ease-in-out;
1380
1204
  width: 100%;
1381
1205
  z-index: -1;
1382
- transition-property: opacity;
1383
- transition-duration: 150ms;
1384
- transition-timing-function: ease-out;
1385
1206
  }
1386
- .ilo--card--detail .ilo--card--wrap {
1207
+ .ilo--card__type__feature .ilo--card--content {
1387
1208
  display: flex;
1209
+ flex: 1 1 auto;
1210
+ flex-direction: column;
1211
+ padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
1388
1212
  }
1389
- .right-to-left .ilo--card--detail .ilo--card--wrap {
1390
- flex-direction: row-reverse;
1213
+ .ilo--card__type__feature.ilo--card__linklist .ilo--card--content {
1214
+ padding-bottom: 0;
1391
1215
  }
1392
- .ilo--card--detail .ilo--card--image {
1393
- object-fit: contain;
1394
- width: 4.1264737406rem;
1216
+ .ilo--card__type__feature .ilo--card--title {
1217
+ font-size: 23.32px;
1218
+ letter-spacing: -0.035em;
1219
+ line-height: 29.15px;
1220
+ margin-bottom: 1.5763397642rem;
1221
+ font-family: Overpass;
1222
+ font-weight: 700;
1395
1223
  }
1396
- @media screen and (min-width: 1024px) {
1397
- .ilo--card--detail .ilo--card--image {
1398
- width: 10.718113612rem;
1224
+ .ilo--card__type__feature .ilo--card--eyebrow {
1225
+ font-size: 14.93px;
1226
+ letter-spacing: normal;
1227
+ line-height: 19.71px;
1228
+ margin-bottom: 0.3376482577rem;
1229
+ }
1230
+ .ilo--card__type__feature .ilo--card--date {
1231
+ margin-bottom: 0;
1232
+ margin-top: auto;
1233
+ }
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;
1247
+ border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1248
+ padding: 1.2861736334rem 2.1436227224rem;
1249
+ clip-path: polygon(0 0, calc(100% - 73px) 0, 100% 40px, 100% 100%, 0 100%);
1250
+ }
1251
+ .ilo--card__type__text [class$=profile--contents--light] * {
1252
+ color: rgb(45, 45, 45);
1253
+ }
1254
+ .ilo--card__type__text [class$=profile--contents--dark] * {
1255
+ color: rgb(255, 255, 255);
1256
+ }
1257
+ .ilo--card__type__text:hover, .ilo--card__type__text:focus, .ilo--card__type__text:focus-within {
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));
1259
+ }
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] * {
1261
+ color: rgb(30, 45, 190);
1262
+ }
1263
+ @media screen and (min-width: 610px) {
1264
+ .ilo--card__type__text {
1265
+ padding: 1.7148981779rem 2.1436227224rem;
1399
1266
  }
1400
1267
  }
1401
- .ilo--card--detail .ilo--card--image--wrapper {
1402
- max-width: 4.1264737406rem;
1403
- width: 100%;
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;
1404
1271
  }
1405
- @media screen and (min-width: 1024px) {
1406
- .ilo--card--detail .ilo--card--image--wrapper {
1407
- max-width: 10.718113612rem;
1272
+ @media screen and (min-width: 610px) {
1273
+ .ilo--card__type__text.ilo--card__size__wide, .ilo--card__type__text.ilo--card__size__fluid {
1274
+ padding: 1.7148981779rem 2.1436227224rem;
1408
1275
  }
1409
1276
  }
1410
- .ilo--card--detail .ilo--card--content {
1411
- padding: 0 1.2861736334rem;
1277
+ .ilo--card__type__text.ilo--card__size__narrow {
1278
+ --max-width: 16.1307609861rem;
1279
+ padding: 1.2861736334rem 2.1436227224rem;
1280
+ }
1281
+ @media screen and (min-width: 610px) {
1282
+ .ilo--card__type__text.ilo--card__size__narrow {
1283
+ padding: 1.2861736334rem 2.1436227224rem;
1284
+ }
1412
1285
  }
1413
- .ilo--card--detail .ilo--card--title {
1286
+ .ilo--card__type__text.ilo--card__size__narrow .ilo--card--title {
1414
1287
  font-size: 18.66px;
1415
1288
  letter-spacing: -0.035em;
1416
1289
  line-height: 24.26px;
1290
+ margin-bottom: 1.674953518rem;
1417
1291
  }
1418
- @media screen and (min-width: 1024px) {
1419
- .ilo--card--detail .ilo--card--title {
1292
+ .ilo--card__type__text.ilo--card__dark {
1293
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1294
+ }
1295
+ .ilo--card__type__text .ilo--card--eyebrow {
1296
+ margin-bottom: 1.0110920672rem;
1297
+ }
1298
+ .ilo--card__type__text .ilo--card--title {
1299
+ font-size: 18.66px;
1300
+ letter-spacing: -0.035em;
1301
+ line-height: 24.26px;
1302
+ margin-bottom: 1.674953518rem;
1303
+ }
1304
+ @media screen and (min-width: 610px) {
1305
+ .ilo--card__type__text .ilo--card--title {
1420
1306
  font-size: 23.32px;
1421
1307
  letter-spacing: -0.035em;
1422
1308
  line-height: 29.15px;
1309
+ margin-bottom: 1.5763397642rem;
1423
1310
  }
1424
1311
  }
1425
- .ilo--card--detail .ilo--card--event-date {
1426
- font-size: 16px;
1427
- letter-spacing: normal;
1428
- line-height: 23.36px;
1429
- margin-bottom: 0;
1430
- padding-left: 1.2861736334rem;
1431
- position: relative;
1432
- }
1433
- .ilo--card--detail .ilo--card--event-date::before {
1434
- background-repeat: no-repeat;
1435
- content: "";
1436
- display: inline-block;
1437
- height: 0.7502679528rem;
1438
- left: 0;
1439
- position: absolute;
1440
- top: 50%;
1441
- transform: rotate(-90deg) translateX(50%);
1442
- width: 0.6430868167rem;
1443
- 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");
1444
- }
1445
- .ilo--card--detail .ilo--card--date {
1446
- font-size: 16px;
1447
- letter-spacing: normal;
1448
- line-height: 23.36px;
1449
- }
1450
- .ilo--card--graphic {
1451
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1452
- margin-top: 2.1436227224rem;
1453
- padding: 0 1.2861736334rem 2.1436227224rem;
1454
- position: relative;
1455
- }
1456
- .ilo--card--graphic::before {
1457
- background: inherit;
1458
- content: "";
1459
- display: block;
1460
- height: 40px;
1461
- position: absolute;
1462
- width: calc(100% - 73px);
1463
- }
1464
- .ilo--card--graphic::after {
1465
- 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");
1466
- background-position: bottom right;
1467
- background-size: cover;
1468
- content: "";
1469
- height: 40px;
1312
+ .ilo--card__type__text .ilo--card--date {
1470
1313
  display: block;
1471
- position: absolute;
1472
- width: 73.4px;
1473
- }
1474
- .ilo--card--graphic.ilo--card--dark::after {
1475
- 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");
1476
- }
1477
- .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 {
1478
- 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");
1479
- }
1480
- .ilo--card--graphic::before {
1481
- left: 0;
1482
- top: -39.7px;
1314
+ margin-bottom: 1.4398166117rem;
1483
1315
  }
1484
- .right-to-left .ilo--card--graphic::before {
1485
- left: auto;
1486
- right: 0;
1316
+ .ilo--card__type__text .ilo--card--content {
1317
+ display: flex;
1318
+ flex-direction: column;
1319
+ position: relative;
1487
1320
  }
1488
- .ilo--card--graphic::after {
1489
- right: 0;
1490
- top: -39.7px;
1491
- transition: background-image 150ms ease-out;
1321
+ .ilo--card__type__text .ilo--card--content > * {
1322
+ justify-self: flex-start;
1492
1323
  }
1493
- .right-to-left .ilo--card--graphic::after {
1494
- left: 0;
1495
- right: auto;
1496
- transform: rotateY(180deg);
1324
+ .ilo--card__type__text .ilo--card--content > *:last-child {
1325
+ justify-self: flex-end;
1326
+ margin-bottom: 0;
1497
1327
  }
1498
- .ilo--card--graphic .ilo--profile--contents--light * {
1499
- color: rgb(45, 45, 45);
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;
1500
1344
  }
1501
- .ilo--card--graphic .ilo--profile--contents--dark * {
1502
- color: rgb(255, 255, 255);
1345
+ @media screen and (min-width: 1024px) {
1346
+ .ilo--card__type__detail {
1347
+ padding: 1.7148981779rem 0;
1348
+ }
1503
1349
  }
1504
- .ilo--card--graphic:hover, .ilo--card--graphic:focus, .ilo--card--graphic:focus-within {
1350
+ .ilo--card__type__detail:hover, .ilo--card__type__detail:focus, .ilo--card__type__detail:focus-within {
1505
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));
1506
1352
  }
1507
- .ilo--card--graphic:hover .ilo--profile--contents *, .ilo--card--graphic:focus .ilo--profile--contents *, .ilo--card--graphic:focus-within .ilo--profile--contents * {
1508
- color: rgb(30, 45, 190);
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;
1509
1356
  }
1510
- @media screen and (min-width: 610px) {
1511
- .ilo--card--graphic {
1512
- padding: 0 1.7148981779rem 2.1436227224rem;
1513
- }
1514
- .ilo--card--graphic::before {
1515
- background: inherit;
1516
- content: "";
1517
- display: block;
1518
- height: 40px;
1519
- position: absolute;
1520
- width: calc(100% - 73px);
1521
- }
1522
- .ilo--card--graphic::after {
1523
- 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");
1524
- background-position: bottom right;
1525
- background-size: cover;
1526
- content: "";
1527
- height: 40px;
1528
- display: block;
1529
- position: absolute;
1530
- width: 73.4px;
1531
- }
1532
- .ilo--card--graphic.ilo--card--dark::after {
1533
- 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");
1534
- }
1535
- .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 {
1536
- 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");
1537
- }
1538
- .ilo--card--graphic::before {
1539
- left: 0;
1540
- top: -39.7px;
1541
- }
1542
- .right-to-left .ilo--card--graphic::before {
1543
- left: auto;
1544
- right: 0;
1545
- }
1546
- .ilo--card--graphic::after {
1547
- right: 0;
1548
- top: -39.7px;
1549
- }
1550
- .right-to-left .ilo--card--graphic::after {
1551
- left: 0;
1552
- right: auto;
1553
- transform: rotateY(180deg);
1554
- }
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;
1555
1364
  }
1556
1365
  @media screen and (min-width: 1024px) {
1557
- .ilo--card--graphic::before {
1558
- background: inherit;
1559
- content: "";
1560
- display: block;
1561
- height: 40px;
1562
- position: absolute;
1563
- width: calc(100% - 73px);
1564
- }
1565
- .ilo--card--graphic::after {
1566
- 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");
1567
- background-position: bottom right;
1568
- background-size: cover;
1569
- content: "";
1570
- height: 40px;
1571
- display: block;
1572
- position: absolute;
1573
- width: 73.4px;
1574
- }
1575
- .ilo--card--graphic.ilo--card--dark::after {
1576
- 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");
1577
- }
1578
- .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 {
1579
- 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");
1580
- }
1581
- .ilo--card--graphic::before {
1582
- left: 0;
1583
- top: -39.7px;
1584
- }
1585
- .right-to-left .ilo--card--graphic::before {
1586
- left: auto;
1587
- right: 0;
1588
- }
1589
- .ilo--card--graphic::after {
1590
- right: 0;
1591
- top: -39.7px;
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;
1592
1370
  }
1593
- .right-to-left .ilo--card--graphic::after {
1594
- left: 0;
1595
- right: auto;
1596
- transform: rotateY(180deg);
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;
1597
1375
  }
1598
1376
  }
1599
- .ilo--card--graphic.ilo--card--wide {
1600
- padding: 0 1.7148981779rem 2.1436227224rem;
1377
+ .ilo--card__type__detail.ilo--card__size__wide, .ilo--card__type__detail.ilo--card__size__fluid {
1378
+ --max-width: 39.9249732047rem;
1601
1379
  }
1602
- @media screen and (min-width: 610px) {
1603
- .ilo--card--graphic.ilo--card--wide {
1604
- padding: 0 1.7148981779rem 2.1436227224rem;
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;
1605
1385
  }
1606
1386
  }
1607
- .ilo--card--graphic.ilo--card--standard {
1608
- padding: 0 1.7148981779rem 2.1436227224rem;
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
+ }
1609
1391
  }
1610
- @media screen and (min-width: 610px) {
1611
- .ilo--card--graphic.ilo--card--standard {
1612
- padding: 0 1.7148981779rem 2.1436227224rem;
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;
1613
1395
  }
1614
1396
  }
1615
- .ilo--card--graphic.ilo--card--narrow {
1616
- padding: 0 1.2861736334rem 2.1436227224rem;
1397
+ .ilo--card__type__detail.ilo--card__size__narrow {
1398
+ --max-width: 18.3815648446rem;
1617
1399
  }
1618
- @media screen and (min-width: 610px) {
1619
- .ilo--card--graphic.ilo--card--narrow {
1620
- padding: 0 1.2861736334rem 2.1436227224rem;
1621
- }
1400
+ .ilo--card__type__detail picture {
1401
+ display: flex;
1402
+ position: relative;
1622
1403
  }
1623
- .ilo--card--graphic.ilo--card--narrow .ilo--card--title {
1624
- font-size: 18.66px;
1625
- letter-spacing: -0.035em;
1626
- line-height: 24.26px;
1627
- margin-bottom: 1.674953518rem;
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;
1628
1418
  }
1629
- .ilo--card--graphic.ilo--card--dark {
1630
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1419
+ .ilo--card__type__detail .ilo--card--wrap {
1420
+ display: flex;
1631
1421
  }
1632
- .ilo--card--graphic .ilo--card--eyebrow {
1633
- margin-bottom: 1.0110920672rem;
1422
+ .right-to-left .ilo--card__type__detail .ilo--card--wrap {
1423
+ flex-direction: row-reverse;
1634
1424
  }
1635
- .ilo--card--graphic .ilo--card--title {
1425
+ .ilo--card__type__detail .ilo--card--title {
1636
1426
  font-size: 18.66px;
1637
1427
  letter-spacing: -0.035em;
1638
1428
  line-height: 24.26px;
1639
- margin-bottom: 1.674953518rem;
1640
1429
  }
1641
- @media screen and (min-width: 610px) {
1642
- .ilo--card--graphic .ilo--card--title {
1643
- font-size: 23.32px;
1644
- letter-spacing: -0.035em;
1645
- line-height: 29.15px;
1646
- margin-bottom: 1.5763397642rem;
1647
- }
1430
+ .ilo--card__type__detail .ilo--card--image--wrapper {
1431
+ flex: 0 0 4.1264737406rem;
1648
1432
  }
1649
- .ilo--card--graphic .ilo--card--date {
1650
- display: block;
1651
- margin-bottom: 1.4398166117rem;
1433
+ .ilo--card__type__detail .ilo--card--picture {
1434
+ object-fit: contain;
1435
+ width: 4.1264737406rem;
1652
1436
  }
1653
- .ilo--card--graphic .ilo--card--content {
1654
- display: flex;
1655
- flex-direction: column;
1437
+ .ilo--card__type__detail .ilo--card--content {
1438
+ padding: 0 1.2861736334rem;
1439
+ }
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;
1656
1446
  position: relative;
1657
1447
  }
1658
- .ilo--card--graphic .ilo--card--content > * {
1659
- 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");
1660
1459
  }
1661
- .ilo--card--graphic .ilo--card--content > *:last-child {
1662
- justify-self: flex-end;
1663
- margin-bottom: 0;
1460
+ .ilo--card__type__detail .ilo--card--date {
1461
+ font-size: 16px;
1462
+ letter-spacing: normal;
1463
+ line-height: 23.36px;
1664
1464
  }
1665
- .ilo--card--graphicpromo {
1666
- 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;
1667
1478
  padding: 2.1436227224rem 1.2861736334rem;
1668
1479
  width: 100%;
1669
1480
  }
1670
- .ilo--card--graphicpromo:hover, .ilo--card--graphicpromo:focus, .ilo--card--graphicpromo:focus-within {
1671
- 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));
1672
- }
1673
1481
  @media screen and (min-width: 610px) {
1674
- .ilo--card--graphicpromo {
1482
+ .ilo--card__type__promo {
1675
1483
  padding: 2.5723472669rem;
1676
1484
  }
1677
1485
  }
1678
1486
  @media screen and (min-width: 1024px) {
1679
- .ilo--card--graphicpromo {
1487
+ .ilo--card__type__promo {
1680
1488
  padding: 3.4297963558rem 3.8585209003rem;
1681
1489
  }
1682
1490
  }
1683
- .ilo--card--graphicpromo.ilo--card--wide {
1684
- padding: 3.4297963558rem 3.8585209003rem;
1491
+ .ilo--card__type__promo.ilo--card__size__standard {
1492
+ --max-width: 33.9764201501rem;
1493
+ padding: 2.5723472669rem;
1685
1494
  }
1686
1495
  @media screen and (min-width: 610px) {
1687
- .ilo--card--graphicpromo.ilo--card--wide {
1688
- padding: 3.4297963558rem 3.8585209003rem;
1496
+ .ilo--card__type__promo.ilo--card__size__standard {
1497
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1689
1498
  }
1690
1499
  }
1691
1500
  @media screen and (min-width: 1024px) {
1692
- .ilo--card--graphicpromo.ilo--card--wide {
1693
- padding: 3.4297963558rem 3.8585209003rem;
1501
+ .ilo--card__type__promo.ilo--card__size__standard {
1502
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1694
1503
  }
1695
1504
  }
1696
- .ilo--card--graphicpromo.ilo--card--standard {
1697
- 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;
1698
1511
  }
1699
1512
  @media screen and (min-width: 610px) {
1700
- .ilo--card--graphicpromo.ilo--card--standard {
1701
- 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;
1702
1515
  }
1703
1516
  }
1704
1517
  @media screen and (min-width: 1024px) {
1705
- .ilo--card--graphicpromo.ilo--card--standard {
1706
- 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;
1707
1520
  }
1708
1521
  }
1709
- .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;
1710
1527
  padding: 2.1436227224rem 1.2861736334rem;
1711
1528
  }
1712
1529
  @media screen and (min-width: 610px) {
1713
- .ilo--card--graphicpromo.ilo--card--narrow {
1530
+ .ilo--card__type__promo.ilo--card__size__narrow {
1714
1531
  padding: 2.1436227224rem 1.2861736334rem;
1715
1532
  }
1716
1533
  }
1717
1534
  @media screen and (min-width: 1024px) {
1718
- .ilo--card--graphicpromo.ilo--card--narrow {
1535
+ .ilo--card__type__promo.ilo--card__size__narrow {
1719
1536
  padding: 2.1436227224rem 1.2861736334rem;
1720
1537
  }
1721
1538
  }
1722
- .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 {
1723
1543
  font-size: 29.16px;
1724
1544
  letter-spacing: -0.035em;
1725
1545
  line-height: 36.45px;
1726
1546
  margin-bottom: 0.5741425509rem;
1727
1547
  }
1728
1548
  @media screen and (min-width: 610px) {
1729
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1549
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1730
1550
  font-size: 36.45px;
1731
1551
  letter-spacing: -0.035em;
1732
1552
  line-height: 43.74px;
1733
1553
  margin-bottom: 0.4278063594rem;
1734
1554
  }
1735
1555
  }
1736
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--intro {
1556
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--intro {
1737
1557
  font-size: 16px;
1738
1558
  letter-spacing: normal;
1739
1559
  line-height: 23.36px;
1740
1560
  margin-bottom: 1.910132288rem;
1741
1561
  }
1742
- .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 {
1743
1563
  color: rgb(45, 45, 45);
1744
1564
  transition-property: color;
1745
1565
  transition-duration: 150ms;
1746
1566
  transition-timing-function: ease-out;
1747
1567
  }
1748
- .ilo--card--graphicpromo .ilo--card--title {
1568
+ .ilo--card__type__promo .ilo--card--title {
1749
1569
  font-size: 29.16px;
1750
1570
  letter-spacing: -0.035em;
1751
1571
  line-height: 36.45px;
1752
1572
  margin-bottom: 0.5741425509rem;
1753
1573
  }
1754
1574
  @media screen and (min-width: 610px) {
1755
- .ilo--card--graphicpromo .ilo--card--title {
1575
+ .ilo--card__type__promo .ilo--card--title {
1756
1576
  font-size: 36.45px;
1757
1577
  letter-spacing: -0.035em;
1758
1578
  line-height: 43.74px;
1759
1579
  margin-bottom: 0.8565309039rem;
1760
1580
  }
1761
1581
  }
1762
- .ilo--card--graphicpromo .ilo--card--intro {
1582
+ .ilo--card__type__promo .ilo--card--intro {
1763
1583
  font-size: 16px;
1764
1584
  letter-spacing: normal;
1765
1585
  line-height: 23.36px;
1766
1586
  margin-bottom: 1.910132288rem;
1767
1587
  }
1768
1588
  @media screen and (min-width: 610px) {
1769
- .ilo--card--graphicpromo .ilo--card--intro {
1589
+ .ilo--card__type__promo .ilo--card--intro {
1770
1590
  font-size: 18.66px;
1771
1591
  letter-spacing: normal;
1772
1592
  line-height: 27.24px;
1773
1593
  margin-bottom: 1.8685411561rem;
1774
1594
  }
1775
1595
  }
1776
- .ilo--card--factlist {
1777
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1778
- max-width: 45.8735262594rem;
1779
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1780
- pointer-events: none;
1781
- }
1782
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1783
- height: 40px;
1784
- top: -2.127545552rem;
1785
- width: calc(100% - 73px);
1786
- }
1787
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1788
- height: 40px;
1789
- top: -2.127545552rem;
1790
- width: 73.3px;
1791
- }
1792
- .ilo--card--factlist.ilo--card--dark {
1793
- background: rgb(35, 0, 80);
1794
- }
1795
- @media screen and (min-width: 1024px) {
1796
- .ilo--card--factlist {
1797
- padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1798
- }
1799
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1800
- height: 48px;
1801
- top: -2.5562700965rem;
1802
- width: calc(100% - 87px);
1803
- }
1804
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1805
- height: 48px;
1806
- top: -2.5562700965rem;
1807
- width: 87.3px;
1808
- }
1809
- }
1810
- .ilo--card--factlist.ilo--card--wide {
1811
- 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;
1812
1610
  }
1813
- @media screen and (min-width: 610px) {
1814
- .ilo--card--factlist.ilo--card--wide {
1815
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1816
- }
1611
+ .ilo--card__type__multilink .ilo--card--image--wrapper {
1612
+ display: none;
1817
1613
  }
1818
- .ilo--card--factlist.ilo--card--standard {
1819
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1614
+ .ilo--card__type__multilink .ilo--card--content .ilo--card--image--wrapper {
1615
+ display: block;
1820
1616
  }
1821
1617
  @media screen and (min-width: 610px) {
1822
- .ilo--card--factlist.ilo--card--standard {
1823
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1618
+ .ilo--card__type__multilink {
1619
+ padding: 2.1436227224rem;
1824
1620
  }
1825
1621
  }
1826
- .ilo--card--factlist.ilo--card--narrow {
1827
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1828
- }
1829
- @media screen and (min-width: 610px) {
1830
- .ilo--card--factlist.ilo--card--narrow {
1831
- 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;
1832
1625
  }
1833
1626
  }
1834
- .ilo--card--factlist.ilo--card--dark {
1835
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1836
- }
1837
- .ilo--card--factlist.ilo--card--dark .ilo--card--title {
1838
- color: rgb(255, 255, 255);
1839
- transition-property: color;
1840
- transition-duration: 150ms;
1841
- transition-timing-function: ease-out;
1842
- }
1843
- .ilo--card--factlist.ilo--card--dark .ilo--list__item {
1844
- color: rgb(255, 255, 255);
1845
- }
1846
- .ilo--card--factlist.ilo--card--dark .ilo--list__item:last-of-type {
1847
- margin-bottom: 0;
1848
- }
1849
- .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 {
1850
- color: rgb(255, 255, 255);
1851
- transition-property: color;
1852
- transition-duration: 150ms;
1853
- transition-timing-function: ease-out;
1854
- }
1855
- .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 {
1856
- color: rgb(255, 255, 255);
1857
- }
1858
- .ilo--card--factlist .ilo--card--title {
1859
- color: rgb(45, 45, 45);
1627
+ .ilo--card__type__multilink .ilo--card--title {
1860
1628
  font-size: 23.32px;
1861
1629
  letter-spacing: -0.035em;
1862
1630
  line-height: 29.15px;
1863
- margin-bottom: 1.1476152197rem;
1631
+ margin-bottom: 0.7188906752rem;
1632
+ color: rgb(45, 45, 45);
1864
1633
  }
1865
- @media screen and (min-width: 1024px) {
1866
- .ilo--card--factlist .ilo--card--title {
1634
+ @media screen and (min-width: 610px) {
1635
+ .ilo--card__type__multilink .ilo--card--title {
1867
1636
  font-size: 29.16px;
1868
1637
  letter-spacing: -0.035em;
1869
1638
  line-height: 36.45px;
1870
- margin-bottom: 1.4315916399rem;
1639
+ margin-bottom: 0.5741425509rem;
1871
1640
  }
1872
1641
  }
1873
- .ilo--card--stat {
1874
- border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1875
- margin-top: 2.1436227224rem;
1876
- padding: 0 1.2861736334rem 2.1436227224rem 1.1789924973rem;
1877
- position: relative;
1878
- width: 100%;
1879
- }
1880
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1881
- left: 0;
1882
- top: -2.127545552rem;
1883
- }
1884
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1885
- left: auto;
1886
- right: 0;
1887
- }
1888
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1889
- right: 0;
1890
- top: -2.127545552rem;
1891
- }
1892
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1893
- left: 0;
1894
- right: auto;
1895
- transform: rotateY(180deg);
1896
- }
1897
- .ilo--card--stat.ilo--card--blue {
1898
- background: rgb(235, 245, 253);
1899
- }
1900
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1901
- background: inherit;
1902
- content: "";
1903
- display: block;
1904
- height: 40px;
1905
- position: absolute;
1906
- width: calc(100% - 73px);
1907
- }
1908
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1909
- 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");
1910
- background-position: bottom right;
1911
- background-size: cover;
1912
- content: "";
1913
- height: 40px;
1914
- display: block;
1915
- position: absolute;
1916
- width: 73.4px;
1917
- }
1918
- .ilo--card--stat.ilo--card--yellow {
1919
- background: rgb(255, 205, 45);
1920
- }
1921
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1922
- background: inherit;
1923
- content: "";
1924
- display: block;
1925
- height: 40px;
1926
- position: absolute;
1927
- width: calc(100% - 73px);
1928
- }
1929
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1930
- 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");
1931
- background-position: bottom right;
1932
- background-size: cover;
1933
- content: "";
1934
- height: 40px;
1935
- display: block;
1936
- position: absolute;
1937
- width: 73.4px;
1938
- }
1939
- .ilo--card--stat.ilo--card--green {
1940
- background: rgb(140, 225, 100);
1941
- }
1942
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1943
- background: inherit;
1944
- content: "";
1945
- display: block;
1946
- height: 40px;
1947
- position: absolute;
1948
- width: calc(100% - 73px);
1949
- }
1950
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1951
- 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");
1952
- background-position: bottom right;
1953
- background-size: cover;
1954
- content: "";
1955
- height: 40px;
1956
- display: block;
1957
- position: absolute;
1958
- width: 73.4px;
1959
- }
1960
- .ilo--card--stat.ilo--card--turquoise {
1961
- background: rgb(5, 210, 210);
1962
- }
1963
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1964
- background: inherit;
1965
- content: "";
1966
- display: block;
1967
- height: 40px;
1968
- position: absolute;
1969
- width: calc(100% - 73px);
1970
- }
1971
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1972
- 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");
1973
- background-position: bottom right;
1974
- background-size: cover;
1975
- content: "";
1976
- height: 40px;
1977
- display: block;
1978
- position: absolute;
1979
- width: 73.4px;
1980
- }
1981
- .ilo--card--stat .ilo--card--content {
1982
- display: flex;
1983
- flex-wrap: wrap;
1984
- height: 100%;
1985
- }
1986
- .right-to-left .ilo--card--stat .ilo--card--content {
1987
- flex-direction: row-reverse;
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);
1988
1648
  }
1989
- .ilo--card--stat .ilo--card--title {
1990
- color: rgb(35, 0, 80);
1991
- font-size: 36.45px;
1992
- letter-spacing: -0.035em;
1993
- line-height: 43.74px;
1994
- margin-bottom: 0.4278063594rem;
1995
- width: 100%;
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
+ }
1996
1656
  }
1997
- .ilo--card--stat .ilo--card--intro {
1998
- color: rgb(35, 0, 80);
1999
- font-family: Overpass;
2000
- font-size: 18.66px;
2001
- letter-spacing: normal;
2002
- line-height: 27.24px;
2003
- margin-bottom: 1.6734954235rem;
2004
- width: 100%;
1657
+ .ilo--card__type__multilink.ilo--card__size__standard {
1658
+ --max-width: 28.7245444802rem;
1659
+ padding: 2.5723472669rem 2.1436227224rem;
2005
1660
  }
2006
- .ilo--card--stat .ilo--link {
2007
- font-size: 11.94px;
2008
- letter-spacing: -0.02em;
2009
- line-height: 16.24px;
2010
- align-self: flex-end;
1661
+ @media screen and (min-width: 610px) {
1662
+ .ilo--card__type__multilink.ilo--card__size__standard {
1663
+ padding: 2.5723472669rem 2.1436227224rem;
1664
+ }
2011
1665
  }
2012
- .ilo--card--data {
2013
- background: rgb(235, 245, 253);
2014
- border-bottom: 0.1607717042rem solid #82afdc;
2015
- margin-top: 2.1436227224rem;
2016
- max-width: 32.154340836rem;
2017
- padding: 0 1.2861736334rem 3.0010718114rem;
2018
- position: relative;
1666
+ @media screen and (min-width: 1024px) {
1667
+ .ilo--card__type__multilink.ilo--card__size__standard {
1668
+ padding: 2.5723472669rem 2.1436227224rem;
1669
+ }
2019
1670
  }
2020
- .ilo--card--data::before {
2021
- background: inherit;
2022
- content: "";
2023
- display: block;
2024
- height: 40px;
2025
- position: absolute;
2026
- 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;
2027
1674
  }
2028
- .ilo--card--data::after {
2029
- 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");
2030
- background-position: bottom right;
2031
- background-size: cover;
2032
- content: "";
2033
- height: 40px;
2034
- display: block;
2035
- position: absolute;
2036
- 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
+ }
2037
1679
  }
2038
- .ilo--card--data:hover, .ilo--card--data:focus, .ilo--card--data:focus-within {
2039
- background: rgb(235, 245, 253);
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
+ }
2040
1684
  }
2041
- .ilo--card--data::before {
2042
- left: 0;
2043
- top: -2.127545552rem;
1685
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--image--wrapper {
1686
+ display: none;
2044
1687
  }
2045
- .right-to-left .ilo--card--data::before {
2046
- left: auto;
2047
- right: 0;
1688
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--content .ilo--card--image--wrapper {
1689
+ display: block;
1690
+ margin-bottom: 1.2861736334rem;
2048
1691
  }
2049
- .ilo--card--data::after {
2050
- right: 0;
2051
- top: -2.127545552rem;
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
+ }
2052
1699
  }
2053
- .right-to-left .ilo--card--data::after {
2054
- left: 0;
2055
- right: auto;
2056
- transform: rotateY(180deg);
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
+ }
1707
+ }
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;
2057
1711
  }
2058
1712
  @media screen and (min-width: 610px) {
2059
- .ilo--card--data::before {
2060
- background: inherit;
2061
- content: "";
2062
- display: block;
2063
- height: 48px;
2064
- position: absolute;
2065
- width: calc(100% - 84px);
1713
+ .ilo--card__type__multilink.ilo--card__size__wide, .ilo--card__type__multilink.ilo--card__size__fluid {
1714
+ padding: 3.0010718114rem 2.5723472669rem;
2066
1715
  }
2067
- .ilo--card--data::after {
2068
- 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");
2069
- background-position: bottom right;
2070
- background-size: cover;
2071
- content: "";
2072
- height: 48px;
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 {
2073
1730
  display: block;
2074
- position: absolute;
2075
- width: 84.4px;
1731
+ width: 50%;
2076
1732
  }
2077
- .ilo--card--data::before {
2078
- top: -2.5562700965rem;
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%;
2079
1735
  }
2080
- .ilo--card--data::after {
2081
- top: -2.5562700965rem;
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;
2082
1738
  }
2083
1739
  }
2084
- .ilo--card--data .ilo--card--image--wrapper {
2085
- display: none;
2086
- width: max(10.9860664523rem, 50%);
1740
+ .ilo--card__type__multilink .ilo--link-list {
1741
+ margin-top: 1.8756698821rem;
1742
+ position: relative;
1743
+ z-index: 3;
2087
1744
  }
2088
- .ilo--card--data .ilo--card--content .ilo--card--image--wrapper {
2089
- display: block;
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;
1758
+ background: rgb(235, 245, 253);
1759
+ border-bottom: 0.1607717042rem solid #82afdc;
1760
+ margin-top: 2.1436227224rem;
1761
+ padding: 1.2861736334rem 3.0010718114rem;
1762
+ position: relative;
1763
+ width: 100%;
1764
+ }
1765
+ .ilo--card__type__data:hover, .ilo--card__type__data:focus, .ilo--card__type__data:focus-within {
1766
+ background: rgb(235, 245, 253);
1767
+ }
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%);
1771
+ }
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%);
1775
+ }
1776
+ .ilo--card__type__data .ilo--card--image--wrapper {
1777
+ width: max(10.9860664523rem, 50%);
2090
1778
  }
2091
- .ilo--card--data--content-label {
1779
+ .ilo--card__type__data--content-label {
2092
1780
  font-size: 14.93px;
2093
1781
  letter-spacing: normal;
2094
1782
  line-height: 20.3px;
2095
1783
  margin-bottom: 0.6540478038rem;
2096
1784
  color: rgb(109, 109, 109);
2097
1785
  }
2098
- .ilo--card--data--content-copy {
1786
+ .ilo--card__type__data--content-copy {
2099
1787
  font-size: 23.32px;
2100
1788
  letter-spacing: -0.035em;
2101
1789
  line-height: 29.15px;
@@ -2104,175 +1792,161 @@
2104
1792
  font-family: Overpass;
2105
1793
  font-weight: 500;
2106
1794
  }
2107
- .ilo--card--data--content-files {
1795
+ .ilo--card__type__data--content-files {
2108
1796
  margin-bottom: 2.1436227224rem;
2109
1797
  }
2110
- .ilo--card--data .ilo--link {
1798
+ .ilo--card__type__data .ilo--link {
2111
1799
  font-size: 18.66px;
2112
1800
  letter-spacing: -0.035em;
2113
1801
  line-height: 24.26px;
2114
1802
  }
2115
- .ilo--card--data--file {
1803
+ .ilo--card__type__data--file {
2116
1804
  margin: 0.2143622722rem 0.4287245445rem 0.2143622722rem 0;
2117
1805
  }
2118
- .ilo--card--data--file:last-of-type {
1806
+ .ilo--card__type__data--file:last-of-type {
2119
1807
  margin-right: 0;
2120
1808
  }
2121
- .ilo--card--feature {
2122
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2123
- display: flex;
2124
- 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;
2125
1824
  position: relative;
1825
+ width: 100%;
1826
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2126
1827
  }
2127
- .ilo--card--feature::before {
2128
- display: none;
1828
+ .ilo--card__type__stat.ilo--card__color__blue {
1829
+ background: rgb(235, 245, 253);
2129
1830
  }
2130
- .ilo--card--feature.ilo--card--dark {
2131
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1831
+ .ilo--card__type__stat.ilo--card__color__yellow {
1832
+ background: rgb(255, 205, 45);
2132
1833
  }
2133
- .ilo--card--feature.ilo--card--dark .ilo--link-list {
2134
- 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);
2135
1836
  }
2136
- .ilo--card--feature.ilo--card--dark .ilo--link-list--link {
2137
- color: rgb(255, 255, 255);
2138
- 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);
2139
1839
  }
2140
- .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 {
2141
- color: rgb(30, 45, 190);
2142
- 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%;
2143
1844
  }
2144
- .ilo--card--feature picture::before {
2145
- transition-property: opacity;
2146
- transition-duration: 150ms;
2147
- transition-timing-function: ease-out;
1845
+ .right-to-left .ilo--card__type__stat .ilo--card--content {
1846
+ flex-direction: row-reverse;
2148
1847
  }
2149
- .ilo--card--feature:hover, .ilo--card--feature:focus, .ilo--card--feature:focus-within {
2150
- background-color: rgb(255, 255, 255);
2151
- 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));
2152
- 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%;
2153
1855
  }
2154
- .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before, .ilo--card--feature:focus-within picture::before {
2155
- opacity: 0.4;
2156
- z-index: 1;
2157
- transition-property: opacity;
2158
- transition-duration: 150ms;
2159
- 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%;
2160
1864
  }
2161
- .ilo--card--feature:hover .ilo--card--image, .ilo--card--feature:focus .ilo--card--image, .ilo--card--feature:focus-within .ilo--card--image {
2162
- 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;
2163
1870
  }
2164
- .ilo--card--feature .ilo--link-list {
2165
- border-top: 0.1071811361rem solid rgb(237, 240, 242);
2166
- margin-left: -1.2861736334rem;
2167
- margin-right: -1.2861736334rem;
2168
- margin-top: 1.822079314rem;
2169
- position: relative;
2170
- 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%);
2171
1887
  }
2172
- .ilo--card--feature .ilo--link-list--link, .ilo--card--feature .ilo--link-list--link:hover {
2173
- border-bottom: none;
2174
- padding-left: 1.2861736334rem;
2175
- padding-right: 1.2861736334rem;
1888
+ @media screen and (min-width: 1024px) {
1889
+ .ilo--card__type__factlist {
1890
+ padding: 2.1436227224rem 3.0010718114rem;
1891
+ }
2176
1892
  }
2177
- .ilo--card--feature.ilo--card--narrow .ilo--card--wrap, .ilo--card--feature.ilo--card--standard .ilo--card--wrap {
2178
- display: flex;
2179
- flex-wrap: wrap;
2180
- width: 100%;
1893
+ .ilo--card__type__factlist.ilo--card__size__wide {
1894
+ --max-width: 45.8735262594rem;
1895
+ padding: 2.1436227224rem 2.7867095391rem;
2181
1896
  }
2182
- .ilo--card--feature.ilo--card--narrow .ilo--card--content, .ilo--card--feature.ilo--card--standard .ilo--card--content {
2183
- 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
+ }
2184
1902
  }
2185
- .ilo--card--feature.ilo--card--narrow .ilo--card--image--wrapper, .ilo--card--feature.ilo--card--standard .ilo--card--image--wrapper {
2186
- 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%);
2187
1907
  }
2188
1908
  @media screen and (min-width: 610px) {
2189
- .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2190
- flex-direction: row;
2191
- }
2192
- .right-to-left .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2193
- flex-direction: row-reverse;
2194
- }
2195
- .ilo--card--feature.ilo--card--wide .ilo--card--content {
2196
- display: flex;
2197
- flex-direction: row;
2198
- flex-wrap: wrap;
2199
- position: relative;
2200
- width: 50%;
2201
- }
2202
- .ilo--card--feature.ilo--card--wide .ilo--card--image--wrapper {
2203
- width: 50%;
2204
- }
2205
- .ilo--card--feature.ilo--card--wide .ilo--card--image {
2206
- object-fit: cover;
2207
- }
2208
- .ilo--card--feature.ilo--card--wide .ilo--card--date {
2209
- align-self: flex-end;
2210
- width: 100%;
2211
- }
2212
- .ilo--card--feature.ilo--card--wide .ilo--card--eyebrow {
2213
- width: 100%;
2214
- }
2215
- .ilo--card--feature.ilo--card--wide .ilo--card--title {
2216
- width: 100%;
2217
- }
2218
- .ilo--card--feature.ilo--card--wide .ilo--link-list {
2219
- width: calc(100% + 48px);
1909
+ .ilo--card__type__factlist.ilo--card__size__narrow {
1910
+ padding: 1.2861736334rem 2.5723472669rem;
2220
1911
  }
2221
1912
  }
2222
- .ilo--card--feature .ilo--card--wrap {
2223
- display: flex;
2224
- flex-direction: column;
2225
- width: 100%;
1913
+ .ilo--card__type__factlist.ilo--card__theme__dark {
1914
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
2226
1915
  }
2227
- .ilo--card--feature picture {
2228
- display: flex;
2229
- height: 100%;
2230
- position: relative;
1916
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--card--title {
1917
+ color: rgb(255, 255, 255);
2231
1918
  }
2232
- .ilo--card--feature picture::before {
2233
- background-color: rgb(30, 45, 190);
2234
- content: "";
2235
- display: block;
2236
- height: 100%;
2237
- left: 0;
2238
- opacity: 0;
2239
- position: absolute;
2240
- top: 0;
2241
- transition: opacity 150ms ease-in-out;
2242
- width: 100%;
2243
- z-index: -1;
1919
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item {
1920
+ color: rgb(255, 255, 255);
2244
1921
  }
2245
- .ilo--card--feature .ilo--card--content {
2246
- display: flex;
2247
- flex: 1 1 auto;
2248
- flex-direction: column;
2249
- 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;
2250
1924
  }
2251
- .ilo--card--feature.ilo--card--linklist .ilo--card--content {
2252
- 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);
1927
+ }
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);
2253
1930
  }
2254
- .ilo--card--feature .ilo--card--title {
1931
+ .ilo--card__type__factlist .ilo--card--title {
1932
+ color: rgb(45, 45, 45);
2255
1933
  font-size: 23.32px;
2256
1934
  letter-spacing: -0.035em;
2257
1935
  line-height: 29.15px;
2258
- margin-bottom: 1.5763397642rem;
2259
- font-family: Overpass;
2260
- font-weight: 700;
2261
- }
2262
- .ilo--card--feature .ilo--card--eyebrow {
2263
- font-size: 14.93px;
2264
- letter-spacing: normal;
2265
- line-height: 19.71px;
2266
- margin-bottom: 0.3376482577rem;
1936
+ margin-bottom: 1.1476152197rem;
2267
1937
  }
2268
- .ilo--card--feature .ilo--card--date {
2269
- margin-bottom: 0;
2270
- 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
+ }
2271
1945
  }
2272
1946
 
2273
1947
  /**
2274
1948
  * Do not edit directly
2275
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
1949
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2276
1950
  */
2277
1951
  /**
2278
1952
  * TOKENS:
@@ -2280,34 +1954,29 @@
2280
1954
  /**
2281
1955
  * MAPS:
2282
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
+ }
2283
1969
  .ilo--cardgroup--inner {
2284
1970
  display: flex;
2285
- flex-wrap: wrap;
2286
- justify-content: space-between;
1971
+ flex-flow: row wrap;
1972
+ justify-content: center;
2287
1973
  margin: auto;
2288
- row-gap: 1.7148981779rem;
1974
+ gap: 1.7148981779rem;
1975
+ width: 100%;
2289
1976
  }
2290
1977
  .right-to-left .ilo--cardgroup--inner {
2291
1978
  flex-direction: row-reverse;
2292
1979
  }
2293
- .ilo--cardgroup--inner .ilo--card {
2294
- width: 100%;
2295
- }
2296
- @media screen and (min-width: 1024px) {
2297
- .ilo--cardgroup--two .ilo--card {
2298
- width: calc(50% - 24px);
2299
- }
2300
- }
2301
- @media screen and (min-width: 1024px) {
2302
- .ilo--cardgroup--three .ilo--card {
2303
- width: calc(33.333% - 24px);
2304
- }
2305
- }
2306
- @media screen and (min-width: 1024px) {
2307
- .ilo--cardgroup--four .ilo--card {
2308
- width: calc(25% - 24px);
2309
- }
2310
- }
2311
1980
  .ilo--cardgroup--button-wrap {
2312
1981
  display: flex;
2313
1982
  justify-content: center;
@@ -2317,7 +1986,7 @@
2317
1986
 
2318
1987
  /**
2319
1988
  * Do not edit directly
2320
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
1989
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2321
1990
  */
2322
1991
  /**
2323
1992
  * TOKENS:
@@ -2422,7 +2091,7 @@
2422
2091
 
2423
2092
  /**
2424
2093
  * Do not edit directly
2425
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2094
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2426
2095
  */
2427
2096
  /**
2428
2097
  * TOKENS:
@@ -2503,7 +2172,7 @@
2503
2172
 
2504
2173
  /**
2505
2174
  * Do not edit directly
2506
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2175
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2507
2176
  */
2508
2177
  /**
2509
2178
  * TOKENS:
@@ -2513,7 +2182,7 @@
2513
2182
  */
2514
2183
  /**
2515
2184
  * Do not edit directly
2516
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2185
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2517
2186
  */
2518
2187
  /**
2519
2188
  * TOKENS:
@@ -2523,7 +2192,7 @@
2523
2192
  */
2524
2193
  /**
2525
2194
  * Do not edit directly
2526
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2195
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2527
2196
  */
2528
2197
  /**
2529
2198
  * TOKENS:
@@ -2533,7 +2202,7 @@
2533
2202
  */
2534
2203
  /**
2535
2204
  * Do not edit directly
2536
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2205
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2537
2206
  */
2538
2207
  /**
2539
2208
  * TOKENS:
@@ -2659,7 +2328,7 @@
2659
2328
 
2660
2329
  /**
2661
2330
  * Do not edit directly
2662
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2331
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2663
2332
  */
2664
2333
  /**
2665
2334
  * TOKENS:
@@ -2687,7 +2356,7 @@
2687
2356
 
2688
2357
  /**
2689
2358
  * Do not edit directly
2690
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2359
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2691
2360
  */
2692
2361
  /**
2693
2362
  * TOKENS:
@@ -2775,7 +2444,7 @@
2775
2444
 
2776
2445
  /**
2777
2446
  * Do not edit directly
2778
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2447
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2779
2448
  */
2780
2449
  /**
2781
2450
  * TOKENS:
@@ -2785,7 +2454,7 @@
2785
2454
  */
2786
2455
  /**
2787
2456
  * Do not edit directly
2788
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2457
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2789
2458
  */
2790
2459
  /**
2791
2460
  * TOKENS:
@@ -2795,7 +2464,7 @@
2795
2464
  */
2796
2465
  /**
2797
2466
  * Do not edit directly
2798
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2467
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2799
2468
  */
2800
2469
  /**
2801
2470
  * TOKENS:
@@ -2848,7 +2517,7 @@
2848
2517
 
2849
2518
  /**
2850
2519
  * Do not edit directly
2851
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2520
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2852
2521
  */
2853
2522
  /**
2854
2523
  * TOKENS:
@@ -2923,7 +2592,7 @@
2923
2592
 
2924
2593
  /**
2925
2594
  * Do not edit directly
2926
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2595
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
2927
2596
  */
2928
2597
  /**
2929
2598
  * TOKENS:
@@ -3029,7 +2698,7 @@
3029
2698
 
3030
2699
  /**
3031
2700
  * Do not edit directly
3032
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2701
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3033
2702
  */
3034
2703
  /**
3035
2704
  * TOKENS:
@@ -3052,7 +2721,7 @@
3052
2721
 
3053
2722
  /**
3054
2723
  * Do not edit directly
3055
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2724
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3056
2725
  */
3057
2726
  /**
3058
2727
  * TOKENS:
@@ -3066,7 +2735,7 @@
3066
2735
 
3067
2736
  /**
3068
2737
  * Do not edit directly
3069
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2738
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3070
2739
  */
3071
2740
  /**
3072
2741
  * TOKENS:
@@ -3076,7 +2745,7 @@
3076
2745
  */
3077
2746
  /**
3078
2747
  * Do not edit directly
3079
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2748
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3080
2749
  */
3081
2750
  /**
3082
2751
  * TOKENS:
@@ -3101,7 +2770,7 @@
3101
2770
  }
3102
2771
  /**
3103
2772
  * Do not edit directly
3104
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
2773
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3105
2774
  */
3106
2775
  /**
3107
2776
  * TOKENS:
@@ -3425,7 +3094,7 @@
3425
3094
 
3426
3095
  /**
3427
3096
  * Do not edit directly
3428
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3097
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3429
3098
  */
3430
3099
  /**
3431
3100
  * TOKENS:
@@ -3548,7 +3217,7 @@
3548
3217
 
3549
3218
  /**
3550
3219
  * Do not edit directly
3551
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3220
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3552
3221
  */
3553
3222
  /**
3554
3223
  * TOKENS:
@@ -3754,7 +3423,7 @@
3754
3423
 
3755
3424
  /**
3756
3425
  * Do not edit directly
3757
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3426
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3758
3427
  */
3759
3428
  /**
3760
3429
  * TOKENS:
@@ -3765,7 +3434,7 @@
3765
3434
  .ilo--hero-card {
3766
3435
  height: 100%;
3767
3436
  position: relative;
3768
- padding: 39px 16px;
3437
+ padding: 40px 16px;
3769
3438
  }
3770
3439
  @media screen and (min-width: 1024px) {
3771
3440
  .ilo--hero-card {
@@ -3810,12 +3479,7 @@
3810
3479
  }
3811
3480
  }
3812
3481
  .ilo--hero-card__cornercut {
3813
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 39px, 100% 100%, 0 100%);
3814
- }
3815
- @media screen and (min-width: 1024px) {
3816
- .ilo--hero-card__cornercut {
3817
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 64px, 100% 100%, 0 100%);
3818
- }
3482
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
3819
3483
  }
3820
3484
  .ilo--hero-card--datecopy {
3821
3485
  font-size: 16px;
@@ -3880,7 +3544,7 @@
3880
3544
 
3881
3545
  /**
3882
3546
  * Do not edit directly
3883
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3547
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3884
3548
  */
3885
3549
  /**
3886
3550
  * TOKENS:
@@ -3936,7 +3600,7 @@
3936
3600
 
3937
3601
  /**
3938
3602
  * Do not edit directly
3939
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3603
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
3940
3604
  */
3941
3605
  /**
3942
3606
  * TOKENS:
@@ -4078,7 +3742,7 @@
4078
3742
 
4079
3743
  /**
4080
3744
  * Do not edit directly
4081
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3745
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4082
3746
  */
4083
3747
  /**
4084
3748
  * TOKENS:
@@ -4088,7 +3752,7 @@
4088
3752
  */
4089
3753
  /**
4090
3754
  * Do not edit directly
4091
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3755
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4092
3756
  */
4093
3757
  /**
4094
3758
  * TOKENS:
@@ -4113,7 +3777,7 @@
4113
3777
  }
4114
3778
  /**
4115
3779
  * Do not edit directly
4116
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3780
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4117
3781
  */
4118
3782
  /**
4119
3783
  * TOKENS:
@@ -4271,7 +3935,7 @@
4271
3935
 
4272
3936
  /**
4273
3937
  * Do not edit directly
4274
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
3938
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4275
3939
  */
4276
3940
  /**
4277
3941
  * TOKENS:
@@ -4366,7 +4030,7 @@
4366
4030
 
4367
4031
  /**
4368
4032
  * Do not edit directly
4369
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4033
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4370
4034
  */
4371
4035
  /**
4372
4036
  * TOKENS:
@@ -4376,7 +4040,7 @@
4376
4040
  */
4377
4041
  /**
4378
4042
  * Do not edit directly
4379
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4043
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4380
4044
  */
4381
4045
  /**
4382
4046
  * TOKENS:
@@ -4386,7 +4050,7 @@
4386
4050
  */
4387
4051
  /**
4388
4052
  * Do not edit directly
4389
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4053
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4390
4054
  */
4391
4055
  /**
4392
4056
  * TOKENS:
@@ -4557,7 +4221,7 @@
4557
4221
 
4558
4222
  /**
4559
4223
  * Do not edit directly
4560
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4224
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4561
4225
  */
4562
4226
  /**
4563
4227
  * TOKENS:
@@ -4604,7 +4268,7 @@
4604
4268
 
4605
4269
  /**
4606
4270
  * Do not edit directly
4607
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4271
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4608
4272
  */
4609
4273
  /**
4610
4274
  * TOKENS:
@@ -4614,7 +4278,7 @@
4614
4278
  */
4615
4279
  /**
4616
4280
  * Do not edit directly
4617
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4281
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4618
4282
  */
4619
4283
  /**
4620
4284
  * TOKENS:
@@ -4624,7 +4288,7 @@
4624
4288
  */
4625
4289
  /**
4626
4290
  * Do not edit directly
4627
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4291
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4628
4292
  */
4629
4293
  /**
4630
4294
  * TOKENS:
@@ -4721,7 +4385,7 @@
4721
4385
 
4722
4386
  /**
4723
4387
  * Do not edit directly
4724
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
4388
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
4725
4389
  */
4726
4390
  /**
4727
4391
  * TOKENS:
@@ -5611,7 +5275,7 @@
5611
5275
 
5612
5276
  /**
5613
5277
  * Do not edit directly
5614
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5278
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5615
5279
  */
5616
5280
  /**
5617
5281
  * TOKENS:
@@ -5621,7 +5285,7 @@
5621
5285
  */
5622
5286
  /**
5623
5287
  * Do not edit directly
5624
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5288
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5625
5289
  */
5626
5290
  /**
5627
5291
  * TOKENS:
@@ -5631,7 +5295,7 @@
5631
5295
  */
5632
5296
  /**
5633
5297
  * Do not edit directly
5634
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5298
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5635
5299
  */
5636
5300
  /**
5637
5301
  * TOKENS:
@@ -5823,7 +5487,7 @@
5823
5487
 
5824
5488
  /**
5825
5489
  * Do not edit directly
5826
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5490
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5827
5491
  */
5828
5492
  /**
5829
5493
  * TOKENS:
@@ -5963,7 +5627,7 @@
5963
5627
 
5964
5628
  /**
5965
5629
  * Do not edit directly
5966
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5630
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5967
5631
  */
5968
5632
  /**
5969
5633
  * TOKENS:
@@ -5973,7 +5637,7 @@
5973
5637
  */
5974
5638
  /**
5975
5639
  * Do not edit directly
5976
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5640
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
5977
5641
  */
5978
5642
  /**
5979
5643
  * TOKENS:
@@ -5998,7 +5662,7 @@
5998
5662
  }
5999
5663
  /**
6000
5664
  * Do not edit directly
6001
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5665
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6002
5666
  */
6003
5667
  /**
6004
5668
  * TOKENS:
@@ -6165,7 +5829,7 @@
6165
5829
 
6166
5830
  /**
6167
5831
  * Do not edit directly
6168
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5832
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6169
5833
  */
6170
5834
  /**
6171
5835
  * TOKENS:
@@ -6272,7 +5936,7 @@
6272
5936
 
6273
5937
  /**
6274
5938
  * Do not edit directly
6275
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5939
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6276
5940
  */
6277
5941
  /**
6278
5942
  * TOKENS:
@@ -6282,7 +5946,7 @@
6282
5946
  */
6283
5947
  /**
6284
5948
  * Do not edit directly
6285
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5949
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6286
5950
  */
6287
5951
  /**
6288
5952
  * TOKENS:
@@ -6307,7 +5971,7 @@
6307
5971
  }
6308
5972
  /**
6309
5973
  * Do not edit directly
6310
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
5974
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6311
5975
  */
6312
5976
  /**
6313
5977
  * TOKENS:
@@ -6368,7 +6032,7 @@
6368
6032
 
6369
6033
  /**
6370
6034
  * Do not edit directly
6371
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
6035
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6372
6036
  */
6373
6037
  /**
6374
6038
  * TOKENS:
@@ -6783,7 +6447,7 @@
6783
6447
 
6784
6448
  /**
6785
6449
  * Do not edit directly
6786
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
6450
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6787
6451
  */
6788
6452
  /**
6789
6453
  * TOKENS:
@@ -6837,7 +6501,7 @@
6837
6501
 
6838
6502
  /**
6839
6503
  * Do not edit directly
6840
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
6504
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6841
6505
  */
6842
6506
  /**
6843
6507
  * TOKENS:
@@ -6995,7 +6659,7 @@
6995
6659
 
6996
6660
  /**
6997
6661
  * Do not edit directly
6998
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
6662
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
6999
6663
  */
7000
6664
  /**
7001
6665
  * TOKENS:
@@ -7346,7 +7010,7 @@
7346
7010
 
7347
7011
  /**
7348
7012
  * Do not edit directly
7349
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
7013
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7350
7014
  */
7351
7015
  /**
7352
7016
  * TOKENS:
@@ -7532,7 +7196,7 @@
7532
7196
 
7533
7197
  /**
7534
7198
  * Do not edit directly
7535
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
7199
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7536
7200
  */
7537
7201
  /**
7538
7202
  * TOKENS:
@@ -7590,7 +7254,7 @@
7590
7254
 
7591
7255
  /**
7592
7256
  * Do not edit directly
7593
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
7257
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7594
7258
  */
7595
7259
  /**
7596
7260
  * TOKENS:
@@ -7764,7 +7428,7 @@
7764
7428
 
7765
7429
  /**
7766
7430
  * Do not edit directly
7767
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
7431
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7768
7432
  */
7769
7433
  /**
7770
7434
  * TOKENS:
@@ -7939,7 +7603,7 @@
7939
7603
 
7940
7604
  /**
7941
7605
  * Do not edit directly
7942
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
7606
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
7943
7607
  */
7944
7608
  /**
7945
7609
  * TOKENS:
@@ -8849,7 +8513,7 @@
8849
8513
 
8850
8514
  /**
8851
8515
  * Do not edit directly
8852
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
8516
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
8853
8517
  */
8854
8518
  /**
8855
8519
  * TOKENS:
@@ -8859,7 +8523,7 @@
8859
8523
  */
8860
8524
  /**
8861
8525
  * Do not edit directly
8862
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
8526
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
8863
8527
  */
8864
8528
  /**
8865
8529
  * TOKENS:
@@ -8884,7 +8548,7 @@
8884
8548
  }
8885
8549
  /**
8886
8550
  * Do not edit directly
8887
- * Generated on Fri, 21 Jul 2023 14:22:03 GMT
8551
+ * Generated on Fri, 04 Aug 2023 16:55:28 GMT
8888
8552
  */
8889
8553
  /**
8890
8554
  * TOKENS: