body {color: #000000;background-color: #fff;}

a {color: #008833;}
a:hover, a:focus {color: #008833;}

h1 {font-weight: bold; color: #000000; line-height: 1.6;}
h2 {font-weight: bold; color: #000000;}
h2.formheader {font-weight: bold; background: #000000;color: #fff;}
h3 {font-weight: bold; color: #000000; line-height: 1.6;}
h3.find-a-nearby {font-size:18px; line-height: 1.6;}
h4 {font-weight: bold; color: #000000;}
h5 {font-weight: bold; color: #000000;}
h6 {font-weight: bold; color: #000000;}

b {color: #000000;}
strong {color: #000000;}

div.lnkcurrentvehicle{background-color: #FFFFFF;padding: 5px;border: 1px solid #FFFFFF;border-radius: 3px;}

a.currentvehicletitle {color: #008833;font-weight: bold;font-size: 24px;text-decoration: none;overflow-wrap: break-word;word-wrap: break-word;}
a.currentvehicleremove i {color: #ff0000;font-size: 22px;position: absolute;bottom: 6px;padding-left: 10px;}

.txt-primary{color:#ff0000;}

hr {display: block;margin-top: 0.5em;margin-bottom: 0.5em;margin-left: auto;margin-right: auto;border-style: inset;border-width: 1px;}
hr.isportalhr{border:2px solid #efefef;}

h1.ishiw{font-weight:bold;font-size:20px;margin-left:13px;}

#header {background: #000000;}

#topbar {background: #008833;}
#footer {background: #e8e8e8;}
#footer a {color:#4d4d4d !important;}
#footer{color:#4d4d4d !important;}

.catlink span.ctitle {background: rgba(18, 30, 44, 0.5);}
.box.light {background: #e5e5e5;}

 .bg-primary {color: #fff;background-color: #008833;}
a.bg-primary:hover {background-color: #fff;}
 .bg-success {background-color: #dff0d8;}
a.bg-success:hover {background-color: #c1e2b3;}
 .bg-info {background-color: #d9edf7;}
a.bg-info:hover {background-color: #afd9ee;}
 .bg-warning {background-color: #fcf8e3;}
a.bg-warning:hover {background-color: #f7ecb5;}
 .bg-danger {background-color: #f2dede;}
a.bg-danger:hover {background-color: #e4b9b9;}

.btn-default,
.btn-primary,
.readmore {background:#008833;border:1px solid #CCCCCC !important;color:#ffffff;}

.btn-default:hover,
.readmore:hover,
.btn-default:focus,
.readmore:focus,
.btn-default.focus,
.readmore.focus,
.btn-default:active,
.readmore:active,
.btn-default.active,
.readmore.active,
.open > .dropdown-toggle.btn-default,
.open > .dropdown-toggle.readmore {background:#FFFFFF;border:1px solid #008833 !important;color:#008833 !important;}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {background:#FFFFFF;border:1px solid #008833 !important;color:#008833 !important;}

.btn-secondary {background:#FFFFFF;color:#008833;border:1px solid #008833;border-collapse:collapse;}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary.focus,
.btn-secondary:active,
.btn-secondary.active,
.open > .dropdown-toggle.btn-secondary {
    background:#FFFFFF;
    border:1px solid #008833 !important;
    color:#008833 !important;
}
.btn-outline {
    color:#ffffff;
    border:1px solid #fff !important;
}
.btn-outline:hover,
.btn-outline:focus,
.btn-outline.focus,
.btn-outline:active,
.btn-outline.active,
.open > .dropdown-toggle.btn-outline {
    background:#FFFFFF;
    border:1px solid #008833 !important;
    color:#008833 !important;
}

.headerinfo {padding-top: 10px;}
.headerinfo h1{padding-top: 10px; color:#FFFFFF; text-align: left; font-size: 30px; font-weight: bold;}

.textblock
{
  background-color:#f5f5f5;
  color:#FFFFFF;
  width: 100%;
  padding: 5px;
}
.textblock h1{color:#000000;}
.textblock a{color:#000000;}
.textblock a:visited{color:#000000;}
.textblock a:hover{color:#000000;}


/* ======================== custom catalog colours ======================== */
.category-box ul li a span{color:#008833;}
.category-box h3{background:#008833;}
.categoriescatalogtitlehref{background:#008833;}

/* ======================== product details page seaction headers ======================== */
.product-page h3 {background:#008833;margin:0 -15px 15px;padding:10px 15px;color:#fff;}
.product-information h2 {font-weight:700;color:#008833;font-size:24px;}
.product-similar .product .cart .price {color:#008833;display:block;font-weight:700;font-size:18px;margin:5px auto 0;}

/* ======================== product details page seaction headers ======================== */
.btn-black{color:#f9f9f9 !important;background:#008833}
.btn-black:visited {color:#f9f9f9 !important;}
.btn-black:active,.btn-black.active,.open > .dropdown-toggle.btn-black{background-image:none}
.btn-black.disabled,.btn-black[disabled],fieldset[disabled] .btn-black,.btn-black.disabled:hover,.btn-black[disabled]:hover,fieldset[disabled] .btn-black:hover,.btn-black.disabled:focus,.btn-black[disabled]:focus,fieldset[disabled] .btn-black:focus,.btn-black.disabled.focus,.btn-black[disabled].focus,fieldset[disabled] .btn-black.focus,.btn-black.disabled:active,.btn-black[disabled]:active,fieldset[disabled] .btn-black:active,.btn-black.disabled.active,.btn-black[disabled].active,fieldset[disabled] .btn-black.active{background-color:#008833;border-color:#008833}
.btn-black .badge{color:#ffffff;background-color:#000000}

/* ======================== scroll to top box ======================== */
.scrollTop {background:#008833;color: #FFFFFF;padding: 12px 17px;font-size: 16px;position: fixed;right: 10px;bottom: 10px;}
.scrollTop:hover {background:#008833;color: #FFFFFF;}
a.scrollTop{color:#FFFFFF;}
a.scrollTop:hover{color:#FFFFFF;}
a.scrollTop:visited{color:#FFFFFF;}

/* ======================== pagination ======================== */
.pagination > li > a, .pagination > li > span 
{
    color:#008833;background-color:#fff;
    border:1px solid #ddd;
    position:relative;float:left;padding:10px 17.5px;margin-left:-1px;line-height:1.42857143;text-decoration:none;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus
{
    color:#ffffff;
    background-color:#008833;
    border-color:#008833;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus
{
    z-index:2;cursor:default;
    color:#fff;
    border-color:#008833;
    background-color:#008833;
}

/* ======================== icon/text menu colours ======================== */
ul.nav a span.home {background:url(../img/icons/icon_home.png) no-repeat center center;}
ul.nav a span.parts {background:url(../img/icons/icon_part.png) no-repeat center center;}
ul.nav a span.tires {background:url(../img/icons/icon_tire.png) no-repeat center center;}
ul.nav a span.accessories {background:url(../img/icons/icon_accessories.png) no-repeat center center;}
ul.nav a span.orders {background:url(../img/icons/icon_order.png) no-repeat center center;}
ul.nav a span.cart {background:url(../img/icons/icon_cart.png) no-repeat center center;}
ul.nav a span.vin {background:url(../img/icons/icon_vin.png) no-repeat center center;}


.logo-container {display:inline-block;padding:0;}
@media(min-width:1200px){ .logo-container {padding-top:0px;} }
@media(max-width:1199px) and (min-width:992px){ .logo-container {padding-top:0px;} }
@media(max-width:991px) and (min-width:768px){ .logo-container {padding-top:0px;} }
@media(max-width:767px){ .logo-container {padding-top:0px;} }


.box.outline{
	border:0px !important;
	padding-left:20px !important;
	padding-top:0px !important;
}

@media (min-width:768px) 
{
    .icons .navbar .nav > li {width: 11.11% !important;}
}
.icons .navbar-default .navbar-nav > li > a {font-size:14px !important;}

@media (min-width:768px) 
{
    #mainnav.icons {background:#008833;border-top:2px solid #fff;}
    #mainnav.icons .navbar-default .navbar-nav > li > a {color:#fff;border-left:1px solid #fff;border-right:1px solid #fff;}
    #mainnav.icons .navbar-default .navbar-nav > li > a:hover {background:#fff;color:#008833;}
}

@media (max-width:767px) 
{
    #mainnav.icons #navbar {background:#008833;}
    #mainnav.icons .navbar-nav > li.mheader > a {background:#910309;}
    #mainnav.icons .navbar-nav > li > a {background:#008833;color:#fff;}
    #mainnav.icons .navbar-nav > li > a:hover {background:#008833;color:#fff;}
    #mainnav.icons #navbar .nav li {border-bottom:2px solid #fff;}
    #mainnav.icons .navbar-default .navbar-nav > li > a {font-size:16px;}
}
/* ======================== text menu colours ======================== */



/* ======================== dropdown menu colours ======================== */
@media (min-width:1200px) 
{
    #mainnav.dropdown {background-color: #fbfbfb;}
    #mainnav.dropdown .navbar-default .navbar-nav > li > a {font-size:16px;line-height:16px;}
}
@media (min-width:768px) and (max-width:991px) 
{
    #mainnav.dropdown {background-color: #fbfbfb;}
    #mainnav.dropdown .container .nav > li > a {font-size:11px;}
}
@media (min-width:768px) 
{
    #mainnav.dropdown {background-color:#fbfbfb;}
    #mainnav.dropdown .navbar-default .navbar-nav > li > a {color:#666666;}
    #mainnav.dropdown .nav > li > a:hover {background:#FFFFFF;color:#666666}
    #mainnav.dropdown .navbar-default .navbar-nav > .open > a {background:#FFFFFF;color:#666666}
    #mainnav.dropdown .navbar-default .navbar-nav > .open > a:hover {background:#FFFFFF;color:#666666}
    #mainnav.dropdown .navbar-default .navbar-nav > .open > a:focus {background:#FFFFFF;color:#666666}
    #mainnav.dropdown .navbar-nav > li > .dropdown-menu {background:#f5f5f5;border-color:#f5f5f5;}
    #mainnav.dropdown .navbar-nav > li > .dropdown-menu h3 {color:#008833;}
    #mainnav.dropdown .navbar-nav > li > .dropdown-menu ul li a {color:#333;}
    #mainnav.dropdown .navbar-nav > li > .dropdown-menu ul li a:hover {color:#008833;}
    #mainnav.dropdown .navbar-nav > li > .dropdown-menu ul li a.dropdown-toggle {border-bottom:1px solid #cccccc;}
}

@media (max-width:767px) 
{
    #mainnav.dropdown #navbar {background:#008833;}
    #mainnav.dropdown .navbar-nav > li.mheader > a {background:#008833;color:#fff;}
    #mainnav ul li a, #mainnav ul li a:hover {background:#008833;color:#fff !important;}
    #mainnav.dropdown .navbar-nav > li > a {background:#008833;color:#fff !important;}
    #mainnav.dropdown .navbar-nav > li > a:hover {background:#008833;color:#fff !important;}
    #mainnav.dropdown #navbar .nav li {border-bottom:2px solid #fff;}
    #mainnav.dropdown .dropdown-menu.menu-level-2 {border-top:2px solid #fff !important;}
    #mainnav.dropdown .dropdown-menu.menu-level-3 {border-top:2px solid #fff !important;}
    #mainnav.dropdown .navbar-default .navbar-nav > li > a {font-size:16px;}
}
/* ======================== dropdown menu colours ======================== */

span.navcarttxt{margin-bottom:0px !important; height:inherit !important;}

#registerbutton {display: none;}

.loginpgreg{display:none;}
.reglinkpopspacer {display: none;}
.reglinkpopnewuser {display: none;}
div.cartinstallcost {margin-top: 6px;margin-bottom: 6px;padding: 15px;background-color: #f0ece0;}
input.cartinstalloption {margin-right: 8px;}
.locsportalrow {display: none;}
#headbtnlogin {display: none;}
#headbtnlogout {display: none;}
.cartitemfrom{display:none;}
div.currentlocation {background: #fff;border-top: 1px solid #dfdfdf;border-bottom: 1px solid #dfdfdf;padding: 10px;}
div.currentpzcode {
    background: #fff;
    border-top: 1px solid #dfdfdf;
    border-bottom: 1px solid #dfdfdf;
    padding: 10px;
}

div.vinsearch {
    display: none;
}

@media (max-width:767px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}
@media (max-width:767px) and (min-width:550px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}
@media (max-width:549px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}
@media (max-width:549px) and (min-width:400px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}
@media (max-width:420px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}
@media (max-width:399px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}
@media (max-width:380px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}
@media (max-width:300px) {
    div.vinsearch {display: none !important;}
    div#vin-search-mobile{display: none !important;}
}




html, body {
    height: 100%;
}

.ib-sup {
    font-family: 'Open Sans', sans-serif;
    font-weight: 100;
    font-size: 16px;
    top: -1.0em;
}
div.hero-text h1 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 34px;
    line-height: 1.2;
    color: #FFFFFF;
    padding-top:4%;
}
       
div.headerinfo > div.hero-text {
    padding-left: 20px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 34px;
    max-width: 65%;
    line-height: 1.2;
}
.headerinfo {
    margin-top: 0; /* UPDATE */
}
.background-img {
    height: 0;
    width: 100%;
    position: relative;
    background-image: url("/content/images/hero-2426x426.jpg") !important;
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 17% !important;
    background-position: right bottom;
}
.headerinfo > div {
    font-size: 75px;
    text-transform: uppercase;
    color: #fff;
    opacity: 1;
    /*opacity: 0;*/
    height: 0px;
}

/* ======================== Header animation ======================== */
.headerinfo>div {
    opacity: 0;
    height: 0px;
    position: absolute;
}
.headerinfo>div:nth-child(1){
    animation: animation 18s infinite;
}
.headerinfo>div:nth-child(2){
    animation: animation 18s infinite;
    animation-delay: 6s;
}
.headerinfo>div:nth-child(3){
    animation: animation 18s infinite;
    animation-delay: 12s;
}
@keyframes animation {
    0% {opacity: 0; height: auto;}
    30% {opacity: 1;}
    45% {opacity: 0; height: 0px;}
    100% {opacity: 0; height: 0px;}
}


/* :::::::: MEDIA QUERIES MAX-WIDTH 1024 :::::::::*/
@media (max-width: 1024px) {
    div.hero-text h1 { padding-top: 0;}
}

/* :::::::: MEDIA QUERIES MAX-WIDTH 991 :::::::::*/
@media (max-width: 991px) {
    .ib-sup {
        font-family: 'Open Sans', sans-serif;
        font-weight: 100;
        font-size: 16px;
        top: -.75em
    }
    div.hero-text h1 {
        font-family: 'Open Sans', sans-serif;
        font-weight: 700;
        font-size: 28px;
        line-height: 1.15;
        padding-top:0%;
    }
    div.headerinfo > div.hero-text {
        padding-left: 20px;
        font-family: 'Open Sans', sans-serif;
        font-weight: 700;
        font-size: 28px;
        max-width: 65%;
        line-height: 1.15;
    }
}


/* :::::::: MEDIA QUERIES MAX-WIDTH 767 :::::::::*/
@media (max-width: 767px) {
    .ib-sup {
        font-family: 'Open Sans', sans-serif;
        font-weight: 100;
        font-size: 10px;
        top: -.8em;
    }
    div.hero-text h1 {
        font-family: 'Open Sans', sans-serif;
        font-weight: 700;
        font-size: 16px;
        line-height: 1.3;
        padding-top: 20px;
    }
    div.headerinfo > div.hero-text {
        padding-left: 20px;
        font-family: 'Open Sans', sans-serif;
        font-weight: 700;
        font-size: 16px;
        padding-left: 0;
        max-width: 53%;
        line-height: 1.3;
    }
    .headerinfo {
        margin-top: -5px;
        padding-top: 0px;
    }
    .background-img {
        width: 100%;
        height: 160px !important;
        position: relative;
        background-image: url(/content/images/hero-2426x426.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position-x: 86% !important;
    }
    #header {
        padding-left: 20px!important;
    }
    h3.find-a-nearby {
        font-size:16px;
        padding-left:0px; 
        line-height: 1em;
    } 
    
}
@media (max-width: 600px) {
    h3.find-a-nearby {
      padding-left:13px; 
    }  
}
@media (max-width: 500px) {
    h3.find-a-nearby {
      padding-left:10px; 
    }  
}    
@media (max-width: 400px) {
    h3.find-a-nearby {
      padding-left:8px; 
    }  
}


.delivery_block__title {
    font-size: 1.5em;
    font-weight: bolder;
    margin: 30px 0px;
}

.delivery_block__wrapper {
    padding: 0% 3%;
    margin-bottom: 50px;
}

.delivery_block__box {
    margin: 20px 8%;
    padding: 5%;
    height: auto;
    min-height: 170px;
    background-color: #fff;
    border: 1px #008833 solid;
    -webkit-box-shadow: 2px 2px 5px -1px rgba(0,0,0,0.75);
    -moz-box-shadow: 2px 2px 5px -1px rgba(0,0,0,0.75);
    box-shadow: 2px 2px 5px -1px rgba(0,0,0,0.75);
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

    .delivery_block__box:hover {
        filter: grayscale(1);
        transform: scale(0.98);
    }

.delivery_block__icon {
    height: 75px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.delivery_block__icon--van {
    background-image: url("/content/images/icons--van.png");
}

.delivery_block__icon--store {
    background-image: url("/content/images/icons--store.png");
}

.delivery_block__subtitle {
    font-size: 1.5em;
    font-weight: bolder;
    margin: 10px 0px;
}

.delivery_block__subtitle--green {
    color: #008833;
}

.delivery_block__subtitle--adjust {
    margin-bottom: 30px;
}

.delivery_block__text {
    height: auto;
    font-size: 1em;
    color: #000;
    line-height: 1.5em;
}

.delivery_block__pointwrapper {
    padding: 0% 5%;
}

.delivery_block__pointwrapper--adjust {
    margin-bottom: 50px;
}

.delivery_block__center {
    display: flex;
    justify-content: center;
}

.delivery_block__number {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    border: 1px #000 solid;
    border-radius: 50%;
    font-weight: bolder;
    font-size: 1.1em;
}

.delivery_block__steptext {
    display: flex;
    align-items: center;
    height: 36px;
    line-height: 1em;
    font-size: 1.1em;
}

.delivery_block__vdivider {
    margin: 8px 16px;
    height: 30px;
    border-left: 1px #000 solid;
}

.delivery_block__hdivider {
    margin: 9px 4px;
    height: 10px;
    border-bottom: 1px #000 solid;
}

.delivery_block__pointwrapper--vertical {
    display: block;
}

.delivery_block__pointwrapper--horizontal {
    display: none;
}


@media screen and (min-width: 576px) { /*phone*/

}

@media screen and (min-width: 768px) { /*tablet*/
    .delivery_block__title {
        font-size: 1.7em;
    }

    .delivery_block__steptext {
        font-size: 1.3em;
    }
}

@media screen and (min-width: 992px) { /*large tablet*/
    .delivery_block__title {
        font-size: 1.9em;
    }

    .delivery_block__steptext {
        font-size: 1.4em;
    }

    .delivery_block__box {
        margin: 20px 4%;
        padding: 2%;
    }

    .delivery_block__pointwrapper--vertical {
        display: none;
    }

    .delivery_block__pointwrapper--horizontal {
        display: block;
    }
}

@media screen and (min-width: 1200px) { /*laptop+*/
    .delivery_block__title {
        font-size: 2.1em;
    }
}
