/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { 
    body{
        font-size: 15px;
    }
    /* banner part start */
    .banner-content h1{
        font-size: 50px;
        line-height: 45px;
    }
    .banner-box{
        grid-template-columns: repeat(1,1fr);
        gap: 50px;
    }
    
    .b-img{
        text-align: center;
    }
    .b-img img{
        max-width: 300px;
        width: 100%;
        
        height: 210px;
    }
    .banner-img{
        height: 600px;
    }
    
    

    .single-journey{
        min-height: 476px;
    }
    /* banner part end */

    /* why offer part start */
    .why-offer-box{
        grid-template-columns: repeat(1,1fr);
        gap: 40px;
    }
    .com-heading,
    .private-program-box h2{
        font-size: 27px;
        line-height: 35px;
    }
    .private-program-box p{
        font-size: 13px;
    }
    .container{
        padding-left: 25px;
        padding-right: 25px;
    }
    /* why offer part end */
    

 }

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) { 
    /* banner part start */
    .banner-content h1{
        font-size: 65px;
    }
    .banner-box{
        grid-template-columns: repeat(1,1fr);
        gap: 50px;
    }
    /* banner part end */

    /* why offer part start */
    .why-offer-box{
        grid-template-columns: repeat(1,1fr);
        gap: 40px;
    }
    /* why offer part end */



    
 }

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) { 
    /* banner part start */
    .banner-content h1{
        font-size: 65px;
    }
    .banner-box{
        grid-template-columns: repeat(1,1fr);
        gap: 50px;
    }
    /* banner part end */

    /* why offer part start */
    .why-offer-box{
        grid-template-columns: repeat(1,1fr);
        gap: 40px;
    }
    /* why offer part end */

    
 }

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) { 
    /* header part start */
    .logo{
        width: 130px;
    }
    
    /* header part end */
    /* banner part start */
    .banner-content h1{
        font-size: 65px;
    }
    .banner-box{
        gap: 40px;
    }
    /* banner part end */

    
 }

/*Extra large devices (Extra large desktops, 1200px and up)*/
@media (min-width: 1200px) and (max-width: 1399.98px) {
    .container{
        max-width: 1300px;
        width: 100%;
    } 
    /* banner part start */
    .banner-content h1{
        font-size: 75px;
    }
    /* banner part end */
 }

/*Extra large devices (Extra Extra large desktops, 1400px and up)*/
@media (min-width: 1400px) {  }