@media only screen and (max-width: 1100px) {
  .container, .min_conatiner {
    width: 100%;
    padding: 0 15px; 
  }
  body, .banner_all {
    overflow-x: hidden !important;
  }
  .overley{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgba(0,0,0,0.4);
    opacity: 0;
    visibility: hidden;
  }
  .menu_trigger{
    display: block;
  }
  .menu_trigger i{
    color: #fff;
    font-size: 26px;
  }
  .menu{
    position: fixed;
    left: -250px;
    top: 0;
    bottom: 0;
    background: var(--siteprimary);
    width: 250px;
    z-index: 9;
    transition: all 0.3s ease-in-out;
  }
  .menu_open{
    left: 0;
  }
  .menu_open .overley{
    opacity: 1;
    visibility: visible;
  }
  .nav_link{
    flex-direction: column;
    margin-top: 30px;
  }
  .nav_link li a{
    padding: 10px 25px;
    display: block;
  }
  .banner{
    padding: 30px 0;
  }
  .owl-dots {
    bottom: -10px;
  }
  .bannerctn_left h1 {
    font: 60px twcenmt;
    padding-bottom: 10px;
  }
  .bannerctn_left {
    flex-basis: 50%;
    padding: 0 0 0 30px;
  }
  .bannerctn_right {
    flex-basis: 50%;
  }
  .banner_image {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 5px;
  }
  .banner_image2{
    height: auto;
  }
  .hm_about {
    overflow-x: hidden;
  }
  .owl-carousel3 .owl-dots {
    bottom: -50px;
  }
}

@media only screen and (max-width: 1024px) {
  .div_padding{
    padding: 40px 0;
  }
  .bannerctn_left h1 span {
    position: absolute;
    left: 0;
    font-size: 90px;
    top: 0%;
  }
  h1 {
    font: 46px twcenmt;
  }
  .benefits_right{
    padding-left: 0;
  }
  .portfolio_ctn h1 {
    font: 38px twcenmt;  
  }
  .portfolio_card span {
    font: 50px twcenmt;
  }
  .portfolio_ctn {
    bottom: 20px;
  }
  .news_card {
    flex-direction: column;
  }
  .news_card_ctn {
    padding-left: 0;
  }
  .news_card_image {
    width: 100%;
    height: 190px;
    overflow: hidden;
    object-fit: cover;
  }
  .news_card_image img {
    width: 100%;
    object-fit: cover;
  }
  .footer .container > .flex{
    flex-wrap: wrap;
  }
  .footer .wid_25{
     flex-basis: 50%;
     margin-top: 20px;
   }
   .service_image {
    margin-left: 0;
    flex-basis: 50% !important;
  }
  .about_page{
    padding: 40px 0;
  }
  .contact_page_us .flex{
    flex-direction: column;
    align-items: flex-start;
  }
  .appointment {
    width: 100%;
    margin-top: 20px;
  }
  ul.get_quote_frm.flex.wrap li {
    width: 100%;
}
  .conatct_us h2 {
    margin-bottom: 20px;
    font-size: 30px;
  }
  .conatct_us i {
    width: 40px;
    height: 40px;
  }
  .contact_page_us ul li.flex{
      flex-direction: row;
  } 
  .service_list_card li{
    padding-left: 0;
    padding-right: 0;
  }
  .success_pop_inr{
    width: 50%;
  }
}

@media only screen and (max-width: 840px) {
  
}
@media only screen and (max-width: 760px) {
 .benefits .container > .flex{
   flex-direction: column;
 }
 .benefits_right{
   overflow-x: inherit;
 }
 .hm_about .container > .flex{
   flex-direction: column;
 }
 .about_page .about_right{
   margin-right: 0;
   margin-bottom: 30px;
 }
 
}
@media only screen and (max-width: 640px) {
  .header_social {
   display: none; 
  }
  .header{
    padding: 20px 15px;
  }
  .banner_btn a{
    padding: 10px 25px;
  }
  .bannerctn {
    flex-direction: column;
  }
  .bannerctn_left {
    width: 100%;
    padding: 20px;
  }
  .banner {
    padding: 30px 0 60px 0;
  }
  .owl-dots {
    bottom: -45px;
  }
  .benefits_right {
    padding-top: 30px;
  }
  .owl-nav {
    position: static;
    margin-top: 30px;
    right: 10%;
    text-align: center;
  }
  .portfolio .flex, .enquiry_card .container .flex{
    flex-direction: column;
  }
  .enquiry_card .container .flex{
    align-items: flex-end;
  }
  .project_count h3 {
    font: 40px poppins_light;
  }
  .project_count p {
    font: 14px poppins;
  }
  .about_left p, .benefits_card p {
    font: 14px/26px poppins;
  }
  .philosophy .container .flex, .pepolesay .container > .flex, .copy_right .container > .flex{
    flex-direction: column;
  }
  .philosophy ul li{
    margin-bottom: 25px;
  }
  .skils, .service_list .container > .flex, .service_list_card ul {
    flex-direction: column;
  }
  .gallery .container .flex{
    flex-direction: column;
  }
  .pepole_card p{
    width: 100%;
  }
  .success_pop_inr{
    width: 90%;
  }
  .btn{
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 540px) {
  .banner_image2 {
    height: 120px;
}
.latest .container > .flex, .footer .container > .flex {
  flex-direction: column;
}
.footer h3 {
 
  min-height: inherit;
}
}

@media only screen and (max-width: 380px) {
 
}