/* ###############
##### Basic ######
############### */
@media all {
    .ce-element {
        color: var(--ce-color-fg);
        position: relative;
        z-index: 2;
    }
    .ce-element.ce-type-div {
        z-index: 1;
    }

    .ce-element a:not(.btn,.page-link) {
        color: var(--ce-color-gray-dark, var(--ce-color-fg));
    }

    .ce-element a:not(.btn):focus ,
    .ce-element a:not(.btn):hover {
        color: var(--color-1);
    }

    .ce-teaserlink:focus .ce-teaserlink-link ,
    .ce-teaserlink:hover .ce-teaserlink-link ,
    .ce-element a:not(.btn):focus ,
    .ce-element a:not(.btn):hover {
        color: var(--color-1);
    }

    .ce-element .badge {
        --ce-color-link: #fff
    }

    .ce-teaserlink {
        position: relative;
        will-change: transform;
        transition: var(--transition-default);
    }

    .ce-teaserlink:focus ,
    .ce-teaserlink:hover {
        transform: translateY(calc(var(--size-1) * -.5));
    }

    .ce-herobanner.ce-teaserlink:focus ,
    .ce-herobanner.ce-teaserlink:hover {
        transform: none;
    }

    .ce-teaserlink:focus .ce-header ,
    .ce-teaserlink:hover .ce-header {
        color: var(--color-1)
    }

    .ce-teaserlink .ce-bodytext a {
        z-index: 4;
        position: relative
    }

    .ce-teaserlink .ce-teaserlink-link {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 3;
        opacity: 0
    }

    .ce-element {
        margin-bottom: var(--size-vertical-gap);
    }

    .ce-type-menu_subpages {
        margin-bottom: 0;
    }

    .ce-type-grid-swiper.swiper-active + .ce-type-div {        
        margin-top: calc((var(--size-vertical-gap) + 0.4375rem) * -1);
    }

    .ce-element > [class^="container"] > .ce-header {
        margin-bottom: var(--size-vertical-gap);
    }

    .ce-element + .ce-additional {
        margin-top: calc((var(--size-vertical-gap) * -1) + var(--size-4));
    }

    .ce-element + .ce-additional p .btn {
        margin-top: 0;
    }

    .page-content > :first-child:not(.subpart) ,
    .page-content > .subpart > :first-child {
        margin-top: var(--size-vertical-gap);
    }

    .page-content .btn ,
    .page-footer .btn ,
    #cookieman-modal .btn ,
    .pagination .page-link {    
        box-shadow: var(--shadow-box);
        display: inline-flex;
        flex-direction: row;
        gap: var(--size-1);
        align-items: center;
        text-align: left;
        /*! align-items: start; */
        line-height: 1.25;
    }

    .pagination .page-link {   
        border-radius: var(--size-1);
    }

    .ce-uploads .btn {
        display: flex;
    }

    hr {
        border-top: var(--border-default);
        opacity: 1;
    }

}

/* #################
##### Random shit ######
################# */
@media all {

    .ce-expandable-inner + .ce-expandable-bottom .ce-show-opened ,
    .ce-expandable-inner.show + .ce-expandable-bottom .ce-show-closed {
        display: none;
    }

    .ce-expandable-inner + .ce-expandable-bottom .ce-show-closed ,
    .ce-expandable-inner.show + .ce-expandable-bottom .ce-show-opened {
        display: block;
    }

    .mfp-figure:after {
        background-color: var(--color-white);
    }

    .ce-localized-id {
        visibility: hidden;
        height: 0;
    }

    .accordion-item {
        border-right: none;
        border-left: none;
    }

    .accordion-item .ce-header {
        margin-bottom: 0;
    }

    .accordion-button {
        color: inherit;
        font-size: inherit;
        border-radius: 0;
        border-bottom: none !important;
        background-color: transparent;
        box-shadow: none;
        display: flex;
        flex-direction: row-reverse;
        align-items: start;
        justify-content: start;
    }

    .accordion-button::after {
        height: unset;
        width: unset;;
        content: "";
        background-image: none;
        margin: 0;
        position: absolute;
        left: 0;
        content: "\f0d7";
        -moz-osx-font-smoothing: grayscale;
        font-style: normal;
        font-variant: normal;
        line-height: 1;
        text-rendering: auto;
        font-family: var(--fa-style-family,"Font Awesome 6 Free");
        font-weight: var(--fa-style,900);
    }

    .accordion-button:not(.collapsed)::after {
        content: "\f0d8";
        transform: none;
        margin-top: .125em;
    }

    .accordion-body {
        padding-top: 0;
        padding-bottom: var(--size-8);
    }

    .accordion-item:focus .accordion-button ,
    .accordion-item:hover .accordion-button {
        color: var(--color-1);
    }

    /*
    .page-header-searchbox-modal {
    backdrop-filter: blur(1px);
}
    */

    .alert {
        padding: 0;
        font-weight: 700;
    }

    .alert .form-check {
        margin: 0;
        display: flex;
        align-items: center;
        gap: var(--size-1);
        transform: none;
        padding: var(--size-1) var(--size-2);
    }

    .alert:focus ,
    .alert:hover {
        background-color: var(--color-gray-dark);
        border-color: var(--color-gray-dark);
    }

    .alert .form-check input {
        margin: 0;
    }

    .alert .form-check label {
        flex-grow: 1;
    }

    .alert .form-check label::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

}

