.gallery-grid-section {
    position: relative;
    width: 100%;
    height: 170vw;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 36% 32% 32%;
    column-gap: 2px;
    row-gap: 2px;
    overflow: hidden
}

@media only screen and (min-width: 48em) {
    .gallery-grid-section {
        height: 45vw;
        grid-template-columns: 1fr 30% 30%;
        grid-template-rows: 50% 1fr
    }
}

.gallery-grid__element {
    grid-column-start: 1;
    grid-row: auto;
    overflow: hidden
}

.gallery-grid__element:nth-child(1),
.gallery-grid__element:nth-child(4) {
    grid-column-end: 3
}

.gallery-grid__element:nth-child(2) {
    grid-column-end: 2
}

.gallery-grid__element:nth-child(3) {
    grid-column-start: 2;
    grid-column-end: 3
}

@media only screen and (min-width: 48em) {
    .gallery-grid__element {
        opacity: 0;
        z-index: 1
    }

    .gallery-grid__element:nth-child(1) {
        grid-column-start: 1;
        grid-column-end: 2;
        grid-row-start: 1;
        grid-row-end: 3
    }

    .gallery-grid__element:nth-child(2) {
        grid-column-start: 2;
        grid-column-end: 3;
        grid-row-start: 1;
        grid-row-end: 2
    }

    .gallery-grid__element:nth-child(3) {
        grid-column-start: 3;
        grid-column-end: 4;
        grid-row-start: 1;
        grid-row-end: 2
    }

    .gallery-grid__element:nth-child(4) {
        opacity: 1;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 1;
        grid-row-end: 3
    }

    .gallery-grid__element.is-clone {
        position: absolute;
        left: 0;
        top: 0;
        grid-column-start: auto !important;
        grid-column-end: auto !important;
        grid-row-start: auto !important;
        grid-row-end: auto !important
    }
}

.gallery-grid-section--mobile-init .gallery-grid__element {
    cursor: default !important
}

@media only screen and (min-width: 48em) {
    .gallery-grid-section--is-open .gallery-grid__element {
        opacity: 1;
        cursor: pointer
    }

    .gallery-grid-section--is-open .gallery-grid__element:nth-child(4) {
        grid-column-start: 2;
        grid-column-end: 4;
        grid-row-start: 2;
        grid-row-end: 3
    }

    .gallery-grid__element--bg-zoomed .gallery-grid__background>div {
        width: 112%;
        height: 112%;
        left: -6%;
        top: -6%
    }

    .gallery-grid-section.selected-idx-0 .gallery-grid__element:nth-child(1) {
        opacity: 1;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 1;
        grid-row-end: 3;
        z-index: 5
    }

    .gallery-grid-section.selected-idx-0 .gallery-grid__element:nth-child(1) .gallery-grid__content {
        display: block;
        opacity: 1
    }

    .gallery-grid-section.selected-idx-0 .gallery-grid__element:nth-child(4) {
        grid-column-start: 2;
        grid-column-end: 4;
        grid-row-start: 2;
        grid-row-end: 3
    }

    .gallery-grid-section.selected-idx-1 .gallery-grid__element:nth-child(2) {
        opacity: 1;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 1;
        grid-row-end: 3;
        z-index: 5
    }

    .gallery-grid-section.selected-idx-1 .gallery-grid__element:nth-child(2) .gallery-grid__content {
        display: block;
        opacity: 1
    }

    .gallery-grid-section.selected-idx-1 .gallery-grid__element:nth-child(4) {
        grid-column-start: 2;
        grid-column-end: 4;
        grid-row-start: 2;
        grid-row-end: 3
    }

    .gallery-grid-section.selected-idx-2 .gallery-grid__element:nth-child(3) {
        opacity: 1;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 1;
        grid-row-end: 3;
        z-index: 5
    }

    .gallery-grid-section.selected-idx-2 .gallery-grid__element:nth-child(3) .gallery-grid__content {
        display: block;
        opacity: 1
    }

    .gallery-grid-section.selected-idx-2 .gallery-grid__element:nth-child(4) {
        grid-column-start: 2;
        grid-column-end: 4;
        grid-row-start: 2;
        grid-row-end: 3
    }

    .gallery-grid-section.selected-idx-3 .gallery-grid__element:nth-child(4) {
        opacity: 1;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 1;
        grid-row-end: 3;
        z-index: 5
    }

    .gallery-grid-section.selected-idx-3 .gallery-grid__element:nth-child(4) .gallery-grid__content {
        display: block;
        opacity: 1
    }
}

