hr-design-system-handlebars 0.123.7 → 0.124.0

package/dist/assets/index.css

@@ -423,7 +423,7 @@ video {
   --tw-scale-y: 1;
 }
 
-.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-inner, .shadow-xl, .shadow, .before\:shadow-stage::before {
+.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-md, .shadow-inner, .shadow-xl, .shadow, .before\:shadow-stage::before {
   --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);
   --tw-ring-shadow: 0 0 rgba(0,0,0,0);
   --tw-shadow: 0 0 rgba(0,0,0,0);
@@ -1163,6 +1163,21 @@ video {
 .mt-4 {
   margin-top: 1rem;
 }
+.mb-5 {
+  margin-bottom: 1.25rem;
+}
+.mt-0\.5 {
+  margin-top: 0.125rem;
+}
+.mr-2 {
+  margin-right: 0.5rem;
+}
+.mt-2 {
+  margin-top: 0.5rem;
+}
+.mr-4 {
+  margin-right: 1rem;
+}
 .-mb-2 {
   margin-bottom: -0.5rem;
 }
@@ -1181,9 +1196,6 @@ video {
 .-mt-2 {
   margin-top: -0.5rem;
 }
-.mt-2 {
-  margin-top: 0.5rem;
-}
 .-mt-40 {
   margin-top: -10rem;
 }
@@ -1196,14 +1208,14 @@ video {
 .mb-7 {
   margin-bottom: 1.75rem;
 }
-.mr-4 {
-  margin-right: 1rem;
-}
 .ml-4 {
   margin-left: 1rem;
 }
-.mt-0\.5 {
-  margin-top: 0.125rem;
+.ml-14 {
+  margin-left: 3.5rem;
+}
+.mr-14 {
+  margin-right: 3.5rem;
 }
 .mt-10 {
   margin-top: 2.5rem;
@@ -1226,9 +1238,6 @@ video {
 .ml-1 {
   margin-left: 0.25rem;
 }
-.mr-2 {
-  margin-right: 0.5rem;
-}
 .-mt-3 {
   margin-top: -0.75rem;
 }
@@ -1244,6 +1253,9 @@ video {
 .mt-14 {
   margin-top: 3.5rem;
 }
+.box-border {
+  box-sizing: border-box;
+}
 .block {
   display: block;
 }
@@ -1379,6 +1391,15 @@ video {
 .w-15\/12 {
   width: 120%;
 }
+.w-2\/12 {
+  width: 16.666667%;
+}
+.w-10\/12 {
+  width: 83.333333%;
+}
+.w-24 {
+  width: 6rem;
+}
 .w-12 {
   width: 3rem;
 }
@@ -1404,9 +1425,6 @@ video {
   width: -moz-fit-content;
   width: fit-content;
 }
-.w-24 {
-  width: 6rem;
-}
 .min-w-0 {
   min-width: 0px;
 }
@@ -1439,9 +1457,18 @@ video {
 .shrink-0 {
   flex-shrink: 0;
 }
+.shrink {
+  flex-shrink: 1;
+}
 .grow {
   flex-grow: 1;
 }
+.grow-0 {
+  flex-grow: 0;
+}
+.basis-6\/12 {
+  flex-basis: 50%;
+}
 .basis-full {
   flex-basis: 100%;
 }
@@ -1451,6 +1478,12 @@ video {
 .basis-3\/5 {
   flex-basis: 60%;
 }
+.basis-2\/12 {
+  flex-basis: 16.666667%;
+}
+.basis-10\/12 {
+  flex-basis: 83.333333%;
+}
 .-translate-x-1\/2 {
   --tw-translate-x: -50%;
   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));
@@ -1520,6 +1553,9 @@ video {
 .flex-nowrap {
   flex-wrap: nowrap;
 }
+.content-center {
+  align-content: center;
+}
 .content-start {
   align-content: flex-start;
 }
@@ -1532,6 +1568,9 @@ video {
 .items-center {
   align-items: center;
 }
+.items-stretch {
+  align-items: stretch;
+}
 .justify-start {
   justify-content: flex-start;
 }
@@ -1617,9 +1656,18 @@ video {
 .overflow-visible {
   overflow: visible;
 }
+.overflow-x-auto {
+  overflow-x: auto;
+}
+.overflow-y-hidden {
+  overflow-y: hidden;
+}
 .overflow-x-scroll {
   overflow-x: scroll;
 }
+.scroll-smooth {
+  scroll-behavior: smooth;
+}
 .truncate {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -1699,12 +1747,12 @@ video {
 .border-r {
   border-right-width: 1px;
 }
-.border-b-0 {
-  border-bottom-width: 0px;
-}
 .border-t {
   border-top-width: 1px;
 }
+.border-b-0 {
+  border-bottom-width: 0px;
+}
 .border-l-2 {
   border-left-width: 2px;
 }
@@ -1714,6 +1762,12 @@ video {
 .border-dashed {
   border-style: dashed;
 }
+.border-dotted {
+  border-style: dotted;
+}
+.border-none {
+  border-style: none;
+}
 .border-button-hollow {
   border-color: #006dc1;
   border-color: var(--color-button-hollow);
@@ -1722,6 +1776,10 @@ video {
   border-color: #ffffff;
   border-color: var(--color-button-inverted);
 }
+.border-button {
+  border-color: #005293;
+  border-color: var(--color-button);
+}
 .border-blue-congress {
   --tw-border-opacity: 1;
   border-color: rgba(0, 82, 147, var(--tw-border-opacity));
@@ -1742,6 +1800,14 @@ video {
   border-color: #005293;
   border-color: var(--color-primary);
 }
+.border-event-calendar-secondary {
+  border-color: #797979;
+  border-color: var(--color-eventcalendar-secondary);
+}
+.border-teal-600 {
+  --tw-border-opacity: 1;
+  border-color: rgba(13, 148, 136, var(--tw-border-opacity));
+}
 .border-gray-200 {
   --tw-border-opacity: 1;
   border-color: rgba(229, 231, 235, var(--tw-border-opacity));
@@ -1750,10 +1816,6 @@ video {
   border-color: #005293;
   border-color: var(--color-cluster-teaser-headline,#000);
 }
-.border-button {
-  border-color: #005293;
-  border-color: var(--color-button);
-}
 .bg-red-200 {
   --tw-bg-opacity: 1;
   background-color: rgba(254, 202, 202, var(--tw-bg-opacity));
@@ -1770,6 +1832,10 @@ video {
   background-color: #005293;
   background-color: var(--color-button);
 }
+.bg-button-inverted {
+  background-color: #ffffff;
+  background-color: var(--color-button-inverted);
+}
 .bg-transparent {
   background-color: transparent;
 }
@@ -1860,6 +1926,10 @@ video {
   background-color: #d34600;
   background-color: var(--color-highlight-2);
 }
+.bg-event-calendar-primary {
+  background-color: #005293;
+  background-color: var(--color-eventcalendar-primary);
+}
 .bg-neutral-200 {
   --tw-bg-opacity: 1;
   background-color: rgba(229, 229, 229, var(--tw-bg-opacity));
@@ -1876,10 +1946,6 @@ video {
   background-color: #006eb7;
   background-color: var(--color-stage-text-box);
 }
-.bg-button-inverted {
-  background-color: #ffffff;
-  background-color: var(--color-button-inverted);
-}
 .bg-gradient-to-r {
   background-image: linear-gradient(to right, var(--tw-gradient-stops));
 }
@@ -1904,6 +1970,18 @@ video {
 .to-purple-100 {
   --tw-gradient-to: #f3e8ff;
 }
+.fill-button {
+  fill: #005293;
+  fill: var(--color-button);
+}
+.fill-button-hollow {
+  fill: #006dc1;
+  fill: var(--color-button-hollow);
+}
+.fill-button-inverted {
+  fill: #ffffff;
+  fill: var(--color-button-inverted);
+}
 .fill-content-nav {
   fill: #005293;
   fill: var(--color-content-nav);
@@ -1911,9 +1989,16 @@ video {
 .fill-current {
   fill: currentColor;
 }
+.fill-event-calendar-secondary {
+  fill: #797979;
+  fill: var(--color-eventcalendar-secondary);
+}
 .fill-white {
   fill: #ffffff;
 }
+.fill-inherit {
+  fill: inherit;
+}
 .fill-blue-congress {
   fill: #005293;
 }
@@ -1935,6 +2020,9 @@ video {
 .p-2 {
   padding: 0.5rem;
 }
+.p-0 {
+  padding: 0px;
+}
 .p-8 {
   padding: 2rem;
 }
@@ -1981,6 +2069,10 @@ video {
   padding-left: 0px !important;
   padding-right: 0px !important;
 }
+.py-1 {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
 .px-1\.5 {
   padding-left: 0.375rem;
   padding-right: 0.375rem;
@@ -2005,14 +2097,14 @@ video {
   padding-top: 1rem;
   padding-bottom: 1rem;
 }
+.py-7 {
+  padding-top: 1.75rem;
+  padding-bottom: 1.75rem;
+}
 .py-1\.5 {
   padding-top: 0.375rem;
   padding-bottom: 0.375rem;
 }
-.py-1 {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
-}
 .px-0 {
   padding-left: 0px;
   padding-right: 0px;
@@ -2051,15 +2143,24 @@ video {
 .pb-0 {
   padding-bottom: 0px;
 }
-.pt-px {
-  padding-top: 1px;
-}
 .pl-4 {
   padding-left: 1rem;
 }
+.pb-3 {
+  padding-bottom: 0.75rem;
+}
+.pt-px {
+  padding-top: 1px;
+}
 .pr-2 {
   padding-right: 0.5rem;
 }
+.pb-2\.5 {
+  padding-bottom: 0.625rem;
+}
+.pb-2 {
+  padding-bottom: 0.5rem;
+}
 .pb-1 {
   padding-bottom: 0.25rem;
 }
@@ -2075,9 +2176,6 @@ video {
 .pt-4 {
   padding-top: 1rem;
 }
-.pb-2 {
-  padding-bottom: 0.5rem;
-}
 .pl-3 {
   padding-left: 0.75rem;
 }
@@ -2099,9 +2197,6 @@ video {
 .pb-5 {
   padding-bottom: 1.25rem;
 }
-.pb-3 {
-  padding-bottom: 0.75rem;
-}
 .pr-10 {
   padding-right: 2.5rem;
 }
@@ -2153,10 +2248,16 @@ video {
 .font-heading {
   font-family: RobotoCond, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif;
 }
+.font-sans {
+  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";
+}
 .font-title {
   font-family: RobotoCond, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif;
   font-family: var(--font-title);
 }
+.font-serif {
+  font-family: RobotoSlab, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
+}
 .font-titleCluster {
   font-family: RobotoSlab, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
   font-family: var(--font-titleCluster);
@@ -2274,6 +2375,10 @@ video {
   color: #006dc1;
   color: var(--color-button-hollow);
 }
+.text-button {
+  color: #005293;
+  color: var(--color-button);
+}
 .text-blue-700 {
   --tw-text-opacity: 1;
   color: rgba(29, 78, 216, var(--tw-text-opacity));
@@ -2286,6 +2391,14 @@ video {
   color: #005293;
   color: var(--color-content-nav);
 }
+.text-event-status {
+  color: #cc1a14;
+  color: var(--color-event-status);
+}
+.text-subline {
+  color: #006dc1;
+  color: var(--color-subline);
+}
 .text-stageText {
   color: #ffffff;
   color: var(--color-stage-text);
@@ -2318,6 +2431,10 @@ video {
   --tw-text-opacity: 1 !important;
   color: rgba(255, 255, 255, var(--tw-text-opacity)) !important;
 }
+.text-link {
+  color: #006eb7;
+  color: var(--color-link);
+}
 .text-clusterTeaserHeadline {
   color: #005293;
   color: var(--color-cluster-teaser-headline,#000);
@@ -2330,14 +2447,6 @@ video {
   color: #006dc1;
   color: var(--color-topline);
 }
-.text-subline {
-  color: #006dc1;
-  color: var(--color-subline);
-}
-.text-link {
-  color: #006eb7;
-  color: var(--color-link);
-}
 .text-blue-science {
   --tw-text-opacity: 1;
   color: rgba(0, 109, 193, var(--tw-text-opacity));
@@ -2412,6 +2521,13 @@ video {
 .opacity-85 {
   opacity: .85;
 }
+.shadow-md {
+  --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
+  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
+  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
+  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
+  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);
+}
 .shadow-inner {
   --tw-shadow: inset 0 0px 5px 0 rgba(0, 0, 0, 0.25);
   --tw-shadow-colored: inset 0 0px 5px 0 var(--tw-shadow-color);
@@ -2518,7 +2634,7 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 .counter-reset {
-  counter-reset: cnt1675874379969;
+  counter-reset: cnt1675934301770;
 }
 .line-clamp-4 {
   overflow: hidden;
@@ -2561,6 +2677,22 @@ video {
             clear: both;
         }
     }
+.ar-4-3 {
+        aspect-ratio: 4 / 3;
+    }
+@supports not (aspect-ratio: 4 / 3) {
+        .ar-4-3::before {
+            float: left;
+            padding-top: calc(4 / 3 * 100%);
+            content: '';
+        }
+
+        .ar-4-3::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
 .ar-1-1 {
         aspect-ratio: 1 / 1;
     }
@@ -2736,7 +2868,7 @@ video {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1675874379969 1;
+  counter-increment: cnt1675934301770 1;
 }
 .-ordered::before {
   position: absolute;
@@ -2752,7 +2884,7 @@ video {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1675874379969);
+  content: counter(cnt1675934301770);
 }
 /*! ****************************/
 /*! text-shadow                */
@@ -2803,6 +2935,12 @@ video {
     --color-label-kurzmeldung: #0a3355;
     /* Dachzeile */
     --color-topline: #006dc1;
+    /* Event */
+    --color-event-status: #cc1a14;
+    /* Eventkalender */
+    --color-label-event-calendar-title: #097d8e;
+    --color-eventcalendar-primary: var(--color-primary);
+    --color-eventcalendar-secondary: #797979;
     /* Subline */
     --color-subline: var(--color-topline);
     /* Link */
@@ -2834,7 +2972,7 @@ video {
     --font-titleCluster: RobotoSlab, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
     --font-weight-titleCluster: 700;
     /* Border Radius */
-    --border-radius-hr: 0px; ;
+    --border-radius-hr: 0px;
 }
 [data-theme='hessenschau'] {
     --color-primary: #005293;
@@ -2862,6 +3000,8 @@ video {
     --color-label-pm: #006eb7;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: #006dc1;
     /* Subline */
@@ -2895,8 +3035,8 @@ video {
     --font-weight-title: 400;
     --font-titleCluster: RobotoSlab, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
     --font-weight-titleCluster: 700;
-     /* Border */
-    --border-radius-hr: 1.5rem; 
+    /* Border */
+    --border-radius-hr: 1.5rem;
 }
 [data-theme='hr-fernsehen'] {
     --color-primary: #a00d65;
@@ -2920,6 +3060,8 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: #a00d65;
     /* Subline */
@@ -2972,6 +3114,8 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: #276b9e;
     /* Subline */
@@ -3025,6 +3169,8 @@ video {
     --color-label-pm: #006eb7;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: #006eb7;
     /* Dachzeile */
     --color-topline: #006eb7;
     /* Subline */
@@ -3078,6 +3224,8 @@ video {
     --color-label-pm: #006eb7;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: #006eb7;
     /* Dachzeile */
     --color-topline: #006eb7;
     /* Subline */
@@ -3129,6 +3277,8 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: rgba(171,47,45,1);
     /* Subline */
@@ -3180,6 +3330,8 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: rgba(0,122,124,1);
     /* Subline */
@@ -3233,6 +3385,8 @@ video {
     --color-label-pm: var(--color-primary);
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: var(--color-primary);
     /* Subline */
@@ -3284,12 +3438,16 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Event */
+    --color-event-status: #88114b;
+    /* Eventkalender */
+    --color-eventcalendar-primary: #007fa0;
     /* Dachzeile */
-    --color-topline: rgba(145,107,0,1);
+    --color-topline: #916B00;
     /* Subline */
-    --color-subline: var(--color-topline);
+    --color-subline: #916B00;
     /* Link */
-    --color-link: rgba(145,107,0,1);
+    --color-link: #916B00;
     /* Stage */
     --color-stage-text-box: #433d37;
     --color-stage-primary: #e0ae00;
@@ -3298,15 +3456,15 @@ video {
     --color-cluster-teaser-link: #000000;
     --color-cluster-teaser-headline: #000000;
     /* Button */
-    --color-button: rgba(145,107,0,1);
+    --color-button: #916B00;
     --color-button-inverted: #ffffff;
-    --color-button-hollow: rgba(145,107,0,1);
+    --color-button-hollow: #916B00;
     /* States */
-    --color-focus-state: rgba(145,107,0,1);
+    --color-focus-state: #916B00;
     /* Content-Nav */
-    --color-content-nav: rgba(145,107,0,1);
+    --color-content-nav: #916B00;
     /* Podcast-Player */
-    --color-podcast: rgba(145,107,0,1);
+    --color-podcast: #916B00;
     --color-podcast-text: var(--color-link);
     --color-podcast-highlight: #00727A;
     /* Font */
@@ -3335,6 +3493,8 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: rgba(140,3,61,1);
     /* Dachzeile */
     --color-topline: rgba(140,3,61,1);
     /* Subline */
@@ -3387,6 +3547,10 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Event */
+    --color-event-status: #007179;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: var(--color-primary);
     /* Subline */
@@ -3439,6 +3603,10 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Event */
+    --color-event-status: #e81f18;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-primary);
     /* Dachzeile */
     --color-topline: rgba(15,97,87,1);
     /* Subline */
@@ -3469,7 +3637,7 @@ video {
     --font-title: RobotoCond, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif;
     --font-weight-title: 700;
     /* Border */
-    --border-radius-hr: 1.5rem; 
+    --border-radius-hr: 1.5rem;
 }
 [data-theme='you-fm'] {
     --color-primary: #c20016;
@@ -3493,6 +3661,8 @@ video {
     --color-label-event: #000000;
     /* Kurzmeldung */
     --color-label-kurzmeldung: #0a3355;
+    /* Eventkalender */
+    --color-eventcalendar-primary: var(--color-link);
     /* Dachzeile */
     --color-topline: var(--color-link);
     /* Subline */
@@ -3565,6 +3735,12 @@ video {
   --tw-text-opacity: 1;
   color: rgba(112, 112, 112, var(--tw-text-opacity));
 }
+.backdrop\:bg-grey-scorpion\/90::-webkit-backdrop {
+  background-color: rgba(96, 96, 96, 0.9);
+}
+.backdrop\:bg-grey-scorpion\/90::backdrop {
+  background-color: rgba(96, 96, 96, 0.9);
+}
 .first\:border-t:first-child {
   border-top-width: 1px;
 }
@@ -3600,14 +3776,30 @@ video {
   background-color: #ffffff;
   background-color: var(--color-button-inverted);
 }
+.hover\:bg-button:hover {
+  background-color: #005293;
+  background-color: var(--color-button);
+}
 .hover\:bg-slate-300:hover {
   --tw-bg-opacity: 1;
   background-color: rgba(203, 213, 225, var(--tw-bg-opacity));
 }
+.hover\:bg-black:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));
+}
 .hover\:bg-blue-congress:hover {
   --tw-bg-opacity: 1;
   background-color: rgba(0, 82, 147, var(--tw-bg-opacity));
 }
+.hover\:fill-button-inverted:hover {
+  fill: #ffffff;
+  fill: var(--color-button-inverted);
+}
+.hover\:fill-button-hollow:hover {
+  fill: #006dc1;
+  fill: var(--color-button-hollow);
+}
 .hover\:fill-orange-spicyCarrot:hover {
   fill: #d34600;
 }
@@ -3622,6 +3814,10 @@ video {
   color: #006dc1;
   color: var(--color-button-hollow);
 }
+.hover\:text-button-inverted:hover {
+  color: #ffffff;
+  color: var(--color-button-inverted);
+}
 .hover\:text-white:hover {
   --tw-text-opacity: 1;
   color: rgba(255, 255, 255, var(--tw-text-opacity));
@@ -3634,10 +3830,22 @@ video {
   -webkit-text-decoration-line: underline;
           text-decoration-line: underline;
 }
+.focus\:bg-black:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));
+}
+.focus\:text-white:focus {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
 .focus\:outline-none:focus {
   outline: 2px solid transparent;
   outline-offset: 2px;
 }
+.focus-visible\:outline-none:focus-visible {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
 .active\:font-bold:active {
   font-weight: 700;
 }
@@ -3652,10 +3860,30 @@ video {
   --tw-text-opacity: 1;
   color: rgba(107, 114, 128, var(--tw-text-opacity));
 }
+.group[focus-within] .group-focus-within\:text-white {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+.group[focus-within] .group-focus-within\:text-white {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+.group:focus-within .group-focus-within\:text-white {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+.group:hover .group-hover\:text-white {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
 .group:hover .group-hover\:underline {
   -webkit-text-decoration-line: underline;
           text-decoration-line: underline;
 }
+.group:focus .group-focus\:text-white {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
 .before\:absolute::before {
   position: absolute;
 }
@@ -3763,6 +3991,30 @@ video {
 }
 @media (min-width: 640px) {
 
+  .sm\:static {
+    position: static;
+  }
+
+  .sm\:absolute {
+    position: absolute;
+  }
+
+  .sm\:right-4 {
+    right: 1rem;
+  }
+
+  .sm\:bottom-4 {
+    bottom: 1rem;
+  }
+
+  .sm\:order-1 {
+    order: 1;
+  }
+
+  .sm\:order-2 {
+    order: 2;
+  }
+
   .sm\:mx-0 {
     margin-left: 0px;
     margin-right: 0px;
@@ -3785,12 +4037,40 @@ video {
     display: block;
   }
 
+  .sm\:w-7\/12 {
+    width: 58.333333%;
+  }
+
+  .sm\:w-5\/12 {
+    width: 41.666667%;
+  }
+
   .sm\:w-fit {
     width: -webkit-fit-content;
     width: -moz-fit-content;
     width: fit-content;
   }
 
+  .sm\:max-w-xl {
+    max-width: 36rem;
+  }
+
+  .sm\:basis-7\/12 {
+    flex-basis: 58.333333%;
+  }
+
+  .sm\:basis-5\/12 {
+    flex-basis: 41.666667%;
+  }
+
+  .sm\:flex-row {
+    flex-direction: row;
+  }
+
+  .sm\:bg-transparent {
+    background-color: transparent;
+  }
+
   .sm\:p-5 {
     padding: 1.25rem;
   }
@@ -3815,10 +4095,83 @@ video {
     padding-right: 2.75rem;
   }
 
+  .sm\:pl-0 {
+    padding-left: 0px;
+  }
+
+  .sm\:pt-0 {
+    padding-top: 0px;
+  }
+
+  .sm\:pb-0 {
+    padding-bottom: 0px;
+  }
+
+  .sm\:pt-3 {
+    padding-top: 0.75rem;
+  }
+
+  .sm\:pb-2 {
+    padding-bottom: 0.5rem;
+  }
+
+  .sm\:text-xl {
+    font-size: 1.25rem;
+    line-height: 1.675rem;
+  }
+
   .sm\:text-lg {
     font-size: 1.125rem;
     line-height: 1.5rem;
   }
+    .sm\:ar-16-9 {
+        aspect-ratio: 16 / 9;
+    }
+
+    @supports not (aspect-ratio: 16 / 9) {
+        .sm\:ar-16-9::before {
+            float: left;
+            padding-top: 56.25%;
+            content: '';
+        }
+
+         {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+
+    .sm\:ar-auto {
+        aspect-ratio: auto;
+    }
+
+    @supports not (aspect-ratio: auto) {
+        .sm\:ar-auto::before {
+            float: none;
+            float: initial;
+            padding-top: 0;
+            content: '';
+        }
+
+        .sm\:ar-auto::after {
+            display: inline;
+            content: '';
+            clear: none;
+        }
+        .sm\:ar-auto::before {
+            float: none;
+            float: initial;
+            padding-top: 0;
+            content: '';
+        }
+
+        .sm\:ar-auto::after {
+            display: inline;
+            content: '';
+            clear: none;
+        }
+    }
 
     .sm\:col-main {
         grid-column: main;