/* ==========================================
               Media Queries
=============================================*/

/* Extra Small Devices (Landscape Phones & Portrait Tablets) */

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

  av.navbar.navbar-expand-lg{
    padding: 30px 30px 0 30px !important;
  }

  .overlay ul li a {
    color: black;
  }
  .hamburger__bar, .hamburger__bar:before, .hamburger__bar:after {
    background-color: black;
  }


  header .container {
   padding: 0;
 }

 .portfolio {
   padding: 70px 20px 70px 20px;
 }

 .portfolio h1 {
   font-size: 38px;
 }

 .portfolio h4 {
   font-size: 18px;
   padding-top: 13px;
 }

 .about-contact-section {
   padding: 40px;
 }

 .about-contact-section h4{
   font-size: 21px;
 }

 .about-text {
   font-size: 33px !important;
   padding-right: 0px !important;
 }

 .portfolio-about .carousel-item{
   height: auto;
 }

 .about-section {
   padding: 60px;
 }

 .clientele-section {
   padding: 50px;
 }

 .clientele-section img {
   height: 120px;
 }

 .contact-header{
   height: auto !important;
   padding-bottom: 60px;

 }

 .contact-header img {
   overflow: hidden;
   width: 100% !important;
   height: 400px;
 }

 .contact-content {
   padding-bottom: 60px;
 }

 .about-contact-section {
   padding-top:
 }




 footer {
   padding: 30px;
 }

 footer .col-sm-6 {
   justify-content: center !important;
 }

 footer a {
   padding: 7px;
 }


}




}


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

  av.navbar.navbar-expand-lg{
    padding: 30px 30px 0 30px !important;
  }

  .overlay ul li a {
    color: black;
  }
  .hamburger__bar, .hamburger__bar:before, .hamburger__bar:after {
    background-color: black;
  }

  #mainNav.navbar-shrink {
    padding: 2px 7px 2px 7px !important;
  }

  header .container {
   padding: 0;
 }

 .portfolio {
   padding: 70px 20px 70px 20px;
 }

 .portfolio h1 {
   font-size: 35px;
 }

 .portfolio h4 {
   font-size: 15px;
   padding-top: 10px;
 }

 .about-contact-section {
   padding: 40px;
 }

 .about-contact-section h4{
   font-size: 18px;
 }

 .about-text {
   font-size: 30px !important;
   padding-right: 0px !important;
 }

 .portfolio-about .carousel-item{
   height: auto;
 }

 .about-section {
   padding: 60px;
 }

 .clientele-section {
   padding: 30px;
 }

 .clientele-section img {
   height: 120px;
 }

 .contact-header{
   height: auto !important;

 }

 .contact-header img {
   overflow: hidden;
   width: 100% !important;
   height: 500px;
 }

 .contact-content {
   padding-bottom: 60px;
 }




 footer {
   padding: 30px;
 }

 footer .col-sm-6 {
   justify-content: center !important;
 }

 footer a {
   padding: 7px;
 }


}


@media (max-width: 420px) {

   nav.navbar.navbar-expand-lg{
     padding: 30px 30px 0 30px !important;
   }

   .overlay ul li a {
     color: black;
   }
   .hamburger__bar, .hamburger__bar:before, .hamburger__bar:after {
     background-color: black;
   }

   #mainNav.navbar-shrink {
     padding: 2px 7px 2px 7px !important;
   }

   header .container {
    padding: 0;
  }

  .portfolio {
    padding: 70px 20px 70px 20px;
  }

  .portfolio h1 {
    font-size: 35px;
  }

  .portfolio h4 {
    font-size: 15px;
    padding-top: 10px;
  }

  .about-contact-section {
    padding: 40px;
  }

  .about-contact-section h4{
    font-size: 18px;
  }

  .about-text {
    font-size: 30px !important;
    padding-right: 0px !important;
  }

  .portfolio-about .carousel-item{
    height: auto;
  }

  .about-section {
    padding: 60px;
  }

  .clientele-section {
    padding: 30px;
  }

  .clientele-section img {
    height: 120px;
  }

  .contact-header{
    height: auto !important;

  }

  .contact-header img {
    overflow: hidden;
    width: 100% !important;
    height: 300px;
  }

  .contact-content {
    padding-bottom: 60px;
  }

  .error h1{
    font-size: 150px;
  }





  footer {
    padding: 30px;
  }

  footer .col-sm-6 {
    justify-content: center !important;
  }

  footer a {
    padding: 7px;
  }



}