/* ------------------------------ */
/* ----------- Header ----------- */
/* ------------------------------ */

.site_header {
    position: fixed;
    left: 0;
    top: 0;
    height: var(--app-height);
    width: var(--nav-width);
    background-color: rgba(0,82,57,.02);
    -webkit-box-shadow: 0px 0px 20px 0px rgba(0, 29, 20, .07);
            box-shadow: 0px 0px 20px 0px rgba(0, 29, 20, .07);
    z-index: 10;
}

.site_header__inside {
    height: 100%;
    padding-top: 2.5rem;
}

.site_header__row {
    margin-left: 0;
    margin-right: 0;
}
  
.site_logo a {
    display: inline-block;
}



/* ------------------------------ */
/* --------- Navigation --------- */
/* ------------------------------ */
.site_nav {
    padding-top: 4.5rem;
}

.site_nav li a {
    color: var(--brand-color);
}

.site_nav .site_nav__main li + li {
    margin-top: .85rem;
}

.site_nav .site_nav__main li a {
    position: relative;
    display: inline-block;
    font-size: 1.2rem;
    width: 100%;
    padding-bottom: 2px;
}

.site_nav .site_nav__main li a::before, .site_nav .site_nav__main li a::after {
    content: "";
    position: absolute;
    height: 2px;
    bottom: 0;
    left: 0;
}

.site_nav .site_nav__main li a::before {
    width: 100%;
    background-color: var(--brand-background-color-transparent);
}

.site_nav .site_nav__main li a::after {
    width: 0;
    background-color: var(--brand-color);
    -webkit-transition: .75s;
    -o-transition: .75s;
    transition: .75s;
}

.no-touchevents .site_nav .site_nav__main li a:hover::after, .site_nav .site_nav__main li.nav__item--active a::after {
    width: 100%;
}

.site_nav .site_nav__meta {
    margin-top: 1.75rem;
}

.site_nav .site_nav__meta li + li {
    padding-top: 4px;
}

.site_nav .site_nav__meta li a {
    display: block;
    font-size: 1.05rem;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}

.no-touchevents .site_nav .site_nav__meta li a:hover, .site_nav .site_nav__meta li.nav__item--active a, .site_nav .site_nav__meta li.nav__item--current_ancestor a, .single-post .site_nav .site_nav__meta li.nav__item--aktuelles a {
    opacity: .6;
}



/* Language Switcher */
.site__language_switcher {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: var(--brand-background-color-transparent);
}

.site__language_switcher a {
    display: block;
    position: relative;
    font-size: 16px;
    padding: 18px 0 18px 30px;
    color: var(--brand-color);
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}

.no-touchevents .site__language_switcher a:hover {
    color: var(--brand-white);
    background-color: var(--brand-color);
}


.site__language_switcher a span {
    position: relative;
    display: inline-block;
    padding-left: 1.2rem;
}

.hide-desktop {
    display: none;
}



/* ------------------------------ */
/* ---- Headerimage / -video ---- */
/* ------------------------------ */
.site_cover {
    position: relative;
    margin-left: var(--nav-width);
    z-index: 1;
}

.site_cover {
    height: 75vh;
    min-height: 500px;
}

.site_cover__container, .site_cover__media {
    height: 100%;
}

.site_cover .video_container iframe {
    width: 100vw;
    height: 56.25vw;
    min-height: 100vh;
    min-width: 177.77vh;
}

.site_cover__content {
    position: absolute;
    bottom: var(--quote-position);
    width: 465px;
    background-color: rgba(255, 255, 255, .4);
    z-index: 1;
}

.site_cover__content:not(.site_cover__content--right) {
    left: var(--quote-position);
}

.site_cover__content--right {
    right: var(--quote-position);
}

.site_cover__content__quote {
    position: relative;
    padding: 1.25rem 1.25rem 1rem 2.95rem;
    color: var(--brand-color);
}

