@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/footer.png) no-repeat bottom center, url(../images/background.jpg) repeat-y top center; background-color:#138ade; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#426b81  }

#wrapper {margin:0 auto}

#wrapper-inner { margin:60px auto 0 auto;
background:#fff;
-webkit-border-radius:50px;
-moz-border-radius:50px;
border-radius:50px;
behavior: url(pie/PIE.htc);
-webkit-box-shadow: 2px 2px 5px #2557bb;
-moz-box-shadow: 2px 2px 5px #2557bb;
box-shadow: 2px 2px 5px #2557bb;
padding:1px 0;
}

#inner { width:92.5%; margin:0 auto; background:url(../images/inner.jpg) repeat;
margin:20px auto; 
-webkit-border-radius:50px;
-moz-border-radius:50px;
border-radius:50px;
behavior: url(pie/PIE.htc);
border:4px solid #e9f8ff;
-webkit-box-shadow: 2px 2px 2px #b4b4b4;
-moz-box-shadow: 2px 2px 2px #b4b4b4;
box-shadow: 2px 2px 2px #b4b4b4;
padding:20px 0;
position:relative;
padding:20px 0 225px 2%;
}

#inner .header {width:98%; max-width:1091px; margin:0 auto;   position:absolute; z-index:1; }

#header {width:100%; height:500px; position:relative; z-index:2}

.left-header {width:60%; position:relative; z-index:3; float:left; text-align:center; padding:20px 0 0 2% }

.right-header {width:30%; position:relative; z-index:4; float:right; text-align:center; padding:80px 5% 0 0}

#header .logo {width:100%; max-width:525px;}

#header .phone {width:100%; max-width:222px;}

#header .estimate {width:100%; max-width:230px;}

#header .serving {margin-top:-20px; width:100%; max-width:260px}

.right-header p img {margin:0 2px;}

.right-header .apsp {margin-top:0}

.header-gallery {width:95%; margin:0 auto; text-align:center; padding:20px 0 0 0 }

.header-gallery img {margin:0 1%; width:22%; max-width:221px}

#boxes {width:93%; height:300px;  margin:-230px auto 0 auto; position:relative; z-index:5}

.box {width:29.2%; padding:0 1% 20px 1%; background:#e7f0f5; float:left; border:3px solid #fff; margin-right:2%;
-webkit-border-radius:15px;
-moz-border-radius:15px;
border-radius:15px;
behavior: url(pie/PIE.htc);
-webkit-box-shadow: inset 2px 2px 2px #999, inset -2px -2px 2px #999, 2px 2px 2px #606060;
-moz-box-shadow: inset 2px 2px 2px #999, inset -2px -2px 2px #999, 2px 2px 2px #606060;
box-shadow:inset 2px 2px 2px #999, inset -2px -2px 2px #999, 2px 2px 2px #606060;
min-height:710px
}

.box img {width:100%; max-width:330px; margin:30px 0 0 0}

.box + .box + .box {float:left; margin-right:0}

.box + .box + .box img {max-width:200px}

