/******************************************************************************/
/************************************ Global **********************************/
/******************************************************************************/
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    padding: 0 15px;
}

html { overflow-y: scroll;  overflow-x: hidden;}
body { margin: 0px; padding: 0px;  background: #fff;  color: #313131;  font-size: 15px; font-family: 'Open Sans', sans-serif;  margin-top: 137px;  line-height: 1.2;}
    body td {vertical-align: top;padding-left: 20px;}

a, a:focus, a:active {color: #b61319;text-decoration: none;cursor: pointer;transition:all 0.3s;}
    a:hover {color: #000; text-decoration: none;}
a img {border:none}
p { padding: 10px 0; text-align: justify;  margin: 0; line-height:26px}
p.alt-font {font-weight:600; font-style:italic; text-align:center}
ul, ol { padding-left: 30px;  text-align: left;}

h1, h2, h3, h4, h5, h6 { font-weight: 800; padding: 10px 0;  margin: 0; line-height:1.2; font-family: 'Open Sans', sans-serif;color:#b61319; }
h1, h2 {text-align:center; text-transform:uppercase; margin-bottom:10px}
h1 { font-size: 25px;}
h2 {font-size: 24px;}
h3 { font-size: 22px;}
h4 {font-size:18px}

img {height:auto;}

.sec-plain {padding: 80px 0; position:relative}
.sec-plain::after {background:#b61319; width:100%; max-width:820px; height:4px; position:absolute; z-index:4; left:50%; transform:translateX(-50%) ; bottom:0; content:""; display:block}
.flex {display:flex; display:-webkit-flex}
.bg1, .bg2 {color:#fff}
.bg1 {background:url("https://www.groverautoandtire.com/Images/bg1.jpg") no-repeat fixed center;}
.bg2 {background:url("https://www.groverautoandtire.com/Images/bg2.jpg") no-repeat fixed center;}
.quote {font-style:italic}

.container, .container2, .container-sm, .container-sm2 {  box-sizing: border-box;  padding: 0 20px; margin:0 auto}
.container, .container-sm {padding:0 5px;}
.container, .container2 {max-width:1180px}
.container-sm, .container-sm2 {max-width:790px}
.col-6 {width:50%; padding:0 15px;}

.img-logos { border: 1px solid #757474; margin: 10px 10px;}
.img-body {margin: 10px auto;}

.btn-green, .btn-green:focus, .btn-green:active { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#627d00+0,9acf0b+25,627d00+50,9acf0b+75,627d00+100 */
    background: rgb(98,125,0); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(98,125,0,1) 0%, rgba(154,207,11,1) 25%, rgba(98,125,0,1) 50%, rgba(154,207,11,1) 75%, rgba(98,125,0,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(98,125,0,1) 0%,rgba(154,207,11,1) 25%,rgba(98,125,0,1) 50%,rgba(154,207,11,1) 75%,rgba(98,125,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(98,125,0,1) 0%,rgba(154,207,11,1) 25%,rgba(98,125,0,1) 50%,rgba(154,207,11,1) 75%,rgba(98,125,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#627d00', endColorstr='#627d00',GradientType=0 ); /* IE6-9 */
    display:inline-block; font-weight:700; text-align:center; text-transform:uppercase; padding:10px 20px; margin:20px 0 10px; transition:all 0.5s; min-width:205px; color:#fff; background-size: 101% 200%; font-size:14px
}

.btn-green:hover {background-position: 0 -100%; color:#fff}

.d-con-service-list ul, ul.bg {list-style:none; padding:0; margin:0}
.d-con-service-list ul li, ul.bg li {padding-left:20px; background:url("https://www.groverautoandtire.com/Images/bg-li.png") no-repeat; background-position:0 4px; margin-bottom:10px}

/******************************************************************************/
/************************************* Header *********************************/
/******************************************************************************/
header {position: fixed; width: 100%; top: 0; z-index: 99;}
header a {color:#fff;}
header a:hover {color:#b61319}
.header-info {color:#fff; background:#000; border-top:2px solid #b61319; height:137px; box-sizing:border-box; }
.logo-mobile { margin: 70px auto 10px auto;}
.con-logo {float: left; width:300px; margin-left:6.625%; padding-top:10px}
.con-logo img {width:250px;}
.info-right {float:right; box-shadow:0 2px 2px rgba(0,0,0,.15)}
.info-right-top {padding:30px 0; justify-content:space-around; font-size:14px; font-weight:600;}
.address, .call, .hours {padding:4px 0 2px 46px;}
.social {padding-top:6px; font-weight:400; font-size:20px}
.social a {display:inline-block; transition:all 0.5s; margin-right:20px;}
.social a:last-of-type {margin-right:0}

.request, .request:active, .request:focus { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#8b0000+0,cb0000+25,8b0000+50,cb0000+75,8b0000+100 */
    background: rgb(139,0,0); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(139,0,0,1) 0%, rgba(203,0,0,1) 25%, rgba(139,0,0,1) 50%, rgba(203,0,0,1) 75%, rgba(139,0,0,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(139,0,0,1) 0%,rgba(203,0,0,1) 25%,rgba(139,0,0,1) 50%,rgba(203,0,0,1) 75%,rgba(139,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(139,0,0,1) 0%,rgba(203,0,0,1) 25%,rgba(139,0,0,1) 50%,rgba(203,0,0,1) 75%,rgba(139,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8b0000', endColorstr='#8b0000',GradientType=0 ); /* IE6-9 */
    color: #fff; display:block; float:right; height:71px; padding-top:26px; width:220px; text-align:center; text-transform:uppercase; transition:all 0.5s; background-size:101% 200%; font-weight:700;}
.request:hover {background-position:0 -100%; color:#fff}

ul.menu, .footer-info { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d7d7d7+0,ffffff+50,d7d7d7+100 */
    background: rgb(215,215,215); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(215,215,215,1) 0%, rgba(255,255,255,1) 50%, rgba(215,215,215,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(215,215,215,1) 0%,rgba(255,255,255,1) 50%,rgba(215,215,215,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(215,215,215,1) 0%,rgba(255,255,255,1) 50%,rgba(215,215,215,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d7d7d7', endColorstr='#d7d7d7',GradientType=0 ); /* IE6-9 */
}

ul.menu { list-style: none; padding: 0px; float:right; height:71px; padding:26px 25px 0; margin:0}
    ul.menu li { float: left; font-size: 16px; text-transform: uppercase; margin:0 20px; font-weight:600; position:relative;}
        ul.menu li a {display: block;color: #4c4c4c; border-bottom:4px solid rgba(0,0,0,0); padding-bottom:7px; transition: all 0.5s;}
            ul.menu li a:hover {color:013fa4; border-bottom:4px solid 013fa4}
           ul.dropdown-menu {border-radius:2px; padding:0}
           ul.dropdown-menu > li {margin:0; width:100%; font-size:14px; font-weight:800}
           ul.dropdown-menu > li a {padding:10px; border-bottom:4px solid #eee; font-weight:700; color:#4c4c4c}
           ul.dropdown-menu > li a:hover {background:#f9f9f9}

#HomePage ul.menu li.home a,
#AboutPage ul.menu li.about a,
#ServicesPage ul.menu li.services a,
#ReviewsPage ul.menu li.reviews a,
#ContactPage ul.menu li.contact a,
#BlogPage ul.menu li.blog a,
#BlogDetailPage ul.menu li.blog a,
#SpecialsPage ul.menu li.specials a {
    color: #b61319;
    border-bottom: 4px solid #b61319
}


#ServicesPage ul.menu li.services ul.dropdown-menu li a
{color: #4c4c4c; border-bottom:4px solid #eee}

.navbar-left {float:left; padding: 10px 0px 0px 10px;}
.social {float: right; margin-top: 5px;}
.top-link-bg { background: #2b2b2b; border-top: 4px solid #b61319; padding: 5px 10px 0;}
.top-link {text-align: center; padding:7px;}
.btn { background: none; color: #ffffff;}
.navbar-default  {color:#222}
/******************************************************************************/
/************************************* Footer *********************************/
/******************************************************************************/
.vehicle-list {padding: 40px 0; background: url("https://www.groverautoandtire.com/Images/footer-bg.jpg") no-repeat; list-style: none;}
    .vehicle-list h2 {margin-bottom:20px}
    .vehicle-list a {color:#fff}
.d-con-vehicle-list ul li {margin-bottom:10px}
.truck-list {padding-bottom:40px}
.footer-info {padding: 50px 0;  font-size: 16px; text-align: center; color:#1a1a1a;}
    .footer-info a {color: #1a1a1a;font-weight: 600;}
    .footer-info p { text-align: center;font-size: 14px; padding:0;}
.footer-nav {padding: 10px 0;}
.footer-nav a {display:inline-block; margin-bottom:15px}
.footer-info p:first-of-type {margin-top:-15px}
footer a:hover {color:#b61319}
/******************************************************************************/
/************************************* Body ***********************************/
/******************************************************************************/
.sec-banner {width: 100%; margin: 0 auto; padding: 0; position: relative; background: #fff;}
.jumbotron {background: none;display: block;max-width: 100%; margin: 0px auto !important; padding: 0px !important; border: none;}
    .jumbotron img { width: 100%;}

.slogan {color:#fff; font-weight:800; font-size:35px; color:#fff; position:absolute; z-index:9; text-shadow: 0 2px 2px rgba(0,0,0,.85); text-align:center; text-transform:uppercase; right:3.75%; bottom:9.6%; }

.sec1 {padding:50px 0 80px}
.sec1a, .sec1b {align-items:center}
.sec1aa h4 {text-align:center;}
.sec1aa h4 span, .sec1aa h4 a {color:#9acf0b}
.sec1aa h4 span {display:block; padding-top:10px}
.sec1aa h4 a:hover {color:#b61319}

/* .sec2 {padding:80px 0} */
.sec2 p.alt-font {font-size:18px; line-height:32px;}
.sec2a {text-align:center}
.sec3a {align-items:center;}
.sec3aba {justify-content:space-between; padding-top:15px}
.sec3b {justify-content:space-between}
.box1 {padding:30px 15px 0; text-align:center}
.box1 .img-body {margin-bottom:0}
.box1 .btn-green {font-size:13px}

.sec4 {background:#fff}
.sec4a {padding:80px 0 160px;}
.sec4b {margin-top:-90px; justify-content:space-around}
.box2 { color:#fff; background:#b61319; font-weight:700; border:2px solid #fff; width:194px; height:174px; padding-top:20px; box-sizing:border-box; text-align:center; margin-top:10px;}
.box2 .img-body {margin-bottom:18px}

.sec5 {padding-top:70px}
.sec5a {padding-bottom:15px}
.sec5a p.alt-font {max-width:640px; margin:0 auto;}

/* .affiliations {text-align:center} */
/* #HomePage .affiliations {padding:0} */
/* .affiliations img {display:inline-block; margin:15px 45px 10px} */

.sec-map {height: 450px;}
/******************************************************************************/
/************************************ Pages ***********************************/
/******************************************************************************/

/*********************************** About ************************************/
.bg-about1 {background:url("https://www.groverautoandtire.com/Images/bg-about-1.jpg") no-repeat center fixed; color:#fff }
.bg-about2 {background:url("https://www.groverautoandtire.com/Images/bg-about-2.jpg") no-repeat center fixed;  color:#fff }
.sec-employees {padding: 40px 0;}

/********************************* Services ***********************************/
#ServicesPage .container-sm2 {max-width:800px}
.sec-service-list {padding-top:15px}
.sec-services {padding: 40px 0; background:url("https://www.groverautoandtire.com/Images/bg-services.jpg") no-repeat center}
.sec-services-auto {padding: 40px 0; background:url("https://www.groverautoandtire.com/Images/bg-services-auto.jpg") no-repeat center}
/*********************************** Reviews **********************************/
.sec-reviews {
    padding: 40px 0;
    background: url("https://www.groverautoandtire.com/Images/bg-reviews.jpg") no-repeat fixed center;
}
.sec-review-links {text-align:center}
.sec-review-links a {display:inline-block; margin:20px 20px 10px 20px}
/*********************************** Contact **********************************/
img.img-contact {margin-bottom: 20px;}
.con-location-info label {padding-left: 20px;}
.con-location-hours { max-width: 311px; margin-top: 20px; margin-bottom: 20px;}
    .con-location-hours .sidebar-bar {width: 100%;height: 65px; background:#b61319;}
.title-location-hours > h2 {color: #ffffff; text-align: center; font-size: 1.5em; padding: 20px 0px 0px 0px;}
a.btn-directions { display:inline-block; color:#fff; padding:5px 20px; margin:10px 0; background:#357ebd;font-size:14px; transition:all 0.5s; border-radius:5px;}
    a.btn-directions:hover { background:#285e8e;}
  .address-contact {padding-bottom:10px}
/********************************* Directions *********************************/
.sec-directions {height: 500px; padding-top: 50px;}

/******************************************************************************/
/********************************** Controls **********************************/
/******************************************************************************/

/******************************* employee Detail *******************************/
.d-con-employees {color:#fff; padding: 30px; margin-top: 20px;border: 1px solid rgba(154,207,11,1);max-width: 585px; margin-right: auto; margin-left: auto;}
.d-con-list-item-info-title {color:#b61319; font-weight:800; font-size:22px; text-transform:uppercase}
.d-con-list-item-info-subtitle {color:#fff; font-size:15px; font-weight:600}
#AboutPage .d-con-list .d-box-list-item .d-con-list-item-img-color img {max-width:275px}
/******************************* Service Detail *******************************/
.d-con-service { color: #fff;  padding: 30px;  margin: 20px auto;  max-width: 585px; background:none; border:1px solid rgba(154,207,11,1)}
.d-con-list.d-two-column .d-box-list-item { padding-bottom: 10px}

@media screen and (max-width:505px) {
    .d-con-service {padding: 15px;}
}

/********************************** Reviews ***********************************/
.d-box-review blockquote {background: none; border: 1px solid rgba(154,207,11,1); padding: 20px; margin: 20px 20px 40px 20px; box-shadow: 8px 8px 0px #000;color: #fff;text-align: left; border-radius: 10px;}
   blockquote p {font-weight: 600; font-size:15px; line-height:26px}
        .d-box-review blockquote p:first-of-type {text-align: center; font-size: 32px; color:#b61319}
/******************************** Vehicle Tips ********************************/
.d-vehicle-tips li {background: url("https://www.groverautoandtire.com/Images/icon-location.png") no-repeat; background-position: left;}

/******************************** Specials ********************************/
.d-box-special { line-height: 1.3; border: 3px dashed rgba(154,207,11,1);border-radius: 10px;background: #000; margin-top:10px;}
    .d-box-special p {line-height: 1.3; text-align: center; }
    .d-box-special .d-special-content { font-weight:700}
p.disclaimer {text-align: left;font-size: 12px; font-weight:400}
.d-box-special .d-special-link-print { color: #b61319;}
    .d-box-special .d-special-link-print:hover { color: #c70c46;}
.price, .d-box-special .d-special-title { font-size: 24px; color: #b61319; line-height: 1.2; padding-bottom:0}
.d-box-special .d-special-title {font-weight:800; color:#fff; padding-top:10px; padding-bottom:5px}
/*.d-box-special img {max-width:250px}*/

#VehicleTips ol li {
    margin-bottom: 10px
}
/******************************** blog ********************************/
.d-con-blogs .d-box-blog a.d-con-blog-title, .d-con-blogs .d-box-blog .d-con-blog-title {
    color: #b61319;
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    font-size:22px
}

.d-con-blogs .d-box-blog a.link-read-more {
    color: #b61319
}
/******************************** Construction ********************************/
.d-construction-body {
    background-color: #000;
    background-image: url("https://www.groverautoandtire.com/Images/bg-under-construction.jpg");
    background-repeat: no-repeat;
    background-position: top center;
    margin: 0;
}

/************************************ Accessibility **********************************/
#AccessibilityPage .sec-plain h2 {padding-bottom: 0;text-align: left;}
#AccessibilityPage .sec-plain h2:after {display: none;}
#AccessibilityPage .sec-plain p {text-align: left;}

/******************************************************************************/
/******************************* Media Queries ********************************/
/******************************************************************************/
@media screen and (max-width: 1500px) {
    ul.menu li {margin:0 17px}
    ul.menu {padding:26px 20px 0}
    .request, .request:active, .request:focus {width:220PX}
}
@media screen and (max-width: 1420px) {
    ul.menu li {font-size:12px; margin:0 15px}
     ul.menu {padding:26px 15px 0}
     .request, .request:active, .request:focus {width:180px; font-size:15px}
     .social a {margin-right:12px; font-size:19px}
    .info-right-top {font-weight:400}
    .address, .call, .hours {padding-left:40px}
}
@media screen and (max-width: 1300px) {
    .slogan {font-size:32px}

}
@media screen and (max-width: 1200px) {
    ul.menu li, .request {font-size:14px}
}
@media screen and (max-width: 1100px) {
    ul.menu li { margin:0 7px; }
    ul.menu {padding:21px 10px 0; height:60px}
    .request, .request:active, .request:focus {width:150px; font-size:12px; height:60px; padding-top:23px}
    .social a {font-size:17px}
    h1 {font-size:24px}
    h2 {font-size:23px}
    h3 {font-size:21px}
    .slogan {font-size:27px}

}
@media screen and (max-width: 991px) {
    header { position: static;}
    .header-info {height:auto;}
    body { margin-top: 48px;}
    .logo-mobile { margin-top: 10px; }
    .jumbotron {width: 100%;}
    .sec-plain, .footer-info { padding: 20px 0;}
    .vehicle-list, .sec-services, .sec-employees, .sec-reviews, .sec2 {padding:30px 0}
    .d-con-vehicle-list ul li {margin-bottom:20px}
    .social {float:none; text-align:center;}
    .col-6 {width:100%}
    .social a, .social a:last-of-type {margin:0 13px}
    ul.dropdown-menu > li a  {border:none;}
    .navbar-nav .open .dropdown-menu > li > a, .navbar-nav .open .dropdown-menu .dropdown-header {
        padding: 10px 10px 10px 25px}
    .sec1a, .sec3a {display:block}
    .sec3aba {justify-content:space-around}
    .sec-banner {display:none}
    h1, h2 {margin-bottom:0}
    .vehicle-list h2 {margin-bottom:10px}
    .sec4a {padding:30px 0 100px}
    /* .affiliations {padding-top:20px} */
}

@media screen and (max-width: 768px) {
    h1 {font-size:22px}
    h2 {font-size:21px}
    h3 {font-size:19px}
    p {text-align: left;}
    #HomePage .sec-banner {display:none}
    .sec3aba, .sec3b {display:block;}
    .box1 {padding-top:20px}
    .sec4b {justify-content:center; flex-wrap:wrap }
    .box2 {margin:20px 15px 0;}
}

@media screen and (max-width: 362px) {
    .title-location-hours > h2 {
        padding-top: 5px;
    }
}

.vehicle-list, .sec-reviews, .sec-services, .bg1, .bg2, .sec-services-auto, .bg-about1, .bg-about2 {background-size:cover}


/********* Vehicle Lsiting Widget ***********/

#vehicle-listing {
    width: 100%;
    height: 3500px;
    overflow-y: hidden;
}