.gallery-grid__figure {
    width: 100%;
    height: 100%;
    position: relative
}

.gallery-grid__background {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1
}

.gallery-grid__background>div {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0) none no-repeat 50% 50%;
    background-size: cover
}

.gallery-grid__background>video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .8s ease-in-out
}

.gallery-grid__background .gallery-grid__background-link {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.gallery-grid__background .gallery-grid__background-link .gallery-grid__mobile-cta {
    position: absolute;
    display: flex;
    right: 15px;
    bottom: 10px;
    z-index: 10;
    font: normal normal normal 1.6rem "din-condensed";
    letter-spacing: .8px;
    color: #fff;
    text-shadow: 0px 0px 40px rgba(0, 0, 0, .6470588235);
    text-transform: uppercase;
    text-decoration: none;
    justify-content: flex-start;
    align-items: center
}

.gallery-grid__background .gallery-grid__background-link .gallery-grid__mobile-cta svg {
    margin-left: .75em;
    stroke: #fff !important;
    fill: #fff !important;
    transition: all .3s ease-in-out;
    width: .41em;
    height: 1em;
    transform: rotate(-90deg)
}

@media only screen and (min-width: 48em) {
    .gallery-grid__background .gallery-grid__background-link {
        display: none
    }
}

.gallery-grid__content {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3;
    background: rgba(0, 0, 0, 0) linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3019607843) 100%) 0% 0% no-repeat padding-box;
    display: none;
    opacity: 0
}

.gallery-grid__content-inner {
    width: 89%;
    height: auto;
    position: absolute;
    left: 5.5%;
    bottom: 10%;
    display: grid;
    grid-template-columns: 1fr
}

@media only screen and (min-width: 48em) {
    .gallery-grid__content-inner {
        grid-template-columns: 1fr 1fr
    }
}

.gallery-grid__header {
    font: normal normal 300 3rem/4rem "din-condensed";
    letter-spacing: 1.2px;
    color: #fff;
    text-shadow: 0px 0px 40px rgba(0, 0, 0, .7019607843);
    text-transform: uppercase
}

.gallery-grid__body {
    font: normal normal normal 1.8rem/2.8rem "din-2014";
    letter-spacing: 0px;
    color: #fff;
    text-shadow: 0px 0px 40px rgba(0, 0, 0, .7019607843)
}

.gallery-grid__body>*:last-child {
    margin-bottom: 0;
    padding-bottom: 0
}

.gallery-grid__cta {
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-end;
    align-items: flex-end;
    text-align: center
}

.gallery-grid__back-cta {
    position: absolute;
    right: -500px;
    bottom: 5%;
    z-index: 10;
    font: normal normal normal 1.2rem "din-2014";
    letter-spacing: .6px;
    color: #fff;
    text-shadow: 0px 0px 40px rgba(0, 0, 0, .7019607843);
    text-transform: uppercase;
    text-decoration: none;
    display: none;
    justify-content: flex-start;
    align-items: center
}

.gallery-grid__back-cta svg {
    margin-right: 1em;
    stroke: #fff;
    fill: #fff;
    transform: rotate(90deg);
    transition: all .3s ease-in-out
}

@media only screen and (min-width: 48em) {
    .gallery-grid__back-cta {
        right: 5.5%
    }
}

.gallery-grid__back-cta:hover svg {
    stroke: #067ca9 !important;
    fill: #067ca9 !important;
    cursor: pointer
}

/*# sourceMappingURL=gallery-grid.css.map */