.quote {
    quotes: '' '' '' '';
    font-size: .9rem;
    line-height: 1.45;
    display: inline-block;
}

.author {
    display: block;
    font-size: 15px;
}



/* ------------------------------ */
/* -------- Media Queries ------- */
/* ------------------------------ */

@media only screen and (min-width: 1921px) {

    .site_cover__content {
        width: 565px;
    }

}


@media only screen and (min-width: 1024px) {

    .site_nav__icon {
        display: none;
    }

}

@media only screen and (max-width: 1199.98px) {  

    .site_header__inside {
        padding: 2.5rem 1.25rem 0;
    }

    .site_cover {
        height: 65vh;
    }

}


@media (max-height: 800px) and (min-width: 1024px) { 

    .site_nav {
        padding-top: 3rem;
    }

}

@media (max-height: 720px) and (min-width: 1024px) {  

    .site_header__inside {
        padding-top: 2rem;
    }

    .site_nav {
        padding-top: 1.5rem;
    }

}


@media (max-height: 600px) and (min-width: 1024px) {

    .site_header {
        overflow-y: scroll;
    }
    
    .site_header__inside {
        min-height: 630px;
    }

}


@media only screen and (max-width: 1023.98px) {

    body.menu-open {
        overflow: hidden;
    }

    .site_header {
        height: var(--header-height);
        width: 100%;
    }

    .site_header::after {
        content: "";
        position: fixed;
        top: 70px;
        left: 0;
        width: 100%;
        height: calc(100% - 70px);
        background-color: var(--brand-white);
        opacity: 0;
        z-index: -1;
        visibility: hidden;
        cursor: pointer;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
    }

    .menu-open .site_header::after {
        opacity: .6;
        z-index: 1;
        visibility: visible;
    }

    .site_header__inside {
        height: unset;
        padding: 0;
    }

    .site_nav {
        padding: 0;
    }

    .site_nav__icon {
        position: absolute;
        right: 0;
        top: 0;
        height: var(--header-height);
        width: var(--header-height);
        background-color: var(--brand-color);
        cursor: pointer;
    }

    .site_nav__icon .vegan_hamburger {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
    }

    .site_nav__icon .vegan_hamburger .line {
        display: block;
        width: 32px;
        height: 2px;
        background-color: var(--brand-white);
    }

    .vegan_hamburger .line:nth-child(2) {
        -webkit-transition: all .25s;
        -o-transition: all .25s;
        transition: all .25s;
    }

    .vegan_hamburger .line:nth-child(1), .vegan_hamburger .line:nth-child(3) {
        -webkit-transition: all .75s;
        -o-transition: all .75s;
        transition: all .75s;
    }

    .site_nav__icon .vegan_hamburger .line + .line {
        margin-top: 6px;
    }

    .menu-open .site_nav__icon .line:nth-child(1) {
        -webkit-transform: translateY(8px) rotate(45deg);
        -ms-transform: translateY(8px) rotate(45deg);
        transform: translateY(8px) rotate(45deg);
    }

    .menu-open .site_nav__icon .line:nth-child(2) {
        opacity: 0;
    }

    .menu-open .site_nav__icon .line:nth-child(3) {
        -webkit-transform: translateY(-8px) rotate(-45deg);
        -ms-transform: translateY(-8px) rotate(-45deg);
        transform: translateY(-8px) rotate(-45deg);
    }

    .menu-open.close-animation .site_nav__icon .line {
        -webkit-transition-delay: .25s;
             -o-transition-delay: .25s;
                transition-delay: .25s;
    }

    .menu-open.close-animation .site_nav__icon .line:nth-child(2) {
        opacity: 1;
        -webkit-transition-delay: .45s;
             -o-transition-delay: .45s;
                transition-delay: .45s;
    }

    .menu-open.close-animation .site_nav__icon .line:nth-child(1), .menu-open.close-animation .site_nav__icon .line:nth-child(3) {
        -webkit-transform: translateY(0) rotate(0deg);
        -ms-transform: translateY(0px) rotate(0deg);
        transform: translateY(0px) rotate(0deg);
    }

    .site_header::after, .site_nav__container {
        top: var(--header-height);
        height: calc(var(--app-height) - var(--header-height));
    }

    .site_nav__container {
        visibility: hidden;
        position: fixed;
        right: 0;
        width: 400px;
        padding-bottom: 2rem;
        background-color: var(--brand-color);
        z-index: -1;
        opacity: 0;
        overflow: hidden;
        -webkit-overflow-scrolling: touch;
        -webkit-transform: translateX(101%);
            -ms-transform: translateX(101%);
                transform: translateX(101%);
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
    }

    .menu-open .site_nav__container {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
                transform: translateX(0);
        z-index: 100;
    }

    .site_nav__main, .site_nav__meta {
        padding: 25px 30px 25px 30px;
        opacity: 0;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
    }

    .site_nav .site_nav__main li a::before {
        background-color: rgba(255, 255, 255, .1);
    }

    .site_nav .site_nav__main li a::after {
        background-color: rgba(255, 255, 255, 1);
    }

    .site_nav .site_nav__meta {
        margin-top: 0;
        padding-top: 4px;
    }

    .menu-open .site_nav__main, .menu-open .site_nav__meta {
        opacity: 1;
    }

    .site_nav li, .site_nav__main > li > a, .site_nav__meta > li > a {
        color: var(--brand-white);
    }

    .site_logo {
        padding: 15px 20px;
    }

    .site__language_switcher {
        left: unset;
        right: 0;
        width: 100%;
        background-color: rgba(255, 255, 255, .1);
        z-index: 100;
        opacity: 0;
        -webkit-transition: .5s;
        -o-transition: .5s;
        transition: .5s;
    }

    .menu-open .site__language_switcher {
        opacity: 1;
    }

    .site__language_switcher a {
        padding-left: 24px;
    }

    .site__language_switcher span {
        color: var(--brand-white);
    }

    .site_cover {
        margin-top: var(--header-height);
        height: 68vh;
    }

    .hide-desktop {
        display: initial;
    }
    
    .hide-mobile {
        display: none;
    }

}


