/* ------------------------------ */
/* ----------- Event ------------ */
/* ------------------------------ */

.event {
    position: relative;
    overflow: hidden;
    opacity: 1;
    -webkit-transition: var(--transition-2);
    -o-transition: var(--transition-2);
    transition: var(--transition-2);
}

.event::after, .event:first-of-type::before {
    content: "";
    position: absolute;
    right: 0;
    height: 1px;
    background-color: var(--brand-color-1);
}

.event.is-loaded:nth-of-type(2n) {
    -webkit-transition-delay: calc(var(--transition-delay) * 1);
         -o-transition-delay: calc(var(--transition-delay) * 1);
            transition-delay: calc(var(--transition-delay) * 1);
}

.event.is-hidden {
    opacity: 0;
    -webkit-transition: var(--transition-2);
    -o-transition: var(--transition-2);
    transition: var(--transition-2);
}

.event__media {
    position: relative;
    padding: 0;
    padding-right: 0;
    z-index: 1;
    -webkit-transition: var(--transition-1);
    -o-transition: var(--transition-1);
    transition: var(--transition-1);
}

.event__content {
    -webkit-transition: var(--transition-1);
    -o-transition: var(--transition-1);
    transition: var(--transition-1);
}

.event__content__inside {
    position: relative;
}

.event__content__date {
    position: absolute;
    left: 0;
    text-align: center;
}

.event__content__meta {
    display: inline-block;
    font-size: var(--font-size-2);
    line-height: var(--line-height-3);
    color: var(--brand-color-1);
}

.button_container {
    text-align: center;
}

.menu__title {
    display: block;
    margin-bottom: var(--spacing-2);
}


/* Detail & Landingpage */
.section > div.section__detail {
    padding-top: 0;
}

.detail__content__menu {
    position: relative;
}

.detail__content__menu .dish:first-child {
    border-top: 1px solid var(--brand-color-1);
}

.detail__content__menu .menu__legal {
    position: relative;
    top: unset;
    right: unset;
    text-align: left;
    margin-top: var(--spacing-2);
    padding-top: 0;
}



/* Detail */
.intro_box__date__inside {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    text-align: center;
}

.section > div.section__other_events {
    padding: 0;
}

.other_events {
    position: relative;
}

.other_events::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    width: 1px;
    background-color: var(--brand-color-1);
}

.other_events__event {
    -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
}

.other_events__event--back {
    text-align: right;
}

.other_events__event--next {
    text-align: left;
}

.other_events__event__button {
    position: relative;
    display: block;
}

.other_events__event span {
    position: relative;
    display: inline-block;
    -webkit-transition: var(--transition-1);
    -o-transition: var(--transition-1);
    transition: var(--transition-1);
}



/* Landingpage */
.page-template-page-landingpage section.section--no-padding-bottom {
    padding-bottom: 0;
}

.section > div.section__tiles {
    max-width: 100%;
    padding: 0;
}

.tile {
    position: relative;
    padding: 0;
}

.tile span {
    display: block;
    font-family: var(--brand-font-headline);
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0.02em;
    line-height: var(--line-height-3);
}



/* ------------------------------ */
/* -------- Media Queries ------- */
/* ------------------------------ */

@media all and (min-width: 1900px) {

    .tile {
        height: 640px;
    }

}

@media all and (max-width: 1899.98px) and (min-width: 1720px) {

    .tile {
        height: 580px;
    }

}

@media all and (min-width: 1720px) {

    .event {
        min-height: 345px;
    }

    .tile span {
        font-size: 60px;
        padding: var(--spacing-7);
    }
  
}

@media all and (min-width: 1400px) {
    
    .event__content__date {
        top: 8px;
    }

}

