/* Header video */
.intro-video-wrapper{

    width: 100vw;
    height: 100vh;

}
#background_header_video {
    /** Simulationg background-size: cover */
    object-fit: cover;
    height: 100%;
    width: 100%;

    position: absolute;
    top: 0;
    left: 0;
    background-position: center top;
    background-size: cover;
}
.header-type-invert-video .logo {
    -webkit-filter: invert(100%);
    filter: invert(100%);
}
.header-type-invert-video .navbar .nav-link, .header-type-invert-video .navbar .cta-box .cta-box-title {
    color: white;
}
.header-type-invert-video .navbar .cta-box
{
    color: #ffffff;
    border: 3px solid #ffffff;
}
.header-type-invert-video .navbar .cta-box .cta-icon {
    /* background-image: url(data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><polygon fill="%23000000" points="11.293 4.707 17.586 11 4 11 4 13 17.586 13 11.293 19.293 12.707 20.707 21.414 12 12.707 3.293 11.293 4.707"/></svg>); */
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26"> <g id="Group_1083" data-name="Group 1083" transform="translate(-1530 -640)"> <rect id="Rectangle_319" data-name="Rectangle 319" width="26" height="26" transform="translate(1530 640)" fill="none"/> <g id="Group_1077" data-name="Group 1077" transform="translate(1555.017 642) rotate(90)"> <line id="Line_6" data-name="Line 6" y2="24.223" transform="translate(10.721 0.794)" fill="none" stroke="%23ffffff" stroke-width="3"/> <path id="Path_12" data-name="Path 12" d="M0,10.721,10.722,0,21.443,10.721" transform="translate(0 1.145)" fill="none" stroke="%23ffffff" stroke-width="3"/> </g> </g> </svg>');
    border-left: 3px solid #ffffff;
}

.header-type-invert-video .navbar .cta-box .cta-icon.beanred-color {
    background-color: var(--pink-color);
}

.bluredHeader{
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.intro-video-wrapper-text {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    /* background: red; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.intro-video-wrapper-text small{
    color: #FFFFFF;
    font-size: 25px;
    font-family: var(--font-family-itcavant_garde_gothic_pro-medium);
    line-height: 36px;
    display: block;
    margin-bottom: 24px;
}
.intro-video-wrapper-text h1{
    color: #FFFFFF;
    font-size: 178px;
    font-family: var(--klavika-bold);
    line-height: 148px;
    font-weight: 600;
    text-transform: uppercase;
    display: flex;
}

.mobile-navigation.header-type-video {
    background: #ffffff;
}
.header-type-invert-video #nav-icon2 span{
    background: #FFFFFF;
}

.intro-video-wrapper-text-wrapper {
}
.intro-video-wrapper-text-wrapper h1 {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    word-break: break-word;
    margin-top: unset;
}

.intro-video-wrapper-text-wrapper .arrow-big::before {
    display: block;
    content: '';
    width: 85px;
    background-repeat: no-repeat;
    background-position: center;
     background-size: unset;
    height: 159px;
    margin-right: 36px;
    margin-top: -20px;
}

@media (max-width: 1024px) {
    .intro-video-wrapper-text-wrapper{
        max-width: 80%;
        margin: 0 auto;
    }


    .intro-video-wrapper-text h1{
        color: #FFFFFF;
        font-size: 133px;
        line-height: 111px;
        max-width: 100%;
        /*font-family: var(--klavika-medium);*/
    }

}

@media (min-width: 481px) and (max-width: 820px) {

    .page-header-type-video main {
        max-width: 100vw;
        overflow: hidden;
        margin-top: 72px;
    }

    .page-header-type-video h2 {
        font-size: 64px;
        line-height: 64px;
    }

    .page-header-type-video .block_type_call_to_action h2 {
        font-size: 64px;
        line-height: 64px;
    }

    h2.leistung_header{
        font-size: 40px !important;
        line-height: 52px !important;

    }

    .container-full.block-type-benefits-list.padding-top-xl{
        padding-top: 96px !important;
        padding-bottom: 96px !important;
    }

    .benefit-list-item.margin-bottom-xl:last-of-type {
        margin-bottom: 0 !important;
    }

}

