body > header #logo{background-image:url(/owners/2/images/logo.jpg);color:#fff;}
.slide_1{background-image:url(/images/banners/hero/a420.jpg);}
div#headADD{z-index:1000;}
#about_intro{position:absolute;top:-22230px;left:0;width:50%}
#about_intro h2{text-align:center;padding:0 2%;background:rgba(255,255,255, 1);border-radius:3px;background-clip:padding-box;}
#about_intro p{font-size:1em;left:14%;top:20.5%;padding:2% 4%;background:rgba(255,255,255, .8);color:#000;line-height:1.5}

#hpcLogo{width: 45%;top: 9%;left: 28%;}
#homepage #intro.wrapper p img#gThumb {float: right;margin: .5em;width: 125px;height: 125px;}

div.slide-content span.h3{color: #fff;position: absolute;bottom: 0;left: 0;font-size: .8em;display:none;background: rgba(0,0,0, 0.3);text-shadow: 2px 2px rgba(0, 0, 0, 0.3);padding:10px;border-radius:5px;text-shadow: 2px 2px rgba(0, 0, 0, 0.3);}
#hero #heroContent {margin-left: 0;width: 100%;text-shadow:none;background-color: rgba(255,255,255,.2);}
#hero #heroContent span.h1{margin-left:39%;line-height:1.5;font-size: 1.2em;margin-top:1em;font-family: verdana;font-weight: 700;color:#000}
#hero #heroContent p:first-of-type {background:none;padding:0;width:58%;margin-left:39%;color:#000;font-size:.9em;}
#hero #heroContent p:first-of-type a{color:#000;font-weight:100;text-decoration-color:#000}
#hero #heroContent p:first-of-type a.cta{color:#ffffff;font-weight:700;text-decoration-color:#d50000;padding: .8em .8em;font-size:.9em}
#hero #heroContent{top:0;height:100%;}
#hero #heroContent p {width:59%;}
#hero #heroContent ul {position: relative;color: #fff;text-align: center;font-weight: 700;margin:.5em 0 0 39%;letter-spacing: 1px;font-size: 1.2em;width:56%;display:inline-block;}
#hero #heroContent  ul li {width:33%;margin-bottom:0}
#hero #heroContent ul li img {width:90%;}
#hero #heroContent ul li:first-of-type {font-size: inherit;}
img#fiveStar, img#banYelp{cursor:pointer;}


div#productList div{text-align:center;margin:0 0 60px 0 !important;min-height:230px;}
div#productList div img{width:50%;}
div#productList h3{color:#21418a !important;margin-bottom:-30px  !important;font-size:18px;line-height:1.3 !important;}
div#productList a.napoleonButton{margin-left:80px !important;margin-bottom:35px !important;border:1px solid red;}
div.napoleonProduct{width: 30% !important;float: left;margin: 0 1% 0 0;font-family: "Myriad Pro", "Segoe UI", "Helvetica Neue", Arial, sans-serif;font-size: 14px;text-align: center !important;border: none !important;position: relative;padding: 0px 0px 0 0px !important;color:#21418a !important;}
div.napoleonProduct h4{display:none;}
div.napoleonProduct p{text-align:center !important;padding:0 !important}
div#napoleonProducts h1{color:#21418a !important;}
div.napoleonProduct h3{color:#21418a !important;font-size:14px;}
div.napoleonProduct img{width:50% !important;}
div.napoleonProduct a.napoleonButton{margin-left:80px !important;margin-bottom:20px !important;}
div.mendotaIMG{width:40%;margin:0 15px 50px 0;float:left;}
img.service_image{width:100%;margin-bottom:15px;}
h3.service_sub_header{font-size: 1.75em;border-style: solid;border-width: 0 0 1px 0;margin:3em 0 1em 0;font-size:1.5em;border-color:#d9d9d9;clear:both;}

a.myAddressLink2, a.myAddressLink1:hover {text-decoration-color: #004b88;}
footer a, footer a:hover {color: #ffffff;text-decoration-color: #004b88;}

#survey_form .survey_label{margin:0;float:left;margin-right:10px;padding-top:3px}
#survey_form .survey_button{margin:0 5px 0 0;float:left;border:1px solid red}


div.broadly-review{margin-top:50px !important;padding-bottom:50px !important;border:0 !important}
div.broadly-review-avatar img{width:100px !important;height:100px !important;margin-right:20px;margin-bottom:150px;}
div.broadly-review-body, div.broadly-response-body{font-size:1.2em;}
div.broadly-review-via{float: none;line-height: 1.2em;position: absolute;top: 22px;right: 0;}
div.broadly-review-via img{width:74px;height:24px;}
#ServiceRequest{min-height:1500px;}

#homepage #intro.wrapper p img {float: right;margin: .5em;width: 125px;height: 125px;}

#menu_opener {color: #000;}
#navbar, #navbar nav ul li a {background: #000;}

.svcArea{display:none;}


@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {body > header .estimate > a span:nth-child(2) {font-size: 1em;}}



@media screen and (min-width:375px) {}

@media screen and (min-width:400px) {}

@media screen and (min-width:600px){
.slide_1{background-image:url(/images/banners/hero/a1024.jpg); background-position:-100px 0;}
    #pageBanner2, #pageBanner3 {
        margin-bottom: 30px;
        font-size: 12px;
        display: block;
        float: none;
        line-height: 1;
        text-align: right;
    }

    #pageBanner2 img, #pageBanner3 img {
        width: 100%;
    }

    img#clockcaption {
        float: left;
        margin: 5px 15px 0 0
    }
body > header #logo {width: 108px;height: 82px;margin: 10px 20px 10px 0;}

}


@media screen and (min-width:768px) {
    #hero #heroContent p:first-of-type a.cta {
        margin: .5em 0 1em 0;
    }

    .svcArea{display: flex}
    ul.svcArea {
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
    padding-bottom:2em;
}


ul.svcArea li {
    width: 33%;
    font-size: 1em;
    margin:.5em 0;
}


}




@media screen and (max-width:820px){#ServiceRequest{min-height:2500px;}}

@media screen and (max-width:1024px){#ServiceRequest{min-height:1300px;}}

@media screen and (max-width:1200px){#ServiceRequest{min-height:2700px;}}

@media screen and (min-width:1024px) {
body > header #logo{background-image:url(/owners/2/images/logo.jpg);color:#fff;}
#homepage #intro.wrapper p img {margin: .5em 0 1em 1em;width:300px;height:300px;}
.slide_1{background-image:url(/images/banners/hero/a1903.jpg);background-position:-227px 0;}
div.slide-content span.h3{display:inline-block;left:2em;}
body > header .appointment > a span:nth-child(2), body > header .estimate > a span:nth-child(2) {font-size:1em}
#hero #heroContent ul {bottom:0;position:absolute;}
#hero #heroContent span.h1{margin-top:1.5em;font-size:1.5em;line-height:1.2}
#hero #heroContent p:first-of-type{font-size:1em;}
#hero #heroContent ul{width:46%}
div#headADD{padding:0}
}




@media screen and (min-width:1151px){
#hero #heroContent p{font-size:1.1em;width:70%;}
#hero #heroContent span.h1 {font-size: 1.7em;}
#hero #heroContent ul li img {width: 90%;}
#hero #heroContent span.h1, #hero #heroContent p:first-of-type, #hero #heroContent ul{margin-left:36%;}
#hero #heroContent span.h1{line-height:1.2}
#hero #heroContent p:first-of-type{font-size:1.1em;}
#hero #heroContent ul{width:40%}



}

@media screen and (min-width:1279px){
body > header + * {padding-top: 152px;}
#homepage #hero > div {height: 580px;}
#homepage #hero > div .slide {height: 580px;}
#hero div, #hero > div .slide {height: 580px;}
#homepage #hero > div .slide-content {height: 580px;}
.slide_1 {background-size: cover;}
#hp_welcome{padding:0 1em;}
.slide_1{background-position:-145px 0;}
#hero #heroContent{background:none;}
#hero #heroContent span.h1, #hero #heroContent ul{margin-left:40%;}
#hero #heroContent p:first-of-type{margin:1em 0 1em 40%}
#homepage #intro .section_title {font-size: 1.5em;}
body > header.shrinked #logo {margin: .2em 1em .2em 0;}
}


@media screen and (min-width:1359px){
#hero #heroContent span.h1{margin-left:42%;line-height:1.3}
#hero #heroContent p:first-of-type{margin:1em 0 1em 45%;width:51%;font-size:1.3em;margin-left:42%}
#hero #heroContent ul{margin-left:44%;width:37%}
#hero #heroContent ul li img {width: 90%;}
#homepage #hero > div {height:590px;}
#homepage #hero > div .slide {height:590px;}
#hero div, #hero > div .slide {height:590px;}
#homepage #hero > div .slide-content {height:590px;}
.slide_1 {background-position:-150px 0;}
}


@media screen and (min-width:1439px){
.slide_1 {background-position: -171px 0;}
#homepage #hero > div {height:650px;}
#homepage #hero > div .slide {height:650px;}
#hero div, #hero > div .slide {height:650px;}
#homepage #hero > div .slide-content {height:650px;}
#hero #heroContent p:first-of-type {font-size: 1.1em;}


}

@media screen and (min-width:1535px){
.slide_1 {background-position: -128px 0;}
}

@media screen and (min-width:1599px){
.slide_1 {background-position: -65px 0;}
}




@media screen and (min-width:1679px){

}



@media screen and (min-width:1919px){
body > header #logo {width:141px;height:104px;}
.slide_1 {background-position: 0 0;}
#bannerNAV li a:before {width:150px;}
#homepage #hero > div {height: 700px;}
#homepage #hero > div .slide {height: 700px;}
#hero div, #hero > div .slide {height: 700px;}
#homepage #hero > div .slide-content {height: 700px;}
#hero #heroContent span.h1{margin-top:2em}
#hero #heroContent p {width: 75%;}
div.slide-content span.h3 {left: 0;}
#hero #heroContent ul {width: 43%;}
}