@media all and (min-width: 1240px) {

    .event__content {
        padding: var(--spacing-3-5) var(--spacing-3-5) var(--spacing-6-5) var(--spacing-6-5);
    }

    .event__content__more {
        bottom: 22px;
    }

    /*
    .intro_box__date + .intro_box__headline {
        padding-top: var(--spacing-9);
    }
    */
    
    .intro_box__headline + .typography--label {
        margin-top: var(--spacing-4);
    }

    .detail__content__menu {
        padding: var(--spacing-7) 0 0;
    }

    .other_events__event span {
        padding-top: 13px;
        padding-bottom: 11px;
    }

    .other_events::before {
        height: 150px;
    }

}
  
@media all and (max-width: 1719.98px) and (min-width: 1400px) {

    .event {
        min-height: 382px;
    }

    .detail.row {
        margin-right: calc(var(--spacing-3) * -1);
        margin-left: calc(var(--spacing-3) * -1);
    }

    .detail > div {
        padding-right: var(--spacing-3);
        padding-left: var(--spacing-3);
    }

    .tile {
        height: 450px;
    }

    .tile span {
        font-size: 55px;
    }

}

@media all and (max-width: 1719.98px) and (min-width: 1240px) {

    .tile span {
        padding: var(--spacing-5);
    }

}


@media all and (max-width: 1535.98px) and (min-width: 1400px) {

    .event__content {
        padding-left: var(--spacing-5);
    }

}


@media all and (max-width: 1399.98px) and (min-width: 1240px) {

    .event {
        min-height: 325px;
    }

    .event__content {
        padding-left: var(--spacing-4);
    }

    .event__content__date {
        top: 6px;
    }

    .tile {
        height: 375px;
    }

    .tile span {
        font-size: var(--font-size-7);
    }

    .event__content__more {
        right: var(--spacing-5) !important;
    }

}


@media all and (max-width: 1239.98px) and (min-width: 992px) {

    .no-touchevents .event {
        min-height: 330px;
    }

    .touchevents .event {
        min-height: 285px;
    }

    .event__content {
        padding: var(--spacing-3-5) var(--spacing-3-5) var(--spacing-6-5) var(--spacing-3-5);
    }

    .event__content__date {
        top: 4px;
    }

    .event__content__more {
        bottom: 18px;
    }

    /*
    .intro_box__date + .intro_box__headline {
        padding-top: var(--spacing-8);
    }
    */
    
    .intro_box__headline + .typography--label {
        margin-top: var(--spacing-3-5);
    }

    .detail__content__menu {
        padding: var(--spacing-6-5) 0 0;
    }

    .other_events::before {
        height: 130px;
    }

    .tile {
        height: 415px;
    }

    .tile span {
        font-size: 42px;
        padding: var(--spacing-5);
    }

    .event__content__more {
        right: var(--spacing-5) !important;
    }

}

@media all and (max-width: 1239.98px) and (min-width: 768px) {

    .other_events__event span {
        padding-top: 13px;
        padding-bottom: 11px;
    }

}


@media all and (min-width: 992px) {

    .event::after, .event:first-of-type::before {
        width: calc(50% + var(--spacing-3-5));
    }
    
    .event:first-of-type::before {
        top: 0;
    }
    
    .event::after {
        bottom: 0;
    }

    .no-touchevents .event--linked:hover .event__media {
        -ms-flex-preferred-size: 52%;
            flex-basis: 52%;
        max-width: 52%;
    }

    .no-touchevents .event--linked:hover .event__content {
        -ms-flex-preferred-size: 48%;
            flex-basis: 48%;
        max-width: 48%;
    }

    /*
    .event__content__container {
        padding-left: var(--spacing-6-5);
    }
    */

    .event__content__desc {
        max-width: 445px;
    }

    .event__content__more {
        position: absolute;
        right: var(--spacing-3-5);
        width: 45px;
        height: 29px;
        overflow: hidden;
        -webkit-transition: var(--transition-1);
        -o-transition: var(--transition-1);
        transition: var(--transition-1);
    }
    
    .no-touchevents .event:hover .event__content__more {
        width: 62px;
        -webkit-transform: translateX(8px);
            -ms-transform: translateX(8px);
                transform: translateX(8px);
    }

    .button_container {
        padding-top: var(--spacing-7);
    }

    .single-event section:nth-last-child(2) {
        padding-bottom: var(--spacing-12);
    }

    .other_events__event--back {
        padding-right: calc(var(--spacing-10) - var(--spacing-7))
    }

    .other_events__event--next {
        padding-left: calc(var(--spacing-10) - var(--spacing-7))
    }

    .no-touchevents .other_events__event--back .other_events__event__button:hover span {
        padding-left: 0;
        padding-right: var(--spacing-7);
    }

    .no-touchevents .other_events__event--next .other_events__event__button:hover span {
        padding-right: 0;
        padding-left: var(--spacing-7);
    }

}


