﻿body > header #logo{background-image:url(/owners/38/images/logo.webp);}

.teamSection{display:none;}
#navbar nav ul li:hover a {background: #f30000;}
#hero>div .slide, #homepage #hero>div {height: 125px;}
#headADD{padding-left:.5em}
#headADD a, #headADD p a{color:#000}
a.actionCALL, .appointment > a{background-color:#f30000}
#intro h3{font-size:1em;}
#navbar, #navbar nav ul li a {background: #004b88;}
.slide_1 { background-image: url(/images/banners/hero/d420.webp);background-size:cover}
#hero #heroContent {margin-left: 0;width:30%;background-color:#000;font-family: "FoundationSans-Roman",Helvetica,Arial,sans-serif !important;top:0;padding:1em 1em 0 1em;}
#hero #heroContent span.h3, #hero #heroContent p{color:#fff;text-shadow:none;width:100%}
#hero #heroContent p:last-of-type{margin:0 auto;text-align:center}
#hero #heroContent p a.cta{color:#fff;border-width:2px;margin:2em 1em 0 0;min-width:85px;background-color:#f30000;text-decoration-color:#fff}
#navbar nav > ul > li:hover > a:before {border-color: transparent #000 #000 transparent;}
#homepage .gThumb img {width: 100%;float: none;}
.gThumb img {width:33%;float: right;}
#hero #heroContent ul {top: 2%;right: 5%;}
#hero .slide-content .fab:before{margin-left:.5em}
#sidebar > div .h2:first-of-type, #carousel .carousel .slide .h2, .carousel_widget .slide h2, #sidebar .slide h2, .widget h2 {background: #004b88;}
#sidebar .h2.section_title.sbSlide, #reviews .h2 .nav button, #coupons .h2 .nav button, a, p.h6 span:first-child, div.meta span, .link  {color: #004b88;}
#thumbMechanic {max-width: 100%;}
#menu_opener {color: #030303;}
footer{background-color:#000;}
a.myAddressLink2, a.myAddressLink1:hover {text-decoration-color: #004b88;}
#heroTEL{display:none}

@media screen and (min-width:320px){
#hero>div .slide, #homepage #hero>div {height:165px;background-position:-100px 0}
}

@media screen and (min-width:359px){
#hero>div .slide, #homepage #hero>div {background-position:-60px 0}
}

@media screen and (min-width:375px){
#hero>div .slide, #homepage #hero>div {background-position:-40px 0}
}

@media screen and (min-width:411px){
#hero>div .slide, #homepage #hero>div {height:205px;background-position:-100px 0}
}

@media screen and (min-width:660px) {
#hero div, #homepage #hero>div, #homepage #hero>div .slide {height: 350px;overflow:hidden}
#homepage #hero>div .slide-content {height:350px;}
#homepage #navbar {display:none;}
#hero #heroContent{width:42%;height:100%;padding:1em}
#hero #heroContent span.h3{font-size:1.2em}
#hero #heroContent p{font-size:.9em}
.gThumb img{width:300px;height:auto;float:right;}
#thumbMechanic{float: left;margin: 0.5em 1em 10px 0;max-width: 45%;}
#hero>div .slide_1 {background-image: url(/images/banners/hero/d1024.webp);background-position:-50px 0}
}



@media screen and (min-width:1024px){

#hero>div .slide, #homepage #hero>div {height:400px;background-position:0 0}
body > header #logo{margin:10px 0;width:189px;}
#hero div, #homepage #hero>div, #homepage #hero>div .slide {height:420px;overflow:hidden}
#homepage #hero>div .slide-content {height:420px;}
#hero>div .slide, #homepage #hero>div {background-position:-55px 0;}
#homepage > header + * {padding-top:102px;}
body header div.wrapper:first-of-type{padding-left:0}
#homepage #intro.wrapper p{text-align:left;padding-right:2%;}
#navbar ul li ul li a{background:#ef372e;}
#navbar nav ul li ul li a:hover {background:#ef372e;color: #ffffff;}
#navbar nav ul li:hover a{background:#ef372e}
#homepage #intro.wrapper .hP2{display:inline-block;margin-top:1em}
#navbar nav ul li a {padding: 1em .6em;font-size: 1em;}
#homepage .gThumb img{width:300px;float:right;}
.gThumb img{width:20%;float:right;}
#homepage .gThumb img {width:45%}
#hero #heroContent{width:35%}
#hero #heroContent span.h3{margin-top:1.5em}
#hero #heroContent p{font-size:.9em;margin:1em 0 .5em 0}
#hero #heroContent p a.cta{margin:.5em;min-width:95px;}
#heroTEL{position: absolute;bottom: 2%;color: #fff;font-weight: 700;font-size: 1.2em;left: 50%;transform: translateX(-50%);text-decoration: none;display:inline-block}
#thumbMechanic{float:left;margin:.5em 1em 20px 0;}
#hero .slide-content ul{bottom:100%}
body > header #header_tools a.actionCALL {width: 143px;}
}


@media screen and (min-width: 1151px){
#homepage > header + * {padding-top:121px;}
#hero>div .slide, #homepage #hero>div {background-position:0 0;}
.slide_1 {background-size:contain;background-image: url(/images/banners/hero/d1903.webp)}
#hero div, #homepage #hero>div, #homepage #hero>div .slide {height:443px;overflow:hidden}
#homepage #hero>div .slide-content {height:443px;}
#hero #heroContent{height:95%;padding:.5em 1em}
#hero #heroContent p{font-size:1em;}
#hero #heroContent p a.cta {min-width:110px;font-size:.7em;margin: 1em 0.5em 0.5em 0;}
#hero .slide-content ul li:first-of-type {font-size: 1.2em;}
#hero #heroContent ul {top: 7%;}
#heroTEL {
    bottom: 3.2%;
    font-size: 1.5em;
}
body > header #header_tools a.actionCALL {width:202px;}
}

@media screen and (min-width:1279px) {
    #homepage > header + * {padding-top: 142px;}
    #navbar nav ul li a {padding: 1em .8em;font-size: 1.2em;}
    #hero>div .slide, #homepage #hero>div {background-position:130px 0;}
    #hero #heroContent{height:auto;padding:2em 1em} 
    #hero #heroContent span.h3{margin-top:0;font-size:1.3em;}
    #hero #heroContent p a.cta{min-width:105px;}
    body header div.wrapper:first-of-type{padding-left:2em}
    #headADD{padding-left:0;}
    #heroTEL{bottom:2%;font-size:1.6em}
    #hero #heroContent ul {top:2%;}
    body > header #logo{margin:10px 0;width:239px;}
}

@media screen and (min-width:1359px){
#hero>div .slide, #homepage #hero>div {background-position:0 0;}
#homepage #intro.wrapper .hP2{display:inline;margin-top:0;}
#hero #heroContent {transform: translateY(0);}
#hero #heroContent h1{font-size:1.8em;}
#hero #heroContent p{font-size:1.1em;}
#hero #heroContent p a.cta {min-width: 93px;font-size:.7em;margin:2em 1em 0}
#heroTEL{bottom:5%;}
.slide_1 {background-size:cover}
}


@media screen and (min-width:1439px){
#homepage #intro.wrapper .hP2{display:inline-block;margin-top:1em;}
#navbar nav ul li a {padding: 1em .8em;font-size: 1em;}
#hero div, #homepage #hero>div, #homepage #hero>div .slide {height: 560px;overflow:hidden}

#homepage #hero>div .slide-content {height: 560px;}
#hero #heroContent p{font-size:.9em;}
#hero #heroContent p a.cta {min-width: 93px;font-size:.7em;margin:2em 1em 0}
.slide_1{background-position:0 0}
#hero #heroContent {
    height: 340px;
    left: auto;
    top: 50%;
    transform: translateY(-50%);
}
#hero #heroContent p a.cta {min-width:103px;margin:0 1em 2em}
#heroTEL {font-size: 1.5em;width: 100%;text-align: center;}
#hero .slide-content ul li:first-of-type {font-size: 1em;}
}

@media screen and (min-width:1919px) {
#hero>div .slide, #homepage #hero>div  {margin:0 auto;background-size:cover;background-position:0 0}
#hero #heroContent{left:0;height:400px}
#hero #heroContent p{font-size:1em;}
#hero #heroContent p a.cta {color: #fff;border-width: 2px;margin:0 1em 1.6em 0;min-width:116px;background-color:#f30000;text-decoration-color: #fff;}
#hero #heroContent {top: 35%;transform: translateY(-35%);}
}

@media screen and (min-width:2047px){
#hero #heroContent {height:425px;top:50%;transform: translateY(-50%);padding:1em}
#hero #heroContent p{font-size:1em;margin-bottom:.5em}
}

@media screen and (min-width:2559px) {
#hero>div .slide, #homepage #hero>div {background-position:0 0;}
#hero #heroContent p a.cta {margin:.5em}
#heroTEL{bottom:2%}
}



