@media only screen and (max-width: 767.8px) {



    .ban-sec{
        padding-top: 80px;
        padding-bottom: 80px;
        background-size: cover;
        height: 100vh;
    }
    .headings{
        width: 100%;
        font-size: 35px;
        line-height: 42px;
    }
    .firstpara{
        width: 100%;
        font-size: 16px;
    }
    .section-new{
        margin-top: 60px;
    }
    .headine1{
       font-size: 35px; 
    }
    .mt-f{
        margin-top: 30px;
    }
    .aboutHead{
        font-size: 33px;
    line-height: 38px;
    margin: 18px 0px 20px 0px !important;
    }
    .contactUs{
        margin-top: 60px;
    }
    .slide-boxes{
        margin: 0px;
    }
    .section.fourth{
        margin-top: 40px;
    }
    .company{
        margin-top: 50px;
    }
    .Sec-company{
        padding-top: 30px;
        padding-bottom: 40px;
    }
    .box-wraper{
        margin-bottom: 30px;
    }
    .mid{
        margin-top: 60px;
    }
    .process-steps{
        display: block;
        padding: 20px 0;
    }
    .step{
        width: 100%;
        margin-top: 40px;
    }
    .process-steps::after{
        display: none;
    }



    .about-mid4{
        margin-top: 60px;
    }
    .testi{
        padding: 15px;
        padding-top: 40px;
    }
    .section.seventh{
        margin-top: 60px;
    }
    .section.twelfth{
        margin-top: 50px;
    }
    .cont-grd{
        grid-template-columns: repeat(1, 1fr);
        margin-top: 30px;
    }
    .cnto-card{
        margin-top: 60px;
    }
    .blog{
        margin-top: 55px;
    }
    .address{
        padding-top: 0px;
        margin-top: 10px;
    }
    .container1{
        padding: 20px;
    }
    .contacts-box{
        padding: 15px;
    }
    h4.footer-title {
    padding-top: 25px;
}

.img-fluid-nw1{
    height: auto;
}


/* about us page */
.abt-nw1{
    margin-top: 60px;
}
.heading{
    font-size: 33px;
    line-height: 38px;
    margin: 20px 0px 20px 0px !important;
}
.abt-nw1 .timeline{
    margin-bottom: 30px;
}
.about-mid{
    margin-top: 50px;
}
.abt-mid1{
     margin-top: 60px;
}
.testi{
    margin-top: 50px;
}
.footer-top{
    padding-top: 80px;
}

/* service page */

.serv{
    margin-top: 60px;
}
.img-fluid-lks{
    height: auto;
}
.service-main-wrapper-tabs .nav{
    justify-content: center;
}
.service-main-wrapper-tabs .nav li button{
    padding: 14px 25px;
    font-size: 16px;
}
.service-main-wrapper-tabs .tab-content .inner-wrapper-tab-service-wrapper{
        padding: 15px;
}
.com-txt{
    width: 100%;
}
.serv-po{
    margin-top: 60px;
}
.copy{
    font-size: 16px;
}
.ban1-mg-pro1 h3 {
    font-size: 22px;
}
.ban1-mg-pro {
    width: 50px;
    min-width: 50px;
    height: 50px;
    line-height: 50px;
}

/* case study page */

.portfolio{
    margin-top: 60px;
}
.port-mid-sec1{
    overflow: hidden;
    height: auto;
}
.ban1-grid{
    grid-template-columns: repeat(1, 1fr);
}
div#fle-x {
    flex-direction: column-reverse;
}
.port-mid{
    margin-top: 60px;
}
.gall-grid-nw{
    grid-template-columns: repeat(1, 1fr);
    margin-top: 30px;
}
img.img-fluid.rounded.shadow-sm{
    height: auto;
}

/* gallery */

.gall{
    margin-top: 60px;
}
.gall-grid{
    grid-template-columns: repeat(2, 1fr);
}

/* contact us */

.cont{
    margin-top: 50px;
}
img.img-mg2{
    width: 100%;
}
.cont1{
    margin-top: 40px;
}
.responsive-map{
    padding-bottom: 80.25%;
}
.icons{
    height: 45px;
}
.fle-xo {
    flex-direction: column-reverse;
}
 .blog-title {
    height: auto;
 }
 .blog-card img{
    height: auto;
 }
 div#flo-x {
    flex-direction: column-reverse;
}
.clint-grd{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  /* grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); */
  align-items: center;
  justify-items: center;
}

