@charset "utf-8";
/* CSS Document */

body, h1, h2, h3, h4, h5, h6, p, ul, li, a, img, form, input, textarea {margin:0; padding:0;}

img, textarea {border:none;}

a {text-decoration:none;}

.clear {clear:both;}

html {-webkit-text-size-adjust:none;}

body {background:url(../images/background.jpg) repeat; font-family:Arial, Helvetica, sans-serif}

#wrapper {background:#f0f0f0; margin:30px auto; padding:13px 1%; max-width:1170px; width:98%}

#header {width:100%; height:auto; background: url(../images/header.jpg) no-repeat top center; }

.top-header {width:100%; text-align:center; padding:20px 0}

.top-header .logo {display:block; margin:0 auto; width:80%; max-width:311px;}

.top-header .social {margin:5px 0 0 0}

.top-header .social img {margin:0 5px;}

.header-text img {display:block; margin:5px auto 0 auto}

.header-text .residential {width:100%; max-width:535px}

.header-text .offer {width:100%; max-width:500px}

.header-text .free-estimates {width:100%; max-width:309px}

.header-text .phone {width:100%; max-width:250px}

.quick-form {float:left; width:31.4%; padding:10px 0.8% 20px 0.8%; max-width:366px; background:rgba(255,222,55,0.8); border:3px solid #fff}

.quick-form h2 {font-size:18px; color:#454130; text-transform:uppercase; text-align:center; font-weight:100; padding:5px 0 0 0}

.quick-form label span {float:left; clear:left; color:#2f2e2e; font-size:14px; text-transform:uppercase; padding:10px 0 0 0}

.quick-form input, .quick-form textarea {float:left; clear:left; width:96%; border:1px solid #a7a5a5; padding:0.3em 2%; font-size:13px; font-family:Arial, Helvetica, sans-serif; margin:5px 0 0 0;
background: #fff;  
}

.quick-form textarea {height:80px}

.quick-form .submit {width:180px; height:47px; padding:0; border:0; background:none; margin:20px 0 0 0 }

.quick-form .code {margin:20px 0 0 0}

.main-content {width:66.6%;  float:left; }

.coupons {width:100%; margin:37px 0 0 0}

.coupons img {float:left; width:50%; max-width:389px;}

.coupons p {background:#000; color:#fff; font-size:15px; font-weight:bold; text-align:center; padding:21px 2%}

.content {padding:0 0 0 2%; background:#f0f0f0; float:left}

.content h3 {color:#454130; font-size:20px; text-transform:uppercase; padding:20px 0 0 0; font-weight:100}

.content p {font-size:16px; color:#514d4c; line-height:24px; padding:15px 0 0 0}

.content img {float:right; margin:10px 0 0 10px}

.content .view-full-site {float:none; margin:15px 0 0 0}


#services {
background:#cdcbbf;
width:96%; padding:0 2%; padding-bottom:20px; margin:20px 0 0 0
}

#gallery {
margin:10px 0 0 0;
background:#ffde39;
width:96%; padding:0 2%; padding-bottom:20px; padding-top:20px;
}

#gallery img {float:left; width:24%; max-width:271px; margin-right:1.2%}

#gallery img + img + img + img {margin-right:0}

#services h2 {font-size:20px; color:#454130; padding:15px 0 0 0}

#services ul {float:left; width:18%; padding:0 2% 0 0; margin:15px 0 0 0}

#services ul li {list-style-type:none; font-size:18px; color:#454130; background:url(../images/points.png) no-repeat 0 5px; padding:7px 0 4px 35px; margin:10px 0 0 0}

#services img {float:right; clear:right; width:40%; max-width:386px; margin-top:25px;}

#services img + img {margin-top:5px}

#footer {background:#82817e; width:96%; padding:20px 2%; font-size:11px; color:#fff;  margin:15px 0 0 0}

#footer h1 {font-size:11px; font-weight:100; padding:5px 0 0 0; line-height:18px}

#footer p { line-height:20px;}

#footer h6 {font-size:11px; font-weight:100}

#footer img {margin:7px 0 0 0}

.left-footer {width:65%; padding-right:5%; float:left}

.right-footer {width:30%; float:left}

#footer a {color:#ffe149}

#footer a:hover {color:#ffee97}

/* WRAPPER */


@media all and (min-width:0px) and (max-width:1024px) {
#wrapper {width:95%}
}

@media all and (min-width:0px) and (max-width:1100px) {
.right-content ul li {font-weight:100; font-size:13px}
}

@media all and (min-width:0px) and (max-width:1100px) {
.right-content ul {float:none; width:90%}
}

@media all and (max-width:240px) {
#wrapper {min-width:240px;}
}

@media all and (min-width:0px) and (max-width:980px) {
.right-header h2 {font-size:12px; font-weight:bold}
.right-header-int {padding-bottom:20px}
.right-header label span {font-size:11px; padding:5px 0 0 0}
.right-header input, .right-header textarea {margin:2px 0 0 0}

}

@media all and (min-width:0px) and (max-width:780px) {
.left-header {width:100%; float:none; padding-top:5px;}
.left-header .logo {margin-top:0}
.right-header {width:98.5%; float:none; max-width:780px;}
#wrapper {padding-top:5px; padding-bottom:5px}
.right-header h2 {font-size:16px; font-weight:bold}
/*#services ul li {font-size:13px; font-weight:100}
#services h2 {font-size:18px}*/
#services img {float:left; clear:left; width:50%;}
#services ul {width:30%}
#services img + img {margin-top:25px; clear:none}
.left-content {float:none; width:98%; border-right:none; padding-top:20px; margin-top:0}
.right-content {float:none; width:98%}
}

.bullets-mobile {display:none}
.call {display:none}
@media all and (min-width:0px) and (max-width:500px) {
.bullets {display:none;}
.bullets-mobile {display:block; margin:15px auto 0 auto; width:90%; max-width:377px}
.right-header label span {font-size:13px;}
.call {display:block}
.call img {width:100%; max-width:320px; display:block; margin:5px auto 0 auto}
#header {background-color:#52514f}
.right-header {margin-top:20px}
}

@media all and (min-width:0px) and (max-width:380px) {
.left-header .logo {width:95%}
.left-header .social img {width:10%; max-width:55px;}
}

@media all and (min-width:0px) and (max-width:880px) {
#content img {float:none; margin:10px 0 0 0; width:90%}
#content p {padding-left:3%; padding-right:3%}
#coupons img {float:none; width:90%; margin:10px auto 0 auto; display:block}
#coupons img + img {float:none; margin-right:auto;}
#coupons img + img + img {margin-right:auto; float:none}
}

@media all and (min-width:0px) and (max-width:500px) {
.content .img {margin:20px auto 0 auto; display:block; float:none}
.content h3 {text-align:center;}
.content .view-full-site {margin:15px auto 0 auto}
.coupons {margin:0}
.coupons img {float:none; width:100%; max-width:389px; display:block; margin:0 auto}
.coupons p {font-size:12px; font-weight:100}
}

@media all and (min-width:0px) and (max-width:580px) {
#wrapper {margin-top:10px;margin-bottom:10px}
#content {width:98%; float:none}
#coupons {width:99%; float:none; margin-left:0; margin-top:10px}
}

@media all and (min-width:0px) and (max-width:600px) {
#services ul {width:96%; margin:0 }
#services ul li {font-size:18px;}
#services ul li {background:url(../images/points.png) no-repeat 0 7px;}
#services img {width:100%}
#services img + img {clear:left;}
#gallery {padding-top:5px; padding-bottom:10px}
#gallery img {width:48%; margin:10px 1% 0 1%}
#gallery img:nth-child(2n) {float:right}
#gallery img + img + img + img {margin-right:1%}
}

@media all and (min-width:0px) and (max-width:400px) {
#services ul {width:96%; margin:0 }
#services ul li {font-size:15px;}
#services ul li {background:url(../images/points.png) no-repeat 0 4px;}
#gallery img {width:100%; margin:10px auto 0 auto; float:none; display:block}
#gallery img:nth-child(2n) {float:none}
#gallery img + img + img + img {margin-right:auto}
}

@media all and (min-width:0px) and (max-width:980px) {
#footer {text-align:center}
.left-footer {width:100%; padding-right:0; float:none}
.right-footer {width:100%; float:none}
#footer h6 {padding-top:15px}
}

@media all and (min-width:0px) and (max-width:1300px) {
.main-content {width:66%;}
}

@media all and (min-width:0px) and (max-width:900px) {
.content h3 {color:#454130; font-size:16px; text-transform:uppercase; padding:20px 0 0 0; font-weight:bold}

.content p {font-size:12px; color:#514d4c; line-height:20px; padding:10px 0 0 0}

.content .img {width:50%; max-width:236px; margin-bottom:10px;}
}

@media all and (min-width:0px) and (max-width:700px) {
.quick-form {width:98%; float:none; max-width:700px;}
.main-content {width:100%; float:none}
}

@media all and (min-width:0px) and (max-width:700px) {
.quick-form {width:97%;}
.content img {float:none; margin:10px 0 0 0}
}