@media (max-width: 767.98px) { 

    .site_logo {
        padding: 12px 15px;
    }

    .site_logo img {
        width: 190px;
        height: 40px;
    }

    .site_nav__container {
        width: 50%;
    }

    .site__language_switcher a {
        padding-top: 14px;
        padding-bottom: 14px;
    }
  
    .site_cover {
        height: 80vh;
        min-height: 480px;
    }

    .site_cover, .site_cover__media {
        height: auto;
        min-height: auto;
    }

    .site_cover .picture_container--cover, .site_cover .picture_container--cover picture, .objectfit .picture_container--cover img, .object-fit .picture_container--cover img {
        width: auto;
        height: auto;
    }

    .site_cover .picture_container--cover, .site_cover .picture_container--cover picture {
        position: relative;
        left: unset;
        top: unset;
    }

    .site_cover .picture_container img {
        object-position: unset !important;
    }

    .site_cover__content {
        position: relative;
        top: -1px;
        bottom: unset;
        margin: 0 auto;
        width: 100%;
        background-color: var(--brand-color);
    }

    .site_cover__content:not(.site_cover__content--right) {
        left: unset;
    }

    .site_cover__content--right {
        right: unset;
    }

    .site_cover__content__quote {
        color: var(--brand-white);
    }

    .site_cover__content__quote {
        padding: 15px;
    }

    .quote {
        quotes: '«' '»' '"' '"';
    }

    .author {
        opacity: .7;
    }

    .site__language_switcher a span {
        padding-left: 25px;
    }

}


@media (max-width: 575.98px) {  

    .site_nav__container {
        width: 66.666%;
    }
 
}
 

@media (max-width: 413.98px) {  

    .site_nav__container {
        width: 75%;
    }
 
}