/* ############### Hero Text Element ############### */

.HeroTextElement {
    margin-top: 6vw;
    margin-bottom: 2vw;
}

.typography .HeroTextElement h1.hero,
.typography .HeroTextElement h2.hero,
.typography .HeroTextElement h3.hero,
.typography .HeroTextElement p.hero
{
    font-size: 2.1rem;
    font-weight: var(--main-font-weight-regular);
    margin-bottom: 0.4em;
}

.typography .HeroTextElement .hero > br,
.typography .HeroTextElement p > br {
    display: none;
}

@media(max-width: 768px){
    .HeroTextElement {
        margin-top: 6vw;
        margin-bottom: 4vw;
    }

    .typography .HeroTextElement p br {
        display: inline-block;
    }

    .typography .HeroTextElement .hero > br {
        display: inline-block;
    }
}


/* ############### Text Element ############### */

.TextElement {
    margin-top: var(--default-padding);
    margin-bottom: calc(var(--default-padding) * 2);
}

.TextElement > .wrapper {
    width: 1280px;
    max-width: 90%;
}

@media (max-width: 768px){
    .TextElement > .wrapper {
        max-width: 100%;
    }
}

.HeroTextElement + .TextElement {
    margin-top: calc(calc(6vw - var(--default-padding)) * -1);
}

.typography .TextElement h1 {
    font-size: 2.1rem;
    margin-top: 6vw;
    margin-bottom: 4vw;
    font-weight: var(--main-font-weight-regular);
}

.typography .TextElement h2 {
    font-size: 1.8rem;
    margin-top: 1em;
    margin-bottom: 0.5em;
    font-weight: var(--main-font-weight-regular);
}

.typography .TextElement h3 {
    font-size: 1.4rem;
    margin-top: 0.8em;
    margin-bottom: 0.5em;
    font-weight: var(--main-font-weight-regular);
}

.typography .TextElement h4,
.typography .TextElement h5,
.typography .TextElement h6
{
    font-size: 1rem;
    margin-top: 0.8em;
    margin-bottom: 0.3em;
    font-weight: var(--main-font-weight-medium);
}

.typography .TextElement p {
    font-size: 1rem;
    margin-top: 0.3em;
    margin-bottom: 0.5em;
}

.typography .TextElement p a {
    text-decoration: underline;
}



/* ############### Story Element ############### */

:root,
:host
{
    --segment-gap: 2em;
    --segment-width: calc(22% - calc(var(--segment-gap) / 2));
    --story-layer-padding: var(--default-padding);
    --story-base-font-size: 1.25vw;
    --story-headline-text-color: #F4F6F6;
    --segment-max-width: 401px;
}

@media(min-width: 1401px){
    :root,
    :host
    {
        --story-base-font-size: 0.7rem;
        --story-layer-padding: calc(var(--default-padding) * 1.75);
    }
}

@media(max-width: 1400px){
    :root,
    :host
    {
        --story-layer-padding: calc(var(--default-padding) * 2);
    }
}

@media(max-width: 1280px){
    :root,
    :host
    {
        --story-base-font-size: 1.2vw;
    }
}

@media(max-width: 1170px){
    :root,
    :host
    {
        --story-base-font-size: 14px;
    }
}

@media(max-width: 1400px) AND (orientation: portrait){
    :root,
    :host
    {
        --segment-width: calc(40% - calc(var(--segment-gap) / 2));
        --story-layer-padding: calc(var(--default-padding) * 2);
    }
}

@media(max-width: 700px) AND (orientation: portrait){
    :root,
    :host
    {
        --segment-width: calc(90% - calc(var(--segment-gap) / 2));
    }
}

.story-wrapper {
    position: relative;
    margin-bottom: 0;
    background-color: #000000;
}

.story-wrapper .scrolly-video {
    z-index: 1;
    height: 100dvh;
    width: 100%;
    overflow: hidden;
}

.story-wrapper .scrolly-video video {
    height: 100% !important;
    /*width: 177.77777778vh !important;*/
    width: 100vw !important;
    min-width: 100% !important;
    /*min-height: 56.25vw !important;*/
    min-height: 100vh !important;
    object-fit: cover;
    opacity: 0;
}

.story-wrapper .scrolly-video.ready video {
    opacity: 1;
}

.story-wrapper .scrolly-video > .params {
    display: inline-block;
    position: sticky;
    z-index: 2;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    padding: 0.2em 0.6em;
    background: rgba(255,255,255,0.5);
    font-size: 14px;
    line-height: 18px;
}

.story-wrapper .scrolly-video > .loading-wrapper {
    display: none;
}

.story-wrapper .scrolly-video.loading > .loading-wrapper {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    justify-content: center;
    position: sticky;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100dvh;
}

.story-wrapper .scrolly-video.loading > .loading-wrapper svg {
    margin-top: 6rem;
}

.story-wrapper .scrolly-video.loading > .loading-wrapper svg rect {
    fill: #FFFFFF;
}

@keyframes loadingSVGAnimation{
    0%,
    66.66% {
        animation-timing-function:cubic-bezier(0.36,.61,.3,.98);
        y:1rem;
        height: 2rem;
    }
    33.33% {
        animation-timing-function:cubic-bezier(0.36,.61,.3,.98);
        y:0.166666rem;
        height:4rem;
    }
}

.story-wrapper .scrolly-video.loading > .loading-wrapper svg .spinner {
    animation:loadingSVGAnimation .9s linear infinite;
    animation-delay:-.9s;
}

.story-wrapper .scrolly-video.loading > .loading-wrapper svg .spinner_2{animation-delay:-.8s}
.story-wrapper .scrolly-video.loading > .loading-wrapper svg .spinner_3{animation-delay:-.7s}
.story-wrapper .scrolly-video.loading > .loading-wrapper svg .spinner_4{animation-delay:-.6s}
.story-wrapper .scrolly-video.loading > .loading-wrapper svg .spinner_5{animation-delay:-.5s}


.story-wrapper.finished .scrolly-video > .params {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
}

.story-wrapper .scrolly-video > .params > span.progress {
    color: red;
}

.story-wrapper .content-layer {
    display: block;
    position: fixed;
    left: -100vw;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 100dvh;
    overflow: hidden;
}

.story-wrapper .content-layer.fixed-top {
    position: absolute;
    left: 0;
    top: 0;
}

.story-wrapper .content-layer.fixed-bottom {
    position: absolute;
    left: 0;
    top: auto;
    bottom: 0;
}

