hr-design-system-handlebars 1.11.12 → 1.12.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 (118) hide show
  1. package/.storybook/main.js +9 -0
  2. package/.storybook/manager.js +18 -18
  3. package/.storybook/preview.js +9 -1
  4. package/CHANGELOG.md +25 -0
  5. package/README.md +13 -2
  6. package/build/handlebars/handlebars.js +1 -1
  7. package/build/scripts/build.js +1 -1
  8. package/config.js +1 -0
  9. package/dist/assets/index.css +225 -189
  10. package/dist/views/components/base/image/icon.hbs +1 -1
  11. package/dist/views/components/base/link.hbs +11 -1
  12. package/dist/views/components/base/link_open.hbs +12 -13
  13. package/dist/views/components/base/link_v2.hbs +14 -0
  14. package/dist/views/components/button/button.hbs +9 -24
  15. package/dist/views/components/button/components/button_icon.hbs +2 -1
  16. package/dist/views/components/button/components/button_label.hbs +1 -1
  17. package/dist/views/components/button/link_button.hbs +6 -0
  18. package/dist/views/components/button/utilities/button_base_classes.hbs +1 -0
  19. package/dist/views/components/button/utilities/button_dimension_classes.hbs +1 -0
  20. package/dist/views/components/button/utilities/button_on_image_classes.hbs +39 -0
  21. package/dist/views/components/button/utilities/button_variation_classes.hbs +14 -0
  22. package/dist/views/components/content_nav/content_nav_container.hbs +1 -1
  23. package/dist/views/components/content_nav/content_nav_item.hbs +1 -1
  24. package/dist/views/components/event/calendar/event_calendar_footer.hbs +1 -1
  25. package/dist/views/components/event/event_ticket_button.hbs +11 -9
  26. package/dist/views/components/grid/grid_group_highlight.hbs +1 -1
  27. package/dist/views/components/label/label_old.hbs +1 -1
  28. package/dist/views/components/mediaplayer/media_player.hbs +4 -22
  29. package/dist/views/components/mediaplayer/mediaplayer_button.hbs +9 -0
  30. package/dist/views/components/modal/modal.hbs +2 -2
  31. package/dist/views/components/site_header/brand_navigation/brand_navigation.hbs +1 -1
  32. package/dist/views/components/teaser/cluster/teaser_cluster.hbs +4 -1
  33. package/dist/views/components/teaser/cluster/teaser_cluster_byline.hbs +1 -1
  34. package/dist/views/components/teaser/cluster/teaser_cluster_item.hbs +1 -1
  35. package/dist/views/components/teaser/components/teaser_av_consumption_close_button.hbs +6 -20
  36. package/dist/views/components/teaser/components/teaser_byline.hbs +1 -1
  37. package/dist/views/components/teaser/components/teaser_image.hbs +7 -15
  38. package/dist/views/components/teaser/components/teaser_ticker_body.hbs +40 -0
  39. package/dist/views/components/teaser/podcast/podcast_subscribe_button.hbs +18 -15
  40. package/dist/views/components/teaser/podcast/podcast_title.hbs +2 -2
  41. package/dist/views/components/teaser/tabbox/group_tabbox.hbs +4 -1
  42. package/dist/views/components/teaser/tabbox/teaser_tabbox.hbs +10 -11
  43. package/dist/views/components/teaser/teaser_poster.hbs +5 -1
  44. package/dist/views/components/teaser/ticker/teaser_ticker.hbs +4 -4
  45. package/gulpfile.js +9 -0
  46. package/package.json +4 -2
  47. package/src/assets/css/custom-components.css +37 -38
  48. package/src/assets/css/custom-utilities.css +2 -2
  49. package/src/assets/fixtures/event/calendar/event_calendar_months.inc.json +5 -1
  50. package/src/assets/fixtures/teaser/teaser_ticker.inc.json +3 -3
  51. package/src/assets/fixtures/teaser/ticker_teaser_standard_100.json +5 -1
  52. package/src/assets/tailwind.css +54 -22
  53. package/src/stories/conventions-and-datastructure.mdx +217 -4
  54. package/src/stories/views/components/base/image/icon.hbs +1 -1
  55. package/src/stories/views/components/base/link.hbs +11 -1
  56. package/src/stories/views/components/base/link_open.hbs +12 -13
  57. package/src/stories/views/components/base/link_v2.hbs +14 -0
  58. package/src/stories/views/components/button/button.hbs +9 -24
  59. package/src/stories/views/components/button/button.mdx +186 -0
  60. package/src/stories/views/components/button/button.stories.js +508 -0
  61. package/src/stories/views/components/button/components/button_icon.hbs +2 -1
  62. package/src/stories/views/components/button/components/button_icon.mdx +25 -0
  63. package/src/stories/views/components/button/components/button_icon.stories.js +44 -0
  64. package/src/stories/views/components/button/components/button_label.hbs +1 -1
  65. package/src/stories/views/components/button/components/button_label.mdx +25 -0
  66. package/src/stories/views/components/button/components/button_label.stories.js +33 -0
  67. package/src/stories/views/components/button/link_button.hbs +6 -0
  68. package/src/stories/views/components/button/link_button.mdx +137 -0
  69. package/src/stories/views/components/button/link_button.stories.js +420 -0
  70. package/src/stories/views/components/button/utilities/button_base_classes.hbs +1 -0
  71. package/src/stories/views/components/button/utilities/button_dimension_classes.hbs +1 -0
  72. package/src/stories/views/components/button/utilities/button_on_image_classes.hbs +39 -0
  73. package/src/stories/views/components/button/utilities/button_variation_classes.hbs +14 -0
  74. package/src/stories/views/components/content_nav/content_nav_container.hbs +1 -1
  75. package/src/stories/views/components/content_nav/content_nav_item.hbs +1 -1
  76. package/src/stories/views/components/event/calendar/event_calendar_footer.hbs +1 -1
  77. package/src/stories/views/components/event/event_ticket_button.hbs +11 -9
  78. package/src/stories/views/components/grid/grid_group_highlight.hbs +1 -1
  79. package/src/stories/views/components/label/label_old.hbs +1 -1
  80. package/src/stories/views/components/mediaplayer/media_player.hbs +4 -22
  81. package/src/stories/views/components/mediaplayer/mediaplayer_button.hbs +9 -0
  82. package/src/stories/views/components/mediaplayer/mediaplayer_button.mdx +82 -0
  83. package/src/stories/views/components/mediaplayer/mediaplayer_button.stories.js +178 -0
  84. package/src/stories/views/components/modal/modal.hbs +2 -2
  85. package/src/stories/views/components/site_header/brand_navigation/brand_navigation.hbs +1 -1
  86. package/src/stories/views/components/teaser/cluster/teaser_cluster.hbs +4 -1
  87. package/src/stories/views/components/teaser/cluster/teaser_cluster_byline.hbs +1 -1
  88. package/src/stories/views/components/teaser/cluster/teaser_cluster_item.hbs +1 -1
  89. package/src/stories/views/components/teaser/components/teaser_av_consumption_close_button.hbs +6 -20
  90. package/src/stories/views/components/teaser/components/teaser_byline.hbs +1 -1
  91. package/src/stories/views/components/teaser/components/teaser_image.hbs +7 -15
  92. package/src/stories/views/components/teaser/components/teaser_ticker_body.hbs +40 -0
  93. package/src/stories/views/components/teaser/fixtures/teaser_event_calendar_100_serif.json +1 -1
  94. package/src/stories/views/components/teaser/fixtures/ticker_teaser_standard_100.json +1 -1
  95. package/src/stories/views/components/teaser/podcast/podcast_subscribe_button.hbs +18 -15
  96. package/src/stories/views/components/teaser/podcast/podcast_title.hbs +2 -2
  97. package/src/stories/views/components/teaser/tabbox/group_tabbox.hbs +4 -1
  98. package/src/stories/views/components/teaser/tabbox/teaser_tabbox.hbs +10 -11
  99. package/src/stories/views/components/teaser/teaser_poster.hbs +5 -1
  100. package/src/stories/views/components/teaser/ticker/teaser_ticker.hbs +4 -4
  101. package/src/stories/views/components/teaser/ticker/teaser_ticker.stories.js +1 -1
  102. package/tailwind.config.js +8 -1
  103. package/dist/views/components/button/button_pseudo.hbs +0 -8
  104. package/dist/views/components/button/button_pseudo.inc.hbs +0 -18
  105. package/dist/views/components/button/button_pseudo_v2.hbs +0 -12
  106. package/dist/views/components/button/button_round.hbs +0 -23
  107. package/dist/views/components/button/button_round_classes.hbs +0 -46
  108. package/dist/views/components/button/button_transparent.hbs +0 -17
  109. package/dist/views/components/button/button_v2.hbs +0 -7
  110. package/dist/views/components/button/components/button_pseudo_link.hbs +0 -3
  111. package/src/stories/views/components/button/button_pseudo.hbs +0 -8
  112. package/src/stories/views/components/button/button_pseudo.inc.hbs +0 -18
  113. package/src/stories/views/components/button/button_pseudo_v2.hbs +0 -12
  114. package/src/stories/views/components/button/button_round.hbs +0 -23
  115. package/src/stories/views/components/button/button_round_classes.hbs +0 -46
  116. package/src/stories/views/components/button/button_transparent.hbs +0 -17
  117. package/src/stories/views/components/button/button_v2.hbs +0 -7
  118. package/src/stories/views/components/button/components/button_pseudo_link.hbs +0 -3
