@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;}

/* general */

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

#captcha {text-transform:lowercase}

#wrapper { margin:80px auto 0 auto;}

#top {width:100%; position:relative}

#header {width:68%;float:left; position:relative; text-align:center;  }

#header .header {width:100%; border:7px solid #fff; 
-webkit-box-shadow: 2px 2px 5px #000;
-moz-box-shadow: 2px 2px 5px #000;
box-shadow: 2px 2px 5px #000;
max-width:806px;
position:absolute;
z-index:2;
left:0
}

#header img {position:relative; z-index:3;}

#header .logo {text-align:center; margin:20px auto 0 auto; width:70%; max-width:540px;}

#header .phone {margin:0 0 0 0; max-width:274px; width:35%}

#header .free-estimate {margin:3px 0 0 0; max-width:309px; width:35%}

#header p {margin:20px 0 0 0}

#header p img {border:3px solid #fff;
-webkit-box-shadow: 2px 2px 5px #000;
-moz-box-shadow: 2px 2px 5px #000;
box-shadow: 2px 2px 5px #000;
width:28%; max-width:220px; margin:0 0 0 2.5%
}


#right-header {float:right; width:32%; position:relative; z-index:1}

#right-header p img {margin:0 0 0 2%}

#right-header p {margin-left:20px}

#right-header .licensed {margin:15px 0 0 20px; width:95%; max-width:370px}

#right-header .coupon {margin:10px 0 0 0; width:100%; max-width:382px;
-webkit-box-shadow: 2px 2px 5px #000;
-moz-box-shadow: 2px 2px 5px #000;
box-shadow: 2px 2px 5px #000;
}

#content {width:100%; background:url(../images/content.jpg) repeat;  border:7px solid #fff; max-width:1184px;
-webkit-box-shadow: inset 2px 2px 5px #8c8c8a, inset -2px -2px 5px #8c8c8a, 2px 2px 5px #000;
-moz-box-shadow: inset 2px 2px 5px #8c8c8a, inset -2px -2px 5px #8c8c8a, 2px 2px 5px #000;
box-shadow:inset 2px 2px 5px #8c8c8a, inset -2px -2px 5px #8c8c8a, 2px 2px 5px #000;
margin-top:-30px;
padding-bottom:10px;
}

#left {width:67.8%; float:left;  margin:55px 0 0 1%;
background:rgba(255,255,255,0.59);
}

