/* media queries  */

@media (max-width:1200px){

    html{
      font-size: 55%;
    }

  
  }
  
  @media (max-width:991px){
  
    header{
      padding:2rem;
    }
  
    section{
      padding:2rem;
    }
  
  }
  
  @media (max-width:768px){
  
    #menu-bar{
      display: initial;
    }
  
    header .navbar{
      position: absolute;
      top:100%; right:0; left: 0;
      background: #333;
      border-top: .1rem solid rgba(255,255,255,.2);
      padding:1rem 2rem;
      clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
      flex-direction: column;
    }
  
    header .navbar.active{
      clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    }
  
    header .navbar a{
      display: block;
      border-radius: .5rem;
      padding:1.5rem;
      margin:1.5rem 0;    
      background:#222;
    }
  
  }
  @media (max-width:450px){
  
    html{
      font-size:40%;
    }
  
    .heading span{
      font-size: 2.5rem;
    }
  
    
  
  }
  @media(max-width:600px){
    .wrapper header1{
      text-align:center;
    }
    form .dbl-field{
      margin-bottom:0px;
      flex-direction: column;
    }
    .dbl-field .field{
      width: 100%;
      margin-bottom: 20px;
    }
    form .message textarea{
      resize: none;
    }
    form .button-area{
      flex-direction: column;
    }
    .button-area button{
      width: 100%;

    }
    .button-area span{
      text-align: center;
      margin: 26px 0;
    }

  }

  /* contact meadia */
  @media (max-width:768px){
    
  .container{
    width: 85%;
    display: block;
    margin: auto;
    padding-top: 50px;

  }
  .content-section{
    float: none;
    width: 100%;

  }
  .image-section{
    float: none;
    width: 100%;
  }
  .content-section .title{
    font-size: 24px;
  }
  .content-section .content h2{
    font-size: 21px;
  }
  .content-section .content .button{
    font-size: 19px;
  }
  }
  /* testimonial meadia  */

  @media screen and (max-width:768px){
    .slide p{
      padding: 0 20px;
    }
    .nav-btn{
      display: none;
    }
  }
  /* footr section start */
 @media(max-width: 700px){
footer{
  bottom: unset;
}
.col{
  flex-basis: 100%;

}
.col:nth-child(2),.col:nth-child(3){
  flex-basis: 100%;
}
 }

  /* footr section start */