
@media only screen and (max-width: 1460px) {
    
    .header-inner {padding-left:75px;}
    #cssmenu > ul > li > a { padding: 15px 8px;}
    header i.fa {font-size:12px;}
}

@media only screen and (max-width: 1380px) {
    
    .header-inner {padding-left:50px;}
    #cssmenu > ul > li {padding-left:7px;padding-right:7px;}
}
@media only screen and (max-width: 1300px) {
    
    .header-inner {padding-left:0;}
    .home-about, .main .locations {background:none;}
    .about-image-container, .locations .about-image-container, .locations .about-image-container2 {max-width:550px;padding:120px 100px;}
}
@media only screen and (max-width: 1250px) {
    
    img.logo {max-width:300px;}
    #cssmenu > ul > li {padding-left:6px;padding-right:6px;}
}
@media only screen and (max-width: 1210px) {
    
     #cssmenu > ul > li > a { padding: 15px 5px;}
}

@media only screen and (max-width: 1170px) {
   
    .main {background:none;}
    .responsive-menu {display:block;}
    .logged-in header {margin-top:80px;}
    header {margin-top:40px;}
    .logo {margin-top:-10px;padding-top:0;}
    .head-tel { background-size: contain;font-size:20px;}
    .header-cart {font-size:18px;}
    #cssmenu > ul > li:last-child {border:0;}
    #cssmenu { background: #3C2E3C;padding:0;position:relative;
        z-index:1004;}

    #cssmenu > ul {
        
        max-height: 0;
        overflow: hidden;
        -webkit-transition: max-height 0.35s ease-out;
        -moz-transition: max-height 0.35s ease-out;
        -ms-transition: max-height 0.35s ease-out;
        -o-transition: max-height 0.35s ease-out;
        transition: max-height 0.35s ease-out;
    }
    #cssmenu > ul > li > ul {
        width: 100%;
        display: block;
    }
    #cssmenu.align-right ul li a {
        text-align: left;
    }
    #cssmenu > ul > li > ul > li {
        width: 100%;
        display: block;
    }
    #cssmenu.align-right ul ul li a {
        text-align: left;

    }
    #cssmenu > ul > li > ul > li > a {
        width: 100%;
        display: block;
    }
    #cssmenu ul li ul li a {
        width: 100%;
    }
    #cssmenu.align-center > ul {
        text-align: left;
    }
    #cssmenu.align-center > ul > li {
        display: block;
    }
    #cssmenu > ul.open {
        max-height: 1700px;
        border-top: 1px solid rgba(110, 110, 110, 0.25);
    }
    #cssmenu ul {
        width: 100%;
    }
    #cssmenu ul > li {
        float: none;
        width: 100%;
    }
    #cssmenu ul li a {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding: 12px 20px;
        color:#fff;
    }
    #cssmenu ul > li:after {
        display: none;
    }
    #cssmenu ul li.has-sub > a:after,
    #cssmenu ul li.has-sub > a:before,
    #cssmenu ul li ul li.has-sub:after,
    #cssmenu ul li ul li.has-sub:before {
        display: none;
    }
    #cssmenu ul li ul,
    #cssmenu ul li ul li ul,
    #cssmenu ul li ul li:hover > ul,
    #cssmenu.align-right ul li ul,
    #cssmenu.align-right ul li ul li ul,
    #cssmenu.align-right ul li ul li:hover > ul {
        left: 0;
        position: relative;
        right: auto;
    }
    #cssmenu ul li ul li,
    #cssmenu ul li:hover > ul > li {
        max-height: 999px;
        position: relative;
        background: none;
    }
    #cssmenu ul li ul li a {
        padding: 8px 20px 8px 35px;
        color: #ffffff;
    }
    #cssmenu ul li ul ul li a {
        padding: 8px 20px 8px 50px;
    }
    #cssmenu ul li ul li:hover > a {
        color: #ff0;
    }
    #cssmenu #menu-button {
        display: block;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding: 15px 20px;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 14px;
        letter-spacing: 1px;
        color: #ffffff;
        cursor: pointer;
    }
    #cssmenu #menu-button:after {
        display: block;
        content: '';
        position: absolute;
        height: 7px;
        width: 22px;
        border-top: 2px solid #ffffff;
        border-bottom: 2px solid #ffffff;
        right: 20px;
        top: 16px;
    }
    #cssmenu #menu-button:before {
        display: block;
        content: '';
        position: absolute;
        height: 3px;
        width: 22px;
        border-top: 2px solid #ffffff;
        right: 20px;
        top: 26px;
    }  
    .col-1 {max-width:100% !important;}
  
}
@media only screen and (max-width: 1122px) {
    .locations .grunge-container p, .locations .grunge-container2 p {font-size:18px;}
    
    .about-image-container, .locations .about-image-container, .locations .about-image-container2 {max-width:450px;padding:120px 80px;}
}
@media only screen and (max-width: 1050px) {
   .head-tel {margin-left:20px;}
   .header-cart a {font-size:16px;}
   .login-link {display:none;}
   .slider  .owl-item .item {width:100%;height:auto;min-height:500px;}
   .slider .text-overlay {max-width:600px;margin-left:-300px;font-size:20px;}
   .grunge-container {padding-right:60px;}
}
@media only screen and (max-width:930px) {
      .header-cart a {font-size:13px;}
.grunge-container {padding-top:120px;}
      
}
@media only screen and (max-width:870px) {
    .about-image-container, .locations .about-image-container, .locations .about-image-container2 {max-width:350px;padding:120px 30px;}
}
@media only screen and (max-width:846px) {
      .col-md-3, .col-md-4, .col-md-5, .col-md-8 {width:100% !important;max-width:100%;flex: 0 0 100%;text-align:center;}
      .logo {margin-bottom:20px;margin-top:10px;}
      .head-tel {width:190px;margin:0 auto;}
      header .social-media-icons {float:none;}
      .header-cart {margin:0 auto 5px auto;width:250px;}
      .login-link {display:inline-block;}
      .main-image h1 {top:65%;}
    
      
}