/* #################
##### Animations ######
################# */
@media all {

    @-webkit-keyframes highlight-fade {
        0% {
            background-color: rgba(var(--color-1-rgb), .25);
        }

        100% {
            background-color: rgba(0, 0, 0, 0);
        }
    }

    @keyframes highlight-fade {
        0% {
            background-color: rgba(var(--color-1-rgb), .25);
        }

        100% {
            background-color: rgba(0, 0, 0, 0);
        }
    }

}

/* #################
##### MMenu ######
################# */
@media all {

    body .mm-menu .mm-panels ,
    body .mm-menu .mm-panels > .mm-panel {
        background: transparent;
    }

    body .mm-menu .mm-panels > .mm-panel {
        transition: .25s ease-in-out;
        opacity: 0;
    }

    body .mm-menu .mm-panels > .mm-panel.mm-panel--opened {
        opacity: 1;
    }

}

/* #################
##### Embed ######
################# */
@media all {
    .ce-embed {
        position: relative;
        height: 0;
        overflow: hidden;
        padding-bottom: 56.25%
    }

    .ce-embed-default {
        padding-bottom: 56.25%
    }

    .ce-embed-ratio-1-1 {
        padding-bottom: 100%
    }

    .ce-embed-ratio-4-3 {
        padding-bottom: 75%
    }

    .ce-embed-ratio-3-2 {
        padding-bottom: 66.6667%
    }

    .ce-embed-ratio-16-10 {
        padding-bottom: 62.5%
    }

    .ce-embed-ratio-16-9 {
        padding-bottom: 56.25%
    }

    .ce-embed>* {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        border: 0
    }

    .ce-embed-audio {
        position: static;
        height: auto
    }

    .ce-embed-audio>* {
        position: static;
        height: auto;
        min-height: 32px;
        overflow: visible
    }
}

/* ###################
##### Uploads ######
################### */
@media all {

    .ce-type-uploads ul {
        list-style: none;
        padding-left: 0;
    }

    .ce-type-uploads li + li {
        margin-top: var(--size-2);
    }

    .ce-type-uploads a {
        padding: var(--size-2);
        display: flex;
        gap: var(--size-2);
        justify-content: left;
        align-items: center;
        text-align: left;
    }

    .ce-type-uploads i {
        margin-left: var(--size-1);
        font-size: 1.5em;
    }

    .ce-type-uploads img {
        max-width: var(--size-8);
        border: 0.125rem solid transparent;
        border-radius: calc(var(--border-radius) / 2);
    }

    .ce-type-uploads a:focus img ,
    .ce-type-uploads a:hover img {
        /*
        border-color: rgb(var(--color-white-rgb), .75);
        */
        border-color: var(--color-white-rgb);
        box-shadow: 0 0 var(--size-2) rgba(255, 255, 255, .25);
    }

}

