@ilo-org/styles 0.6.1 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/build/css/components/index.css +782 -1092
  2. package/build/css/components/index.css.map +1 -1
  3. package/build/css/global.css +1 -1
  4. package/build/css/index.css +782 -1092
  5. package/build/css/index.css.map +1 -1
  6. package/build/css/monorepo.css +782 -1092
  7. package/build/css/monorepo.css.map +1 -1
  8. package/build/minified/index.css +1 -1
  9. package/build/minified/index.css.map +1 -1
  10. package/build/minified/monorepo.css +1 -1
  11. package/build/minified/monorepo.css.map +1 -1
  12. package/css/components/card.css +1 -1
  13. package/css/components/cardgroup.css +1 -1
  14. package/css/components/herocard.css +1 -1
  15. package/css/global.css.map +1 -1
  16. package/css/index.css +1 -1
  17. package/css/index.css.map +1 -1
  18. package/css/monorepo.css +1 -1
  19. package/css/monorepo.css.map +1 -1
  20. package/package.json +1 -1
  21. package/scss/_mixins.scss +19 -20
  22. package/scss/components/_card.scss +79 -1376
  23. package/scss/components/_cardgroup.scss +66 -24
  24. package/scss/components/_datacard.scss +90 -0
  25. package/scss/components/_detailcard.scss +150 -0
  26. package/scss/components/_factlistcard.scss +110 -0
  27. package/scss/components/_featurecard.scss +218 -0
  28. package/scss/components/_herocard.scss +3 -19
  29. package/scss/components/_multilinkcard.scss +189 -0
  30. package/scss/components/_promocard.scss +157 -0
  31. package/scss/components/_statcard.scss +76 -0
  32. package/scss/components/_textcard.scss +135 -0
  33. package/scss/components/index.scss +8 -0
  34. package/css/components/experiment.css +0 -1
  35. package/css/components/formcontrol.css +0 -1
  36. package/css/components/textinput.css +0 -1
  37. package/css/components/toggle.css +0 -1
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
13
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
132
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
157
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
411
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
421
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
446
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
736
+ * Generated on Wed, 16 Aug 2023 08:41:51 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 Mon, 07 Aug 2023 16:13:26 GMT
866
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
867
867
  */
868
868
  /**
869
869
  * TOKENS:
@@ -872,37 +872,75 @@
872
872
  * MAPS:
873
873
  */
874
874
  .ilo--card {
875
- margin: 0;
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;
876
882
  }
877
883
  .right-to-left .ilo--card {
878
884
  text-align: right;
879
885
  }
880
- .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 {
881
887
  background: rgb(255, 255, 255);
882
- color: rgb(30, 45, 190);
883
888
  outline: none;
884
889
  text-decoration: none;
885
890
  }
886
- .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 {
887
892
  background: rgb(255, 255, 255);
888
893
  }
889
- .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 {
890
- 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");
891
- }
892
- .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 {
893
907
  color: rgb(30, 45, 190);
894
908
  }
895
- .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 {
896
- color: rgb(30, 45, 190);
909
+ .ilo--card__theme__light {
910
+ background: rgb(255, 255, 255);
897
911
  }
898
- .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 {
899
- color: rgb(30, 45, 190);
912
+ .ilo--card__theme__dark {
913
+ background: rgb(35, 0, 80);
914
+ transition: background 150ms ease-out;
900
915
  }
901
- .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 {
902
- 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;
903
923
  }
904
- .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 {
905
- 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));
906
944
  }
907
945
  .ilo--card--link {
908
946
  background: none;
@@ -924,6 +962,21 @@
924
962
  transition-duration: 150ms;
925
963
  transition-timing-function: ease-out;
926
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
+ }
927
980
  .ilo--card--link--text {
928
981
  width: 1px;
929
982
  height: 1px;
@@ -934,176 +987,6 @@
934
987
  clip: rect(0 0 0 0);
935
988
  overflow: hidden;
936
989
  }
937
- .ilo--card--light {
938
- background: rgb(255, 255, 255);
939
- }
940
- .ilo--card--dark:not(.ilo--card--detail):not(.ilo--card--data):not(.ilo--card--multilink):not(:hover):not(:focus):not(:focus-within) {
941
- background: rgb(35, 0, 80);
942
- outline: none;
943
- transition: background 150ms ease-out;
944
- }
945
- .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 {
946
- color: rgb(237, 240, 242);
947
- transition: color 150ms ease-out;
948
- }
949
- .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 {
950
- color: rgb(255, 255, 255);
951
- transition: color 150ms ease-out;
952
- }
953
- .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 {
954
- color: rgb(237, 240, 242);
955
- transition: color 150ms ease-out;
956
- }
957
- .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 {
958
- color: rgb(237, 240, 242);
959
- transition: color 150ms ease-out;
960
- }
961
- .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 {
962
- color: rgb(237, 240, 242);
963
- transition: color 150ms ease-out;
964
- }
965
- .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 {
966
- background: rgb(35, 0, 80);
967
- outline: none;
968
- transition: background 150ms ease-out;
969
- }
970
- .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 {
971
- color: rgb(237, 240, 242);
972
- transition: color 150ms ease-out;
973
- }
974
- .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 {
975
- color: rgb(255, 255, 255);
976
- transition: color 150ms ease-out;
977
- }
978
- .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 {
979
- color: rgb(237, 240, 242);
980
- transition: color 150ms ease-out;
981
- }
982
- .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 {
983
- color: rgb(237, 240, 242);
984
- transition: color 150ms ease-out;
985
- }
986
- .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 {
987
- color: rgb(237, 240, 242);
988
- transition: color 150ms ease-out;
989
- }
990
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data) {
991
- margin-top: 2.1436227224rem;
992
- padding-top: 0;
993
- position: relative;
994
- }
995
- .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 {
996
- background: inherit;
997
- content: "";
998
- display: block;
999
- height: 40px;
1000
- position: absolute;
1001
- width: calc(100% - 73px);
1002
- }
1003
- .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 {
1004
- 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");
1005
- background-position: bottom right;
1006
- background-size: cover;
1007
- content: "";
1008
- height: 40px;
1009
- display: block;
1010
- position: absolute;
1011
- width: 73.4px;
1012
- }
1013
- .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 {
1014
- 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");
1015
- }
1016
- @media screen and (min-width: 610px) {
1017
- .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) {
1018
- margin-top: 2.5723472669rem;
1019
- }
1020
- .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 {
1021
- background: inherit;
1022
- content: "";
1023
- display: block;
1024
- height: 48px;
1025
- position: absolute;
1026
- width: calc(100% - 87px);
1027
- }
1028
- .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 {
1029
- 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");
1030
- background-position: bottom right;
1031
- background-size: cover;
1032
- content: "";
1033
- height: 48px;
1034
- display: block;
1035
- position: absolute;
1036
- width: 87.4px;
1037
- }
1038
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data).ilo--card--dark::after {
1039
- 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");
1040
- }
1041
- }
1042
- @media screen and (min-width: 1024px) {
1043
- .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) {
1044
- margin-top: 3.4297963558rem;
1045
- }
1046
- .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 {
1047
- background: inherit;
1048
- content: "";
1049
- display: block;
1050
- height: 64px;
1051
- position: absolute;
1052
- width: calc(100% - 116px);
1053
- }
1054
- .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 {
1055
- 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");
1056
- background-position: bottom right;
1057
- background-size: cover;
1058
- content: "";
1059
- height: 64px;
1060
- display: block;
1061
- position: absolute;
1062
- width: 116.4px;
1063
- }
1064
- .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 {
1065
- 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");
1066
- }
1067
- }
1068
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1069
- left: 0;
1070
- top: -2.1436227224rem;
1071
- transition: background-image 150ms ease-out;
1072
- }
1073
- .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 {
1074
- left: auto;
1075
- right: 0;
1076
- }
1077
- @media screen and (min-width: 610px) {
1078
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::before {
1079
- top: -2.5562700965rem;
1080
- }
1081
- }
1082
- @media screen and (min-width: 1024px) {
1083
- .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 {
1084
- top: -3.4137191854rem;
1085
- }
1086
- }
1087
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1088
- right: 0;
1089
- top: -2.1436227224rem;
1090
- transition: background-image 150ms ease-out;
1091
- }
1092
- .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 {
1093
- left: 0;
1094
- right: auto;
1095
- transform: rotateY(180deg);
1096
- }
1097
- @media screen and (min-width: 610px) {
1098
- .ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature):not(.ilo--card--graphic):not(.ilo--card--stat):not(.ilo--card--data)::after {
1099
- top: -2.5562700965rem;
1100
- }
1101
- }
1102
- @media screen and (min-width: 1024px) {
1103
- .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 {
1104
- top: -3.4137191854rem;
1105
- }
1106
- }
1107
990
  .ilo--card--eyebrow {
1108
991
  color: rgb(150, 10, 85);
1109
992
  font-size: 16px;
@@ -1176,7 +1059,7 @@
1176
1059
  line-height: 23.36px;
1177
1060
  margin-bottom: 1.3742266073rem;
1178
1061
  }
1179
- .ilo--card--image {
1062
+ .ilo--card--picture {
1180
1063
  max-width: 100%;
1181
1064
  width: 100%;
1182
1065
  }
@@ -1184,190 +1067,131 @@
1184
1067
  position: relative;
1185
1068
  z-index: 2;
1186
1069
  }