.story-wrapper[data-viewport="desktop"] .content-layer[data-viewport="desktop"],
.story-wrapper[data-viewport="desktop"] .content-layer[data-viewport="tablet"],
.story-wrapper[data-viewport="desktop"] .content-layer[data-viewport="mobile"],
.story-wrapper[data-viewport="tablet"]  .content-layer[data-viewport="desktop"],
.story-wrapper[data-viewport="tablet"]  .content-layer.ready[data-viewport="desktop"],
.story-wrapper[data-viewport="tablet"]  .content-layer[data-viewport="tablet"],
.story-wrapper[data-viewport="tablet"]  .content-layer.ready[data-viewport="mobile"],
.story-wrapper[data-viewport="tablet"]  .content-layer[data-viewport="mobile"],
.story-wrapper[data-viewport="mobile"]  .content-layer[data-viewport="desktop"],
.story-wrapper[data-viewport="mobile"]  .content-layer.ready[data-viewport="desktop"],
.story-wrapper[data-viewport="mobile"]  .content-layer.ready[data-viewport="tablet"],
.story-wrapper[data-viewport="mobile"]  .content-layer[data-viewport="tablet"],
.story-wrapper[data-viewport="mobile"]  .content-layer[data-viewport="mobile"]
{
    left: -100vw;
}

.story-wrapper[data-viewport="desktop"] .content-layer.ready[data-viewport="desktop"],
.story-wrapper[data-viewport="tablet"] .content-layer.ready[data-viewport="tablet"],
.story-wrapper[data-viewport="mobile"] .content-layer.ready[data-viewport="mobile"]
{
    left: 0;
}

.story-wrapper .content-layer .layer {
    opacity: 0;
    position: absolute;
    z-index: unset;
    width: 100%;
    height: 100%;
    top: 0;
    left: -100%;
    transition: opacity 0.3s, left 0s;
    transition-delay: 0s, 0.3s;
    font-size: 1rem;
}

.story-wrapper .content-layer .layer.visible {
    opacity: 1;
    left: 0;
    transition: left 0s, opacity 0.3s;
    transition-delay: 0s, 0.3s;
}

.layer .debug {
    display: inline-block;
    float: right;
    background: rgba(255,255,255,0.5);
    font-size: 14px;
    line-height: 18px;
    padding: 5px;
}

.layer .debug .title {

}

.layer .debug .params {

}

.layer .layer-content-wrapper {
    display: flex;
    flex-flow: column nowrap;
    width: 100%;
    height: 100%;
    position: absolute;
    color: #FFFFFF;
    row-gap: 0;
    column-gap: 0;
    padding: var(--story-layer-padding);
    box-sizing: border-box;
    font-size: var(--story-base-font-size);
}

.layer .layer-content-wrapper .headline {
    flex: 0 0 auto;
    padding-bottom: var(--story-layer-padding);
}

.layer .layer-content-wrapper .headline h2 {
    color: inherit;
    font-size: 3em;
    margin: 0;
    font-weight: var(--main-font-weight-light);
}

@media(max-width: 1280px){
    .layer .layer-content-wrapper .headline h2 {
        font-size: 3.75vw;
    }
}

@media(max-width: 750px){
    .layer .layer-content-wrapper .headline h2 {
        font-size: 28px;
    }
}

.layer .layer-content-wrapper .headline .content-wrapper {
    /* max-width: 33%; */
}

.layer .layer-content-wrapper .headline.center .content-wrapper {
    text-align: left;
}

.layer .layer-content-wrapper .headline.center h2 + .content-wrapper {
    width: var(--segment-width);
}

.layer .layer-content-wrapper .headline.center .content-wrapper .center {
    text-align: center;
}

.layer .layer-content-wrapper .headline h2 + .content-wrapper {
    margin-top: 0.4em;
}

.layer .layer-content-wrapper .headline .content-wrapper p {
    font-size: 1.2em;
    color: var(--story-headline-text-color);
    font-weight: var(--main-font-weight-regular);
    width: 100%;
    display: inline-block;
}

.layer .layer-content-wrapper .headline.left {

}

.layer .layer-content-wrapper .headline.center {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
}

.layer .layer-content-wrapper .headline.center > h2 {
    display: inline-block;
    text-align: left;
    flex: 1 1 auto;
    width: auto;
}

.layer .layer-content-wrapper .headline.center.segment-count-0 > h2,
.layer .layer-content-wrapper .headline.center.segment-count-1 > h2
{
    width: var(--segment-width);
}

.layer .layer-content-wrapper .headline.center.segment-count-2 > h2 {
    width: calc(calc(var(--segment-width) * 2) + var(--segment-gap));
    max-width: calc(calc(var(--segment-max-width) * 2) + var(--segment-gap));
}

.layer .layer-content-wrapper .headline.center.segment-count-3 > h2 {
    width: calc(calc(var(--segment-width) * 3) + calc(var(--segment-gap) * 2));
    max-width: calc(calc(var(--segment-max-width) * 3) + calc(var(--segment-gap) * 2));
}

.layer .layer-content-wrapper .segments {
    flex: 1 1 100%;
}

.layer .layer-content-wrapper .segments .segment-wrapper {
    flex: 0 0 100%;
    display: flex;
    flex-flow: column nowrap;
    row-gap: var(--segment-gap);
    column-gap: var(--segment-gap);
}

.layer .layer-content-wrapper .segments.column {

}

.layer .layer-content-wrapper .segments.row {
    display: flex;
    flex-flow: column nowrap;
}

.layer .layer-content-wrapper .segments.column .segment-wrapper {
    flex-flow: column nowrap;
    height: 100%;
}

.layer .layer-content-wrapper .segments.row .segment-wrapper {
    flex-flow: row nowrap;
}

.layer .layer-content-wrapper .segments .segment-wrapper .segment {
    flex: 0 0 auto;
    display: flex;
    flex-flow: column nowrap;
    width: var(--segment-width);
    max-width: calc(var(--segment-max-width) + var(--segment-gap));
    z-index: 4;
}

.layer .layer-content-wrapper .segments .segment-wrapper .segment.visible-controlled {
    opacity: 0;
    transition: opacity 0.2s;
}

.layer .layer-content-wrapper .segments .segment-wrapper .segment.visible-controlled.visible {
    opacity: 1;
    transition: opacity 0.2s;
}