/* #################
##### Gallery ######
################# */
@media all {
    .ce-gallery {
        /*! margin-bottom: var(--ce-gallery-margin-vertical, 1rem) */
        display: grid;
        gap: var(--size-grid-gap);
    }

    .ce-gallery .ce-media,
    .ce-gallery .ce-media-caption,
    .ce-gallery a,
    .ce-gallery picture,
    .ce-gallery img {
        display: block;
        height: auto;
        max-width: 100%;
        width: 100%;
    }

    .ce-gallery {
        display: grid;
        flex-direction: column;
    }

    .ce-gallery[data-ce-columns="1"] {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    .ce-gallery[data-ce-columns="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .ce-gallery[data-ce-columns="3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .ce-gallery[data-ce-columns="4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ce-gallery .ce-media {
        overflow: hidden;
    }

    .ce-layout-menu_products_card .ce-gallery {
        padding: var(--size-4);
        height: 12rem;
        box-sizing: content-box;
    }

    .ce-layout-menu_products_card .ce-gallery img {
        height: 12rem;
        width: auto;
        margin: 0 auto;
    }

    .product-intro .ce-gallery figure ,
    .product-gallery .ce-gallery figure {
        -webkit-clip-path: polygon(0 0,100% 0,100% calc(100% - 2em),calc(100% - 2em) 100%,0 100%);
        clip-path: polygon(0 0,100% 0,100% calc(100% - 2em),calc(100% - 2em) 100%,0 100%);
    }

    .ce-gallery .ce-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: var(--ce-gallery-gutter);
        margin-bottom: var(--ce-gallery-gutter)
    }

    .ce-gallery .ce-row:last-child {
        margin-bottom: 0
    }

    .ce-gallery .ce-column {
        width: 100%;
        max-width: var(--ce-gallery-column-width)
    }

    .ce-gallery.ce-width-set .ce-column {
        width: auto;
        display: inline-block;
        vertical-align: top
    }

    .ce-gallery.ce-height-set {
        --ce-gallery-column-width: unset
    }

    .ce-gallery.ce-height-set .ce-column {
        width: auto;
        max-width: 100%
    }

    .ce-above-header .ce-gallery .ce-row,
    .ce-center .ce-gallery .ce-row {
        justify-content: center
    }
}

/* ###############
##### Media ######
############### */
@media all {
    .ce-media {
        margin: 0
    }

    .ce-media img[src$=svg] {
        width: 100%;
        -o-object-fit: contain;
        object-fit: contain
    }

    .ce-media-copyright {
        position: absolute;
        z-index: 1;
        font-size: var(--ce-media-copyright-size);
        line-height: 1;
        text-transform: uppercase;
        text-align: right;
        color: rgba(255, 255, 255, .75);
        text-shadow: 1px 1px 1px rgba(0, 0, 0, .25);
        left: var(--ce-media-overlay-offset);
        right: var(--ce-media-overlay-offset);
        bottom: var(--ce-media-overlay-offset);
        pointer-events: none
    }

    .ce-media-image a {
        position: relative;
        display: block;
        text-decoration: none
    }

    .ce-media-image a img {
        transition: var(--transition-default);
        will-change: transform;
        transition-property: transform;
    }

    .ce-media-image a:focus img ,
    .ce-media-image a:hover img {
        transform: scale(1.05);
    }

    /*

    .ce-media-image a::before {
    content: "";
    font-family: "Font Awesome 6 Free";
    font-size: var(--ce-media-icon-size);
    font-weight: 700;
    line-height: 1;
    width: var(--ce-media-icon-size);
    height: var(--ce-media-icon-size);
    position: absolute;
    z-index: 1;
    top: var(--ce-media-overlay-offset);
    right: var(--ce-media-overlay-offset);
    color: #fff;
    text-shadow: 0 0 1px rgba(0, 0, 0, .25);
    background: none;
    display: none;
}

    .ce-media-image a.lightbox::before {
    content: ""
}

    */

    .ce-media-image .ce-media-caption a::before {
        content: none
    }

    .ce-layout-youtube_link .ce-media-image a::before ,
    .ce-layout-youtube_link .ce-media-image a::after {
        content: "\f167";
        font-size: 4em;
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        display: block;
        font-style: normal;
        font-variant: normal;
        line-height: 1;
        text-rendering: auto;
        font-family:"Font Awesome 6 Brands";
        font-weight: var(--fa-style,900);
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 2;
        transform: translate(-50%, -50%);
        color: rgba(255,0,0,1);
    }
    
    .ce-layout-youtube_link .ce-media-image a::after {
        content: '';
        position: absolute;
        width: .5em;
        height: .5em;
        border-radius: .125rem;
        background-color: rgb(255,255,255);
        z-index: 0;
    }

}

/* ###############
##### Table ######
############### */
@media all {
    .table {
        width: auto;
        width: 100%;
        margin-bottom: 0
    }

    .table.table-100 {
        width: 100%
    }

    .table tbody td {
        min-width: 6rem
    }

    .ce-frame-align-data-right td {
        text-align: right
    }

    .contenttable-container {
        overflow: auto;
        max-width: 100%;
        background: -webkit-gradient(linear, left top, right top, color-stop(30%, white), to(rgba(255, 255, 255, 0))), -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(70%, white)) 0 100%, radial-gradient(farthest-side at 0% 50%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) 0 100%;
        background: linear-gradient(to right, white 30%, rgba(255, 255, 255, 0)), linear-gradient(to right, rgba(255, 255, 255, 0), white 70%) 0 100%, radial-gradient(farthest-side at 0% 50%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) 0 100%;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
        background-position: 0 0, 100%, 0 0, 100%;
        background-attachment: local, local, scroll, scroll
    }

    .contenttable-container.js-table-overflow-x {
        overflow-x: auto
    }
    .table > :not(caption) > * > * {
        min-width: 30%;
        border-bottom: .0625rem dashed rgba(var(--color-gray-rgb), .15);
    }
    .table > :not(caption) > *:last-child > * {
        border-bottom: 0 none transparent;
    }
}

