#hero-banner {
    max-height: 920px;
    /*margin-top: -103px;*/
    z-index: 0;

    /*margin-bottom: 40px;*/
}
#hero-banner .red-btn > button, #hero-banner .red-btn > a {
    color: #FFFFFF !important;
    margin-top: 20px;
}
#hero-banner .red-btn > button:after, #hero-banner .red-btn > a:after {
    background: transparent url("../icons/ArrowUpWhite.svg") 50%/cover no-repeat;
}
#hero-banner > .wpb_column > .vc_column-inner {
    padding: 0;
}
#hero-banner-slider {
    display: none;
    margin-top: -40px;
    max-width: 1920px;
    margin: 0 auto;

    /*background-color: lightseagreen;*/
}
#hero-banner-slider .banner-slide,
#hero-banner-slider-mobile .banner-slide {
    position: relative;
}
#hero-banner-slider .banner-slide > .wpb_single_image {
    margin-bottom: 0;
}

/*#hero-banner-slider-mobile .banner-slide .ult-content-box*/
#hero-banner-slider .banner-slide .ult-content-box-container {
    /*position: relative;*/
    position: absolute;
    z-index: 99;
    top: 40%;
    left: 50%;
    transform: translate(-50%);
}
#hero-banner-slider-mobile .ult-content-box-container  {
    position: absolute;
    top: 50%;
    left: 40px;
    transform: translateY(-50%);
    max-width: 55%;
}

#hero-banner-slider .banner-slide .ult-content-box .wpb_single_image {
    margin: 0;
}
#hero-banner-slider .banner-slide .ult-content-box .uvc-heading {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
}
#hero-banner-slider .banner-slide .ult-content-box .uvc-heading .uvc-sub-heading {
    margin: 0;
}

.hero-banner__slider {
     width: 450px;
     height: 800px;
     border-radius: 6px;
     overflow: hidden;
 }
/*******/
/*#hero-banner-slider .banner-slide .vc_single_image-wrapper img {*/
/*    width: 100vw;*/
/*}*/
/*******/

.hero-banner__wrapper {

}

.hero-banner__slide {
     position: relative;
}
.banner-slide .uvc-main-heading {
    max-width: 915px;
}
.banner-slide .uvc-sub-heading {
    font-family: "Inter Medium";
    font-size: 14px;
}

.hero-banner__slide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

.swiper {
    position: relative;
}
.hero-banner__pagination, .mobile-hero-banner__pagination {
    bottom: unset !important;
    display: flex;
    padding: 0 4px;
    transform: rotate(270deg);
    max-width: 879px;
    width: 100%;
    position: absolute;
    top: 50% !important;
    left: -160px !important;
}
.swiper-pagination-bullet {
    flex-grow: 1;
    border-radius: 100vh;
    height: 1px;
    margin: 0 12px !important;
    /*background-color: rgba(#f7f7f5, .4);*/
    background-color: rgba(247, 247, 245, 0.4);
    opacity: 1;
    /*margin: 0 12px !important;*/
}
.swiper-pagination-progress {
    height: 100%;
    width: 0%;
    border-radius: 100vh;
    background-color: #f7f7f5;
}

.hero-banner__prev,
.hero-banner__next {
    height: 100%;
    width: 20%;
    top: 0;
    margin-top: 0;
}

.hero-banner__prev::after, .hero-banner__next::after {
    content: none;
}

.hero-banner__prev {
    left: 0;

    display: none;
}

.hero-banner__next {
    right: 0;
}