@@ -1,5 +1,5 @@
1
1
  /*
2
- ! tailwindcss v3.2.7 | MIT License | https://tailwindcss.com
2
+ ! tailwindcss v3.3.1 | MIT License | https://tailwindcss.com
3
3
  *//*
4
4
  1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
5
5
  2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
@@ -25,6 +25,7 @@
25
25
  3. Use a more readable tab size.
26
26
  4. Use the user's configured `sans` font-family by default.
27
27
  5. Use the user's configured `sans` font-feature-settings by default.
28
+ 6. Use the user's configured `sans` font-variation-settings by default.
28
29
  */
29
30
 
30
31
  html {
@@ -35,6 +36,7 @@ html {
35
36
  tab-size: 4; /* 3 */
36
37
  font-family: DIN, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
37
38
  font-feature-settings: normal; /* 5 */
39
+ font-variation-settings: normal; /* 6 */
38
40
  }
39
41
 
40
42
  /*
@@ -421,7 +423,7 @@ video {
421
423
  font-stretch: condensed;
422
424
  }
423
425
 
424
- .-translate-x-1\/2, .-translate-x-2\/4, .-translate-y-1\/2, .-rotate-45, .rotate-180, .rotate-45, .scale-50, .scale-y-100, .scale-y-90, .transform, .is-loading::after {
426
+ .-translate-x-1\/2, .-translate-x-2\/4, .-translate-y-1\/2, .-rotate-45, .rotate-180, .rotate-45, .scale-50, .scale-y-100, .scale-y-90, .transform, .is-loading::after, .active\:scale-95 {
425
427
  --tw-translate-x: 0;
426
428
  --tw-translate-y: 0;
427
429
  --tw-rotate: 0;
@@ -431,7 +433,7 @@ video {
431
433
  --tw-scale-y: 1;
432
434
  }
433
435
 
434
- .btn--secondary, .ds-focus, .ds-focus:not(:focus-visible), .ds-button, .ds-button:not(:focus-visible), .ds-button-round, .ds-button-round:not(:focus-visible), .ds-link, .ds-link:not(:focus-visible), .ds-link-clusterTeaser, .ds-link-clusterTeaser:not(:focus-visible), .ds-teaser-focus::before, span, .ds-teaser-focus:not(:focus-visible)::before, .-isOpen, .shadow, .shadow-inner, .shadow-md, .shadow-xl, .before\:shadow-stage::before {
436
+ .btn--secondary, .ds-focus, .ds-focus:not(:focus-visible), .ds-button, .ds-button:not(:focus-visible), .ds-button-round, .ds-button-round:not(:focus-visible), .ds-link, .ds-link:not(:focus-visible), .ds-teaser-focus, .ds-teaser-focus::before, .ds-cta > *, .ds-teaser-focus:not(:focus-visible)::before, .-isOpen, .shadow-inner, .shadow-md, .shadow-xl, .before\:shadow-stage::before {
435
437
  --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);
436
438
  --tw-ring-shadow: 0 0 rgba(0,0,0,0);
437
439
  --tw-shadow: 0 0 rgba(0,0,0,0);
@@ -557,7 +559,8 @@ video {
557
559
  .headline-barrier:after {
558
560
  border-bottom: 1px solid;
559
561
  content: '';
560
- padding-top: 0.875rem}
562
+ padding-top: 0.875rem;
563
+ }
561
564
  @media (min-width: 768px) {
562
565
 
563
566
  .headline-barrier:before,
@@ -596,7 +599,7 @@ video {
596
599
  }
597
600
  /* CONTENT NAV ACCENTED GROUP MIXED*/
598
601
  .group-accented .autoSuggest .mixed-input {
599
- border-color: transparent!important;
602
+ border-color: transparent !important;
600
603
  }
601
604
  .group-accented .autoSuggest .mixed-input {
602
605
  height: 32px;
@@ -660,9 +663,6 @@ video {
660
663
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
661
664
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
662
665
  }
663
- .ds-link {
664
- display: block;
665
- }
666
666
  .ds-link:focus {
667
667
  --tw-shadow: 0 0 0 0.25rem;
668
668
  --tw-shadow-colored: 0 0 0 0.25rem var(--tw-shadow-color);
@@ -679,30 +679,12 @@ video {
679
679
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
680
680
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
681
681
  }
682
- .ds-link-clusterTeaser {
683
- display: block;
684
- --tw-text-opacity: 1;
685
- color: rgba(96, 96, 96, var(--tw-text-opacity));
686
- }
687
- .ds-link-clusterTeaser:focus {
688
- --tw-shadow: 0 0 0 0.25rem;
689
- --tw-shadow-colored: 0 0 0 0.25rem var(--tw-shadow-color);
690
- box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
691
- box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
692
- --tw-shadow-color: var(--color-focus-state);
693
- --tw-shadow: var(--tw-shadow-colored);
694
- outline: 2px solid transparent;
695
- outline-offset: 2px;
696
- }
697
- .ds-link-clusterTeaser:focus:not(:focus-visible) {
682
+ .ds-link.ds-teaser-focus:focus {
698
683
  --tw-shadow: 0 0 rgba(0,0,0,0);
699
684
  --tw-shadow-colored: 0 0 rgba(0,0,0,0);
700
685
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
701
686
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
702
687
  }
703
- .ds-link-inset {
704
- display: block;
705
- }
706
688
  .ds-link-inset:focus {
707
689
  outline: 2px solid transparent;
708
690
  outline-offset: 2px;
@@ -730,7 +712,7 @@ video {
730
712
  content: var(--tw-content);
731
713
  }
732
714
  .ds-teaser-focus:focus::before,
733
- .ds-teaser-focus:focus + .ds-cta span {
715
+ .ds-teaser-focus:focus + .ds-cta > * {
734
716
  --tw-shadow: 0 0 0 0.25rem;
735
717
  --tw-shadow-colored: 0 0 0 0.25rem var(--tw-shadow-color);
736
718
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
@@ -738,7 +720,7 @@ video {
738
720
  --tw-shadow-color: var(--color-focus-state);
739
721
  --tw-shadow: var(--tw-shadow-colored);
740
722
  }
741
- .ds-teaser-focus:focus + .ds-cta span {
723
+ .ds-teaser-focus:focus + .ds-cta > * {
742
724
  background-color: #ffffff;
743
725
  background-color: var(--color-button-inverted);
744
726
  color: #006dc1;
@@ -746,13 +728,13 @@ video {
746
728
  border-style: none;
747
729
  }
748
730
  .ds-teaser-focus:focus:not(:focus-visible)::before,
749
- .ds-teaser-focus:focus:not(:focus-visible) + .ds-cta span {
731
+ .ds-teaser-focus:focus:not(:focus-visible) + .ds-cta > * {
750
732
  --tw-shadow: 0 0 rgba(0,0,0,0);
751
733
  --tw-shadow-colored: 0 0 rgba(0,0,0,0);
752
734
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
753
735
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
754
736
  }
755
- .ds-teaser-focus:focus:not(:focus-visible) + .ds-cta span {
737
+ .ds-teaser-focus:focus:not(:focus-visible) + .ds-cta > * {
756
738
  background-color: transparent;
757
739
  color: #ffffff;
758
740
  color: var(--color-button-inverted);
@@ -972,6 +954,11 @@ video {
972
954
  display: block;
973
955
  }
974
956
  }
957
+ /* ---------------------------- BUTTON ------------------------------ */
958
+ .ds-button-label + .ds-button-icon,
959
+ .ds-button-icon + .ds-button-label {
960
+ margin-left: 0.5rem;
961
+ }
975
962
  .sr-only {
976
963
  position: absolute;
977
964
  width: 1px;
@@ -992,6 +979,9 @@ video {
992
979
  .invisible {
993
980
  visibility: hidden;
994
981
  }
982
+ .\!static {
983
+ position: static !important;
984
+ }
995
985
  .static {
996
986
  position: static;
997
987
  }
@@ -1035,6 +1025,18 @@ video {
1035
1025
  .right-auto {
1036
1026
  right: auto;
1037
1027
  }
1028
+ [dir="ltr"] .start-1 {
1029
+ left: 0.25rem;
1030
+ }
1031
+ [dir="rtl"] .start-1 {
1032
+ right: 0.25rem;
1033
+ }
1034
+ [dir="ltr"] .start-8 {
1035
+ left: 2rem;
1036
+ }
1037
+ [dir="rtl"] .start-8 {
1038
+ right: 2rem;
1039
+ }
1038
1040
  .top-0 {
1039
1041
  top: 0px;
1040
1042
  }
@@ -1095,8 +1097,11 @@ video {
1095
1097
  .m-1 {
1096
1098
  margin: 0.25rem;
1097
1099
  }
1098
- .m-1\.5 {
1099
- margin: 0.375rem;
1100
+ .m-2 {
1101
+ margin: 0.5rem;
1102
+ }
1103
+ .m-4 {
1104
+ margin: 1rem;
1100
1105
  }
1101
1106
  .mx-0 {
1102
1107
  margin-left: 0px;
@@ -1126,10 +1131,6 @@ video {
1126
1131
  margin-left: 1px;
1127
1132
  margin-right: 1px;
1128
1133
  }
1129
- .my-2 {
1130
- margin-top: 0.5rem;
1131
- margin-bottom: 0.5rem;
1132
- }
1133
1134
  .my-4 {
1134
1135
  margin-top: 1rem;
1135
1136
  margin-bottom: 1rem;
@@ -1262,6 +1263,12 @@ video {
1262
1263
  .box-border {
1263
1264
  box-sizing: border-box;
1264
1265
  }
1266
+ .line-clamp-4 {
1267
+ overflow: hidden;
1268
+ display: -webkit-box;
1269
+ -webkit-box-orient: vertical;
1270
+ -webkit-line-clamp: 4;
1271
+ }
1265
1272
  .block {
1266
1273
  display: block;
1267
1274
  }
@@ -1601,11 +1608,8 @@ video {
1601
1608
  .justify-around {
1602
1609
  justify-content: space-around;
1603
1610
  }
1604
- .gap-1 {
1605
- gap: 0.25rem;
1606
- }
1607
- .gap-1\.5 {
1608
- gap: 0.375rem;
1611
+ .justify-items-center {
1612
+ justify-items: center;
1609
1613
  }
1610
1614
  .gap-5 {
1611
1615
  gap: 1.25rem;
@@ -1689,6 +1693,10 @@ video {
1689
1693
  text-overflow: ellipsis;
1690
1694
  white-space: nowrap;
1691
1695
  }
1696
+ .hyphens-auto {
1697
+ -webkit-hyphens: auto;
1698
+ hyphens: auto;
1699
+ }
1692
1700
  .whitespace-nowrap {
1693
1701
  white-space: nowrap;
1694
1702
  }
@@ -1788,17 +1796,11 @@ video {
1788
1796
  --tw-border-opacity: 1;
1789
1797
  border-color: rgba(0, 82, 147, var(--tw-border-opacity));
1790
1798
  }
1791
- .border-button {
1792
- border-color: #005293;
1793
- border-color: var(--color-button);
1799
+ .border-button-primary {
1800
+ border-color: var(--color-button-primary);
1794
1801
  }
1795
- .border-button-hollow {
1796
- border-color: #006dc1;
1797
- border-color: var(--color-button-hollow);
1798
- }
1799
- .border-button-inverted {
1800
- border-color: #ffffff;
1801
- border-color: var(--color-button-inverted);
1802
+ .border-button-primary--inverted {
1803
+ border-color: var(--color-button-primary-inverted);
1802
1804
  }
1803
1805
  .border-clusterTeaserHeadline {
1804
1806
  border-color: #005293;
@@ -1828,6 +1830,9 @@ video {
1828
1830
  --tw-border-opacity: 1;
1829
1831
  border-color: rgba(13, 148, 136, var(--tw-border-opacity));
1830
1832
  }
1833
+ .border-transparent {
1834
+ border-color: transparent;
1835
+ }
1831
1836
  .border-white {
1832
1837
  --tw-border-opacity: 1;
1833
1838
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
@@ -1836,6 +1841,10 @@ video {
1836
1841
  --tw-bg-opacity: 1 !important;
1837
1842
  background-color: rgba(255, 255, 255, var(--tw-bg-opacity)) !important;
1838
1843
  }
1844
+ .bg-blue-200 {
1845
+ --tw-bg-opacity: 1;
1846
+ background-color: rgba(191, 219, 254, var(--tw-bg-opacity));
1847
+ }
1839
1848
  .bg-blue-400 {
1840
1849
  --tw-bg-opacity: 1;
1841
1850
  background-color: rgba(96, 165, 250, var(--tw-bg-opacity));
@@ -1844,13 +1853,14 @@ video {
1844
1853
  --tw-bg-opacity: 1;
1845
1854
  background-color: rgba(0, 82, 147, var(--tw-bg-opacity));
1846
1855
  }
1847
- .bg-button {
1848
- background-color: #005293;
1849
- background-color: var(--color-button);
1856
+ .bg-button-primary {
1857
+ background-color: var(--color-button-primary);
1850
1858
  }
1851
- .bg-button-inverted {
1852
- background-color: #ffffff;
1853
- background-color: var(--color-button-inverted);
1859
+ .bg-button-primary--dark {
1860
+ background-color: var(--color-button-primary-dark);
1861
+ }
1862
+ .bg-button-primary--inverted {
1863
+ background-color: var(--color-button-primary-inverted);
1854
1864
  }
1855
1865
  .bg-current {
1856
1866
  background-color: currentColor;
@@ -1879,18 +1889,18 @@ video {
1879
1889
  --tw-bg-opacity: 1;
1880
1890
  background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
1881
1891
  }
1882
- .bg-green-200 {
1883
- --tw-bg-opacity: 1;
1884
- background-color: rgba(187, 247, 208, var(--tw-bg-opacity));
1885
- }
1886
- .bg-grey-alabaster {
1892
+ .bg-gray-alabaster {
1887
1893
  --tw-bg-opacity: 1;
1888
1894
  background-color: rgba(247, 247, 247, var(--tw-bg-opacity));
1889
1895
  }
1890
- .bg-grey-concrete {
1896
+ .bg-gray-concrete {
1891
1897
  --tw-bg-opacity: 1;
1892
1898
  background-color: rgba(243, 243, 243, var(--tw-bg-opacity));
1893
1899
  }
1900
+ .bg-green-200 {
1901
+ --tw-bg-opacity: 1;
1902
+ background-color: rgba(187, 247, 208, var(--tw-bg-opacity));
1903
+ }
1894
1904
  .bg-highlight-1 {
1895
1905
  background-color: #eaf3fa;
1896
1906
  background-color: var(--color-highlight-1);
@@ -1955,6 +1965,10 @@ video {
1955
1965
  background-color: #006eb7;
1956
1966
  background-color: var(--color-podcast-text);
1957
1967
  }
1968
+ .bg-primary {
1969
+ background-color: #005293;
1970
+ background-color: var(--color-primary-ds);
1971
+ }
1958
1972
  .bg-red-200 {
1959
1973
  --tw-bg-opacity: 1;
1960
1974
  background-color: rgba(254, 202, 202, var(--tw-bg-opacity));
@@ -1977,22 +1991,29 @@ video {
1977
1991
  background-image: linear-gradient(to top, var(--tw-gradient-stops));
1978
1992
  }
1979
1993
  .from-black {
1980
- --tw-gradient-from: #000000;
1981
- --tw-gradient-to: rgba(0, 0, 0, 0);
1994
+ --tw-gradient-from: #000000 var(--tw-gradient-from-position);
1995
+ --tw-gradient-from-position: ;
1996
+ --tw-gradient-to: rgba(0, 0, 0, 0) var(--tw-gradient-from-position);
1997
+ --tw-gradient-to-position: ;
1982
1998
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
1983
1999
  }
1984
2000
  .from-purple-50 {
1985
- --tw-gradient-from: #faf5ff;
1986
- --tw-gradient-to: rgba(250, 245, 255, 0);
2001
+ --tw-gradient-from: #faf5ff var(--tw-gradient-from-position);
2002
+ --tw-gradient-from-position: ;
2003
+ --tw-gradient-to: rgba(250, 245, 255, 0) var(--tw-gradient-from-position);
2004
+ --tw-gradient-to-position: ;
1987
2005
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
1988
2006
  }
1989
2007
  .from-white {
1990
- --tw-gradient-from: #ffffff;
1991
- --tw-gradient-to: rgba(255, 255, 255, 0);
2008
+ --tw-gradient-from: #ffffff var(--tw-gradient-from-position);
2009
+ --tw-gradient-from-position: ;
2010
+ --tw-gradient-to: rgba(255, 255, 255, 0) var(--tw-gradient-from-position);
2011
+ --tw-gradient-to-position: ;
1992
2012
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
1993
2013
  }
1994
2014
  .to-purple-100 {
1995
- --tw-gradient-to: #f3e8ff;
2015
+ --tw-gradient-to: #f3e8ff var(--tw-gradient-to-position);
2016
+ --tw-gradient-to-position: ;
1996
2017
  }
1997
2018
  .fill-blue-congress {
1998
2019
  fill: #005293;
@@ -2003,18 +2024,6 @@ video {
2003
2024
  .fill-blue-midnight {
2004
2025
  fill: #023770;
2005
2026
  }
2006
- .fill-button {
2007
- fill: #005293;
2008
- fill: var(--color-button);
2009
- }
2010
- .fill-button-hollow {
2011
- fill: #006dc1;
2012
- fill: var(--color-button-hollow);
2013
- }
2014
- .fill-button-inverted {
2015
- fill: #ffffff;
2016
- fill: var(--color-button-inverted);
2017
- }
2018
2027
  .fill-content-nav {
2019
2028
  fill: #005293;
2020
2029
  fill: var(--color-content-nav);
@@ -2026,9 +2035,6 @@ video {
2026
2035
  fill: #797979;
2027
2036
  fill: var(--color-eventcalendar-secondary);
2028
2037
  }
2029
- .fill-inherit {
2030
- fill: inherit;
2031
- }
2032
2038
  .fill-white {
2033
2039
  fill: #ffffff;
2034
2040
  }
@@ -2109,6 +2115,10 @@ video {
2109
2115
  padding-top: 0px;
2110
2116
  padding-bottom: 0px;
2111
2117
  }
2118
+ .py-0\.5 {
2119
+ padding-top: 0.125rem;
2120
+ padding-bottom: 0.125rem;
2121
+ }
2112
2122
  .py-1 {
2113
2123
  padding-top: 0.25rem;
2114
2124
  padding-bottom: 0.25rem;
@@ -2157,10 +2167,6 @@ video {
2157
2167
  padding-top: 2rem;
2158
2168
  padding-bottom: 2rem;
2159
2169
  }
2160
- .py-px {
2161
- padding-top: 1px;
2162
- padding-bottom: 1px;
2163
- }
2164
2170
  .pb-0 {
2165
2171
  padding-bottom: 0px;
2166
2172
  }
@@ -2405,6 +2411,10 @@ video {
2405
2411
  color: #ffffff !important;
2406
2412
  color: var(--color-stage-text) !important;
2407
2413
  }
2414
+ .\!text-stone-950 {
2415
+ --tw-text-opacity: 1 !important;
2416
+ color: rgba(12, 10, 9, var(--tw-text-opacity)) !important;
2417
+ }
2408
2418
  .\!text-white {
2409
2419
  --tw-text-opacity: 1 !important;
2410
2420
  color: rgba(255, 255, 255, var(--tw-text-opacity)) !important;
@@ -2429,18 +2439,20 @@ video {
2429
2439
  --tw-text-opacity: 1;
2430
2440
  color: rgba(0, 109, 193, var(--tw-text-opacity));
2431
2441
  }
2432
- .text-button {
2433
- color: #005293;
2434
- color: var(--color-button);
2435
- }
2436
- .text-button-hollow {
2437
- color: #006dc1;
2438
- color: var(--color-button-hollow);
2439
- }
2440
2442
  .text-button-inverted {
2441
2443
  color: #ffffff;
2442
2444
  color: var(--color-button-inverted);
2443
2445
  }
2446
+ .text-button-primary {
2447
+ color: var(--color-button-primary);
2448
+ }
2449
+ .text-button-primary--inverted {
2450
+ color: var(--color-button-primary-inverted);
2451
+ }
2452
+ .text-button-secondary {
2453
+ color: #006dc1;
2454
+ color: var(--color-button-secondary);
2455
+ }
2444
2456
  .text-byline {
2445
2457
  color: #606060;
2446
2458
  color: var(--color-byline);
@@ -2461,11 +2473,11 @@ video {
2461
2473
  color: #cc1a14;
2462
2474
  color: var(--color-event-status);
2463
2475
  }
2464
- .text-grey-dark {
2476
+ .text-gray-dark {
2465
2477
  --tw-text-opacity: 1;
2466
2478
  color: rgba(112, 112, 112, var(--tw-text-opacity));
2467
2479
  }
2468
- .text-grey-scorpion {
2480
+ .text-gray-scorpion {
2469
2481
  --tw-text-opacity: 1;
2470
2482
  color: rgba(96, 96, 96, var(--tw-text-opacity));
2471
2483
  }
@@ -2571,12 +2583,6 @@ video {
2571
2583
  .opacity-80 {
2572
2584
  opacity: 0.8;
2573
2585
  }
2574
- .shadow {
2575
- --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
2576
- --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
2577
- box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
2578
- box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
2579
- }
2580
2586
  .shadow-inner {
2581
2587
  --tw-shadow: inset 0 0px 5px 0 rgba(0, 0, 0, 0.25);
2582
2588
  --tw-shadow-colored: inset 0 0px 5px 0 var(--tw-shadow-color);
@@ -2679,13 +2685,7 @@ video {
2679
2685
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
2680
2686
  }
2681
2687
  .counter-reset {
2682
- counter-reset: cnt1681950034913;
2683
- }
2684
- .line-clamp-4 {
2685
- overflow: hidden;
2686
- display: -webkit-box;
2687
- -webkit-box-orient: vertical;
2688
- -webkit-line-clamp: 4;
2688
+ counter-reset: cnt1682005699181;
2689
2689
  }
2690
2690
  .hyphens-auto {
2691
2691
  -webkit-hyphens: auto;
@@ -2917,7 +2917,7 @@ video {
2917
2917
  --tw-ring-color: rgba(255, 255, 255, 0.5);
2918
2918
  }
2919
2919
  .-ordered {
2920
- counter-increment: cnt1681950034913 1;
2920
+ counter-increment: cnt1682005699181 1;
2921
2921
  }
2922
2922
  .-ordered::before {
2923
2923
  position: absolute;
@@ -2933,7 +2933,7 @@ video {
2933
2933
  letter-spacing: .0125em;
2934
2934
  --tw-text-opacity: 1;
2935
2935
  color: rgba(0, 0, 0, var(--tw-text-opacity));
2936
- content: counter(cnt1681950034913);
2936
+ content: counter(cnt1682005699181);
2937
2937
  }
2938
2938
  /*! ****************************/
2939
2939
  /*! text-shadow */
@@ -3037,6 +3037,8 @@ video {
3037
3037
  --color-button: var(--color-primary-ds);
3038
3038
  --color-button-inverted: #ffffff;
3039
3039
  --color-button-hollow: #006dc1;
3040
+ --color-button-secondary: #006dc1;
3041
+ --color-button-ghost: #006dc1;
3040
3042
  /* Media-Button */
3041
3043
  --color-media-button: #276b9e;
3042
3044
  /* States */
@@ -3102,8 +3104,14 @@ video {
3102
3104
  --color-cluster-teaser-headline: #005293;
3103
3105
  /* Button */
3104
3106
  --color-button: var(--color-primary-ds);
3107
+ --color-button-primary: #006dc1;
3108
+ --color-button-primary-dark: #005293;
3109
+ --color-button-primary-inverted: #ffffff;
3110
+ --color-button-primary-inverted-dark: #eaf3fa;
3105
3111
  --color-button-inverted: #ffffff;
3106
3112
  --color-button-hollow: #006dc1;
3113
+ --color-button-secondary: #006dc1;
3114
+ --color-button-ghost: #006dc1;
3107
3115
  /* Media-Button */
3108
3116
  --color-media-button: #006dc1;
3109
3117
  /* States */
@@ -3164,6 +3172,8 @@ video {
3164
3172
  --color-button: var(--color-primary-ds);
3165
3173
  --color-button-inverted: #ffffff;
3166
3174
  --color-button-hollow: #a00d65;
3175
+ --color-button-secondary: #a00d65;
3176
+ --color-button-ghost: #a00d65;
3167
3177
  /* Media-Button */
3168
3178
  --color-media-button: var(--color-primary-ds);
3169
3179
  /* States */
@@ -3219,6 +3229,8 @@ video {
3219
3229
  --color-button: var(--color-primary-ds);
3220
3230
  --color-button-inverted: #ffffff;
3221
3231
  --color-button-hollow: #276b9e;
3232
+ --color-button-secondary: #276b9e;
3233
+ --color-button-ghost: #276b9e;
3222
3234
  /* Media-Button */
3223
3235
  --color-media-button: var(--color-primary-ds);
3224
3236
  /* States */
@@ -3276,6 +3288,8 @@ video {
3276
3288
  --color-button: #006eb7;
3277
3289
  --color-button-inverted: #ffffff;
3278
3290
  --color-button-hollow: #006eb7;
3291
+ --color-button-secondary: #006eb7;
3292
+ --color-button-ghost: #006eb7;
3279
3293
  /* Media-Button */
3280
3294
  --color-media-button: var(--color-primary-ds);
3281
3295
  /* States */
@@ -3333,6 +3347,8 @@ video {
3333
3347
  --color-button: var(--color-primary-ds);
3334
3348
  --color-button-inverted: #ffffff;
3335
3349
  --color-button-hollow: var(--color-primary-ds);
3350
+ --color-button-secondary: var(--color-primary-ds);
3351
+ --color-button-ghost: var(--color-primary-ds);
3336
3352
  /* Media-Button */
3337
3353
  --color-media-button: var(--color-primary-ds);
3338
3354
  /* States */
@@ -3388,6 +3404,8 @@ video {
3388
3404
  --color-button: #AB2F2D;
3389
3405
  --color-button-inverted: #ffffff;
3390
3406
  --color-button-hollow: #AB2F2D;
3407
+ --color-button-secondary: #AB2F2D;
3408
+ --color-button-ghost: #AB2F2D;
3391
3409
  /* Media-Button */
3392
3410
  --color-media-button: #AB2F2D;
3393
3411
  /* States */
@@ -3443,6 +3461,8 @@ video {
3443
3461
  --color-button: #007A7C;
3444
3462
  --color-button-inverted: #ffffff;
3445
3463
  --color-button-hollow: #007A7C;
3464
+ --color-button-secondary: #007A7C;
3465
+ --color-button-ghost: #007A7C;
3446
3466
  /* Media-Button */
3447
3467
  --color-media-button: #007A7C;
3448
3468
  /* States */
@@ -3500,6 +3520,8 @@ video {
3500
3520
  --color-button: var(--color-primary-ds);
3501
3521
  --color-button-inverted: #ffffff;
3502
3522
  --color-button-hollow: var(--color-primary-ds);
3523
+ --color-button-secondary: var(--color-primary-ds);
3524
+ --color-button-ghost: var(--color-primary-ds);
3503
3525
  /* Media-Button */
3504
3526
  --color-media-button: var(--color-primary-ds);
3505
3527
  /* States */
@@ -3557,6 +3579,8 @@ video {
3557
3579
  --color-button: #916B00;
3558
3580
  --color-button-inverted: #ffffff;
3559
3581
  --color-button-hollow: #916B00;
3582
+ --color-button-secondary: #916B00;
3583
+ --color-button-ghost: #916B00;
3560
3584
  /* Media-Button */
3561
3585
  --color-media-button: #916B00;
3562
3586
  /* States */
@@ -3613,6 +3637,8 @@ video {
3613
3637
  --color-button: #8C033D;
3614
3638
  --color-button-inverted: #ffffff;
3615
3639
  --color-button-hollow: #8C033D;
3640
+ --color-button-secondary: #8C033D;
3641
+ --color-button-ghost: #8C033D;
3616
3642
  /* Media-Button */
3617
3643
  --color-media-button: #c95702;
3618
3644
  /* States */
@@ -3671,6 +3697,8 @@ video {
3671
3697
  --color-button: #9b0112;
3672
3698
  --color-button-inverted: #ffffff;
3673
3699
  --color-button-hollow: #9b0112;
3700
+ --color-button-secondary: #9b0112;
3701
+ --color-button-ghost: #9b0112;
3674
3702
  /* Media-Button */
3675
3703
  --color-media-button: var(--color-primary-ds);
3676
3704
  /* States */
@@ -3729,6 +3757,8 @@ video {
3729
3757
  --color-button: #29675d;
3730
3758
  --color-button-inverted: #ffffff;
3731
3759
  --color-button-hollow: #29675d;
3760
+ --color-button-secondary: #29675d;
3761
+ --color-button-ghost: #29675d;
3732
3762
  /* Media-Button */
3733
3763
  --color-media-button: #0F6157;
3734
3764
  /* States */
@@ -3787,6 +3817,8 @@ video {
3787
3817
  --color-button: var(--color-link);
3788
3818
  --color-button-inverted: #ffffff;
3789
3819
  --color-button-hollow: var(--color-link);
3820
+ --color-button-secondary: var(--color-link);
3821
+ --color-button-ghost: var(--color-link);
3790
3822
  /* Media-Button */
3791
3823
  --color-media-button: #000000;
3792
3824
  /* States */
@@ -3865,22 +3897,22 @@ video {
3865
3897
  }
3866
3898
  }
3867
3899
  }
3868
- .placeholder\:text-grey-dark::-webkit-input-placeholder {
3900
+ .placeholder\:text-gray-dark::-webkit-input-placeholder {
3869
3901
  --tw-text-opacity: 1;
3870
3902
  color: rgba(112, 112, 112, var(--tw-text-opacity));
3871
3903
  }
3872
- .placeholder\:text-grey-dark::-moz-placeholder {
3904
+ .placeholder\:text-gray-dark::-moz-placeholder {
3873
3905
  --tw-text-opacity: 1;
3874
3906
  color: rgba(112, 112, 112, var(--tw-text-opacity));
3875
3907
  }
3876
- .placeholder\:text-grey-dark::placeholder {
3908
+ .placeholder\:text-gray-dark::placeholder {
3877
3909
  --tw-text-opacity: 1;
3878
3910
  color: rgba(112, 112, 112, var(--tw-text-opacity));
3879
3911
  }
3880
- .backdrop\:bg-grey-scorpion\/90::-webkit-backdrop {
3912
+ .backdrop\:bg-gray-scorpion\/90::-webkit-backdrop {
3881
3913
  background-color: rgba(96, 96, 96, 0.9);
3882
3914
  }
3883
- .backdrop\:bg-grey-scorpion\/90::backdrop {
3915
+ .backdrop\:bg-gray-scorpion\/90::backdrop {
3884
3916
  background-color: rgba(96, 96, 96, 0.9);
3885
3917
  }
3886
3918
  .first\:border-t:first-child {
@@ -3910,9 +3942,14 @@ video {
3910
3942
  .empty\:hidden:empty {
3911
3943
  display: none;
3912
3944
  }
3913
- .hover\:border-button-hollow:hover {
3914
- border-color: #006dc1;
3915
- border-color: var(--color-button-hollow);
3945
+ .hover\:border-button-primary:hover {
3946
+ border-color: var(--color-button-primary);
3947
+ }
3948
+ .hover\:border-button-primary--dark:hover {
3949
+ border-color: var(--color-button-primary-dark);
3950
+ }
3951
+ .hover\:border-button-primary--inverted-dark:hover {
3952
+ border-color: var(--color-button-primary-inverted-dark);
3916
3953
  }
3917
3954
  .hover\:bg-black:hover {
3918
3955
  --tw-bg-opacity: 1;
@@ -3922,40 +3959,25 @@ video {
3922
3959
  --tw-bg-opacity: 1;
3923
3960
  background-color: rgba(0, 82, 147, var(--tw-bg-opacity));
3924
3961
  }
3925
- .hover\:bg-button:hover {
3926
- background-color: #005293;
3927
- background-color: var(--color-button);
3962
+ .hover\:bg-button-primary--dark:hover {
3963
+ background-color: var(--color-button-primary-dark);
3928
3964
  }
3929
- .hover\:bg-button-inverted:hover {
3930
- background-color: #ffffff;
3931
- background-color: var(--color-button-inverted);
3965
+ .hover\:bg-button-primary--inverted:hover {
3966
+ background-color: var(--color-button-primary-inverted);
3967
+ }
3968
+ .hover\:bg-button-primary--inverted-dark:hover {
3969
+ background-color: var(--color-button-primary-inverted-dark);
3932
3970
  }
3933
3971
  .hover\:bg-slate-300:hover {
3934
3972
  --tw-bg-opacity: 1;
3935
3973
  background-color: rgba(203, 213, 225, var(--tw-bg-opacity));
3936
3974
  }
3937
- .hover\:fill-button-hollow:hover {
3938
- fill: #006dc1;
3939
- fill: var(--color-button-hollow);
3940
- }
3941
- .hover\:fill-button-inverted:hover {
3942
- fill: #ffffff;
3943
- fill: var(--color-button-inverted);
3944
- }
3945
3975
  .hover\:fill-media-button:hover {
3946
3976
  fill: #276b9e;
3947
3977
  fill: var(--color-media-button);
3948
3978
  }
3949
- .hover\:fill-orange-spicyCarrot:hover {
3950
- fill: #d34600;
3951
- }
3952
- .hover\:text-button-hollow:hover {
3953
- color: #006dc1;
3954
- color: var(--color-button-hollow);
3955
- }
3956
- .hover\:text-button-inverted:hover {
3957
- color: #ffffff;
3958
- color: var(--color-button-inverted);
3979
+ .hover\:text-button-primary:hover {
3980
+ color: var(--color-button-primary);
3959
3981
  }
3960
3982
  .hover\:text-toplineColor:hover {
3961
3983
  color: #006dc1;
@@ -3985,6 +4007,20 @@ video {
3985
4007
  outline: 2px solid transparent;
3986
4008
  outline-offset: 2px;
3987
4009
  }
4010
+ .active\:scale-95:active {
4011
+ --tw-scale-x: .95;
4012
+ --tw-scale-y: .95;
4013
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4014
+ }
4015
+ .active\:bg-button-primary--dark:active {
4016
+ background-color: var(--color-button-primary-dark);
4017
+ }
4018
+ .active\:bg-button-primary--inverted:active {
4019
+ background-color: var(--color-button-primary-inverted);
4020
+ }
4021
+ .active\:bg-button-primary--inverted-dark:active {
4022
+ background-color: var(--color-button-primary-inverted-dark);
4023
+ }
3988
4024
  .active\:font-bold:active {
3989
4025
  font-weight: 700;
3990
4026
  }
@@ -3992,6 +4028,9 @@ video {
3992
4028
  --tw-text-opacity: 1;
3993
4029
  color: rgba(0, 109, 193, var(--tw-text-opacity));
3994
4030
  }
4031
+ .active\:text-button-primary:active {
4032
+ color: var(--color-button-primary);
4033
+ }
3995
4034
  .disabled\:hidden:disabled {
3996
4035
  display: none;
3997
4036
  }
@@ -4011,6 +4050,13 @@ video {
4011
4050
  --tw-text-opacity: 1;
4012
4051
  color: rgba(255, 255, 255, var(--tw-text-opacity));
4013
4052
  }
4053
+ .group:hover .group-hover\:fill-media-button {
4054
+ fill: #276b9e;
4055
+ fill: var(--color-media-button);
4056
+ }
4057
+ .group:hover .group-hover\:fill-orange-spicyCarrot {
4058
+ fill: #d34600;
4059
+ }
4014
4060
  .group:hover .group-hover\:text-white {
4015
4061
  --tw-text-opacity: 1;
4016
4062
  color: rgba(255, 255, 255, var(--tw-text-opacity));
@@ -4392,19 +4438,17 @@ video {
4392
4438
  grid-column: span 9 / span 9;
4393
4439
  }
4394
4440
 
4395
- .md\:mx-0 {
4396
- margin-left: 0px;
4397
- margin-right: 0px;
4441
+ .md\:m-3 {
4442
+ margin: 0.75rem;
4398
4443
  }
4399
4444
 
4400
- .md\:mx-3 {
4401
- margin-left: 0.75rem;
4402
- margin-right: 0.75rem;
4445
+ .md\:m-4 {
4446
+ margin: 1rem;
4403
4447
  }
4404
4448
 
4405
- .md\:mx-4 {
4406
- margin-left: 1rem;
4407
- margin-right: 1rem;
4449
+ .md\:mx-0 {
4450
+ margin-left: 0px;
4451
+ margin-right: 0px;
4408
4452
  }
4409
4453
 
4410
4454
  .md\:mx-5 {
@@ -4412,16 +4456,6 @@ video {
4412
4456
  margin-right: 1.25rem;
4413
4457
  }
4414
4458
 
4415
- .md\:my-3 {
4416
- margin-top: 0.75rem;
4417
- margin-bottom: 0.75rem;
4418
- }
4419
-
4420
- .md\:my-4 {
4421
- margin-top: 1rem;
4422
- margin-bottom: 1rem;
4423
- }
4424
-
4425
4459
  .md\:-mt-40 {
4426
4460
  margin-top: -10rem;
4427
4461
  }
@@ -4438,6 +4472,13 @@ video {
4438
4472
  margin-top: 0px;
4439
4473
  }
4440
4474
 
4475
+ .md\:line-clamp-4 {
4476
+ overflow: hidden;
4477
+ display: -webkit-box;
4478
+ -webkit-box-orient: vertical;
4479
+ -webkit-line-clamp: 4;
4480
+ }
4481
+
4441
4482
  .md\:inline-block {
4442
4483
  display: inline-block;
4443
4484
  }
@@ -4596,8 +4637,10 @@ video {
4596
4637
  }
4597
4638
 
4598
4639
  .md\:from-white {
4599
- --tw-gradient-from: #ffffff;
4600
- --tw-gradient-to: rgba(255, 255, 255, 0);
4640
+ --tw-gradient-from: #ffffff var(--tw-gradient-from-position);
4641
+ --tw-gradient-from-position: ;
4642
+ --tw-gradient-to: rgba(255, 255, 255, 0) var(--tw-gradient-from-position);
4643
+ --tw-gradient-to-position: ;
4601
4644
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
4602
4645
  }
4603
4646
 
@@ -4698,13 +4741,6 @@ video {
4698
4741
  .md\:filter {
4699
4742
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
4700
4743
  }
4701
-
4702
- .md\:line-clamp-4 {
4703
- overflow: hidden;
4704
- display: -webkit-box;
4705
- -webkit-box-orient: vertical;
4706
- -webkit-line-clamp: 4;
4707
- }
4708
4744
  .md\:ar-16-9 {
4709
4745
  aspect-ratio: 16 / 9;
4710
4746
  }
@@ -4865,6 +4901,20 @@ video {
4865
4901
  margin-top: 2.5rem;
4866
4902
  }
4867
4903
 
4904
+ .lg\:line-clamp-2 {
4905
+ overflow: hidden;
4906
+ display: -webkit-box;
4907
+ -webkit-box-orient: vertical;
4908
+ -webkit-line-clamp: 2;
4909
+ }
4910
+
4911
+ .lg\:line-clamp-5 {
4912
+ overflow: hidden;
4913
+ display: -webkit-box;
4914
+ -webkit-box-orient: vertical;
4915
+ -webkit-line-clamp: 5;
4916
+ }
4917
+
4868
4918
  .lg\:flex {
4869
4919
  display: flex;
4870
4920
  }
@@ -5169,20 +5219,6 @@ video {
5169
5219
  transition-duration: 500ms;
5170
5220
  }
5171
5221
 
5172
- .lg\:line-clamp-2 {
5173
- overflow: hidden;
5174
- display: -webkit-box;
5175
- -webkit-box-orient: vertical;
5176
- -webkit-line-clamp: 2;
5177
- }
5178
-
5179
- .lg\:line-clamp-5 {
5180
- overflow: hidden;
5181
- display: -webkit-box;
5182
- -webkit-box-orient: vertical;
5183
- -webkit-line-clamp: 5;
5184
- }
5185
-
5186
5222
  .lg\:col-main {
5187
5223
  grid-column: main;
5188
5224
  }