/* ###############
##### Frame ######
############### */
@media all {

    .ce-frame-partners {
        filter: grayscale(1) contrast(0.25) brightness(1.25);        
    }

    .ce-frame-partners .row > * ,
    .ce-frame-partners .ce-element ,
    .ce-frame-partners .ce-textmedia {
        display: grid;
    }

    .ce-frame-partners .ce-textmedia {
        align-items: center;
    }

    .ce-frame-partners img {
        margin: 0 auto;
        max-width: min(28vw, 16rem);
        max-height: 8rem;
        object-fit: contain;
    }

}

/* ################
##### Layout ######
################ */
@media all {

    .ce-layout-box {
        position: relative;
    }

    .ce-layout-box::before ,
    .ce-layout-box::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    .ce-layout-box::before {
        z-index: -2;
        border-bottom-right-radius: 3.75rem;
        -webkit-box-shadow: var(--ce-layout-box-shadow, none);
        box-shadow: var(--ce-layout-box-shadow, none);
        transition: var(--transition-default);
    }

    .ce-layout-box.ce-teaserlink:focus::before ,
    .ce-layout-box.ce-teaserlink:hover::before {
        box-shadow: var(--shadow-box-hover);
    }

    .ce-layout-box::after {
        z-index: -1;
        background-color: var(--color-white, rgb(255, 255, 255));
        -webkit-clip-path:polygon(0 0,100% 0,100% calc(100% - 2em),calc(100% - 2em) 100%,0 100%);
        clip-path:polygon(0 0,100% 0,100% calc(100% - 2em),calc(100% - 2em) 100%,0 100%);
    }

    .ce-layout-box > .ce-textmedia ,
    .ce-layout-box .ce-wrap-inner {
        padding: var(--ce-layout-box-padding, 0.625rem);
        color: var(--ce-color-fg, rgb(51, 51, 51));
        display: flex;
        flex-direction: column;
    }

    .ce-layout-box .ce-gallery {
        position: relative;
        overflow: clip;
    }

    .ce-layout-box .ce-gallery::before {
        max-width: var(--max);
        margin: 0 auto;
        z-index: 10;
        content: "";
        display: block;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        padding-bottom: .75rem;
        box-shadow: 0 0 min(10vw, 4rem) rgba(0,0,0,.375);
        border-radius: 100%;
        /*! display: none; */
    }

    .ce-layout-box >.ce-above-header>.ce-gallery,
    .ce-layout-box >.ce-above>.ce-gallery,
    .ce-layout-box >.ce-below>.ce-gallery {
        margin-left: calc(-1*var(--ce-layout-box-padding, 0.625rem));
        margin-right: calc(-1*var(--ce-layout-box-padding, 0.625rem));
        margin-bottom: var(--ce-layout-box-padding);
    }

    .ce-layout-box >.ce-above-header {
        margin-top: calc(-1*var(--ce-layout-box-padding, 0.625rem));
        /*! margin-bottom: var(--ce-layout-box-padding); */
    }
}

