.lottie-animation-container{width:var(--lottie-animation-container-width);height:var(--lottie-animation-container-height);background-color:var(--lottie-animation-container-background-color);overflow:hidden;margin:0 auto}

@charset "UTF-8";
/* RIVER Design-System: Preload - CSS Variables */
:root {
  /* colors */
  --colors-base: white;
  --colors-reverse: #000000;
  --colors-gray-900: #000000;
  --colors-gray-800: #212121;
  --colors-gray-700: #303030;
  --colors-gray-600: #7A7A7A;
  --colors-gray-500: #9A9A9A;
  --colors-gray-400: #C1C1C1;
  --colors-gray-300: #EAEAEA;
  --colors-gray-200: #F1F1F1;
  --colors-gray-100: #F7F7F7;
  --colors-gray-dark: var(--colors-gray-900);
  --colors-gray-title: var(--colors-gray-900);
  --colors-gray-bg-menu: var(--colors-gray-900);
  --colors-gray-shadow: var(--colors-gray-800);
  --colors-gray-dark-bg-elements: var(--colors-gray-800);
  --colors-gray-normal: var(--colors-gray-700);
  --colors-gray-body: var(--colors-gray-700);
  --colors-gray-border: var(--colors-gray-700);
  --colors-gray-light: var(--colors-gray-600);
  --colors-gray-border-light: var(--colors-gray-400);
  --colors-gray-bg-elements: var(--colors-gray-300);
  --colors-gray-light-bg-elements: var(--colors-gray-200);
  --colors-gray-bg: var(--colors-gray-100);
  --colors-primary-900: #000000;
  --colors-primary-800: #212121;
  --colors-primary-700: #303030;
  --colors-primary-600: #7A7A7A;
  --colors-primary-500: #9A9A9A;
  --colors-primary-400: #C1C1C1;
  --colors-primary-300: #EAEAEA;
  --colors-primary-200: #F1F1F1;
  --colors-primary-100: #F7F7F7;
  --colors-primary-dark: var(--colors-primary-900);
  --colors-primary-title: var(--colors-primary-900);
  --colors-primary-bg-menu: var(--colors-primary-900);
  --colors-primary-shadow: var(--colors-primary-800);
  --colors-primary-dark-bg-elements: var(--colors-primary-800);
  --colors-primary-normal: var(--colors-primary-700);
  --colors-primary-body: var(--colors-primary-700);
  --colors-primary-border: var(--colors-primary-700);
  --colors-primary-light: var(--colors-primary-600);
  --colors-primary-border-light: var(--colors-primary-400);
  --colors-primary-bg-elements: var(--colors-primary-300);
  --colors-primary-light-bg-elements: var(--colors-primary-200);
  --colors-primary-bg: var(--colors-primary-100);
  --colors-secondary-400: #E5D3B2;
  --colors-secondary-300: #EDE1CA;
  --colors-secondary-200: #F5EEE1;
  --colors-secondary-100: #FEFBF3;
  --colors-secondary-dark: var(--colors-secondary-400);
  --colors-secondary-normal: var(--colors-secondary-200);
  --colors-secondary-title: var(--colors-secondary-200);
  --colors-secondary-light: var(--colors-secondary-100);
  --colors-secondary-bg: var(--colors-secondary-100);
  /* type */
  --type-font-primary: 'Satoshi', Arial, Helvetica, sans-serif;
  --type-font-normal: var(--type-font-primary);
  --type-font-title: var(--type-font-primary);
  --type-size-0: 0rem;
  --type-size-1: 1rem;
  --type-size-2: 1.08rem;
  --type-size-3: 1.1664rem;
  --type-size-4: 1.259712rem;
  --type-size-5: 1.36048896rem;
  --type-size-6: 1.4693280768rem;
  --type-size-7: 1.5868743229rem;
  --type-size-8: 1.7138242688rem;
  --type-size-9: 1.8509302103rem;
  --type-size-10: 1.9990046271rem;
  --type-size-11: 2.1589249973rem;
  --type-size-12: 2.3316389971rem;
  --type-size-13: 2.5181701168rem;
  --type-size-14: 2.7196237262rem;
  --type-size-15: 2.9371936243rem;
  --type-size-16: 3.1721691142rem;
  --type-size-17: 3.4259426433rem;
  --type-size-18: 3.7000180548rem;
  --type-size-19: 3.9960194992rem;
  --type-size-20: 4.3157010591rem;
  --type-size-21: 4.6609571438rem;
  --type-size-22: 5.0338337154rem;
  --type-size-23: 5.4365404126rem;
  --type-size-24: 5.8714636456rem;
  --type-size-25: 6.3411807372rem;
  --type-size-x-small: var(--type-size-5);
  --type-size-small: var(--type-size-7);
  --type-size-normal: var(--type-size-8);
  --type-size-large: var(--type-size-11);
  --type-size-x-large: var(--type-size-13);
  --type-size-title-1: var(--type-size-22);
  --type-size-title-2: var(--type-size-19);
  --type-size-title-3: var(--type-size-14);
  --type-size-title-4: var(--type-size-10);
  --type-size-title-5: var(--type-size-9);
  --type-size-display: var(--type-size-24);
  --type-weight-normal: 500;
  --type-weight-bold: 700;
  --type-weight-title: 900;
  --type-spacing-normal: 1em;
  --type-spacing-small: 0.5em;
  --type-spacing-title: 0.5em;
  --type-spacing-none: 0em;
  --type-line-height-normal: 1.1;
  --type-line-height-title: 1.3;
  --type-letter-spacing-normal: 0;
  --type-letter-spacing-title: 0;
  /* sizes */
  --sizes-size-0: 0rem;
  --sizes-size-1: 0.5rem;
  --sizes-size-2: 1rem;
  --sizes-size-3: 1.5rem;
  --sizes-size-4: 2rem;
  --sizes-size-5: 2.5rem;
  --sizes-size-6: 3rem;
  --sizes-size-7: 3.5rem;
  --sizes-size-8: 4rem;
  --sizes-size-9: 4.5rem;
  --sizes-size-10: 5rem;
  --sizes-size-11: 5.5rem;
  --sizes-size-12: 6rem;
  --sizes-size-13: 6.5rem;
  --sizes-size-14: 7rem;
  --sizes-size-15: 7.5rem;
  --sizes-size-16: 8rem;
  --sizes-size-17: 8.5rem;
  --sizes-size-18: 9rem;
  --sizes-size-19: 9.5rem;
  --sizes-size-20: 10rem;
  --sizes-size-21: 10.5rem;
  --sizes-size-22: 11rem;
  --sizes-size-23: 11.5rem;
  --sizes-size-24: 12rem;
  --sizes-size-25: 12.5rem;
  --sizes-size-26: 13rem;
  --sizes-size-27: 13.5rem;
  --sizes-size-28: 14rem;
  --sizes-size-29: 14.5rem;
  --sizes-size-30: 15rem;
  --sizes-size-31: 15.5rem;
  --sizes-size-32: 16rem;
  --sizes-size-33: 16.5rem;
  --sizes-size-34: 17rem;
  --sizes-size-35: 17.5rem;
  --sizes-size-36: 18rem;
  --sizes-size-37: 18.5rem;
  --sizes-size-38: 19rem;
  --sizes-size-39: 19.5rem;
  --sizes-size-40: 20rem;
  --sizes-size-41: 20.5rem;
  --sizes-size-42: 21rem;
  --sizes-size-43: 21.5rem;
  --sizes-size-44: 22rem;
  --sizes-size-45: 22.5rem;
  --sizes-size-46: 23rem;
  --sizes-size-47: 23.5rem;
  --sizes-size-48: 24rem;
  --sizes-size-49: 24.5rem;
  --sizes-size-50: 25rem;
  --sizes-size-subtle: 0.2rem;
  --sizes-size-smallest: 0.5rem;
  --sizes-size-x-small: var(--sizes-size-2);
  --sizes-size-small: var(--sizes-size-4);
  --sizes-size-normal: var(--sizes-size-6);
  --sizes-size-large: var(--sizes-size-8);
  --sizes-size-x-large: var(--sizes-size-12);
  --sizes-size-layout-small: var(--sizes-size-16);
  --sizes-size-layout-normal: var(--sizes-size-24);
  --sizes-size-layout-x-large: var(--sizes-size-32);
  --sizes-padding-small: 0.5rem 1rem;
  --sizes-padding-normal: 1rem 2rem;
  --sizes-padding-large: 1.5rem 4rem;
  --sizes-gutter-small: var(--sizes-size-small);
  --sizes-gutter-normal: var(--sizes-size-normal);
  --sizes-gutter-large: var(--sizes-size-large);
  --sizes-multiplier-small: 0.8;
  --sizes-multiplier-small-subtle: 0.95;
  --sizes-multiplier-normal: 1;
  --sizes-multiplier-large-subtle: 1.05;
  --sizes-multiplier-large: 1.2;
  --sizes-ratio-vertical-small: 33%;
  --sizes-ratio-vertical-normal: 66%;
  --sizes-ratio-horizontal-small: 20%;
  --sizes-ratio-horizontal-normal: 40%;
  --sizes-ratio-square: 100%;
}

/* RIVER Design-System: Preload - Reset */
/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

ul {
  list-style: none;
}

button,
input,
select,
textarea {
  margin: 0;
}

html {
  box-sizing: border-box;
}

*, *::before, *::after {
  box-sizing: inherit;
}

iframe {
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}
td:not([align]),
th:not([align]) {
  text-align: inherit;
}

/* RIVER Design-System: Preload - Base */
html, body {
  min-height: 100vh;
}

html {
  font-size: 62.5%;
}

body {
  font-family: var(--type-font-normal);
  font-size: var(--type-size-normal);
  font-weight: var(--type-weight-normal);
  color: var(--colors-gray-normal);
  background-color: var(--colors-base);
  line-height: var(--type-line-height-normal);
  letter-spacing: var(--type-letter-spacing-normal);
  overflow: auto;
}

/* RIVER Design-System: Helpers - Styles / Titles */
.style-title {
  font-family: var(--type-font-title);
  font-weight: var(--type-weight-title);
  color: var(--colors-gray-title);
}

.style-title--1, .scope-styles :where(h1) {
  font-size: var(--type-size-title-1);
  line-height: var(--type-line-height-title);
  letter-spacing: var(--type-letter-spacing-title);
  margin-bottom: var(--type-spacing-title);
}

.style-title--2, .scope-styles :where(h2) {
  font-size: var(--type-size-title-2);
  line-height: var(--type-line-height-title);
  letter-spacing: var(--type-letter-spacing-title);
  margin-bottom: var(--type-spacing-title);
}

.style-title--3, .scope-styles :where(h3) {
  font-size: var(--type-size-title-3);
  line-height: var(--type-line-height-title);
  letter-spacing: var(--type-letter-spacing-title);
  margin-bottom: var(--type-spacing-title);
}

.style-title--4, .scope-styles :where(h4) {
  font-size: var(--type-size-title-4);
  line-height: var(--type-line-height-title);
  letter-spacing: var(--type-letter-spacing-title);
  margin-bottom: var(--type-spacing-title);
}

.style-title--5, .scope-styles :where(h5) {
  font-size: var(--type-size-title-5);
  line-height: 1.5em;
  letter-spacing: var(--type-letter-spacing-title);
  margin-bottom: 0.75em;
}

.style-title--display {
  font-size: var(--type-size-display);
  line-height: var(--type-line-height-title);
  letter-spacing: var(--type-letter-spacing-title);
  margin-bottom: var(--type-spacing-title);
}

/* RIVER Design-System: Helpers - Styles / Formats */
.style-paragraph, .scope-styles :where(p) {
  margin-bottom: var(--type-spacing-normal);
}

.style-link, .scope-styles :where(a) {
  color: var(--colors-primary-normal);
  text-decoration: none;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: color;
}

.style-link:hover, .scope-styles :hover:where(a) {
  cursor: pointer;
  color: var(--colors-primary-dark);
}

.style-button, .scope-styles :where(button) {
  display: inline-block;
  padding: var(--sizes-padding-small);
  color: var(--colors-base);
  background-color: var(--colors-primary-normal);
  border: solid 2px var(--colors-gray-border);
  border-color: var(--colors-primary-normal);
  border-radius: 0;
  font-weight: var(--type-weight-bold);
  cursor: pointer;
  text-decoration: none;
}

.style-button:hover, .scope-styles :hover:where(button), .style-button:focus, .scope-styles :focus:where(button) {
  background-color: var(--colors-primary-dark);
  border-color: var(--colors-primary-dark);
}

.style-input, .scope-styles :where(input) {
  display: inline-block;
  padding: var(--sizes-padding-small);
  color: var(--colors-gray-normal);
  background-color: var(--colors-gray-bg);
  border: solid 2px var(--colors-gray-border);
  border-radius: 10px;
}

.style-input:hover, .scope-styles :hover:where(input), .style-input:focus, .scope-styles :focus:where(input) {
  border-color: var(--colors-primary-normal);
}

.style-small, .scope-styles :where(small) {
  font-size: 0.8em;
}

.style-big, .scope-styles :where(big) {
  font-size: 1.2em;
}

.style-strong, .scope-styles :where(strong, b) {
  font-weight: var(--type-weight-bold);
}

.style-emphasis, .scope-styles :where(em) {
  font-style: italic;
}

.style-caption {
  color: var(--colors-gray-light);
  font-size: 0.8em;
  font-weight: var(--type-weight-bold);
  text-transform: uppercase;
}

.style-divide, .scope-styles :where(hr) {
  display: block;
  border: none;
  border-top: solid 2px var(--colors-gray-border);
  margin: var(--sizes-size-large) 0;
}

.style-divide--vertical {
  height: 100%;
  width: 0;
  border-top: none;
  border-left: solid 2px var(--colors-gray-border);
  margin: 0 var(--sizes-size-layout-small);
}

.style-subtitle {
  font-weight: var(--type-weight-title);
  font-style: italic;
  border-bottom: solid 2px var(--colors-gray-border);
  margin-bottom: var(--sizes-size-normal);
}

.style-blockquote, .scope-styles :where(blockquote) {
  padding: var(--sizes-padding-small);
  border-left: solid 0.5rem var(--colors-gray-normal);
}

.style-blockquote > *:last-child, .scope-styles :where(blockquote) > *:last-child {
  margin-bottom: 0;
}

.style-inlinequote:before, .scope-styles :where(q):before {
  content: "“";
  margin-right: 0.1em;
}

.style-inlinequote:after, .scope-styles :where(q):after {
  content: "”";
  margin-left: 0.1em;
}

.style-quote {
  display: inline-block;
  padding: var(--sizes-padding-small);
  background-color: var(--colors-gray-bg);
}

.style-quote:before {
  content: "“";
  margin-right: 0.25em;
  font-size: 1.2em;
  color: var(--colors-gray-light);
}

.style-quote:after {
  content: "”";
  margin-left: 0.25em;
  font-size: 1.2em;
  color: var(--colors-gray-light);
}

.style-code, .scope-styles :where(code) {
  display: inline-block;
  padding: var(--sizes-size-smallest);
  font-size: 0.8em;
  background-color: var(--colors-gray-bg);
}

.style-codeblock, .scope-styles :where(pre) {
  display: inline-block;
  padding: var(--sizes-padding-small);
  background-color: var(--colors-gray-bg);
}