.layer .layer-content-wrapper .segments .segment-wrapper .segment.allways-visible {
    opacity: 1;
}

.layer .layer-content-wrapper .segment .image {
    margin-bottom: 0.4em;
}

.layer .layer-content-wrapper .segment .image img {
    width: 2.5em;
}

.layer .layer-content-wrapper .segment h3.title {
    color: inherit;
    line-height: 1.1;
    font-weight: var(--main-font-weight-light);
    margin-bottom: 0.5em;
    font-size: 1.4em;
}

.layer .layer-content-wrapper .segment .topic {
    font-size: 1.0em;
    line-height: 1.5em;
    font-weight: var(--main-font-weight-light);
}

.layer .layer-content-wrapper .segment .content {
    color: inherit;
    line-height: 1.5;
    font-size: 0.815em;
}

.layer .layer-content-wrapper .segment .content p {
    font-size: 1.25em;
    line-height: 1.3em;
    font-weight: var(--main-font-weight-light);
    color: var(--story-headline-text-color);
}

.layer .layer-content-wrapper .segment .content p.major {
    font-size: 2.0em;
    white-space: nowrap;
}

[data-viewport="mobile"] .layer .layer-content-wrapper .segment .content p.major {
    white-space: normal;
}

/* Column Segments */

.layer .layer-content-wrapper[data-variant="right-center"] .segments.column .segment-wrapper {
    justify-content: center;
    align-items: flex-end;
}

.layer .layer-content-wrapper[data-variant="right-top"] .segments.column .segment-wrapper {
    justify-content: flex-start;
    align-items: flex-end;
}

.layer .layer-content-wrapper[data-variant="right-bottom"] .segments.column .segment-wrapper {
    justify-content: flex-end;
    align-items: flex-end;
}

.layer .layer-content-wrapper[data-variant="center-center"] .segments.column .segment-wrapper {
    justify-content: center;
    align-items: center;
}

.layer .layer-content-wrapper[data-variant="center-top"] .segments.column .segment-wrapper {
    justify-content: flex-start;
    align-items: center;
}

.layer .layer-content-wrapper[data-variant="center-bottom"] .segments.column .segment-wrapper {
    justify-content: flex-end;
    align-items: center;
}

.layer .layer-content-wrapper[data-variant="left-center"] .segments.column .segment-wrapper {
    justify-content: center;
    align-items: flex-start;
}

.layer .layer-content-wrapper[data-variant="left-top"] .segments.column .segment-wrapper {
    justify-content: flex-start;
    align-items: flex-start;
}

.layer .layer-content-wrapper[data-variant="left-bottom"] .segments.column .segment-wrapper {
    justify-content: flex-end;
    align-items: flex-start;
}

/* Row Segments */

.layer .layer-content-wrapper[data-variant="right-center"] .segments.row .segment-wrapper {
    justify-content: flex-end;
    align-items: center;
}

.layer .layer-content-wrapper[data-variant="right-top"] .segments.row .segment-wrapper {
    justify-content: flex-end;
    align-items: flex-start;
}

.layer .layer-content-wrapper[data-variant="right-bottom"] .segments.row .segment-wrapper {
    justify-content: flex-end;
    align-items: flex-end;
}

.layer .layer-content-wrapper[data-variant="center-center"] .segments.row .segment-wrapper {
    justify-content: center;
    align-items: center;
}

.layer .layer-content-wrapper[data-variant="center-top"] .segments.row .segment-wrapper {
    justify-content: center;
    align-items: flex-start;
}

.layer .layer-content-wrapper[data-variant="center-bottom"] .segments.row .segment-wrapper {
    justify-content: center;
    align-items: flex-end;
}

.layer .layer-content-wrapper[data-variant="left-center"] .segments.row .segment-wrapper {
    justify-content: flex-start;
    align-items: center;
}

.layer .layer-content-wrapper[data-variant="left-top"] .segments.row .segment-wrapper {
    justify-content: flex-start;
    align-items: flex-start;
}

.layer .layer-content-wrapper[data-variant="left-bottom"] .segments.row .segment-wrapper {
    justify-content: flex-start;
    align-items: flex-end;
}


/* ################# Video Map Element ################## */

.videomap-wrapper {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    z-index: 1;
    position: relative;
    visibility: hidden;
}

.ready .videomap-wrapper,
.videomap-wrapper.ready {
    visibility: visible;
}

.videomap-wrapper .backgrounds {
    z-index: 1;
}

.videomap-wrapper .backgrounds > * {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.videomap-wrapper .videos {
    z-index: 2;
}

.videomap-wrapper .backgrounds,
.videomap-wrapper .videos {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.videomap-wrapper .videos > * {
    width: auto;
    height: auto;
}

.videomap-wrapper .videos iframe.vimeo-video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
    height: auto;
    min-height: 100%;
    min-width: 100%;
    object-fit: cover;
}

.videomap-wrapper .videos video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
    height: auto;
    min-height: 100%;
    min-width: 100%;
    object-fit: cover;
}

.videomap-wrapper .debug {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 4;
    overflow: hidden;
    background: rgba(200, 87, 69, 0.50);
}

.videomap-wrapper .debug .marker {
    position: absolute;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: red;
}

.videomap-wrapper .maps {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    overflow: hidden;
}

.videomap-wrapper .maps svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100vw;
    height: auto;
    min-height: 100%;
    min-width: 100%;
    object-fit: cover;
}

.videomap-wrapper .maps svg a {
    cursor: pointer;
}

@keyframes scaleUpDown {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.75);
    }
    100% {
        transform: scale(1);
    }
}

.videomap-wrapper .maps svg path {
    transform-box: fill-box;
    transform-origin: center center;
    animation: scaleUpDown 3.5s infinite;
}

.videomap-wrapper .maps svg path:nth-child(1) {
    animation-delay: 0s;
}

.videomap-wrapper .maps svg path:nth-child(3) {
    animation-delay: 0.5s;
}

.videomap-wrapper .maps svg path:nth-child(5) {
    animation-delay: 1.0s;
}

.videomap-wrapper .maps svg path:nth-child(7) {
    animation-delay: 1.5s;
}

.videomap-wrapper .maps svg path:nth-child(9) {
    animation-delay: 2s;
}

.videomap-wrapper .maps svg path:nth-child(11) {
    animation-delay: 2.5s;
}

.videomap-wrapper .videos > *,
.videomap-wrapper .maps > * {
    display: none;
}