/* ###############
##### Space ######
############### */
@media all {
    .ce-space-before-none {
        margin-top: 0 !important
    }

    .ce-space-before-extra-small {
        margin-top: var(--ce-margin-extra-small) !important
    }

    .ce-space-before-small {
        margin-top: var(--ce-margin-small) !important
    }

    .ce-space-before-medium {
        /*! margin-top: var(--ce-margin-medium) !important */
    }

    .ce-space-before-large {
        margin-top: var(--ce-margin-large) !important
    }

    .ce-space-before-extra-large {
        margin-top: var(--ce-margin-extra-large) !important
    }

    .ce-space-after-none {
        margin-bottom: 0 !important
    }

    .ce-space-after-extra-small {
        margin-bottom: var(--ce-margin-extra-small) !important
    }

    .ce-space-after-small {
        margin-bottom: var(--ce-margin-small) !important
    }

    .ce-space-after-medium {
        margin-bottom: var(--ce-margin-medium) !important
    }

    .ce-space-after-large {
        margin-bottom: var(--ce-margin-large) !important
    }

    .ce-space-after-extra-large {
        margin-bottom: var(--ce-margin-extra-large) !important
    }
}

/* ################
##### Header ######
################ */
@media all {
    .ce-header-left {
        text-align: left
    }

    .ce-header-center {
        text-align: center
    }

    .ce-header-right {
        text-align: right
    }

    .ce-header-with-icon i[aria-hidden] {
        margin-right: .25em
    }
}

/* ###################
##### Textmedia ######
################### */
@media all {
    .ce-textmedia.ce-intext .ce-gallery {
        width: var(--ce-gallery-width, calc(50% - var(--ce-gallery-margin-horizontal) / 2))
    }

    .ce-textmedia.ce-intext .ce-gallery.ce-width-set {
        width: auto !important;
        max-width: var(--ce-gallery-width, calc(50% - var(--ce-gallery-margin-horizontal) / 2))
    }

    .ce-textmedia.ce-intext.ce-right .ce-gallery {
        float: right;
        margin-left: var(--ce-gallery-margin-horizontal, 1rem)
    }

    .ce-textmedia.ce-intext.ce-left .ce-gallery {
        float: left;
        margin-right: var(--ce-gallery-margin-horizontal)
    }

    .ce-textmedia.ce-intext.ce-left ol,
    .ce-textmedia.ce-intext.ce-left ul {
        overflow: auto
    }

    .ce-textmedia.ce-intext.ce-nowrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: var(--ce-textmedia-nowrap-wrap, nowrap);
        flex-wrap: var(--ce-textmedia-nowrap-wrap, nowrap);
        -webkit-column-gap: var(--size-grid-gap, 1rem);
        -moz-column-gap: var(--size-grid-gap, 1rem);
        column-gap: var(--size-grid-gap, 1rem);
        row-gap: var(--ce-layout-box-padding);
    }

    .ce-textmedia.ce-intext.ce-nowrap .ce-textmedia-inner {
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }

    .ce-textmedia.ce-intext.ce-nowrap .ce-gallery {
        width: var(--ce-gallery-width, calc(50% - var(--ce-gallery-margin-horizontal) / 2));
        -ms-flex-negative: 0;
        flex-shrink: 0;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: auto;
    }

    .ce-textmedia.ce-below .ce-gallery {
        margin-bottom: 0
    }

    .ce-textmedia.ce-below:not(.ce-no-text) .ce-gallery ,
    .ce-textmedia.ce-above .ce-gallery + .ce-textmedia-inner {
        margin-top: var(--ce-gallery-margin-vertical, 1rem)
    }

    .ce-type-grid-fluid.ce-frame-devices .ce-textmedia-inner::before ,
    .ce-type-menu_subpages.ce-layout-menu_products .ce-textmedia-inner::before {
        content: "";
        display: block;
        position: relative;
        padding-bottom: var(--size-2);
        border-top: .125rem solid rgba(0, 0, 0, .0375);
        width: 100%;
    }
}

/* ##############
##### Menu ######
############## */
@media all {
    .ce-menu>.current>.item {
        background: rgba(0, 0, 0, .125)
    }

    .ce-menu {
        list-style: none;
        padding-left: 0;
        margin-bottom: 0;
    }

    .ce-menu .ce-menu {
        padding-left: 1.25rem
    }
}

