

@media (max-width: 380px) {
    .banner__topic{
        font-size: 2.5rem;
    }
    .banner__desc,.mobile-navbar__title{
        font-size: 1.4rem;
    }
    .btn{
        width: 14rem;
        height: 4rem;
    }
    .destinations__title{
        font-size: 2rem;

    }
    .newsletter__title{
        max-width: 16rem;
    }
    .quick-access{
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
    }
}


@media (min-width: 576px) {
    .container {
        /* width: 54rem; */
        width: 74vw;
    }
    .banner__desc{
        max-width: 34rem;
        margin: 0 auto 2rem auto;
    }    
}

@media (min-width: 768px) {
    .container {
        /* max-width: 96rem; */
        width: 85vw;
    }
    .menu__item{
        margin-right: 0.4rem;
        padding: 0.4rem;
    }
    .header-logo{
        margin-right: 3rem;
    }
    .banner__topic{
        font-size: 4rem;
        margin: 3rem auto 2.5rem auto;
    }
    .ham-btn{
        display: none;
    }
    .menu{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .banner__desc{
        max-width: 51rem;
    }
    .mobile-navbar{
        display: none;
    }
    .newsletter{
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }
    .service{
        -ms-flex-preferred-size: 45%;
            flex-basis: 45%;
    }
    .newsletter-left{
        -ms-flex-preferred-size:58%;
            flex-basis:58%;
        padding-right: 5rem;
    }
    .newsletter-right{
        -ms-flex-preferred-size:42%;
            flex-basis:42%;
    }
    .newsletter{
        -ms-flex-preferred-size:60%;
            flex-basis:60%;
        text-align: left;
    }
    .footer-right{
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }  
    .newsletter::before{
        width: auto;
        height: auto;
        top: -5rem;
        left: -52rem;
        background-size: auto;
        background-position: center left;
    }

}

@media (min-width: 992px) {
    .container {
        /* max-width: 114rem; */
        width: 85vw;
    }
    .right-navbar__links{
        display: block;
    }
    .banner{
        margin-top: 10rem;
    }
    .banner__desc{
        max-width: 55rem;
    }
    .service{
        -ms-flex-preferred-size: 45%;
            flex-basis: 45%;
    }
    .services{
        margin-top: -5rem;
    }
    .newsletter-left{
        -ms-flex-preferred-size:58%;
            flex-basis:58%;
        padding-right: 8rem;
    }
    .newsletter-right{
        -ms-flex-preferred-size:42%;
            flex-basis:42%;
    }
    .footer-wrapper{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }
    .footer-right{
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: end;
        -ms-flex-preferred-size: 60%;
            flex-basis: 60%;
    }
    .footer-left{
        -ms-flex-preferred-size: 40%;
            flex-basis: 40%;
    }
    .footer__scroll{
        left: auto;
    }
    .quick-access{
        width: 14rem;
    }
    .newsletter::before{
        top: -10rem;
        left: -38rem;
    }
    
}

@media (min-width: 1200px) {
    .container {
        /* max-width: 157rem; */
        width: 85vw;
    }
    .service{
        -ms-flex-preferred-size: unset;
            flex-basis: unset;
    }
    .newsletter{
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }
    .newsletter-left{
        -ms-flex-preferred-size: auto;
            flex-basis: auto;
        width: 58rem;

    }
    .newsletter-right{
        -ms-flex-preferred-size: auto;
            flex-basis: auto;
        width: 42rem;

    }
    .quick-access{
        width: 16rem;

    }
.newsletter::before{
    top: -15rem;
    left: -36rem;
}

}

@media (min-width: 1400px) {
    .newsletter{
        padding: 3rem 8rem;
    }
    .newsletter::before{
        top: -15rem;
        left: -30rem;
    }

}