.left {width:45%; border-right:1px solid #c9c9c9; padding:0 2%; margin:10px 0; float:left}

.left h3 {font-size:16px; color:#d00c1a; line-height:24px}

.left p {font-size:14px; color:#252424; line-height:20px; padding:20px 0 0 0}

.left .images {float:right; margin:20px 0 5px 20px; max-width:192px; width:60%}

.left h5 {font-size:18px; text-transform:uppercase; font-weight:100; padding:15px 0 0 0}

.left h6 {font-size:16px; text-transform:uppercase; font-weight:bold; padding:3px 0 0 0; color:#252424}

.left .phone1 {margin:10px 0; width:100%; max-width:274px; }

.right {width:45%; padding:0 2%; height:300px; float:left; margin:10px 0 0 0}

.right h3 {font-size:18px; color:#d00c1a; font-weight:bold}

.right ul li {background:url(../images/bullet.png) no-repeat; color:#252424; font-size:16px; list-style-type:none; color:#252424; font-weight:bold; padding:3px 0 3px 60px; margin:10px 0 0 0}

.right .view {margin:15px 0 }

#quick-contact {float:right; margin:0 1% 0 0; width:27%; padding:0 1% }

#quick-contact h3 {font-size:18px; color:#d00c1a; font-weight:bold; margin:10px 0 0 0}

#quick-contact label span {float:left; clear:left; color:#2f2e2e; font-size:14px; margin:7px 0 0 0}

#quick-contact input {float:left; clear:left; background:#fff; border:1px solid #a7a5a5; width:98%; font-family:Arial, Helvetica, sans-serif; font-size:14px; padding:1%; margin:3px 0 0 0}

#quick-contact textarea {float:left; clear:left; background:#fff; border:1px solid #a7a5a5; width:98%; font-family:Arial, Helvetica, sans-serif; font-size:14px; padding:1%; height:100px; margin:3px 0 0 0}

#quick-contact .submit {width:118px; height:29px; border:0; background:none; padding:0; margin:15px 0 0 0}

#quick-contact .code {margin:15px 0 0 0}

#quick-contact .code img {width:100%; max-width:200px}

#gallery {background:#e41b24; width:97%; margin:15px auto 0 auto; padding:15px 0 5px 0; padding-left:1%}

#gallery img {margin:0 0 0 0.5%; width:24%; max-width:280px}

#footer {width:100%;  padding-bottom:15px}

#footer p {font-size:11px; color:#d2d2d2; padding:15px 0 0 0}

#footer h1 {font-size:11px; font-weight:100; color:#d2d2d2; padding:15px 0 0 0}

#footer h6 {font-size:11px; font-weight:100; color:#d2d2d2; padding:15px 0 0 0}

#footer .card {margin:10px 0 0 0}

.left-footer {width:39%; float:left; padding-right:1%}

.logos {float:right; width:59%; max-width:664px; margin:15px 0 0 0}


/* WRAPPER */

@media all and (min-width:1025px) {
#wrapper {max-width:1200px; width:90%}
}


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

@media all and (min-width:0px) and (max-width:720px) {
#wrapper {margin-top:20px}
}



/* HEADER */

@media all and (min-width:720px) and (max-width:920px) {
#header .logo {width:65%}
#right-header p img {height:30px}
}

@media all and (min-width:0px) and (max-width:719px) {
#header {width:100%;float:none; position:relative; text-align:center;  }
#header .logo {width:65%}
#header .header {width:100%; border:4px solid #fff;}
#header p {margin-top:15px}
#right-header {padding:30px 0 0 0}
#right-header p img {margin:0 0 0 1%; height:30px}
#right-header p {margin-left:1%; float:left; clear:left; width:48%}
#right-header .licensed {margin:15px 0 0 1%; width:48%; max-width:370px; float:left; clear:left}
#right-header .coupon {margin:10px 0 0 0; width:48%; max-width:382px;
-webkit-box-shadow: 2px 2px 5px #000;
-moz-box-shadow: 2px 2px 5px #000;
box-shadow: 2px 2px 5px #000;
float:right; margin-right:1%; margin-top:-30px
}
}

@media all and (min-width:0px) and (max-width:719px) {
#right-header {float:none; width:100%; position:relative; z-index:1; margin:0;
border:4px solid #fff; border-top:0; border-bottom:0;
-webkit-box-shadow: inset 0px 0px 0px #8c8c8a, inset 0px 0px 0px #8c8c8a, 0px 0px 0px #000;
-moz-box-shadow: inset 0px 0px 0px #8c8c8a, inset 0px 0px 0px #8c8c8a, 0px 0px 0px #000;
box-shadow:inset 0px 0px 0px #8c8c8a, inset 0px 0px 0px #8c8c8a, 0px 0px 0px #000;
background:url(../images/content.jpg) repeat; padding-bottom:20px}
}

#header .call {display:none}
#right-header .licensed-mobile {display:none}
@media all and (min-width:0px) and (max-width:500px) {
#header p {display:none}
#header .header {margin:50px auto 0 auto; width:100%; }
#header .logo {text-align:center; margin:10px auto 0 auto; width:100%; max-width:540px;}
#header .phone {margin:0 0 0 0; max-width:274px; width:70%}
#header .free-estimate {margin:3px 0 0 0; max-width:309px; width:70%}
#header .call {display:block; margin:15px 0 0 0}
#header .call img {width:90%; max-width:233px}
#right-header {padding-top:40px; text-align:center}
#right-header p img {margin:0 0 0 1%; height:auto}
#right-header p {margin-left:1%; float:none; width:100%}
#right-header .licensed {display:none}
#right-header .licensed-mobile {display:block; width:100%; max-width:371px; float:none; margin:20px auto 0 auto}
#right-header .coupon {margin:10px 0 0 0; width:95%; max-width:382px;
-webkit-box-shadow: 2px 2px 5px #000;
-moz-box-shadow: 2px 2px 5px #000;
box-shadow: 2px 2px 5px #000;
float:none; margin-right:1%;
}
#left {background:none; float:none}
.left {width:95%; border-right:0; padding:2%; margin:0 auto; float:none; background:rgba(255,255,255,0.59);}
.left h5, .left h6 {text-align:center}
.left .phone1 {margin:5px auto; display:block}
.right .view {margin:7px auto 0 auto; display:block}
.right {width:95%; border-right:0; padding:2%; margin:10px auto 0 auto; float:none; background:rgba(255,255,255,0.59); height:auto}
#quick-contact {width:95%; border-right:0; padding:2%; margin:10px auto 0 auto; float:none; }
#quick-contact h3 {text-align:center; font-size:14px}
#quick-contact input, #quick-contact textarea {width:97%}
}



/* CONTENT */

@media all and (min-width:980px) and (max-width:1340px) {
#content {width:98.7%; margin-top:-50px}
}
@media all and (min-width:0px) and (max-width:979px) {
#content {width:98.3%; margin-top:-50px}
}
@media all and (min-width:1290px) and (max-width:1320px) {
#left {margin-top:45px}
}

@media all and (min-width:1230px) and (max-width:1289px) {
#left {margin-top:40px}
}

@media all and (min-width:1160px) and (max-width:1229px) {
#left {margin-top:35px}
}

@media all and (min-width:0px) and (max-width:1159px) {
#left {margin-top:30px}
}

@media all and (min-width:501px) and (max-width:979px) {
.left h3 {font-size:14px; color:#d00c1a; line-height:21px}

.left p {font-size:12px; color:#252424; line-height:18px; padding:20px 0 0 0}

.left .images {float:right; margin:20px 0 5px 20px; max-width:192px; width:60%}

.left h5 {font-size:16px; text-transform:uppercase; font-weight:100; padding:15px 0 0 0}

.left h6 {font-size:14px; text-transform:uppercase; font-weight:bold; padding:3px 0 0 0; color:#252424}

.left .phone1 {margin-top:15px; width:100%; max-width:274px; }

.right {width:45%; padding:0 2%; height:auto; float:left; margin:10px 0 0 0}

.right h3 {font-size:16px; color:#d00c1a; font-weight:bold}

.right ul li {background:url(../images/bullet.png) no-repeat; color:#252424; font-size:14px; list-style-type:none; color:#252424; font-weight:bold; padding:4px 0 5px 60px; margin:6px 0 0 0}
}

@media all and (min-width:0) and (max-width:719px) {
#left {width:98%; float:none;  margin:0 0 0 1%; padding-top:30px}
#quick-contact {float:none; margin:0 0 0 1%; width:98%; padding:0 }
}

@media all and (min-width:501px) and (max-width:719px) {
#gallery img {margin:0 0 0 0.5%; width:23.8%; max-width:280px}
}

@media all and (min-width:0px) and (max-width:501px) {
#gallery img {margin:0 0 0 0.5%; width:48.5%; max-width:280px}
}


@media all and (min-width:0px) and (max-width:719px) {
#content {margin:-30px 0 0 0; border:4px solid #fff; border-top:0; width:100%;
-webkit-box-shadow: inset 0px 0px 0px #8c8c8a, inset 0px 0px 0px #8c8c8a, 0px 0px 0px #000;
-moz-box-shadow: inset 0px 0px 0px #8c8c8a, inset 0px 0px 0px #8c8c8a, 0px 0px 0px #000;
box-shadow:inset 0px 0px 0px #8c8c8a, inset 0px 0px 0px #8c8c8a, 0px 0px 0px #000;
}
}

/* FOOTER */
@media all and (min-width:0px) and (max-width:980px) {
#footer {text-align:center; }
.left-footer {width:100%; float:none; text-align:center;}
.logos {float:none; margin:15px auto 0 auto; width:100%}
}



