@charset "UTF-8";
.contao-cookiebar {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 9999;
  font-size: 0;
  letter-spacing: 0;
  text-align: center;
  padding: 15px;
  max-height: 100vh;
  box-sizing: border-box;
  pointer-events: none;
  overflow: hidden; }
  .contao-cookiebar * {
    box-sizing: border-box; }
  .contao-cookiebar:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle; }
  .contao-cookiebar .cc-inner {
    display: inline-block;
    overflow-y: auto;
    max-height: 100%;
    max-width: 100%;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    font-size: 1rem;
    text-align: left; }
    .contao-cookiebar .cc-inner .cc-head p:first-child {
      margin-top: 0; }
  .contao-cookiebar.cc-top .cc-inner {
    vertical-align: top; }
  .contao-cookiebar.cc-top.cc-active .cc-inner {
    animation: cookiebar-top-in 0.5s ease-in-out forwards; }
  .contao-cookiebar.cc-top.cc-saved .cc-inner {
    animation: cookiebar-top-out 0.5s ease-in-out forwards; }
  .contao-cookiebar.cc-bottom .cc-inner {
    vertical-align: bottom; }
  .contao-cookiebar.cc-bottom.cc-active .cc-inner {
    animation: cookiebar-bottom-in 0.5s ease-in-out forwards; }
  .contao-cookiebar.cc-bottom.cc-saved .cc-inner {
    animation: cookiebar-bottom-out 0.5s ease-in-out forwards; }
  .contao-cookiebar.cc-middle .cc-inner {
    vertical-align: middle; }
  .contao-cookiebar.cc-middle.cc-active .cc-inner {
    animation: cookiebar-middle-in 0.5s ease-in-out forwards; }
  .contao-cookiebar.cc-middle.cc-saved .cc-inner {
    animation: cookiebar-middle-out 0.5s ease-in-out forwards; }
  .contao-cookiebar.cc-left {
    text-align: left; }
  .contao-cookiebar.cc-right {
    text-align: right; }
  .contao-cookiebar .cc-head h1:first-child, .contao-cookiebar .cc-head h2:first-child, .contao-cookiebar .cc-head h3:first-child, .contao-cookiebar .cc-head h4:first-child, .contao-cookiebar .cc-head h5:first-child, .contao-cookiebar .cc-head h6:first-child {
    margin-top: 0; }
  .contao-cookiebar .cc-head p {
    margin-bottom: 15px; }
  .contao-cookiebar .cc-btn {
    display: inline-block;
    cursor: pointer;
    width: 100%;
    padding: 8px 14px;
    margin-bottom: 8px;
    font-size: 15px;
    outline: 0 none;
    border: 1px solid #cfcfcf;
    border-radius: 4px;
    color: #444;
    background: #f5f5f5; }
    .contao-cookiebar .cc-btn:hover {
      background: #ececec; }
    .contao-cookiebar .cc-btn:last-child {
      margin-bottom: 0; }
  .contao-cookiebar .grayscale .cc-btn {
    background: #f1efef; }
    .contao-cookiebar .grayscale .cc-btn:hover {
      background: #ececec; }
    .contao-cookiebar .grayscale .cc-btn.success {
      background: #fbfbfb; }
      .contao-cookiebar .grayscale .cc-btn.success:hover {
        background: #f7f7f7; }
  .contao-cookiebar .highlight .cc-btn.success {
    background: #4e9e3e;
    border-color: #3e7830;
    color: #fff; }
    .contao-cookiebar .highlight .cc-btn.success:hover {
      background: #4c933f; }
  .contao-cookiebar label {
    position: relative;
    display: block;
    padding: 8px 13px 8px 0;
    line-height: 1.2rem; }
    .contao-cookiebar label.group {
      font-weight: 600; }
  .contao-cookiebar input {
    position: absolute;
    width: 1px;
    height: 1px;
    outline: 0 none;
    opacity: 0; }
    .contao-cookiebar input + label {
      padding: 8px 13px 8px 45px;
      cursor: pointer; }
      .contao-cookiebar input + label:before {
        content: '';
        position: absolute;
        top: 7px;
        left: 0;
        width: 35px;
        height: 18px;
        margin: 0;
        box-sizing: content-box;
        border-radius: 10px;
        background: #fff;
        border: 1px solid #9c9b99;
        transition: border-color .2s; }
      .contao-cookiebar input + label:after {
        display: block;
        content: '';
        position: absolute;
        top: 11px;
        left: 4px;
        width: 12px;
        height: 12px;
        border-radius: 10px;
        background: #9c9b99;
        transition: background .2s, margin-left .2s, padding .2s; }
      .contao-cookiebar input + label:active:after {
        padding-left: 5px; }
    .contao-cookiebar input.cc-group-half + label:after {
      background: linear-gradient(to right, #9c9b99 0%, #9c9b99 50%, #399d32 50%, #399d32 100%); }
    .contao-cookiebar input:checked + label:after {
      background: #399d32;
      margin-left: 17px; }
    .contao-cookiebar input:checked + label:active:after {
      margin-left: 12px; }
    .contao-cookiebar input:checked + label:before {
      background: #dcf3db;
      border-color: #399d32; }
    .contao-cookiebar input:disabled + label {
      pointer-events: none; }
      .contao-cookiebar input:disabled + label:after {
        background: #c8c7c5; }
      .contao-cookiebar input:disabled + label:before {
        background: #f4f4f4;
        border-color: #c8c7c5; }
  .contao-cookiebar.cc-active .cc-inner {
    opacity: 1;
    pointer-events: auto;
    visibility: visible; }
  .contao-cookiebar.cc-active.cc-blocked {
    pointer-events: auto;
    animation: cookiebar-overlay-in 0.5s ease-in-out forwards; }
  .contao-cookiebar.cc-saved.cc-inner {
    opacity: 0;
    pointer-events: none;
    visibility: hidden; }
  .contao-cookiebar.cc-saved.cc-blocked {
    pointer-events: none;
    animation: cookiebar-overlay-out 0.5s ease-in-out forwards; }

@media (min-width: 768px) {
  .contao-cookiebar .cc-btn {
    width: auto;
    margin-bottom: 0; }
  .contao-cookiebar .cc-inner {
    max-width: 750px; } }

@keyframes cookiebar-overlay-in {
  0% {
    background: rgba(0, 0, 0, 0); }
  100% {
    background: rgba(0, 0, 0, 0.75); } }

@keyframes cookiebar-overlay-out {
  0% {
    background: rgba(0, 0, 0, 0.75); }
  100% {
    background: rgba(0, 0, 0, 0);
    visibility: hidden; } }

@keyframes cookiebar-top-in {
  0% {
    opacity: 0;
    transform: translateY(-100%); }
  100% {
    opacity: 1;
    transform: translateY(0); } }

@keyframes cookiebar-top-out {
  0% {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); }
  100% {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%); } }

@keyframes cookiebar-middle-in {
  0% {
    opacity: 0;
    transform: scale(0); }
  100% {
    opacity: 1;
    transform: scale(1); } }

@keyframes cookiebar-middle-out {
  0% {
    opacity: 1;
    visibility: visible;
    transform: scale(1); }
  100% {
    opacity: 0;
    visibility: hidden;
    transform: scale(0); } }

@keyframes cookiebar-bottom-in {
  0% {
    opacity: 0;
    transform: translateY(100%); }
  100% {
    opacity: 1;
    transform: translateY(0); } }

@keyframes cookiebar-bottom-out {
  0% {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); }
  100% {
    opacity: 0;
    visibility: hidden;
    transform: translateY(100%); } }

.contao-cookiebar {
  color: #444444; }
  .contao-cookiebar p {
    color: #868686;
    line-height: 1.4; }
  .contao-cookiebar .cc-inner {
    padding: 23px;
    border-radius: 3px;
    box-shadow: rgba(99, 99, 99, 0.2) 0 2px 8px 0;
    background: #fff; }
  .contao-cookiebar .cc-groups {
    display: none;
    padding-top: 15px; }
    .contao-cookiebar .cc-groups .cc-group {
      position: relative;
      border: 1px solid #d0d0d0;
      border-radius: 5px;
      margin-bottom: 10px;
      text-align: left; }
      .contao-cookiebar .cc-groups .cc-group > label {
        margin: 5px 130px 5px 10px; }
  .contao-cookiebar .cc-cookies {
    background: #fbfbfb;
    border-radius: 0 0 5px 5px; }
    .contao-cookiebar .cc-cookies > p {
      font-size: 0.875rem; }
    .contao-cookiebar .cc-cookies > p, .contao-cookiebar .cc-cookies > .cc-cookie {
      margin: 0;
      padding: 15px;
      border-top: 1px solid #e6e6e6; }
    .contao-cookiebar .cc-cookies .cc-cookie .cc-cookie-info {
      font-size: 0.875rem;
      background: #fff;
      padding: 10px;
      border-radius: 5px;
      border: 1px solid #efefef; }
      .contao-cookiebar .cc-cookies .cc-cookie .cc-cookie-info > div > span {
        font-weight: 600; }
      .contao-cookiebar .cc-cookies .cc-cookie .cc-cookie-info > div + div {
        margin-top: 5px; }
      .contao-cookiebar .cc-cookies .cc-cookie .cc-cookie-info + button.cc-detail-btn-details {
        margin-top: 15px; }
    .contao-cookiebar .cc-cookies .cc-cookie .cc-cookie-desc p {
      margin-bottom: 0; }
    .contao-cookiebar .cc-cookies .cc-cookie label.cookie + p, .contao-cookiebar .cc-cookies .cc-cookie label.cookie + .cc-cookie-info, .contao-cookiebar .cc-cookies .cc-cookie label.cookie + button.cc-detail-btn-details {
      margin-top: 10px; }
    .contao-cookiebar .cc-cookies .cc-cookie p {
      margin: 0 0 15px;
      font-size: 0.875rem; }
  .contao-cookiebar .cc-footer, .contao-cookiebar .cc-info {
    text-align: center; }
  .contao-cookiebar .cc-detail-btn-details {
    border: 0 none;
    outline: 0 none;
    background: transparent;
    font-size: 13px;
    letter-spacing: 0;
    text-transform: initial;
    cursor: pointer;
    color: #a2a2a2;
    text-decoration: underline;
    padding: 0;
    margin: 0 0 10px; }
    .contao-cookiebar .cc-detail-btn-details span:nth-child(2) {
      display: none; }
    .contao-cookiebar .cc-detail-btn-details.cc-active span:nth-child(1) {
      display: none; }
    .contao-cookiebar .cc-detail-btn-details.cc-active span:nth-child(2) {
      display: inline; }
    .contao-cookiebar .cc-detail-btn-details:hover {
      color: #717171; }
  .contao-cookiebar .cc-info {
    margin-top: 15px; }
    .contao-cookiebar .cc-info > p {
      font-size: 0.875rem; }
    .contao-cookiebar .cc-info > a {
      display: inline-block;
      font-size: 0.813rem;
      color: #a2a2a2;
      text-decoration: none; }
      .contao-cookiebar .cc-info > a:hover {
        color: #717171; }
      .contao-cookiebar .cc-info > a + a:before {
        display: inline-block;
        content: '·';
        margin-right: 5px; }

@charset "UTF-8";
/* @function str-replace
 Replace item in string with new string
 Parameters: $string - string $search - item to replace $replace - what to replace with
*/
/* @function map-deep-get
 Returns item from nested map
 Parameters: $map - initial map $keys - list of keys to follow
*/
/* @function get-breakpoint-directions
 Sorts through breakpoints SASS map, generates a full SASS map containing all the breakpoint variations we'll require

*/
/* @function get-media
 Returns start and stop points of a given media query
 Parameters: $bp - the breakpoint you want the stop and stop points of
*/
/* @function process-breakpoints
 Returns a breakpoints array
*/
/* @function get-smallest-breakpoint
 Returns the name of the smallest breakpoint
*/
/* @function isColorVariable
 Checks to see if a passed value appears to be a CSS variable or CSS color
 Parameters: $value - value to check
*/
/*
 colspan
 $n - number of columns to span $bump - some arbitrary value to add
 NB: if you're doing a column thats wider than 100%, say because you're negative margin lefting it:
 ``` .foo { --max-width: calc(100% - var(--inner-gutter)); display: flex; flex-flow: row wrap; margin-left: calc(var(--inner-gutter) * -1); }
 .bar { flex: 0 0 auto; width: colspan(2); } ```
 Then you should set a `--max-width` CSS variable so that the calc uses this value and not 100% to base its calculation on.
 If your container isn't all of your grid columns wide, say for example you have a 12 column grid, and your container is 9 columns wide, set a `--grid-columns` variable:
 ``` .foo { --grid-columns: 9; }
 .bar { width: colspan(2); } ```
 or
 ``` .foo { --grid-columns: 9; width: colspan(2); } ```
 or
 ``` .foo { @include colspan(2); } ```
 will set both child --grid-columns, and width of colspan
*/
/* @function get-max
 Looks at a map of values and returns the largest value in that map
 Parameters: $map - map to check
*/
/* @mixin processStructure
 Sets up the structural `:root` vars used by other utilities. Most utilities point to these variables, either directly or within `calc()`'s. These variables are then updated with media queries so the individual utilities don't require their own media queries.
*/
/* @mixin breakpoint
 Inserts a media query
 Parameters: $name - name of breakpoint, choose from:
 xs, sm, md, lg, xl, xxl  - *just* that breakpoint sm-, md-, lg-, xl-, xxl-  - that breakpoint *and* below xs+, sm+, md+, lg+, xl+  - that breakpoint *and* up
 NB: the we're mobile up, so the minus values should be avoided..
 $option - ie11, hover - to make an IE11 CSS with a breakpoint or to target browsers with mouse cursors
 ```scss @include breakpoint('md+') { // styles to be given to browsers at `medium` and above } @include breakpoint('md+','(min-height: 680px)') { // styles to be given to browsers at `medium` and above } @include breakpoint(null,'hover') { // styles to be given to devices with mouse pointers } @include breakpoint(null,'ie11') { // styles to be given to be given to IE11 } @include breakpoint('md+','hover') { // styles to be given to browsers at `medium` and above that have mouse pointers } @include breakpoint('md+','ie11') { // styles to be given to ie11 at `medium` and above } ```
*/
/* @mixin processColors
 Sets up the color tokens, color `:root` variables and the associated `%placeholder` and CSS classes.
*/
/* @mixin processTypography
 Processes the typography tokens, sets up the mixins, placeholders and CSS classes.
*/
/* @mixin typeAttribute
 Outputs CSS attributes

*/
/* @mixin typeStyle
 Loops a typeset to generate styles objects and then generates CSS as required

*/
/* @mixin typeStyles
 Loops typesets, makes placeholder and class for each, populates with styles

*/
/* outputs a specified typeset */
/* @mixin processGrid
 Generates design grid placeholder and CSS classes (`colspan-X` and `col-X`)

*/
/* @mixin setColspan
 Adds a `colspan-` class with a given index (to span number of columns equal to index)

*/
/* @mixin setBreakpointColspan
 Adds a `colspan-` class with a given index, with a breakpoint helper (to span number of columns equal to index)

*/
/* @mixin setGridCol
 Adds a `col-` class with a given index (to span number of columns equal to index)

*/
/* @mixin setBreakpointGridCol
 Adds a `colspan-` class with a given index, with a breakpoint helper (to span number of columns equal to index)

*/
/* @mixin processSpacing
 Generates spacing utilities for gutters and responsive spacing groups

*/
/* @mixin setupDevTools
 Generates dev tools classes for design grid overlay

*/
.container { width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; }

/* @mixin font-smoothing
 Enable or disable font-smoothing : this controls the application of anti-aliasing when fonts are rendered.
*/
/* @mixin placeholder
 Style form placeholder text
*/
.visually-hidden, .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

.float-clear::after { content: '.'; display: block; clear: both; height: 0; line-height: 0; overflow: hidden; visibility: hidden; }

.background-fill { position: relative; }
.background-fill::before { content: ''; position: absolute; z-index: -1; left: 50%; top: 0; bottom: 0; width: 100vw; margin-left: -50vw; background-color: inherit; pointer-events: none; }

html { box-sizing: border-box; }

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

[hidden] { display: none; }

:root { --COLOR-TOKENS: '↓'; --white: #fff; --grey-3: #f8f8f8; --grey-5: #f2f2f2; --grey-10: #e6e6e6; --grey-15: #d9d9d9; --grey-54: #757575; --grey-90: #1a1a1a; --black: #000; --blue-5: #f0f7ff; --blue-50: #0080ff; --blue-80: #001a33; --blue-90: #000d1a; --cyan-50: #33ffff; --cyan-70: teal; --cyan-80: #006666; --cyan-90: #004d4d; --antracite-5: #eff2f5; --antracite-10: #dfe6ec; --antracite-15: #bdccdb; --antracite-20: #9cb3c9; --antracite-30: #668099; --antracite-40: #4d6680; --antracite-50: #364d63; --red-5: #fff0f1; --red-50: #ff002b; --red-80: #660011; --red-90: #4d000d; --mint-50: #1aff79; }

:root { --COLOR-BORDER: 'for usage ↓'; --border-primary: var(--black); --border-secondary: var(--grey-15); --border-tertiary: var(--grey-54); --border-code-example-filename: var(--blue-05); }

:root { --COLOR-BACKGROUND: 'for usage ↓'; --bg-design-grid: rgba(127, 255, 255, 0.25); --bg-primary: var(--yellow-50); --bg-primary-light: var(--yellow-5); --bg-header: var(--yellow-50); --bg-footer: var(--antracite-50); --bg-banner: var(--grey-90); --bg-accent: var(--blue-03); --bg-column: var(--blue-05); --bg-column-alt: var(--blue-04); --bg-code: var(--grey-10); --bg-code-example: var(--grey-90); --bg-quote: var(--grey-5); }

:root { --COLOR-TEXT: 'for usage ↓'; --text-title: var(--black); --text-primary: var(--blue-80); --text-inverse: var(--white); --text-secondary: var(--grey-54); --text-accent: var(--red-50); --text-code: var(--black); --text-code-example: var(--grey-3); --text-code-example-filename: var(--blue-05); }

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

.border-secondary { border-color: var(--grey-15); }

.border-tertiary { border-color: var(--grey-54); }

.border-code-example-filename { border-color: var(--blue-05); }

.bg-design-grid { background-color: rgba(127, 255, 255, 0.25); }

.bg-primary { background-color: var(--yellow-50); }

.bg-primary-light { background-color: var(--yellow-5); }

.bg-header { background-color: var(--yellow-50); }

.bg-footer { background-color: var(--antracite-50); }

.bg-banner { background-color: var(--grey-90); }

.bg-accent { background-color: var(--blue-03); }

.bg-column { background-color: var(--blue-05); }

.bg-column-alt { background-color: var(--blue-04); }

.bg-code { background-color: var(--grey-10); }

.bg-code-example { background-color: var(--grey-90); }

.bg-quote { background-color: var(--grey-5); }

.text-title { color: var(--black); }

.text-primary { color: var(--blue-80); }

.text-inverse { color: var(--white); }

.text-secondary { color: var(--grey-54); }

.text-accent { color: var(--red-50); }

.text-code { color: var(--black); }

.text-code-example { color: var(--grey-3); }

.text-code-example-filename { color: var(--blue-05); }

:root { --safe-area-inset-bottom: 0px; }

@supports (padding-top: constant(safe-area-inset-bottom)) { :root { --safe-area-inset-bottom: constant(safe-area-inset-bottom); } }
@supports (padding-top: env(safe-area-inset-bottom)) { :root { --safe-area-inset-bottom: env(safe-area-inset-bottom); } }
:root { --breakpoint: 'xs'; --inner-gutter: 10px; --outer-gutter: 20px; --grid-columns: 4; --container-width: unset; }

@media screen and (min-width: 544px) { :root { --breakpoint: 'sm'; --inner-gutter: 15px; --outer-gutter: 30px; --grid-columns: 4; --container-width: unset; } }
@media screen and (min-width: 650px) { :root { --breakpoint: 'md'; --inner-gutter: 20px; --outer-gutter: 40px; --grid-columns: 6; --container-width: unset; } }
@media screen and (min-width: 990px) { :root { --breakpoint: 'lg'; --inner-gutter: 30px; --outer-gutter: 40px; --grid-columns: 6; --container-width: unset; } }
@media screen and (min-width: 1300px) { :root { --breakpoint: 'xl'; --inner-gutter: 40px; --outer-gutter: 40px; --grid-columns: 12; --container-width: unset; } }
@media screen and (min-width: 1520px) { :root { --breakpoint: 'xxl'; --inner-gutter: 40px; --outer-gutter: 0px; --grid-columns: 12; --container-width: 1440px; } }
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ colspan */
[class*='colspan-'] { width: 100%; }

.colspan-1 { width: calc(((1 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (1 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-1 > * { --grid-columns: 1; }

.colspan-2 { width: calc(((2 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (2 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-2 > * { --grid-columns: 2; }

.colspan-3 { width: calc(((3 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (3 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-3 > * { --grid-columns: 3; }

.colspan-4 { width: calc(((4 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (4 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-4 > * { --grid-columns: 4; }

.colspan-5 { width: calc(((5 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (5 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-5 > * { --grid-columns: 5; }

.colspan-6 { width: calc(((6 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (6 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-6 > * { --grid-columns: 6; }

.colspan-7 { width: calc(((7 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (7 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-7 > * { --grid-columns: 7; }

.colspan-8 { width: calc(((8 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (8 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-8 > * { --grid-columns: 8; }

.colspan-9 { width: calc(((9 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (9 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-9 > * { --grid-columns: 9; }

.colspan-10 { width: calc(((10 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (10 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-10 > * { --grid-columns: 10; }

.colspan-11 { width: calc(((11 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (11 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-11 > * { --grid-columns: 11; }

.colspan-12 { width: calc(((12 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (12 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-12 > * { --grid-columns: 12; }

.colspan-1\@xs { width: calc(((1 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (1 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-1\@xs > * { --grid-columns: 1; }

.colspan-2\@xs { width: calc(((2 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (2 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-2\@xs > * { --grid-columns: 2; }

.colspan-3\@xs { width: calc(((3 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (3 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-3\@xs > * { --grid-columns: 3; }

.colspan-4\@xs { width: calc(((4 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (4 / var(--grid-columns) * var(--inner-gutter)))); }

.colspan-4\@xs > * { --grid-columns: 4; }

@media screen and (min-width: 544px) { .colspan-1\@sm { width: calc(((1 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (1 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-1\@sm > * { --grid-columns: 1; }
  .colspan-2\@sm { width: calc(((2 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (2 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-2\@sm > * { --grid-columns: 2; }
  .colspan-3\@sm { width: calc(((3 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (3 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-3\@sm > * { --grid-columns: 3; }
  .colspan-4\@sm { width: calc(((4 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (4 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-4\@sm > * { --grid-columns: 4; } }
@media screen and (min-width: 650px) { .colspan-1\@md { width: calc(((1 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (1 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-1\@md > * { --grid-columns: 1; }
  .colspan-2\@md { width: calc(((2 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (2 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-2\@md > * { --grid-columns: 2; }
  .colspan-3\@md { width: calc(((3 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (3 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-3\@md > * { --grid-columns: 3; }
  .colspan-4\@md { width: calc(((4 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (4 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-4\@md > * { --grid-columns: 4; }
  .colspan-5\@md { width: calc(((5 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (5 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-5\@md > * { --grid-columns: 5; }
  .colspan-6\@md { width: calc(((6 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (6 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-6\@md > * { --grid-columns: 6; } }
@media screen and (min-width: 990px) { .colspan-1\@lg { width: calc(((1 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (1 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-1\@lg > * { --grid-columns: 1; }
  .colspan-2\@lg { width: calc(((2 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (2 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-2\@lg > * { --grid-columns: 2; }
  .colspan-3\@lg { width: calc(((3 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (3 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-3\@lg > * { --grid-columns: 3; }
  .colspan-4\@lg { width: calc(((4 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (4 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-4\@lg > * { --grid-columns: 4; }
  .colspan-5\@lg { width: calc(((5 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (5 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-5\@lg > * { --grid-columns: 5; }
  .colspan-6\@lg { width: calc(((6 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (6 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-6\@lg > * { --grid-columns: 6; } }
@media screen and (min-width: 1300px) { .colspan-1\@xl { width: calc(((1 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (1 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-1\@xl > * { --grid-columns: 1; }
  .colspan-2\@xl { width: calc(((2 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (2 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-2\@xl > * { --grid-columns: 2; }
  .colspan-3\@xl { width: calc(((3 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (3 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-3\@xl > * { --grid-columns: 3; }
  .colspan-4\@xl { width: calc(((4 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (4 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-4\@xl > * { --grid-columns: 4; }
  .colspan-5\@xl { width: calc(((5 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (5 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-5\@xl > * { --grid-columns: 5; }
  .colspan-6\@xl { width: calc(((6 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (6 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-6\@xl > * { --grid-columns: 6; }
  .colspan-7\@xl { width: calc(((7 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (7 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-7\@xl > * { --grid-columns: 7; }
  .colspan-8\@xl { width: calc(((8 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (8 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-8\@xl > * { --grid-columns: 8; }
  .colspan-9\@xl { width: calc(((9 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (9 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-9\@xl > * { --grid-columns: 9; }
  .colspan-10\@xl { width: calc(((10 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (10 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-10\@xl > * { --grid-columns: 10; }
  .colspan-11\@xl { width: calc(((11 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (11 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-11\@xl > * { --grid-columns: 11; }
  .colspan-12\@xl { width: calc(((12 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (12 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-12\@xl > * { --grid-columns: 12; } }
@media screen and (min-width: 1520px) { .colspan-1\@xxl { width: calc(((1 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (1 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-1\@xxl > * { --grid-columns: 1; }
  .colspan-2\@xxl { width: calc(((2 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (2 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-2\@xxl > * { --grid-columns: 2; }
  .colspan-3\@xxl { width: calc(((3 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (3 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-3\@xxl > * { --grid-columns: 3; }
  .colspan-4\@xxl { width: calc(((4 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (4 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-4\@xxl > * { --grid-columns: 4; }
  .colspan-5\@xxl { width: calc(((5 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (5 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-5\@xxl > * { --grid-columns: 5; }
  .colspan-6\@xxl { width: calc(((6 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (6 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-6\@xxl > * { --grid-columns: 6; }
  .colspan-7\@xxl { width: calc(((7 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (7 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-7\@xxl > * { --grid-columns: 7; }
  .colspan-8\@xxl { width: calc(((8 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (8 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-8\@xxl > * { --grid-columns: 8; }
  .colspan-9\@xxl { width: calc(((9 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (9 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-9\@xxl > * { --grid-columns: 9; }
  .colspan-10\@xxl { width: calc(((10 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (10 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-10\@xxl > * { --grid-columns: 10; }
  .colspan-11\@xxl { width: calc(((11 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (11 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-11\@xxl > * { --grid-columns: 11; }
  .colspan-12\@xxl { width: calc(((12 / var(--grid-columns)) * var(--max-width, 100%)) - (var(--inner-gutter) - (12 / var(--grid-columns) * var(--inner-gutter)))); }
  .colspan-12\@xxl > * { --grid-columns: 12; } }
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ grid/col-*/
.grid { display: grid; column-gap: var(--inner-gutter); grid-template-columns: repeat(var(--grid-columns), 1fr); }

.col, [class*='col-'] { grid-column: span var(--grid-columns); }

.col-1 { --grid-columns: 1; grid-column: span 1; }

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

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

.col-2 { --grid-columns: 2; grid-column: span 2; }

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

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

.col-3 { --grid-columns: 3; grid-column: span 3; }

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

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

.col-4 { --grid-columns: 4; grid-column: span 4; }

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

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

.col-5 { --grid-columns: 5; grid-column: span 5; }

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

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

.col-6 { --grid-columns: 6; grid-column: span 6; }

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

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

.col-7 { --grid-columns: 7; grid-column: span 7; }

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

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

.col-8 { --grid-columns: 8; grid-column: span 8; }

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

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

.col-9 { --grid-columns: 9; grid-column: span 9; }

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

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

.col-10 { --grid-columns: 10; grid-column: span 10; }

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

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

.col-11 { --grid-columns: 11; grid-column: span 11; }

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

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

.col-12 { --grid-columns: 12; grid-column: span 12; }

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

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

.col-1\@xs { --grid-columns: 1; grid-column: span 1; }

.col-start-1\@xs { grid-column-start: 1; }

.col-end-2\@xs { grid-column-end: 3; }

.col-start-1.col-1\@xs, .col-start-1\@xs.col-1\@xs { grid-column: 1 / span 1; }

.col-start-1.col-2\@xs, .col-start-1\@xs.col-2\@xs { grid-column: 1 / span 2; }

.col-start-1.col-3\@xs, .col-start-1\@xs.col-3\@xs { grid-column: 1 / span 3; }

.col-start-1.col-4\@xs, .col-start-1\@xs.col-4\@xs { grid-column: 1 / span 4; }

.col-2\@xs { --grid-columns: 2; grid-column: span 2; }

.col-start-2\@xs { grid-column-start: 2; }

.col-end-3\@xs { grid-column-end: 4; }

.col-start-2.col-1\@xs, .col-start-2\@xs.col-1\@xs { grid-column: 2 / span 1; }

.col-start-2.col-2\@xs, .col-start-2\@xs.col-2\@xs { grid-column: 2 / span 2; }

.col-start-2.col-3\@xs, .col-start-2\@xs.col-3\@xs { grid-column: 2 / span 3; }

.col-start-2.col-4\@xs, .col-start-2\@xs.col-4\@xs { grid-column: 2 / span 4; }

.col-3\@xs { --grid-columns: 3; grid-column: span 3; }

.col-start-3\@xs { grid-column-start: 3; }

.col-end-4\@xs { grid-column-end: 5; }

.col-start-3.col-1\@xs, .col-start-3\@xs.col-1\@xs { grid-column: 3 / span 1; }

.col-start-3.col-2\@xs, .col-start-3\@xs.col-2\@xs { grid-column: 3 / span 2; }

.col-start-3.col-3\@xs, .col-start-3\@xs.col-3\@xs { grid-column: 3 / span 3; }

.col-start-3.col-4\@xs, .col-start-3\@xs.col-4\@xs { grid-column: 3 / span 4; }

.col-4\@xs { --grid-columns: 4; grid-column: span 4; }

.col-start-4\@xs { grid-column-start: 4; }

.col-end-5\@xs { grid-column-end: 6; }

.col-start-4.col-1\@xs, .col-start-4\@xs.col-1\@xs { grid-column: 4 / span 1; }

.col-start-4.col-2\@xs, .col-start-4\@xs.col-2\@xs { grid-column: 4 / span 2; }

.col-start-4.col-3\@xs, .col-start-4\@xs.col-3\@xs { grid-column: 4 / span 3; }

.col-start-4.col-4\@xs, .col-start-4\@xs.col-4\@xs { grid-column: 4 / span 4; }

@media screen and (min-width: 544px) { .col-1\@sm { --grid-columns: 1; grid-column: span 1; }
  .col-start-1\@sm { grid-column-start: 1; }
  .col-end-2\@sm { grid-column-end: 3; }
  .col-start-1.col-1\@sm, .col-start-1\@sm.col-1\@sm { grid-column: 1 / span 1; }
  .col-start-1.col-2\@sm, .col-start-1\@sm.col-2\@sm { grid-column: 1 / span 2; }
  .col-start-1.col-3\@sm, .col-start-1\@sm.col-3\@sm { grid-column: 1 / span 3; }
  .col-start-1.col-4\@sm, .col-start-1\@sm.col-4\@sm { grid-column: 1 / span 4; }
  .col-2\@sm { --grid-columns: 2; grid-column: span 2; }
  .col-start-2\@sm { grid-column-start: 2; }
  .col-end-3\@sm { grid-column-end: 4; }
  .col-start-2.col-1\@sm, .col-start-2\@sm.col-1\@sm { grid-column: 2 / span 1; }
  .col-start-2.col-2\@sm, .col-start-2\@sm.col-2\@sm { grid-column: 2 / span 2; }
  .col-start-2.col-3\@sm, .col-start-2\@sm.col-3\@sm { grid-column: 2 / span 3; }
  .col-start-2.col-4\@sm, .col-start-2\@sm.col-4\@sm { grid-column: 2 / span 4; }
  .col-3\@sm { --grid-columns: 3; grid-column: span 3; }
  .col-start-3\@sm { grid-column-start: 3; }
  .col-end-4\@sm { grid-column-end: 5; }
  .col-start-3.col-1\@sm, .col-start-3\@sm.col-1\@sm { grid-column: 3 / span 1; }
  .col-start-3.col-2\@sm, .col-start-3\@sm.col-2\@sm { grid-column: 3 / span 2; }
  .col-start-3.col-3\@sm, .col-start-3\@sm.col-3\@sm { grid-column: 3 / span 3; }
  .col-start-3.col-4\@sm, .col-start-3\@sm.col-4\@sm { grid-column: 3 / span 4; }
  .col-4\@sm { --grid-columns: 4; grid-column: span 4; }
  .col-start-4\@sm { grid-column-start: 4; }
  .col-end-5\@sm { grid-column-end: 6; }
  .col-start-4.col-1\@sm, .col-start-4\@sm.col-1\@sm { grid-column: 4 / span 1; }
  .col-start-4.col-2\@sm, .col-start-4\@sm.col-2\@sm { grid-column: 4 / span 2; }
  .col-start-4.col-3\@sm, .col-start-4\@sm.col-3\@sm { grid-column: 4 / span 3; }
  .col-start-4.col-4\@sm, .col-start-4\@sm.col-4\@sm { grid-column: 4 / span 4; } }
@media screen and (min-width: 650px) { .col-1\@md { --grid-columns: 1; grid-column: span 1; }
  .col-start-1\@md { grid-column-start: 1; }
  .col-end-2\@md { grid-column-end: 3; }
  .col-start-1.col-1\@md, .col-start-1\@md.col-1\@md { grid-column: 1 / span 1; }
  .col-start-1.col-2\@md, .col-start-1\@md.col-2\@md { grid-column: 1 / span 2; }
  .col-start-1.col-3\@md, .col-start-1\@md.col-3\@md { grid-column: 1 / span 3; }
  .col-start-1.col-4\@md, .col-start-1\@md.col-4\@md { grid-column: 1 / span 4; }
  .col-start-1.col-5\@md, .col-start-1\@md.col-5\@md { grid-column: 1 / span 5; }
  .col-start-1.col-6\@md, .col-start-1\@md.col-6\@md { grid-column: 1 / span 6; }
  .col-2\@md { --grid-columns: 2; grid-column: span 2; }
  .col-start-2\@md { grid-column-start: 2; }
  .col-end-3\@md { grid-column-end: 4; }
  .col-start-2.col-1\@md, .col-start-2\@md.col-1\@md { grid-column: 2 / span 1; }
  .col-start-2.col-2\@md, .col-start-2\@md.col-2\@md { grid-column: 2 / span 2; }
  .col-start-2.col-3\@md, .col-start-2\@md.col-3\@md { grid-column: 2 / span 3; }
  .col-start-2.col-4\@md, .col-start-2\@md.col-4\@md { grid-column: 2 / span 4; }
  .col-start-2.col-5\@md, .col-start-2\@md.col-5\@md { grid-column: 2 / span 5; }
  .col-start-2.col-6\@md, .col-start-2\@md.col-6\@md { grid-column: 2 / span 6; }
  .col-3\@md { --grid-columns: 3; grid-column: span 3; }
  .col-start-3\@md { grid-column-start: 3; }
  .col-end-4\@md { grid-column-end: 5; }
  .col-start-3.col-1\@md, .col-start-3\@md.col-1\@md { grid-column: 3 / span 1; }
  .col-start-3.col-2\@md, .col-start-3\@md.col-2\@md { grid-column: 3 / span 2; }
  .col-start-3.col-3\@md, .col-start-3\@md.col-3\@md { grid-column: 3 / span 3; }
  .col-start-3.col-4\@md, .col-start-3\@md.col-4\@md { grid-column: 3 / span 4; }
  .col-start-3.col-5\@md, .col-start-3\@md.col-5\@md { grid-column: 3 / span 5; }
  .col-start-3.col-6\@md, .col-start-3\@md.col-6\@md { grid-column: 3 / span 6; }
  .col-4\@md { --grid-columns: 4; grid-column: span 4; }
  .col-start-4\@md { grid-column-start: 4; }
  .col-end-5\@md { grid-column-end: 6; }
  .col-start-4.col-1\@md, .col-start-4\@md.col-1\@md { grid-column: 4 / span 1; }
  .col-start-4.col-2\@md, .col-start-4\@md.col-2\@md { grid-column: 4 / span 2; }
  .col-start-4.col-3\@md, .col-start-4\@md.col-3\@md { grid-column: 4 / span 3; }
  .col-start-4.col-4\@md, .col-start-4\@md.col-4\@md { grid-column: 4 / span 4; }
  .col-start-4.col-5\@md, .col-start-4\@md.col-5\@md { grid-column: 4 / span 5; }
  .col-start-4.col-6\@md, .col-start-4\@md.col-6\@md { grid-column: 4 / span 6; }
  .col-5\@md { --grid-columns: 5; grid-column: span 5; }
  .col-start-5\@md { grid-column-start: 5; }
  .col-end-6\@md { grid-column-end: 7; }
  .col-start-5.col-1\@md, .col-start-5\@md.col-1\@md { grid-column: 5 / span 1; }
  .col-start-5.col-2\@md, .col-start-5\@md.col-2\@md { grid-column: 5 / span 2; }
  .col-start-5.col-3\@md, .col-start-5\@md.col-3\@md { grid-column: 5 / span 3; }
  .col-start-5.col-4\@md, .col-start-5\@md.col-4\@md { grid-column: 5 / span 4; }
  .col-start-5.col-5\@md, .col-start-5\@md.col-5\@md { grid-column: 5 / span 5; }
  .col-start-5.col-6\@md, .col-start-5\@md.col-6\@md { grid-column: 5 / span 6; }
  .col-6\@md { --grid-columns: 6; grid-column: span 6; }
  .col-start-6\@md { grid-column-start: 6; }
  .col-end-7\@md { grid-column-end: 8; }
  .col-start-6.col-1\@md, .col-start-6\@md.col-1\@md { grid-column: 6 / span 1; }
  .col-start-6.col-2\@md, .col-start-6\@md.col-2\@md { grid-column: 6 / span 2; }
  .col-start-6.col-3\@md, .col-start-6\@md.col-3\@md { grid-column: 6 / span 3; }
  .col-start-6.col-4\@md, .col-start-6\@md.col-4\@md { grid-column: 6 / span 4; }
  .col-start-6.col-5\@md, .col-start-6\@md.col-5\@md { grid-column: 6 / span 5; }
  .col-start-6.col-6\@md, .col-start-6\@md.col-6\@md { grid-column: 6 / span 6; } }
@media screen and (min-width: 990px) { .col-1\@lg { --grid-columns: 1; grid-column: span 1; }
  .col-start-1\@lg { grid-column-start: 1; }
  .col-end-2\@lg { grid-column-end: 3; }
  .col-start-1.col-1\@lg, .col-start-1\@lg.col-1\@lg { grid-column: 1 / span 1; }
  .col-start-1.col-2\@lg, .col-start-1\@lg.col-2\@lg { grid-column: 1 / span 2; }
  .col-start-1.col-3\@lg, .col-start-1\@lg.col-3\@lg { grid-column: 1 / span 3; }
  .col-start-1.col-4\@lg, .col-start-1\@lg.col-4\@lg { grid-column: 1 / span 4; }
  .col-start-1.col-5\@lg, .col-start-1\@lg.col-5\@lg { grid-column: 1 / span 5; }
  .col-start-1.col-6\@lg, .col-start-1\@lg.col-6\@lg { grid-column: 1 / span 6; }
  .col-2\@lg { --grid-columns: 2; grid-column: span 2; }
  .col-start-2\@lg { grid-column-start: 2; }
  .col-end-3\@lg { grid-column-end: 4; }
  .col-start-2.col-1\@lg, .col-start-2\@lg.col-1\@lg { grid-column: 2 / span 1; }
  .col-start-2.col-2\@lg, .col-start-2\@lg.col-2\@lg { grid-column: 2 / span 2; }
  .col-start-2.col-3\@lg, .col-start-2\@lg.col-3\@lg { grid-column: 2 / span 3; }
  .col-start-2.col-4\@lg, .col-start-2\@lg.col-4\@lg { grid-column: 2 / span 4; }
  .col-start-2.col-5\@lg, .col-start-2\@lg.col-5\@lg { grid-column: 2 / span 5; }
  .col-start-2.col-6\@lg, .col-start-2\@lg.col-6\@lg { grid-column: 2 / span 6; }
  .col-3\@lg { --grid-columns: 3; grid-column: span 3; }
  .col-start-3\@lg { grid-column-start: 3; }
  .col-end-4\@lg { grid-column-end: 5; }
  .col-start-3.col-1\@lg, .col-start-3\@lg.col-1\@lg { grid-column: 3 / span 1; }
  .col-start-3.col-2\@lg, .col-start-3\@lg.col-2\@lg { grid-column: 3 / span 2; }
  .col-start-3.col-3\@lg, .col-start-3\@lg.col-3\@lg { grid-column: 3 / span 3; }
  .col-start-3.col-4\@lg, .col-start-3\@lg.col-4\@lg { grid-column: 3 / span 4; }
  .col-start-3.col-5\@lg, .col-start-3\@lg.col-5\@lg { grid-column: 3 / span 5; }
  .col-start-3.col-6\@lg, .col-start-3\@lg.col-6\@lg { grid-column: 3 / span 6; }
  .col-4\@lg { --grid-columns: 4; grid-column: span 4; }
  .col-start-4\@lg { grid-column-start: 4; }
  .col-end-5\@lg { grid-column-end: 6; }
  .col-start-4.col-1\@lg, .col-start-4\@lg.col-1\@lg { grid-column: 4 / span 1; }
  .col-start-4.col-2\@lg, .col-start-4\@lg.col-2\@lg { grid-column: 4 / span 2; }
  .col-start-4.col-3\@lg, .col-start-4\@lg.col-3\@lg { grid-column: 4 / span 3; }
  .col-start-4.col-4\@lg, .col-start-4\@lg.col-4\@lg { grid-column: 4 / span 4; }
  .col-start-4.col-5\@lg, .col-start-4\@lg.col-5\@lg { grid-column: 4 / span 5; }
  .col-start-4.col-6\@lg, .col-start-4\@lg.col-6\@lg { grid-column: 4 / span 6; }
  .col-5\@lg { --grid-columns: 5; grid-column: span 5; }
  .col-start-5\@lg { grid-column-start: 5; }
  .col-end-6\@lg { grid-column-end: 7; }
  .col-start-5.col-1\@lg, .col-start-5\@lg.col-1\@lg { grid-column: 5 / span 1; }
  .col-start-5.col-2\@lg, .col-start-5\@lg.col-2\@lg { grid-column: 5 / span 2; }
  .col-start-5.col-3\@lg, .col-start-5\@lg.col-3\@lg { grid-column: 5 / span 3; }
  .col-start-5.col-4\@lg, .col-start-5\@lg.col-4\@lg { grid-column: 5 / span 4; }
  .col-start-5.col-5\@lg, .col-start-5\@lg.col-5\@lg { grid-column: 5 / span 5; }
  .col-start-5.col-6\@lg, .col-start-5\@lg.col-6\@lg { grid-column: 5 / span 6; }
  .col-6\@lg { --grid-columns: 6; grid-column: span 6; }
  .col-start-6\@lg { grid-column-start: 6; }
  .col-end-7\@lg { grid-column-end: 8; }
  .col-start-6.col-1\@lg, .col-start-6\@lg.col-1\@lg { grid-column: 6 / span 1; }
  .col-start-6.col-2\@lg, .col-start-6\@lg.col-2\@lg { grid-column: 6 / span 2; }
  .col-start-6.col-3\@lg, .col-start-6\@lg.col-3\@lg { grid-column: 6 / span 3; }
  .col-start-6.col-4\@lg, .col-start-6\@lg.col-4\@lg { grid-column: 6 / span 4; }
  .col-start-6.col-5\@lg, .col-start-6\@lg.col-5\@lg { grid-column: 6 / span 5; }
  .col-start-6.col-6\@lg, .col-start-6\@lg.col-6\@lg { grid-column: 6 / span 6; } }
@media screen and (min-width: 1300px) { .col-1\@xl { --grid-columns: 1; grid-column: span 1; }
  .col-start-1\@xl { grid-column-start: 1; }
  .col-end-2\@xl { grid-column-end: 3; }
  .col-start-1.col-1\@xl, .col-start-1\@xl.col-1\@xl { grid-column: 1 / span 1; }
  .col-start-1.col-2\@xl, .col-start-1\@xl.col-2\@xl { grid-column: 1 / span 2; }
  .col-start-1.col-3\@xl, .col-start-1\@xl.col-3\@xl { grid-column: 1 / span 3; }
  .col-start-1.col-4\@xl, .col-start-1\@xl.col-4\@xl { grid-column: 1 / span 4; }
  .col-start-1.col-5\@xl, .col-start-1\@xl.col-5\@xl { grid-column: 1 / span 5; }
  .col-start-1.col-6\@xl, .col-start-1\@xl.col-6\@xl { grid-column: 1 / span 6; }
  .col-start-1.col-7\@xl, .col-start-1\@xl.col-7\@xl { grid-column: 1 / span 7; }
  .col-start-1.col-8\@xl, .col-start-1\@xl.col-8\@xl { grid-column: 1 / span 8; }
  .col-start-1.col-9\@xl, .col-start-1\@xl.col-9\@xl { grid-column: 1 / span 9; }
  .col-start-1.col-10\@xl, .col-start-1\@xl.col-10\@xl { grid-column: 1 / span 10; }
  .col-start-1.col-11\@xl, .col-start-1\@xl.col-11\@xl { grid-column: 1 / span 11; }
  .col-start-1.col-12\@xl, .col-start-1\@xl.col-12\@xl { grid-column: 1 / span 12; }
  .col-2\@xl { --grid-columns: 2; grid-column: span 2; }
  .col-start-2\@xl { grid-column-start: 2; }
  .col-end-3\@xl { grid-column-end: 4; }
  .col-start-2.col-1\@xl, .col-start-2\@xl.col-1\@xl { grid-column: 2 / span 1; }
  .col-start-2.col-2\@xl, .col-start-2\@xl.col-2\@xl { grid-column: 2 / span 2; }
  .col-start-2.col-3\@xl, .col-start-2\@xl.col-3\@xl { grid-column: 2 / span 3; }
  .col-start-2.col-4\@xl, .col-start-2\@xl.col-4\@xl { grid-column: 2 / span 4; }
  .col-start-2.col-5\@xl, .col-start-2\@xl.col-5\@xl { grid-column: 2 / span 5; }
  .col-start-2.col-6\@xl, .col-start-2\@xl.col-6\@xl { grid-column: 2 / span 6; }
  .col-start-2.col-7\@xl, .col-start-2\@xl.col-7\@xl { grid-column: 2 / span 7; }
  .col-start-2.col-8\@xl, .col-start-2\@xl.col-8\@xl { grid-column: 2 / span 8; }
  .col-start-2.col-9\@xl, .col-start-2\@xl.col-9\@xl { grid-column: 2 / span 9; }
  .col-start-2.col-10\@xl, .col-start-2\@xl.col-10\@xl { grid-column: 2 / span 10; }
  .col-start-2.col-11\@xl, .col-start-2\@xl.col-11\@xl { grid-column: 2 / span 11; }
  .col-start-2.col-12\@xl, .col-start-2\@xl.col-12\@xl { grid-column: 2 / span 12; }
  .col-3\@xl { --grid-columns: 3; grid-column: span 3; }
  .col-start-3\@xl { grid-column-start: 3; }
  .col-end-4\@xl { grid-column-end: 5; }
  .col-start-3.col-1\@xl, .col-start-3\@xl.col-1\@xl { grid-column: 3 / span 1; }
  .col-start-3.col-2\@xl, .col-start-3\@xl.col-2\@xl { grid-column: 3 / span 2; }
  .col-start-3.col-3\@xl, .col-start-3\@xl.col-3\@xl { grid-column: 3 / span 3; }
  .col-start-3.col-4\@xl, .col-start-3\@xl.col-4\@xl { grid-column: 3 / span 4; }
  .col-start-3.col-5\@xl, .col-start-3\@xl.col-5\@xl { grid-column: 3 / span 5; }
  .col-start-3.col-6\@xl, .col-start-3\@xl.col-6\@xl { grid-column: 3 / span 6; }
  .col-start-3.col-7\@xl, .col-start-3\@xl.col-7\@xl { grid-column: 3 / span 7; }
  .col-start-3.col-8\@xl, .col-start-3\@xl.col-8\@xl { grid-column: 3 / span 8; }
  .col-start-3.col-9\@xl, .col-start-3\@xl.col-9\@xl { grid-column: 3 / span 9; }
  .col-start-3.col-10\@xl, .col-start-3\@xl.col-10\@xl { grid-column: 3 / span 10; }
  .col-start-3.col-11\@xl, .col-start-3\@xl.col-11\@xl { grid-column: 3 / span 11; }
  .col-start-3.col-12\@xl, .col-start-3\@xl.col-12\@xl { grid-column: 3 / span 12; }
  .col-4\@xl { --grid-columns: 4; grid-column: span 4; }
  .col-start-4\@xl { grid-column-start: 4; }
  .col-end-5\@xl { grid-column-end: 6; }
  .col-start-4.col-1\@xl, .col-start-4\@xl.col-1\@xl { grid-column: 4 / span 1; }
  .col-start-4.col-2\@xl, .col-start-4\@xl.col-2\@xl { grid-column: 4 / span 2; }
  .col-start-4.col-3\@xl, .col-start-4\@xl.col-3\@xl { grid-column: 4 / span 3; }
  .col-start-4.col-4\@xl, .col-start-4\@xl.col-4\@xl { grid-column: 4 / span 4; }
  .col-start-4.col-5\@xl, .col-start-4\@xl.col-5\@xl { grid-column: 4 / span 5; }
  .col-start-4.col-6\@xl, .col-start-4\@xl.col-6\@xl { grid-column: 4 / span 6; }
  .col-start-4.col-7\@xl, .col-start-4\@xl.col-7\@xl { grid-column: 4 / span 7; }
  .col-start-4.col-8\@xl, .col-start-4\@xl.col-8\@xl { grid-column: 4 / span 8; }
  .col-start-4.col-9\@xl, .col-start-4\@xl.col-9\@xl { grid-column: 4 / span 9; }
  .col-start-4.col-10\@xl, .col-start-4\@xl.col-10\@xl { grid-column: 4 / span 10; }
  .col-start-4.col-11\@xl, .col-start-4\@xl.col-11\@xl { grid-column: 4 / span 11; }
  .col-start-4.col-12\@xl, .col-start-4\@xl.col-12\@xl { grid-column: 4 / span 12; }
  .col-5\@xl { --grid-columns: 5; grid-column: span 5; }
  .col-start-5\@xl { grid-column-start: 5; }
  .col-end-6\@xl { grid-column-end: 7; }
  .col-start-5.col-1\@xl, .col-start-5\@xl.col-1\@xl { grid-column: 5 / span 1; }
  .col-start-5.col-2\@xl, .col-start-5\@xl.col-2\@xl { grid-column: 5 / span 2; }
  .col-start-5.col-3\@xl, .col-start-5\@xl.col-3\@xl { grid-column: 5 / span 3; }
  .col-start-5.col-4\@xl, .col-start-5\@xl.col-4\@xl { grid-column: 5 / span 4; }
  .col-start-5.col-5\@xl, .col-start-5\@xl.col-5\@xl { grid-column: 5 / span 5; }
  .col-start-5.col-6\@xl, .col-start-5\@xl.col-6\@xl { grid-column: 5 / span 6; }
  .col-start-5.col-7\@xl, .col-start-5\@xl.col-7\@xl { grid-column: 5 / span 7; }
  .col-start-5.col-8\@xl, .col-start-5\@xl.col-8\@xl { grid-column: 5 / span 8; }
  .col-start-5.col-9\@xl, .col-start-5\@xl.col-9\@xl { grid-column: 5 / span 9; }
  .col-start-5.col-10\@xl, .col-start-5\@xl.col-10\@xl { grid-column: 5 / span 10; }
  .col-start-5.col-11\@xl, .col-start-5\@xl.col-11\@xl { grid-column: 5 / span 11; }
  .col-start-5.col-12\@xl, .col-start-5\@xl.col-12\@xl { grid-column: 5 / span 12; }
  .col-6\@xl { --grid-columns: 6; grid-column: span 6; }
  .col-start-6\@xl { grid-column-start: 6; }
  .col-end-7\@xl { grid-column-end: 8; }
  .col-start-6.col-1\@xl, .col-start-6\@xl.col-1\@xl { grid-column: 6 / span 1; }
  .col-start-6.col-2\@xl, .col-start-6\@xl.col-2\@xl { grid-column: 6 / span 2; }
  .col-start-6.col-3\@xl, .col-start-6\@xl.col-3\@xl { grid-column: 6 / span 3; }
  .col-start-6.col-4\@xl, .col-start-6\@xl.col-4\@xl { grid-column: 6 / span 4; }
  .col-start-6.col-5\@xl, .col-start-6\@xl.col-5\@xl { grid-column: 6 / span 5; }
  .col-start-6.col-6\@xl, .col-start-6\@xl.col-6\@xl { grid-column: 6 / span 6; }
  .col-start-6.col-7\@xl, .col-start-6\@xl.col-7\@xl { grid-column: 6 / span 7; }
  .col-start-6.col-8\@xl, .col-start-6\@xl.col-8\@xl { grid-column: 6 / span 8; }
  .col-start-6.col-9\@xl, .col-start-6\@xl.col-9\@xl { grid-column: 6 / span 9; }
  .col-start-6.col-10\@xl, .col-start-6\@xl.col-10\@xl { grid-column: 6 / span 10; }
  .col-start-6.col-11\@xl, .col-start-6\@xl.col-11\@xl { grid-column: 6 / span 11; }
  .col-start-6.col-12\@xl, .col-start-6\@xl.col-12\@xl { grid-column: 6 / span 12; }
  .col-7\@xl { --grid-columns: 7; grid-column: span 7; }
  .col-start-7\@xl { grid-column-start: 7; }
  .col-end-8\@xl { grid-column-end: 9; }
  .col-start-7.col-1\@xl, .col-start-7\@xl.col-1\@xl { grid-column: 7 / span 1; }
  .col-start-7.col-2\@xl, .col-start-7\@xl.col-2\@xl { grid-column: 7 / span 2; }
  .col-start-7.col-3\@xl, .col-start-7\@xl.col-3\@xl { grid-column: 7 / span 3; }
  .col-start-7.col-4\@xl, .col-start-7\@xl.col-4\@xl { grid-column: 7 / span 4; }
  .col-start-7.col-5\@xl, .col-start-7\@xl.col-5\@xl { grid-column: 7 / span 5; }
  .col-start-7.col-6\@xl, .col-start-7\@xl.col-6\@xl { grid-column: 7 / span 6; }
  .col-start-7.col-7\@xl, .col-start-7\@xl.col-7\@xl { grid-column: 7 / span 7; }
  .col-start-7.col-8\@xl, .col-start-7\@xl.col-8\@xl { grid-column: 7 / span 8; }
  .col-start-7.col-9\@xl, .col-start-7\@xl.col-9\@xl { grid-column: 7 / span 9; }
  .col-start-7.col-10\@xl, .col-start-7\@xl.col-10\@xl { grid-column: 7 / span 10; }
  .col-start-7.col-11\@xl, .col-start-7\@xl.col-11\@xl { grid-column: 7 / span 11; }
  .col-start-7.col-12\@xl, .col-start-7\@xl.col-12\@xl { grid-column: 7 / span 12; }
  .col-8\@xl { --grid-columns: 8; grid-column: span 8; }
  .col-start-8\@xl { grid-column-start: 8; }
  .col-end-9\@xl { grid-column-end: 10; }
  .col-start-8.col-1\@xl, .col-start-8\@xl.col-1\@xl { grid-column: 8 / span 1; }
  .col-start-8.col-2\@xl, .col-start-8\@xl.col-2\@xl { grid-column: 8 / span 2; }
  .col-start-8.col-3\@xl, .col-start-8\@xl.col-3\@xl { grid-column: 8 / span 3; }
  .col-start-8.col-4\@xl, .col-start-8\@xl.col-4\@xl { grid-column: 8 / span 4; }
  .col-start-8.col-5\@xl, .col-start-8\@xl.col-5\@xl { grid-column: 8 / span 5; }
  .col-start-8.col-6\@xl, .col-start-8\@xl.col-6\@xl { grid-column: 8 / span 6; }
  .col-start-8.col-7\@xl, .col-start-8\@xl.col-7\@xl { grid-column: 8 / span 7; }
  .col-start-8.col-8\@xl, .col-start-8\@xl.col-8\@xl { grid-column: 8 / span 8; }
  .col-start-8.col-9\@xl, .col-start-8\@xl.col-9\@xl { grid-column: 8 / span 9; }
  .col-start-8.col-10\@xl, .col-start-8\@xl.col-10\@xl { grid-column: 8 / span 10; }
  .col-start-8.col-11\@xl, .col-start-8\@xl.col-11\@xl { grid-column: 8 / span 11; }
  .col-start-8.col-12\@xl, .col-start-8\@xl.col-12\@xl { grid-column: 8 / span 12; }
  .col-9\@xl { --grid-columns: 9; grid-column: span 9; }
  .col-start-9\@xl { grid-column-start: 9; }
  .col-end-10\@xl { grid-column-end: 11; }
  .col-start-9.col-1\@xl, .col-start-9\@xl.col-1\@xl { grid-column: 9 / span 1; }
  .col-start-9.col-2\@xl, .col-start-9\@xl.col-2\@xl { grid-column: 9 / span 2; }
  .col-start-9.col-3\@xl, .col-start-9\@xl.col-3\@xl { grid-column: 9 / span 3; }
  .col-start-9.col-4\@xl, .col-start-9\@xl.col-4\@xl { grid-column: 9 / span 4; }
  .col-start-9.col-5\@xl, .col-start-9\@xl.col-5\@xl { grid-column: 9 / span 5; }
  .col-start-9.col-6\@xl, .col-start-9\@xl.col-6\@xl { grid-column: 9 / span 6; }
  .col-start-9.col-7\@xl, .col-start-9\@xl.col-7\@xl { grid-column: 9 / span 7; }
  .col-start-9.col-8\@xl, .col-start-9\@xl.col-8\@xl { grid-column: 9 / span 8; }
  .col-start-9.col-9\@xl, .col-start-9\@xl.col-9\@xl { grid-column: 9 / span 9; }
  .col-start-9.col-10\@xl, .col-start-9\@xl.col-10\@xl { grid-column: 9 / span 10; }
  .col-start-9.col-11\@xl, .col-start-9\@xl.col-11\@xl { grid-column: 9 / span 11; }
  .col-start-9.col-12\@xl, .col-start-9\@xl.col-12\@xl { grid-column: 9 / span 12; }
  .col-10\@xl { --grid-columns: 10; grid-column: span 10; }
  .col-start-10\@xl { grid-column-start: 10; }
  .col-end-11\@xl { grid-column-end: 12; }
  .col-start-10.col-1\@xl, .col-start-10\@xl.col-1\@xl { grid-column: 10 / span 1; }
  .col-start-10.col-2\@xl, .col-start-10\@xl.col-2\@xl { grid-column: 10 / span 2; }
  .col-start-10.col-3\@xl, .col-start-10\@xl.col-3\@xl { grid-column: 10 / span 3; }
  .col-start-10.col-4\@xl, .col-start-10\@xl.col-4\@xl { grid-column: 10 / span 4; }
  .col-start-10.col-5\@xl, .col-start-10\@xl.col-5\@xl { grid-column: 10 / span 5; }
  .col-start-10.col-6\@xl, .col-start-10\@xl.col-6\@xl { grid-column: 10 / span 6; }
  .col-start-10.col-7\@xl, .col-start-10\@xl.col-7\@xl { grid-column: 10 / span 7; }
  .col-start-10.col-8\@xl, .col-start-10\@xl.col-8\@xl { grid-column: 10 / span 8; }
  .col-start-10.col-9\@xl, .col-start-10\@xl.col-9\@xl { grid-column: 10 / span 9; }
  .col-start-10.col-10\@xl, .col-start-10\@xl.col-10\@xl { grid-column: 10 / span 10; }
  .col-start-10.col-11\@xl, .col-start-10\@xl.col-11\@xl { grid-column: 10 / span 11; }
  .col-start-10.col-12\@xl, .col-start-10\@xl.col-12\@xl { grid-column: 10 / span 12; }
  .col-11\@xl { --grid-columns: 11; grid-column: span 11; }
  .col-start-11\@xl { grid-column-start: 11; }
  .col-end-12\@xl { grid-column-end: 13; }
  .col-start-11.col-1\@xl, .col-start-11\@xl.col-1\@xl { grid-column: 11 / span 1; }
  .col-start-11.col-2\@xl, .col-start-11\@xl.col-2\@xl { grid-column: 11 / span 2; }
  .col-start-11.col-3\@xl, .col-start-11\@xl.col-3\@xl { grid-column: 11 / span 3; }
  .col-start-11.col-4\@xl, .col-start-11\@xl.col-4\@xl { grid-column: 11 / span 4; }
  .col-start-11.col-5\@xl, .col-start-11\@xl.col-5\@xl { grid-column: 11 / span 5; }
  .col-start-11.col-6\@xl, .col-start-11\@xl.col-6\@xl { grid-column: 11 / span 6; }
  .col-start-11.col-7\@xl, .col-start-11\@xl.col-7\@xl { grid-column: 11 / span 7; }
  .col-start-11.col-8\@xl, .col-start-11\@xl.col-8\@xl { grid-column: 11 / span 8; }
  .col-start-11.col-9\@xl, .col-start-11\@xl.col-9\@xl { grid-column: 11 / span 9; }
  .col-start-11.col-10\@xl, .col-start-11\@xl.col-10\@xl { grid-column: 11 / span 10; }
  .col-start-11.col-11\@xl, .col-start-11\@xl.col-11\@xl { grid-column: 11 / span 11; }
  .col-start-11.col-12\@xl, .col-start-11\@xl.col-12\@xl { grid-column: 11 / span 12; }
  .col-12\@xl { --grid-columns: 12; grid-column: span 12; }
  .col-start-12\@xl { grid-column-start: 12; }
  .col-end-13\@xl { grid-column-end: 14; }
  .col-start-12.col-1\@xl, .col-start-12\@xl.col-1\@xl { grid-column: 12 / span 1; }
  .col-start-12.col-2\@xl, .col-start-12\@xl.col-2\@xl { grid-column: 12 / span 2; }
  .col-start-12.col-3\@xl, .col-start-12\@xl.col-3\@xl { grid-column: 12 / span 3; }
  .col-start-12.col-4\@xl, .col-start-12\@xl.col-4\@xl { grid-column: 12 / span 4; }
  .col-start-12.col-5\@xl, .col-start-12\@xl.col-5\@xl { grid-column: 12 / span 5; }
  .col-start-12.col-6\@xl, .col-start-12\@xl.col-6\@xl { grid-column: 12 / span 6; }
  .col-start-12.col-7\@xl, .col-start-12\@xl.col-7\@xl { grid-column: 12 / span 7; }
  .col-start-12.col-8\@xl, .col-start-12\@xl.col-8\@xl { grid-column: 12 / span 8; }
  .col-start-12.col-9\@xl, .col-start-12\@xl.col-9\@xl { grid-column: 12 / span 9; }
  .col-start-12.col-10\@xl, .col-start-12\@xl.col-10\@xl { grid-column: 12 / span 10; }
  .col-start-12.col-11\@xl, .col-start-12\@xl.col-11\@xl { grid-column: 12 / span 11; }
  .col-start-12.col-12\@xl, .col-start-12\@xl.col-12\@xl { grid-column: 12 / span 12; } }
@media screen and (min-width: 1520px) { .col-1\@xxl { --grid-columns: 1; grid-column: span 1; }
  .col-start-1\@xxl { grid-column-start: 1; }
  .col-end-2\@xxl { grid-column-end: 3; }
  .col-start-1.col-1\@xxl, .col-start-1\@xxl.col-1\@xxl { grid-column: 1 / span 1; }
  .col-start-1.col-2\@xxl, .col-start-1\@xxl.col-2\@xxl { grid-column: 1 / span 2; }
  .col-start-1.col-3\@xxl, .col-start-1\@xxl.col-3\@xxl { grid-column: 1 / span 3; }
  .col-start-1.col-4\@xxl, .col-start-1\@xxl.col-4\@xxl { grid-column: 1 / span 4; }
  .col-start-1.col-5\@xxl, .col-start-1\@xxl.col-5\@xxl { grid-column: 1 / span 5; }
  .col-start-1.col-6\@xxl, .col-start-1\@xxl.col-6\@xxl { grid-column: 1 / span 6; }
  .col-start-1.col-7\@xxl, .col-start-1\@xxl.col-7\@xxl { grid-column: 1 / span 7; }
  .col-start-1.col-8\@xxl, .col-start-1\@xxl.col-8\@xxl { grid-column: 1 / span 8; }
  .col-start-1.col-9\@xxl, .col-start-1\@xxl.col-9\@xxl { grid-column: 1 / span 9; }
  .col-start-1.col-10\@xxl, .col-start-1\@xxl.col-10\@xxl { grid-column: 1 / span 10; }
  .col-start-1.col-11\@xxl, .col-start-1\@xxl.col-11\@xxl { grid-column: 1 / span 11; }
  .col-start-1.col-12\@xxl, .col-start-1\@xxl.col-12\@xxl { grid-column: 1 / span 12; }
  .col-2\@xxl { --grid-columns: 2; grid-column: span 2; }
  .col-start-2\@xxl { grid-column-start: 2; }
  .col-end-3\@xxl { grid-column-end: 4; }
  .col-start-2.col-1\@xxl, .col-start-2\@xxl.col-1\@xxl { grid-column: 2 / span 1; }
  .col-start-2.col-2\@xxl, .col-start-2\@xxl.col-2\@xxl { grid-column: 2 / span 2; }
  .col-start-2.col-3\@xxl, .col-start-2\@xxl.col-3\@xxl { grid-column: 2 / span 3; }
  .col-start-2.col-4\@xxl, .col-start-2\@xxl.col-4\@xxl { grid-column: 2 / span 4; }
  .col-start-2.col-5\@xxl, .col-start-2\@xxl.col-5\@xxl { grid-column: 2 / span 5; }
  .col-start-2.col-6\@xxl, .col-start-2\@xxl.col-6\@xxl { grid-column: 2 / span 6; }
  .col-start-2.col-7\@xxl, .col-start-2\@xxl.col-7\@xxl { grid-column: 2 / span 7; }
  .col-start-2.col-8\@xxl, .col-start-2\@xxl.col-8\@xxl { grid-column: 2 / span 8; }
  .col-start-2.col-9\@xxl, .col-start-2\@xxl.col-9\@xxl { grid-column: 2 / span 9; }
  .col-start-2.col-10\@xxl, .col-start-2\@xxl.col-10\@xxl { grid-column: 2 / span 10; }
  .col-start-2.col-11\@xxl, .col-start-2\@xxl.col-11\@xxl { grid-column: 2 / span 11; }
  .col-start-2.col-12\@xxl, .col-start-2\@xxl.col-12\@xxl { grid-column: 2 / span 12; }
  .col-3\@xxl { --grid-columns: 3; grid-column: span 3; }
  .col-start-3\@xxl { grid-column-start: 3; }
  .col-end-4\@xxl { grid-column-end: 5; }
  .col-start-3.col-1\@xxl, .col-start-3\@xxl.col-1\@xxl { grid-column: 3 / span 1; }
  .col-start-3.col-2\@xxl, .col-start-3\@xxl.col-2\@xxl { grid-column: 3 / span 2; }
  .col-start-3.col-3\@xxl, .col-start-3\@xxl.col-3\@xxl { grid-column: 3 / span 3; }
  .col-start-3.col-4\@xxl, .col-start-3\@xxl.col-4\@xxl { grid-column: 3 / span 4; }
  .col-start-3.col-5\@xxl, .col-start-3\@xxl.col-5\@xxl { grid-column: 3 / span 5; }
  .col-start-3.col-6\@xxl, .col-start-3\@xxl.col-6\@xxl { grid-column: 3 / span 6; }
  .col-start-3.col-7\@xxl, .col-start-3\@xxl.col-7\@xxl { grid-column: 3 / span 7; }
  .col-start-3.col-8\@xxl, .col-start-3\@xxl.col-8\@xxl { grid-column: 3 / span 8; }
  .col-start-3.col-9\@xxl, .col-start-3\@xxl.col-9\@xxl { grid-column: 3 / span 9; }
  .col-start-3.col-10\@xxl, .col-start-3\@xxl.col-10\@xxl { grid-column: 3 / span 10; }
  .col-start-3.col-11\@xxl, .col-start-3\@xxl.col-11\@xxl { grid-column: 3 / span 11; }
  .col-start-3.col-12\@xxl, .col-start-3\@xxl.col-12\@xxl { grid-column: 3 / span 12; }
  .col-4\@xxl { --grid-columns: 4; grid-column: span 4; }
  .col-start-4\@xxl { grid-column-start: 4; }
  .col-end-5\@xxl { grid-column-end: 6; }
  .col-start-4.col-1\@xxl, .col-start-4\@xxl.col-1\@xxl { grid-column: 4 / span 1; }
  .col-start-4.col-2\@xxl, .col-start-4\@xxl.col-2\@xxl { grid-column: 4 / span 2; }
  .col-start-4.col-3\@xxl, .col-start-4\@xxl.col-3\@xxl { grid-column: 4 / span 3; }
  .col-start-4.col-4\@xxl, .col-start-4\@xxl.col-4\@xxl { grid-column: 4 / span 4; }
  .col-start-4.col-5\@xxl, .col-start-4\@xxl.col-5\@xxl { grid-column: 4 / span 5; }
  .col-start-4.col-6\@xxl, .col-start-4\@xxl.col-6\@xxl { grid-column: 4 / span 6; }
  .col-start-4.col-7\@xxl, .col-start-4\@xxl.col-7\@xxl { grid-column: 4 / span 7; }
  .col-start-4.col-8\@xxl, .col-start-4\@xxl.col-8\@xxl { grid-column: 4 / span 8; }
  .col-start-4.col-9\@xxl, .col-start-4\@xxl.col-9\@xxl { grid-column: 4 / span 9; }
  .col-start-4.col-10\@xxl, .col-start-4\@xxl.col-10\@xxl { grid-column: 4 / span 10; }
  .col-start-4.col-11\@xxl, .col-start-4\@xxl.col-11\@xxl { grid-column: 4 / span 11; }
  .col-start-4.col-12\@xxl, .col-start-4\@xxl.col-12\@xxl { grid-column: 4 / span 12; }
  .col-5\@xxl { --grid-columns: 5; grid-column: span 5; }
  .col-start-5\@xxl { grid-column-start: 5; }
  .col-end-6\@xxl { grid-column-end: 7; }
  .col-start-5.col-1\@xxl, .col-start-5\@xxl.col-1\@xxl { grid-column: 5 / span 1; }
  .col-start-5.col-2\@xxl, .col-start-5\@xxl.col-2\@xxl { grid-column: 5 / span 2; }
  .col-start-5.col-3\@xxl, .col-start-5\@xxl.col-3\@xxl { grid-column: 5 / span 3; }
  .col-start-5.col-4\@xxl, .col-start-5\@xxl.col-4\@xxl { grid-column: 5 / span 4; }
  .col-start-5.col-5\@xxl, .col-start-5\@xxl.col-5\@xxl { grid-column: 5 / span 5; }
  .col-start-5.col-6\@xxl, .col-start-5\@xxl.col-6\@xxl { grid-column: 5 / span 6; }
  .col-start-5.col-7\@xxl, .col-start-5\@xxl.col-7\@xxl { grid-column: 5 / span 7; }
  .col-start-5.col-8\@xxl, .col-start-5\@xxl.col-8\@xxl { grid-column: 5 / span 8; }
  .col-start-5.col-9\@xxl, .col-start-5\@xxl.col-9\@xxl { grid-column: 5 / span 9; }
  .col-start-5.col-10\@xxl, .col-start-5\@xxl.col-10\@xxl { grid-column: 5 / span 10; }
  .col-start-5.col-11\@xxl, .col-start-5\@xxl.col-11\@xxl { grid-column: 5 / span 11; }
  .col-start-5.col-12\@xxl, .col-start-5\@xxl.col-12\@xxl { grid-column: 5 / span 12; }
  .col-6\@xxl { --grid-columns: 6; grid-column: span 6; }
  .col-start-6\@xxl { grid-column-start: 6; }
  .col-end-7\@xxl { grid-column-end: 8; }
  .col-start-6.col-1\@xxl, .col-start-6\@xxl.col-1\@xxl { grid-column: 6 / span 1; }
  .col-start-6.col-2\@xxl, .col-start-6\@xxl.col-2\@xxl { grid-column: 6 / span 2; }
  .col-start-6.col-3\@xxl, .col-start-6\@xxl.col-3\@xxl { grid-column: 6 / span 3; }
  .col-start-6.col-4\@xxl, .col-start-6\@xxl.col-4\@xxl { grid-column: 6 / span 4; }
  .col-start-6.col-5\@xxl, .col-start-6\@xxl.col-5\@xxl { grid-column: 6 / span 5; }
  .col-start-6.col-6\@xxl, .col-start-6\@xxl.col-6\@xxl { grid-column: 6 / span 6; }
  .col-start-6.col-7\@xxl, .col-start-6\@xxl.col-7\@xxl { grid-column: 6 / span 7; }
  .col-start-6.col-8\@xxl, .col-start-6\@xxl.col-8\@xxl { grid-column: 6 / span 8; }
  .col-start-6.col-9\@xxl, .col-start-6\@xxl.col-9\@xxl { grid-column: 6 / span 9; }
  .col-start-6.col-10\@xxl, .col-start-6\@xxl.col-10\@xxl { grid-column: 6 / span 10; }
  .col-start-6.col-11\@xxl, .col-start-6\@xxl.col-11\@xxl { grid-column: 6 / span 11; }
  .col-start-6.col-12\@xxl, .col-start-6\@xxl.col-12\@xxl { grid-column: 6 / span 12; }
  .col-7\@xxl { --grid-columns: 7; grid-column: span 7; }
  .col-start-7\@xxl { grid-column-start: 7; }
  .col-end-8\@xxl { grid-column-end: 9; }
  .col-start-7.col-1\@xxl, .col-start-7\@xxl.col-1\@xxl { grid-column: 7 / span 1; }
  .col-start-7.col-2\@xxl, .col-start-7\@xxl.col-2\@xxl { grid-column: 7 / span 2; }
  .col-start-7.col-3\@xxl, .col-start-7\@xxl.col-3\@xxl { grid-column: 7 / span 3; }
  .col-start-7.col-4\@xxl, .col-start-7\@xxl.col-4\@xxl { grid-column: 7 / span 4; }
  .col-start-7.col-5\@xxl, .col-start-7\@xxl.col-5\@xxl { grid-column: 7 / span 5; }
  .col-start-7.col-6\@xxl, .col-start-7\@xxl.col-6\@xxl { grid-column: 7 / span 6; }
  .col-start-7.col-7\@xxl, .col-start-7\@xxl.col-7\@xxl { grid-column: 7 / span 7; }
  .col-start-7.col-8\@xxl, .col-start-7\@xxl.col-8\@xxl { grid-column: 7 / span 8; }
  .col-start-7.col-9\@xxl, .col-start-7\@xxl.col-9\@xxl { grid-column: 7 / span 9; }
  .col-start-7.col-10\@xxl, .col-start-7\@xxl.col-10\@xxl { grid-column: 7 / span 10; }
  .col-start-7.col-11\@xxl, .col-start-7\@xxl.col-11\@xxl { grid-column: 7 / span 11; }
  .col-start-7.col-12\@xxl, .col-start-7\@xxl.col-12\@xxl { grid-column: 7 / span 12; }
  .col-8\@xxl { --grid-columns: 8; grid-column: span 8; }
  .col-start-8\@xxl { grid-column-start: 8; }
  .col-end-9\@xxl { grid-column-end: 10; }
  .col-start-8.col-1\@xxl, .col-start-8\@xxl.col-1\@xxl { grid-column: 8 / span 1; }
  .col-start-8.col-2\@xxl, .col-start-8\@xxl.col-2\@xxl { grid-column: 8 / span 2; }
  .col-start-8.col-3\@xxl, .col-start-8\@xxl.col-3\@xxl { grid-column: 8 / span 3; }
  .col-start-8.col-4\@xxl, .col-start-8\@xxl.col-4\@xxl { grid-column: 8 / span 4; }
  .col-start-8.col-5\@xxl, .col-start-8\@xxl.col-5\@xxl { grid-column: 8 / span 5; }
  .col-start-8.col-6\@xxl, .col-start-8\@xxl.col-6\@xxl { grid-column: 8 / span 6; }
  .col-start-8.col-7\@xxl, .col-start-8\@xxl.col-7\@xxl { grid-column: 8 / span 7; }
  .col-start-8.col-8\@xxl, .col-start-8\@xxl.col-8\@xxl { grid-column: 8 / span 8; }
  .col-start-8.col-9\@xxl, .col-start-8\@xxl.col-9\@xxl { grid-column: 8 / span 9; }
  .col-start-8.col-10\@xxl, .col-start-8\@xxl.col-10\@xxl { grid-column: 8 / span 10; }
  .col-start-8.col-11\@xxl, .col-start-8\@xxl.col-11\@xxl { grid-column: 8 / span 11; }
  .col-start-8.col-12\@xxl, .col-start-8\@xxl.col-12\@xxl { grid-column: 8 / span 12; }
  .col-9\@xxl { --grid-columns: 9; grid-column: span 9; }
  .col-start-9\@xxl { grid-column-start: 9; }
  .col-end-10\@xxl { grid-column-end: 11; }
  .col-start-9.col-1\@xxl, .col-start-9\@xxl.col-1\@xxl { grid-column: 9 / span 1; }
  .col-start-9.col-2\@xxl, .col-start-9\@xxl.col-2\@xxl { grid-column: 9 / span 2; }
  .col-start-9.col-3\@xxl, .col-start-9\@xxl.col-3\@xxl { grid-column: 9 / span 3; }
  .col-start-9.col-4\@xxl, .col-start-9\@xxl.col-4\@xxl { grid-column: 9 / span 4; }
  .col-start-9.col-5\@xxl, .col-start-9\@xxl.col-5\@xxl { grid-column: 9 / span 5; }
  .col-start-9.col-6\@xxl, .col-start-9\@xxl.col-6\@xxl { grid-column: 9 / span 6; }
  .col-start-9.col-7\@xxl, .col-start-9\@xxl.col-7\@xxl { grid-column: 9 / span 7; }
  .col-start-9.col-8\@xxl, .col-start-9\@xxl.col-8\@xxl { grid-column: 9 / span 8; }
  .col-start-9.col-9\@xxl, .col-start-9\@xxl.col-9\@xxl { grid-column: 9 / span 9; }
  .col-start-9.col-10\@xxl, .col-start-9\@xxl.col-10\@xxl { grid-column: 9 / span 10; }
  .col-start-9.col-11\@xxl, .col-start-9\@xxl.col-11\@xxl { grid-column: 9 / span 11; }
  .col-start-9.col-12\@xxl, .col-start-9\@xxl.col-12\@xxl { grid-column: 9 / span 12; }
  .col-10\@xxl { --grid-columns: 10; grid-column: span 10; }
  .col-start-10\@xxl { grid-column-start: 10; }
  .col-end-11\@xxl { grid-column-end: 12; }
  .col-start-10.col-1\@xxl, .col-start-10\@xxl.col-1\@xxl { grid-column: 10 / span 1; }
  .col-start-10.col-2\@xxl, .col-start-10\@xxl.col-2\@xxl { grid-column: 10 / span 2; }
  .col-start-10.col-3\@xxl, .col-start-10\@xxl.col-3\@xxl { grid-column: 10 / span 3; }
  .col-start-10.col-4\@xxl, .col-start-10\@xxl.col-4\@xxl { grid-column: 10 / span 4; }
  .col-start-10.col-5\@xxl, .col-start-10\@xxl.col-5\@xxl { grid-column: 10 / span 5; }
  .col-start-10.col-6\@xxl, .col-start-10\@xxl.col-6\@xxl { grid-column: 10 / span 6; }
  .col-start-10.col-7\@xxl, .col-start-10\@xxl.col-7\@xxl { grid-column: 10 / span 7; }
  .col-start-10.col-8\@xxl, .col-start-10\@xxl.col-8\@xxl { grid-column: 10 / span 8; }
  .col-start-10.col-9\@xxl, .col-start-10\@xxl.col-9\@xxl { grid-column: 10 / span 9; }
  .col-start-10.col-10\@xxl, .col-start-10\@xxl.col-10\@xxl { grid-column: 10 / span 10; }
  .col-start-10.col-11\@xxl, .col-start-10\@xxl.col-11\@xxl { grid-column: 10 / span 11; }
  .col-start-10.col-12\@xxl, .col-start-10\@xxl.col-12\@xxl { grid-column: 10 / span 12; }
  .col-11\@xxl { --grid-columns: 11; grid-column: span 11; }
  .col-start-11\@xxl { grid-column-start: 11; }
  .col-end-12\@xxl { grid-column-end: 13; }
  .col-start-11.col-1\@xxl, .col-start-11\@xxl.col-1\@xxl { grid-column: 11 / span 1; }
  .col-start-11.col-2\@xxl, .col-start-11\@xxl.col-2\@xxl { grid-column: 11 / span 2; }
  .col-start-11.col-3\@xxl, .col-start-11\@xxl.col-3\@xxl { grid-column: 11 / span 3; }
  .col-start-11.col-4\@xxl, .col-start-11\@xxl.col-4\@xxl { grid-column: 11 / span 4; }
  .col-start-11.col-5\@xxl, .col-start-11\@xxl.col-5\@xxl { grid-column: 11 / span 5; }
  .col-start-11.col-6\@xxl, .col-start-11\@xxl.col-6\@xxl { grid-column: 11 / span 6; }
  .col-start-11.col-7\@xxl, .col-start-11\@xxl.col-7\@xxl { grid-column: 11 / span 7; }
  .col-start-11.col-8\@xxl, .col-start-11\@xxl.col-8\@xxl { grid-column: 11 / span 8; }
  .col-start-11.col-9\@xxl, .col-start-11\@xxl.col-9\@xxl { grid-column: 11 / span 9; }
  .col-start-11.col-10\@xxl, .col-start-11\@xxl.col-10\@xxl { grid-column: 11 / span 10; }
  .col-start-11.col-11\@xxl, .col-start-11\@xxl.col-11\@xxl { grid-column: 11 / span 11; }
  .col-start-11.col-12\@xxl, .col-start-11\@xxl.col-12\@xxl { grid-column: 11 / span 12; }
  .col-12\@xxl { --grid-columns: 12; grid-column: span 12; }
  .col-start-12\@xxl { grid-column-start: 12; }
  .col-end-13\@xxl { grid-column-end: 14; }
  .col-start-12.col-1\@xxl, .col-start-12\@xxl.col-1\@xxl { grid-column: 12 / span 1; }
  .col-start-12.col-2\@xxl, .col-start-12\@xxl.col-2\@xxl { grid-column: 12 / span 2; }
  .col-start-12.col-3\@xxl, .col-start-12\@xxl.col-3\@xxl { grid-column: 12 / span 3; }
  .col-start-12.col-4\@xxl, .col-start-12\@xxl.col-4\@xxl { grid-column: 12 / span 4; }
  .col-start-12.col-5\@xxl, .col-start-12\@xxl.col-5\@xxl { grid-column: 12 / span 5; }
  .col-start-12.col-6\@xxl, .col-start-12\@xxl.col-6\@xxl { grid-column: 12 / span 6; }
  .col-start-12.col-7\@xxl, .col-start-12\@xxl.col-7\@xxl { grid-column: 12 / span 7; }
  .col-start-12.col-8\@xxl, .col-start-12\@xxl.col-8\@xxl { grid-column: 12 / span 8; }
  .col-start-12.col-9\@xxl, .col-start-12\@xxl.col-9\@xxl { grid-column: 12 / span 9; }
  .col-start-12.col-10\@xxl, .col-start-12\@xxl.col-10\@xxl { grid-column: 12 / span 10; }
  .col-start-12.col-11\@xxl, .col-start-12\@xxl.col-11\@xxl { grid-column: 12 / span 11; }
  .col-start-12.col-12\@xxl, .col-start-12\@xxl.col-12\@xxl { grid-column: 12 / span 12; } }
:root { --sans: "SuisseIntl", Helvetica, Arial, sans-serif; --serif: "SuisseIntl Works", Georgia, serif; --mono: "SuisseIntl Mono", Courier, monospace; --weight-400: 400; --weight-500: 500; --weight-600: 600; }

.f-main-title { font-family: var(--sans); font-weight: 500; font-size: 36px; line-height: 1; letter-spacing: -0.03em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-main-title b, .f-main-title strong { font-weight: var(--weight-600); }
.f-main-title i, .f-main-title em { font-style: italic; }
@media screen and (min-width: 650px) { .f-main-title { font-size: 96px; } }
@media screen and (min-width: 990px) { .f-main-title { font-size: 120px; font-weight: 400; } }
@media screen and (min-width: 1300px) { .f-main-title { font-size: 144px; } }

.f-main-title-medium { font-family: var(--sans); font-weight: 500; font-size: 36px; line-height: 1; letter-spacing: -0.03em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-main-title-medium b, .f-main-title-medium strong { font-weight: var(--weight-600); }
.f-main-title-medium i, .f-main-title-medium em { font-style: italic; }
@media screen and (min-width: 650px) { .f-main-title-medium { font-size: 48px; } }
@media screen and (min-width: 990px) { .f-main-title-medium { font-size: 60px; } }
@media screen and (min-width: 1300px) { .f-main-title-medium { font-size: 84px; } }

.f-subhead { font-family: var(--sans); font-weight: 500; font-size: 30px; line-height: 1.25; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-subhead b, .f-subhead strong { font-weight: var(--weight-600); }
.f-subhead i, .f-subhead em { font-style: italic; }
@media screen and (min-width: 990px) { .f-subhead { font-size: 36px; } }
@media screen and (min-width: 1300px) { .f-subhead { font-size: 42px; } }

.f-h1 { font-family: var(--sans); font-weight: 600; font-size: 28px; line-height: 1.25; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h1 b, .f-h1 strong { font-weight: var(--weight-600); }
.f-h1 i, .f-h1 em { font-style: italic; }
@media screen and (min-width: 650px) { .f-h1 { font-size: 36px; } }
@media screen and (min-width: 990px) { .f-h1 { font-size: 48px; } }
@media screen and (min-width: 1300px) { .f-h1 { font-size: 60px; } }

.f-h1-a { font-family: var(--sans); font-weight: 600; font-size: 28px; line-height: 1.35; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h1-a b, .f-h1-a strong { font-weight: var(--weight-600); }
.f-h1-a i, .f-h1-a em { font-style: italic; }
@media screen and (min-width: 650px) { .f-h1-a { font-size: 36px; } }
@media screen and (min-width: 1300px) { .f-h1-a { font-size: 48px; } }

.f-h2 { font-family: var(--sans); font-weight: 500; font-size: 36px; line-height: 1.25; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h2 b, .f-h2 strong { font-weight: var(--weight-600); }
.f-h2 i, .f-h2 em { font-style: italic; }
@media screen and (min-width: 990px) { .f-h2 { font-size: 48px; } }
@media screen and (min-width: 1300px) { .f-h2 { font-size: 60px; } }

.f-h2-a { font-family: var(--sans); font-weight: 500; font-size: 24px; line-height: 1.25; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h2-a b, .f-h2-a strong { font-weight: var(--weight-600); }
.f-h2-a i, .f-h2-a em { font-style: italic; }
@media screen and (min-width: 990px) { .f-h2-a { font-size: 30px; } }
@media screen and (min-width: 1300px) { .f-h2-a { font-size: 36px; } }

.f-h2-a2 { font-family: var(--sans); font-weight: 500; font-size: 24px; line-height: 1.25; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h2-a2 b, .f-h2-a2 strong { font-weight: var(--weight-600); }
.f-h2-a2 i, .f-h2-a2 em { font-style: italic; }
@media screen and (min-width: 1300px) { .f-h2-a2 { font-size: 30px; } }

.f-h3 { font-family: var(--sans); font-weight: 500; font-size: 18px; line-height: 1.2; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h3 b, .f-h3 strong { font-weight: var(--weight-600); }
.f-h3 i, .f-h3 em { font-style: italic; }
@media screen and (min-width: 650px) { .f-h3 { font-size: 16px; } }
@media screen and (min-width: 990px) { .f-h3 { font-size: 18px; } }
@media screen and (min-width: 1300px) { .f-h3 { font-size: 20px; } }

.f-h3-a { font-family: var(--sans); font-weight: 700; font-size: 24px; line-height: 1.2; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h3-a b, .f-h3-a strong { font-weight: var(--weight-600); }
.f-h3-a i, .f-h3-a em { font-style: italic; }
@media screen and (min-width: 1300px) { .f-h3-a { font-size: 28px; } }

.f-h4 { font-family: var(--sans); font-weight: 400; font-size: 14px; line-height: 1.2; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-h4 b, .f-h4 strong { font-weight: var(--weight-600); }
.f-h4 i, .f-h4 em { font-style: italic; }
@media screen and (min-width: 650px) { .f-h4 { font-size: 16px; } }

.footer li, .mixin-table tbody, .card .card-content .content-box .tagline, .card-employee .card-content h2, .button, .header li, .event-list .event .text-block h3, .blog__teaser p { font-family: var(--sans); font-size: 18px; line-height: 1.35; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.footer li b, .mixin-table tbody b, .card .card-content .content-box .tagline b, .card-employee .card-content h2 b, .button b, .header li b, .event-list .event .text-block h3 b, .blog__teaser p b, .footer li strong, .mixin-table tbody strong, .card .card-content .content-box .tagline strong, .card-employee .card-content h2 strong, .button strong, .header li strong, .event-list .event .text-block h3 strong, .blog__teaser p strong { font-weight: var(--weight-600); }
.footer li i, .mixin-table tbody i, .card .card-content .content-box .tagline i, .card-employee .card-content h2 i, .button i, .header li i, .event-list .event .text-block h3 i, .blog__teaser p i, .footer li em, .mixin-table tbody em, .card .card-content .content-box .tagline em, .card-employee .card-content h2 em, .button em, .header li em, .event-list .event .text-block h3 em, .blog__teaser p em { font-style: italic; }
@media screen and (min-width: 650px) { .footer li, .mixin-table tbody, .card .card-content .content-box .tagline, .card-employee .card-content h2, .button, .header li, .event-list .event .text-block h3, .blog__teaser p { font-size: 16px; } }
@media screen and (min-width: 990px) { .footer li, .mixin-table tbody, .card .card-content .content-box .tagline, .card-employee .card-content h2, .button, .header li, .event-list .event .text-block h3, .blog__teaser p { font-size: 18px; } }
@media screen and (min-width: 1300px) { .footer li, .mixin-table tbody, .card .card-content .content-box .tagline, .card-employee .card-content h2, .button, .header li, .event-list .event .text-block h3, .blog__teaser p { font-size: 20px; } }

.f-body { font-family: var(--sans); font-size: 18px; line-height: 1.35; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-body b, .f-body strong { font-weight: var(--weight-600); }
.f-body i, .f-body em { font-style: italic; }
@media screen and (min-width: 650px) { .f-body { font-size: 16px; } }
@media screen and (min-width: 990px) { .f-body { font-size: 18px; } }
@media screen and (min-width: 1300px) { .f-body { font-size: 20px; } }

.f-body-mono { font-family: var(--mono); font-size: 18px; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; line-height: 1.35; letter-spacing: -0.05em; }
.f-body-mono b, .f-body-mono strong { font-weight: var(--weight-600); }
.f-body-mono i, .f-body-mono em { font-style: italic; }
@media screen and (min-width: 650px) { .f-body-mono { font-size: 16px; } }
@media screen and (min-width: 990px) { .f-body-mono { font-size: 18px; } }
@media screen and (min-width: 1300px) { .f-body-mono { font-size: 20px; } }

.card .card-content .action-box p, .card-employee .card-content .title, .card-employee .card-content h3 { font-family: var(--sans); font-size: 14px; line-height: 1.25; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.card .card-content .action-box p b, .card-employee .card-content .title b, .card-employee .card-content h3 b, .card .card-content .action-box p strong, .card-employee .card-content .title strong, .card-employee .card-content h3 strong { font-weight: var(--weight-600); }
.card .card-content .action-box p i, .card-employee .card-content .title i, .card-employee .card-content h3 i, .card .card-content .action-box p em, .card-employee .card-content .title em, .card-employee .card-content h3 em { font-style: italic; }
@media screen and (min-width: 650px) { .card .card-content .action-box p, .card-employee .card-content .title, .card-employee .card-content h3 { font-size: 12px; } }
@media screen and (min-width: 990px) { .card .card-content .action-box p, .card-employee .card-content .title, .card-employee .card-content h3 { font-size: 14px; } }
@media screen and (min-width: 1300px) { .card .card-content .action-box p, .card-employee .card-content .title, .card-employee .card-content h3 { font-size: 16px; } }

.f-body-small { font-family: var(--sans); font-size: 14px; line-height: 1.25; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-body-small b, .f-body-small strong { font-weight: var(--weight-600); }
.f-body-small i, .f-body-small em { font-style: italic; }
@media screen and (min-width: 650px) { .f-body-small { font-size: 12px; } }
@media screen and (min-width: 990px) { .f-body-small { font-size: 14px; } }
@media screen and (min-width: 1300px) { .f-body-small { font-size: 16px; } }

.mixin-table thead, .props-table thead { font-family: var(--sans); font-size: 12px; line-height: 1.2; font-weight: 400; }
.mixin-table thead b, .props-table thead b, .mixin-table thead strong, .props-table thead strong { font-weight: var(--weight-600); }
.mixin-table thead i, .props-table thead i, .mixin-table thead em, .props-table thead em { font-style: italic; }

.f-ui { font-family: var(--sans); font-size: 12px; line-height: 1.2; font-weight: 400; }
.f-ui b, .f-ui strong { font-weight: var(--weight-600); }
.f-ui i, .f-ui em { font-style: italic; }

.props-table tbody { font-family: var(--mono); font-size: 14px; line-height: 1.2; font-weight: 400; }
.props-table tbody b, .props-table tbody strong { font-weight: var(--weight-600); }
.props-table tbody i, .props-table tbody em { font-style: italic; }

.f-code { font-family: var(--mono); font-size: 14px; line-height: 1.2; font-weight: 400; }
.f-code b, .f-code strong { font-weight: var(--weight-600); }
.f-code i, .f-code em { font-style: italic; }

.f-card-title-large { font-family: var(--sans); font-weight: 400; font-size: 28px; line-height: 1.25; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.f-card-title-large b, .f-card-title-large strong { font-weight: var(--weight-600); }
.f-card-title-large i, .f-card-title-large em { font-style: italic; }
@media screen and (min-width: 650px) { .f-card-title-large { font-size: 36px; } }
@media screen and (min-width: 990px) { .f-card-title-large { font-size: 48px; } }
@media screen and (min-width: 1300px) { .f-card-title-large { font-size: 60px; } }

/* generate responsive spacing placeholders and classes */
.mt-outer-1 { margin-top: var(--spacing-outer-1); }

.mb-outer-1 { margin-bottom: var(--spacing-outer-1); }

.ml-outer-1 { margin-left: var(--spacing-outer-1); }

.mr-outer-1 { margin-right: var(--spacing-outer-1); }

.m-outer-1 { margin: var(--spacing-outer-1); }

.mx-outer-1 { margin-right: var(--spacing-outer-1); margin-left: var(--spacing-outer-1); }

.my-outer-1 { margin-top: var(--spacing-outer-1); margin-bottom: var(--spacing-outer-1); }

.pt-outer-1 { padding-top: var(--spacing-outer-1); }

.pb-outer-1 { padding-bottom: var(--spacing-outer-1); }

.pl-outer-1 { padding-left: var(--spacing-outer-1); }

.pr-outer-1 { padding-right: var(--spacing-outer-1); }

.p-outer-1 { padding: var(--spacing-outer-1); }

.px-outer-1 { padding-right: var(--spacing-outer-1); padding-left: var(--spacing-outer-1); }

.py-outer-1 { padding-top: var(--spacing-outer-1); padding-bottom: var(--spacing-outer-1); }

.top-outer-1 { top: var(--spacing-outer-1); }

.bottom-outer-1 { bottom: var(--spacing-outer-1); }

.left-outer-1 { left: var(--spacing-outer-1); }

.right-outer-1 { right: var(--spacing-outer-1); }

.inset-outer-1 { inset: var(--spacing-outer-1); }

.inset-x-outer-1 { inset-x: var(--spacing-outer-1); }

.inset-y-outer-1 { inset-y: var(--spacing-outer-1); }

.gap-outer-1 { gap: var(--spacing-outer-1); }

.gap-x-outer-1 { column-gap: var(--spacing-outer-1); }

.gap-y-outer-1 { row-gap: var(--spacing-outer-1); }

.-mt-outer-1 { margin-top: calc(var(--spacing-outer-1) * -1); }

.-mb-outer-1 { margin-bottom: calc(var(--spacing-outer-1) * -1); }

.-ml-outer-1 { margin-left: calc(var(--spacing-outer-1) * -1); }

.-mr-outer-1 { margin-right: calc(var(--spacing-outer-1) * -1); }

.-m-outer-1 { margin: calc(var(--spacing-outer-1) * -1); }

.-mx-outer-1 { margin-right: calc(var(--spacing-outer-1) * -1); margin-left: calc(var(--spacing-outer-1) * -1); }

.-my-outer-1 { margin-top: calc(var(--spacing-outer-1) * -1); margin-bottom: calc(var(--spacing-outer-1) * -1); }

.-top-outer-1 { top: calc(var(--spacing-outer-1) * -1); }

.-bottom-outer-1 { bottom: calc(var(--spacing-outer-1) * -1); }

.-left-outer-1 { left: calc(var(--spacing-outer-1) * -1); }

.-right-outer-1 { right: calc(var(--spacing-outer-1) * -1); }

.-inset-outer-1 { inset: calc(var(--spacing-outer-1) * -1); }

.-inset-x-outer-1 { inset-x: calc(var(--spacing-outer-1) * -1); }

.-inset-y-outer-1 { inset-y: calc(var(--spacing-outer-1) * -1); }

/* generate responsive spacing placeholders and classes */
.mt-inner-1 { margin-top: var(--spacing-inner-1); }

.mb-inner-1 { margin-bottom: var(--spacing-inner-1); }

.ml-inner-1 { margin-left: var(--spacing-inner-1); }

.mr-inner-1 { margin-right: var(--spacing-inner-1); }

.m-inner-1 { margin: var(--spacing-inner-1); }

.mx-inner-1 { margin-right: var(--spacing-inner-1); margin-left: var(--spacing-inner-1); }

.my-inner-1 { margin-top: var(--spacing-inner-1); margin-bottom: var(--spacing-inner-1); }

.pt-inner-1 { padding-top: var(--spacing-inner-1); }

.pb-inner-1 { padding-bottom: var(--spacing-inner-1); }

.pl-inner-1 { padding-left: var(--spacing-inner-1); }

.pr-inner-1 { padding-right: var(--spacing-inner-1); }

.p-inner-1 { padding: var(--spacing-inner-1); }

.px-inner-1 { padding-right: var(--spacing-inner-1); padding-left: var(--spacing-inner-1); }

.py-inner-1 { padding-top: var(--spacing-inner-1); padding-bottom: var(--spacing-inner-1); }

.top-inner-1 { top: var(--spacing-inner-1); }

.bottom-inner-1 { bottom: var(--spacing-inner-1); }

.left-inner-1 { left: var(--spacing-inner-1); }

.right-inner-1 { right: var(--spacing-inner-1); }

.inset-inner-1 { inset: var(--spacing-inner-1); }

.inset-x-inner-1 { inset-x: var(--spacing-inner-1); }

.inset-y-inner-1 { inset-y: var(--spacing-inner-1); }

.gap-inner-1 { gap: var(--spacing-inner-1); }

.gap-x-inner-1 { column-gap: var(--spacing-inner-1); }

.gap-y-inner-1 { row-gap: var(--spacing-inner-1); }

.-mt-inner-1 { margin-top: calc(var(--spacing-inner-1) * -1); }

.-mb-inner-1 { margin-bottom: calc(var(--spacing-inner-1) * -1); }

.-ml-inner-1 { margin-left: calc(var(--spacing-inner-1) * -1); }

.-mr-inner-1 { margin-right: calc(var(--spacing-inner-1) * -1); }

.-m-inner-1 { margin: calc(var(--spacing-inner-1) * -1); }

.-mx-inner-1 { margin-right: calc(var(--spacing-inner-1) * -1); margin-left: calc(var(--spacing-inner-1) * -1); }

.-my-inner-1 { margin-top: calc(var(--spacing-inner-1) * -1); margin-bottom: calc(var(--spacing-inner-1) * -1); }

.-top-inner-1 { top: calc(var(--spacing-inner-1) * -1); }

.-bottom-inner-1 { bottom: calc(var(--spacing-inner-1) * -1); }

.-left-inner-1 { left: calc(var(--spacing-inner-1) * -1); }

.-right-inner-1 { right: calc(var(--spacing-inner-1) * -1); }

.-inset-inner-1 { inset: calc(var(--spacing-inner-1) * -1); }

.-inset-x-inner-1 { inset-x: calc(var(--spacing-inner-1) * -1); }

.-inset-y-inner-1 { inset-y: calc(var(--spacing-inner-1) * -1); }

/* generate responsive spacing placeholders and classes */
.mt-inner-2 { margin-top: var(--spacing-inner-2); }

.mb-inner-2 { margin-bottom: var(--spacing-inner-2); }

.ml-inner-2 { margin-left: var(--spacing-inner-2); }

.mr-inner-2 { margin-right: var(--spacing-inner-2); }

.m-inner-2 { margin: var(--spacing-inner-2); }

.mx-inner-2 { margin-right: var(--spacing-inner-2); margin-left: var(--spacing-inner-2); }

.my-inner-2 { margin-top: var(--spacing-inner-2); margin-bottom: var(--spacing-inner-2); }

.pt-inner-2 { padding-top: var(--spacing-inner-2); }

.pb-inner-2 { padding-bottom: var(--spacing-inner-2); }

.pl-inner-2 { padding-left: var(--spacing-inner-2); }

.pr-inner-2 { padding-right: var(--spacing-inner-2); }

.p-inner-2 { padding: var(--spacing-inner-2); }

.px-inner-2 { padding-right: var(--spacing-inner-2); padding-left: var(--spacing-inner-2); }

.py-inner-2 { padding-top: var(--spacing-inner-2); padding-bottom: var(--spacing-inner-2); }

.top-inner-2 { top: var(--spacing-inner-2); }

.bottom-inner-2 { bottom: var(--spacing-inner-2); }

.left-inner-2 { left: var(--spacing-inner-2); }

.right-inner-2 { right: var(--spacing-inner-2); }

.inset-inner-2 { inset: var(--spacing-inner-2); }

.inset-x-inner-2 { inset-x: var(--spacing-inner-2); }

.inset-y-inner-2 { inset-y: var(--spacing-inner-2); }

.gap-inner-2 { gap: var(--spacing-inner-2); }

.gap-x-inner-2 { column-gap: var(--spacing-inner-2); }

.gap-y-inner-2 { row-gap: var(--spacing-inner-2); }

.-mt-inner-2 { margin-top: calc(var(--spacing-inner-2) * -1); }

.-mb-inner-2 { margin-bottom: calc(var(--spacing-inner-2) * -1); }

.-ml-inner-2 { margin-left: calc(var(--spacing-inner-2) * -1); }

.-mr-inner-2 { margin-right: calc(var(--spacing-inner-2) * -1); }

.-m-inner-2 { margin: calc(var(--spacing-inner-2) * -1); }

.-mx-inner-2 { margin-right: calc(var(--spacing-inner-2) * -1); margin-left: calc(var(--spacing-inner-2) * -1); }

.-my-inner-2 { margin-top: calc(var(--spacing-inner-2) * -1); margin-bottom: calc(var(--spacing-inner-2) * -1); }

.-top-inner-2 { top: calc(var(--spacing-inner-2) * -1); }

.-bottom-inner-2 { bottom: calc(var(--spacing-inner-2) * -1); }

.-left-inner-2 { left: calc(var(--spacing-inner-2) * -1); }

.-right-inner-2 { right: calc(var(--spacing-inner-2) * -1); }

.-inset-inner-2 { inset: calc(var(--spacing-inner-2) * -1); }

.-inset-x-inner-2 { inset-x: calc(var(--spacing-inner-2) * -1); }

.-inset-y-inner-2 { inset-y: calc(var(--spacing-inner-2) * -1); }

/* generate responsive spacing placeholders and classes */
.mt-article-paragraph { margin-top: var(--spacing-article-paragraph); }

.mb-article-paragraph { margin-bottom: var(--spacing-article-paragraph); }

.ml-article-paragraph { margin-left: var(--spacing-article-paragraph); }

.mr-article-paragraph { margin-right: var(--spacing-article-paragraph); }

.m-article-paragraph { margin: var(--spacing-article-paragraph); }

.mx-article-paragraph { margin-right: var(--spacing-article-paragraph); margin-left: var(--spacing-article-paragraph); }

.my-article-paragraph { margin-top: var(--spacing-article-paragraph); margin-bottom: var(--spacing-article-paragraph); }

.pt-article-paragraph { padding-top: var(--spacing-article-paragraph); }

.pb-article-paragraph { padding-bottom: var(--spacing-article-paragraph); }

.pl-article-paragraph { padding-left: var(--spacing-article-paragraph); }

.pr-article-paragraph { padding-right: var(--spacing-article-paragraph); }

.p-article-paragraph { padding: var(--spacing-article-paragraph); }

.px-article-paragraph { padding-right: var(--spacing-article-paragraph); padding-left: var(--spacing-article-paragraph); }

.py-article-paragraph { padding-top: var(--spacing-article-paragraph); padding-bottom: var(--spacing-article-paragraph); }

.top-article-paragraph { top: var(--spacing-article-paragraph); }

.bottom-article-paragraph { bottom: var(--spacing-article-paragraph); }

.left-article-paragraph { left: var(--spacing-article-paragraph); }

.right-article-paragraph { right: var(--spacing-article-paragraph); }

.inset-article-paragraph { inset: var(--spacing-article-paragraph); }

.inset-x-article-paragraph { inset-x: var(--spacing-article-paragraph); }

.inset-y-article-paragraph { inset-y: var(--spacing-article-paragraph); }

.gap-article-paragraph { gap: var(--spacing-article-paragraph); }

.gap-x-article-paragraph { column-gap: var(--spacing-article-paragraph); }

.gap-y-article-paragraph { row-gap: var(--spacing-article-paragraph); }

.-mt-article-paragraph { margin-top: calc(var(--spacing-article-paragraph) * -1); }

.-mb-article-paragraph { margin-bottom: calc(var(--spacing-article-paragraph) * -1); }

.-ml-article-paragraph { margin-left: calc(var(--spacing-article-paragraph) * -1); }

.-mr-article-paragraph { margin-right: calc(var(--spacing-article-paragraph) * -1); }

.-m-article-paragraph { margin: calc(var(--spacing-article-paragraph) * -1); }

.-mx-article-paragraph { margin-right: calc(var(--spacing-article-paragraph) * -1); margin-left: calc(var(--spacing-article-paragraph) * -1); }

.-my-article-paragraph { margin-top: calc(var(--spacing-article-paragraph) * -1); margin-bottom: calc(var(--spacing-article-paragraph) * -1); }

.-top-article-paragraph { top: calc(var(--spacing-article-paragraph) * -1); }

.-bottom-article-paragraph { bottom: calc(var(--spacing-article-paragraph) * -1); }

.-left-article-paragraph { left: calc(var(--spacing-article-paragraph) * -1); }

.-right-article-paragraph { right: calc(var(--spacing-article-paragraph) * -1); }

.-inset-article-paragraph { inset: calc(var(--spacing-article-paragraph) * -1); }

.-inset-x-article-paragraph { inset-x: calc(var(--spacing-article-paragraph) * -1); }

.-inset-y-article-paragraph { inset-y: calc(var(--spacing-article-paragraph) * -1); }

/* generate responsive spacing placeholders and classes */
.mt-nav-1 { margin-top: var(--spacing-nav-1); }

.mb-nav-1 { margin-bottom: var(--spacing-nav-1); }

.ml-nav-1 { margin-left: var(--spacing-nav-1); }

.mr-nav-1 { margin-right: var(--spacing-nav-1); }

.m-nav-1 { margin: var(--spacing-nav-1); }

.mx-nav-1 { margin-right: var(--spacing-nav-1); margin-left: var(--spacing-nav-1); }

.my-nav-1 { margin-top: var(--spacing-nav-1); margin-bottom: var(--spacing-nav-1); }

.pt-nav-1 { padding-top: var(--spacing-nav-1); }

.pb-nav-1 { padding-bottom: var(--spacing-nav-1); }

.pl-nav-1 { padding-left: var(--spacing-nav-1); }

.pr-nav-1 { padding-right: var(--spacing-nav-1); }

.p-nav-1 { padding: var(--spacing-nav-1); }

.px-nav-1 { padding-right: var(--spacing-nav-1); padding-left: var(--spacing-nav-1); }

.py-nav-1 { padding-top: var(--spacing-nav-1); padding-bottom: var(--spacing-nav-1); }

.top-nav-1 { top: var(--spacing-nav-1); }

.bottom-nav-1 { bottom: var(--spacing-nav-1); }

.left-nav-1 { left: var(--spacing-nav-1); }

.right-nav-1 { right: var(--spacing-nav-1); }

.inset-nav-1 { inset: var(--spacing-nav-1); }

.inset-x-nav-1 { inset-x: var(--spacing-nav-1); }

.inset-y-nav-1 { inset-y: var(--spacing-nav-1); }

.gap-nav-1 { gap: var(--spacing-nav-1); }

.gap-x-nav-1 { column-gap: var(--spacing-nav-1); }

.gap-y-nav-1 { row-gap: var(--spacing-nav-1); }

.-mt-nav-1 { margin-top: calc(var(--spacing-nav-1) * -1); }

.-mb-nav-1 { margin-bottom: calc(var(--spacing-nav-1) * -1); }

.-ml-nav-1 { margin-left: calc(var(--spacing-nav-1) * -1); }

.-mr-nav-1 { margin-right: calc(var(--spacing-nav-1) * -1); }

.-m-nav-1 { margin: calc(var(--spacing-nav-1) * -1); }

.-mx-nav-1 { margin-right: calc(var(--spacing-nav-1) * -1); margin-left: calc(var(--spacing-nav-1) * -1); }

.-my-nav-1 { margin-top: calc(var(--spacing-nav-1) * -1); margin-bottom: calc(var(--spacing-nav-1) * -1); }

.-top-nav-1 { top: calc(var(--spacing-nav-1) * -1); }

.-bottom-nav-1 { bottom: calc(var(--spacing-nav-1) * -1); }

.-left-nav-1 { left: calc(var(--spacing-nav-1) * -1); }

.-right-nav-1 { right: calc(var(--spacing-nav-1) * -1); }

.-inset-nav-1 { inset: calc(var(--spacing-nav-1) * -1); }

.-inset-x-nav-1 { inset-x: calc(var(--spacing-nav-1) * -1); }

.-inset-y-nav-1 { inset-y: calc(var(--spacing-nav-1) * -1); }

/* generate responsive spacing root variables */
:root { --SPACING_VARs: 'at this breakpoint ↓'; --spacing-outer-1: 4rem; --spacing-inner-1: 1.5rem; --spacing-inner-2: 1rem; --spacing-article-paragraph: 2rem; --spacing-nav-1: 0.75rem; }

@media screen and (min-width: 544px) { :root { --SPACING_VARs: 'at this breakpoint ↓'; --spacing-outer-1: 4rem; --spacing-inner-1: 1.5rem; --spacing-inner-2: 1rem; --spacing-article-paragraph: 2rem; --spacing-nav-1: 0.75rem; } }
@media screen and (min-width: 650px) { :root { --SPACING_VARs: 'at this breakpoint ↓'; --spacing-outer-1: 4rem; --spacing-inner-1: 2.5rem; --spacing-inner-2: 1.5rem; --spacing-article-paragraph: 1.5rem; --spacing-nav-1: 1rem; } }
@media screen and (min-width: 990px) { :root { --SPACING_VARs: 'at this breakpoint ↓'; --spacing-outer-1: 6rem; --spacing-inner-1: 4rem; --spacing-inner-2: 2rem; --spacing-article-paragraph: 2rem; --spacing-nav-1: 1.5rem; } }
@media screen and (min-width: 1300px) { :root { --SPACING_VARs: 'at this breakpoint ↓'; --spacing-outer-1: 6rem; --spacing-inner-1: 4rem; --spacing-inner-2: 3rem; --spacing-article-paragraph: 2rem; --spacing-nav-1: 1.5rem; } }
@media screen and (min-width: 1520px) { :root { --SPACING_VARs: 'at this breakpoint ↓'; --spacing-outer-1: 6rem; --spacing-inner-1: 4rem; --spacing-inner-2: 3rem; --spacing-article-paragraph: 2rem; --spacing-nav-1: 1.5rem; } }
/* generate gutter placeholders and classes */
.mt-gutter { margin-top: var(--inner-gutter); }

.mb-gutter { margin-bottom: var(--inner-gutter); }

.ml-gutter { margin-left: var(--inner-gutter); }

.mr-gutter { margin-right: var(--inner-gutter); }

.m-gutter { margin: var(--inner-gutter); }

.mx-gutter { margin-right: var(--inner-gutter); margin-left: var(--inner-gutter); }

.my-gutter { margin-top: var(--inner-gutter); margin-bottom: var(--inner-gutter); }

.pt-gutter { padding-top: var(--inner-gutter); }

.pb-gutter { padding-bottom: var(--inner-gutter); }

.pl-gutter { padding-left: var(--inner-gutter); }

.pr-gutter { padding-right: var(--inner-gutter); }

.p-gutter { padding: var(--inner-gutter); }

.px-gutter { padding-right: var(--inner-gutter); padding-left: var(--inner-gutter); }

.py-gutter { padding-top: var(--inner-gutter); padding-bottom: var(--inner-gutter); }

.top-gutter { top: var(--inner-gutter); }

.bottom-gutter { bottom: var(--inner-gutter); }

.left-gutter { left: var(--inner-gutter); }

.right-gutter { right: var(--inner-gutter); }

.inset-gutter { inset: var(--inner-gutter); }

.inset-x-gutter { inset-x: var(--inner-gutter); }

.inset-y-gutter { inset-y: var(--inner-gutter); }

.gap-gutter { gap: var(--inner-gutter); }

.gap-x-gutter { column-gap: var(--inner-gutter); }

.gap-y-gutter { row-gap: var(--inner-gutter); }

.-mt-gutter { margin-top: calc(var(--inner-gutter) * -1); }

.-mb-gutter { margin-bottom: calc(var(--inner-gutter) * -1); }

.-ml-gutter { margin-left: calc(var(--inner-gutter) * -1); }

.-mr-gutter { margin-right: calc(var(--inner-gutter) * -1); }

.-m-gutter { margin: calc(var(--inner-gutter) * -1); }

.-mx-gutter { margin-right: calc(var(--inner-gutter) * -1); margin-left: calc(var(--inner-gutter) * -1); }

.-my-gutter { margin-top: calc(var(--inner-gutter) * -1); margin-bottom: calc(var(--inner-gutter) * -1); }

.-top-gutter { top: calc(var(--inner-gutter) * -1); }

.-bottom-gutter { bottom: calc(var(--inner-gutter) * -1); }

.-left-gutter { left: calc(var(--inner-gutter) * -1); }

.-right-gutter { right: calc(var(--inner-gutter) * -1); }

.-inset-gutter { inset: calc(var(--inner-gutter) * -1); }

.-inset-x-gutter { inset-x: calc(var(--inner-gutter) * -1); }

.-inset-y-gutter { inset-y: calc(var(--inner-gutter) * -1); }

.mt-outer-gutter { margin-top: var(--outer-gutter); }

.mb-outer-gutter { margin-bottom: var(--outer-gutter); }

.ml-outer-gutter { margin-left: var(--outer-gutter); }

.mr-outer-gutter { margin-right: var(--outer-gutter); }

.m-outer-gutter { margin: var(--outer-gutter); }

.mx-outer-gutter { margin-right: var(--outer-gutter); margin-left: var(--outer-gutter); }

.my-outer-gutter { margin-top: var(--outer-gutter); margin-bottom: var(--outer-gutter); }

.pt-outer-gutter { padding-top: var(--outer-gutter); }

.pb-outer-gutter { padding-bottom: var(--outer-gutter); }

.pl-outer-gutter { padding-left: var(--outer-gutter); }

.pr-outer-gutter { padding-right: var(--outer-gutter); }

.p-outer-gutter { padding: var(--outer-gutter); }

.px-outer-gutter { padding-right: var(--outer-gutter); padding-left: var(--outer-gutter); }

.py-outer-gutter { padding-top: var(--outer-gutter); padding-bottom: var(--outer-gutter); }

.top-outer-gutter { top: var(--outer-gutter); }

.bottom-outer-gutter { bottom: var(--outer-gutter); }

.left-outer-gutter { left: var(--outer-gutter); }

.right-outer-gutter { right: var(--outer-gutter); }

.inset-outer-gutter { inset: var(--outer-gutter); }

.inset-x-outer-gutter { inset-x: var(--outer-gutter); }

.inset-y-outer-gutter { inset-y: var(--outer-gutter); }

.gap-outer-gutter { gap: var(--outer-gutter); }

.gap-x-outer-gutter { column-gap: var(--outer-gutter); }

.gap-y-outer-gutter { row-gap: var(--outer-gutter); }

.-mt-outer-gutter { margin-top: calc(var(--outer-gutter) * -1); }

.-mb-outer-gutter { margin-bottom: calc(var(--outer-gutter) * -1); }

.-ml-outer-gutter { margin-left: calc(var(--outer-gutter) * -1); }

.-mr-outer-gutter { margin-right: calc(var(--outer-gutter) * -1); }

.-m-outer-gutter { margin: calc(var(--outer-gutter) * -1); }

.-mx-outer-gutter { margin-right: calc(var(--outer-gutter) * -1); margin-left: calc(var(--outer-gutter) * -1); }

.-my-outer-gutter { margin-top: calc(var(--outer-gutter) * -1); margin-bottom: calc(var(--outer-gutter) * -1); }

.-top-outer-gutter { top: calc(var(--outer-gutter) * -1); }

.-bottom-outer-gutter { bottom: calc(var(--outer-gutter) * -1); }

.-left-outer-gutter { left: calc(var(--outer-gutter) * -1); }

.-right-outer-gutter { right: calc(var(--outer-gutter) * -1); }

.-inset-outer-gutter { inset: calc(var(--outer-gutter) * -1); }

.-inset-x-outer-gutter { inset-x: calc(var(--outer-gutter) * -1); }

.-inset-y-outer-gutter { inset-y: calc(var(--outer-gutter) * -1); }

@media screen and (min-width: 0) and (max-width: 544px) { #main-article aside h1 { margin-top: calc(var(--spacing-article-paragraph)/2); }
  #main-article aside h2 { margin-bottom: var(--spacing-article-paragraph); } }
@media screen and (min-width: 544px) { #main-article aside h2 { margin-bottom: var(--spacing-article-paragraph); } }
#main-article section > p { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--sans); font-size: 18px; line-height: 1.35; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: var(--serif); margin-bottom: var(--spacing-article-paragraph); }
#main-article section > p b, #main-article section > p strong { font-weight: var(--weight-600); }
#main-article section > p i, #main-article section > p em { font-style: italic; }
@media screen and (min-width: 650px) { #main-article section > p { font-size: 16px; } }
@media screen and (min-width: 990px) { #main-article section > p { font-size: 18px; } }
@media screen and (min-width: 1300px) { #main-article section > p { font-size: 20px; } }
#main-article section > p a { text-decoration: underline; }
#main-article section p.teaser { font-family: var(--sans); }
#main-article section h3 { padding-top: var(--spacing-article-paragraph); }
#main-article section ul { margin: calc(var(--spacing-article-paragraph)/2) 0 var(--spacing-article-paragraph) 0; }
#main-article section ul li { margin-left: 1em; padding: 0 0 calc(var(--spacing-article-paragraph)/2) 0.5em; }

@-ms-viewport { width: device-width; }
html { overflow-x: hidden; overflow-y: scroll; box-sizing: border-box; touch-action: manipulation; scroll-behavior: smooth; }

html.overlay { scroll-behavior: auto; }

*, *::before, *::after { margin: 0; padding: 0; box-sizing: inherit; touch-action: inherit; }

body { font-family: var(--sans); font-size: 100%; font-kerning: normal; line-height: 1; text-rendering: optimizeLegibility; font-variant-ligatures: common-ligatures; font-feature-settings: 'kern' on; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; color: var(--blue-80); }

#main { display: flex; flex-direction: column; flex-wrap: nowrap; min-width: 100vw; min-height: 100vh; }

.flex { display: flex; }

a { text-decoration: none; color: inherit; }

a:hover { text-decoration: underline; }

@media screen and (max-width: 650px) { .hidden-sm { display: none !important; } }

@media screen and (max-width: 990px) { .hidden-md { display: none !important; } }

@media screen and (min-width: 990px) { .hidden-lg- { display: none !important; } }

@media screen and (max-width: 1300px) { .hidden-lg { display: none !important; } }

@media screen and (min-width: 0) { .shown-xs { display: flex !important; } }

@media screen and (min-width: 544px) { .shown-sm { display: flex !important; } }

@media screen and (min-width: 544px) { .shown-sm-inline { display: inline-flex !important; } }

@media screen and (min-width: 650px) { .shown-md { display: flex !important; } }

@media screen and (min-width: 650px) { .shown-md-inline { display: inline-flex !important; } }

@media screen and (min-width: 990px) { .shown-lg { display: flex !important; } }

@media screen and (min-width: 990px) { .shown-lg-inline { display: inline-flex !important; } }

@media screen and (min-width: 1300px) { .shown-xl { display: flex !important; } }

@media screen and (min-width: 1300px) { .shown-xl-inline { display: inline-flex !important; } }

#main-branches .branch { border-top: 2px dotted var(--red-50); }
#main-branches .branch h3 span { font-weight: 400; }

.c_red, .c_accent { color: var(--red-50) !important; }

.c_darkblue { color: var(--blue-80) !important; }

@font-face { font-family: "SuisseIntl"; font-weight: 400; src: url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-400-xl.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-400-xl.woff") format("woff"); }
@font-face { font-family: "SuisseIntl"; font-weight: 400; font-style: italic; src: url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-400-xl-italic.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-400-xl-italic.woff") format("woff"); }
@font-face { font-family: "SuisseIntl"; font-weight: 500; src: url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-500-xl.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-500-xl.woff") format("woff"); }
@font-face { font-family: "SuisseIntl"; font-weight: 500; font-style: italic; src: url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-500-s-italic.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-500-s-italic.woff") format("woff"); }
@font-face { font-family: "SuisseIntl"; font-weight: 600; src: url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-600-s.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-600-s.woff") format("woff"); }
@font-face { font-family: "SuisseIntl"; font-weight: 600; font-style: italic; src: url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-600-s-italic.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-600-s-italic.woff") format("woff"); }
@font-face { font-family: "SuisseIntl"; font-weight: 700; src: url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-700-s.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_sans/suisse-web-700-s.woff") format("woff"); }
@font-face { font-family: "SuisseIntl Mono"; font-weight: 400; src: url("../../files/bba-eaks/fonts/suisse_mono/suisse_mono-web-s-400.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_mono/suisse_mono-web-s-400.woff") format("woff"); }
@font-face { font-family: "SuisseIntl Works"; font-weight: 400; src: url("../../files/bba-eaks/fonts/suisse_works/suisse_works-web-s-400.woff2") format("woff2"), url("../../files/bba-eaks/fonts/suisse_works/suisse_works-web-s-400.woff") format("woff"); }
.underline { text-decoration-line: underline; }

.overline { text-decoration-line: overline; }

.line-through { text-decoration-line: line-through; }

.no-underline { text-decoration-line: none; }

.decoration-transparent { text-decoration-color: transparent; }

.decoration-1 { text-decoration-thickness: 1px; }

.underline-offset-4 { text-underline-offset: 4px; }

.underline-offset-2 { text-underline-offset: 2px; }

.underline-offset-1 { text-underline-offset: 1px; }

.antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.uppercase { text-transform: uppercase; }

.lowercase { text-transform: lowercase; }

.ff-tnum { font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "tnum" 1; }

.text-icon { line-height: 1; height: 1em; width: 1em; fill: var(--blue-80); }

.text-icon.mr { margin-right: 5px; }

.text-icon.ml { margin-left: 5px; }

#main-footer .ft-el { margin-top: calc(var(--spacing-nav-1)/2); margin-bottom: calc(var(--spacing-nav-1)/2); }
@media screen and (min-width: 0) and (max-width: 544px) { #main-footer nav p .ft-el-box { display: block; } }
@media screen and (min-width: 0) { #main-footer section { padding: 20px 0; } }
@media screen and (min-width: 650px) { #main-footer section { padding: 25px 0; } }
@media screen and (min-width: 990px) { #main-footer section { padding: 30px 0; } }
#main-footer section { width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; }
#main-footer section a { display: inline-block; }
#main-footer section > p { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--sans); font-size: 18px; line-height: 1.35; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
#main-footer section > p b, #main-footer section > p strong { font-weight: var(--weight-600); }
#main-footer section > p i, #main-footer section > p em { font-style: italic; }
@media screen and (min-width: 650px) { #main-footer section > p { font-size: 16px; } }
@media screen and (min-width: 990px) { #main-footer section > p { font-size: 18px; } }
@media screen and (min-width: 1300px) { #main-footer section > p { font-size: 20px; } }

.footer { margin-top: 60px; padding-top: 24px; padding-bottom: 24px; border-top: 1px solid var(--border-primary); }
.footer ul { width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; }
@media screen and (min-width: 544px) { .footer ul { display: flex; flex-direction: row; } }
.footer li { margin-top: 20px; list-style-type: none; }
@media screen and (min-width: 544px) { .footer li { margin-top: 0; margin-right: 20px; } }
.footer li:first-child { margin-right: auto; }
.footer li:last-child { margin-right: 0; }
.footer a { color: var(--text-primary); text-decoration: none; }
.footer svg { display: inline-block; vertical-align: text-bottom; }

.copy h2 { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--sans); font-weight: 500; font-size: 36px; line-height: 1.25; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.copy h2 b, .copy h2 strong { font-weight: var(--weight-600); }
.copy h2 i, .copy h2 em { font-style: italic; }
@media screen and (min-width: 990px) { .copy h2 { font-size: 48px; } }
@media screen and (min-width: 1300px) { .copy h2 { font-size: 60px; } }

.copy h2:not(:first-child), .copy.col-6\@lg h2, .grid + .copy h2 { margin-top: 3.5rem; border-top: 1px solid var(--border-secondary); padding-top: 3rem; }

.copy h3 { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--sans); font-weight: 500; font-size: 18px; line-height: 1.2; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; margin-top: 2.5rem; }
.copy h3 b, .copy h3 strong { font-weight: var(--weight-600); }
.copy h3 i, .copy h3 em { font-style: italic; }
@media screen and (min-width: 650px) { .copy h3 { font-size: 16px; } }
@media screen and (min-width: 990px) { .copy h3 { font-size: 18px; } }
@media screen and (min-width: 1300px) { .copy h3 { font-size: 20px; } }

.copy h4 { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--sans); font-weight: 400; font-size: 14px; line-height: 1.2; letter-spacing: -0.02em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; margin-top: 2.5rem; }
.copy h4 b, .copy h4 strong { font-weight: var(--weight-600); }
.copy h4 i, .copy h4 em { font-style: italic; }
@media screen and (min-width: 650px) { .copy h4 { font-size: 16px; } }

.copy p, .copy ul { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--sans); font-size: 18px; line-height: 1.35; font-weight: 400; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }
.copy p b, .copy p strong, .copy ul b, .copy ul strong { font-weight: var(--weight-600); }
.copy p i, .copy p em, .copy ul i, .copy ul em { font-style: italic; }
@media screen and (min-width: 650px) { .copy p, .copy ul { font-size: 16px; } }
@media screen and (min-width: 990px) { .copy p, .copy ul { font-size: 18px; } }
@media screen and (min-width: 1300px) { .copy p, .copy ul { font-size: 20px; } }

.copy p { margin-top: 1.25rem; }

.copy p:first-child { margin-top: 0rem; }

.copy ul { margin-top: 1.25rem; list-style-type: disc; padding-left: 1rem; }

.copy ul ul { margin-top: 0rem; }

.copy > img { margin-top: 1.25rem; border: 1px solid #eee; }

.copy .code-example { margin-top: 1.25rem; }

.copy code:not([class]) { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--mono); font-size: 14px; line-height: 1.2; font-weight: 400; background-color: var(--grey-10); padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.25rem; padding-bottom: 0.125rem; color: var(--black); }
.copy code:not([class]) b, .copy code:not([class]) strong { font-weight: var(--weight-600); }
.copy code:not([class]) i, .copy code:not([class]) em { font-style: italic; }

.copy pre:not([class]) { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--mono); font-size: 14px; line-height: 1.2; font-weight: 400; margin-top: 1.25rem; display: block; max-height: 25rem; overflow-y: scroll; }
.copy pre:not([class]) b, .copy pre:not([class]) strong { font-weight: var(--weight-600); }
.copy pre:not([class]) i, .copy pre:not([class]) em { font-style: italic; }

.copy pre:not([class]) code:not([class]) { display: block; padding: 0.5rem; }

.copy a { color: var(--blue-03); text-decoration: underline; }

.copy a:hover, .copy a:focus { color: var(--grey-90); }

.copy hr { margin-top: 2.5rem; margin-bottom: 2.5rem; border: 0; border-top: 1px solid var(--grey-15); }

@media screen and (min-width: 650px) { .copy > *:not(.code-example, .copy h2, .copy hr) { max-width: 80%; } }
@media screen and (min-width: 990px) { .copy:not(.col-6\@lg) > *:not(.code-example, .copy h2, .copy hr) { max-width: 60%; }
  .copy.col-6\@lg > *:not(.code-example, .copy h2, .copy hr) { max-width: 100%; } }
.copy .blockquote, .copy .props-table, .copy .mixin, .copy .mixin-table { margin-top: 1.25rem; }

.code-example { display: block; background-color: var(--grey-90); }

.code-example .code-example-filename { font-family: var(--sans); font-size: 0.75rem; line-height: 1.2; font-weight: 400; display: inline-block; border-bottom: 1px solid var(--blue-05); padding-left: 1.25rem; padding-right: 1.25rem; padding-top: 0.75rem; padding-bottom: 0.75rem; color: var(--blue-05); min-width: 160px; }

.code-example .code-example-code { margin-top: 0; padding: 0; font-family: var(--mono); font-size: 0.875rem; line-height: 1.2; font-weight: 400; display: block; background-color: var(--grey-90); color: var(--grey-3); }

.code-example .code-example-code code { margin-top: 0; max-height: 37.5rem; overflow: auto; background-color: var(--grey-90); scrollbar-color: var(--grey-54) var(--grey-90); scrollbar-width: thin; }

.code-example .code-example-code code::-webkit-scrollbar { width: 8px; height: 8px; }

.code-example .code-example-code code::-webkit-scrollbar-track { background: var(--grey-90); }

.code-example .code-example-code code::-webkit-scrollbar-thumb { background: var(--grey-54); width: 8px; height: 8px; }

.grid-demo .col, .grid-demo [class*=col-], .colspan-demo [class*=colspan-], .float-clear-demo .float-clear [class*=colspan-], .float-clear-demo > p { position: relative; min-height: var(--inner-gutter); background: #ccc; list-style-type: none; }

.float-clear [class*=colspan-] { float: left; }

.float-clear-demo > p { margin-top: var(--inner-gutter); font: 12px/var(--inner-gutter) monospace; }

.grid-demo .col::before, .grid-demo [class*=col-]::before, .colspan-demo [class*=colspan-]::before, .float-clear [class*=colspan-]::before { content: attr(class); position: absolute; left: 0; top: 0; padding: 0 5px; font: 12px/var(--inner-gutter) monospace; white-space: nowrap; }

.grid-demo .col .grid-demo .col, .grid-demo .col [class*=colspan-], .grid-demo .col .grid-demo [class*=col-], .grid-demo [class*=col-] [class*=colspan-], .grid-demo .col .colspan-demo [class*=colspan-], .colspan-demo [class*=colspan-] [class*=colspan-], .grid-demo [class*=col-] .grid-demo .col, .grid-demo [class*=col-] .grid-demo [class*=col-], .grid-demo [class*=col-] .colspan-demo [class*=colspan-], .colspan-demo [class*=colspan-] .grid-demo .col, .colspan-demo [class*=colspan-] .grid-demo [class*=col-], .colspan-demo [class*=colspan-] .colspan-demo [class*=colspan-] { background: #f2f2f2; }

.grid-demo .col + [class*=colspan-]:not([class*=col-]), .grid-demo [class*=col-] + [class*=colspan-]:not([class*=col-]), .colspan-demo [class*=colspan-] + [class*=colspan-]:not([class*=col-]) { margin-top: var(--inner-gutter); }

.grid-demo .col .grid-demo .col .grid-demo .col, .grid-demo .col .grid-demo .col .grid-demo [class*=col-], .grid-demo .col .grid-demo .col .colspan-demo [class*=colspan-], .grid-demo .col .grid-demo [class*=col-] .grid-demo .col, .grid-demo .col .grid-demo [class*=col-] .grid-demo [class*=col-], .grid-demo .col .grid-demo [class*=col-] .colspan-demo [class*=colspan-], .grid-demo .col .colspan-demo [class*=colspan-] .grid-demo .col, .grid-demo .col .colspan-demo [class*=colspan-] .grid-demo [class*=col-], .grid-demo .col .colspan-demo [class*=colspan-] .colspan-demo [class*=colspan-], .grid-demo [class*=col-] .grid-demo .col .grid-demo .col, .grid-demo [class*=col-] .grid-demo .col .grid-demo [class*=col-], .grid-demo [class*=col-] .grid-demo .col .colspan-demo [class*=colspan-], .grid-demo [class*=col-] .grid-demo [class*=col-] .grid-demo .col, .grid-demo [class*=col-] .grid-demo [class*=col-] .grid-demo [class*=col-], .grid-demo [class*=col-] .grid-demo [class*=col-] .colspan-demo [class*=colspan-], .grid-demo [class*=col-] .colspan-demo [class*=colspan-] .grid-demo .col, .grid-demo [class*=col-] .colspan-demo [class*=colspan-] .grid-demo [class*=col-], .grid-demo [class*=col-] .colspan-demo [class*=colspan-] .colspan-demo [class*=colspan-], .colspan-demo [class*=colspan-] .grid-demo .col .grid-demo .col, .colspan-demo [class*=colspan-] .grid-demo .col .grid-demo [class*=col-], .colspan-demo [class*=colspan-] .grid-demo .col .colspan-demo [class*=colspan-], .colspan-demo [class*=colspan-] .grid-demo [class*=col-] .grid-demo .col, .colspan-demo [class*=colspan-] .grid-demo [class*=col-] .grid-demo [class*=col-], .colspan-demo [class*=colspan-] .grid-demo [class*=col-] .colspan-demo [class*=colspan-], .colspan-demo [class*=colspan-] .colspan-demo [class*=colspan-] .grid-demo .col, .colspan-demo [class*=colspan-] .colspan-demo [class*=colspan-] .grid-demo [class*=col-], .colspan-demo [class*=colspan-] .colspan-demo [class*=colspan-] .colspan-demo [class*=colspan-] { border: 1px solid #333; }

.grid-demo, .colspan-demo, .float-clear-demo { padding-top: var(--inner-gutter); padding-bottom: var(--inner-gutter); }
.grid-demo .grid-demo, .grid-demo .colspan-demo, .grid-demo .float-clear-demo, .colspan-demo .grid-demo, .colspan-demo .colspan-demo, .colspan-demo .float-clear-demo, .float-clear-demo .grid-demo, .float-clear-demo .colspan-demo, .float-clear-demo .float-clear-demo { padding-bottom: 0; }

.colspan-demo--flex { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-start; }

.colspan-demo--flex [class*=colspan-] + [class*=colspan-]:not([class*=col-]) { margin-top: 0; }

.colspan-demo--flex .colspan-demo--flex { padding-top: var(--inner-gutter); }

.colspan-demo--flex .colspan-demo--flex .colspan-demo--flex [class*=colspan-] { border: 1px solid #333; background-color: transparent; }

.grid-demo .colspan-demo [class*=colspan-] { padding-top: var(--inner-gutter); }

.grid-demo .colspan-demo [class*=col-] { border: 1px solid #333; background-color: transparent; }

.grid-demo--10, .colspan-demo--10 { --grid-columns: 10; }

.grid-demo--24, .colspan-demo--24 { --grid-columns: 24; }

.colspan-demo--nested { display: flex; flex-flow: row wrap; justify-content: space-between; }

.colspan-demo--nested > [class*=colspan-], .colspan-demo--nested > [class*=colspan-] > [class*=colspan-] { display: flex; flex-flow: row wrap; justify-content: space-between; padding-top: var(--inner-gutter); }

.colspan-demo--nested [class*=colspan-] + [class*=colspan-]:not([class*=col-]) { margin-top: 0; }

.colspan-demo--nested [class*=colspan-] [class*=colspan-] [class*=colspan-] { border: 1px solid #333; }

.copy .mixin { /* check if user specified a `f-xxx` type name and fix */ /* now look for the specified typeset */ /* output specified typeset */ font-family: var(--mono); font-size: 14px; line-height: 1.2; font-weight: 400; margin-top: 1.25rem; padding-left: 1.25rem; padding-right: 1.25rem; padding-top: 0.75rem; padding-bottom: 0.75rem; display: block; background-color: var(--grey-90); color: var(--grey-3); }
.copy .mixin b, .copy .mixin strong { font-weight: var(--weight-600); }
.copy .mixin i, .copy .mixin em { font-style: italic; }
.copy .mixin .mixin-include { color: #e28964; }
.copy .mixin em { color: #aeaeae; }

.mixin-table thead { text-align: left; }
.mixin-table thead th { padding: 0 1rem 0.5rem 0; }
.mixin-table tbody td { padding: 0.5rem 1rem 0.5rem 0; border-top: 1px solid var(--border-secondary); }

.props-table thead { text-align: left; }
.props-table thead th { padding: 0 1rem 0.5rem 0; }
.props-table tbody td { padding: 0.5rem 1rem 0.5rem 0; border-top: 1px solid var(--border-secondary); }

.demo-keyline-full-1 { position: relative; }
.demo-keyline-full-1::before { content: ''; position: absolute; z-index: 0; left: 50%; bottom: 100%; width: 100vw; margin-left: -50vw; border-top: 1px solid var(--border-primary); pointer-events: none; }

.demo-keyline-full-2 { position: relative; }
.demo-keyline-full-2::before { content: ''; position: absolute; z-index: 0; left: 50%; bottom: 100%; width: 100vw; margin-left: -50vw; border-top: 1px solid var(--border-tertiary); pointer-events: none; }

.demo-keyline-full-3 { position: relative; }
.demo-keyline-full-3::before { content: ''; position: absolute; z-index: 0; left: 50%; top: 100%; width: 100vw; margin-left: -50vw; border-top: 1px solid red; pointer-events: none; }

.demo-keyline-full-4 { position: relative; }
.demo-keyline-full-4::before { content: ''; position: absolute; z-index: 0; left: 50%; bottom: 100%; width: 100vw; margin-left: -50vw; border-top: 4px solid var(--border-primary); pointer-events: none; }

.demo-font-smoothing-on { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; }

.demo-font-smoothing-off { -moz-osx-font-smoothing: auto; -webkit-font-smoothing: subpixel-antialiased; }

.card { display: flex; margin-bottom: 30px; border-radius: 15px; padding: 20px; overflow: hidden; }
.card .card-content { display: flex; flex-direction: column; align-content: stretch; flex: 1; }
.card .card-content .content-box { flex: 1 0; }
.card .card-content .content-box h2 { line-height: 1; }
.card .card-content .content-box .tagline { font-weight: 500; }
.card .card-content .action-box { display: flex; align-items: center; border-top: 1px solid var(--blue-80); margin: 0 0 -20px 0; height: 50px; }
.card .card-content .action-box p { display: flex; align-items: center; flex: 1; }
.card .card-content .action-box p span { flex: 1; }
.card .card-content .action-box p .text-icon { border-radius: 100%; width: 25px; height: 25px; }
.card .card-img { margin: -20px -20px -20px 20px; background: red; background-size: contain; }

a.card:hover { text-decoration: none; }

.card-s { min-height: 180px; }
.card-s .card-img { width: 180px; height: 180px; }

.card-employee { background-color: var(--blue-5); }

.card-blue { background-color: var(--blue-80); }
.card-blue .card-content * { color: var(--white); }
.card-blue .card-content .text-icon { fill: var(--white); }
.card-blue .action-box { border-top-color: var(--white) !important; }

.card-blue-light { background-color: var(--blue-5); }
.card-blue-light .card-content * { color: var(--blue-80); }
.card-blue-light .card-content .text-icon { fill: var(--blue-80); }
.card-blue-light .action-box { border-top-color: var(--blue-80) !important; }

.card-red { background-color: var(--red-50); }
.card-red .card-content * { color: var(--white); }
.card-red .card-content .text-icon { fill: var(--white); }
.card-red .action-box { border-top-color: var(--white) !important; }

.card-red-light { background-color: var(--red-5); }
.card-red-light .card-content * { color: var(--red-80); }
.card-red-light .card-content .text-icon { fill: var(--red-80); }
.card-red-light .action-box { border-top-color: var(--red-80) !important; }

.card-darkred { background-color: var(--red-90); }
.card-darkred .card-content * { color: var(--red-50); }
.card-darkred .card-content .text-icon { fill: var(--white); }
.card-darkred .action-box { border-top-color: var(--red-50) !important; }
.card-darkred .action-box * { color: var(--white); }

.chronology { margin-bottom: 25px; border-bottom: 1px solid var(--antracite-10); }
.chronology .text-block { margin-bottom: 0; }

.global__footer { padding: 30px 0; }
.global__footer ul { display: block; width: 100%; list-style: none; }
.global__footer ul li { float: left; margin-right: 1em; }
.global__footer ul li:last-child { margin-right: 0; }

.button { display: inline-flex; justify-content: center; margin-right: .5em; border-radius: calc(2*1.5em); cursor: pointer; line-height: 2; }

.button:hover { text-decoration: none; }

a.button { text-decoration: none !important; }

.button-filled { padding: .5rem .75em; }

.button-outline { border-style: solid; border-width: 1px; padding: calc(.5rem - 1px) calc(.75em - 1px); }

@media screen and (min-width: 650px) { .button { line-height: 1.75; } }
#main__header { position: fixed; top: 0; right: 0; left: 0; z-index: 5000; }
#main__header ul { display: flex; list-style: none; }
#main__header ul li { display: flex; align-items: center; }
#main__header a.quick_nav { display: inline-flex; align-items: center; text-decoration: none; text-transform: uppercase; font-weight: 700; }
#main__header a.quick_nav svg { width: 24px; height: 24px; }
#main__header .nav__main { position: relative; z-index: 6000; background: var(--white); }
#main__header .nav__main .container { display: flex; align-items: center; width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; }
#main__header .nav__main .container ul.nav_level_01 li:not(:first-child), #main__header .nav__main .container ul.nav_level_02 li:not(:first-child) { margin-left: 15px; }
#main__header .nav__main .container ul.nav_level_01 { flex: 1; margin-left: 20px; }
#main__header .nav__main .container ul.nav_level_02 { margin-right: 30px; }
#main__header .nav__main .container ul.nav_level_02 li a { color: var(--antracite-30); }
#main__header .nav__main .container ul.nav_level_02 li a:hover { color: var(--antracite-50); }
#main__header .nav__main .brand_wrapper { display: flex; align-items: center; }
#main__header .nav__main .brand_wrapper .brand_name { display: flex; margin: 0 30px 0 15px; }
#main__header .nav__main .brand_wrapper .brand_name h1 { text-transform: uppercase; font-size: 20px; font-weight: 600; line-height: 1.2; letter-spacing: 0.1em; color: var(--red-50); }
#main__header .nav__main .brand_wrapper .brand_name h1 .branch_name { color: var(--blue-90); }
#main__header .nav__main .brand_wrapper img { margin: 10px 0; height: 40px; }
@media screen and (min-width: 650px) { #main__header .nav__main .brand_wrapper img { margin: 0; height: 60px; } }
#main__header .nav__main a.brand_wrapper:hover { text-decoration: none !important; }
@media screen and (min-width: 0) { #main__header section { padding: 20px 0; } }
@media screen and (min-width: 650px) { #main__header section { padding: 25px 0; } }
@media screen and (min-width: 990px) { #main__header section { padding: 30px 0; } }

#nav__menu { transition: all .25s ease-in; position: absolute; z-index: 5500; border-bottom-right-radius: 15px; border-bottom-left-radius: 15px; padding-top: 0; width: 100vw; overflow-y: scroll; background: var(--white); }
#nav__menu .container { overflow-y: scroll; }
#nav__menu figure figcaption { margin-bottom: 10px; border-bottom: 1px solid var(--antracite-20); padding: 30px 0 15px 0; text-transform: uppercase; font-weight: 600; }
#nav__menu figure ul { flex-wrap: wrap; }
#nav__menu figure ul li { width: 100%; line-height: 30px; }
#nav__menu figure ul li a { display: table; table-layout: fixed; width: 100%; }
#nav__menu figure ul li a span { display: block; max-width: 100%; white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; }
@media screen and (max-width: 1300px) { #nav__menu { position: fixed; top: 100px; bottom: 0; } }

#nav__menu.slideInY { transform: translateY(0); }

#nav__menu.slideOutY { transform: translateY(-100%); }

/* Hide scrollbar for Chrome, Safari and Opera */
#nav__menu::-webkit-scrollbar { display: none; }

/* Hide scrollbar for IE, Edge and Firefox */
#nav__menu { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ }

.header { border-bottom: 1px solid var(--border-tertiary); }
.header ul { width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; padding-top: 12px; padding-bottom: 12px; }
@media screen and (min-width: 544px) { .header ul { display: flex; flex-direction: row; } }
.header li { margin-top: 20px; list-style-type: none; }
@media screen and (min-width: 544px) { .header li { margin-top: 0; margin-right: 20px; } }
.header li:first-child { margin-right: auto; }
.header li:last-child { margin-right: 0; }
.header a { color: var(--text-primary); text-decoration: none; }
.header svg { display: inline-block; vertical-align: text-bottom; }
.header div { width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; padding-top: 60px; padding-bottom: 40px; }
@media screen and (min-width: 650px) { .header div { padding-top: 80px; } }
@media screen and (min-width: 990px) { .header div { padding-top: 100px; } }

#nav__menu_overlay { position: fixed; top: 0; left: 0; z-index: 2490; width: 100%; height: 100%; transition: opacity .25s ease-in; opacity: 0; background: var(--blue-90); }

#nav__menu_overlay.visible { opacity: .85; height: 100%; }

#nav__menu_overlay.fade-out { opacity: 0; }

#nav__menu_overlay.invisible { height: 0; }

#main__content.jobs aside h3 { margin: 1em 0; }

.pdf-viewer { margin: 25px 0; width: 300px; height: calc(300px*1.7); }

@media screen and (min-width: 650px) and (max-width: 990px) { .pdf-viewer { margin: 50px 0; width: 700px; height: calc(700px*1.7); } }
@media screen and (min-width: 990px) { .pdf-viewer { margin: 50px 0; width: 1000px; height: calc(1000px*1.7); } }
.page-info { margin-bottom: 25px; padding: 30px 0; }
.page-info h2 { padding: 0 0 1em 0; }
.page-info .text-block { margin-bottom: 0; }
.page-info .expand-box .expand-content { overflow: hidden; transition: max-height 0.35s cubic-bezier(0.75, 0, 0.25, 1); max-height: 0; }
.page-info .expand-box .expand-button span:after { content: 'weiterlesen'; }
.page-info .expand-box .expand-button.active span:after { content: 'Text schließen'; }

.page-info.highlight-red-light { background-color: var(--red-5); }
.page-info.highlight-red-light * { color: var(--red-80); }
.page-info.highlight-red-light .button-filled { background: var(--white); }

.page-info.highlight-blue-light { background-color: var(--blue-5); }
.page-info.highlight-blue-light * { color: var(--blue-80); }

@media screen and (min-width: 544px) { .page-info { margin-bottom: 50px; padding: 50px 0; } }
@media screen and (min-width: 1300px) { .page-info header { width: 75%; } }
.global__separator { padding-top: 50px; }
.global__separator hr { border: none; height: 1px; background: var(--antracite-20); }
.global__separator h2 { padding: 1em 0; font-weight: 500; }

#main__content { padding-top: 50px; }

.text-block { margin-bottom: 50px; }
.text-block > *:first-child { padding-top: 0; }
.text-block h3 { padding: 1em 0 .5em 0; }
.text-block h4, .text-block p:not(.button), .text-block ul, .text-block ol { padding-bottom: 1em; }
.text-block a { text-decoration: underline; }
.text-block a:hover { text-decoration: none; }
.text-block .button-filled { color: #fff; background: var(--blue-80); }
.text-block ul, .text-block ol { padding-left: calc(1em + 2px); }
.text-block ul ul, .text-block ul ol, .text-block ol ul, .text-block ol ol { padding-top: .5em; padding-bottom: 0; }
.text-block ul ul li:last-child, .text-block ul ol li:last-child, .text-block ol ul li:last-child, .text-block ol ol li:last-child { padding-bottom: 0; }
.text-block ul li, .text-block ol li { padding-bottom: .5em; }
.text-block blockquote { margin: 1em 0; border-left: 2px solid var(--blue-80); padding-left: 1em; }
.text-block blockquote > *:first-child { padding-top: 0; }
.text-block blockquote > *:last-child { padding-bottom: 0; }
.text-block .expand-box .expand-content { overflow: hidden; transition: max-height 0.35s cubic-bezier(0.75, 0, 0.25, 1); max-height: 0; }
.text-block .expand-box .expand-button span:after { content: 'weiterlesen'; }
.text-block .expand-box .expand-button.active span:after { content: 'Text schließen'; }

body.medicinal-cannabis #main__content { background: var(--cyan-90); }
body.medicinal-cannabis #main__content * { color: var(--cyan-50); }
body.medicinal-cannabis #main__content .button { background: var(--cyan-80); }
body.medicinal-cannabis #main__content .button:hover { background: var(--cyan-70); }

#main__title { padding-top: 20px; }
#main__title .container { border-bottom: 1px solid var(--antracite-20); padding: 15px 0 25px 0; }
#main__title .container h2 { overflow-wrap: break-word; }
@media screen and (min-width: 650px) { #main__title .container { padding: 30px 0 60px 0; }
  #main__title .container h2 { margin-left: -5px; } }
@media screen and (min-width: 1300px) { #main__title .container { padding: 30px 0 120px 0; }
  #main__title .container h2 { margin-left: -10px; }
  #main__title .blog-entry { width: 75%; } }

#main__title.branch { margin-bottom: 0; }
#main__title.branch .container { border: 0; }
#main__title.branch .container h2 { color: var(--red-50); }
#main__title.branch .container h2 .branch { color: var(--red-80); }

body.medicinal-cannabis #main__title { background: var(--cyan-90); }
body.medicinal-cannabis #main__title .container { border-color: var(--cyan-50); }
body.medicinal-cannabis #main__title .container h2 { color: var(--cyan-50); }

.branch .content-box { margin-bottom: 50px; }
.branch .content-box h3 { margin-bottom: .5em; }
.branch .content-box.opening-hours p.active { font-weight: 500; }
.branch .content-box.opening-hours .weekday { display: inline-flex; width: 150px; }

.branch .map-box iframe { border: 0; padding-bottom: 30px; width: 100%; height: 300px; }
.branch .map-action-box { margin-bottom: 50px; }
.branch .map-action-box .button { margin-bottom: 20px; width: 100%; }
.branch .map-action-box .button:last-child { margin-right: 0; }
.branch .map-action-box .button-filled { color: var(--white); background-color: var(--blue-80); }
.branch .map-action-box .button-outline { border-color: var(--blue-80); }
@media screen and (min-width: 650px) { .branch .map-box iframe { height: 350px; }
  .branch .map-action-box { display: flex; }
  .branch .map-action-box .button { flex: 1; margin-bottom: 0; } }
@media screen and (min-width: 990px) { .branch .map-box iframe { height: 400px; } }

#main__events { padding-bottom: 100px; background: var(--red-90); }
#main__events * { border-color: var(--red-50); color: var(--red-50); }
#main__events .container { border-color: var(--red-50); }
#main__events .page-info * { color: #fff; }

.event-list header { border-bottom: 1px solid var(--red-50); padding-bottom: 50px; }
.event-list header h2 { display: flex; }
.event-list header h2 .event-month { flex: 1; }
.event-list header h2 .event-year { font-weight: 400; }
.event-list .event { border-bottom: 1px solid var(--red-50); padding: 25px 0; }
.event-list .event aside .event-date { display: flex; flex-wrap: wrap; }
.event-list .event aside .event-date p { font-weight: 500; }
@media screen and (min-width: 990px) { .event-list .event aside .event-date p { flex-basis: 100%; }
  .event-list .event aside .event-date p.date { font-size: 30px; font-smoothing: true; line-height: 1.25; letter-spacing: -0.02em; } }
@media screen and (min-width: 1300px) { .event-list .event aside .event-date p.date { font-size: 36px; } }
.event-list .event .text-block { margin-bottom: 0; }
.event-list .event .text-block h2, .event-list .event .text-block h3, .event-list .event .text-block p { padding: 0; }
.event-list .event .text-block h2, .event-list .event .text-block h3, .event-list .event .text-block .daily_offer, .event-list .event .text-block .individual-text { color: #fff !important; }
.event-list .event .text-block .daily_offer { font-weight: 500; }
.event-list .event .text-block ul.action-box { display: flex; padding: 15px 0 0 0; list-style: none; float: left; }
.event-list .event .text-block ul.action-box li a.button-filled { text-decoration: none; color: var(--grey-90) !important; background: var(--mint-50); }
.event-list .event .text-block ul.action-box li a.button:hover { background: var(--white); }
.event-list .event .text-block ul.action-box li a.button-outline { border-color: var(--white) !important; text-decoration: none; color: var(--white) !important; background: transparent; }
.event-list .event .text-block ul.action-box li a.button-outline:hover { color: var(--grey-90) !important; }

.event-list:not(:first-child) { padding-top: 75px; }

.shop_wrapper { padding-bottom: 50px; }
.shop_wrapper .shop_item { border-top: 1px solid var(--white); padding: 25px 0; }
.shop_wrapper .shop_item * { color: var(--white) !important; }
.shop_wrapper .shop_item h3, .shop_wrapper .shop_item h4 { font-smoothing: true; font-size: 24px; line-height: 1.25; letter-spacing: -0.02em; }
.shop_wrapper .shop_item h3.name, .shop_wrapper .shop_item p.price { padding-bottom: 20px; }
.shop_wrapper .shop_item .producer { font-weight: 500; }
@media screen and (min-width: 990px) { .shop_wrapper .shop_item h3, .shop_wrapper .shop_item h4 { font-size: 30px; } }
@media screen and (min-width: 1300px) { .shop_wrapper .shop_item h3, .shop_wrapper .shop_item h4 { font-size: 36px; } }
.shop_wrapper .shop_item .detail_wrapper .detail { padding-bottom: 20px; }
.shop_wrapper .shop_item ul.action-box { list-style: none; }
.shop_wrapper .shop_item ul.action-box li .button-filled { text-decoration: none; color: var(--cyan-90) !important; background: var(--white); }
.shop_wrapper .shop_item ul.action-box li .button-outline { border-color: var(--white) !important; text-decoration: none; color: var(--white) !important; background: transparent; }
@media screen and (max-width: 650px) { .shop_wrapper .shop_item ul.action-box li { padding-bottom: 20px; }
  .shop_wrapper .shop_item ul.action-box li a { display: block; text-align: center; } }
@media screen and (min-width: 650px) { .shop_wrapper .shop_item ul.action-box { display: flex; float: left; } }
.shop_wrapper .shop_item:last-child { border-bottom: 1px solid var(--white); }
.shop_wrapper .shop_item.inactive { border-color: var(--cyan-50); }
.shop_wrapper .shop_item.inactive * { color: var(--cyan-50) !important; }
.shop_wrapper .shop_item.inactive ul.action-box li .button-outline { border-color: var(--cyan-50) !important; color: var(--cyan-50) !important; }
.shop_wrapper .terpenes_wrapper { overflow: hidden; transition: max-height 0.35s cubic-bezier(0.75, 0, 0.25, 1); max-height: 0; }
.shop_wrapper .terpenes_wrapper .shop_item.terpene { border-top: 1px solid var(--cyan-50); }
.shop_wrapper .terpenes_wrapper .shop_item.terpene * { color: var(--cyan-50) !important; }
.shop_wrapper .terpenes_wrapper .shop_item.terpene ul.effects { padding-bottom: 20px; list-style: none; }
.shop_wrapper .terpenes_wrapper .shop_item.terpene ul.effects li { font-weight: 500; }
.shop_wrapper .terpenes_wrapper .shop_item.terpene ul:not(.effects) { display: flex; list-style: none; float: left; }
.shop_wrapper .terpenes_wrapper .shop_item.terpene ul:not(.effects) li { font-weight: 500; }
.shop_wrapper .terpenes_wrapper .shop_item.terpene ul:not(.effects) li:not(:last-child):after { content: ',\00a0'; }

body.medicinal-cannabis .shop_wrapper { background: var(--cyan-90); }
body.medicinal-cannabis .shop_wrapper * { color: var(--cyan-50); }
body.medicinal-cannabis .shop_wrapper hr { background: transparent; }

#blog__overview { width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; margin-top: 50px; }

.blog__teaser { margin-bottom: 50px; }
.blog__teaser a:hover { text-decoration: none; }
.blog__teaser a:hover .headline { color: var(--antracite-30); }
.blog__teaser .category { border-bottom: 1px solid var(--antracite-10); color: var(--red-50); }
.blog__teaser .headline { margin: 30px 0; }
.blog__teaser .author { padding-top: 15px; }
.blog__teaser time { color: var(--antracite-30); }

.blog__teaser.top3 { padding-bottom: 100px; }
.blog__teaser.top3 .headline { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 15px; height: calc(2em*1.25); overflow: hidden; text-overflow: ellipsis; }

#blog__entry { width: calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0))))); margin-left: auto; margin-right: auto; }
#blog__entry time { color: var(--antracite-30); }
#blog__entry .teaser-block { margin-bottom: 0; }
#blog__entry .teaser-block h2 { padding: 1em 0 0 0; }
#blog__entry .teaser-block p { padding-top: 1em; font-size: 1.25em; line-height: 1.25; }

#blog__entry aside ul.categories { list-style: none; float: left; }
#blog__entry aside ul.categories li { margin-right: 1em; border: 1px solid var(--blue-80); border-radius: calc(2*1.5em); padding: .5rem .75em; }

#blog__entry .blog-entry > *:first-child { padding: 1em 0 .5em 0; }

/*# sourceMappingURL=app.css.map */