.videomap-wrapper .content-layer {
    position: relative;
    z-index: 4;
    width: 0;
    height: 0;
    opacity: 1;
}

:root,
:host
{
    --videomap-content-width: 20vw;
    --videomap-content-min-width: 300px;
    --videomap-text-color: #FFFFFF;
    --videomap-bg-color: var(--main-color);
}

.videomap-wrapper .content-layer .video-map-content-layer {
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    position: absolute;
    width: var(--videomap-content-width);
    min-width: var(--videomap-content-min-width);
    max-width: calc(100vw - var(--page-padding));
    background: var(--videomap-bg-color);
    color: var(--videomap-text-color);
    font-size: var(--secondary-unit);
    font-weight: var(--main-font-weight-light);
    z-index: 1;
    transform: scale(0);
}

.videomap-wrapper .content-layer .video-map-content-layer.active {
    transform: scale(1);
}

.videomap-wrapper .content-layer .video-map-content-layer .actions {
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-end;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 2;
}

.videomap-wrapper .content-layer .video-map-content-layer .actions button.close {
    display: block;
    border-width: 0;
    border-radius: 0;
    background: none;
    padding: 1.5em;
    margin: 0;
    cursor: pointer;
}

.videomap-wrapper .content-layer .video-map-content-layer .actions button.close:before {
    content: '';
    display: block;
    width: 2vw;
    height: 2vw;
    min-width: 30px;
    min-height: 30px;
    background-image: url('../images/video-map/close-icon.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}

.videomap-wrapper .content-layer .video-map-content-layer .actions button.close.white:before {
    background-image: url('../images/video-map/close-icon-white.svg');
}

.videomap-wrapper .content-layer .video-map-content-layer:hover .actions button.close {
    background: rgba(255,255,255,0.2);
}

.videomap-wrapper .content-layer .video-map-content-layer:hover .actions button.close.white {
    background: rgba(0,0,0,0.2);
}

.videomap-wrapper .content-layer .video-map-content-layer .image-wrapper {
    height: calc(var(--videomap-content-width) * 0.5);
    width: var(--videomap-content-width);
    min-width: var(--videomap-content-min-width);
    min-height: calc(var(--videomap-content-min-width) * 0.5);
    position: relative;
    z-index: 1;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    overflow: hidden;
}

@media (max-width: 1400px){
    .videomap-wrapper .content-layer .video-map-content-layer .image-wrapper {
        height: calc(var(--videomap-content-width) * 0.6);
        min-height: calc(var(--videomap-content-min-width) * 0.6);
    }
}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper {

    padding: 0.8em 1.2em;
}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .headline {
    margin-bottom: 0.8em;
}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .headline > span {

}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content {
    font-size: 1em;
    min-height: 1.4em;
}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content p {
    font-size: 0.8em;
    font-weight: var(--main-font-weight-light);
}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content .link {

}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content .link a {
    color: inherit;
    font-size: 0.8em;
    text-decoration: underline;
}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content .link a:after {
    content: '';
    display: inline-block;
    width: 1.1em;
    height: 1.4em;
    background: url('../images/arrow-right-white.svg') center bottom no-repeat;
    background-size: contain;
    margin-left: 0.5em;
}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content .link a.inline-link {

}

.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content .link a.inline-link:hover,
.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content .link a.inline-link:focus,
.videomap-wrapper .content-layer .video-map-content-layer .content-wrapper .content .link a.inline-link:active {
    border-bottom-color: var(--videomap-text-color);
}

/* Video Map Legend */

/* Animated Legend */

.VideoMapElement.legend-holder.animated-legend {
    position: relative;
    top: 0;
    width: 100%;
    height: auto;
}

.VideoMapElement.legend-holder.animated-legend .videomap-wrapper .backgrounds {
    visibility: hidden;
}

.VideoMapElement.legend-holder.animated-legend.ready .videomap-wrapper .backgrounds {
    visibility: visible;
}

.VideoMapElement.legend-holder.animated-legend.ready {
    background: #FFFFFF;
}

.VideoMapElement.legend-holder.animated-legend.ready.dark {
    background: var(--main-color);
}

.VideoMapElement.legend-holder.animated-legend > .legend-wrapper {
    width: 100%;
    overflow: hidden;
    height: auto;
    top: 0;
    position: sticky;
}

.VideoMapElement.legend-holder.animated-legend > .legend-wrapper > .videomap-wrapper {
    flex: 0 0 100vh;
    position: relative;
    z-index: 2;
}

.legend-holder.animated-legend .legend {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    height: auto;
    overflow: hidden;
    width: 100%;
    font-size: 1rem;
}

.legend-holder.animated-legend .legend.fixed {
    position: absolute;
}

.legend-holder.animated-legend .legend > .wrapper {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.legend-holder.animated-legend .legend .layer {
    display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    justify-content: flex-start;
    column-gap: calc(var(--default-padding) + 1.5em);
    padding: var(--default-padding) calc(10vw - 1.5rem) calc(var(--default-padding) + 1.5em) 6vw;
    opacity: 0;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    overflow: hidden;
    box-sizing: border-box;
}

.legend-holder.animated-legend .legend .layer.active {
    opacity: 1;
    z-index: 3;
}

.legend-holder.animated-legend .legend .entry {
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: flex-start;
    flex: 1 1 33%;
    width: 33%;
    opacity: 0;
    transition: opacity 0.2s;
}

.legend-holder.animated-legend .legend .entry:nth-child(1) {
    align-items: flex-start;
    margin-left: -1.5em;
    transition: opacity 0s;
}

.legend-holder.animated-legend .legend .entry:nth-child(2) {
    align-items: center;
    margin-left: -1.5em;
}

.legend-holder.animated-legend .legend .entry:nth-child(3) {
    align-items: flex-end;
}

.legend-holder.animated-legend .legend .entry.active {
    opacity: 1;
}

.legend-holder.animated-legend .legend .entry > .wrapper {
    box-sizing: border-box;
    padding-left: 1.5em;
    position: relative;
    max-width: 100%;
}

.legend-holder.animated-legend .legend .entry:nth-child(3) > .wrapper {
    /* padding-right: 1.5em; */
}

.legend-holder.animated-legend .legend .entry > .wrapper:before {
    content: '';
    display: block;
    position: absolute;
    top: 0.2em;
    left: 0;
    width: 1em;
    height: 1em;
    background: url('../images/marker.svg') center center no-repeat;
    background-size: contain;
}

.legend-holder.animated-legend .legend .entry .headline {
    color: var(--main-color);
    font-size: 1.25em;
    line-height: 1.2em;
    font-weight: var(--main-font-weight-regular);
    margin: 0 0 0.6em 0;
    padding: 0;
}

.legend-holder.animated-legend.dark .legend .entry .headline {
    font-weight: var(--main-font-weight-light);
    color: #F4F6F6;
}

.legend-holder.animated-legend .legend .entry .content {
    color: #F4F6F6;

}

.legend-holder.animated-legend .legend .entry .content p {
    font-size: 0.75em;
    line-height: 1.6em;
    font-weight: var(--main-font-weight-regular);
    color: var(--main-color);
    width: 95%;
    max-width: 100%;
}

.legend-holder.animated-legend.dark .legend .entry .content p {
    font-weight: var(--main-font-weight-light);
    color: #F4F6F6;
}

@media (max-width: 1200px){
    .legend-holder.animated-legend .legend .layer {
        display: block;
        padding: calc(var(--default-padding) + 1em) var(--page-padding) calc(var(--default-padding) + 4em);
        height: 100%;
    }

    .legend-holder.animated-legend .legend .layer .entry {
        display: block;
        position: absolute;
        top: calc(var(--default-padding) + 1em);
        left: 0;
        right: 0;
        width: 665px;
        max-width: 100%;
        height: auto;
        padding: 0 calc(var(--page-padding) + 1em) 0 var(--page-padding);
        margin: auto;
        overflow: hidden;
        opacity: 1;
        box-sizing: border-box;
    }

    .legend-holder.animated-legend .legend .layer .entry:first-child:before {
        content: '';
        display: block;
        width: 1px;
        height: 6em;
        border-left: 1px dashed #525355;
        position: absolute;
        left: calc(var(--page-padding) + 0.4em);
        top: 0.6em;
    }

    .legend-holder.animated-legend .legend .layer .entry > .wrapper {
        padding-right: 0;
        padding-left: 0;
        margin-left: calc(3rem - 2px);
        background: transparent;
        box-sizing: border-box;
        width: calc(100% - calc(3rem - 2px));
        transition: background 0s;
    }

    .legend-holder.animated-legend .legend .layer .entry > .wrapper .headline {
        font-size: 1.4em;
    }

    .legend-holder.animated-legend .legend .layer .entry > .wrapper .headline br {
        display: none;
    }

    .legend-holder.animated-legend .legend .layer .entry > .wrapper .headline,
    .legend-holder.animated-legend .legend .layer .entry > .wrapper .content
    {
        opacity: 0;
        transition: opacity 0s;
        transition-delay: 0s;
    }

    .legend-holder.animated-legend .legend .layer .entry > .wrapper .content p {
        font-size: 1.02em;
    }

    .legend-holder.animated-legend .legend .layer .entry.active > .wrapper .headline,
    .legend-holder .legend .layer .entry.active > .wrapper .content
    {
        opacity: 1;
        transition: opacity 0.2s;
        transition-delay: 0.3s;
    }

    .legend-holder.animated-legend .legend .layer .entry.active > .wrapper {
        background: var(--main-color);
        transition: background 0.3s;
        opacity: 1;
        padding-left: 2px;
    }

    .legend-holder.animated-legend .legend .layer .entry > .wrapper:before {
        left: -3rem;
        background-image: url('../images/marker-grey.svg');
        background-color: var(--main-color);
    }

    .legend-holder.animated-legend .legend .layer .entry.active > .wrapper:before {
        background-image: url('../images/marker.svg');
    }

    .legend-holder.animated-legend .legend .layer .entry:nth-child(1) > .wrapper {

    }

    .legend-holder.animated-legend .legend .layer .entry:nth-child(2) > .wrapper {

    }

    .legend-holder.animated-legend .legend .layer .entry:nth-child(3) > .wrapper {}

    .legend-holder.animated-legend .legend .layer .entry:nth-child(1) > .wrapper:before {
        top: 0.5em;
    }

    .legend-holder.animated-legend .legend .layer .entry:nth-child(2) > .wrapper:before {
        top: 3.1em;
    }

    .legend-holder.animated-legend .legend .layer .entry:nth-child(3) > .wrapper:before {
        top: calc(3.6rem + 2em);
    }

    .legend-holder.animated-legend .legend .entry .content p {
        font-size: 0.8em;
        line-height: 1.6;
        font-weight: var(--main-font-weight-light);
        width: 100%;
        max-width: 100%;
    }
}


/* Static Legend */

.VideoMapElement.legend-holder.static-legend {

}

.VideoMapElement.legend-holder.static-legend .legend-wrapper {

}

.VideoMapElement.legend-holder.static-legend .legend-wrapper {

}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend {
    overflow: hidden;
    font-size: 1rem;
}

.VideoMapElement.legend-holder.static-legend.dark .legend-wrapper .legend {
    background-color: var(--main-color);
    color: #F4F6F6;
}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper {

}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer {
    display: flex;
    flex-flow: row wrap;
    align-items: stretch;
    justify-content: flex-start;
    column-gap: calc(var(--default-padding) + 1.5em);
    padding: var(--default-padding) calc(10vw - 1.5rem) calc(var(--default-padding) + 1.5em) 6vw;
    width: 100%;
    height: auto;
    overflow: hidden;
    box-sizing: border-box;
}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry {
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 30%;
    width: 30%;
    margin-bottom: calc(var(--default-padding) * 2);
}

.VideoMapElement.legend-holder.static-legend .legend .entry:nth-child(1),
.VideoMapElement.legend-holder.static-legend .legend .entry:nth-child(4n) {
    align-items: flex-start;
    margin-left: -1.5em;
    transition: opacity 0s;
}

.VideoMapElement.legend-holder.static-legend .legend .entry:nth-child(2n) {
    align-items: center;
    margin-left: -1.5em;
}

.VideoMapElement.legend-holder.static-legend .legend .entry:nth-child(3n) {
    align-items: flex-end;
}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper {
    box-sizing: border-box;
    padding-left: 1.5em;
    position: relative;
    max-width: 100%;
}

.VideoMapElement.legend-holder.static-legend .legend .entry > .wrapper:before {
    content: '';
    display: block;
    position: absolute;
    top: 0.3em;
    left: 0;
    width: 1em;
    height: 1em;
    background: url('../images/marker.svg') center center no-repeat;
    background-size: contain;
}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .headline {
    color: inherit;
    font-weight: var(--main-font-weight-regular);
    font-size: 1.25em;
    line-height: 1.2em;
    margin: 0 0 0.6em 0;
    padding: 0;
}

.VideoMapElement.legend-holder.static-legend.dark .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .headline {
    font-weight: var(--main-font-weight-light);
    color: inherit;
}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .content {

}

.VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .content p {
    font-size: 0.75em;
    line-height: 1.6em;
    font-weight: var(--main-font-weight-regular);
}

.VideoMapElement.legend-holder.static-legend.dark .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .content p {
    font-weight: var(--main-font-weight-light);
}

@media (max-width: 1200px){

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer {
        display: flex;
        flex-flow: column nowrap;
        align-items: flex-start;
        padding: calc(var(--default-padding) + 1em) var(--page-padding) calc(var(--default-padding) + 4em);
    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        padding: 0 calc(var(--page-padding) + 1em) 0 var(--page-padding);
        margin-left: 0;
        overflow: hidden;
        box-sizing: border-box;
    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry:first-child:before {
        display: none;
    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper {
        padding-right: 0;
        /* padding-left: 0; */
        padding-left: 1.5rem;
        background: transparent;
        box-sizing: border-box;
        width: 100%;
    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .headline {
        font-size: 1.4em;
    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .headline br {
        display: none;
    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry > .wrapper .content p {
        font-size: 1.02em;
    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry:nth-child(1) > .wrapper {

    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry:nth-child(2) > .wrapper {

    }

    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry:nth-child(3) > .wrapper {}


    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .content p {
        font-size: 0.8em;
        line-height: 1.6;
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 768px){
    .VideoMapElement.legend-holder.static-legend .legend-wrapper .legend > .wrapper .layer .entry {
        padding: 0;
    }
}











/* Gallery Slider Elemnent */

:root,
:host
{
    /*--option: ' [L >1920]';*/
    --slider-entry-gap: 1.6vw;
    --slider-entry-width: calc(calc(100vw / 4) - var(--default-padding) - calc(var(--slider-entry-gap) * 3));
}

@media (max-width: 1920px){
    :root,
    :host
    {
        /*--option: ' [L 1920]';*/
        --slider-entry-width: calc(calc(100vw / 3) - var(--default-padding) - calc(var(--slider-entry-gap) * 3));
    }
}

@media (max-width: 1200px){
    :root,
    :host
    {
        /*--option: ' [L 1200]';*/
        --slider-entry-width: calc(calc(100vw / 2.3) - var(--default-padding) - calc(var(--slider-entry-gap) * 3));
    }
}

@media (max-width: 700px){
    :root,
    :host
    {
        /*--option: ' [L 700]';*/
        --slider-entry-gap: 20px;
        --slider-entry-width: calc(calc(100vw / 1.2) - var(--default-padding) );
    }
}

@media (orientation: portrait){
    .legend-holder .legend .layer:nth-child(1) .entry:nth-child(1).active > .wrapper .headline,
    .legend-holder .legend .layer:nth-child(1) .entry:nth-child(1).active > .wrapper .content
    {
        transition: opacity 0s;
        transition-delay: 0s;
    }
}


.GallerySliderElement {

}

.GallerySliderElement > .wrapper {
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    height: 100vh;
    box-sizing: border-box;
    padding: calc(var(--default-padding) * 1.8) var(--page-padding);
    padding-right: 0;
    overflow: hidden;
}

@media (orientation: portrait){
    .GallerySliderElement > .wrapper {
        height: calc(100vh * 0.8);
        max-height: 100vh;
    }
}

@media (orientation: landscape){
    .GallerySliderElement > .wrapper {
        max-height: 100vh;
    }
}

.GallerySliderElement.white > .wrapper {
    background-color: var(--bg-color-white);
}

.GallerySliderElement.blue > .wrapper {
    background-color: var(--bg-color-blue);
}

.GallerySliderElement.grey > .wrapper {
    background-color: var(--bg-color-grey);
}

.GallerySliderElement > .wrapper > .title {
    flex: 1 1 auto;
    font-size: 1.5rem;
    font-weight: var(--main-font-weight-regular);
    margin: 0 0 1.8em;
}


.GallerySliderElement > .wrapper > .title:after {
    /*content: var(--option);*/
}

.GallerySliderElement > .wrapper > .slider {
    flex: 1 1 100%;
    display: flex;
    flex-flow: row nowrap;
    column-gap: var(--slider-entry-gap);
    width: 100%;
    /* overflow: hidden; */
    height: auto;
    position: relative;
    z-index: 1;
}

.GallerySliderElement > .wrapper > .slider.swiping {
    /*background: red;*/
}

.GallerySliderElement > .wrapper > .slider.slick-initialized {
    display: block;
}

.GallerySliderElement > .wrapper > .slider.slick-initialized .slick-list {
    width: auto;
    height: 100%;
    overflow: visible;
    z-index: 1;
}

.GallerySliderElement > .wrapper > .slider .slick-list .slick-track {
    height: 100%;
}

.GallerySliderElement > .wrapper > .slider .slick-list .slick-track:after,
.GallerySliderElement > .wrapper > .slider .slick-list .slick-track:before
{
    display: none;
}

:root,
:host
{
    --slider-button-width: calc(calc(var(--default-padding) * 1.7) + calc(var(--slider-entry-gap) * 1));
}

.GallerySliderElement > .wrapper > .slider .slick-prev,
.GallerySliderElement > .wrapper > .slider .slick-next {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    z-index: 2;
    position: absolute;
    right: calc(var(--slider-button-width) * -1);
    left: auto;
    width: var(--slider-button-width);
    height: 100%;
    background: var(--bg-color-white);
    top: 0;
    padding: 0;
    margin: 0;
    border-radius: 0;
    transform: translate(0);
    cursor: pointer;
    opacity: 1;
    transition: opacity 0s, right 0.5s;

}

.GallerySliderElement > .wrapper > .slider .slick-prev {

}

.GallerySliderElement.white > .wrapper > .slider .slick-prev,
.GallerySliderElement.white > .wrapper > .slider .slick-next {
    background: var(--bg-color-white);
}

.GallerySliderElement.blue > .wrapper > .slider .slick-prev,
.GallerySliderElement.blue > .wrapper > .slider .slick-next {
    background: var(--bg-color-blue);
}

.GallerySliderElement.grey > .wrapper > .slider .slick-prev,
.GallerySliderElement.grey > .wrapper > .slider .slick-next {
    background: var(--bg-color-grey);
}

@media(hover: hover) {
    .GallerySliderElement > .wrapper > .slider.right-edge:hover .slick-prev.slick-disabled {
        opacity: 0;
    }

    .GallerySliderElement > .wrapper > .slider.right-edge:hover .slick-prev,
    .GallerySliderElement > .wrapper > .slider:hover .slick-next {
        right: 0;
        transition: opacity 0s, right 0.5s;
    }
}

@media(hover: none) {
    .GallerySliderElement > .wrapper > .slider.right-edge .slick-prev {
        display: none;
    }
}


.GallerySliderElement > .wrapper > .slider.right-edge .slick-prev {
    right: 0;
    background: transparent;
}

.GallerySliderElement > .wrapper > .slider .slick-prev,
.GallerySliderElement > .wrapper > .slider.right-edge .slick-next {
    right: calc(var(--slider-button-width) * -1);
    transition: opacity 0s, right 0.5s;
}

.GallerySliderElement > .wrapper > .slider .slick-next.slick-disabled,
.GallerySliderElement > .wrapper > .slider .slick-prev.slick-disabled
{
    opacity: 0;
    transition: opacity 0s;
    transition-delay: 0.5s;
}

.GallerySliderElement > .wrapper > .slider .slick-prev:before,
.GallerySliderElement > .wrapper > .slider .slick-next:before {
    content: '';
    display: block;
    width: 100%;
    height: calc(calc(calc(var(--default-padding) * 1.7) + calc(var(--slider-entry-gap) * 1)) / 2);
    background: url('../images/cursor-right.svg') center center no-repeat;
    background-size: contain;
    background-color: transparent;
}

.GallerySliderElement > .wrapper > .slider .slick-prev.slick-disabled:before,
.GallerySliderElement > .wrapper > .slider .slick-next.slick-disabled:before
{
    opacity: 1;
}

.GallerySliderElement > .wrapper > .slider .slick-prev:before {
    background: url('../images/cursor-left.svg') center center no-repeat;
}

.GallerySliderElement > .wrapper > .slider .slider-entry {
    flex: 0 0 var(--slider-entry-width);
    width: var(--slider-entry-width);
}

.GallerySliderElement > .wrapper .slider-entry {
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-start;
}

.GallerySliderElement.reference > .wrapper .slider-entry {
    background-color: #010914;
    color: #FFFFFF;
}

.GallerySliderElement > .wrapper > .slider .slick-list .slick-track .slider-entry {
    margin-right: var(--slider-entry-gap);
    outline: none;
}

.GallerySliderElement > .wrapper > .slider .slick-list .slick-track a.slider-entry {
    position: relative;
}

.GallerySliderElement > .wrapper a.slider-entry {
    border-width: 0;
}

.GallerySliderElement > .wrapper .slider-entry .image {
    flex: 1 1 100%;
    width: 100%;
    background-position: center center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

.GallerySliderElement > .wrapper a.slider-entry .image span.overlay {
    /*display: flex;*/
    display: none;
    background: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    color: #FFFFFF;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    font-weight: var(--main-font-weight-regular);
    font-size: 0.75em;
    text-decoration: underline;
    position: relative;
    top: 0;
    left: -100%;
    transition: left 0.3s;
    transition-delay: 0.8s;
}

@media(hover: hover) {
    .GallerySliderElement > .wrapper a.slider-entry:hover .image span.overlay {
        left: 0;
    }

    .GallerySliderElement > .wrapper .swiping a.slider-entry:hover .image span.overlay {
        left: -100%;
    }
}

.GallerySliderElement > .wrapper a.slider-entry .image span.overlay span:after {
    content: '';
    display: inline-block;
    width: 1.1em;
    height: 1.5em;
    background: url('../images/arrow-right-white.svg') center bottom no-repeat;
    background-size: contain;
    margin-left: 0.5em;
}

.GallerySliderElement > .wrapper .slider-entry .content {
    padding: calc(var(--slider-entry-gap) * 0.8) 0 0;
    font-size: 1em;
}

.GallerySliderElement.reference > .wrapper .slider-entry .content {
    padding: calc(var(--slider-entry-gap) * 0.8);
}

@media (min-width: 1921px){
    .GallerySliderElement > .wrapper .slider-entry .content {
        font-size: 28px;
        line-height: 1.4;
    }
}

@media (max-width: 1280px){
    .GallerySliderElement > .wrapper .slider-entry .content {
        font-size: 22px;
    }
}

.GallerySliderElement > .wrapper .slider-entry .content .title {
    font-size: 1em;
    font-weight: var(--main-font-weight-regular);
    margin-bottom: 0.3em;
}

.GallerySliderElement.reference > .wrapper .slider-entry .content .title {
    font-weight: var(--main-font-weight-light);
}

.GallerySliderElement > .wrapper .slider-entry .content .company,
.GallerySliderElement > .wrapper .slider-entry .content .position {
    font-size: 0.7em;
    font-weight: var(--main-font-weight-regular);
    line-height: 1.4;
}

.GallerySliderElement.reference > .wrapper .slider-entry .content .company {
    font-weight: var(--main-font-weight-light);
}

.GallerySliderElement .inline-content-holder {
    display: block;
    position: fixed;
    z-index: 12;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
}

.GallerySliderElement .inline-content-holder .inline-content {
    display: none;
    width: 100vw;
    height: 100dvh;
    box-sizing: border-box;
    padding: var(--default-padding) var(--page-padding);
    background: rgba(0,0,0,0.3);
}

.GallerySliderElement .inline-content-holder .inline-content.open {
    display: block;
}

.GallerySliderElement .inline-content-holder .inline-content > .wrapper {
    display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    column-gap: var(--default-padding);
    position: relative;
    height: 100%;
    background: var(--bg-color-white);
    box-sizing: border-box;
    padding: var(--default-padding) var(--page-padding);
    overflow: hidden;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .action {
    position: absolute;
    z-index: 2;
    right: var(--page-padding);
    top: var(--default-padding);
    display: block;
    height: calc(var(--default-padding) * 2);
    width: calc(var(--default-padding) * 2);
    min-height: 70px;
    min-width: 70px;
    box-sizing: border-box;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .action button.close {
    display: block;
    width: 100%;
    height: 100%;
    max-height: calc(80px + 1rem);
    max-width: calc(80px + 1rem);
    background: transparent;
    box-sizing: border-box;
    padding: 1rem;
    margin: 0;
    cursor: pointer;
    float: right;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .action button.close:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url('../images/video-map/close-icon.svg') center center no-repeat;
    background-size: contain;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .mobile-header {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    padding: var(--default-padding) var(--page-padding);
    box-sizing: border-box;
    width: 100%;
    min-height: 100px;
    z-index: 3;
    background: var(--bg-color-white);
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .content {
    flex: 1 1 100%;
    width: auto;
    display: flex;
    flex-flow: column nowrap;
    row-gap: var(--default-padding);
    position: relative;
    z-index: 1;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .content .header {
    flex: 1 1 40%;
    height: auto;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .content .header .topic {font-size: 1em;}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .content .header .title {
    font-weight: var(--main-font-weight-regular);
    font-size: 1.46em;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .content .description {
    display: flex;
    flex-flow: column;
    align-items: stretch;
    justify-content: flex-end;
    flex: 1 1 100%;
    height: auto;
    box-sizing: border-box;
    overflow: hidden;
    /* overflow-y: scroll; */
    font-size: 1rem;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .content .description .wrapper {
    padding: 0;
    max-height: 100%;
    padding: 0 var(--default-padding) 0 0;
    overflow: hidden;
    overflow-y: auto;
    height: auto;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .content .description .wrapper > p {
    font-size: 1em;
    line-height: 1.6;
}

:root,
:host
{
    --gallery-slider-entry-gap: 1.6vw;
    --gallery-slider-entry-width: calc(100vh  - calc(var(--default-padding) * 4));
}

@media (orientation: portrait){
    :root,
    :host
    {
        --gallery-slider-entry-width: calc(100vw  - calc(var(--default-padding) * 2));
    }
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery {
    flex: 0 0 var(--gallery-slider-entry-width);
    width: var(--gallery-slider-entry-width);
    max-width: 60%;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider {
    width: 100%;
    height: 100%;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider .slick-list {
    height: 100%;
    width: 100%;
    padding: 0;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider .slick-track {
    height: 100%;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider .gallery-entry {
    height: 100%;
    width: var(--gallery-slider-entry-width);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider {
    position: relative;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button {

}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-prev,
.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-next {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-end;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
    background: transparent;
    transform: translate(0);
    padding: 0;
    margin: 0;
    border-radius: 0;
    opacity: 1;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-prev {
    display: flex !important;
    justify-content: flex-start;
    right: auto;
    left: 0;
    z-index: 4;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-prev:before,
.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-next:before {
    content: '';
    display: block;
    height: 3.5rem;
    width: 3.5rem;
    background: url('../images/cursor-right-white.svg') center center no-repeat;
    background-size: contain;
    opacity: 1;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-prev:before {
    background: url('../images/cursor-left-white.svg') center center no-repeat;
    background-size: contain;
}


@media (hover:none){
    .GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-prev,
    .GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-next {
        display: none !important;
    }
}

@media (hover:hover){
    .GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-prev:before,
    .GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-next:before {
        opacity: 0;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-prev:hover:before,
    .GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > button.slick-next:hover:before {
        opacity: 1;
    }
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > ul.slick-dots {
    position: absolute;
    left: 0;
    bottom: 0.5rem;
    width: 100%;
    height: 2rem;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    z-index: 4;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > ul.slick-dots > li {
    display: block;
    width: 1rem;
    height: 1rem;
    padding: 0;
    margin: 0;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > ul.slick-dots > li > button {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: transparent;
    margin: 0;
    padding: 0;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > ul.slick-dots > li > button:before {
    content: '';
    display: block;
    background: #FFFFFF;
    opacity: 1;
    padding: 0;
    margin: 0;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    position: relative;
}

.GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery .slider > ul.slick-dots > li.slick-active button:before {
    background: var(--main-color);
}

@media (orientation: portrait){
    .GallerySliderElement .inline-content-holder .inline-content {
        background: var(--bg-color-white);
        padding: calc(calc(var(--default-padding) * 2) + 50px) 0 0 0;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper {
        display: flex;
        flex-flow: column nowrap;
        align-items: flex-start;
        overflow-y: auto;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .action {
        position: fixed;
        z-index: 4;
        height: var(--default-padding);
        width: var(--default-padding);
        top: var(--default-padding);
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .action button.close {
        padding: 0;
        max-width: 30px;
        max-height: 30px;
        float: right;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .action button.close:before {
        background-position: right center;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .content .header {
        display: none;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .mobile-header {
        display: block;
        order: 1;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .mobile-header .topic {
        font-size: var(--secondary-unit);
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .mobile-header h3.title {
        font-weight: var(--main-font-weight-regular);
        font-size: 1.45em;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .gallery {
        order: 2;
        margin-bottom: calc(var(--default-padding) * 2);
        max-width: 100%;
    }

    .GallerySliderElement .inline-content-holder .inline-content .wrapper .content {
        order: 3;
    }
}


/* CustomersGalleryElement */

.CustomersGalleryElement {

}

.CustomersGalleryElement.white {
    background-color: var(--bg-color-white);
}

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

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

.CustomersGalleryElement > .wrapper {
    padding: var(--default-padding) var(--page-padding);
}

.CustomersGalleryElement > .wrapper > .title {
    font-size: 1.5rem;
    font-weight: var(--main-font-weight-regular);
    margin: 0 0 1.8em;
}

.CustomersGalleryElement > .wrapper > ul.customers-grid {
    display: flex;
    flex-flow: row wrap;
    align-items: stretch;
    justify-content: center;
    column-gap: 5vw;
    margin: 0;
    padding: 0;
}

.CustomersGalleryElement > .wrapper > ul.customers-grid li {
    list-style: none;
    margin-bottom: 1.6vw;
    width: 10vw;
    text-align: center;
}

@media (max-width: 1800px){
    .CustomersGalleryElement > .wrapper > ul.customers-grid li {
        width: 11vw;
    }
}

@media (max-width: 1280px){

}

@media (max-width: 768px){
    .CustomersGalleryElement > .wrapper > ul.customers-grid {
        column-gap: 9vw;
    }
    .CustomersGalleryElement > .wrapper > ul.customers-grid li {
        width: 23vw;

    }
}

.CustomersGalleryElement > .wrapper > ul.customers-grid li img {
    display: inline-block;
    max-width: 100%;
    height: auto;
}