@media (max-width: 480px) {
    #background_header_video {
        background-repeat: no-repeat !important;
        /*background-size: contain !important;*/
    }


    .intro-video-wrapper-text-wrapper{
        max-width: 80%;
        margin: 0 auto;
    }

    .intro-video-wrapper-text small{
        font-size: 20px;
        line-height: 15px;
        margin-bottom: 18px;
    }
    .intro-video-wrapper-text h1{
        color: #FFFFFF;
        /*font-size: 62px;*/
        /*font-size: clamp(2.438rem, 0.015rem + 12.921vw, 3.875rem);*/
        font-size: clamp(3.25rem, 0.333rem + 15.556vw, 5rem);
        /*line-height: 52px;*/
        line-height: clamp(2.625rem, 0.125rem + 13.333vw, 4.125rem);
        padding-right: 0;
        max-width: 100%;
    }
    .intro-video-wrapper-text {
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 100%;
        /* background: red; */
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        top: 185px;
    }

    .blp_header_title{
        font-size: 30px !important;
        line-height: 32px !important;
    }

    .intro-video-wrapper-text-wrapper .arrow-big::before {
        display: block;
        content: '';
        width: clamp(1.75rem, -0.542rem + 12.222vw, 3.125rem);
        background-repeat: no-repeat;
        background-position: center;
        height: clamp(2.063rem, 0.083rem + 10.556vw, 3.25rem);
        margin-right: 5px;
        margin-top: 0;
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28.386" height="47.109" viewBox="0 0 28.386 47.109"> <g id="Group_4517" data-name="Group 4517" transform="translate(-35.668 -180.947)"> <path id="Path_1074" data-name="Path 1074" d="M2.864,42.163,21.222,23.805a1.708,1.708,0,0,0,0-2.466L2.839,2.818" transform="translate(36.732 182.003)" fill="none" stroke="%23e3032d" stroke-miterlimit="10" stroke-width="11"/> </g> </svg>');
        background-size: clamp(1.25rem, 0.208rem + 5.556vw, 1.875rem);
    }

}


@media (min-width: 481px) and (max-width: 850px) {

    .intro-video-wrapper-text-wrapper .arrow-big::before {
        display: block;
        content: '';
        width: clamp(2.625rem, 0.24rem + 7.932vw, 4.375rem);
        background-repeat: no-repeat;
        background-position: center;
        background-size: clamp(1.5rem, -1.31rem + 9.348vw, 3.563rem);
        height: clamp(2.438rem, -2.076rem + 15.014vw, 5.75rem);
        margin-right: 6px;
        margin-top: 0;
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="66.202" height="101.092" viewBox="0 0 66.202 101.092"><path d="M47.57,1.347h0L1.379,46.513h0a4.028,4.028,0,0,0,0,6.062l0,0,46.19,45.164,0,0a4.246,4.246,0,0,0,6.2,0l0,0,10-9.774-13.1-12.806v0l-26.2-25.615,39.3-38.424-10-9.774A4.177,4.177,0,0,0,50.684,0l-.127,0A4.2,4.2,0,0,0,47.57,1.347Z" transform="translate(65.201 100.092) rotate(180)" fill="%23e3032d" stroke="%23e3032d" stroke-miterlimit="10" stroke-width="2"/></svg>');
    }

    .intro-video-wrapper-text h1{
        color: #FFFFFF;
        /*font-size: 62px;*/
        /*font-size: clamp(2.438rem, 0.015rem + 12.921vw, 3.875rem);*/
        font-size: clamp(3.875rem, -2.172rem + 20.113vw, 8.313rem);
        /*line-height: 52px;*/
        line-height: clamp(3.25rem, -1.86rem + 16.997vw, 7rem);
        padding-right: 0;
        max-width: 100%;
        font-family: var(--klavika-bold) !important;
    }

    .intro-video-wrapper-text {
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 100%;
        /* background: red; */
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        top: 185px;
    }

}

@media (min-width: 1000px) {

    .intro-video-wrapper-text-wrapper br:nth-child(1), .intro-video-wrapper-text-wrapper br:nth-child(3){
        display: none;
    }

}
