/* ################################################## MEDIA QUERIES ########################################  */

@media (min-width: 320px) and (max-width: 490px) {
    #trip-details{
        display: none;
    }
    html{
        font-size: 9px;
    }

    /* ///////////////////// ABOUT SECTION ////////////////////  */
    .about-section{
        display: grid;
        grid-template-columns: repeat(auto-fit,minmax(20rem,1fr));
        gap: 2rem;
        margin: 3rem 0;
    }
    /* //////////////////////// SIGNATURE ROOM SECTION //////////////////  */
    .signature-rooms .box p, small{
        font-size: 11px;
    }
    #signature > div > div.container.signature{
        padding: 0;
        font-size: 11px;
    }
    #signature-rooms > div > div > img{
        width: 90%;
    }
    #signature > div > div.signature-heading-caption > h1{
        font-size: 15px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    /* ///////////////////////// TESTIONIAL SECTION ///////////////////  */
    #testimonial > div > div > div > div > h6 > b{
        font-size: 10px;
    }
    /* //////////////////////// LOGIN SECTION //////////////////  */
    #login > div > div > div.loginbox2 > div.container.mb-3 > small{
        font-size: 11px;
    }
    /* /////////////////////// THE SKY RESTURANT SECTION //////////////////  */
    #skyrestuarant > div.container-fluid.skyrestuarant-wrapper > div > h1{
        font-size: 17px;
    }
    #crossroad-restaurant > div.container-fluid.crossroad-restaurant-wrapper > div > h1{
        font-size: 14px;
    }
}
@media (min-width: 500px) and (max-width: 1100px){
    #trip-details{
        display: none;
    }
    #banner > div > h1{
        font-size: 3rem;
    }
    /* ///////////////////// ABOUT SECTION ////////////////////  */
    .about-section{
        display: grid;
        grid-template-columns: repeat(auto-fit,minmax(20rem,1fr));
        gap: 2rem;
        margin: 3rem 0;
    }
    /* //////////////////////// LOGIN SECTION //////////////////  */
    .loginbox1 h1{
        font-size: 11px;
    }
    /* ///////////////// REGISTRATION SECTION /////////////////  */

    #reg > div > div > div.regbox1 > h1 > b{
        font-size: 21px;
    }
    #reg{
        font-size: 18px;
        height: fit-content;
    }
}