@media all and (max-width: 991.98px) and (min-width: 768px) {

    .event__media .picture_container--cover, .event__media .picture_container--cover picture {
        position: relative;
    }

    /*
    .event__content__container {
        padding-left: var(--spacing-6-5);
    }
    */

    .event__content__date {
        top: 4px;
    }

    .section > div:not(.section).section__back {
        padding-bottom: var(--spacing-2);
    }

    .tile {
        height: 580px;
    }

}

@media all and (min-width: 768px) {

    .other_events__event--back span {
        left: calc(var(--spacing-7) * -1);
        padding-left: var(--spacing-7);
    }

    .other_events__event--next span {
        right: calc(var(--spacing-7) * -1);
        padding-right: var(--spacing-7);
    }

}

@media all and (max-width: 991.98px) {

    .event::after, .event:first-of-type::before {
        width: 100%;
        z-index: 2;
    }

    .event::after {
        bottom: 0;
    }

    .event:first-of-type::before {
        top: 0;
    }

    .event__media {
        border-bottom: 1px solid var(--brand-color-1);
    }

    .event__content {
        padding: var(--spacing-3) 0 var(--spacing-4);
    }

    .event__content__meta {
        margin-bottom: 10px;
    }

    .event__content__more {
        display: none;
    }

    .button_container {
        padding-top: var(--spacing-6-5);
    }

    .single-event section:nth-last-child(2) {
        padding-bottom: var(--spacing-9);
    }

    /*
    .intro_box__date + .intro_box__headline {
        padding-top: var(--spacing-7);
    }
    */

    .intro_box__headline + .typography--label {
        margin-top: var(--spacing-3);
    }

    .detail__media {
        max-width: 100%;
    }

    .detail__content {
        padding-top: var(--spacing-3-5);
    }

    .detail__content__menu {
        padding: var(--spacing-6-5) 0 0;
    }

    .other_events::before {
        height: 105px;
    }

    .tile {
        height: 300px;
    }

    .tile span {
        position: absolute;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
        left: 50%;
        width: 75%;
        font-size: 30px;
        text-align: center;
    }

}


@media all and (max-width: 767.98px) {

    /*
    .event__content__container {
        padding-left: var(--spacing-5-5);
    }
    */

    .event__content__date {
        top: 1px;
    }

    .section > div:not(.section).section__back {
        padding-bottom: var(--spacing-3);
    }

    .other_events__event--back {
        padding-right: var(--spacing-5-5);
    }

    .other_events__event--next {
        padding-left: var(--spacing-5-5);
    }

    .other_events__event span {
        padding: var(--spacing-6-5) 12px 0;
    }

    .section > div.section__tiles {
        margin-top: var(--spacing-4);
    }

    .tile:first-of-type.tile--text {
        border-top: 1px solid var(--brand-color-1);
    }

}


@media all and (max-width: 575.98px) {

    .intro_box__label span {
        display: block;
    }

    .intro_box__label__divider {
        position: absolute;
        height: 1px;
        width: 1px;
        clip: rect(1px,1px,1px,1px);
        border: 0;
        overflow: hidden;
    }

}