.banner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin: auto;
    z-index: 1;
    overflow: hidden
}

.banner__openclosebtn {
    display: none;
    visibility: hidden
}

.banner__item {
    -webkit-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out;
    position: relative;
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    box-sizing: border-box;
    height: 80vh;
    min-height: 35rem;
    overflow: hidden;
    background-color: rgba(0,0,0,0.2);
    will-change: auto
}

.banner__imagewrap,.banner__image,.banner__video {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    display: block;
    background-repeat: no-repeat;
    background-size: cover
}

.banner__video {
    -o-object-fit: cover;
    object-fit: cover
}

.banner__videoitem {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    min-width: 100%;
    min-height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.banner__content {
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    z-index: 0;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 1rem 3rem;
    background-color: rgb(0 0 0 / 59%);
    width: 100%;
    height: 130px;
}

.banner__title {
    font-size: 3.5rem;
    /* margin: 3rem 0; */
    /* line-height: 1.2; */
    color: #fafafa;
    text-align: left;
    -webkit-transition: all cubic-bezier(0.76,0.13,0.21,0.93) .4s;
    transition: all cubic-bezier(0.76,0.13,0.21,0.93) .4s;
    font-family: 'SwitzerlandCondensed_bold';
    /* will-change: auto; */
}
.banner__title .banner_des{
    position: relative;
    top: -85px;
}
.banner__item:hover .banner__content .banner_des{
    top: 0px;
}

.banner__text {
    -webkit-transition: .5s ease;
    transition: .5s ease;
    -webkit-transform: translatez(0);
    -ms-transform: translatez(0);
    transform: translatez(0);
    opacity: 0;
    -ms-filter: "alpha(opacity=0)";
    color: #fafafa;
    font-size: 16px;
    will-change: transform
}

.banner__text p {
    color: inherit;
    font-size: inherit;
    margin-bottom: 1rem;
    will-change: auto;
    font-weight: bold;
    font-family: 'SwitzerlandCondensed' !important;
}

.banner__link {
    -webkit-transition: .3s ease;
    transition: .3s ease;
    padding: 15px;
    display: inline-block;
    text-decoration: none !important;
    /* font-family: "ScaniaSansBold",Helvetica,Arial,sans-serif; */
    border: 1px solid #fafafa;
    color: #fafafa;
    cursor: pointer;
    font-size: 12px;
    background-color: transparent;
    text-transform: uppercase;
    border-radius: 2px;
    min-width: 130px;
    text-align: center
}

.banner__link:hover,.banner__link:focus {
    background-color: #fafafa;
    color: #041e42
}

.banner__text p .banner__link {
    opacity: 0;
    -ms-filter: "alpha(opacity=0)";
    -webkit-transform: translate3d(0,300px,0);
    transform: translate3d(0,300px,0);
    will-change: transform
}

.banner p {
    width: 100%
}

.banner--expanded {
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    will-change: auto
}

.aem-AuthorLayer-Edit .banner__item {
    height: 600px
}

.aem-AuthorLayer-Edit .banner__title.title--animation,.aem-AuthorLayer-Edit .banner__text,.aem-AuthorLayer-Edit .banner__text p,.aem-AuthorLayer-Edit .banner__link {
    opacity: 1;
    -ms-filter: "alpha(opacity=100)";
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.aem-AuthorLayer-Edit .banner__text {
    padding-bottom: 4rem
}

@media(max-width: 991px) {
    .banner {
        display:block;
        width: 100%
    }

    .banner__item {
        height: 200px;
        min-height: auto
    }

    .banner__item.banner--expanded {
        height: auto;
        -ms-flex: 3;
        -webkit-box-flex: 3;
        -webkit-flex: 3;
        flex: 3;
        cursor: default
    }

    .banner__item.banner--expanded .banner__openclosebtn:after {
        -webkit-transform: rotate(-2520deg);
        -ms-transform: rotate(-2520deg);
        transform: rotate(-2520deg);
        opacity: 1;
        -ms-filter: "alpha(opacity=100)";
        color: #fafafa
    }

    .banner__item.banner--expanded .banner__text {
        opacity: 1;
        -ms-filter: "alpha(opacity=100)"
    }

    .banner__openclosebtn {
        visibility: visible;
        text-decoration: none;
        text-align: center;
        display: inline-block;
        z-index: 1;
        color: #fff;
        font-size: .8125rem;
        position: absolute;
        top: 0;
        right: 0;
        -webkit-transition: bottom ease-out .3s,opacity ease .3s;
        transition: bottom ease-out .3s,opacity ease .3s;
        opacity: 1;
        -ms-filter: "alpha(opacity=100)";
        cursor: pointer;
        background: 0;
        border: 0;
        padding: 1.25rem;
        box-shadow: none;
        margin: 0;
        outline: 0
    }

    .banner__openclosebtn:after {
        content: "\2573";
        display: inline-block;
        padding-left: 1.125rem;
        font-size: 16px;
        font-weight: normal;
        -webkit-transition: .45s ease-in-out;
        transition: .45s ease-in-out;
        -webkit-transform: translateY(7px) rotate(-45deg);
        -ms-transform: translateY(7px) rotate(-45deg);
        transform: translateY(7px) rotate(-45deg)
    }

    .banner__videoitem {
        max-width: 100%
    }

    .banner__item--video .banner__content {
        position: absolute;
        top: 0;
        height: 100%
    }

    .banner__content {
        position: relative;
        padding: 3rem 2rem;
        min-height: 32vh;
        width: 100%;
        background-color: rgba(0,0,0,0.2);
        box-sizing: inherit
    }

    .banner__title {
        font-size: 2.8rem;
        padding: 0;
        margin: 0 0 2rem;
        line-height: 1.05
    }
}

@media(min-width: 992px) {
    .banner__title.title--animation {
        -webkit-transform:translate3d(0,88px,0);
        transform: translate3d(0,88px,0);
    }

    .banner__text {
        height: 132px;
        -webkit-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0);
        padding-bottom: -1rem;
    }

    .banner__item:hover {
        -webkit-transition: .8s ease-in-out;
        transition: .8s ease-in-out;
        -webkit-box-flex: 2;
        -webkit-flex: 2;
        -ms-flex: 2;
        flex: 2;
        display: block;
        background-color: rgba(0,0,0,0.5)
    }

    .banner__item:hover .banner__title.title--animation {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    .banner__item:hover .banner__content {
        -webkit-transition: .8s ease-in-out;
        transition: .8s ease-in-out;
        max-width: unset;
        position: absolute;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        height: auto;
    }

    .banner__item:hover .banner__text {
        -webkit-transform: translatez(0);
        -ms-transform: translatez(0);
        transform: translatez(0);
        display: block;
        opacity: 1;
        -ms-filter: "alpha(opacity=100)";
        font-size: 16px;
        width: 100%;
        height: auto
    }

    .banner__item:hover .banner__text p {
        max-width: 100%;
    }

    .banner__item:hover .banner__link {
        opacity: 1;
        -ms-filter: "alpha(opacity=100)";
        -webkit-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    .banner--expanded .banner__content {
        -webkit-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        max-width: unset;
        position: absolute
    }
}