/***************** below lg screens ****************/
@media (max-width: 992px){

    /**** gallery section ****/
    #gallery .gallery__images {
        column-count: 3;
        --webkit-column-count: 3;
        --moz-column-count: 3;
    }

}



/***************** below md screens ****************/
@media (max-width: 768px){

    body, .btn{
        font-size: 1.3rem;
    }

    /**** navbar ****/
    #navbar .row{
        margin: 0;
    }

    /**** about section ****/
    #about .grid-1-15, #about .grid-15-1{
        grid-template-columns: 1fr;
    }
    #about .about__grid .grid-content{
        width: 100% !important;
    }
    .about__grid:nth-child(2n) .grid-img {
        order: 1;
    }

    /**** about modal ****/
    .about__modal .modal-body{
        padding-top: 0;
    }
    .about__modal .modal-block .img-wrap {
        width: 100% !important;
        right: 0 !important;
        top: 0 !important;
    }
    .about__modal .modal-block .img-wrap .hero-slider:before{
        position: absolute;
        content: "";
        background: #ffffff;
        opacity: .5;
        z-index: 2;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
    .about__modal .modal-block .text-wrap {
        left: 0 !important;
        top: 3rem !important;
        text-align: center;
        padding: 0 1rem;
    }
    .about__modal .modal-block .text-wrap p{
        color: #2C2B30 !important;
        margin-left: 0 !important;
        height: 70vh !important;
    }

    /**** services section ****/
    #services .title{
        top: 50%;
    }
    .services__modal .modal-body{
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /**** testimonials section ****/
    #testimonials .testimonials__block{
        margin-top: 3rem;
    }
    #testimonials .testimonials__title{
        text-align: center;
    }

    /**** gallery section ****/
    #gallery .gallery__images {
        column-count: 2;
        --webkit-column-count: 2;
        --moz-column-count: 2;
    }

}


/***************** below md screens ****************/
@media (max-width: 576px) {

    /**** gallery section ****/
    #gallery .gallery__images {
        column-count: 1;
        --webkit-column-count: 1;
        --moz-column-count: 1;
    }

}