/* ####################
##### Textexpand ######
#################### */
@media all {

    .ce-textexpand-btn,
    .ce-textexpand-text {
        margin-top: var(--ce-margin-extra-small, 1rem)
    }

    .ce-textexpand-btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
        gap: .3125em;
        border: none;
        background: none;
        padding: 0;
        color: var(--ce-color-link, inherit)
    }

    .ce-textexpand-btn[aria-expanded=false]:not(:first-of-type) {
        display: none
    }

    .ce-textexpand-btn[aria-expanded=true]:first-of-type {
        display: none
    }
}

/* #################
##### Divider ######
################# */
@media all {
    .ce-div {
        margin: 0
    }
}

/* ################
##### Flyout ######
################ */
@media all {
    .page-flyout svg {
        display: block;
        height: auto;
        aspect-ratio: 1 / 1;
        line-height: 1;
    }

    .page-flyout svg * {
        fill: var(--color-white)
    }

    .page-flyout {
        color: var(--color-white);
    }

    .ce-flyout-buttons {
        z-index: 0;
        position: relative;
        padding: var(--size-2);
        background: var(--color-1);
        border-radius: var(--size-1) 0 0 var(--size-1);
        gap: var(--size-2);
    }

    .ce-flyout-button-icon {
        width: 1.5rem;
        height: auto;
        aspect-ratio: 1 / 1;
        line-height: 1;
    }

    .ce-flyout-content-icon {
        width: var(--size-8);
        margin-right: var(--size-3);
    }

    .ce-flyout-content {
        top: 50%;
        transform: translateY(-50%);
        min-width: 40ch;
        left: 100%;
        will-change: true;
        transition: var(--transition-default);
        z-index: 1;
        background: rgba(0,0,0,.8);
        padding: var(--size-4);
        gap: var(--size-2);
        border-left: .5rem solid var(--color-1);
        border-top-left-radius: var(--size-1);
        border-bottom-left-radius: var(--size-1);
    }

    .ce-flyout-content > * + * {
        border-top: .125rem solid rgba(var(--color-white-rgb),.1);
        padding-top: var(--size-2);
    }

    .page-flyout .ce-flyout-content-text *:last-child {
        margin: 0;
    }

    .page-flyout:hover .ce-flyout-content {
        transform: translateY(-50%) translateX(-100%);
    }

    .ce-flyout-content-text {
        font-weight: 400;
    }
}

/* ##############
##### News ######
############## */
@media all {
    .news-list-item + .news-list-item {
        padding-top: var(--size-vertical-gap);
        border-top: 1px dashed rgba(0,0,0,0.2);
    }

    .pagination {
        gap: var(--size-1);
    }
}

/* ####################
##### Herobanner ######
#################### */
@media all {

    .ce-herobanner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, calc(var(--width-content-xxl) / 2)) minmax(0, calc(var(--width-content-xxl) / 2)) minmax(0, 1fr);
        align-items: flex-end;
        width: 100%;
    }

    .ce-herobanner > * {
        grid-column: 2 / -2;
        grid-row: 1 / -1;
        position: relative;
    }

    .ce-herobanner > .ce-gallery {
        grid-column: 1 / -1;
        position: static;
    }

    .ce-herobanner-text {
        padding-top: var(--size-5);
        padding-bottom: calc(var(--size-10) + .75rem);
        color: var(--color-white);
    }

    .ce-herobanner::before {
        content:"";
        display: block;
        grid-column: 1 / -1;
        grid-row: 1 / -1;
        width: 100%;
        height: 100%;
        background: linear-gradient(0deg, var(--color-black), rgba(var(--color-black-rgb),.5) 25%, rgba(var(--color-black-rgb),0));
        position: relative;
    }

    .ce-type-mask_herobanner .swiper-pagination-bullet {
        background-color: var(--color-white);
        opacity: 1;
    }

    .ce-type-mask_herobanner .swiper-pagination-bullet-active {
        background-color: var(--color-1);
    }

}

@media (min-width: 36rem) {
    .ce-herobanner {
        align-items: center;
    }

    .ce-herobanner::before {
        grid-column: 1 / 3;
        background: linear-gradient(90deg, var(--color-black), rgba(var(--color-black-rgb),.75) 50%, rgba(var(--color-black-rgb),0));
    }

    .ce-herobanner-position-right::before {
        grid-column: 3 / -1;
        background: linear-gradient(90deg, rgba(var(--color-black-rgb),0), rgba(var(--color-black-rgb),.75) 50%, var(--color-black));
    }

    .ce-herobanner-text {
        padding-bottom: var(--size-5);
    }
}