/* MEDIA SCREEN QUERYS * -------------------------- */

@media screen and (max-width: 1024px) {
.content{ padding:0 10px;}
#header .menu-wrap {float:right; margin:25px 0 0 0;}
#banner-bottom h1{ font-size:28px;}
#banner-bottom a{ font-size:14px; }
#about-section h1{ font-size:32px;}
#about-section p { font-size:14px; line-height:22px;}
#services-section h2 { font-size:32px;}
#services-section p{ font-size:13px;}
#work-section h2{ font-size:32px;}
#best-section .left{ width:70%; float:left;}
#best-section .right{ width:25%; float:right;}
#best-section h2{ font-size:32px;}
#clients-section h2{ font-size:32px;}
#footer-top .right{ width:26%;}
#footer-sec .footer-box2{ width:21%; float:left; margin:60px 4% 0 0; }
#footer-sec .footer-box3{ width:21%; float:left; margin:60px 4% 0 0; }
#footer-sec .footer-box4{ width:24%; float:left; margin:60px 0 0 0; }

#services-wrap p{ font-size:14px; line-height:22px;}

#quapack-wrap p{ font-size:14px; line-height:22px; margin:15px 0 0 0; }

#enquiry-wrap h1{ font-size:32px;}
#contact-wrap .icon{ width:80px; height:80px;}
#contact-wrap .icon i{ font-size:40px; line-height:80px;}
#contact-wrap h2{ font-size:20px; margin:5px 0 0 0;}
#contact-wrap p{font-size:14px; line-height:22px; margin:5px 0 0 0;}
.google-maps{ padding:55%;}
.cap-input { float: right;margin-top: 20px;width: 207px !important}

}

@media screen and (max-width: 768px) {
#header .top-bar .quote{ display:none;}
#header .menu-bar{ position:relative;}
#header .logo-wrap { position:absolute; }
#header .menu-wrap{ width:100%; margin:26px 0;}
#banner-bottom { text-align:center;}
#banner-bottom h1{float:none; display:block; font-size:26px;}
#banner-bottom a{float:none; display:inline-block; font-size:14px; margin:10px 0 0 0; }
#about-section .left{width:100%; float:none; text-align:center; margin:30px 0 0 0;}
#about-section .right{width:75%; float:none; margin:0 auto;}
#services-section ul li{ width:48%; float:left; background:#fff; margin:30px 4% 0 0; padding:0px;}
#services-section ul li:nth-child(3n+0){ margin:30px 4% 0 0;}
#services-section ul li:nth-child(2n+0){ margin:30px 0 0 0;}
#work-section h3 { margin:0;}
#work-section p { font-size:14px; line-height:20px; margin:5px 0 0 0;}
#best-section .left{ width:100%; float:none; text-align:center}
#best-section .right{ display:none;}
#footer-top .left{ width:100%; float:none; text-align:center;}
#footer-top .right{ width:100%; float:none; font-size:32px; text-align:center; margin:15px 0 0 0;}
#footer-sec .footer-box1{ width:45%; float:left; margin:60px 10% 0 0; padding:0 0 0 0; }
#footer-sec .footer-box1 img{ width:60%; }
#footer-sec .footer-box2{ width:45%; float:left; margin:60px 0 0 0; }
#footer-sec .footer-box3{ width:45%; float:left; margin:30px 10% 0 0; }
#footer-sec .footer-box4{ width:45%; float:left; margin:30px 0 0 0; }
#footer-copyright .left{width:100%; float:none; text-align:center;}
#footer-copyright .right{width:100%; float:none; text-align:center;}

#about-wrap{ text-align:center; }
#about-wrap .left{ float:none; width:80%; margin:0 auto;}
#about-wrap .right{ float:none; width:100%; margin:30px auto 0 auto;}

#services-wrap{ text-align:center;}
#services-wrap .left{width:100%; float:none; background:#fff;}
#services-wrap .right{width:100%; float:none; background:#fff;}
#services-wrap .left img, #services-wrap .right img{width:50%; margin:0 auto;}

#quapack-wrap{ text-align:center;}
#quapack-wrap .left{width:75%; float:none; margin:0 auto;}
#quapack-wrap .right{width:100%; float:none; margin:40px 0 0 0;}

#enquiry-wrap p{ padding:0;}
.enquiry-form{ padding:0;}

#contact-wrap .left{ float:none; width:100%;}
.google-maps{ padding:20%;}
#contact-wrap .right{ float:none; width:100%; margin:30px 0 0 0;}
#contact-wrap .text{ float:left;}
#contact-wrap2 h1{ font-size:32px;}
#contact-wrap h2{ font-size:20px; margin:10px 0 0 0;}
#contact-wrap p br{ display:none;}
#contact-wrap2 li{width:49%; min-height: 170px;}
#contact-wrap2 li:nth-child(2n+0){margin: 30px 0 0 0;}
.cap-input { float: right;margin-top: 20px;width: 286px !important}
}