.style-overlay {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.style-overlay--gray {
  background-color: rgba(0, 0, 0, 0.5);
}

/* RIVER Design-System: Helpers - Styles / Formats */
.style-list, .scope-styles :where(ol), .scope-styles :where(ul) {
  margin-left: 2em;
}

.style-list--ul {
  list-style: disc;
}

.style-list--ol {
  list-style: decimal;
}

.style-table, .scope-styles :where(table) {
  display: table;
  width: 100%;
}

.style-table th, .scope-styles :where(table) th, td {
  padding: var(--sizes-padding-small);
  border-bottom: solid 2px var(--colors-gray-border);
  border-color: var(--colors-gray-bg);
}

.style-table th, .scope-styles :where(table) th {
  font-weight: var(--type-weight-bold);
  font-size: 1.05em;
}

/* RIVER Design-System: Helpers - Styles / Formats */
.style-image, .scope-styles :where(img) {
  display: inline-flex;
}

:where(.style-image, .scope-styles :where(img)) {
  width: auto;
  height: auto;
  max-width: 100%;
}

.style-image--fullwidth {
  width: 100%;
  height: auto;
}

.style-image--cover, .style-image--contain {
  position: absolute;
  inset: 0;
}

.style-image--cover {
  -o-object-fit: cover;
     object-fit: cover;
}

.style-image--contain {
  -o-object-fit: contain;
     object-fit: contain;
}

.style-icon {
  --size: 2rem;
  display: inline-flex;
  flex-shrink: 0;
  width: var(--size);
  height: var(--size);
}
.style-icon > span {
  display: contents;
}
.style-icon svg {
  display: inline-flex;
  width: inherit;
  height: inherit;
}

.style-icon--small {
  --size: 1.6rem;
}

.style-icon--normal {
  --size: 2rem;
}

.style-icon--large {
  --size: 2.6rem;
}

.style-video,
.style-splash {
  position: relative;
  display: block;
  width: 100%;
  padding-top: 57%;
}
.style-video > iframe, .style-video > img, .style-video > video,
.style-splash > iframe,
.style-splash > img,
.style-splash > video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.style-loading {
  opacity: 0.5;
  pointer-events: none;
}

/* RIVER Design-System: Helpers - Styles / Formats */
.style-notification {
  display: block;
  padding: 1rem 2rem;
  border: solid 2px slategray;
}

.style-notification--text {
  color: var(--colors-gray-normal);
  background-color: var(--colors-gray-bg);
  border-color: var(--colors-gray-border);
}

.style-notification--success {
  color: #5DA176;
  background-color: #ECF2E7;
  border-color: #57BC8A;
}

.style-notification--success :is(a, h1, h2, h3, h4, h5, h6) {
  color: #5DA176;
}

.style-notification--info {
  color: #3A61D8;
  background-color: #EAEAEA;
  border-color: #4B72E6;
}

.style-notification--info :is(a, h1, h2, h3, h4, h5, h6) {
  color: #3A61D8;
}

.style-notification--warning {
  color: #D1903C;
  background-color: #FFF4E3;
  border-color: #E8B44E;
}

.style-notification--warning :is(a, h1, h2, h3, h4, h5, h6) {
  color: #D1903C;
}

.style-notification--error {
  color: #CC2A2B;
  background-color: #F8E1E4;
  border-color: #DC4B4A;
}

.style-notification--error :is(a, h1, h2, h3, h4, h5, h6) {
  color: #CC2A2B;
}

/* RIVER Design-System: Helpers - Styles / Scope */
.scope-styles *:where(h1, h2, h3, h4, h5, h6) {
  margin-bottom: var(--type-spacing-small);
}
.scope-styles p,
.scope-styles button, .scope-styles input, .scope-styles blockquote,
.scope-styles pre,
.scope-styles ul, .scope-styles ol,
.scope-styles table {
  margin-bottom: var(--type-spacing-normal);
}
.scope-styles *:last-child {
  margin-bottom: 0 !important;
}

/* RIVER Design-System: Helpers - Layout / General */
.layout-clear {
  display: block;
  clear: both;
  height: 0;
  line-height: 0;
  overflow: hidden;
}

.layout-space {
  display: block;
  clear: both;
  line-height: 0;
  overflow: hidden;
}

/* RIVER Design-System: Helpers - Layout / Container */
.layout-container {
  flex-grow: 1;
  width: 100%;
  max-width: 1170px;
  margin-left: auto;
  margin-right: auto;
  padding-left: calc(var(--sizes-size-normal) / 2);
  padding-right: calc(var(--sizes-size-normal) / 2);
}

.layout-container--2x-small {
  max-width: 560px;
}

.layout-container--x-small {
  max-width: 720px;
}

.layout-container--small {
  max-width: 960px;
}

.layout-container--large {
  max-width: 1280px;
}

.layout-container--x-large {
  max-width: 1366px;
}

.layout-container--2x-large {
  max-width: 1450px;
}

.layout-container--fluid {
  max-width: none;
}

/* RIVER Design-System: Helpers - Layout / Section */
.layout-section {
  --layout-section--padding: var(--sizes-size-layout-normal);
  --layout-section--padding-multiplier: 0.5;
  position: relative;
  clear: both;
  padding-top: calc(var(--layout-section--padding) * var(--layout-section--padding-multiplier));
  padding-bottom: calc(var(--layout-section--padding) * var(--layout-section--padding-multiplier));
}
.layout-section:where(.layout-section--small) {
  --layout-section--padding: calc(var(--sizes-size-layout-normal) * 0.5);
}
.layout-section:where(.layout-section--large) {
  --layout-section--padding: calc(var(--sizes-size-layout-normal) * 2);
}
.layout-section:where(.layout-section--nopadding) {
  --layout-section--padding: 0 !important;
}
@media (min-width: 1020px) {
  .layout-section {
    --layout-section--padding-multiplier: 0.75;
  }
}
@media (min-width: 1280px) {
  .layout-section {
    --layout-section--padding-multiplier: 1.0;
  }
}

.layout-section:where(.layout-section + .layout-section) {
  padding-top: 0;
}

/* RIVER Design-System: Helpers - Display / General */
.display-fullscreen {
  width: 100%;
  min-height: 100vh;
}

.display-fullsize {
  width: 100%;
  height: 100%;
}

.display-cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.display-bg-cover {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.display-fit {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

.display-contain {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
}

/* RIVER Design-System: Helpers - Widths */
.width--full {
  width: 100%;
}

.width--20\% {
  width: 20%;
}

.offset--20\% {
  margin-left: 20%;
}

.width--25\% {
  width: 25%;
}

.offset--25\% {
  margin-left: 25%;
}

.width--33\% {
  width: 33%;
}

.offset--33\% {
  margin-left: 33%;
}

.width--40\% {
  width: 40%;
}

.offset--40\% {
  margin-left: 40%;
}

.width--50\% {
  width: 50%;
}

.offset--50\% {
  margin-left: 50%;
}

.width--60\% {
  width: 60%;
}

.offset--60\% {
  margin-left: 60%;
}

.width--66\% {
  width: 66%;
}

.offset--66\% {
  margin-left: 66%;
}

.width--75\% {
  width: 75%;
}

.offset--75\% {
  margin-left: 75%;
}

.width--80\% {
  width: 80%;
}

.offset--80\% {
  margin-left: 80%;
}

.width--100\% {
  width: 100%;
}

.offset--100\% {
  margin-left: 100%;
}

.width--0\/12 {
  width: 0%;
}

.offset--0\/12 {
  margin-left: 0%;
}

.width--1\/12 {
  width: 8.3333333333%;
}

.offset--1\/12 {
  margin-left: 8.3333333333%;
}

.width--2\/12 {
  width: 16.6666666667%;
}

.offset--2\/12 {
  margin-left: 16.6666666667%;
}

.width--3\/12 {
  width: 25%;
}

.offset--3\/12 {
  margin-left: 25%;
}

.width--4\/12 {
  width: 33.3333333333%;
}

.offset--4\/12 {
  margin-left: 33.3333333333%;
}

.width--5\/12 {
  width: 41.6666666667%;
}

.offset--5\/12 {
  margin-left: 41.6666666667%;
}

.width--6\/12 {
  width: 50%;
}

.offset--6\/12 {
  margin-left: 50%;
}

.width--7\/12 {
  width: 58.3333333333%;
}

.offset--7\/12 {
  margin-left: 58.3333333333%;
}

.width--8\/12 {
  width: 66.6666666667%;
}

.offset--8\/12 {
  margin-left: 66.6666666667%;
}

.width--9\/12 {
  width: 75%;
}

.offset--9\/12 {
  margin-left: 75%;
}

.width--10\/12 {
  width: 83.3333333333%;
}

.offset--10\/12 {
  margin-left: 83.3333333333%;
}

.width--11\/12 {
  width: 91.6666666667%;
}

.offset--11\/12 {
  margin-left: 91.6666666667%;
}

.width--12\/12 {
  width: 100%;
}

.offset--12\/12 {
  margin-left: 100%;
}

@media (min-width: 720px) {
  .sm\:width--full {
    width: 100%;
  }
  .sm\:width--20\% {
    width: 20%;
  }
  .sm\:offset--20\% {
    margin-left: 20%;
  }
  .sm\:width--25\% {
    width: 25%;
  }
  .sm\:offset--25\% {
    margin-left: 25%;
  }
  .sm\:width--33\% {
    width: 33%;
  }
  .sm\:offset--33\% {
    margin-left: 33%;
  }
  .sm\:width--40\% {
    width: 40%;
  }
  .sm\:offset--40\% {
    margin-left: 40%;
  }
  .sm\:width--50\% {
    width: 50%;
  }
  .sm\:offset--50\% {
    margin-left: 50%;
  }
  .sm\:width--60\% {
    width: 60%;
  }
  .sm\:offset--60\% {
    margin-left: 60%;
  }
  .sm\:width--66\% {
    width: 66%;
  }
  .sm\:offset--66\% {
    margin-left: 66%;
  }
  .sm\:width--75\% {
    width: 75%;
  }
  .sm\:offset--75\% {
    margin-left: 75%;
  }
  .sm\:width--80\% {
    width: 80%;
  }
  .sm\:offset--80\% {
    margin-left: 80%;
  }
  .sm\:width--100\% {
    width: 100%;
  }
  .sm\:offset--100\% {
    margin-left: 100%;
  }
  .sm\:width--0\/12 {
    width: 0%;
  }
  .sm\:offset--0\/12 {
    margin-left: 0%;
  }
  .sm\:width--1\/12 {
    width: 8.3333333333%;
  }
  .sm\:offset--1\/12 {
    margin-left: 8.3333333333%;
  }
  .sm\:width--2\/12 {
    width: 16.6666666667%;
  }
  .sm\:offset--2\/12 {
    margin-left: 16.6666666667%;
  }
  .sm\:width--3\/12 {
    width: 25%;
  }
  .sm\:offset--3\/12 {
    margin-left: 25%;
  }
  .sm\:width--4\/12 {
    width: 33.3333333333%;
  }
  .sm\:offset--4\/12 {
    margin-left: 33.3333333333%;
  }
  .sm\:width--5\/12 {
    width: 41.6666666667%;
  }
  .sm\:offset--5\/12 {
    margin-left: 41.6666666667%;
  }
  .sm\:width--6\/12 {
    width: 50%;
  }
  .sm\:offset--6\/12 {
    margin-left: 50%;
  }
  .sm\:width--7\/12 {
    width: 58.3333333333%;
  }
  .sm\:offset--7\/12 {
    margin-left: 58.3333333333%;
  }
  .sm\:width--8\/12 {
    width: 66.6666666667%;
  }
  .sm\:offset--8\/12 {
    margin-left: 66.6666666667%;
  }
  .sm\:width--9\/12 {
    width: 75%;
  }
  .sm\:offset--9\/12 {
    margin-left: 75%;
  }
  .sm\:width--10\/12 {
    width: 83.3333333333%;
  }
  .sm\:offset--10\/12 {
    margin-left: 83.3333333333%;
  }
  .sm\:width--11\/12 {
    width: 91.6666666667%;
  }
  .sm\:offset--11\/12 {
    margin-left: 91.6666666667%;
  }
  .sm\:width--12\/12 {
    width: 100%;
  }
  .sm\:offset--12\/12 {
    margin-left: 100%;
  }
}
@media (min-width: 1020px) {
  .md\:width--full {
    width: 100%;
  }
  .md\:width--20\% {
    width: 20%;
  }
  .md\:offset--20\% {
    margin-left: 20%;
  }
  .md\:width--25\% {
    width: 25%;
  }
  .md\:offset--25\% {
    margin-left: 25%;
  }
  .md\:width--33\% {
    width: 33%;
  }
  .md\:offset--33\% {
    margin-left: 33%;
  }
  .md\:width--40\% {
    width: 40%;
  }
  .md\:offset--40\% {
    margin-left: 40%;
  }
  .md\:width--50\% {
    width: 50%;
  }
  .md\:offset--50\% {
    margin-left: 50%;
  }
  .md\:width--60\% {
    width: 60%;
  }
  .md\:offset--60\% {
    margin-left: 60%;
  }
  .md\:width--66\% {
    width: 66%;
  }
  .md\:offset--66\% {
    margin-left: 66%;
  }
  .md\:width--75\% {
    width: 75%;
  }
  .md\:offset--75\% {
    margin-left: 75%;
  }
  .md\:width--80\% {
    width: 80%;
  }
  .md\:offset--80\% {
    margin-left: 80%;
  }
  .md\:width--100\% {
    width: 100%;
  }
  .md\:offset--100\% {
    margin-left: 100%;
  }
  .md\:width--0\/12 {
    width: 0%;
  }
  .md\:offset--0\/12 {
    margin-left: 0%;
  }
  .md\:width--1\/12 {
    width: 8.3333333333%;
  }
  .md\:offset--1\/12 {
    margin-left: 8.3333333333%;
  }
  .md\:width--2\/12 {
    width: 16.6666666667%;
  }
  .md\:offset--2\/12 {
    margin-left: 16.6666666667%;
  }
  .md\:width--3\/12 {
    width: 25%;
  }
  .md\:offset--3\/12 {
    margin-left: 25%;
  }
  .md\:width--4\/12 {
    width: 33.3333333333%;
  }
  .md\:offset--4\/12 {
    margin-left: 33.3333333333%;
  }
  .md\:width--5\/12 {
    width: 41.6666666667%;
  }
  .md\:offset--5\/12 {
    margin-left: 41.6666666667%;
  }
  .md\:width--6\/12 {
    width: 50%;
  }
  .md\:offset--6\/12 {
    margin-left: 50%;
  }
  .md\:width--7\/12 {
    width: 58.3333333333%;
  }
  .md\:offset--7\/12 {
    margin-left: 58.3333333333%;
  }
  .md\:width--8\/12 {
    width: 66.6666666667%;
  }
  .md\:offset--8\/12 {
    margin-left: 66.6666666667%;
  }
  .md\:width--9\/12 {
    width: 75%;
  }
  .md\:offset--9\/12 {
    margin-left: 75%;
  }
  .md\:width--10\/12 {
    width: 83.3333333333%;
  }
  .md\:offset--10\/12 {
    margin-left: 83.3333333333%;
  }
  .md\:width--11\/12 {
    width: 91.6666666667%;
  }
  .md\:offset--11\/12 {
    margin-left: 91.6666666667%;
  }
  .md\:width--12\/12 {
    width: 100%;
  }
  .md\:offset--12\/12 {
    margin-left: 100%;
  }
}
@media (min-width: 1280px) {
  .lg\:width--full {
    width: 100%;
  }
  .lg\:width--20\% {
    width: 20%;
  }
  .lg\:offset--20\% {
    margin-left: 20%;
  }
  .lg\:width--25\% {
    width: 25%;
  }
  .lg\:offset--25\% {
    margin-left: 25%;
  }
  .lg\:width--33\% {
    width: 33%;
  }
  .lg\:offset--33\% {
    margin-left: 33%;
  }
  .lg\:width--40\% {
    width: 40%;
  }
  .lg\:offset--40\% {
    margin-left: 40%;
  }
  .lg\:width--50\% {
    width: 50%;
  }
  .lg\:offset--50\% {
    margin-left: 50%;
  }
  .lg\:width--60\% {
    width: 60%;
  }
  .lg\:offset--60\% {
    margin-left: 60%;
  }
  .lg\:width--66\% {
    width: 66%;
  }
  .lg\:offset--66\% {
    margin-left: 66%;
  }
  .lg\:width--75\% {
    width: 75%;
  }
  .lg\:offset--75\% {
    margin-left: 75%;
  }
  .lg\:width--80\% {
    width: 80%;
  }
  .lg\:offset--80\% {
    margin-left: 80%;
  }
  .lg\:width--100\% {
    width: 100%;
  }
  .lg\:offset--100\% {
    margin-left: 100%;
  }
  .lg\:width--0\/12 {
    width: 0%;
  }
  .lg\:offset--0\/12 {
    margin-left: 0%;
  }
  .lg\:width--1\/12 {
    width: 8.3333333333%;
  }
  .lg\:offset--1\/12 {
    margin-left: 8.3333333333%;
  }
  .lg\:width--2\/12 {
    width: 16.6666666667%;
  }
  .lg\:offset--2\/12 {
    margin-left: 16.6666666667%;
  }
  .lg\:width--3\/12 {
    width: 25%;
  }
  .lg\:offset--3\/12 {
    margin-left: 25%;
  }
  .lg\:width--4\/12 {
    width: 33.3333333333%;
  }
  .lg\:offset--4\/12 {
    margin-left: 33.3333333333%;
  }
  .lg\:width--5\/12 {
    width: 41.6666666667%;
  }
  .lg\:offset--5\/12 {
    margin-left: 41.6666666667%;
  }
  .lg\:width--6\/12 {
    width: 50%;
  }
  .lg\:offset--6\/12 {
    margin-left: 50%;
  }
  .lg\:width--7\/12 {
    width: 58.3333333333%;
  }
  .lg\:offset--7\/12 {
    margin-left: 58.3333333333%;
  }
  .lg\:width--8\/12 {
    width: 66.6666666667%;
  }
  .lg\:offset--8\/12 {
    margin-left: 66.6666666667%;
  }
  .lg\:width--9\/12 {
    width: 75%;
  }
  .lg\:offset--9\/12 {
    margin-left: 75%;
  }
  .lg\:width--10\/12 {
    width: 83.3333333333%;
  }
  .lg\:offset--10\/12 {
    margin-left: 83.3333333333%;
  }
  .lg\:width--11\/12 {
    width: 91.6666666667%;
  }
  .lg\:offset--11\/12 {
    margin-left: 91.6666666667%;
  }
  .lg\:width--12\/12 {
    width: 100%;
  }
  .lg\:offset--12\/12 {
    margin-left: 100%;
  }
}
@media (min-width: 1440px) {
  .xl\:width--full {
    width: 100%;
  }
  .xl\:width--20\% {
    width: 20%;
  }
  .xl\:offset--20\% {
    margin-left: 20%;
  }
  .xl\:width--25\% {
    width: 25%;
  }
  .xl\:offset--25\% {
    margin-left: 25%;
  }
  .xl\:width--33\% {
    width: 33%;
  }
  .xl\:offset--33\% {
    margin-left: 33%;
  }
  .xl\:width--40\% {
    width: 40%;
  }
  .xl\:offset--40\% {
    margin-left: 40%;
  }
  .xl\:width--50\% {
    width: 50%;
  }
  .xl\:offset--50\% {
    margin-left: 50%;
  }
  .xl\:width--60\% {
    width: 60%;
  }
  .xl\:offset--60\% {
    margin-left: 60%;
  }
  .xl\:width--66\% {
    width: 66%;
  }
  .xl\:offset--66\% {
    margin-left: 66%;
  }
  .xl\:width--75\% {
    width: 75%;
  }
  .xl\:offset--75\% {
    margin-left: 75%;
  }
  .xl\:width--80\% {
    width: 80%;
  }
  .xl\:offset--80\% {
    margin-left: 80%;
  }
  .xl\:width--100\% {
    width: 100%;
  }
  .xl\:offset--100\% {
    margin-left: 100%;
  }
  .xl\:width--0\/12 {
    width: 0%;
  }
  .xl\:offset--0\/12 {
    margin-left: 0%;
  }
  .xl\:width--1\/12 {
    width: 8.3333333333%;
  }
  .xl\:offset--1\/12 {
    margin-left: 8.3333333333%;
  }
  .xl\:width--2\/12 {
    width: 16.6666666667%;
  }
  .xl\:offset--2\/12 {
    margin-left: 16.6666666667%;
  }
  .xl\:width--3\/12 {
    width: 25%;
  }
  .xl\:offset--3\/12 {
    margin-left: 25%;
  }
  .xl\:width--4\/12 {
    width: 33.3333333333%;
  }
  .xl\:offset--4\/12 {
    margin-left: 33.3333333333%;
  }
  .xl\:width--5\/12 {
    width: 41.6666666667%;
  }
  .xl\:offset--5\/12 {
    margin-left: 41.6666666667%;
  }
  .xl\:width--6\/12 {
    width: 50%;
  }
  .xl\:offset--6\/12 {
    margin-left: 50%;
  }
  .xl\:width--7\/12 {
    width: 58.3333333333%;
  }
  .xl\:offset--7\/12 {
    margin-left: 58.3333333333%;
  }
  .xl\:width--8\/12 {
    width: 66.6666666667%;
  }
  .xl\:offset--8\/12 {
    margin-left: 66.6666666667%;
  }
  .xl\:width--9\/12 {
    width: 75%;
  }
  .xl\:offset--9\/12 {
    margin-left: 75%;
  }
  .xl\:width--10\/12 {
    width: 83.3333333333%;
  }
  .xl\:offset--10\/12 {
    margin-left: 83.3333333333%;
  }
  .xl\:width--11\/12 {
    width: 91.6666666667%;
  }
  .xl\:offset--11\/12 {
    margin-left: 91.6666666667%;
  }
  .xl\:width--12\/12 {
    width: 100%;
  }
  .xl\:offset--12\/12 {
    margin-left: 100%;
  }
}
/* RIVER Design-System: Helpers - Grid Cols */
.grid-cols {
  display: grid;
}

.grid-cols--inline {
  display: inline-grid;
}

.grid-cols--1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-cols--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-cols--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid-cols--5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.grid-cols--6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.grid-cols--7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.grid-cols--8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.grid-cols--9 {
  grid-template-columns: repeat(9, minmax(0, 1fr));
}

.grid-cols--10 {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}

.grid-cols--11 {
  grid-template-columns: repeat(11, minmax(0, 1fr));
}

.grid-cols--12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.grid-col--auto {
  grid-column: auto;
}

.grid-col--start-auto {
  grid-column-start: auto;
}

.grid-col--end-auto {
  grid-end-start: auto;
}

.grid-col--full {
  grid-column: 1/-1;
}

.grid-span--1 {
  grid-column: span 1/span 1;
}

.grid-start--1 {
  grid-column-start: 1;
}

.grid-end--1 {
  grid-column-end: 1;
}

.grid-span--2 {
  grid-column: span 2/span 2;
}

.grid-start--2 {
  grid-column-start: 2;
}

.grid-end--2 {
  grid-column-end: 2;
}

.grid-span--3 {
  grid-column: span 3/span 3;
}

.grid-start--3 {
  grid-column-start: 3;
}

.grid-end--3 {
  grid-column-end: 3;
}

.grid-span--4 {
  grid-column: span 4/span 4;
}

.grid-start--4 {
  grid-column-start: 4;
}

.grid-end--4 {
  grid-column-end: 4;
}

.grid-span--5 {
  grid-column: span 5/span 5;
}

.grid-start--5 {
  grid-column-start: 5;
}

.grid-end--5 {
  grid-column-end: 5;
}

.grid-span--6 {
  grid-column: span 6/span 6;
}

.grid-start--6 {
  grid-column-start: 6;
}

.grid-end--6 {
  grid-column-end: 6;
}

.grid-span--7 {
  grid-column: span 7/span 7;
}

.grid-start--7 {
  grid-column-start: 7;
}

.grid-end--7 {
  grid-column-end: 7;
}

.grid-span--8 {
  grid-column: span 8/span 8;
}

.grid-start--8 {
  grid-column-start: 8;
}

.grid-end--8 {
  grid-column-end: 8;
}

.grid-span--9 {
  grid-column: span 9/span 9;
}

.grid-start--9 {
  grid-column-start: 9;
}

.grid-end--9 {
  grid-column-end: 9;
}

.grid-span--10 {
  grid-column: span 10/span 10;
}

.grid-start--10 {
  grid-column-start: 10;
}

.grid-end--10 {
  grid-column-end: 10;
}

.grid-span--11 {
  grid-column: span 11/span 11;
}

.grid-start--11 {
  grid-column-start: 11;
}

.grid-end--11 {
  grid-column-end: 11;
}

.grid-span--12 {
  grid-column: span 12/span 12;
}

.grid-start--12 {
  grid-column-start: 12;
}

.grid-end--12 {
  grid-column-end: 12;
}

.grid-span--13 {
  grid-column: span 13/span 13;
}

.grid-start--13 {
  grid-column-start: 13;
}

.grid-end--13 {
  grid-column-end: 13;
}

@media (min-width: 720px) {
  .sm\:grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .sm\:grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sm\:grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sm\:grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .sm\:grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .sm\:grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .sm\:grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .sm\:grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .sm\:grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .sm\:grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .sm\:grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .sm\:grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .sm\:grid-col--auto {
    grid-column: auto;
  }
  .sm\:grid-col--start-auto {
    grid-column-start: auto;
  }
  .sm\:grid-col--end-auto {
    grid-end-start: auto;
  }
  .sm\:grid-col--full {
    grid-column: 1/-1;
  }
  .sm\:grid-span--1 {
    grid-column: span 1/span 1;
  }
  .sm\:grid-start--1 {
    grid-column-start: 1;
  }
  .sm\:grid-end--1 {
    grid-column-end: 1;
  }
  .sm\:grid-span--2 {
    grid-column: span 2/span 2;
  }
  .sm\:grid-start--2 {
    grid-column-start: 2;
  }
  .sm\:grid-end--2 {
    grid-column-end: 2;
  }
  .sm\:grid-span--3 {
    grid-column: span 3/span 3;
  }
  .sm\:grid-start--3 {
    grid-column-start: 3;
  }
  .sm\:grid-end--3 {
    grid-column-end: 3;
  }
  .sm\:grid-span--4 {
    grid-column: span 4/span 4;
  }
  .sm\:grid-start--4 {
    grid-column-start: 4;
  }
  .sm\:grid-end--4 {
    grid-column-end: 4;
  }
  .sm\:grid-span--5 {
    grid-column: span 5/span 5;
  }
  .sm\:grid-start--5 {
    grid-column-start: 5;
  }
  .sm\:grid-end--5 {
    grid-column-end: 5;
  }
  .sm\:grid-span--6 {
    grid-column: span 6/span 6;
  }
  .sm\:grid-start--6 {
    grid-column-start: 6;
  }
  .sm\:grid-end--6 {
    grid-column-end: 6;
  }
  .sm\:grid-span--7 {
    grid-column: span 7/span 7;
  }
  .sm\:grid-start--7 {
    grid-column-start: 7;
  }
  .sm\:grid-end--7 {
    grid-column-end: 7;
  }
  .sm\:grid-span--8 {
    grid-column: span 8/span 8;
  }
  .sm\:grid-start--8 {
    grid-column-start: 8;
  }
  .sm\:grid-end--8 {
    grid-column-end: 8;
  }
  .sm\:grid-span--9 {
    grid-column: span 9/span 9;
  }
  .sm\:grid-start--9 {
    grid-column-start: 9;
  }
  .sm\:grid-end--9 {
    grid-column-end: 9;
  }
  .sm\:grid-span--10 {
    grid-column: span 10/span 10;
  }
  .sm\:grid-start--10 {
    grid-column-start: 10;
  }
  .sm\:grid-end--10 {
    grid-column-end: 10;
  }
  .sm\:grid-span--11 {
    grid-column: span 11/span 11;
  }
  .sm\:grid-start--11 {
    grid-column-start: 11;
  }
  .sm\:grid-end--11 {
    grid-column-end: 11;
  }
  .sm\:grid-span--12 {
    grid-column: span 12/span 12;
  }
  .sm\:grid-start--12 {
    grid-column-start: 12;
  }
  .sm\:grid-end--12 {
    grid-column-end: 12;
  }
  .sm\:grid-span--13 {
    grid-column: span 13/span 13;
  }
  .sm\:grid-start--13 {
    grid-column-start: 13;
  }
  .sm\:grid-end--13 {
    grid-column-end: 13;
  }
}
@media (min-width: 1020px) {
  .md\:grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .md\:grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md\:grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .md\:grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .md\:grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .md\:grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .md\:grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .md\:grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .md\:grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .md\:grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .md\:grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .md\:grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .md\:grid-col--auto {
    grid-column: auto;
  }
  .md\:grid-col--start-auto {
    grid-column-start: auto;
  }
  .md\:grid-col--end-auto {
    grid-end-start: auto;
  }
  .md\:grid-col--full {
    grid-column: 1/-1;
  }
  .md\:grid-span--1 {
    grid-column: span 1/span 1;
  }
  .md\:grid-start--1 {
    grid-column-start: 1;
  }
  .md\:grid-end--1 {
    grid-column-end: 1;
  }
  .md\:grid-span--2 {
    grid-column: span 2/span 2;
  }
  .md\:grid-start--2 {
    grid-column-start: 2;
  }
  .md\:grid-end--2 {
    grid-column-end: 2;
  }
  .md\:grid-span--3 {
    grid-column: span 3/span 3;
  }
  .md\:grid-start--3 {
    grid-column-start: 3;
  }
  .md\:grid-end--3 {
    grid-column-end: 3;
  }
  .md\:grid-span--4 {
    grid-column: span 4/span 4;
  }
  .md\:grid-start--4 {
    grid-column-start: 4;
  }
  .md\:grid-end--4 {
    grid-column-end: 4;
  }
  .md\:grid-span--5 {
    grid-column: span 5/span 5;
  }
  .md\:grid-start--5 {
    grid-column-start: 5;
  }
  .md\:grid-end--5 {
    grid-column-end: 5;
  }
  .md\:grid-span--6 {
    grid-column: span 6/span 6;
  }
  .md\:grid-start--6 {
    grid-column-start: 6;
  }
  .md\:grid-end--6 {
    grid-column-end: 6;
  }
  .md\:grid-span--7 {
    grid-column: span 7/span 7;
  }
  .md\:grid-start--7 {
    grid-column-start: 7;
  }
  .md\:grid-end--7 {
    grid-column-end: 7;
  }
  .md\:grid-span--8 {
    grid-column: span 8/span 8;
  }
  .md\:grid-start--8 {
    grid-column-start: 8;
  }
  .md\:grid-end--8 {
    grid-column-end: 8;
  }
  .md\:grid-span--9 {
    grid-column: span 9/span 9;
  }
  .md\:grid-start--9 {
    grid-column-start: 9;
  }
  .md\:grid-end--9 {
    grid-column-end: 9;
  }
  .md\:grid-span--10 {
    grid-column: span 10/span 10;
  }
  .md\:grid-start--10 {
    grid-column-start: 10;
  }
  .md\:grid-end--10 {
    grid-column-end: 10;
  }
  .md\:grid-span--11 {
    grid-column: span 11/span 11;
  }
  .md\:grid-start--11 {
    grid-column-start: 11;
  }
  .md\:grid-end--11 {
    grid-column-end: 11;
  }
  .md\:grid-span--12 {
    grid-column: span 12/span 12;
  }
  .md\:grid-start--12 {
    grid-column-start: 12;
  }
  .md\:grid-end--12 {
    grid-column-end: 12;
  }
  .md\:grid-span--13 {
    grid-column: span 13/span 13;
  }
  .md\:grid-start--13 {
    grid-column-start: 13;
  }
  .md\:grid-end--13 {
    grid-column-end: 13;
  }
}
@media (min-width: 1280px) {
  .lg\:grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .lg\:grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lg\:grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lg\:grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .lg\:grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .lg\:grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .lg\:grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .lg\:grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .lg\:grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .lg\:grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .lg\:grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .lg\:grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .lg\:grid-col--auto {
    grid-column: auto;
  }
  .lg\:grid-col--start-auto {
    grid-column-start: auto;
  }
  .lg\:grid-col--end-auto {
    grid-end-start: auto;
  }
  .lg\:grid-col--full {
    grid-column: 1/-1;
  }
  .lg\:grid-span--1 {
    grid-column: span 1/span 1;
  }
  .lg\:grid-start--1 {
    grid-column-start: 1;
  }
  .lg\:grid-end--1 {
    grid-column-end: 1;
  }
  .lg\:grid-span--2 {
    grid-column: span 2/span 2;
  }
  .lg\:grid-start--2 {
    grid-column-start: 2;
  }
  .lg\:grid-end--2 {
    grid-column-end: 2;
  }
  .lg\:grid-span--3 {
    grid-column: span 3/span 3;
  }
  .lg\:grid-start--3 {
    grid-column-start: 3;
  }
  .lg\:grid-end--3 {
    grid-column-end: 3;
  }
  .lg\:grid-span--4 {
    grid-column: span 4/span 4;
  }
  .lg\:grid-start--4 {
    grid-column-start: 4;
  }
  .lg\:grid-end--4 {
    grid-column-end: 4;
  }
  .lg\:grid-span--5 {
    grid-column: span 5/span 5;
  }
  .lg\:grid-start--5 {
    grid-column-start: 5;
  }
  .lg\:grid-end--5 {
    grid-column-end: 5;
  }
  .lg\:grid-span--6 {
    grid-column: span 6/span 6;
  }
  .lg\:grid-start--6 {
    grid-column-start: 6;
  }
  .lg\:grid-end--6 {
    grid-column-end: 6;
  }
  .lg\:grid-span--7 {
    grid-column: span 7/span 7;
  }
  .lg\:grid-start--7 {
    grid-column-start: 7;
  }
  .lg\:grid-end--7 {
    grid-column-end: 7;
  }
  .lg\:grid-span--8 {
    grid-column: span 8/span 8;
  }
  .lg\:grid-start--8 {
    grid-column-start: 8;
  }
  .lg\:grid-end--8 {
    grid-column-end: 8;
  }
  .lg\:grid-span--9 {
    grid-column: span 9/span 9;
  }
  .lg\:grid-start--9 {
    grid-column-start: 9;
  }
  .lg\:grid-end--9 {
    grid-column-end: 9;
  }
  .lg\:grid-span--10 {
    grid-column: span 10/span 10;
  }
  .lg\:grid-start--10 {
    grid-column-start: 10;
  }
  .lg\:grid-end--10 {
    grid-column-end: 10;
  }
  .lg\:grid-span--11 {
    grid-column: span 11/span 11;
  }
  .lg\:grid-start--11 {
    grid-column-start: 11;
  }
  .lg\:grid-end--11 {
    grid-column-end: 11;
  }
  .lg\:grid-span--12 {
    grid-column: span 12/span 12;
  }
  .lg\:grid-start--12 {
    grid-column-start: 12;
  }
  .lg\:grid-end--12 {
    grid-column-end: 12;
  }
  .lg\:grid-span--13 {
    grid-column: span 13/span 13;
  }
  .lg\:grid-start--13 {
    grid-column-start: 13;
  }
  .lg\:grid-end--13 {
    grid-column-end: 13;
  }
}
@media (min-width: 1440px) {
  .xl\:grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl\:grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl\:grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl\:grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl\:grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl\:grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl\:grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl\:grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl\:grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xl\:grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xl\:grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xl\:grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .xl\:grid-col--auto {
    grid-column: auto;
  }
  .xl\:grid-col--start-auto {
    grid-column-start: auto;
  }
  .xl\:grid-col--end-auto {
    grid-end-start: auto;
  }
  .xl\:grid-col--full {
    grid-column: 1/-1;
  }
  .xl\:grid-span--1 {
    grid-column: span 1/span 1;
  }
  .xl\:grid-start--1 {
    grid-column-start: 1;
  }
  .xl\:grid-end--1 {
    grid-column-end: 1;
  }
  .xl\:grid-span--2 {
    grid-column: span 2/span 2;
  }
  .xl\:grid-start--2 {
    grid-column-start: 2;
  }
  .xl\:grid-end--2 {
    grid-column-end: 2;
  }
  .xl\:grid-span--3 {
    grid-column: span 3/span 3;
  }
  .xl\:grid-start--3 {
    grid-column-start: 3;
  }
  .xl\:grid-end--3 {
    grid-column-end: 3;
  }
  .xl\:grid-span--4 {
    grid-column: span 4/span 4;
  }
  .xl\:grid-start--4 {
    grid-column-start: 4;
  }
  .xl\:grid-end--4 {
    grid-column-end: 4;
  }
  .xl\:grid-span--5 {
    grid-column: span 5/span 5;
  }
  .xl\:grid-start--5 {
    grid-column-start: 5;
  }
  .xl\:grid-end--5 {
    grid-column-end: 5;
  }
  .xl\:grid-span--6 {
    grid-column: span 6/span 6;
  }
  .xl\:grid-start--6 {
    grid-column-start: 6;
  }
  .xl\:grid-end--6 {
    grid-column-end: 6;
  }
  .xl\:grid-span--7 {
    grid-column: span 7/span 7;
  }
  .xl\:grid-start--7 {
    grid-column-start: 7;
  }
  .xl\:grid-end--7 {
    grid-column-end: 7;
  }
  .xl\:grid-span--8 {
    grid-column: span 8/span 8;
  }
  .xl\:grid-start--8 {
    grid-column-start: 8;
  }
  .xl\:grid-end--8 {
    grid-column-end: 8;
  }
  .xl\:grid-span--9 {
    grid-column: span 9/span 9;
  }
  .xl\:grid-start--9 {
    grid-column-start: 9;
  }
  .xl\:grid-end--9 {
    grid-column-end: 9;
  }
  .xl\:grid-span--10 {
    grid-column: span 10/span 10;
  }
  .xl\:grid-start--10 {
    grid-column-start: 10;
  }
  .xl\:grid-end--10 {
    grid-column-end: 10;
  }
  .xl\:grid-span--11 {
    grid-column: span 11/span 11;
  }
  .xl\:grid-start--11 {
    grid-column-start: 11;
  }
  .xl\:grid-end--11 {
    grid-column-end: 11;
  }
  .xl\:grid-span--12 {
    grid-column: span 12/span 12;
  }
  .xl\:grid-start--12 {
    grid-column-start: 12;
  }
  .xl\:grid-end--12 {
    grid-column-end: 12;
  }
  .xl\:grid-span--13 {
    grid-column: span 13/span 13;
  }
  .xl\:grid-start--13 {
    grid-column-start: 13;
  }
  .xl\:grid-end--13 {
    grid-column-end: 13;
  }
}
/* RIVER Design-System: Helpers - Flex Cols */
.flex-cols {
  --column-gap: var(--sizes-gutter-normal);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
}

:where(.flex-cols) {
  margin-left: calc(var(--column-gap) * -1);
  margin-right: calc(var(--column-gap) * -1);
}

.flex-col {
  max-width: 100%;
}

:where(.flex-col) {
  padding-left: var(--column-gap);
  padding-right: var(--column-gap);
}

.flex-cols--inline {
  display: inline-flex;
}

.flex-cols--center {
  justify-content: center;
}

.flex-cols--justify {
  justify-content: space-between;
  align-content: space-between;
}

.flex-cols--equal > *:where(.flex-col) {
  flex: 1 0 0%;
}

.flex-cols--small {
  --column-gap: var(--sizes-gutter-small);
}

.flex-cols--normal {
  --column-gap: var(--sizes-gutter-normal);
}

.flex-cols--large {
  --column-gap: var(--sizes-gutter-large);
}

.flex-cols--nogap {
  --column-gap: 0;
}

.flex-col--auto {
  flex: 1 0 0%;
}

.flex-col--full {
  flex: 0 0 100%;
}

.flex-col--fixed {
  flex: 0 0 auto;
}

@media (min-width: 720px) {
  .sm\:flex-col--auto {
    flex: 1 0 0%;
  }
  .sm\:flex-col--full {
    flex: 0 0 100%;
  }
  .sm\:flex-col--fixed {
    flex: 0 0 auto;
  }
}
@media (min-width: 1020px) {
  .md\:flex-col--auto {
    flex: 1 0 0%;
  }
  .md\:flex-col--full {
    flex: 0 0 100%;
  }
  .md\:flex-col--fixed {
    flex: 0 0 auto;
  }
}
@media (min-width: 1280px) {
  .lg\:flex-col--auto {
    flex: 1 0 0%;
  }
  .lg\:flex-col--full {
    flex: 0 0 100%;
  }
  .lg\:flex-col--fixed {
    flex: 0 0 auto;
  }
}
@media (min-width: 1440px) {
  .xl\:flex-col--auto {
    flex: 1 0 0%;
  }
  .xl\:flex-col--full {
    flex: 0 0 100%;
  }
  .xl\:flex-col--fixed {
    flex: 0 0 auto;
  }
}
/* RIVER Design-System: Helpers - Flex / General */
.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-center-vertical {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.flex-center-horizontal {
  display: flex;
  flex-direction: row;
  align-items: center;
}

/* RIVER Design-System: Utilities */
/* display-important */
.none {
  display: none;
}

.none\! {
  display: none !important;
}

.block {
  display: block;
}

.block\! {
  display: block !important;
}

.inline-block {
  display: inline-block;
}

.inline-block\! {
  display: inline-block !important;
}

.inline {
  display: inline;
}

.inline\! {
  display: inline !important;
}

/* display-common */
.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.grid {
  display: grid;
}

.inline-grid {
  display: inline-grid;
}

.flow-root {
  display: flow-root;
}

/* position */
.static {
  position: static;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.fixed {
  position: fixed;
}

.sticky {
  position: sticky;
}

/* text */
.text-align--center {
  text-align: center;
}

.text-align--left {
  text-align: left;
}

.text-align--right {
  text-align: right;
}

.text-align--justify {
  text-align: text;
}

/* flex-direction */
.direction--row {
  flex-direction: row;
}

.direction--row-reverse {
  flex-direction: row-reverse;
}

.direction--col {
  flex-direction: column;
}

.direction--col-reverse {
  flex-direction: column-reverse;
}

/* flex-wrap */
.flex-wrap--none {
  flex-wrap: nowrap;
}

.flex-wrap--wrap {
  flex-wrap: wrap;
}

.flex-wrap--reverse {
  flex-wrap: wrap-reverse;
}

/* justify-content */
.justify--start {
  justify-content: flex-start;
}

.justify--end {
  justify-content: flex-end;
}

.justify--center {
  justify-content: center;
}

.justify--between {
  justify-content: space-between;
}

.justify--around {
  justify-content: space-around;
}

.justify--evenly {
  justify-content: space-evenly;
}

/* align-items */
.align--stretch {
  align-items: stretch;
}

.align--start {
  align-items: flex-start;
}

.align--center {
  align-items: center;
}

.align--end {
  align-items: flex-end;
}

.align--baseline {
  align-items: baseline;
}

/* align-content */
.content--stretch {
  align-content: stretch;
}

.content--start {
  align-content: flex-start;
}

.content--center {
  align-content: center;
}

.content--end {
  align-content: flex-end;
}

.content--between {
  align-content: space-between;
}

.content--around {
  align-content: space-around;
}

.content--evenly {
  align-content: space-evenly;
}

/* border-helpers */
.border--video {
  border: solid 1px var(--colors-gray-border-light);
}

.border--normal {
  border: solid 2px var(--colors-gray-border);
}

.border--input {
  border: solid 2px var(--colors-gray-border);
}

/* design-color-all */
.color--base {
  color: var(--colors-base);
}

.color--reverse {
  color: var(--colors-reverse);
}

.color--gray\.dark {
  color: var(--colors-gray-dark);
}

.color--gray\.title {
  color: var(--colors-gray-title);
}

.color--gray\.bg-menu {
  color: var(--colors-gray-bg-menu);
}

.color--gray\.shadow {
  color: var(--colors-gray-shadow);
}

.color--gray\.dark-bg-elements {
  color: var(--colors-gray-dark-bg-elements);
}

.color--gray {
  color: var(--colors-gray-normal);
}

.color--gray\.normal {
  color: var(--colors-gray-normal);
}

.color--gray\.body {
  color: var(--colors-gray-body);
}

.color--gray\.border {
  color: var(--colors-gray-border);
}

.color--gray\.light {
  color: var(--colors-gray-light);
}

.color--gray\.border-light {
  color: var(--colors-gray-border-light);
}

.color--gray\.bg-elements {
  color: var(--colors-gray-bg-elements);
}

.color--gray\.light-bg-elements {
  color: var(--colors-gray-light-bg-elements);
}

.color--gray\.bg {
  color: var(--colors-gray-bg);
}

.color--primary\.dark {
  color: var(--colors-primary-dark);
}

.color--primary\.title {
  color: var(--colors-primary-title);
}

.color--primary\.bg-menu {
  color: var(--colors-primary-bg-menu);
}

.color--primary\.shadow {
  color: var(--colors-primary-shadow);
}

.color--primary\.dark-bg-elements {
  color: var(--colors-primary-dark-bg-elements);
}

.color--primary {
  color: var(--colors-primary-normal);
}

.color--primary\.normal {
  color: var(--colors-primary-normal);
}

.color--primary\.body {
  color: var(--colors-primary-body);
}

.color--primary\.border {
  color: var(--colors-primary-border);
}

.color--primary\.light {
  color: var(--colors-primary-light);
}

.color--primary\.border-light {
  color: var(--colors-primary-border-light);
}

.color--primary\.bg-elements {
  color: var(--colors-primary-bg-elements);
}

.color--primary\.light-bg-elements {
  color: var(--colors-primary-light-bg-elements);
}

.color--primary\.bg {
  color: var(--colors-primary-bg);
}

.color--secondary\.dark {
  color: var(--colors-secondary-dark);
}

.color--secondary {
  color: var(--colors-secondary-normal);
}

.color--secondary\.normal {
  color: var(--colors-secondary-normal);
}

.color--secondary\.title {
  color: var(--colors-secondary-title);
}

.color--secondary\.light {
  color: var(--colors-secondary-light);
}

.color--secondary\.bg {
  color: var(--colors-secondary-bg);
}

.bg--base {
  background-color: var(--colors-base);
}

.bg--reverse {
  background-color: var(--colors-reverse);
}

.bg--gray\.dark {
  background-color: var(--colors-gray-dark);
}

.bg--gray\.title {
  background-color: var(--colors-gray-title);
}

.bg--gray\.bg-menu {
  background-color: var(--colors-gray-bg-menu);
}

.bg--gray\.shadow {
  background-color: var(--colors-gray-shadow);
}

.bg--gray\.dark-bg-elements {
  background-color: var(--colors-gray-dark-bg-elements);
}

.bg--gray {
  background-color: var(--colors-gray-normal);
}

.bg--gray\.normal {
  background-color: var(--colors-gray-normal);
}

.bg--gray\.body {
  background-color: var(--colors-gray-body);
}

.bg--gray\.border {
  background-color: var(--colors-gray-border);
}

.bg--gray\.light {
  background-color: var(--colors-gray-light);
}

.bg--gray\.border-light {
  background-color: var(--colors-gray-border-light);
}

.bg--gray\.bg-elements {
  background-color: var(--colors-gray-bg-elements);
}

.bg--gray\.light-bg-elements {
  background-color: var(--colors-gray-light-bg-elements);
}

.bg--gray\.bg {
  background-color: var(--colors-gray-bg);
}

.bg--primary\.dark {
  background-color: var(--colors-primary-dark);
}

.bg--primary\.title {
  background-color: var(--colors-primary-title);
}

.bg--primary\.bg-menu {
  background-color: var(--colors-primary-bg-menu);
}

.bg--primary\.shadow {
  background-color: var(--colors-primary-shadow);
}

.bg--primary\.dark-bg-elements {
  background-color: var(--colors-primary-dark-bg-elements);
}

.bg--primary {
  background-color: var(--colors-primary-normal);
}

.bg--primary\.normal {
  background-color: var(--colors-primary-normal);
}

.bg--primary\.body {
  background-color: var(--colors-primary-body);
}

.bg--primary\.border {
  background-color: var(--colors-primary-border);
}

.bg--primary\.light {
  background-color: var(--colors-primary-light);
}

.bg--primary\.border-light {
  background-color: var(--colors-primary-border-light);
}

.bg--primary\.bg-elements {
  background-color: var(--colors-primary-bg-elements);
}

.bg--primary\.light-bg-elements {
  background-color: var(--colors-primary-light-bg-elements);
}

.bg--primary\.bg {
  background-color: var(--colors-primary-bg);
}

.bg--secondary\.dark {
  background-color: var(--colors-secondary-dark);
}

.bg--secondary {
  background-color: var(--colors-secondary-normal);
}

.bg--secondary\.normal {
  background-color: var(--colors-secondary-normal);
}

.bg--secondary\.title {
  background-color: var(--colors-secondary-title);
}

.bg--secondary\.light {
  background-color: var(--colors-secondary-light);
}

.bg--secondary\.bg {
  background-color: var(--colors-secondary-bg);
}

.border--base {
  border-color: var(--colors-base);
}

.border--reverse {
  border-color: var(--colors-reverse);
}

.border--gray\.dark {
  border-color: var(--colors-gray-dark);
}

.border--gray\.title {
  border-color: var(--colors-gray-title);
}

.border--gray\.bg-menu {
  border-color: var(--colors-gray-bg-menu);
}

.border--gray\.shadow {
  border-color: var(--colors-gray-shadow);
}

.border--gray\.dark-bg-elements {
  border-color: var(--colors-gray-dark-bg-elements);
}

.border--gray {
  border-color: var(--colors-gray-normal);
}

.border--gray\.normal {
  border-color: var(--colors-gray-normal);
}

.border--gray\.body {
  border-color: var(--colors-gray-body);
}

.border--gray\.border {
  border-color: var(--colors-gray-border);
}

.border--gray\.light {
  border-color: var(--colors-gray-light);
}

.border--gray\.border-light {
  border-color: var(--colors-gray-border-light);
}

.border--gray\.bg-elements {
  border-color: var(--colors-gray-bg-elements);
}

.border--gray\.light-bg-elements {
  border-color: var(--colors-gray-light-bg-elements);
}

.border--gray\.bg {
  border-color: var(--colors-gray-bg);
}

.border--primary\.dark {
  border-color: var(--colors-primary-dark);
}

.border--primary\.title {
  border-color: var(--colors-primary-title);
}

.border--primary\.bg-menu {
  border-color: var(--colors-primary-bg-menu);
}

.border--primary\.shadow {
  border-color: var(--colors-primary-shadow);
}

.border--primary\.dark-bg-elements {
  border-color: var(--colors-primary-dark-bg-elements);
}

.border--primary {
  border-color: var(--colors-primary-normal);
}

.border--primary\.normal {
  border-color: var(--colors-primary-normal);
}

.border--primary\.body {
  border-color: var(--colors-primary-body);
}

.border--primary\.border {
  border-color: var(--colors-primary-border);
}

.border--primary\.light {
  border-color: var(--colors-primary-light);
}

.border--primary\.border-light {
  border-color: var(--colors-primary-border-light);
}

.border--primary\.bg-elements {
  border-color: var(--colors-primary-bg-elements);
}

.border--primary\.light-bg-elements {
  border-color: var(--colors-primary-light-bg-elements);
}

.border--primary\.bg {
  border-color: var(--colors-primary-bg);
}

.border--secondary\.dark {
  border-color: var(--colors-secondary-dark);
}

.border--secondary {
  border-color: var(--colors-secondary-normal);
}

.border--secondary\.normal {
  border-color: var(--colors-secondary-normal);
}

.border--secondary\.title {
  border-color: var(--colors-secondary-title);
}

.border--secondary\.light {
  border-color: var(--colors-secondary-light);
}

.border--secondary\.bg {
  border-color: var(--colors-secondary-bg);
}

/* design-notifications-text */
/* design-notifications-bg */
.bg--success\.bg {
  background-color: #ECF2E7;
}

.bg--info\.bg {
  background-color: #EAEAEA;
}

.bg--warning\.bg {
  background-color: #FFF4E3;
}

.bg--error\.bg {
  background-color: #F8E1E4;
}

/* design-notifications-border */
/* design-type-size */
.font-size--x-small {
  font-size: var(--type-size-x-small);
}

.font-size--small {
  font-size: var(--type-size-small);
}

.font-size--normal {
  font-size: var(--type-size-normal);
}

.font-size--large {
  font-size: var(--type-size-large);
}

.font-size--x-large {
  font-size: var(--type-size-x-large);
}

.font-size--title-1 {
  font-size: var(--type-size-title-1);
}

.font-size--title-2 {
  font-size: var(--type-size-title-2);
}

.font-size--title-3 {
  font-size: var(--type-size-title-3);
}

.font-size--title-4 {
  font-size: var(--type-size-title-4);
}

.font-size--title-5 {
  font-size: var(--type-size-title-5);
}

.font-size--display {
  font-size: var(--type-size-display);
}

/* design-type-weight */
.font-weight--normal {
  font-weight: var(--type-weight-normal);
}

.font-weight--bold {
  font-weight: var(--type-weight-bold);
}

.font-weight--title {
  font-weight: var(--type-weight-title);
}

/* design-type-spacing */
.spacing--normal {
  margin-bottom: var(--type-spacing-normal);
}

.spacing--small {
  margin-bottom: var(--type-spacing-small);
}

.spacing--title {
  margin-bottom: var(--type-spacing-title);
}

.spacing--none {
  margin-bottom: var(--type-spacing-none);
}

/* design-dimension-width */
.w--subtle {
  width: var(--sizes-size-subtle);
}

.w--smallest {
  width: var(--sizes-size-smallest);
}

.w--x-small {
  width: var(--sizes-size-x-small);
}

.w--small {
  width: var(--sizes-size-small);
}

.w--normal {
  width: var(--sizes-size-normal);
}

.w--large {
  width: var(--sizes-size-large);
}

.w--x-large {
  width: var(--sizes-size-x-large);
}

.w--layout-small {
  width: var(--sizes-size-layout-small);
}

.w--layout-normal {
  width: var(--sizes-size-layout-normal);
}

.w--layout-x-large {
  width: var(--sizes-size-layout-x-large);
}

/* design-dimension-height */
.h--subtle {
  height: var(--sizes-size-subtle);
}

.h--smallest {
  height: var(--sizes-size-smallest);
}

.h--x-small {
  height: var(--sizes-size-x-small);
}

.h--small {
  height: var(--sizes-size-small);
}

.h--normal {
  height: var(--sizes-size-normal);
}

.h--large {
  height: var(--sizes-size-large);
}

.h--x-large {
  height: var(--sizes-size-x-large);
}

.h--layout-small {
  height: var(--sizes-size-layout-small);
}

.h--layout-normal {
  height: var(--sizes-size-layout-normal);
}

.h--layout-x-large {
  height: var(--sizes-size-layout-x-large);
}

/* dimension-helpers */
.w--auto {
  width: auto;
}

.w--none {
  width: 0;
}

.w--full {
  width: 100%;
}

.h--auto {
  height: auto;
}

.h--none {
  height: 0;
}

.h--full {
  height: 100%;
}

/* design-margin */
.m--subtle {
  margin: var(--sizes-size-subtle);
}

.m--smallest {
  margin: var(--sizes-size-smallest);
}

.m--x-small {
  margin: var(--sizes-size-x-small);
}

.m--small {
  margin: var(--sizes-size-small);
}

.m--normal {
  margin: var(--sizes-size-normal);
}

.m--large {
  margin: var(--sizes-size-large);
}

.m--x-large {
  margin: var(--sizes-size-x-large);
}

.m--layout-small {
  margin: var(--sizes-size-layout-small);
}

.m--layout-normal {
  margin: var(--sizes-size-layout-normal);
}

.m--layout-x-large {
  margin: var(--sizes-size-layout-x-large);
}

.mt--subtle {
  margin-top: var(--sizes-size-subtle);
}

.mt--smallest {
  margin-top: var(--sizes-size-smallest);
}

.mt--x-small {
  margin-top: var(--sizes-size-x-small);
}

.mt--small {
  margin-top: var(--sizes-size-small);
}

.mt--normal {
  margin-top: var(--sizes-size-normal);
}

.mt--large {
  margin-top: var(--sizes-size-large);
}

.mt--x-large {
  margin-top: var(--sizes-size-x-large);
}

.mt--layout-small {
  margin-top: var(--sizes-size-layout-small);
}

.mt--layout-normal {
  margin-top: var(--sizes-size-layout-normal);
}

.mt--layout-x-large {
  margin-top: var(--sizes-size-layout-x-large);
}

.mr--subtle {
  margin-right: var(--sizes-size-subtle);
}

.mr--smallest {
  margin-right: var(--sizes-size-smallest);
}

.mr--x-small {
  margin-right: var(--sizes-size-x-small);
}

.mr--small {
  margin-right: var(--sizes-size-small);
}

.mr--normal {
  margin-right: var(--sizes-size-normal);
}

.mr--large {
  margin-right: var(--sizes-size-large);
}

.mr--x-large {
  margin-right: var(--sizes-size-x-large);
}

.mr--layout-small {
  margin-right: var(--sizes-size-layout-small);
}

.mr--layout-normal {
  margin-right: var(--sizes-size-layout-normal);
}

.mr--layout-x-large {
  margin-right: var(--sizes-size-layout-x-large);
}

.mb--subtle {
  margin-bottom: var(--sizes-size-subtle);
}

.mb--smallest {
  margin-bottom: var(--sizes-size-smallest);
}

.mb--x-small {
  margin-bottom: var(--sizes-size-x-small);
}

.mb--small {
  margin-bottom: var(--sizes-size-small);
}

.mb--normal {
  margin-bottom: var(--sizes-size-normal);
}

.mb--large {
  margin-bottom: var(--sizes-size-large);
}

.mb--x-large {
  margin-bottom: var(--sizes-size-x-large);
}

.mb--layout-small {
  margin-bottom: var(--sizes-size-layout-small);
}

.mb--layout-normal {
  margin-bottom: var(--sizes-size-layout-normal);
}

.mb--layout-x-large {
  margin-bottom: var(--sizes-size-layout-x-large);
}

.ml--subtle {
  margin-left: var(--sizes-size-subtle);
}

.ml--smallest {
  margin-left: var(--sizes-size-smallest);
}

.ml--x-small {
  margin-left: var(--sizes-size-x-small);
}

.ml--small {
  margin-left: var(--sizes-size-small);
}

.ml--normal {
  margin-left: var(--sizes-size-normal);
}

.ml--large {
  margin-left: var(--sizes-size-large);
}

.ml--x-large {
  margin-left: var(--sizes-size-x-large);
}

.ml--layout-small {
  margin-left: var(--sizes-size-layout-small);
}

.ml--layout-normal {
  margin-left: var(--sizes-size-layout-normal);
}

.ml--layout-x-large {
  margin-left: var(--sizes-size-layout-x-large);
}

.mx--subtle {
  margin-left: var(--sizes-size-subtle);
  margin-right: var(--sizes-size-subtle);
}

.mx--smallest {
  margin-left: var(--sizes-size-smallest);
  margin-right: var(--sizes-size-smallest);
}

.mx--x-small {
  margin-left: var(--sizes-size-x-small);
  margin-right: var(--sizes-size-x-small);
}

.mx--small {
  margin-left: var(--sizes-size-small);
  margin-right: var(--sizes-size-small);
}

.mx--normal {
  margin-left: var(--sizes-size-normal);
  margin-right: var(--sizes-size-normal);
}

.mx--large {
  margin-left: var(--sizes-size-large);
  margin-right: var(--sizes-size-large);
}

.mx--x-large {
  margin-left: var(--sizes-size-x-large);
  margin-right: var(--sizes-size-x-large);
}

.mx--layout-small {
  margin-left: var(--sizes-size-layout-small);
  margin-right: var(--sizes-size-layout-small);
}

.mx--layout-normal {
  margin-left: var(--sizes-size-layout-normal);
  margin-right: var(--sizes-size-layout-normal);
}

.mx--layout-x-large {
  margin-left: var(--sizes-size-layout-x-large);
  margin-right: var(--sizes-size-layout-x-large);
}

.my--subtle {
  margin-top: var(--sizes-size-subtle);
  margin-bottom: var(--sizes-size-subtle);
}

.my--smallest {
  margin-top: var(--sizes-size-smallest);
  margin-bottom: var(--sizes-size-smallest);
}

.my--x-small {
  margin-top: var(--sizes-size-x-small);
  margin-bottom: var(--sizes-size-x-small);
}

.my--small {
  margin-top: var(--sizes-size-small);
  margin-bottom: var(--sizes-size-small);
}

.my--normal {
  margin-top: var(--sizes-size-normal);
  margin-bottom: var(--sizes-size-normal);
}

.my--large {
  margin-top: var(--sizes-size-large);
  margin-bottom: var(--sizes-size-large);
}

.my--x-large {
  margin-top: var(--sizes-size-x-large);
  margin-bottom: var(--sizes-size-x-large);
}

.my--layout-small {
  margin-top: var(--sizes-size-layout-small);
  margin-bottom: var(--sizes-size-layout-small);
}

.my--layout-normal {
  margin-top: var(--sizes-size-layout-normal);
  margin-bottom: var(--sizes-size-layout-normal);
}

.my--layout-x-large {
  margin-top: var(--sizes-size-layout-x-large);
  margin-bottom: var(--sizes-size-layout-x-large);
}

/* margin-helpers */
.m--auto {
  margin: auto;
}

.m--none {
  margin: 0;
}

.mt--auto {
  margin-top: auto;
}

.mt--none {
  margin-top: 0;
}

.mr--auto {
  margin-right: auto;
}

.mr--none {
  margin-right: 0;
}

.mb--auto {
  margin-bottom: auto;
}

.mb--none {
  margin-bottom: 0;
}

.ml--auto {
  margin-left: auto;
}

.ml--none {
  margin-left: 0;
}

.mx--auto {
  margin-left: auto;
  margin-right: auto;
}

.mx--none {
  margin-left: 0;
  margin-right: 0;
}

.my--auto {
  margin-top: auto;
  margin-bottom: auto;
}

.my--none {
  margin-top: 0;
  margin-bottom: 0;
}

/* design-padding */
.p--subtle {
  padding: var(--sizes-size-subtle);
}

.p--smallest {
  padding: var(--sizes-size-smallest);
}

.p--x-small {
  padding: var(--sizes-size-x-small);
}

.p--small {
  padding: var(--sizes-size-small);
}

.p--normal {
  padding: var(--sizes-size-normal);
}

.p--large {
  padding: var(--sizes-size-large);
}

.p--x-large {
  padding: var(--sizes-size-x-large);
}

.p--layout-small {
  padding: var(--sizes-size-layout-small);
}

.p--layout-normal {
  padding: var(--sizes-size-layout-normal);
}

.p--layout-x-large {
  padding: var(--sizes-size-layout-x-large);
}

.pt--subtle {
  padding-top: var(--sizes-size-subtle);
}

.pt--smallest {
  padding-top: var(--sizes-size-smallest);
}

.pt--x-small {
  padding-top: var(--sizes-size-x-small);
}

.pt--small {
  padding-top: var(--sizes-size-small);
}

.pt--normal {
  padding-top: var(--sizes-size-normal);
}

.pt--large {
  padding-top: var(--sizes-size-large);
}

.pt--x-large {
  padding-top: var(--sizes-size-x-large);
}

.pt--layout-small {
  padding-top: var(--sizes-size-layout-small);
}

.pt--layout-normal {
  padding-top: var(--sizes-size-layout-normal);
}

.pt--layout-x-large {
  padding-top: var(--sizes-size-layout-x-large);
}

.pr--subtle {
  padding-right: var(--sizes-size-subtle);
}

.pr--smallest {
  padding-right: var(--sizes-size-smallest);
}

.pr--x-small {
  padding-right: var(--sizes-size-x-small);
}

.pr--small {
  padding-right: var(--sizes-size-small);
}

.pr--normal {
  padding-right: var(--sizes-size-normal);
}

.pr--large {
  padding-right: var(--sizes-size-large);
}

.pr--x-large {
  padding-right: var(--sizes-size-x-large);
}

.pr--layout-small {
  padding-right: var(--sizes-size-layout-small);
}

.pr--layout-normal {
  padding-right: var(--sizes-size-layout-normal);
}

.pr--layout-x-large {
  padding-right: var(--sizes-size-layout-x-large);
}

.pb--subtle {
  padding-bottom: var(--sizes-size-subtle);
}

.pb--smallest {
  padding-bottom: var(--sizes-size-smallest);
}

.pb--x-small {
  padding-bottom: var(--sizes-size-x-small);
}

.pb--small {
  padding-bottom: var(--sizes-size-small);
}

.pb--normal {
  padding-bottom: var(--sizes-size-normal);
}

.pb--large {
  padding-bottom: var(--sizes-size-large);
}

.pb--x-large {
  padding-bottom: var(--sizes-size-x-large);
}

.pb--layout-small {
  padding-bottom: var(--sizes-size-layout-small);
}

.pb--layout-normal {
  padding-bottom: var(--sizes-size-layout-normal);
}

.pb--layout-x-large {
  padding-bottom: var(--sizes-size-layout-x-large);
}

.pl--subtle {
  padding-left: var(--sizes-size-subtle);
}

.pl--smallest {
  padding-left: var(--sizes-size-smallest);
}

.pl--x-small {
  padding-left: var(--sizes-size-x-small);
}

.pl--small {
  padding-left: var(--sizes-size-small);
}

.pl--normal {
  padding-left: var(--sizes-size-normal);
}

.pl--large {
  padding-left: var(--sizes-size-large);
}

.pl--x-large {
  padding-left: var(--sizes-size-x-large);
}

.pl--layout-small {
  padding-left: var(--sizes-size-layout-small);
}

.pl--layout-normal {
  padding-left: var(--sizes-size-layout-normal);
}

.pl--layout-x-large {
  padding-left: var(--sizes-size-layout-x-large);
}

.px--subtle {
  padding-left: var(--sizes-size-subtle);
  padding-right: var(--sizes-size-subtle);
}

.px--smallest {
  padding-left: var(--sizes-size-smallest);
  padding-right: var(--sizes-size-smallest);
}

.px--x-small {
  padding-left: var(--sizes-size-x-small);
  padding-right: var(--sizes-size-x-small);
}

.px--small {
  padding-left: var(--sizes-size-small);
  padding-right: var(--sizes-size-small);
}

.px--normal {
  padding-left: var(--sizes-size-normal);
  padding-right: var(--sizes-size-normal);
}

.px--large {
  padding-left: var(--sizes-size-large);
  padding-right: var(--sizes-size-large);
}

.px--x-large {
  padding-left: var(--sizes-size-x-large);
  padding-right: var(--sizes-size-x-large);
}

.px--layout-small {
  padding-left: var(--sizes-size-layout-small);
  padding-right: var(--sizes-size-layout-small);
}

.px--layout-normal {
  padding-left: var(--sizes-size-layout-normal);
  padding-right: var(--sizes-size-layout-normal);
}

.px--layout-x-large {
  padding-left: var(--sizes-size-layout-x-large);
  padding-right: var(--sizes-size-layout-x-large);
}

.py--subtle {
  padding-top: var(--sizes-size-subtle);
  padding-bottom: var(--sizes-size-subtle);
}

.py--smallest {
  padding-top: var(--sizes-size-smallest);
  padding-bottom: var(--sizes-size-smallest);
}

.py--x-small {
  padding-top: var(--sizes-size-x-small);
  padding-bottom: var(--sizes-size-x-small);
}

.py--small {
  padding-top: var(--sizes-size-small);
  padding-bottom: var(--sizes-size-small);
}

.py--normal {
  padding-top: var(--sizes-size-normal);
  padding-bottom: var(--sizes-size-normal);
}

.py--large {
  padding-top: var(--sizes-size-large);
  padding-bottom: var(--sizes-size-large);
}

.py--x-large {
  padding-top: var(--sizes-size-x-large);
  padding-bottom: var(--sizes-size-x-large);
}

.py--layout-small {
  padding-top: var(--sizes-size-layout-small);
  padding-bottom: var(--sizes-size-layout-small);
}

.py--layout-normal {
  padding-top: var(--sizes-size-layout-normal);
  padding-bottom: var(--sizes-size-layout-normal);
}

.py--layout-x-large {
  padding-top: var(--sizes-size-layout-x-large);
  padding-bottom: var(--sizes-size-layout-x-large);
}

/* padding-helpers */
.p--none {
  padding: 0;
}

.pt--none {
  padding-top: 0;
}

.pr--none {
  padding-right: 0;
}

.pb--none {
  padding-bottom: 0;
}

.pl--none {
  padding-left: 0;
}

.px--none {
  padding-left: 0;
  padding-right: 0;
}

.py--none {
  padding-top: 0;
  padding-bottom: 0;
}

/* design-padding-box */
.box--small {
  padding: var(--sizes-padding-small);
}

.box--normal {
  padding: var(--sizes-padding-normal);
}

.box--large {
  padding: var(--sizes-padding-large);
}

/* design-gap */
.gap--subtle {
  gap: var(--sizes-size-subtle);
}

.gap--smallest {
  gap: var(--sizes-size-smallest);
}

.gap--x-small {
  gap: var(--sizes-size-x-small);
}

.gap--small {
  gap: var(--sizes-size-small);
}

.gap--normal {
  gap: var(--sizes-size-normal);
}

.gap--large {
  gap: var(--sizes-size-large);
}

.gap--x-large {
  gap: var(--sizes-size-x-large);
}

.gap--layout-small {
  gap: var(--sizes-size-layout-small);
}

.gap--layout-normal {
  gap: var(--sizes-size-layout-normal);
}

.gap--layout-x-large {
  gap: var(--sizes-size-layout-x-large);
}

.gap-x--subtle {
  -moz-column-gap: var(--sizes-size-subtle);
       column-gap: var(--sizes-size-subtle);
}

.gap-x--smallest {
  -moz-column-gap: var(--sizes-size-smallest);
       column-gap: var(--sizes-size-smallest);
}

.gap-x--x-small {
  -moz-column-gap: var(--sizes-size-x-small);
       column-gap: var(--sizes-size-x-small);
}

.gap-x--small {
  -moz-column-gap: var(--sizes-size-small);
       column-gap: var(--sizes-size-small);
}

.gap-x--normal {
  -moz-column-gap: var(--sizes-size-normal);
       column-gap: var(--sizes-size-normal);
}

.gap-x--large {
  -moz-column-gap: var(--sizes-size-large);
       column-gap: var(--sizes-size-large);
}

.gap-x--x-large {
  -moz-column-gap: var(--sizes-size-x-large);
       column-gap: var(--sizes-size-x-large);
}

.gap-x--layout-small {
  -moz-column-gap: var(--sizes-size-layout-small);
       column-gap: var(--sizes-size-layout-small);
}

.gap-x--layout-normal {
  -moz-column-gap: var(--sizes-size-layout-normal);
       column-gap: var(--sizes-size-layout-normal);
}

.gap-x--layout-x-large {
  -moz-column-gap: var(--sizes-size-layout-x-large);
       column-gap: var(--sizes-size-layout-x-large);
}

.gap-y--subtle {
  row-gap: var(--sizes-size-subtle);
}

.gap-y--smallest {
  row-gap: var(--sizes-size-smallest);
}

.gap-y--x-small {
  row-gap: var(--sizes-size-x-small);
}

.gap-y--small {
  row-gap: var(--sizes-size-small);
}

.gap-y--normal {
  row-gap: var(--sizes-size-normal);
}

.gap-y--large {
  row-gap: var(--sizes-size-large);
}

.gap-y--x-large {
  row-gap: var(--sizes-size-x-large);
}

.gap-y--layout-small {
  row-gap: var(--sizes-size-layout-small);
}

.gap-y--layout-normal {
  row-gap: var(--sizes-size-layout-normal);
}

.gap-y--layout-x-large {
  row-gap: var(--sizes-size-layout-x-large);
}

/* gap-helpers */
.gap--none {
  gap: 0;
}

.gap-x--none {
  -moz-column-gap: 0;
       column-gap: 0;
}

.gap-y--none {
  row-gap: 0;
}

@media (min-width: 720px) {
  /* display-important @ sm */
  .sm\:none {
    display: none;
  }
  .sm\:none\! {
    display: none !important;
  }
  .sm\:block {
    display: block;
  }
  .sm\:block\! {
    display: block !important;
  }
  .sm\:inline-block {
    display: inline-block;
  }
  .sm\:inline-block\! {
    display: inline-block !important;
  }
  .sm\:inline {
    display: inline;
  }
  .sm\:inline\! {
    display: inline !important;
  }
  /* text @ sm */
  .sm\:text-align--center {
    text-align: center;
  }
  .sm\:text-align--left {
    text-align: left;
  }
  .sm\:text-align--right {
    text-align: right;
  }
  .sm\:text-align--justify {
    text-align: text;
  }
  /* flex-direction @ sm */
  .sm\:direction--row {
    flex-direction: row;
  }
  .sm\:direction--row-reverse {
    flex-direction: row-reverse;
  }
  .sm\:direction--col {
    flex-direction: column;
  }
  .sm\:direction--col-reverse {
    flex-direction: column-reverse;
  }
  /* justify-content @ sm */
  .sm\:justify--start {
    justify-content: flex-start;
  }
  .sm\:justify--end {
    justify-content: flex-end;
  }
  .sm\:justify--center {
    justify-content: center;
  }
  .sm\:justify--between {
    justify-content: space-between;
  }
  .sm\:justify--around {
    justify-content: space-around;
  }
  .sm\:justify--evenly {
    justify-content: space-evenly;
  }
  /* align-items @ sm */
  .sm\:align--stretch {
    align-items: stretch;
  }
  .sm\:align--start {
    align-items: flex-start;
  }
  .sm\:align--center {
    align-items: center;
  }
  .sm\:align--end {
    align-items: flex-end;
  }
  .sm\:align--baseline {
    align-items: baseline;
  }
  /* design-margin @ sm */
  .sm\:m--subtle {
    margin: var(--sizes-size-subtle);
  }
  .sm\:m--smallest {
    margin: var(--sizes-size-smallest);
  }
  .sm\:m--x-small {
    margin: var(--sizes-size-x-small);
  }
  .sm\:m--small {
    margin: var(--sizes-size-small);
  }
  .sm\:m--normal {
    margin: var(--sizes-size-normal);
  }
  .sm\:m--large {
    margin: var(--sizes-size-large);
  }
  .sm\:m--x-large {
    margin: var(--sizes-size-x-large);
  }
  .sm\:m--layout-small {
    margin: var(--sizes-size-layout-small);
  }
  .sm\:m--layout-normal {
    margin: var(--sizes-size-layout-normal);
  }
  .sm\:m--layout-x-large {
    margin: var(--sizes-size-layout-x-large);
  }
  .sm\:mt--subtle {
    margin-top: var(--sizes-size-subtle);
  }
  .sm\:mt--smallest {
    margin-top: var(--sizes-size-smallest);
  }
  .sm\:mt--x-small {
    margin-top: var(--sizes-size-x-small);
  }
  .sm\:mt--small {
    margin-top: var(--sizes-size-small);
  }
  .sm\:mt--normal {
    margin-top: var(--sizes-size-normal);
  }
  .sm\:mt--large {
    margin-top: var(--sizes-size-large);
  }
  .sm\:mt--x-large {
    margin-top: var(--sizes-size-x-large);
  }
  .sm\:mt--layout-small {
    margin-top: var(--sizes-size-layout-small);
  }
  .sm\:mt--layout-normal {
    margin-top: var(--sizes-size-layout-normal);
  }
  .sm\:mt--layout-x-large {
    margin-top: var(--sizes-size-layout-x-large);
  }
  .sm\:mr--subtle {
    margin-right: var(--sizes-size-subtle);
  }
  .sm\:mr--smallest {
    margin-right: var(--sizes-size-smallest);
  }
  .sm\:mr--x-small {
    margin-right: var(--sizes-size-x-small);
  }
  .sm\:mr--small {
    margin-right: var(--sizes-size-small);
  }
  .sm\:mr--normal {
    margin-right: var(--sizes-size-normal);
  }
  .sm\:mr--large {
    margin-right: var(--sizes-size-large);
  }
  .sm\:mr--x-large {
    margin-right: var(--sizes-size-x-large);
  }
  .sm\:mr--layout-small {
    margin-right: var(--sizes-size-layout-small);
  }
  .sm\:mr--layout-normal {
    margin-right: var(--sizes-size-layout-normal);
  }
  .sm\:mr--layout-x-large {
    margin-right: var(--sizes-size-layout-x-large);
  }
  .sm\:mb--subtle {
    margin-bottom: var(--sizes-size-subtle);
  }
  .sm\:mb--smallest {
    margin-bottom: var(--sizes-size-smallest);
  }
  .sm\:mb--x-small {
    margin-bottom: var(--sizes-size-x-small);
  }
  .sm\:mb--small {
    margin-bottom: var(--sizes-size-small);
  }
  .sm\:mb--normal {
    margin-bottom: var(--sizes-size-normal);
  }
  .sm\:mb--large {
    margin-bottom: var(--sizes-size-large);
  }
  .sm\:mb--x-large {
    margin-bottom: var(--sizes-size-x-large);
  }
  .sm\:mb--layout-small {
    margin-bottom: var(--sizes-size-layout-small);
  }
  .sm\:mb--layout-normal {
    margin-bottom: var(--sizes-size-layout-normal);
  }
  .sm\:mb--layout-x-large {
    margin-bottom: var(--sizes-size-layout-x-large);
  }
  .sm\:ml--subtle {
    margin-left: var(--sizes-size-subtle);
  }
  .sm\:ml--smallest {
    margin-left: var(--sizes-size-smallest);
  }
  .sm\:ml--x-small {
    margin-left: var(--sizes-size-x-small);
  }
  .sm\:ml--small {
    margin-left: var(--sizes-size-small);
  }
  .sm\:ml--normal {
    margin-left: var(--sizes-size-normal);
  }
  .sm\:ml--large {
    margin-left: var(--sizes-size-large);
  }
  .sm\:ml--x-large {
    margin-left: var(--sizes-size-x-large);
  }
  .sm\:ml--layout-small {
    margin-left: var(--sizes-size-layout-small);
  }
  .sm\:ml--layout-normal {
    margin-left: var(--sizes-size-layout-normal);
  }
  .sm\:ml--layout-x-large {
    margin-left: var(--sizes-size-layout-x-large);
  }
  .sm\:mx--subtle {
    margin-left: var(--sizes-size-subtle);
    margin-right: var(--sizes-size-subtle);
  }
  .sm\:mx--smallest {
    margin-left: var(--sizes-size-smallest);
    margin-right: var(--sizes-size-smallest);
  }
  .sm\:mx--x-small {
    margin-left: var(--sizes-size-x-small);
    margin-right: var(--sizes-size-x-small);
  }
  .sm\:mx--small {
    margin-left: var(--sizes-size-small);
    margin-right: var(--sizes-size-small);
  }
  .sm\:mx--normal {
    margin-left: var(--sizes-size-normal);
    margin-right: var(--sizes-size-normal);
  }
  .sm\:mx--large {
    margin-left: var(--sizes-size-large);
    margin-right: var(--sizes-size-large);
  }
  .sm\:mx--x-large {
    margin-left: var(--sizes-size-x-large);
    margin-right: var(--sizes-size-x-large);
  }
  .sm\:mx--layout-small {
    margin-left: var(--sizes-size-layout-small);
    margin-right: var(--sizes-size-layout-small);
  }
  .sm\:mx--layout-normal {
    margin-left: var(--sizes-size-layout-normal);
    margin-right: var(--sizes-size-layout-normal);
  }
  .sm\:mx--layout-x-large {
    margin-left: var(--sizes-size-layout-x-large);
    margin-right: var(--sizes-size-layout-x-large);
  }
  .sm\:my--subtle {
    margin-top: var(--sizes-size-subtle);
    margin-bottom: var(--sizes-size-subtle);
  }
  .sm\:my--smallest {
    margin-top: var(--sizes-size-smallest);
    margin-bottom: var(--sizes-size-smallest);
  }
  .sm\:my--x-small {
    margin-top: var(--sizes-size-x-small);
    margin-bottom: var(--sizes-size-x-small);
  }
  .sm\:my--small {
    margin-top: var(--sizes-size-small);
    margin-bottom: var(--sizes-size-small);
  }
  .sm\:my--normal {
    margin-top: var(--sizes-size-normal);
    margin-bottom: var(--sizes-size-normal);
  }
  .sm\:my--large {
    margin-top: var(--sizes-size-large);
    margin-bottom: var(--sizes-size-large);
  }
  .sm\:my--x-large {
    margin-top: var(--sizes-size-x-large);
    margin-bottom: var(--sizes-size-x-large);
  }
  .sm\:my--layout-small {
    margin-top: var(--sizes-size-layout-small);
    margin-bottom: var(--sizes-size-layout-small);
  }
  .sm\:my--layout-normal {
    margin-top: var(--sizes-size-layout-normal);
    margin-bottom: var(--sizes-size-layout-normal);
  }
  .sm\:my--layout-x-large {
    margin-top: var(--sizes-size-layout-x-large);
    margin-bottom: var(--sizes-size-layout-x-large);
  }
  /* margin-helpers @ sm */
  .sm\:m--auto {
    margin: auto;
  }
  .sm\:m--none {
    margin: 0;
  }
  .sm\:mt--auto {
    margin-top: auto;
  }
  .sm\:mt--none {
    margin-top: 0;
  }
  .sm\:mr--auto {
    margin-right: auto;
  }
  .sm\:mr--none {
    margin-right: 0;
  }
  .sm\:mb--auto {
    margin-bottom: auto;
  }
  .sm\:mb--none {
    margin-bottom: 0;
  }
  .sm\:ml--auto {
    margin-left: auto;
  }
  .sm\:ml--none {
    margin-left: 0;
  }
  .sm\:mx--auto {
    margin-left: auto;
    margin-right: auto;
  }
  .sm\:mx--none {
    margin-left: 0;
    margin-right: 0;
  }
  .sm\:my--auto {
    margin-top: auto;
    margin-bottom: auto;
  }
  .sm\:my--none {
    margin-top: 0;
    margin-bottom: 0;
  }
}
@media (min-width: 1020px) {
  /* display-important @ md */
  .md\:none {
    display: none;
  }
  .md\:none\! {
    display: none !important;
  }
  .md\:block {
    display: block;
  }
  .md\:block\! {
    display: block !important;
  }
  .md\:inline-block {
    display: inline-block;
  }
  .md\:inline-block\! {
    display: inline-block !important;
  }
  .md\:inline {
    display: inline;
  }
  .md\:inline\! {
    display: inline !important;
  }
  /* text @ md */
  .md\:text-align--center {
    text-align: center;
  }
  .md\:text-align--left {
    text-align: left;
  }
  .md\:text-align--right {
    text-align: right;
  }
  .md\:text-align--justify {
    text-align: text;
  }
  /* flex-direction @ md */
  .md\:direction--row {
    flex-direction: row;
  }
  .md\:direction--row-reverse {
    flex-direction: row-reverse;
  }
  .md\:direction--col {
    flex-direction: column;
  }
  .md\:direction--col-reverse {
    flex-direction: column-reverse;
  }
  /* justify-content @ md */
  .md\:justify--start {
    justify-content: flex-start;
  }
  .md\:justify--end {
    justify-content: flex-end;
  }
  .md\:justify--center {
    justify-content: center;
  }
  .md\:justify--between {
    justify-content: space-between;
  }
  .md\:justify--around {
    justify-content: space-around;
  }
  .md\:justify--evenly {
    justify-content: space-evenly;
  }
  /* align-items @ md */
  .md\:align--stretch {
    align-items: stretch;
  }
  .md\:align--start {
    align-items: flex-start;
  }
  .md\:align--center {
    align-items: center;
  }
  .md\:align--end {
    align-items: flex-end;
  }
  .md\:align--baseline {
    align-items: baseline;
  }
  /* design-dimension-width @ md */
  .md\:w--subtle {
    width: var(--sizes-size-subtle);
  }
  .md\:w--smallest {
    width: var(--sizes-size-smallest);
  }
  .md\:w--x-small {
    width: var(--sizes-size-x-small);
  }
  .md\:w--small {
    width: var(--sizes-size-small);
  }
  .md\:w--normal {
    width: var(--sizes-size-normal);
  }
  .md\:w--large {
    width: var(--sizes-size-large);
  }
  .md\:w--x-large {
    width: var(--sizes-size-x-large);
  }
  .md\:w--layout-small {
    width: var(--sizes-size-layout-small);
  }
  .md\:w--layout-normal {
    width: var(--sizes-size-layout-normal);
  }
  .md\:w--layout-x-large {
    width: var(--sizes-size-layout-x-large);
  }
  /* design-dimension-height @ md */
  .md\:h--subtle {
    height: var(--sizes-size-subtle);
  }
  .md\:h--smallest {
    height: var(--sizes-size-smallest);
  }
  .md\:h--x-small {
    height: var(--sizes-size-x-small);
  }
  .md\:h--small {
    height: var(--sizes-size-small);
  }
  .md\:h--normal {
    height: var(--sizes-size-normal);
  }
  .md\:h--large {
    height: var(--sizes-size-large);
  }
  .md\:h--x-large {
    height: var(--sizes-size-x-large);
  }
  .md\:h--layout-small {
    height: var(--sizes-size-layout-small);
  }
  .md\:h--layout-normal {
    height: var(--sizes-size-layout-normal);
  }
  .md\:h--layout-x-large {
    height: var(--sizes-size-layout-x-large);
  }
  /* dimension-helpers @ md */
  .md\:w--auto {
    width: auto;
  }
  .md\:w--none {
    width: 0;
  }
  .md\:w--full {
    width: 100%;
  }
  .md\:h--auto {
    height: auto;
  }
  .md\:h--none {
    height: 0;
  }
  .md\:h--full {
    height: 100%;
  }
  /* design-margin @ md */
  .md\:m--subtle {
    margin: var(--sizes-size-subtle);
  }
  .md\:m--smallest {
    margin: var(--sizes-size-smallest);
  }
  .md\:m--x-small {
    margin: var(--sizes-size-x-small);
  }
  .md\:m--small {
    margin: var(--sizes-size-small);
  }
  .md\:m--normal {
    margin: var(--sizes-size-normal);
  }
  .md\:m--large {
    margin: var(--sizes-size-large);
  }
  .md\:m--x-large {
    margin: var(--sizes-size-x-large);
  }
  .md\:m--layout-small {
    margin: var(--sizes-size-layout-small);
  }
  .md\:m--layout-normal {
    margin: var(--sizes-size-layout-normal);
  }
  .md\:m--layout-x-large {
    margin: var(--sizes-size-layout-x-large);
  }
  .md\:mt--subtle {
    margin-top: var(--sizes-size-subtle);
  }
  .md\:mt--smallest {
    margin-top: var(--sizes-size-smallest);
  }
  .md\:mt--x-small {
    margin-top: var(--sizes-size-x-small);
  }
  .md\:mt--small {
    margin-top: var(--sizes-size-small);
  }
  .md\:mt--normal {
    margin-top: var(--sizes-size-normal);
  }
  .md\:mt--large {
    margin-top: var(--sizes-size-large);
  }
  .md\:mt--x-large {
    margin-top: var(--sizes-size-x-large);
  }
  .md\:mt--layout-small {
    margin-top: var(--sizes-size-layout-small);
  }
  .md\:mt--layout-normal {
    margin-top: var(--sizes-size-layout-normal);
  }
  .md\:mt--layout-x-large {
    margin-top: var(--sizes-size-layout-x-large);
  }
  .md\:mr--subtle {
    margin-right: var(--sizes-size-subtle);
  }
  .md\:mr--smallest {
    margin-right: var(--sizes-size-smallest);
  }
  .md\:mr--x-small {
    margin-right: var(--sizes-size-x-small);
  }
  .md\:mr--small {
    margin-right: var(--sizes-size-small);
  }
  .md\:mr--normal {
    margin-right: var(--sizes-size-normal);
  }
  .md\:mr--large {
    margin-right: var(--sizes-size-large);
  }
  .md\:mr--x-large {
    margin-right: var(--sizes-size-x-large);
  }
  .md\:mr--layout-small {
    margin-right: var(--sizes-size-layout-small);
  }
  .md\:mr--layout-normal {
    margin-right: var(--sizes-size-layout-normal);
  }
  .md\:mr--layout-x-large {
    margin-right: var(--sizes-size-layout-x-large);
  }
  .md\:mb--subtle {
    margin-bottom: var(--sizes-size-subtle);
  }
  .md\:mb--smallest {
    margin-bottom: var(--sizes-size-smallest);
  }
  .md\:mb--x-small {
    margin-bottom: var(--sizes-size-x-small);
  }
  .md\:mb--small {
    margin-bottom: var(--sizes-size-small);
  }
  .md\:mb--normal {
    margin-bottom: var(--sizes-size-normal);
  }
  .md\:mb--large {
    margin-bottom: var(--sizes-size-large);
  }
  .md\:mb--x-large {
    margin-bottom: var(--sizes-size-x-large);
  }
  .md\:mb--layout-small {
    margin-bottom: var(--sizes-size-layout-small);
  }
  .md\:mb--layout-normal {
    margin-bottom: var(--sizes-size-layout-normal);
  }
  .md\:mb--layout-x-large {
    margin-bottom: var(--sizes-size-layout-x-large);
  }
  .md\:ml--subtle {
    margin-left: var(--sizes-size-subtle);
  }
  .md\:ml--smallest {
    margin-left: var(--sizes-size-smallest);
  }
  .md\:ml--x-small {
    margin-left: var(--sizes-size-x-small);
  }
  .md\:ml--small {
    margin-left: var(--sizes-size-small);
  }
  .md\:ml--normal {
    margin-left: var(--sizes-size-normal);
  }
  .md\:ml--large {
    margin-left: var(--sizes-size-large);
  }
  .md\:ml--x-large {
    margin-left: var(--sizes-size-x-large);
  }
  .md\:ml--layout-small {
    margin-left: var(--sizes-size-layout-small);
  }
  .md\:ml--layout-normal {
    margin-left: var(--sizes-size-layout-normal);
  }
  .md\:ml--layout-x-large {
    margin-left: var(--sizes-size-layout-x-large);
  }
  .md\:mx--subtle {
    margin-left: var(--sizes-size-subtle);
    margin-right: var(--sizes-size-subtle);
  }
  .md\:mx--smallest {
    margin-left: var(--sizes-size-smallest);
    margin-right: var(--sizes-size-smallest);
  }
  .md\:mx--x-small {
    margin-left: var(--sizes-size-x-small);
    margin-right: var(--sizes-size-x-small);
  }
  .md\:mx--small {
    margin-left: var(--sizes-size-small);
    margin-right: var(--sizes-size-small);
  }
  .md\:mx--normal {
    margin-left: var(--sizes-size-normal);
    margin-right: var(--sizes-size-normal);
  }
  .md\:mx--large {
    margin-left: var(--sizes-size-large);
    margin-right: var(--sizes-size-large);
  }
  .md\:mx--x-large {
    margin-left: var(--sizes-size-x-large);
    margin-right: var(--sizes-size-x-large);
  }
  .md\:mx--layout-small {
    margin-left: var(--sizes-size-layout-small);
    margin-right: var(--sizes-size-layout-small);
  }
  .md\:mx--layout-normal {
    margin-left: var(--sizes-size-layout-normal);
    margin-right: var(--sizes-size-layout-normal);
  }
  .md\:mx--layout-x-large {
    margin-left: var(--sizes-size-layout-x-large);
    margin-right: var(--sizes-size-layout-x-large);
  }
  .md\:my--subtle {
    margin-top: var(--sizes-size-subtle);
    margin-bottom: var(--sizes-size-subtle);
  }
  .md\:my--smallest {
    margin-top: var(--sizes-size-smallest);
    margin-bottom: var(--sizes-size-smallest);
  }
  .md\:my--x-small {
    margin-top: var(--sizes-size-x-small);
    margin-bottom: var(--sizes-size-x-small);
  }
  .md\:my--small {
    margin-top: var(--sizes-size-small);
    margin-bottom: var(--sizes-size-small);
  }
  .md\:my--normal {
    margin-top: var(--sizes-size-normal);
    margin-bottom: var(--sizes-size-normal);
  }
  .md\:my--large {
    margin-top: var(--sizes-size-large);
    margin-bottom: var(--sizes-size-large);
  }
  .md\:my--x-large {
    margin-top: var(--sizes-size-x-large);
    margin-bottom: var(--sizes-size-x-large);
  }
  .md\:my--layout-small {
    margin-top: var(--sizes-size-layout-small);
    margin-bottom: var(--sizes-size-layout-small);
  }
  .md\:my--layout-normal {
    margin-top: var(--sizes-size-layout-normal);
    margin-bottom: var(--sizes-size-layout-normal);
  }
  .md\:my--layout-x-large {
    margin-top: var(--sizes-size-layout-x-large);
    margin-bottom: var(--sizes-size-layout-x-large);
  }
  /* margin-helpers @ md */
  .md\:m--auto {
    margin: auto;
  }
  .md\:m--none {
    margin: 0;
  }
  .md\:mt--auto {
    margin-top: auto;
  }
  .md\:mt--none {
    margin-top: 0;
  }
  .md\:mr--auto {
    margin-right: auto;
  }
  .md\:mr--none {
    margin-right: 0;
  }
  .md\:mb--auto {
    margin-bottom: auto;
  }
  .md\:mb--none {
    margin-bottom: 0;
  }
  .md\:ml--auto {
    margin-left: auto;
  }
  .md\:ml--none {
    margin-left: 0;
  }
  .md\:mx--auto {
    margin-left: auto;
    margin-right: auto;
  }
  .md\:mx--none {
    margin-left: 0;
    margin-right: 0;
  }
  .md\:my--auto {
    margin-top: auto;
    margin-bottom: auto;
  }
  .md\:my--none {
    margin-top: 0;
    margin-bottom: 0;
  }
  /* design-padding @ md */
  .md\:p--subtle {
    padding: var(--sizes-size-subtle);
  }
  .md\:p--smallest {
    padding: var(--sizes-size-smallest);
  }
  .md\:p--x-small {
    padding: var(--sizes-size-x-small);
  }
  .md\:p--small {
    padding: var(--sizes-size-small);
  }
  .md\:p--normal {
    padding: var(--sizes-size-normal);
  }
  .md\:p--large {
    padding: var(--sizes-size-large);
  }
  .md\:p--x-large {
    padding: var(--sizes-size-x-large);
  }
  .md\:p--layout-small {
    padding: var(--sizes-size-layout-small);
  }
  .md\:p--layout-normal {
    padding: var(--sizes-size-layout-normal);
  }
  .md\:p--layout-x-large {
    padding: var(--sizes-size-layout-x-large);
  }
  .md\:pt--subtle {
    padding-top: var(--sizes-size-subtle);
  }
  .md\:pt--smallest {
    padding-top: var(--sizes-size-smallest);
  }
  .md\:pt--x-small {
    padding-top: var(--sizes-size-x-small);
  }
  .md\:pt--small {
    padding-top: var(--sizes-size-small);
  }
  .md\:pt--normal {
    padding-top: var(--sizes-size-normal);
  }
  .md\:pt--large {
    padding-top: var(--sizes-size-large);
  }
  .md\:pt--x-large {
    padding-top: var(--sizes-size-x-large);
  }
  .md\:pt--layout-small {
    padding-top: var(--sizes-size-layout-small);
  }
  .md\:pt--layout-normal {
    padding-top: var(--sizes-size-layout-normal);
  }
  .md\:pt--layout-x-large {
    padding-top: var(--sizes-size-layout-x-large);
  }
  .md\:pr--subtle {
    padding-right: var(--sizes-size-subtle);
  }
  .md\:pr--smallest {
    padding-right: var(--sizes-size-smallest);
  }
  .md\:pr--x-small {
    padding-right: var(--sizes-size-x-small);
  }
  .md\:pr--small {
    padding-right: var(--sizes-size-small);
  }
  .md\:pr--normal {
    padding-right: var(--sizes-size-normal);
  }
  .md\:pr--large {
    padding-right: var(--sizes-size-large);
  }
  .md\:pr--x-large {
    padding-right: var(--sizes-size-x-large);
  }
  .md\:pr--layout-small {
    padding-right: var(--sizes-size-layout-small);
  }
  .md\:pr--layout-normal {
    padding-right: var(--sizes-size-layout-normal);
  }
  .md\:pr--layout-x-large {
    padding-right: var(--sizes-size-layout-x-large);
  }
  .md\:pb--subtle {
    padding-bottom: var(--sizes-size-subtle);
  }
  .md\:pb--smallest {
    padding-bottom: var(--sizes-size-smallest);
  }
  .md\:pb--x-small {
    padding-bottom: var(--sizes-size-x-small);
  }
  .md\:pb--small {
    padding-bottom: var(--sizes-size-small);
  }
  .md\:pb--normal {
    padding-bottom: var(--sizes-size-normal);
  }
  .md\:pb--large {
    padding-bottom: var(--sizes-size-large);
  }
  .md\:pb--x-large {
    padding-bottom: var(--sizes-size-x-large);
  }
  .md\:pb--layout-small {
    padding-bottom: var(--sizes-size-layout-small);
  }
  .md\:pb--layout-normal {
    padding-bottom: var(--sizes-size-layout-normal);
  }
  .md\:pb--layout-x-large {
    padding-bottom: var(--sizes-size-layout-x-large);
  }
  .md\:pl--subtle {
    padding-left: var(--sizes-size-subtle);
  }
  .md\:pl--smallest {
    padding-left: var(--sizes-size-smallest);
  }
  .md\:pl--x-small {
    padding-left: var(--sizes-size-x-small);
  }
  .md\:pl--small {
    padding-left: var(--sizes-size-small);
  }
  .md\:pl--normal {
    padding-left: var(--sizes-size-normal);
  }
  .md\:pl--large {
    padding-left: var(--sizes-size-large);
  }
  .md\:pl--x-large {
    padding-left: var(--sizes-size-x-large);
  }
  .md\:pl--layout-small {
    padding-left: var(--sizes-size-layout-small);
  }
  .md\:pl--layout-normal {
    padding-left: var(--sizes-size-layout-normal);
  }
  .md\:pl--layout-x-large {
    padding-left: var(--sizes-size-layout-x-large);
  }
  .md\:px--subtle {
    padding-left: var(--sizes-size-subtle);
    padding-right: var(--sizes-size-subtle);
  }
  .md\:px--smallest {
    padding-left: var(--sizes-size-smallest);
    padding-right: var(--sizes-size-smallest);
  }
  .md\:px--x-small {
    padding-left: var(--sizes-size-x-small);
    padding-right: var(--sizes-size-x-small);
  }
  .md\:px--small {
    padding-left: var(--sizes-size-small);
    padding-right: var(--sizes-size-small);
  }
  .md\:px--normal {
    padding-left: var(--sizes-size-normal);
    padding-right: var(--sizes-size-normal);
  }
  .md\:px--large {
    padding-left: var(--sizes-size-large);
    padding-right: var(--sizes-size-large);
  }
  .md\:px--x-large {
    padding-left: var(--sizes-size-x-large);
    padding-right: var(--sizes-size-x-large);
  }
  .md\:px--layout-small {
    padding-left: var(--sizes-size-layout-small);
    padding-right: var(--sizes-size-layout-small);
  }
  .md\:px--layout-normal {
    padding-left: var(--sizes-size-layout-normal);
    padding-right: var(--sizes-size-layout-normal);
  }
  .md\:px--layout-x-large {
    padding-left: var(--sizes-size-layout-x-large);
    padding-right: var(--sizes-size-layout-x-large);
  }
  .md\:py--subtle {
    padding-top: var(--sizes-size-subtle);
    padding-bottom: var(--sizes-size-subtle);
  }
  .md\:py--smallest {
    padding-top: var(--sizes-size-smallest);
    padding-bottom: var(--sizes-size-smallest);
  }
  .md\:py--x-small {
    padding-top: var(--sizes-size-x-small);
    padding-bottom: var(--sizes-size-x-small);
  }
  .md\:py--small {
    padding-top: var(--sizes-size-small);
    padding-bottom: var(--sizes-size-small);
  }
  .md\:py--normal {
    padding-top: var(--sizes-size-normal);
    padding-bottom: var(--sizes-size-normal);
  }
  .md\:py--large {
    padding-top: var(--sizes-size-large);
    padding-bottom: var(--sizes-size-large);
  }
  .md\:py--x-large {
    padding-top: var(--sizes-size-x-large);
    padding-bottom: var(--sizes-size-x-large);
  }
  .md\:py--layout-small {
    padding-top: var(--sizes-size-layout-small);
    padding-bottom: var(--sizes-size-layout-small);
  }
  .md\:py--layout-normal {
    padding-top: var(--sizes-size-layout-normal);
    padding-bottom: var(--sizes-size-layout-normal);
  }
  .md\:py--layout-x-large {
    padding-top: var(--sizes-size-layout-x-large);
    padding-bottom: var(--sizes-size-layout-x-large);
  }
  /* padding-helpers @ md */
  .md\:p--none {
    padding: 0;
  }
  .md\:pt--none {
    padding-top: 0;
  }
  .md\:pr--none {
    padding-right: 0;
  }
  .md\:pb--none {
    padding-bottom: 0;
  }
  .md\:pl--none {
    padding-left: 0;
  }
  .md\:px--none {
    padding-left: 0;
    padding-right: 0;
  }
  .md\:py--none {
    padding-top: 0;
    padding-bottom: 0;
  }
  /* design-padding-box @ md */
  .md\:box--small {
    padding: var(--sizes-padding-small);
  }
  .md\:box--normal {
    padding: var(--sizes-padding-normal);
  }
  .md\:box--large {
    padding: var(--sizes-padding-large);
  }
  /* design-gap @ md */
  .md\:gap--subtle {
    gap: var(--sizes-size-subtle);
  }
  .md\:gap--smallest {
    gap: var(--sizes-size-smallest);
  }
  .md\:gap--x-small {
    gap: var(--sizes-size-x-small);
  }
  .md\:gap--small {
    gap: var(--sizes-size-small);
  }
  .md\:gap--normal {
    gap: var(--sizes-size-normal);
  }
  .md\:gap--large {
    gap: var(--sizes-size-large);
  }
  .md\:gap--x-large {
    gap: var(--sizes-size-x-large);
  }
  .md\:gap--layout-small {
    gap: var(--sizes-size-layout-small);
  }
  .md\:gap--layout-normal {
    gap: var(--sizes-size-layout-normal);
  }
  .md\:gap--layout-x-large {
    gap: var(--sizes-size-layout-x-large);
  }
  .md\:gap-x--subtle {
    -moz-column-gap: var(--sizes-size-subtle);
         column-gap: var(--sizes-size-subtle);
  }
  .md\:gap-x--smallest {
    -moz-column-gap: var(--sizes-size-smallest);
         column-gap: var(--sizes-size-smallest);
  }
  .md\:gap-x--x-small {
    -moz-column-gap: var(--sizes-size-x-small);
         column-gap: var(--sizes-size-x-small);
  }
  .md\:gap-x--small {
    -moz-column-gap: var(--sizes-size-small);
         column-gap: var(--sizes-size-small);
  }
  .md\:gap-x--normal {
    -moz-column-gap: var(--sizes-size-normal);
         column-gap: var(--sizes-size-normal);
  }
  .md\:gap-x--large {
    -moz-column-gap: var(--sizes-size-large);
         column-gap: var(--sizes-size-large);
  }
  .md\:gap-x--x-large {
    -moz-column-gap: var(--sizes-size-x-large);
         column-gap: var(--sizes-size-x-large);
  }
  .md\:gap-x--layout-small {
    -moz-column-gap: var(--sizes-size-layout-small);
         column-gap: var(--sizes-size-layout-small);
  }
  .md\:gap-x--layout-normal {
    -moz-column-gap: var(--sizes-size-layout-normal);
         column-gap: var(--sizes-size-layout-normal);
  }
  .md\:gap-x--layout-x-large {
    -moz-column-gap: var(--sizes-size-layout-x-large);
         column-gap: var(--sizes-size-layout-x-large);
  }
  .md\:gap-y--subtle {
    row-gap: var(--sizes-size-subtle);
  }
  .md\:gap-y--smallest {
    row-gap: var(--sizes-size-smallest);
  }
  .md\:gap-y--x-small {
    row-gap: var(--sizes-size-x-small);
  }
  .md\:gap-y--small {
    row-gap: var(--sizes-size-small);
  }
  .md\:gap-y--normal {
    row-gap: var(--sizes-size-normal);
  }
  .md\:gap-y--large {
    row-gap: var(--sizes-size-large);
  }
  .md\:gap-y--x-large {
    row-gap: var(--sizes-size-x-large);
  }
  .md\:gap-y--layout-small {
    row-gap: var(--sizes-size-layout-small);
  }
  .md\:gap-y--layout-normal {
    row-gap: var(--sizes-size-layout-normal);
  }
  .md\:gap-y--layout-x-large {
    row-gap: var(--sizes-size-layout-x-large);
  }
  /* gap-helpers @ md */
  .md\:gap--none {
    gap: 0;
  }
  .md\:gap-x--none {
    -moz-column-gap: 0;
         column-gap: 0;
  }
  .md\:gap-y--none {
    row-gap: 0;
  }
}
@media (min-width: 1280px) {
  /* display-important @ lg */
  .lg\:none {
    display: none;
  }
  .lg\:none\! {
    display: none !important;
  }
  .lg\:block {
    display: block;
  }
  .lg\:block\! {
    display: block !important;
  }
  .lg\:inline-block {
    display: inline-block;
  }
  .lg\:inline-block\! {
    display: inline-block !important;
  }
  .lg\:inline {
    display: inline;
  }
  .lg\:inline\! {
    display: inline !important;
  }
  /* text @ lg */
  .lg\:text-align--center {
    text-align: center;
  }
  .lg\:text-align--left {
    text-align: left;
  }
  .lg\:text-align--right {
    text-align: right;
  }
  .lg\:text-align--justify {
    text-align: text;
  }
  /* flex-direction @ lg */
  .lg\:direction--row {
    flex-direction: row;
  }
  .lg\:direction--row-reverse {
    flex-direction: row-reverse;
  }
  .lg\:direction--col {
    flex-direction: column;
  }
  .lg\:direction--col-reverse {
    flex-direction: column-reverse;
  }
  /* justify-content @ lg */
  .lg\:justify--start {
    justify-content: flex-start;
  }
  .lg\:justify--end {
    justify-content: flex-end;
  }
  .lg\:justify--center {
    justify-content: center;
  }
  .lg\:justify--between {
    justify-content: space-between;
  }
  .lg\:justify--around {
    justify-content: space-around;
  }
  .lg\:justify--evenly {
    justify-content: space-evenly;
  }
  /* align-items @ lg */
  .lg\:align--stretch {
    align-items: stretch;
  }
  .lg\:align--start {
    align-items: flex-start;
  }
  .lg\:align--center {
    align-items: center;
  }
  .lg\:align--end {
    align-items: flex-end;
  }
  .lg\:align--baseline {
    align-items: baseline;
  }
}
@media (min-width: 1440px) {
  /* display-important @ xl */
  .xl\:none {
    display: none;
  }
  .xl\:none\! {
    display: none !important;
  }
  .xl\:block {
    display: block;
  }
  .xl\:block\! {
    display: block !important;
  }
  .xl\:inline-block {
    display: inline-block;
  }
  .xl\:inline-block\! {
    display: inline-block !important;
  }
  .xl\:inline {
    display: inline;
  }
  .xl\:inline\! {
    display: inline !important;
  }
}
/* display-important - media */
@media print {
  .print\:none {
    display: none !important;
  }
  .print\:block {
    display: block !important;
  }
  .print\:inline-block {
    display: inline-block !important;
  }
  .print\:inline {
    display: inline !important;
  }
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.flex-grow--1 {
  flex-grow: 1;
}

.flex-grow--0 {
  flex-grow: 0;
}

.flex-shrink--1 {
  flex-shrink: 1;
}

.flex-shrink--0 {
  flex-shrink: 0;
}

/* RIVER Support / Javascript */
.js-preload-transitions * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

.js-hero-parallax {
  position: relative;
  overflow: hidden;
}
.js-hero-parallax .js-hero-parallax__bg,
.js-hero-parallax .js-hero-parallax__content {
  transition: transform 5ms linear;
}

/* RIVER Support / Animations */
@media (prefers-reduced-motion: no-preference) {
  .animate-none {
    transition: none;
  }
  .animate-fadein {
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: opacity;
  }
  .animate-fadein.js-animate-animated {
    opacity: 1;
  }
  .animate-slidein-down {
    transform: translateY(-2rem);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: opacity, transform;
  }
  .animate-slidein-down--small {
    transform: translateY(-1rem);
  }
  .animate-slidein-down--large {
    transform: translateY(-5rem);
  }
  .animate-slidein-down.js-animate-animated {
    transform: translateY(0);
    opacity: 1;
  }
  .animate-slidein-up {
    transform: translateY(2rem);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: opacity, transform;
  }
  .animate-slidein-up--small {
    transform: translateY(1rem);
  }
  .animate-slidein-up--large {
    transform: translateY(5rem);
  }
  .animate-slidein-up.js-animate-animated {
    transform: translateY(0);
    opacity: 1;
  }
  .animate-slidein-left {
    transform: translateX(3rem);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: opacity, transform;
  }
  .animate-slidein-left--small {
    transform: translateX(2rem);
  }
  .animate-slidein-left--large {
    transform: translateX(6rem);
  }
  .animate-slidein-left.js-animate-animated {
    transform: translateX(0);
    opacity: 1;
  }
  .animate-slidein-right {
    transform: translateX(-3rem);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: opacity, transform;
  }
  .animate-slidein-right--small {
    transform: translateX(-2rem);
  }
  .animate-slidein-right--large {
    transform: translateX(-6rem);
  }
  .animate-slidein-right.js-animate-animated {
    transform: translateX(0);
    opacity: 1;
  }
}
/* Content Blocks / Common */
:where(.content-blocks > .content-block + .content-block) {
  margin-top: var(--sizes-size-normal);
}

.block-expandable-content {
  position: relative;
  margin-bottom: var(--sizes-size-normal);
}
.block-expandable-content .block-expandable-content__title {
  display: flex;
  align-items: center;
  padding: var(--sizes-size-small);
  font-weight: var(--type-weight-bold);
  background-color: var(--colors-gray-bg);
  cursor: pointer;
}
.block-expandable-content .block-expandable-content__body {
  position: relative;
  overflow: hidden;
  border: solid 2px ghostwhite;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.block-expandable-content .block-expandable-content__content {
  padding: var(--sizes-size-small);
}
.block-expandable-content .block-expandable-content__content > *:last-child {
  margin-bottom: 0;
}

.block-expandable-content.is-open .block-expandable-content__arrow {
  transform: scaleY(-1);
}

/* Universal Content / Common */
.ucm-tools {
  display: flex;
  justify-content: space-between;
  padding: var(--sizes-size-small) 0;
  border-bottom: solid 2px var(--colors-gray-bg);
}

.ucm-tools__category {
  align-items: center;
}

.ucm-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 480px;
  margin: auto;
  text-decoration: none;
  min-height: 100%;
  color: var(--colors-gray-normal);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: transform;
}

.ucm-card:hover,
.ucm-card:active, .ucm-card.is-active {
  transform: translateY(-0.2rem);
}

.ucm-card__img {
  overflow: hidden;
  background-color: var(--colors-gray-bg);
  flex-shrink: 0;
  display: block;
  position: relative;
  height: 0;
  padding-top: var(--sizes-ratio-vertical-normal);
}

.ucm-card__body {
  padding-top: var(--sizes-size-small);
  padding-bottom: 0;
}

.ucm-card__caption {
  font-size: var(--type-size-small);
  color: var(--colors-gray-light);
}

.ucm-card__title {
  margin-bottom: 0;
}

.ucm-card__summary {
  margin-bottom: 0;
}