*, :after, :before { margin: 0; padding: 0; box-sizing: border-box }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline }
:focus { outline: 0 }
body { line-height: 1; color: #000; background: #fff }
ol, ul { list-style: none }
table { border-collapse: separate; border-spacing: 0 }
caption, th, td { text-align: left; font-weight: 400 }
blockquote:before, blockquote:after, q:before, q:after { content: "" }
blockquote, q { quotes: "" "" }
* { margin: 0; padding: 0 }
body { color: #86878b; font-size: 62.5%; font-family: Helvetica, Arial, sans-serif; line-height: 150%; text-align: center; margin: 0; padding: 0 }
h1 { color: #4f5050; font-size: 2.7em; font-family: Helvetica; line-height: 1.1em; margin-bottom: 10px; letter-spacing: -1px }
h2 { color: #37b34a; font-size: 1.7em; font-family: Helvetica; line-height: 1em; margin-bottom: 20px; font-weight: 700 }
h3 { color: #2d81ba; font-size: 1.6em; font-family: Helvetica; line-height: 1em; margin-bottom: 5px; letter-spacing: -1px }
h4 { color: #4f5050; font-size: 1.4em; font-family: Helvetica; line-height: .7em; margin-bottom: 5px; letter-spacing: -1px; padding-top: 5px }
a { text-decoration: none; color: #8BC53F }
a:hover { color: #0390f0 }
p { font-size: 1.4em; line-height: 1.9em; padding-bottom: 15px }
li { font-size: 1.3em; line-height: 1.6em; padding-bottom: 3px }
li.end { margin-bottom: 15px }
strong { font-weight: 700 }
em { font-style: italic }
p.intro { font-size: 1.5em; line-height: 1.7em }
p.end { margin-bottom: 25px }
p.title { font-size: 1.5em; color: #37b34a; font-weight: 700; margin-bottom: 5px; padding-bottom: 0 }
span.green { color: #37b34a }
span.lime { color: #8BC53F }
.clear { clear: both }
img.leftpic { float: left; margin-right: 25px; padding-bottom: 15px }
img.rightpic { float: right; margin-left: 25px; padding-bottom: 15px }
img.fullwidth { margin-top: 15px }
.tbl { display: table; width: 100% }
.tr { display: table-row }
.td { display: table-cell }
.th { display: table-cell }
.container-fluid { width: 100% }
div.container { margin: 0 auto; text-align: left; width: 100%; max-width: 960px; border-style: solid; border-width: 0; position: relative }
div#pageholder { width: 100%; display: block }
div#pageholder .tbl { width: 100%; padding: 50px 0 }
div#header { height: auto; width: 100%; position: relative }
div#header div#header_content { background: #f2f2f2 url(../images/bg.jpg) repeat-x left bottom }
div#header div#header_content div#menu { background: #000 }
#menu a.menu-btn { display: none }
div#header div#header_content div#menu ul { float: right }
div#header div#header_content div#menu ul li { float: left; font-weight: 700; margin: 0; padding: 0; line-height: inherit; font-size:12px; line-height:14px; }
div#header div#header_content div#menu ul li a { color: #fff; background-color: #000; padding: 10px 15px; display: block }
div#header div#header_content div#menu ul li a.current { background-color: #8bc53f }
div#header div#header_content div#menu ul li a:hover { background-color: #60882c; text-decoration:none; }
div#header div#header_content div#logo a { float: left; background-image: url(../images/logo.png); background-repeat: no-repeat; width: 240px; height: 130px; margin-top: 40px; behavior: url(scripts/PIE/PIE.htc); -pie-png-fix: true }
div#header div#header_content div#strapline { float: right; background-image: url(../images/strapline.png); background-repeat: no-repeat; width: 325px; height: 91px; margin-top: 70px; behavior: url(scripts/PIE/PIE.htc); -pie-png-fix: true }
.flexslider .slides > li { position: relative }
.flexslider .slides > li .overlay { position: absolute; bottom: 0; left: 30px; padding: 15px; width: 455px; background-color: rgba(0,0,0,0.5); z-index: 2 }
.flexslider .slides > li .overlay p { color: #fff; font-weight: 300; font-size: 22px; line-height: 1.4; font-family: lato, "pragmatica-web", helvetica, arial, sans-serif; text-align: left }
.flexslider .slides > li .overlay p span { color: #FFF200 }
.flexslider .slides > li .overlay p strong { font-weight: 400 }
.flexslider .slides > li .overlay p.small { font-size: 1.3em }
div#slides img.hide { display: none }
#nav { z-index: 50; position: absolute; bottom: 10px; right: 20px }
#nav a { padding: 13px; background-image: url(../images/slide_btn.png); background-repeat: no-repeat; display: block; float: left; text-indent: -999em; behavior: url(scripts/PIE/PIE.htc); -pie-png-fix: true }
#nav a.activeSlide { background-image: url(../images/slide_current.png); behavior: url(scripts/PIE/PIE.htc); -pie-png-fix: true }
#nav a:focus { outline: none }
.logo-wrap .td { vertical-align: top; width: 50%; padding: 20px 0 }
.logo-wrap .logo { text-align: left }
.logo-wrap .strapline { text-align: right }
.logo-wrap .strapline a { display: inline-block; margin-bottom: 10px }
div#main { float: none; padding: 0 72px 0 0; vertical-align: top }
ul.bullets { margin-bottom: 20px; float: left }
ul.bullets li { font-size: 1.3em; list-style-type: none; background-image: url(../images/bullet_img.jpg); background-repeat: no-repeat; padding: 3px 0 10px 30px; font-weight: 100 }
ul.bullets_narrow { width: 305px; margin-right: 25px }
ul.bullets_square { margin-bottom: 20px; float: left; padding-left: 20px }
ul.bullets_square li { font-size: 1.3em; list-style-type: square; padding: 3px 0 10px 5px }
div#right { float: none; margin-top: 30px; margin-bottom: 40px; vertical-align: top }
div#right h2 { margin-bottom: 10px }
div#right h2 a { color: #8BC53F }
div#btn_commercial { margin-top: 15px }
div#btn_commercial a { background-image: url(../images/commercial_btn.jpg); background-position: 0 0; background-repeat: no-repeat; display: block; width: 226px; height: 85px }
div#btn_commercial a:hover { background-position: -226px 0 }
div#btn_residential { margin-top: 15px }
div#btn_residential a { background-image: url(../images/residential_btn.jpg); background-position: 0 0; background-repeat: no-repeat; display: block; width: 226px; height: 85px }
div#btn_residential a:hover { background-position: -226px 0 }
div#btn_gallery { margin-top: 15px }
div#btn_gallery a { background-image: url(../images/gallery_btn.png); background-position: 0 0; background-repeat: no-repeat; display: block; width: 226px; height: 85px }
div#btn_gallery a:hover { background-position: -226px 0 }
div#footer { clear: both; text-align: left; height: 150px; background-color: #f1f1f2; clear: both; overflow: hidden; margin-top: 30px }
div#footer div#footer_content { width: 100%; text-align: left; padding: 20px 0; margin: 0 auto }
div#footer div#footer_content ul li, a { color: #bbbdbf }
div#footer div#footer_content ul li.margin { margin-bottom: 10px }
div.clear { clear: both }
li.clear { clear: both }
div#gallery { float: left; margin-bottom: 20px; margin-top: 10px; padding: 10px 0 10px 20px; background-color: #f5f3f3 }
div#gallery ul { width: 208px; overflow: hidden }
div#gallery ul li { float: left; width: 80px; height: 80px; list-style-type: none; margin-bottom: 20px; margin-right: 20px }
div#gallery ul li a { text-decoration: none }
div#gallery ul li.right { margin-right: 0 }
div#gallery ul li img { height: 80px; border: 3px #fff solid; -moz-box-shadow: 0 0 6px #888; -webkit-box-shadow: 0 0 6px #888; box-shadow: 0 0 6px #888; behavior: url(scripts/PIE/PIE.htc) }
div#gallery ul li p { margin-bottom: 0; font-size: 1.1em }
#jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px }
#jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0 }
#jquery-lightbox a img { border: none }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; min-height: 200px; margin: 0 auto; max-width: 90%!important; height: auto!important }
#lightbox-container-image { padding: 10px; width: 100% }
#lightbox-container-image img { width: 100%; height: auto }
#lightbox-loading { position: absolute; top: 40%; left: 0; height: 25%; width: 100%; text-align: center; line-height: 0 }
#lightbox-loading img { width: auto; height: auto }
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10 }
#lightbox-container-image-box > #lightbox-nav { left: 0 }
#lightbox-nav a { outline: none }
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block }
#lightbox-nav-btnPrev { left: 0; float: left }
#lightbox-nav-btnNext { right: 0; float: right }
#lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: auto!important; padding: 0 10px; max-width: 350px }
#lightbox-container-image-data { padding: 0 10px; color: #666 }
#lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left }
#lightbox-image-details-caption { font-weight: 700; font-size: 1.7em }
#lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1em }
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: .7em }
.group:before, .group:after { content: ""; display: table }
.group:after { clear: both }
.group { zoom: 1 }
.gallery-page { border-spacing: 10px }
div.gallery-container { margin: 0; float: none; width: 50%; padding: 15px; background-color: #f5f3f3 }
div.gallery-container.end { margin-right: 0 }
div.gallery-container h2 { margin-bottom: 5px }
div.gallery-container img { border: 3px solid #fff; display: block; float: left; margin: 0 20px 20px 0; -moz-box-shadow: 0 0 6px #888; -webkit-box-shadow: 0 0 6px #888; box-shadow: 0 0 6px #888 }
div.gallery-container.before-after img { margin: 0 }
div.gallery-container img:hover { opacity: .8 }
div.gallery-container div.gallery-before { width: 297px; float: left }
div.gallery-container div.gallery-after { width: 128px; float: left }
div.gallery-container div.arrow img { box-shadow: none; border: none; text-align: center }
div.gallery-container .th { text-align: center; float: none }
.ab-tbl { display: table; width: auto; margin: 0 auto }
.ab-tbl .td { vertical-align: middle }
#facebook { width: 30px; height: 30px; position: absolute; background-image: url(../images/soc-facebook.png); background-size: 30px 30px; top: 55px; right: 0; z-index: 100 }
#facebook:hover { opacity: .8 }
.starpline-img .mimg { display: none }
.form { padding: 15px 5px; background: #f1f1f2; margin: 15px 0 }
.form h3 { margin-bottom: 10px; padding: 0 7px }
.form h2 { padding: 0 7px; text-align: center; margin: 0 }
.form ul { list-style: none }
.form ul li { float: left; width: 50%; padding: 0 7px 15px }
.form ul li.full { width: 100%; float: left; padding: 0 7px 15px }
.form ul li input, .form ul li textarea { display: block; width: 100%; margin-top: 5px; display: block; width: 100%; margin-top: 5px; resize: none; border: 1px solid #dcdcdd; padding: 7px 10px; font-family: Helvetica, Arial, sans-serif; font-size: 12px }
.form ul li textarea { height: 100px }
.form ul li .btn { background: #37b049; color: #fff; font-size: 16px; font-weight: 700; border: none; cursor: pointer }
.form ul li .btn[disabled] { background: #434343; cursor: wait }
.thank-you { display: none }

@media (max-width: 1023px) {
div.container { padding-left: 15px; padding-right: 15px }
div#header div#header_content div#menu ul li a { padding: 10px }
div#main { padding-right: 15px }
div.gallery-container.before-after a img { display: block; width: 120px; height: auto }
}

@media (max-width: 767px) {
#menu .container { padding-left: 0; padding-right: 0; position: relative }
#menu ul { float: none; width: 100%; position: absolute; top: -600%; z-index: 10; transition: all ease-in-out 500ms }
#menu.active ul { top: 100% }
#menu ul li { float: none; width: 100% }
#menu a.menu-btn { display: block; color: #fff; font-size: 14px; font-weight: 700; text-align: center; padding: 12px 0; background: #000; position: relative; z-index: 11 }
#menu a.menu-btn img { display: inline-block; vertical-align: middle; transition: all ease-in-out 300ms }
#menu.active a.menu-btn img { transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); -webkit-transform: rotate(180deg) }
div#main { padding-right: 0; display: block; width: 100% }
div#right { margin: 0; display: block; width: 100%; text-align: center }
div#btn_commercial, div#btn_residential, div#btn_gallery { display: inline-block; margin: 0 5px 10px }
.flexslider .slides > li .overlay { position: static; width: 100%; height: auto; padding: 15px 15px 30px }
div.gallery-container { display: block; width: 100%; margin-bottom: 15px; text-align: center }
div.gallery-container .ab-tbl { width: auto; margin: 0 auto }
div.gallery-container img { float: none; margin: 0 }
div.gallery-container a { display: inline-block; margin: 0 3px 10px }
div#gallery { width: 100%; padding: 15px }
div#gallery ul { text-align: center; width: 100% }
div#gallery ul li { float: none; display: inline-block; margin: 0 3px 10px }
}

@media (max-width: 639px) {
.logo-wrap .tbl { position: relative }
.logo-wrap .tbl .fb-icon { position: absolute; right: 15px; top: 20px }
.logo-wrap .td { display: block; width: 100%; padding: 0 }
.logo-wrap .td.logo { padding-top: 10px }
.logo-wrap .td.logo img { display: block; width: 100%; height: auto; max-width: 150px }
.logo-wrap .td.strapline { padding: 10px 0 }
.logo-wrap .td.strapline img { display: block; width: 100%; height: auto; max-width: 300px }
div#pageholder .tbl { width: 100%; display: block }
.starpline-img .dimg { display: none }
.starpline-img .mimg { display: block }
div.gallery-container div.arrow { display: none }
div.gallery-container.before-after a img { max-width: 120px; width: 100%; height: auto }
.flexslider .slides > li .overlay p { font-size: 16px }
.flexslider .slides > li .overlay p.small { font-size: 1em }
}