@media screen and (max-width: 640px) {
#header .top-bar .call{ float:none; font-size:14px; margin:0 0 0 0; text-align:center; }
#header .top-bar .mail{ float:none; font-size:15px; text-align:center; }
#banner-bottom h1{ font-size:22px;}
#services-section h3{font-size:20px;}
#work-section ul{ padding:0 50px;}
#work-section ul li{ width:100%; float:none; margin:30px 0 0 0; }
#work-section ul li img{width:15%;}
#best-section ul{ padding:0 50px;}
#best-section ul li{ width:100%; float:none; margin:30px 0 0 0; }
#best-section ul li img{width:15%;}
#footer-top h2{ font-size:32px;}
#footer-top p { font-size:16px; line-height:16px;}
#footer-sec .footer-box1 img{ width:60%; }

#services-wrap .left img, #services-wrap .right img{width:75%; margin:0 auto;}

#testimonials-wrap ul li{ width:100%; float:none; background:#f7f7f7; margin:40px 0 0 0;}
#enquiry-wrap p{ font-size:14px; line-height:22px;}

}

@media screen and (max-width: 480px) {
#about-section h1{font-size:30px;}
#services-section h2{font-size:30px;}
#services-section ul li{ width:80%; float:none; margin:30px auto 0 auto; padding:0px;}
#services-section ul li:nth-child(3n+0){ margin:30px auto 0 auto;}
#services-section ul li:nth-child(2n+0){ margin:30px auto 0 auto;}
#work-section h2{font-size:30px;}
#best-section h2{font-size:30px;}
#clients-section h2{font-size:30px;}
#footer-top h2{font-size:28px;}
#footer-top p{font-size:18px; line-height:22px;}
#footer-top .right{font-size:30px;}
#footer-sec .footer-box1{ width:100%; float:none; margin:0 0 0 0; padding:60px 0 0 0; }
#footer-sec .footer-box1 img{ width:60%; }
#footer-sec .footer-box2{ width:100%; float:none; margin:30px 0 0 0; }
#footer-sec .footer-box3{ width:100%; float:none; margin:30px 0 0 0; }
#footer-sec .footer-box4{ width:100%; float:none; margin:30px 0 0 0; }

#breadcrumb-area .breadcrumb-title{ float:none; width:100%;}
#breadcrumb-area .page-breadcrumb{ float:none; width:100%; margin:10px 0 0 0;}
#about-wrap h1{ font-size:30px; margin:0 0 0 0;}
#about-wrap2 h1{ font-size:30px;}

.enquiry-form span{width:100%; float:none; margin:10px 0 0 0; display:block;}
#enquiry-wrap h1{ font-size:30px;}
.google-maps{ padding:25%;}
#contact-wrap2 li{width:100%; float:none; margin:20px 0 0 0; min-height:150x;}
#contact-wrap2 h1 {font-size:30px;}
.cap-input {
    float: right;
    margin-top: 20px;
    width: 340px !important;
}

}

@media screen and (max-width: 360px) {
#header .top-bar .call{font-size:12px;}
#header .top-bar .mail{font-size:12px;}
#banner-bottom h1{font-size:20px;}
#about-section h1{font-size:26px;}
#services-section h2{font-size:26px;}
#services-section ul li{ width:100%; }
#work-section h2{font-size:26px;}
#best-section h2{font-size:26px;}
#clients-section h2{font-size:26px;}
#work-section ul{ padding:0;}
#best-section ul{ padding:0;}

#about-wrap h1{ font-size:26px; margin:0 0 0 0;}
#about-wrap2 h1{ font-size:26px;}

#services-wrap .left img, #services-wrap .right img{width:90%; margin:0 auto;}
#services-wrap .text{ padding:30px 0px;}

#quapack-wrap .left{width:100%; float:none; margin:0 auto;}

#breadcrumb-area .overlay{padding: 50px 0;}
#breadcrumb-area .breadcrumb-title h1{ font-size:30px;}

#enquiry-wrap h1{ font-size:26px;}
#contact-wrap .icon{ float:none; margin:0 auto;}
#contact-wrap .text{ width:100%; float:none; text-align:center; margin:5px 0 0 0;}
#contact-wrap2 h1 {font-size:26px;}
.cap-left{width:100%;float:left;}
.leftmore{width:100%;float:left;}
.cap-right{width:100%;float:left;}
.cap-image { vertical-align: middle; margin-top:0;}
.cap-input {
    float: right;
    margin-top: 20px;
    width: 304px !important;
}
}

@media screen and (max-width: 320px) {
#header .top-bar .call{font-size:11px;}
#header .top-bar .mail{font-size:11px;}
#work-section h2{font-size:16px;}

}