.log-mh{
  width: 110px;
  height: auto;
}
.log-mh1{
  width: 100px;
  height: auto;
}
.grd-po{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0px;
}


}
@media (max-width: 320px) { 
    /* .ban-sec{
        height: 68vh;
    } */
 }
@media (min-width: 768px) and (max-width: 991.78px) { 
        .ban-sec{
        padding-top: 80px;
        padding-bottom: 80px;
        background-size: cover;
        height: auto;
    }
    .headings{
        width: 100%;
        font-size: 40px;
        line-height: 49px;
    }
    .firstpara{
        width: 100%;
    }
    .section-new{
        margin-top: 60px;
    }
    .headine1{
       font-size: 40px; 
    }
    .mt-f{
        margin-top: 30px;
    }
    .aboutHead{
        font-size: 40px;
    line-height: 44px;
    margin: 30px 0px 20px 0px !important;
    }
    .contactUs{
        margin-top: 50px;
    }
    .slide-boxes{
        margin: 0px;
    }
    .section.fourth{
        margin-top: 60px;
    }
    .company{
        margin-top: 60px;
    }
    .Sec-company{
        padding-top: 30px;
        padding-bottom: 40px;
    }
    .box-wraper{
        margin-bottom: 30px;
    }
    .mid{
        margin-top: 60px;
    }
    .process-steps{
        display: grid;
        grid-template-columns: repeat(2, 1fr); 
        padding: 20px 0;
    }
    .step{
        width: 100%;
        margin-top: 40px;
    }
    .process-steps::after{
        display: none;
    }



    .about-mid4{
        margin-top: 30px;
    }
    .testi{
        padding: 15px;
        padding-top: 40px;
    }
    .section.seventh{
        margin-top: 75px;
    }
    .section.twelfth{
        margin-top: 60px;
    }
    .cont-grd{
        grid-template-columns: repeat(1, 1fr);
    }
    .cnto-card{
        margin-top: 60px;
    }
    .blog{
        margin-top: 60px;
    }
    .address{
        padding-top: 0px;
    }
    .container1{
        padding: 20px;
    }
    .contacts-box{
        padding: 0px;
    }
    h4.footer-title {
    padding-top: 25px;
}
.box {
    padding-left: 5px;
}
.huh i{
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 16px;
}

/* service page */

.serv{
    margin-top: 60px;
}
.img-fluid-lks{
    height: auto;
}
.service-main-wrapper-tabs .nav{
    justify-content: center;
}
.service-main-wrapper-tabs .nav li button{
    padding: 14px 25px;
    font-size: 18px;
}
/* .service-main-wrapper-tabs .tab-content .inner-wrapper-tab-service-wrapper{
        padding: 15px;
} */
/* .com-txt{
    width: 100%;
} */
.serv-po{
    margin-top: 60px;
}
.copy{
    font-size: 16px;
}
/* .ban1-mg-pro1 h3 {
    font-size: 22px;
} */
/* .ban1-mg-pro {
    width: 50px;
    min-width: 50px;
    height: 50px;
    line-height: 50px;
} */
 .icons{
    height: 40px;
 }

 /* case study page */

.portfolio{
    margin-top: 60px;
}
.port-mid-sec1{
    overflow: hidden;
    height: auto;
}
.ban1-grid{
    grid-template-columns: repeat(1, 1fr);
}

.port-mid{
    margin-top: 60px;
}
.gall-grid-nw{
    grid-template-columns: repeat(2, 1fr);
}
/* gallery */

.gall{
    margin-top: 60px;
}
.gall-grid{
    grid-template-columns: repeat(2, 1fr);
}
/* contact us */

.cont{
    margin-top: 60px;
}
img.img-mg2{
    width: 100%;
}
.cont1{
    margin-top: 60px;
}
.fle-xo {
    flex-direction: column-reverse;
}

.clint-grd{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  /* grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); */
  align-items: center;
  justify-items: center;
}
.grd-po{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0px;
}



 }
@media screen and (min-device-width: 992px) and (max-device-width: 1200px) { 
    a.nav-link{
            padding: .5rem .5rem !important;
    }
    .navbar-expand-lg .navbar-nav a.nav-link{
         padding: .5rem .5rem !important;
    }
    .port-mid-sec1{
        height: 670px;
    }
    .ban1-mg {
    width: 40px;
    height: 40px;
    line-height: 40px;
}
.process-steps::after{
    left: 2%;
}

.lists li{
    padding: 0px 6px 12px 0;
}
.box {
    padding-left: 10px;
}
}
@media (min-width: 1200px) {

}