﻿body > header #logo{background-image:url(/owners/27/images/logo.jpg);color:#fff;}
.slide_1{background-image:url(/images/banners/hero/a420.jpg);}
#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: #004b88}
#hero #heroContent p:first-of-type {background:none;padding:0;width:58%;margin-left:39%;color: #004b88;font-size:.9em;}
#hero #heroContent p:first-of-type a{color:#004b88;font-weight:100;text-decoration-color:#004b88}
#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;}
a.myAddressLink2, a.myAddressLink1:hover {text-decoration-color: #004b88;}
footer a, footer a:hover {color: #ffffff;text-decoration-color: #004b88;}

div#headADD a{display:inline-block;}

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;}



#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;
}
#headADD.multiShop ul{width:100%;font-size:.9em;color:#fff;margin:0 auto 0;}
#headADD.multiShop ul li {width:33%;text-align:center;margin-bottom:0}
#headADD.multiShop ul li a span{display:none;}
#headADD.multiShop ul li i{margin-right:.4em;color:#000}
#headADD.multiShop {padding-left: 0;}
#homepage #intro.wrapper p img {float: right;margin: .5em;width: 125px;height: 125px;}

@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) {body > header #header_tools ul li {margin: 1em 1.3em;}#headADD.multiShop ul{font-size:1em;}}

@media screen and (min-width:400px) {#headADD.multiShop ul{font-size:1em;}body > header #header_tools ul li {margin: 1em 1.5em;}}

@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
    }
    #headADD.multiShop ul{width:100%;margin:0}
    #headADD.multiShop {width:50%}
    #headADD.multiShop ul li {width:49%;text-align: right;}
    #headADD.multiShop ul li a span{display:inline;}
    #headADD.multiShop ul li i{display:none;}

}

@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/27/images/logo2.jpg);color:#fff;}
#homepage #intro.wrapper p img {margin: .5em 0 1em 1em;width:200px;height:200px;}
.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}
#headADD.multiShop ul{width:410px;font-size:.9em;color:#fff;display:inline-block;margin:0 0 0 2em}
#headADD.multiShop ul li {width:49%;text-align: right;}
div#headADD.multiShop ul li a {line-height: 1.4;}
#headADD.multiShop ul li a span{display:inline-block;}
#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%}
}




@media screen and (min-width:1151px){
#headADD.multiShop ul{width:474px;font-size:.9em;display:inline-block;margin:0;}
#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){
#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;}
#headADD.multiShop ul{width:500px;margin:0 0 0 1em;font-size:1em}
#headADD.multiShop ul li a span {padding-left: .3em;}
.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;}
}


@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){
#headADD.multiShop ul li{width:31%;}
}



@media screen and (min-width:1919px){
#headADD.multiShop ul{width:615px;}
#headADD.multiShop ul li{width:41%;}
body > header #logo {width: 368px;height: 91px;}
.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%;}
}