.box p {font-size:18px; padding:10px; line-height:35px; color:#426b81}

.box h4 {text-align:center; font-size:18px; text-transform:uppercase; color:#005d9d; padding:20px 0 0 0}

.box .phone1 {margin:0 auto; display:block; width:80%; max-width:222px}

.box h5 {font-size:13px; color:#3d4346; text-align:center; padding:0}

.box h6 {font-size:15px; color:#228ec7; text-transform:uppercase; text-align:center; padding:15px 0 0 0}


.box h3 {font-size:18px; color:#228ec7; text-transform:uppercase; text-align:left; padding:15px 0 0 45px}



.box + .box ul li {font-size:15px; font-weight:bold; font-size:14px; color:#426b81; background:url(../images/bullets1.png) no-repeat left 6px; padding:4px 0 4px 45px; margin:3px 0 0 0; list-style-type:none}

.box ul li:first-child {font-size:18px; color:#228ec7; text-transform:uppercase; text-align:left; padding:15px 0 0 45px; list-style-type:none; background:none}

.box label span {float:left; clear:left; font-size:14px; text-transform:uppercase; margin:15px 0 0 0; color:#00334e}

.box textarea {float:left; clear:left; font-size:13px; font-family:Arial, Helvetica, sans-serif; background:#005d9d; border:1px solid #8296a3;
margin:3px 0 0 0;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
behavior: url(pie/PIE.htc);
width:96%; padding:1%;
border:1px solid #000;
height:80px; color:#fff; font-family:Arial, Helvetica, sans-serif; font-size:13px;
}

.box input {float:left; clear:left; font-size:13px; font-family:Arial, Helvetica, sans-serif; background:#005d9d; border:1px solid #8296a3;
margin:3px 0 0 0;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
behavior: url(pie/PIE.htc);
width:96%; padding:1%;
border:1px solid #000;
font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#fff
}

.box .submit {width:132px; height:34px; background:none; border:none; padding:0; margin:10px 0 0 0}

.box .code {margin:10px 0 0 0}

#bottom { margin:30px auto 0 auto;
background:#fff;
-webkit-border-radius:50px;
-moz-border-radius:50px;
border-radius:50px;
behavior: url(pie/PIE.htc);
-webkit-box-shadow: 2px 2px 5px #2557bb;
-moz-box-shadow: 2px 2px 5px #2557bb;
box-shadow: 2px 2px 5px #2557bb;
padding:1px 0;
}

#bottom-inner { width:92.5%; margin:0 auto; background:url(../images/inner.jpg) repeat;
margin:20px auto; 
-webkit-border-radius:50px;
-moz-border-radius:50px;
border-radius:50px;
behavior: url(pie/PIE.htc);
border:4px solid #e9f8ff;
-webkit-box-shadow: 2px 2px 2px #b4b4b4;
-moz-box-shadow: 2px 2px 2px #b4b4b4;
box-shadow: 2px 2px 2px #b4b4b4;
padding:20px 0;
position:relative;
padding:20px 0 20px 2%;
}

.banner {float:right; width:32%;  margin-right:1%; margin-top:15px }

.banner img {width:100%}

.view-full-site {float:right; width:32%;   margin-right:2%; margin-top:15px}

.view-full-site img {width:100%}

#gallery {padding:20px 0 0 0; }

#gallery img {margin:0 0.6%; width:23%; max-width:266px;}

#footer {color:#acd7f4; padding:0 0 20px 0}

.footer-left {width:60%; float:left; padding:0 2.2% 0 2.8%}

.footer-right {width:30%; float:right; padding:0 2.8% 0 2.2%}

#footer p {font-size:11px; padding:20px 0 0 0}

#footer h1 {font-size:11px; font-weight:100; padding:5px 0 0 0; line-height:16px;}

#footer h6 {float:right; font-size:11px; font-weight:100; padding:20px 0 0 0}

#footer h6 img {margin:5px 0 0 0}

#footer h6 a {color:#fff}




/* 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:95%; min-width:240px}
}

/* Header */
.call {display:none}
@media all and (min-width:0px) and (max-width:520px) {
.call {display:block; margin-bottom:20px}
#inner .header {display:none}
.call img {width:70%; max-width:233px}
.left-header {width:100%; position:relative; z-index:3; float:none; text-align:center; padding:0px 0 0 0; text-align:center }
.right-header {width:100%; position:relative; z-index:4; float:none; text-align:center; padding:0 0 0 0; text-align:center}
#header .logo {width:100%; max-width:525px;}
#header .phone {width:60%; max-width:222px;}
#header .estimate {width:60%; max-width:230px;}
#header .serving {margin-top:0;}
#inner {margin-top:5px; margin-bottom:5px}
#bottom-inner {margin:5px auto}
#gallery img {margin:0 0.6%; width:22%}
.banner {float:none; width:100%;  margin-right:0; margin-top:35px }
.view-full-site {float:none; width:100%;   margin-right:0; margin-top:15px}
.clear1 {clear:both}
.banner img {width:100%; max-width:364px;}
.view-full-site img {width:100%; max-width:364px}
#gallery {padding-bottom:30px; width:100%;}
#gallery img {float:left; width:45%; margin:10px 2% 0 2%}
.header-gallery {margin-top:-20px}
.header-gallery img {width:47%; margin:10px 1% 0 1%}
#inner {padding-bottom:400px}
}

/* BOXES */

@media all and (min-width:720px) and (max-width:780px) {
.header-gallery {margin-top:-20px}
}



@media all and (min-width:1050px) and (max-width:1220px) {
#boxes {margin:-250px auto 0 auto;}
}

@media all and (min-width:981px) and (max-width:1049px) {
#boxes {margin:-280px auto 0 auto;}
}

@media all and (min-width:950px) and (max-width:980px) {
#boxes {margin:-140px auto 0 auto;}
}

@media all and (min-width:900px) and (max-width:949px) {
#boxes {margin:-160px auto 0 auto;}
}

@media all and (min-width:850px) and (max-width:899px) {
#boxes {margin:-170px auto 0 auto;}
}

@media all and (min-width:800px) and (max-width:849px) {
#boxes {margin:-180px auto 0 auto;}
}

@media all and (min-width:720px) and (max-width:799px) {
#boxes {margin:-190px auto 0 auto;}
}

@media all and (min-width:680px) and (max-width:719px) {
#boxes {margin:-215px auto 0 auto;}
}

@media all and (min-width:601px) and (max-width:679px) {
#boxes {margin:-255px auto 0 auto;}
}

@media all and (min-width:521px) and (max-width:600px) {
#boxes {margin:-295px auto 0 auto;}
}

@media all and (min-width:470px) and (max-width:520px) {
#boxes {margin-top:-150px}
}

@media all and (min-width:430px) and (max-width:469px) {
#boxes {margin-top:-190px}
}

@media all and (min-width:380px) and (max-width:429px) {
#boxes {margin-top:-230px}
}

@media all and (min-width:350px) and (max-width:379px) {
#boxes {margin-top:-260px}
}

@media all and (min-width:310px) and (max-width:349px) {
#boxes {margin-top:-330px}
}

@media all and (min-width:240px) and (max-width:309px) {
#boxes {margin-top:-390px}
}





@media all and (min-width:0) and (max-width:980px) {
.box {width:89%; float:none; margin:20px auto 0 auto; padding-left:3%; padding-right:3% ;min-height:inherit}
.box + .box + .box {float:none; margin:20px auto 0 auto}
#gallery {margin:30px 0 0 0}
}
@media all and (min-width:521px) and (max-width:980px) {
#inner {padding:20px 0 75px 2%;}
}

/* BANNER */

/*@media all and (min-width:0) and (max-width:1150px) {
.box p {font-size:13px; line-height:auto}
.box ul li {background:url(../images/bullets.png) no-repeat; list-style-type:none; margin:7px 0 0 0; padding:0 0 0 22px; font-size:13px; line-height:14px}
.box + .box ul li {font-size:12px; font-weight:bold; font-size:12px; color:#426b81; background:url(../images/bullets1.png) no-repeat left 2px; padding:4px 0 4px 25px; margin:6px 0 0 0; line-height:14px}
}*/

@media all and (min-width:521px) and (max-width:980px) {
.clear1 {clear:both}
.banner {float:left; width:45%;  margin-right:0; margin-top:35px;  margin-left:0; margin-right:5%; text-align:center }

.banner img {width:100%; max-width:364px;}

.view-full-site {float:left; width:45%;   margin-right:0; margin-top:35px; text-align:center }

.view-full-site img {width:100%; max-width:364px}
}

/* footer */

@media all and (min-width:0) and (max-width:980px) {
.footer-left {width:100%; float:none; margin:0; padding:0; }
.footer-right {width:100%; float:none; margin:0; padding:0}
#footer {width:100%; text-align:center}
#footer h6 {float:none}
}
@media all and (min-width:0) and (max-width:980px) {
.box p {float:left; width:45%}
.box img {float:right; margin:20px 0 0 0; width:50%; max-width:330px}
.box ul {float:left; width:50%;}
.box ul + ul + ul {clear:left}
.box .off {margin-top:-40px; max-width:330px}
}

@media all and (min-width:0) and (max-width:600px) {
.box p {width:100%; float:none;}
.box img {width:100%; float:none}
.box .off {margin-top:20px; max-width:330px; width:45%}
}

@media all and (min-width:600px) and (max-width:780px) {
.box p {font-size:14px; line-height:25px; padding-top:20px}
}

@media all and (min-width:0) and (max-width:500px) {
.box ul {float:none; width:100%;}
.box ul + ul + ul {clear:none}
.box .off {margin-top:20px; max-width:330px; width:100%}
}