#slide-number__wrapper {
    position: absolute;
    color: #FFF;
    top: 43%;
    right: 17%;
    z-index: 1;
    font-size: 70px;
    line-height: 56px;

    display: flex;
    flex-direction: row;
    align-items: flex-start;
}
#slide-number__wrapper span {
    color: #FFF;
}
#slide-number__wrapper span.slide-number {
    font-family: "Roboto Bold";
    font-size: 70px;
    line-height: 71px;
    color: #FFFFFF;
}
#slide-number__wrapper span.of-slides {
    font-family: "Inter Medium";
    font-size: 25px;
    line-height: 38px;
    padding-left: 14px;
}
@media screen and (max-width: 1582px) {
    #hero-banner-slider .uvc-heading .uvc-main-heading h1 {
        font-size: 52px;
        line-height: 57px;
    }
    @media screen and (max-width: 1222px) {
        #hero-banner-slider .banner-slide .ult-content-box-container, #slide-number__wrapper {
            top: 30%;
        }
        .hero-banner__pagination {
            left: -51px !important;
            max-width: 580px;
        }
        @media screen and (max-width: 920px) {
            .hero-banner__pagination, .mobile-hero-banner__pagination {
                /*transform: unset;*/
                left: 9px !important;
                max-width: 460px;
            }
            #hero-banner-slider .uvc-heading .uvc-main-heading h1 {
                font-size: 40px;
                line-height: 45px;
            }

            @media screen and (max-width: 767px) {
                #navigation {
                    /*border: none;*/
                    padding: 0 32px !important;
                    height: 88px;
                }
                /*#navigation.sticky {*/
                /*    */
                /*}*/
                #hero-banner-slider-mobile figure,
                #hero-banner-slider-mobile .vc_single_image-wrapper,
                #hero-banner-slider-mobile .vc_single_image-wrapper img  {
                    width: 100%;
                }

                .home #hero-banner .ult-carousel-wrapper {
                    margin-bottom: 0 !important;
                    padding-bottom: 0 !important;
                }
            }
        }
    }
}



/******* Mobile Only Slider *********/
#hero-banner-slider-mobile h1 {
    font-size: 44px;
}

#mobile-slides-numbers.slides-numbers {
    position: absolute;
    bottom: calc(17% + 80px);
    transform: translateY(-25%);
    right: 40px;
    z-index: 9;
}
#mobile-slides-numbers.slides-numbers span {
    color: #FFFFFF;
    font-weight: 700;
    font-size: 40px;
}
#mobile-slides-numbers.slides-numbers, #mobile-slides-numbers.slides-numbers .active {
    font-family: "Roboto Bold";
    font-size: 37px;
    line-height: 37px;
    color: #FFFFFF;
}
#mobile-slides-numbers.slides-numbers .total {
    font-family: "Inter Medium";
    font-size: 20px;
    line-height: 27px;
    padding-left: 4px;
}

@media screen  and (min-width: 1382px) and (max-width: 1582px) {
    #slide-number__wrapper {
        right: 15%;
        font-size: 60px;
        line-height: 42px;
    }
    #slide-number__wrapper span.slide-number {
        font-size: 60px;
        line-height: 61px;
    }
    #slide-number__wrapper span.of-slides {
        font-size: 22px;
        line-height: 30px;
        padding-left: 8px;
    }
}

@media screen  and (min-width: 921px) and (max-width: 1381px) {
    #hero-banner-slider .uvc-heading .uvc-main-heading h1 {
        font-size: 42px;
        line-height: 47px;
    }

    #slide-number__wrapper span.slide-number {
        font-size: 50px;
        line-height: 51px;
    }
    #slide-number__wrapper span {
        font-size: 50px;
        line-height: 44px;
    }
    #slide-number__wrapper span.of-slides {
        font-size: 20px;
        line-height: 32px;
        padding-left: 12px;
    }

    .banner-slide .uvc-main-heading {
        max-width: 480px;
    }
}

@media screen  and (min-width: 768px) and (max-width: 920px) {
    .hero-banner__pagination {
        max-width: 342px !important;
        top: 60% !important;
    }

    #hero-banner-slider .uvc-heading .uvc-main-heading h1 {
        font-size: 32px;
        line-height: 38px;
    }

    #slide-number__wrapper span.slide-number {
        font-size: 40px;
        line-height: 41px;
    }

    #slide-number__wrapper span {
        font-size: 40px;
        line-height: 34px;
    }
    #slide-number__wrapper span.of-slides {
        font-size: 18px;
        line-height: 30px;
        padding-left: 8px;
    }

    .banner-slide .uvc-main-heading {
        max-width: 460px;
    }
}

@media screen and (max-width: 767px) {
    .banner-slide .ult-content-box-container > .ult-content-box > .uvc-heading {
        min-width: 280px;
    }
    @media screen  and (max-width: 713px) {
        #mobile-slides-numbers.slides-numbers {
            bottom: calc(10% + 80px);
        }
    }

    @media screen  and (max-width: 512px) {
        #hero-banner-slider-mobile h1 {
            font-size: 32px;
        }
        /*#mobile-slides-numbers.slides-numbers {*/
        /*    top: calc(5% + 80px);*/
        /*    left: unset;*/
        /*    right: 40px;*/
        /*}*/

        @media screen  and (max-width: 420px) {
            #mobile-slides-numbers.slides-numbers {
                bottom: calc(1% + 80px);
                /*left: unset;*/
                /*right: 40px;*/
            }
        }
    }
}
