.banner-group-1 {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    top: 81px
}

/* .banner-1 {
    background-image: url("https://nileshdesignsorrel.d2fwebsites4.com/images/ss-banner1.jpg");
    background-position: 50% 110%;
}

.banner-2 {
    background-image: url("https://nileshdesignsorrel.d2fwebsites4.com/images/ss-banner2.jpg");
}

.banner-3 {
    background-image: url("https://nileshdesignsorrel.d2fwebsites4.com/images/ss-banner3.jpg");
} */


/* Fix for flickering carousel */

.carousel-inner .carousel-item {
    opacity: 0;
    left: 0;
    display: block;
    position: absolute;
}

.carousel-inner .carousel-item:first-of-type {
    position: relative;
}

.carousel-inner .active {
    opacity: 1;
}


/* End of fix */

.banner-group-1 .header-title {
    animation: clear 0.8s 0.4s forwards;
    transform: translateY(10rem);
    position: relative;
    margin-bottom: o !important;
    opacity: 0;
    z-index: 20;
    text-shadow: 5px 2px 7px rgb(0 0 0 / 50%);
}

.banner-group-1 .header-subtitle {
    animation: clear 1s 0.7s forwards;
    transform: translateY(10rem);
    z-index: 21;
    text-shadow: 5px 2px 7px rgb(0 0 0 / 50%);
}

.banner-group-1 .header-cue {
    position: absolute;
    bottom: 0;
    animation: clear 0.5s 1.5s forwards;
    transform: translateY(2rem);
    z-index: 10;
    overflow: hidden;
}

.banner-group-1 .header-cue-icon {
    animation: slide-down 0.5s 1.8s forwards, pulse 2s 4s ease-in-out infinite;
    transform: translateY(-4rem);
    opacity: 1;
}

.site-sub {
    min-height: 60px;
}

.banner-group-1 {
    height: 200px;
}

@media only screen and (min-width: 280px) {
    .banner-group-1 {
        height: 250px;
    }
    .display-5 {
        font-size: 1.5rem;
        font-weight: light !important;
    }
    .site-sub {
        min-height: 60px;
    }
}

@media only screen and (min-width: 360px) {
    .banner-group-1 {
        min-height: 280px;
    }
    .site-sub {
        min-height: 90px;
    }
}

@media only screen and (min-width: 375px) {
    .banner-group-1 {
        height: 290px;
    }
    .site-sub {
        min-height: 100px;
    }
}

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

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

@media only screen and (min-width: 414px) {
    .banner-group-1 {
        height: 300px;
    }
    .site-sub {
        min-height: 120px;
    }
    .display-5 {
        font-size: 1.6rem;
    }
}

@media only screen and (min-width: 490px) {
    .banner-group-1 {
        height: 320px;
    }
    .site-sub {
        min-height: 140px;
    }
}

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

@media only screen and (min-width: 540px) {
    .banner-group-1 {
        height: 340px;
    }
    .site-sub {
        min-height: 160px;
    }
}

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

@media only screen and (min-width: 573px) {
    .banner-group-1 {
        height: 400px;
    }
    .site-sub {
        min-height: 160px;
    }
}

@media only screen and (min-width: 670px) {
    .banner-group-1 {
        height: 420px;
    }
    .site-sub {
        min-height: 190px;
    }
}

@media only screen and (min-width: 700px) {
    .banner-group-1 {
        height: 430px;
    }
    .site-sub {
        min-height: 230px;
    }
}

@media only screen and (min-width: 768px) {
    .display-2 {
        font-size: 3.5rem;
    }
    .banner-group-1 {
        height: 700px;
    }
}

@media only screen and (max-width: 768px) {
    .header-content {
        display: none !important;
    }
    .display-5 {
        font-size: 2rem;
    }
}

@media only screen and (min-width: 820px) {
    .banner-group-1 {
        height: 800px
    }
    .site-sub {
        min-height: 280px;
    }
}

@media only screen and (min-width: 850px) {
    .site-sub {
        min-height: 290px;
    }
}

@media only screen and (min-width: 870px) {
    .site-sub {
        min-height: 320px;
    }
}

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

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

@media only screen and (min-width: 992px) {
    .display-5 {
        font-size: 2.5rem;
    }
    .site-sub {
        min-height: 340px;
    }
}

@media only screen and (min-width: 1050px) {
    .site-sub {
        min-height: 350px;
    }
}

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

@media only screen and (min-width: 1250px) {
    .site-sub {
        min-height: 370px;
    }
}

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

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

@media only screen and (min-width: 1450px) {
    .display-2 {
        font-size: 5.5rem;
    }
}

@media only screen and (min-width: 1550px) {
    .site-sub {
        min-height: 440px;
    }
}

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

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

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