/* Tablet (Portrait) = Design for a width of 730px
================================================== */

@media only screen and (min-width: 768px) and (max-width: 990px) {
   
}

/* Mobile (Portrait) = Design for a width of 280px
================================================== */

@media only screen and (max-width: 767px) {
    .category-list {padding-top:0;}
     .about-image-container, .locations .about-image-container, .locations .about-image-container2 {max-width:95%;padding:40px 30px;margin:40px 20px 20px 40px;max-height:300px;}
    header .logo {padding:0;}
    header img.logo {max-width:275px;padding-bottom:10px;}
    header {text-align:center;}
    .social-media-icons {float:left;padding-top:5px;}
    header i.fa {font-size:10px;}
    .slider .text-overlay {max-width:480px;margin-left:-240px;font-size:16px;}
    .main-image {min-height:380px;}
     .main-image h1 {top:70%;font-size:28px;}
    .home-arrow {z-index:100;}
    .grunge-container, .locations .grunge-container, .locations .grunge-container2 {background:none;margin:0;padding:50px;height:auto;width:100%;max-width:100%;}
.carbon-counter-result {font-size:24px;}
.carbon-counter h2 {font-size:16px;}
}
/* Mobile (Landscape)
================================================== */

/* Note: Design for a width of 480px */

@media only screen and (max-width: 630px) {
    header img.logo {padding-bottom:10px;}
    .main {padding:0;}
    .woocommerce .col-1, .woocommerce .col-2 {max-width:100%;}
}
@media only screen and (max-width: 580px) {
   
   .footer-logo img {max-width:400px;width:100%;}
.footer-social {padding-bottom:30px;}
.footer-copyright {padding-bottom:20px;font-size:20px;}
.footer-privacy {font-size:13px;}
footer {padding:35px;}
} 

@media only screen and (max-width: 530px) {
       .slider .text-overlay {max-width:280px;margin-left:-140px;font-size:16px;top:50%;margin-top:0;}
       .slider  .owl-item .item {min-height:600px;}
.slider  .owl-next {background: url("/assets/img/chevron-right.svg") no-repeat  center center; background-size: 23px;  height: 68px; margin: 0 0 0 0; overflow: hidden; position: absolute; right:20px; text-indent: -999px; width: 53px;}
.slider .owl-prev {background: url("/assets/img/chevron-left.svg") no-repeat center center;  background-size: 23px; height: 68px; margin: 0 0 0 0; overflow: hidden; position: absolute; left:20px; text-indent: -999px; width: 53px; }
.footer-social i.fa {font-size:10px;}
.footer-logo {padding-bottom: 30px;}
.header-cart {width:180px;}
.text-search {display:none;}
}