1187
- .ilo--card--isvideo .ilo--card--image--wrapper {
1070
+
1071
+ /**
1072
+ * Do not edit directly
1073
+ * Generated on Wed, 16 Aug 2023 08:41:51 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;
1188
1086
  position: relative;
1189
1087
  }
1190
- .ilo--card--isvideo .ilo--card--image--wrapper::before {
1191
- 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");
1192
- background-color: rgb(45, 45, 45);
1193
- background-position: center;
1194
- background-size: 18px 20px;
1195
- background-repeat: no-repeat;
1196
- content: "";
1197
- display: block;
1198
- height: 40px;
1199
- left: 0;
1200
- position: absolute;
1201
- top: 0;
1202
- width: 40px;
1203
- z-index: 1;
1088
+ .ilo--card__type__feature.ilo--card__theme__dark {
1089
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1204
1090
  }
1205
- .ilo--card--multilink {
1206
- 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);
1207
1093
  }
1208
- .ilo--card--multilink .ilo--card--image--wrapper {
1209
- 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");
1210
1097
  }
1211
- .ilo--card--multilink .ilo--card--content .ilo--card--image--wrapper {
1212
- 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");
1213
1101
  }
1214
- @media screen and (min-width: 610px) {
1215
- .ilo--card--multilink {
1216
- padding: 2.1436227224rem;
1217
- }
1102
+ .ilo--card__type__feature picture::before {
1103
+ transition-property: opacity;
1104
+ transition-duration: 150ms;
1105
+ transition-timing-function: ease-out;
1218
1106
  }
1219
- @media screen and (min-width: 1024px) {
1220
- .ilo--card--multilink {
1221
- padding: 3.0010718114rem 2.5723472669rem;
1222
- }
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));
1223
1111
  }
1224
- .ilo--card--multilink .ilo--card--title {
1225
- font-size: 23.32px;
1226
- letter-spacing: -0.035em;
1227
- line-height: 29.15px;
1228
- margin-bottom: 0.7188906752rem;
1229
- 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;
1230
1118
  }
1231
- @media screen and (min-width: 610px) {
1232
- .ilo--card--multilink .ilo--card--title {
1233
- font-size: 29.16px;
1234
- letter-spacing: -0.035em;
1235
- line-height: 36.45px;
1236
- margin-bottom: 0.5741425509rem;
1237
- }
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);
1238
1121
  }
1239
- .ilo--card--multilink .ilo--card--intro {
1240
- font-size: 16px;
1241
- letter-spacing: normal;
1242
- line-height: 23.36px;
1243
- margin-bottom: 1.910132288rem;
1244
- 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;
1245
1129
  }
1246
- @media screen and (min-width: 610px) {
1247
- .ilo--card--multilink .ilo--card--intro {
1248
- font-size: 18.66px;
1249
- letter-spacing: normal;
1250
- line-height: 27.24px;
1251
- margin-bottom: 1.8685411561rem;
1252
- }
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;
1253
1134
  }
1254
- .ilo--card--multilink.ilo--card--dark {
1255
- 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%;
1256
1139
  }
1257
- .ilo--card--multilink.ilo--card--dark .ilo--card--title {
1258
- color: rgb(45, 45, 45);
1140
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--content {
1141
+ width: 100%;
1259
1142
  }
1260
- .ilo--card--multilink.ilo--card--dark .ilo--card--intro {
1261
- color: rgb(45, 45, 45);
1143
+ .ilo--card__type__feature.ilo--card__size__narrow .ilo--card--image--wrapper {
1144
+ width: 100%;
1262
1145
  }
1263
- .ilo--card--multilink.ilo--card--wide {
1264
- 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;
1265
1148
  }
1266
1149
  @media screen and (min-width: 610px) {
1267
- .ilo--card--multilink.ilo--card--wide {
1268
- padding: 3.0010718114rem 2.5723472669rem;
1269
- }
1270
- .ilo--card--multilink.ilo--card--wide.ilo--card--right .ilo--card--wrap {
1271
- flex-direction: row-reverse;
1272
- }
1273
- .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 {
1274
1151
  flex-direction: row;
1275
1152
  }
1276
- .ilo--card--multilink.ilo--card--wide .ilo--card--wrap {
1277
- display: flex;
1278
- column-gap: 1.7148981779rem;
1279
- }
1280
- .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 {
1281
1154
  flex-direction: row-reverse;
1282
1155
  }
1283
- .ilo--card--multilink.ilo--card--wide .ilo--card--image--wrapper {
1284
- 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;
1285
1161
  width: 50%;
1286
1162
  }
1287
- .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 {
1288
1164
  width: 50%;
1289
1165
  }
1290
- .ilo--card--multilink.ilo--card--wide .ilo--card--content .ilo--card--image--wrapper {
1291
- 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;
1292
1168
  }
1293
- }
1294
- .ilo--card--multilink.ilo--card--standard {
1295
- padding: 2.5723472669rem 2.1436227224rem;
1296
- }
1297
- @media screen and (min-width: 610px) {
1298
- .ilo--card--multilink.ilo--card--standard {
1299
- padding: 2.5723472669rem 2.1436227224rem;
1300
- }
1301
- }
1302
- @media screen and (min-width: 1024px) {
1303
- .ilo--card--multilink.ilo--card--standard {
1304
- padding: 2.5723472669rem 2.1436227224rem;
1305
- }
1306
- }
1307
- .ilo--card--multilink.ilo--card--narrow {
1308
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1309
- }
1310
- @media screen and (min-width: 610px) {
1311
- .ilo--card--multilink.ilo--card--narrow {
1312
- padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
1313
- }
1314
- }
1315
- @media screen and (min-width: 1024px) {
1316
- .ilo--card--multilink.ilo--card--narrow {
1317
- 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%;
1318
1172
  }
1319
- }
1320
- .ilo--card--multilink.ilo--card--narrow .ilo--card--image--wrapper {
1321
- display: none;
1322
- }
1323
- .ilo--card--multilink.ilo--card--narrow .ilo--card--content .ilo--card--image--wrapper {
1324
- display: block;
1325
- margin-bottom: 1.2861736334rem;
1326
- }
1327
- @media screen and (min-width: 610px) {
1328
- .ilo--card--multilink.ilo--card--narrow .ilo--card--title {
1329
- font-size: 23.32px;
1330
- letter-spacing: -0.035em;
1331
- line-height: 29.15px;
1332
- 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%;
1333
1175
  }
1334
- }
1335
- @media screen and (min-width: 610px) {
1336
- .ilo--card--multilink.ilo--card--narrow .ilo--card--intro {
1337
- font-size: 16px;
1338
- letter-spacing: normal;
1339
- line-height: 23.36px;
1340
- 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%;
1341
1178
  }
1342
- }
1343
- .ilo--card--multilink .ilo--link-list {
1344
- margin-top: 1.8756698821rem;
1345
- }
1346
- .ilo--card--detail {
1347
- border-bottom: 0.1607717042rem solid rgb(237, 240, 242);
1348
- padding: 1.2861736334rem 0;
1349
- position: relative;
1350
- }
1351
- @media screen and (min-width: 1024px) {
1352
- .ilo--card--detail {
1353
- 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;
1354
1182
  }
1355
1183
  }
1356
- .ilo--card--detail:hover, .ilo--card--detail:focus, .ilo--card--detail:focus-within {
1357
- 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));
1358
- }
1359
- .ilo--card--detail:hover picture::before, .ilo--card--detail:focus picture::before, .ilo--card--detail:focus-within picture::before {
1360
- opacity: 0.4;
1361
- z-index: 2;
1362
- }
1363
- .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 {
1364
- 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%;
1365
1188
  }
1366
- .ilo--card--detail picture {
1189
+ .ilo--card__type__feature picture {
1367
1190
  display: flex;
1191
+ height: 100%;
1368
1192
  position: relative;
1369
1193
  }
1370
- .ilo--card--detail picture::before {
1194
+ .ilo--card__type__feature picture::before {
1371
1195
  background-color: rgb(30, 45, 190);
1372
1196
  content: "";
1373
1197
  display: block;
@@ -1376,725 +1200,590 @@
1376
1200
  opacity: 0;
1377
1201
  position: absolute;
1378
1202
  top: 0;
1203
+ transition: opacity 150ms ease-in-out;
1379
1204
  width: 100%;
1380
1205
  z-index: -1;
1381
- transition-property: opacity;
1382
- transition-duration: 150ms;
1383
- transition-timing-function: ease-out;
1384
1206
  }
1385
- .ilo--card--detail .ilo--card--wrap {
1207
+ .ilo--card__type__feature .ilo--card--content {
1386
1208
  display: flex;
1209
+ flex: 1 1 auto;
1210
+ flex-direction: column;
1211
+ padding: 1.2861736334rem 1.2861736334rem 2.1436227224rem;
1387
1212
  }
1388
- .right-to-left .ilo--card--detail .ilo--card--wrap {
1389
- flex-direction: row-reverse;
1213
+ .ilo--card__type__feature.ilo--card__linklist .ilo--card--content {
1214
+ padding-bottom: 0;
1390
1215
  }
1391
- .ilo--card--detail .ilo--card--image {
1392
- object-fit: contain;
1393
- 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;
1394
1223
  }
1395
- @media screen and (min-width: 1024px) {
1396
- .ilo--card--detail .ilo--card--image {
1397
- 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 Wed, 16 Aug 2023 08:41:51 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;
1398
1266
  }
1399
1267
  }
1400
- .ilo--card--detail .ilo--card--image--wrapper {
1401
- max-width: 4.1264737406rem;
1402
- 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;
1403
1271
  }
1404
- @media screen and (min-width: 1024px) {
1405
- .ilo--card--detail .ilo--card--image--wrapper {
1406
- 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;
1407
1275
  }
1408
1276
  }
1409
- .ilo--card--detail .ilo--card--content {
1410
- padding: 0 1.2861736334rem;
1277
+ .ilo--card__type__text.ilo--card__size__narrow {
1278
+ --max-width: 16.1307609861rem;
1279
+ padding: 1.2861736334rem 2.1436227224rem;
1411
1280
  }
1412
- .ilo--card--detail .ilo--card--title {
1281
+ @media screen and (min-width: 610px) {
1282
+ .ilo--card__type__text.ilo--card__size__narrow {
1283
+ padding: 1.2861736334rem 2.1436227224rem;
1284
+ }
1285
+ }
1286
+ .ilo--card__type__text.ilo--card__size__narrow .ilo--card--title {
1413
1287
  font-size: 18.66px;
1414
1288
  letter-spacing: -0.035em;
1415
1289
  line-height: 24.26px;
1290
+ margin-bottom: 1.674953518rem;
1416
1291
  }
1417
- @media screen and (min-width: 1024px) {
1418
- .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 {
1419
1306
  font-size: 23.32px;
1420
1307
  letter-spacing: -0.035em;
1421
1308
  line-height: 29.15px;
1309
+ margin-bottom: 1.5763397642rem;
1422
1310
  }
1423
1311
  }
1424
- .ilo--card--detail .ilo--card--event-date {
1425
- font-size: 16px;
1426
- letter-spacing: normal;
1427
- line-height: 23.36px;
1428
- margin-bottom: 0;
1429
- padding-left: 1.2861736334rem;
1430
- position: relative;
1431
- }
1432
- .ilo--card--detail .ilo--card--event-date::before {
1433
- background-repeat: no-repeat;
1434
- content: "";
1435
- display: inline-block;
1436
- height: 0.7502679528rem;
1437
- left: 0;
1438
- position: absolute;
1439
- top: 50%;
1440
- transform: rotate(-90deg) translateX(50%);
1441
- width: 0.6430868167rem;
1442
- 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");
1443
- }
1444
- .ilo--card--detail .ilo--card--date {
1445
- font-size: 16px;
1446
- letter-spacing: normal;
1447
- line-height: 23.36px;
1448
- }
1449
- .ilo--card--graphic {
1450
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1451
- margin-top: 2.1436227224rem;
1452
- padding: 0 1.2861736334rem 2.1436227224rem;
1453
- position: relative;
1454
- }
1455
- .ilo--card--graphic::before {
1456
- background: inherit;
1457
- content: "";
1312
+ .ilo--card__type__text .ilo--card--date {
1458
1313
  display: block;
1459
- height: 40px;
1460
- position: absolute;
1461
- width: calc(100% - 73px);
1462
- }
1463
- .ilo--card--graphic::after {
1464
- 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");
1465
- background-position: bottom right;
1466
- background-size: cover;
1467
- content: "";
1468
- height: 40px;
1469
- display: block;
1470
- position: absolute;
1471
- width: 73.4px;
1472
- }
1473
- .ilo--card--graphic.ilo--card--dark::after {
1474
- 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");
1475
- }
1476
- .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 {
1477
- 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");
1478
- }
1479
- .ilo--card--graphic::before {
1480
- left: 0;
1481
- top: -39.7px;
1314
+ margin-bottom: 1.4398166117rem;
1482
1315
  }
1483
- .right-to-left .ilo--card--graphic::before {
1484
- left: auto;
1485
- right: 0;
1316
+ .ilo--card__type__text .ilo--card--content {
1317
+ display: flex;
1318
+ flex-direction: column;
1319
+ position: relative;
1486
1320
  }
1487
- .ilo--card--graphic::after {
1488
- right: 0;
1489
- top: -39.7px;
1490
- transition: background-image 150ms ease-out;
1321
+ .ilo--card__type__text .ilo--card--content > * {
1322
+ justify-self: flex-start;
1491
1323
  }
1492
- .right-to-left .ilo--card--graphic::after {
1493
- left: 0;
1494
- right: auto;
1495
- transform: rotateY(180deg);
1324
+ .ilo--card__type__text .ilo--card--content > *:last-child {
1325
+ justify-self: flex-end;
1326
+ margin-bottom: 0;
1496
1327
  }
1497
- .ilo--card--graphic .ilo--profile--contents--light * {
1498
- color: rgb(45, 45, 45);
1328
+
1329
+ /**
1330
+ * Do not edit directly
1331
+ * Generated on Wed, 16 Aug 2023 08:41:51 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;
1499
1344
  }
1500
- .ilo--card--graphic .ilo--profile--contents--dark * {
1501
- color: rgb(255, 255, 255);
1345
+ @media screen and (min-width: 1024px) {
1346
+ .ilo--card__type__detail {
1347
+ padding: 1.7148981779rem 0;
1348
+ }
1502
1349
  }
1503
- .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 {
1504
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));
1505
1352
  }
1506
- .ilo--card--graphic:hover .ilo--profile--contents *, .ilo--card--graphic:focus .ilo--profile--contents *, .ilo--card--graphic:focus-within .ilo--profile--contents * {
1507
- 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;
1508
1356
  }
1509
- @media screen and (min-width: 610px) {
1510
- .ilo--card--graphic {
1511
- padding: 0 1.7148981779rem 2.1436227224rem;
1512
- }
1513
- .ilo--card--graphic::before {
1514
- background: inherit;
1515
- content: "";
1516
- display: block;
1517
- height: 40px;
1518
- position: absolute;
1519
- width: calc(100% - 73px);
1520
- }
1521
- .ilo--card--graphic::after {
1522
- 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");
1523
- background-position: bottom right;
1524
- background-size: cover;
1525
- content: "";
1526
- height: 40px;
1527
- display: block;
1528
- position: absolute;
1529
- width: 73.4px;
1530
- }
1531
- .ilo--card--graphic.ilo--card--dark::after {
1532
- 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");
1533
- }
1534
- .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 {
1535
- 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");
1536
- }
1537
- .ilo--card--graphic::before {
1538
- left: 0;
1539
- top: -39.7px;
1540
- }
1541
- .right-to-left .ilo--card--graphic::before {
1542
- left: auto;
1543
- right: 0;
1544
- }
1545
- .ilo--card--graphic::after {
1546
- right: 0;
1547
- top: -39.7px;
1548
- }
1549
- .right-to-left .ilo--card--graphic::after {
1550
- left: 0;
1551
- right: auto;
1552
- transform: rotateY(180deg);
1553
- }
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;
1554
1364
  }
1555
1365
  @media screen and (min-width: 1024px) {
1556
- .ilo--card--graphic::before {
1557
- background: inherit;
1558
- content: "";
1559
- display: block;
1560
- height: 40px;
1561
- position: absolute;
1562
- width: calc(100% - 73px);
1563
- }
1564
- .ilo--card--graphic::after {
1565
- 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");
1566
- background-position: bottom right;
1567
- background-size: cover;
1568
- content: "";
1569
- height: 40px;
1570
- display: block;
1571
- position: absolute;
1572
- width: 73.4px;
1573
- }
1574
- .ilo--card--graphic.ilo--card--dark::after {
1575
- 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");
1576
- }
1577
- .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 {
1578
- 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");
1579
- }
1580
- .ilo--card--graphic::before {
1581
- left: 0;
1582
- top: -39.7px;
1583
- }
1584
- .right-to-left .ilo--card--graphic::before {
1585
- left: auto;
1586
- right: 0;
1587
- }
1588
- .ilo--card--graphic::after {
1589
- right: 0;
1590
- 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;
1591
1370
  }
1592
- .right-to-left .ilo--card--graphic::after {
1593
- left: 0;
1594
- right: auto;
1595
- 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;
1596
1375
  }
1597
1376
  }
1598
- .ilo--card--graphic.ilo--card--wide {
1599
- 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;
1600
1379
  }
1601
- @media screen and (min-width: 610px) {
1602
- .ilo--card--graphic.ilo--card--wide {
1603
- 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;
1604
1385
  }
1605
1386
  }
1606
- .ilo--card--graphic.ilo--card--standard {
1607
- 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
+ }
1608
1391
  }
1609
- @media screen and (min-width: 610px) {
1610
- .ilo--card--graphic.ilo--card--standard {
1611
- 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;
1612
1395
  }
1613
1396
  }
1614
- .ilo--card--graphic.ilo--card--narrow {
1615
- padding: 0 1.2861736334rem 2.1436227224rem;
1397
+ .ilo--card__type__detail.ilo--card__size__narrow {
1398
+ --max-width: 18.3815648446rem;
1616
1399
  }
1617
- @media screen and (min-width: 610px) {
1618
- .ilo--card--graphic.ilo--card--narrow {
1619
- padding: 0 1.2861736334rem 2.1436227224rem;
1620
- }
1400
+ .ilo--card__type__detail picture {
1401
+ display: flex;
1402
+ position: relative;
1621
1403
  }
1622
- .ilo--card--graphic.ilo--card--narrow .ilo--card--title {
1623
- font-size: 18.66px;
1624
- letter-spacing: -0.035em;
1625
- line-height: 24.26px;
1626
- 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;
1627
1418
  }
1628
- .ilo--card--graphic.ilo--card--dark {
1629
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1419
+ .ilo--card__type__detail .ilo--card--wrap {
1420
+ display: flex;
1630
1421
  }
1631
- .ilo--card--graphic .ilo--card--eyebrow {
1632
- margin-bottom: 1.0110920672rem;
1422
+ .right-to-left .ilo--card__type__detail .ilo--card--wrap {
1423
+ flex-direction: row-reverse;
1633
1424
  }
1634
- .ilo--card--graphic .ilo--card--title {
1425
+ .ilo--card__type__detail .ilo--card--title {
1635
1426
  font-size: 18.66px;
1636
1427
  letter-spacing: -0.035em;
1637
1428
  line-height: 24.26px;
1638
- margin-bottom: 1.674953518rem;
1639
1429
  }
1640
- @media screen and (min-width: 610px) {
1641
- .ilo--card--graphic .ilo--card--title {
1642
- font-size: 23.32px;
1643
- letter-spacing: -0.035em;
1644
- line-height: 29.15px;
1645
- margin-bottom: 1.5763397642rem;
1646
- }
1430
+ .ilo--card__type__detail .ilo--card--image--wrapper {
1431
+ flex: 0 0 4.1264737406rem;
1647
1432
  }
1648
- .ilo--card--graphic .ilo--card--date {
1649
- display: block;
1650
- margin-bottom: 1.4398166117rem;
1433
+ .ilo--card__type__detail .ilo--card--picture {
1434
+ object-fit: contain;
1435
+ width: 4.1264737406rem;
1651
1436
  }
1652
- .ilo--card--graphic .ilo--card--content {
1653
- display: flex;
1654
- 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;
1655
1446
  position: relative;
1656
1447
  }
1657
- .ilo--card--graphic .ilo--card--content > * {
1658
- 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");
1659
1459
  }
1660
- .ilo--card--graphic .ilo--card--content > *:last-child {
1661
- justify-self: flex-end;
1662
- margin-bottom: 0;
1460
+ .ilo--card__type__detail .ilo--card--date {
1461
+ font-size: 16px;
1462
+ letter-spacing: normal;
1463
+ line-height: 23.36px;
1663
1464
  }
1664
- .ilo--card--graphicpromo {
1665
- max-width: 49.3033226152rem;
1465
+
1466
+ /**
1467
+ * Do not edit directly
1468
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1469
+ */
1470
+ /**
1471
+ * TOKENS:
1472
+ */
1473
+ /**
1474
+ * MAPS:
1475
+ */
1476
+ .ilo--card__type__promo {
1477
+ --max-width: 18.3815648446rem;
1666
1478
  padding: 2.1436227224rem 1.2861736334rem;
1667
1479
  width: 100%;
1668
1480
  }
1669
- .ilo--card--graphicpromo:hover, .ilo--card--graphicpromo:focus, .ilo--card--graphicpromo:focus-within {
1670
- 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));
1671
- }
1672
1481
  @media screen and (min-width: 610px) {
1673
- .ilo--card--graphicpromo {
1482
+ .ilo--card__type__promo {
1674
1483
  padding: 2.5723472669rem;
1675
1484
  }
1676
1485
  }
1677
1486
  @media screen and (min-width: 1024px) {
1678
- .ilo--card--graphicpromo {
1487
+ .ilo--card__type__promo {
1679
1488
  padding: 3.4297963558rem 3.8585209003rem;
1680
1489
  }
1681
1490
  }
1682
- .ilo--card--graphicpromo.ilo--card--wide {
1683
- padding: 3.4297963558rem 3.8585209003rem;
1491
+ .ilo--card__type__promo.ilo--card__size__standard {
1492
+ --max-width: 33.9764201501rem;
1493
+ padding: 2.5723472669rem;
1684
1494
  }
1685
1495
  @media screen and (min-width: 610px) {
1686
- .ilo--card--graphicpromo.ilo--card--wide {
1687
- padding: 3.4297963558rem 3.8585209003rem;
1496
+ .ilo--card__type__promo.ilo--card__size__standard {
1497
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1688
1498
  }
1689
1499
  }
1690
1500
  @media screen and (min-width: 1024px) {
1691
- .ilo--card--graphicpromo.ilo--card--wide {
1692
- padding: 3.4297963558rem 3.8585209003rem;
1501
+ .ilo--card__type__promo.ilo--card__size__standard {
1502
+ padding: 2.5723472669rem 2.5723472669rem 3.4297963558rem;
1693
1503
  }
1694
1504
  }
1695
- .ilo--card--graphicpromo.ilo--card--standard {
1696
- 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;
1697
1511
  }
1698
1512
  @media screen and (min-width: 610px) {
1699
- .ilo--card--graphicpromo.ilo--card--standard {
1700
- 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;
1701
1515
  }
1702
1516
  }
1703
1517
  @media screen and (min-width: 1024px) {
1704
- .ilo--card--graphicpromo.ilo--card--standard {
1705
- 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;
1706
1520
  }
1707
1521
  }
1708
- .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;
1709
1527
  padding: 2.1436227224rem 1.2861736334rem;
1710
1528
  }
1711
1529
  @media screen and (min-width: 610px) {
1712
- .ilo--card--graphicpromo.ilo--card--narrow {
1530
+ .ilo--card__type__promo.ilo--card__size__narrow {
1713
1531
  padding: 2.1436227224rem 1.2861736334rem;
1714
1532
  }
1715
1533
  }
1716
1534
  @media screen and (min-width: 1024px) {
1717
- .ilo--card--graphicpromo.ilo--card--narrow {
1535
+ .ilo--card__type__promo.ilo--card__size__narrow {
1718
1536
  padding: 2.1436227224rem 1.2861736334rem;
1719
1537
  }
1720
1538
  }
1721
- .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 {
1722
1543
  font-size: 29.16px;
1723
1544
  letter-spacing: -0.035em;
1724
1545
  line-height: 36.45px;
1725
1546
  margin-bottom: 0.5741425509rem;
1726
1547
  }
1727
1548
  @media screen and (min-width: 610px) {
1728
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--title {
1549
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--title {
1729
1550
  font-size: 36.45px;
1730
1551
  letter-spacing: -0.035em;
1731
1552
  line-height: 43.74px;
1732
1553
  margin-bottom: 0.4278063594rem;
1733
1554
  }
1734
1555
  }
1735
- .ilo--card--graphicpromo.ilo--card--narrow .ilo--card--intro {
1556
+ .ilo--card__type__promo.ilo--card__size__narrow .ilo--card--intro {
1736
1557
  font-size: 16px;
1737
1558
  letter-spacing: normal;
1738
1559
  line-height: 23.36px;
1739
1560
  margin-bottom: 1.910132288rem;
1740
1561
  }
1741
- .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 {
1742
1563
  color: rgb(45, 45, 45);
1743
1564
  transition-property: color;
1744
1565
  transition-duration: 150ms;
1745
1566
  transition-timing-function: ease-out;
1746
1567
  }
1747
- .ilo--card--graphicpromo .ilo--card--title {
1568
+ .ilo--card__type__promo .ilo--card--title {
1748
1569
  font-size: 29.16px;
1749
1570
  letter-spacing: -0.035em;
1750
1571
  line-height: 36.45px;
1751
1572
  margin-bottom: 0.5741425509rem;
1752
1573
  }
1753
1574
  @media screen and (min-width: 610px) {
1754
- .ilo--card--graphicpromo .ilo--card--title {
1575
+ .ilo--card__type__promo .ilo--card--title {
1755
1576
  font-size: 36.45px;
1756
1577
  letter-spacing: -0.035em;
1757
1578
  line-height: 43.74px;
1758
1579
  margin-bottom: 0.8565309039rem;
1759
1580
  }
1760
1581
  }
1761
- .ilo--card--graphicpromo .ilo--card--intro {
1582
+ .ilo--card__type__promo .ilo--card--intro {
1762
1583
  font-size: 16px;
1763
1584
  letter-spacing: normal;
1764
1585
  line-height: 23.36px;
1765
1586
  margin-bottom: 1.910132288rem;
1766
1587
  }
1767
1588
  @media screen and (min-width: 610px) {
1768
- .ilo--card--graphicpromo .ilo--card--intro {
1589
+ .ilo--card__type__promo .ilo--card--intro {
1769
1590
  font-size: 18.66px;
1770
1591
  letter-spacing: normal;
1771
1592
  line-height: 27.24px;
1772
1593
  margin-bottom: 1.8685411561rem;
1773
1594
  }
1774
1595
  }
1775
- .ilo--card--factlist {
1776
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
1777
- max-width: 45.8735262594rem;
1778
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1779
- pointer-events: none;
1780
- }
1781
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1782
- height: 40px;
1783
- top: -2.127545552rem;
1784
- width: calc(100% - 73px);
1785
- }
1786
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1787
- height: 40px;
1788
- top: -2.127545552rem;
1789
- width: 73.3px;
1790
- }
1791
- .ilo--card--factlist.ilo--card--dark {
1792
- background: rgb(35, 0, 80);
1793
- }
1794
- @media screen and (min-width: 1024px) {
1795
- .ilo--card--factlist {
1796
- padding: 0 2.1436227224rem 3.0010718114rem 2.1436227224rem;
1797
- }
1798
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1799
- height: 48px;
1800
- top: -2.5562700965rem;
1801
- width: calc(100% - 87px);
1802
- }
1803
- .ilo--card--factlist.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1804
- height: 48px;
1805
- top: -2.5562700965rem;
1806
- width: 87.3px;
1807
- }
1808
- }
1809
- .ilo--card--factlist.ilo--card--wide {
1810
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1596
+
1597
+ /**
1598
+ * Do not edit directly
1599
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
1600
+ */
1601
+ /**
1602
+ * TOKENS:
1603
+ */
1604
+ /**
1605
+ * MAPS:
1606
+ */
1607
+ .ilo--card__type__multilink {
1608
+ --max-width: 28.7245444802rem;
1609
+ padding: 1.2861736334rem;
1811
1610
  }
1812
- @media screen and (min-width: 610px) {
1813
- .ilo--card--factlist.ilo--card--wide {
1814
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1815
- }
1611
+ .ilo--card__type__multilink .ilo--card--image--wrapper {
1612
+ display: none;
1816
1613
  }
1817
- .ilo--card--factlist.ilo--card--standard {
1818
- padding: 0 2.1436227224rem 2.7867095391rem 2.1436227224rem;
1614
+ .ilo--card__type__multilink .ilo--card--content .ilo--card--image--wrapper {
1615
+ display: block;
1819
1616
  }
1820
1617
  @media screen and (min-width: 610px) {
1821
- .ilo--card--factlist.ilo--card--standard {
1822
- padding: 0 2.1436227224rem 3.2154340836rem 2.1436227224rem;
1618
+ .ilo--card__type__multilink {
1619
+ padding: 2.1436227224rem;
1823
1620
  }
1824
1621
  }
1825
- .ilo--card--factlist.ilo--card--narrow {
1826
- padding: 0 1.2861736334rem 2.5723472669rem 1.2861736334rem;
1827
- }
1828
- @media screen and (min-width: 610px) {
1829
- .ilo--card--factlist.ilo--card--narrow {
1830
- 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;
1831
1625
  }
1832
1626
  }
1833
- .ilo--card--factlist.ilo--card--dark {
1834
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1835
- }
1836
- .ilo--card--factlist.ilo--card--dark .ilo--card--title {
1837
- color: rgb(255, 255, 255);
1838
- transition-property: color;
1839
- transition-duration: 150ms;
1840
- transition-timing-function: ease-out;
1841
- }
1842
- .ilo--card--factlist.ilo--card--dark .ilo--list__item {
1843
- color: rgb(255, 255, 255);
1844
- }
1845
- .ilo--card--factlist.ilo--card--dark .ilo--list__item:last-of-type {
1846
- margin-bottom: 0;
1847
- }
1848
- .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 {
1849
- color: rgb(255, 255, 255);
1850
- transition-property: color;
1851
- transition-duration: 150ms;
1852
- transition-timing-function: ease-out;
1853
- }
1854
- .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 {
1855
- color: rgb(255, 255, 255);
1856
- }
1857
- .ilo--card--factlist .ilo--card--title {
1858
- color: rgb(45, 45, 45);
1627
+ .ilo--card__type__multilink .ilo--card--title {
1859
1628
  font-size: 23.32px;
1860
1629
  letter-spacing: -0.035em;
1861
1630
  line-height: 29.15px;
1862
- margin-bottom: 1.1476152197rem;
1631
+ margin-bottom: 0.7188906752rem;
1632
+ color: rgb(45, 45, 45);
1863
1633
  }
1864
- @media screen and (min-width: 1024px) {
1865
- .ilo--card--factlist .ilo--card--title {
1634
+ @media screen and (min-width: 610px) {
1635
+ .ilo--card__type__multilink .ilo--card--title {
1866
1636
  font-size: 29.16px;
1867
1637
  letter-spacing: -0.035em;
1868
1638
  line-height: 36.45px;
1869
- margin-bottom: 1.4315916399rem;
1639
+ margin-bottom: 0.5741425509rem;
1870
1640
  }
1871
1641
  }
1872
- .ilo--card--stat {
1873
- border-bottom: 0.1607717042rem solid rgb(150, 10, 85);
1874
- margin-top: 2.1436227224rem;
1875
- padding: 0 1.2861736334rem 2.1436227224rem 1.1789924973rem;
1876
- position: relative;
1877
- width: 100%;
1878
- }
1879
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1880
- left: 0;
1881
- top: -2.127545552rem;
1882
- }
1883
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1884
- left: auto;
1885
- right: 0;
1886
- }
1887
- .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1888
- right: 0;
1889
- top: -2.127545552rem;
1890
- }
1891
- .right-to-left .ilo--card--stat.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1892
- left: 0;
1893
- right: auto;
1894
- transform: rotateY(180deg);
1895
- }
1896
- .ilo--card--stat.ilo--card--blue {
1897
- background: rgb(235, 245, 253);
1898
- }
1899
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1900
- background: inherit;
1901
- content: "";
1902
- display: block;
1903
- height: 40px;
1904
- position: absolute;
1905
- width: calc(100% - 73px);
1906
- }
1907
- .ilo--card--stat.ilo--card--blue.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1908
- 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");
1909
- background-position: bottom right;
1910
- background-size: cover;
1911
- content: "";
1912
- height: 40px;
1913
- display: block;
1914
- position: absolute;
1915
- width: 73.4px;
1916
- }
1917
- .ilo--card--stat.ilo--card--yellow {
1918
- background: rgb(255, 205, 45);
1919
- }
1920
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1921
- background: inherit;
1922
- content: "";
1923
- display: block;
1924
- height: 40px;
1925
- position: absolute;
1926
- width: calc(100% - 73px);
1927
- }
1928
- .ilo--card--stat.ilo--card--yellow.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1929
- 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");
1930
- background-position: bottom right;
1931
- background-size: cover;
1932
- content: "";
1933
- height: 40px;
1934
- display: block;
1935
- position: absolute;
1936
- width: 73.4px;
1937
- }
1938
- .ilo--card--stat.ilo--card--green {
1939
- background: rgb(140, 225, 100);
1940
- }
1941
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1942
- background: inherit;
1943
- content: "";
1944
- display: block;
1945
- height: 40px;
1946
- position: absolute;
1947
- width: calc(100% - 73px);
1948
- }
1949
- .ilo--card--stat.ilo--card--green.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1950
- 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");
1951
- background-position: bottom right;
1952
- background-size: cover;
1953
- content: "";
1954
- height: 40px;
1955
- display: block;
1956
- position: absolute;
1957
- width: 73.4px;
1958
- }
1959
- .ilo--card--stat.ilo--card--turquoise {
1960
- background: rgb(5, 210, 210);
1961
- }
1962
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::before {
1963
- background: inherit;
1964
- content: "";
1965
- display: block;
1966
- height: 40px;
1967
- position: absolute;
1968
- width: calc(100% - 73px);
1969
- }
1970
- .ilo--card--stat.ilo--card--turquoise.ilo--card--cornercut:not(.ilo--card--multilink):not(.ilo--card--detail):not(.ilo--card--feature)::after {
1971
- 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");
1972
- background-position: bottom right;
1973
- background-size: cover;
1974
- content: "";
1975
- height: 40px;
1976
- display: block;
1977
- position: absolute;
1978
- width: 73.4px;
1979
- }
1980
- .ilo--card--stat .ilo--card--content {
1981
- display: flex;
1982
- flex-wrap: wrap;
1983
- height: 100%;
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);
1984
1648
  }
1985
- .right-to-left .ilo--card--stat .ilo--card--content {
1986
- flex-direction: row-reverse;
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
+ }
1987
1656
  }
1988
- .ilo--card--stat .ilo--card--title {
1989
- color: rgb(35, 0, 80);
1990
- font-size: 36.45px;
1991
- letter-spacing: -0.035em;
1992
- line-height: 43.74px;
1993
- margin-bottom: 0.4278063594rem;
1994
- width: 100%;
1657
+ .ilo--card__type__multilink.ilo--card__size__standard {
1658
+ --max-width: 28.7245444802rem;
1659
+ padding: 2.5723472669rem 2.1436227224rem;
1995
1660
  }
1996
- .ilo--card--stat .ilo--card--intro {
1997
- color: rgb(35, 0, 80);
1998
- font-family: Overpass;
1999
- font-size: 18.66px;
2000
- letter-spacing: normal;
2001
- line-height: 27.24px;
2002
- margin-bottom: 1.6734954235rem;
2003
- width: 100%;
1661
+ @media screen and (min-width: 610px) {
1662
+ .ilo--card__type__multilink.ilo--card__size__standard {
1663
+ padding: 2.5723472669rem 2.1436227224rem;
1664
+ }
2004
1665
  }
2005
- .ilo--card--stat .ilo--link {
2006
- font-size: 11.94px;
2007
- letter-spacing: -0.02em;
2008
- line-height: 16.24px;
2009
- align-self: flex-end;
1666
+ @media screen and (min-width: 1024px) {
1667
+ .ilo--card__type__multilink.ilo--card__size__standard {
1668
+ padding: 2.5723472669rem 2.1436227224rem;
1669
+ }
2010
1670
  }
2011
- .ilo--card--data {
2012
- background: rgb(235, 245, 253);
2013
- border-bottom: 0.1607717042rem solid #82afdc;
2014
- margin-top: 2.1436227224rem;
2015
- max-width: 32.154340836rem;
2016
- padding: 0 1.2861736334rem 3.0010718114rem;
2017
- position: relative;
1671
+ .ilo--card__type__multilink.ilo--card__size__narrow {
1672
+ --max-width: 20.0964630225rem;
1673
+ padding: 2.1436227224rem 1.2861736334rem 2.5723472669rem;
2018
1674
  }
2019
- .ilo--card--data::before {
2020
- background: inherit;
2021
- content: "";
2022
- display: block;
2023
- height: 40px;
2024
- position: absolute;
2025
- width: calc(100% - 73px);
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
+ }
2026
1679
  }
2027
- .ilo--card--data::after {
2028
- 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");
2029
- background-position: bottom right;
2030
- background-size: cover;
2031
- content: "";
2032
- height: 40px;
2033
- display: block;
2034
- position: absolute;
2035
- width: 73.4px;
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
+ }
2036
1684
  }
2037
- .ilo--card--data:hover, .ilo--card--data:focus, .ilo--card--data:focus-within {
2038
- background: rgb(235, 245, 253);
1685
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--image--wrapper {
1686
+ display: none;
2039
1687
  }
2040
- .ilo--card--data::before {
2041
- left: 0;
2042
- top: -2.127545552rem;
1688
+ .ilo--card__type__multilink.ilo--card__size__narrow .ilo--card--content .ilo--card--image--wrapper {
1689
+ display: block;
1690
+ margin-bottom: 1.2861736334rem;
2043
1691
  }
2044
- .right-to-left .ilo--card--data::before {
2045
- left: auto;
2046
- right: 0;
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
+ }
2047
1699
  }
2048
- .ilo--card--data::after {
2049
- right: 0;
2050
- top: -2.127545552rem;
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
+ }
2051
1707
  }
2052
- .right-to-left .ilo--card--data::after {
2053
- left: 0;
2054
- right: auto;
2055
- transform: rotateY(180deg);
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;
2056
1711
  }
2057
1712
  @media screen and (min-width: 610px) {
2058
- .ilo--card--data::before {
2059
- background: inherit;
2060
- content: "";
2061
- display: block;
2062
- height: 48px;
2063
- position: absolute;
2064
- 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;
2065
1715
  }
2066
- .ilo--card--data::after {
2067
- background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 116 64'%3e%3cpath fill='rgb(235, 245, 253)' d='M116 64L0.306641 0V64H116Z'/%3e%3c/svg%3e");
2068
- background-position: bottom right;
2069
- background-size: cover;
2070
- content: "";
2071
- height: 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 {
2072
1730
  display: block;
2073
- position: absolute;
2074
- width: 84.4px;
1731
+ width: 50%;
2075
1732
  }
2076
- .ilo--card--data::before {
2077
- 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%;
2078
1735
  }
2079
- .ilo--card--data::after {
2080
- 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;
2081
1738
  }
2082
1739
  }
2083
- .ilo--card--data .ilo--card--image--wrapper {
2084
- display: none;
2085
- 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;
2086
1744
  }
2087
- .ilo--card--data .ilo--card--content .ilo--card--image--wrapper {
2088
- display: block;
1745
+
1746
+ /**
1747
+ * Do not edit directly
1748
+ * Generated on Wed, 16 Aug 2023 08:41:51 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%);
2089
1778
  }
2090
- .ilo--card--data--content-label {
1779
+ .ilo--card__type__data--content-label {
2091
1780
  font-size: 14.93px;
2092
1781
  letter-spacing: normal;
2093
1782
  line-height: 20.3px;
2094
1783
  margin-bottom: 0.6540478038rem;
2095
1784
  color: rgb(109, 109, 109);
2096
1785
  }
2097
- .ilo--card--data--content-copy {
1786
+ .ilo--card__type__data--content-copy {
2098
1787
  font-size: 23.32px;
2099
1788
  letter-spacing: -0.035em;
2100
1789
  line-height: 29.15px;
@@ -2103,175 +1792,161 @@
2103
1792
  font-family: Overpass;
2104
1793
  font-weight: 500;
2105
1794
  }
2106
- .ilo--card--data--content-files {
1795
+ .ilo--card__type__data--content-files {
2107
1796
  margin-bottom: 2.1436227224rem;
2108
1797
  }
2109
- .ilo--card--data .ilo--link {
1798
+ .ilo--card__type__data .ilo--link {
2110
1799
  font-size: 18.66px;
2111
1800
  letter-spacing: -0.035em;
2112
1801
  line-height: 24.26px;
2113
1802
  }
2114
- .ilo--card--data--file {
1803
+ .ilo--card__type__data--file {
2115
1804
  margin: 0.2143622722rem 0.4287245445rem 0.2143622722rem 0;
2116
1805
  }
2117
- .ilo--card--data--file:last-of-type {
1806
+ .ilo--card__type__data--file:last-of-type {
2118
1807
  margin-right: 0;
2119
1808
  }
2120
- .ilo--card--feature {
2121
- border-bottom: 0.1607717042rem solid rgb(184, 196, 204);
2122
- display: flex;
2123
- margin-top: 0;
1809
+
1810
+ /**
1811
+ * Do not edit directly
1812
+ * Generated on Wed, 16 Aug 2023 08:41:51 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;
2124
1824
  position: relative;
1825
+ width: 100%;
1826
+ clip-path: polygon(0 0, calc(100% - 72px) 0, 100% 40px, 100% 100%, 0 100%);
2125
1827
  }
2126
- .ilo--card--feature::before {
2127
- display: none;
1828
+ .ilo--card__type__stat.ilo--card__color__blue {
1829
+ background: rgb(235, 245, 253);
2128
1830
  }
2129
- .ilo--card--feature.ilo--card--dark {
2130
- border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
1831
+ .ilo--card__type__stat.ilo--card__color__yellow {
1832
+ background: rgb(255, 205, 45);
2131
1833
  }
2132
- .ilo--card--feature.ilo--card--dark .ilo--link-list {
2133
- 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);
2134
1836
  }
2135
- .ilo--card--feature.ilo--card--dark .ilo--link-list--link {
2136
- color: rgb(255, 255, 255);
2137
- 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);
2138
1839
  }
2139
- .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 {
2140
- color: rgb(30, 45, 190);
2141
- 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%;
2142
1844
  }
2143
- .ilo--card--feature picture::before {
2144
- transition-property: opacity;
2145
- transition-duration: 150ms;
2146
- transition-timing-function: ease-out;
1845
+ .right-to-left .ilo--card__type__stat .ilo--card--content {
1846
+ flex-direction: row-reverse;
2147
1847
  }
2148
- .ilo--card--feature:hover, .ilo--card--feature:focus, .ilo--card--feature:focus-within {
2149
- background-color: rgb(255, 255, 255);
2150
- 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));
2151
- 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%;
2152
1855
  }
2153
- .ilo--card--feature:hover picture::before, .ilo--card--feature:focus picture::before, .ilo--card--feature:focus-within picture::before {
2154
- opacity: 0.4;
2155
- z-index: 1;
2156
- transition-property: opacity;
2157
- transition-duration: 150ms;
2158
- 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%;
2159
1864
  }
2160
- .ilo--card--feature:hover .ilo--card--image, .ilo--card--feature:focus .ilo--card--image, .ilo--card--feature:focus-within .ilo--card--image {
2161
- 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;
2162
1870
  }
2163
- .ilo--card--feature .ilo--link-list {
2164
- border-top: 0.1071811361rem solid rgb(237, 240, 242);
2165
- margin-left: -1.2861736334rem;
2166
- margin-right: -1.2861736334rem;
2167
- margin-top: 1.822079314rem;
2168
- position: relative;
2169
- z-index: 2;
1871
+
1872
+ /**
1873
+ * Do not edit directly
1874
+ * Generated on Wed, 16 Aug 2023 08:41:51 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%);
2170
1887
  }
2171
- .ilo--card--feature .ilo--link-list--link, .ilo--card--feature .ilo--link-list--link:hover {
2172
- border-bottom: none;
2173
- padding-left: 1.2861736334rem;
2174
- padding-right: 1.2861736334rem;
1888
+ @media screen and (min-width: 1024px) {
1889
+ .ilo--card__type__factlist {
1890
+ padding: 2.1436227224rem 3.0010718114rem;
1891
+ }
2175
1892
  }
2176
- .ilo--card--feature.ilo--card--narrow .ilo--card--wrap, .ilo--card--feature.ilo--card--standard .ilo--card--wrap {
2177
- display: flex;
2178
- flex-wrap: wrap;
2179
- width: 100%;
1893
+ .ilo--card__type__factlist.ilo--card__size__wide {
1894
+ --max-width: 45.8735262594rem;
1895
+ padding: 2.1436227224rem 2.7867095391rem;
2180
1896
  }
2181
- .ilo--card--feature.ilo--card--narrow .ilo--card--content, .ilo--card--feature.ilo--card--standard .ilo--card--content {
2182
- 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
+ }
2183
1902
  }
2184
- .ilo--card--feature.ilo--card--narrow .ilo--card--image--wrapper, .ilo--card--feature.ilo--card--standard .ilo--card--image--wrapper {
2185
- 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%);
2186
1907
  }
2187
1908
  @media screen and (min-width: 610px) {
2188
- .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2189
- flex-direction: row;
2190
- }
2191
- .right-to-left .ilo--card--feature.ilo--card--wide .ilo--card--wrap {
2192
- flex-direction: row-reverse;
2193
- }
2194
- .ilo--card--feature.ilo--card--wide .ilo--card--content {
2195
- display: flex;
2196
- flex-direction: row;
2197
- flex-wrap: wrap;
2198
- position: relative;
2199
- width: 50%;
2200
- }
2201
- .ilo--card--feature.ilo--card--wide .ilo--card--image--wrapper {
2202
- width: 50%;
2203
- }
2204
- .ilo--card--feature.ilo--card--wide .ilo--card--image {
2205
- object-fit: cover;
2206
- }
2207
- .ilo--card--feature.ilo--card--wide .ilo--card--date {
2208
- align-self: flex-end;
2209
- width: 100%;
2210
- }
2211
- .ilo--card--feature.ilo--card--wide .ilo--card--eyebrow {
2212
- width: 100%;
2213
- }
2214
- .ilo--card--feature.ilo--card--wide .ilo--card--title {
2215
- width: 100%;
2216
- }
2217
- .ilo--card--feature.ilo--card--wide .ilo--link-list {
2218
- width: calc(100% + 48px);
1909
+ .ilo--card__type__factlist.ilo--card__size__narrow {
1910
+ padding: 1.2861736334rem 2.5723472669rem;
2219
1911
  }
2220
1912
  }
2221
- .ilo--card--feature .ilo--card--wrap {
2222
- display: flex;
2223
- flex-direction: column;
2224
- width: 100%;
1913
+ .ilo--card__type__factlist.ilo--card__theme__dark {
1914
+ border-bottom: 0.1607717042rem solid rgb(250, 60, 75);
2225
1915
  }
2226
- .ilo--card--feature picture {
2227
- display: flex;
2228
- height: 100%;
2229
- position: relative;
1916
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--card--title {
1917
+ color: rgb(255, 255, 255);
2230
1918
  }
2231
- .ilo--card--feature picture::before {
2232
- background-color: rgb(30, 45, 190);
2233
- content: "";
2234
- display: block;
2235
- height: 100%;
2236
- left: 0;
2237
- opacity: 0;
2238
- position: absolute;
2239
- top: 0;
2240
- transition: opacity 150ms ease-in-out;
2241
- width: 100%;
2242
- z-index: -1;
1919
+ .ilo--card__type__factlist.ilo--card__theme__dark .ilo--list__item {
1920
+ color: rgb(255, 255, 255);
2243
1921
  }
2244
- .ilo--card--feature .ilo--card--content {
2245
- display: flex;
2246
- flex: 1 1 auto;
2247
- flex-direction: column;
2248
- 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;
2249
1924
  }
2250
- .ilo--card--feature.ilo--card--linklist .ilo--card--content {
2251
- 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);
2252
1930
  }
2253
- .ilo--card--feature .ilo--card--title {
1931
+ .ilo--card__type__factlist .ilo--card--title {
1932
+ color: rgb(45, 45, 45);
2254
1933
  font-size: 23.32px;
2255
1934
  letter-spacing: -0.035em;
2256
1935
  line-height: 29.15px;
2257
- margin-bottom: 1.5763397642rem;
2258
- font-family: Overpass;
2259
- font-weight: 700;
2260
- }
2261
- .ilo--card--feature .ilo--card--eyebrow {
2262
- font-size: 14.93px;
2263
- letter-spacing: normal;
2264
- line-height: 19.71px;
2265
- margin-bottom: 0.3376482577rem;
1936
+ margin-bottom: 1.1476152197rem;
2266
1937
  }
2267
- .ilo--card--feature .ilo--card--date {
2268
- margin-bottom: 0;
2269
- 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
+ }
2270
1945
  }
2271
1946
 
2272
1947
  /**
2273
1948
  * Do not edit directly
2274
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
1949
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2275
1950
  */
2276
1951
  /**
2277
1952
  * TOKENS:
@@ -2279,33 +1954,53 @@
2279
1954
  /**
2280
1955
  * MAPS:
2281
1956
  */
2282
- .ilo--cardgroup--inner {
2283
- display: flex;
2284
- flex-wrap: wrap;
2285
- justify-content: space-between;
2286
- margin: auto;
2287
- row-gap: 1.7148981779rem;
1957
+ .ilo--cardgroup__collapsed .ilo--cardgroup--inner {
1958
+ gap: 0 !important;
2288
1959
  }
2289
- .right-to-left .ilo--cardgroup--inner {
2290
- flex-direction: row-reverse;
1960
+ .ilo--cardgroup__justify__start .ilo--cardgroup--inner {
1961
+ justify-content: flex-start;
2291
1962
  }
2292
- .ilo--cardgroup--inner .ilo--card {
2293
- width: 100%;
1963
+ .ilo--cardgroup__justify__between .ilo--cardgroup--inner {
1964
+ justify-content: space-between;
2294
1965
  }
2295
- @media screen and (min-width: 1024px) {
2296
- .ilo--cardgroup--two .ilo--card {
2297
- width: calc(50% - 16px);
2298
- }
1966
+ .ilo--cardgroup__justify__center .ilo--cardgroup--inner {
1967
+ justify-content: center;
2299
1968
  }
2300
1969
  @media screen and (min-width: 1024px) {
2301
- .ilo--cardgroup--three .ilo--card {
2302
- width: calc(33.333% - 21px);
1970
+ .ilo--cardgroup__count__one .ilo--cardgroup--inner {
1971
+ gap: 0;
2303
1972
  }
2304
- }
2305
- @media screen and (min-width: 1024px) {
2306
- .ilo--cardgroup--four .ilo--card {
2307
- width: calc(25% - 24px);
1973
+ .ilo--cardgroup__count__one .ilo--cardgroup--card {
1974
+ flex: 1 1 100%;
1975
+ }
1976
+ .ilo--cardgroup__count__two .ilo--cardgroup--inner {
1977
+ gap: 16px;
1978
+ }
1979
+ .ilo--cardgroup__count__two .ilo--cardgroup--card {
1980
+ flex: 0 1 calc(50% - 16px);
1981
+ }
1982
+ .ilo--cardgroup__count__three .ilo--cardgroup--inner {
1983
+ gap: 21px;
2308
1984
  }
1985
+ .ilo--cardgroup__count__three .ilo--cardgroup--card {
1986
+ flex: 0 1 calc(33.3333% - 21px);
1987
+ }
1988
+ .ilo--cardgroup__count__four .ilo--cardgroup--inner {
1989
+ gap: 24px;
1990
+ }
1991
+ .ilo--cardgroup__count__four .ilo--cardgroup--card {
1992
+ flex: 0 1 calc(25% - 24px);
1993
+ }
1994
+ }
1995
+ .ilo--cardgroup--inner {
1996
+ display: flex;
1997
+ flex-flow: row wrap;
1998
+ justify-content: center;
1999
+ margin: auto;
2000
+ width: 100%;
2001
+ }
2002
+ .right-to-left .ilo--cardgroup--inner {
2003
+ flex-direction: row-reverse;
2309
2004
  }
2310
2005
  .ilo--cardgroup--button-wrap {
2311
2006
  display: flex;
@@ -2316,7 +2011,7 @@
2316
2011
 
2317
2012
  /**
2318
2013
  * Do not edit directly
2319
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2014
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2320
2015
  */
2321
2016
  /**
2322
2017
  * TOKENS:
@@ -2421,7 +2116,7 @@
2421
2116
 
2422
2117
  /**
2423
2118
  * Do not edit directly
2424
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2119
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2425
2120
  */
2426
2121
  /**
2427
2122
  * TOKENS:
@@ -2502,7 +2197,7 @@
2502
2197
 
2503
2198
  /**
2504
2199
  * Do not edit directly
2505
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2200
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2506
2201
  */
2507
2202
  /**
2508
2203
  * TOKENS:
@@ -2512,7 +2207,7 @@
2512
2207
  */
2513
2208
  /**
2514
2209
  * Do not edit directly
2515
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2210
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2516
2211
  */
2517
2212
  /**
2518
2213
  * TOKENS:
@@ -2522,7 +2217,7 @@
2522
2217
  */
2523
2218
  /**
2524
2219
  * Do not edit directly
2525
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2220
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2526
2221
  */
2527
2222
  /**
2528
2223
  * TOKENS:
@@ -2532,7 +2227,7 @@
2532
2227
  */
2533
2228
  /**
2534
2229
  * Do not edit directly
2535
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2230
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2536
2231
  */
2537
2232
  /**
2538
2233
  * TOKENS:
@@ -2658,7 +2353,7 @@
2658
2353
 
2659
2354
  /**
2660
2355
  * Do not edit directly
2661
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2356
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2662
2357
  */
2663
2358
  /**
2664
2359
  * TOKENS:
@@ -2686,7 +2381,7 @@
2686
2381
 
2687
2382
  /**
2688
2383
  * Do not edit directly
2689
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2384
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2690
2385
  */
2691
2386
  /**
2692
2387
  * TOKENS:
@@ -2774,7 +2469,7 @@
2774
2469
 
2775
2470
  /**
2776
2471
  * Do not edit directly
2777
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2472
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2778
2473
  */
2779
2474
  /**
2780
2475
  * TOKENS:
@@ -2784,7 +2479,7 @@
2784
2479
  */
2785
2480
  /**
2786
2481
  * Do not edit directly
2787
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2482
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2788
2483
  */
2789
2484
  /**
2790
2485
  * TOKENS:
@@ -2794,7 +2489,7 @@
2794
2489
  */
2795
2490
  /**
2796
2491
  * Do not edit directly
2797
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2492
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2798
2493
  */
2799
2494
  /**
2800
2495
  * TOKENS:
@@ -2847,7 +2542,7 @@
2847
2542
 
2848
2543
  /**
2849
2544
  * Do not edit directly
2850
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2545
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2851
2546
  */
2852
2547
  /**
2853
2548
  * TOKENS:
@@ -2922,7 +2617,7 @@
2922
2617
 
2923
2618
  /**
2924
2619
  * Do not edit directly
2925
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2620
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
2926
2621
  */
2927
2622
  /**
2928
2623
  * TOKENS:
@@ -3028,7 +2723,7 @@
3028
2723
 
3029
2724
  /**
3030
2725
  * Do not edit directly
3031
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2726
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3032
2727
  */
3033
2728
  /**
3034
2729
  * TOKENS:
@@ -3051,7 +2746,7 @@
3051
2746
 
3052
2747
  /**
3053
2748
  * Do not edit directly
3054
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2749
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3055
2750
  */
3056
2751
  /**
3057
2752
  * TOKENS:
@@ -3065,7 +2760,7 @@
3065
2760
 
3066
2761
  /**
3067
2762
  * Do not edit directly
3068
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2763
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3069
2764
  */
3070
2765
  /**
3071
2766
  * TOKENS:
@@ -3075,7 +2770,7 @@
3075
2770
  */
3076
2771
  /**
3077
2772
  * Do not edit directly
3078
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2773
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3079
2774
  */
3080
2775
  /**
3081
2776
  * TOKENS:
@@ -3100,7 +2795,7 @@
3100
2795
  }
3101
2796
  /**
3102
2797
  * Do not edit directly
3103
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
2798
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3104
2799
  */
3105
2800
  /**
3106
2801
  * TOKENS:
@@ -3424,7 +3119,7 @@
3424
3119
 
3425
3120
  /**
3426
3121
  * Do not edit directly
3427
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3122
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3428
3123
  */
3429
3124
  /**
3430
3125
  * TOKENS:
@@ -3547,7 +3242,7 @@
3547
3242
 
3548
3243
  /**
3549
3244
  * Do not edit directly
3550
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3245
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3551
3246
  */
3552
3247
  /**
3553
3248
  * TOKENS:
@@ -3753,7 +3448,7 @@
3753
3448
 
3754
3449
  /**
3755
3450
  * Do not edit directly
3756
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3451
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3757
3452
  */
3758
3453
  /**
3759
3454
  * TOKENS:
@@ -3764,7 +3459,7 @@
3764
3459
  .ilo--hero-card {
3765
3460
  height: 100%;
3766
3461
  position: relative;
3767
- padding: 39px 16px;
3462
+ padding: 40px 16px;
3768
3463
  }
3769
3464
  @media screen and (min-width: 1024px) {
3770
3465
  .ilo--hero-card {
@@ -3809,12 +3504,7 @@
3809
3504
  }
3810
3505
  }
3811
3506
  .ilo--hero-card__cornercut {
3812
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 39px, 100% 100%, 0 100%);
3813
- }
3814
- @media screen and (min-width: 1024px) {
3815
- .ilo--hero-card__cornercut {
3816
- clip-path: polygon(0 0, calc(100% - 64px) 0, 100% 64px, 100% 100%, 0 100%);
3817
- }
3507
+ clip-path: polygon(0 0, calc(100% - 116px) 0, 100% 64px, 100% 100%, 0 100%);
3818
3508
  }
3819
3509
  .ilo--hero-card--datecopy {
3820
3510
  font-size: 16px;
@@ -3879,7 +3569,7 @@
3879
3569
 
3880
3570
  /**
3881
3571
  * Do not edit directly
3882
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3572
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3883
3573
  */
3884
3574
  /**
3885
3575
  * TOKENS:
@@ -3935,7 +3625,7 @@
3935
3625
 
3936
3626
  /**
3937
3627
  * Do not edit directly
3938
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3628
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
3939
3629
  */
3940
3630
  /**
3941
3631
  * TOKENS:
@@ -4077,7 +3767,7 @@
4077
3767
 
4078
3768
  /**
4079
3769
  * Do not edit directly
4080
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3770
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4081
3771
  */
4082
3772
  /**
4083
3773
  * TOKENS:
@@ -4087,7 +3777,7 @@
4087
3777
  */
4088
3778
  /**
4089
3779
  * Do not edit directly
4090
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3780
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4091
3781
  */
4092
3782
  /**
4093
3783
  * TOKENS:
@@ -4112,7 +3802,7 @@
4112
3802
  }
4113
3803
  /**
4114
3804
  * Do not edit directly
4115
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3805
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4116
3806
  */
4117
3807
  /**
4118
3808
  * TOKENS:
@@ -4270,7 +3960,7 @@
4270
3960
 
4271
3961
  /**
4272
3962
  * Do not edit directly
4273
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
3963
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4274
3964
  */
4275
3965
  /**
4276
3966
  * TOKENS:
@@ -4365,7 +4055,7 @@
4365
4055
 
4366
4056
  /**
4367
4057
  * Do not edit directly
4368
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4058
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4369
4059
  */
4370
4060
  /**
4371
4061
  * TOKENS:
@@ -4375,7 +4065,7 @@
4375
4065
  */
4376
4066
  /**
4377
4067
  * Do not edit directly
4378
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4068
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4379
4069
  */
4380
4070
  /**
4381
4071
  * TOKENS:
@@ -4385,7 +4075,7 @@
4385
4075
  */
4386
4076
  /**
4387
4077
  * Do not edit directly
4388
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4078
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4389
4079
  */
4390
4080
  /**
4391
4081
  * TOKENS:
@@ -4556,7 +4246,7 @@
4556
4246
 
4557
4247
  /**
4558
4248
  * Do not edit directly
4559
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4249
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4560
4250
  */
4561
4251
  /**
4562
4252
  * TOKENS:
@@ -4603,7 +4293,7 @@
4603
4293
 
4604
4294
  /**
4605
4295
  * Do not edit directly
4606
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4296
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4607
4297
  */
4608
4298
  /**
4609
4299
  * TOKENS:
@@ -4613,7 +4303,7 @@
4613
4303
  */
4614
4304
  /**
4615
4305
  * Do not edit directly
4616
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4306
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4617
4307
  */
4618
4308
  /**
4619
4309
  * TOKENS:
@@ -4623,7 +4313,7 @@
4623
4313
  */
4624
4314
  /**
4625
4315
  * Do not edit directly
4626
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4316
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4627
4317
  */
4628
4318
  /**
4629
4319
  * TOKENS:
@@ -4720,7 +4410,7 @@
4720
4410
 
4721
4411
  /**
4722
4412
  * Do not edit directly
4723
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
4413
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
4724
4414
  */
4725
4415
  /**
4726
4416
  * TOKENS:
@@ -5610,7 +5300,7 @@
5610
5300
 
5611
5301
  /**
5612
5302
  * Do not edit directly
5613
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5303
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5614
5304
  */
5615
5305
  /**
5616
5306
  * TOKENS:
@@ -5620,7 +5310,7 @@
5620
5310
  */
5621
5311
  /**
5622
5312
  * Do not edit directly
5623
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5313
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5624
5314
  */
5625
5315
  /**
5626
5316
  * TOKENS:
@@ -5630,7 +5320,7 @@
5630
5320
  */
5631
5321
  /**
5632
5322
  * Do not edit directly
5633
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5323
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5634
5324
  */
5635
5325
  /**
5636
5326
  * TOKENS:
@@ -5822,7 +5512,7 @@
5822
5512
 
5823
5513
  /**
5824
5514
  * Do not edit directly
5825
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5515
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5826
5516
  */
5827
5517
  /**
5828
5518
  * TOKENS:
@@ -5962,7 +5652,7 @@
5962
5652
 
5963
5653
  /**
5964
5654
  * Do not edit directly
5965
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5655
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5966
5656
  */
5967
5657
  /**
5968
5658
  * TOKENS:
@@ -5972,7 +5662,7 @@
5972
5662
  */
5973
5663
  /**
5974
5664
  * Do not edit directly
5975
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5665
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
5976
5666
  */
5977
5667
  /**
5978
5668
  * TOKENS:
@@ -5997,7 +5687,7 @@
5997
5687
  }
5998
5688
  /**
5999
5689
  * Do not edit directly
6000
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5690
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6001
5691
  */
6002
5692
  /**
6003
5693
  * TOKENS:
@@ -6164,7 +5854,7 @@
6164
5854
 
6165
5855
  /**
6166
5856
  * Do not edit directly
6167
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5857
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6168
5858
  */
6169
5859
  /**
6170
5860
  * TOKENS:
@@ -6271,7 +5961,7 @@
6271
5961
 
6272
5962
  /**
6273
5963
  * Do not edit directly
6274
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5964
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6275
5965
  */
6276
5966
  /**
6277
5967
  * TOKENS:
@@ -6281,7 +5971,7 @@
6281
5971
  */
6282
5972
  /**
6283
5973
  * Do not edit directly
6284
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5974
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6285
5975
  */
6286
5976
  /**
6287
5977
  * TOKENS:
@@ -6306,7 +5996,7 @@
6306
5996
  }
6307
5997
  /**
6308
5998
  * Do not edit directly
6309
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
5999
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6310
6000
  */
6311
6001
  /**
6312
6002
  * TOKENS:
@@ -6367,7 +6057,7 @@
6367
6057
 
6368
6058
  /**
6369
6059
  * Do not edit directly
6370
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6060
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6371
6061
  */
6372
6062
  /**
6373
6063
  * TOKENS:
@@ -6782,7 +6472,7 @@
6782
6472
 
6783
6473
  /**
6784
6474
  * Do not edit directly
6785
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6475
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6786
6476
  */
6787
6477
  /**
6788
6478
  * TOKENS:
@@ -6836,7 +6526,7 @@
6836
6526
 
6837
6527
  /**
6838
6528
  * Do not edit directly
6839
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6529
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6840
6530
  */
6841
6531
  /**
6842
6532
  * TOKENS:
@@ -6994,7 +6684,7 @@
6994
6684
 
6995
6685
  /**
6996
6686
  * Do not edit directly
6997
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
6687
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
6998
6688
  */
6999
6689
  /**
7000
6690
  * TOKENS:
@@ -7345,7 +7035,7 @@
7345
7035
 
7346
7036
  /**
7347
7037
  * Do not edit directly
7348
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7038
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7349
7039
  */
7350
7040
  /**
7351
7041
  * TOKENS:
@@ -7531,7 +7221,7 @@
7531
7221
 
7532
7222
  /**
7533
7223
  * Do not edit directly
7534
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7224
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7535
7225
  */
7536
7226
  /**
7537
7227
  * TOKENS:
@@ -7589,7 +7279,7 @@
7589
7279
 
7590
7280
  /**
7591
7281
  * Do not edit directly
7592
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7282
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7593
7283
  */
7594
7284
  /**
7595
7285
  * TOKENS:
@@ -7763,7 +7453,7 @@
7763
7453
 
7764
7454
  /**
7765
7455
  * Do not edit directly
7766
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7456
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7767
7457
  */
7768
7458
  /**
7769
7459
  * TOKENS:
@@ -7938,7 +7628,7 @@
7938
7628
 
7939
7629
  /**
7940
7630
  * Do not edit directly
7941
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
7631
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
7942
7632
  */
7943
7633
  /**
7944
7634
  * TOKENS:
@@ -8848,7 +8538,7 @@
8848
8538
 
8849
8539
  /**
8850
8540
  * Do not edit directly
8851
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8541
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
8852
8542
  */
8853
8543
  /**
8854
8544
  * TOKENS:
@@ -8858,7 +8548,7 @@
8858
8548
  */
8859
8549
  /**
8860
8550
  * Do not edit directly
8861
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8551
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
8862
8552
  */
8863
8553
  /**
8864
8554
  * TOKENS:
@@ -8883,7 +8573,7 @@
8883
8573
  }
8884
8574
  /**
8885
8575
  * Do not edit directly
8886
- * Generated on Mon, 07 Aug 2023 16:13:26 GMT
8576
+ * Generated on Wed, 16 Aug 2023 08:41:51 GMT
8887
8577
  */
8888
8578
  /**
8889
8579
  * TOKENS: