ul.flexBoxes {
display: flex;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0;
text-align: center;
justify-content:flex-start;
}
ul.flexBoxes li {
width: 90%;
margin: 1rem auto;
padding: 1.5rem 1rem;
border-radius: 3px;
background-clip: padding-box;
border-style: solid;
border-width: 1px;
position: relative;
display:table-cell;
align-items: center;
}
ul.flexBoxes.navigation{
margin:0;
padding:0;
}
ul.flexBoxes.navigation.veh li{
width:50%;
padding:0;
margin-bottom:1.5rem;
}
ul.flexBoxes.navigation.testi li{padding:0;margin:1rem 0;line-height: .7 !important;width:33%;}
ul.flexBoxes.navigation.dash li{padding: 0 1rem 0 0;margin:1rem 0;font-size:.7rem;width:50%;}
ul.flexBoxes.navigation.testi li a{position:relative;line-height:1;}
ul.flexBoxes li > a:first-of-type{line-height:1.5}
.flexBoxes.vMFG li {
text-align: center;
padding:.5rem .8rem;
}
.flexBoxes.vMFG li span {
width:100%;
font-weight:800;
}
.flexBoxes.vMFG li a:first-of-type{position:relative;}
.flexBoxes.vMFG li a, .flexBoxes.vMFG li{color:#231f20;font-weight:600;font-size:1.2rem}
ul.flexBoxes li h6 {
width: 100%;
margin: 0;
line-height: 1.5;
font-weight: 700;
}
ul.flexBoxes li .h5 {
font-size: 1rem;
letter-spacing: 1px;
padding: .5rem 0;
line-height: 1.3;
font-weight: 700
}
ul.flexBoxes li > a:first-of-type {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
line-height:1.5;
}
ul.flexBoxes.navigation li > a:first-of-type {
    display: block;
    position: relative;
}
ul.flexBoxes.flexSVC li > a:first-of-type {
display: block;
position: relative;
line-height:1.5;
}
.flexBoxes.flexShops li > a:first-of-type, .flexBoxes.flexNavigation li > a:first-of-type {
line-height:1.5;
}
ul.flexBoxes.dash li > a:first-of-type{line-height:1.5;position:relative;}
ul.flexBoxes.flexIMG li, ul.flexBoxes.flexIMG li:hover {
border-radius: 3px;
-moz-background-clip: padding-box;
background-clip: padding-box;
border-width: 1px;
background: #f7f7f7;
border-color: #d9d9d9;
}
ul.flexBoxes.flexIMG li > a:first-of-type, ul.flexBoxes.flexFAQ li > span.flexThumb {
position: relative;
display: flex;
width: 100%
}
ul.flexBoxes.flexIMG li img {
width: 100%;
max-height: 300px
}
ul.flexBoxes.flexNavigation {
padding: 0;
}
ul.flexBoxes.flexNavigation li, ul.flexBoxes.flexShops li {
background-color: transparent !important;
border: none;
padding: 0;
margin: 0 0 1rem 0;
width: 25%;
text-align: left
}
ul.flexBoxes.flexNavigation li{width:100%;margin-bottom:2.5rem}
ul.flexBoxes.flexShops.flexShopHead li {
margin-bottom: .3rem;
}
ul.flexBoxes.flexShops li > a:first-of-type {
display: block;
position: relative;
}
ul.flexBoxes.flexShops {
margin-bottom: 1rem;
border-bottom:1px solid #fff;
}
ul.flexBoxes.flexShops.flexShopHead {
margin-bottom: 0;
display:none;
}
ul.flexBoxes.flexShops li {
align-items: flex-start;
width:50%;
font-size:1rem;
display: block
}
ul.flexBoxes.flexShops li:nth-child(2n){
 padding-left:.3rem  
}
ul.flexBoxes.flexShops p {
font-size: 1rem;
}
#intro.wrapper ul.followUS{
margin:1rem 0;
padding:0;
display:flex;
justify-content:flex-end;
}
#intro.wrapper ul.followUS li{
width:auto;
font-size:1.5rem;
margin:0 0 0 1rem;
}
ul.flexBoxes.flexShops li:last-of-type {
width:100%
}
ul.flexBoxes.flexShops ul.followUS li {
width: 20%;
margin: .5rem .5rem 0 0;
margin-bottom: 0;
display: block !important;
font-size: .6rem;
float: left
}
ul.flexBoxes.flexShops li ul.followUS {
list-style-type: none;
margin: 0;
display:flex;
width: 100%;
justify-content:flex-start
}
ul.flexBoxes.flexShops li ul.folowUS li  {
display: inline-block;
float: left;
margin-right: 0;
}
ul.flexBoxes.flexShops li ul.followUS li a:before {
font-size: 1.5rem;
}
ul.flexBoxes.flexShops li ul.followUS li a em {
display: none;
}
ul.flexBoxes.flexShops h4 {
font-weight: 700;
font-size: 1.1rem;
}
ul.flexBoxes.flexShops li ul.followUS li > a:first-of-type {
display: block;
text-align:center;
}
.flexBoxes.flexGallery li{
justify-content:center;
font-weight:700;
}

ul.flexBoxes li > span.flexThumb span {
position: absolute;
background: rgba(0, 0, 0, .5);
color: #fff;
top: 0;
left: 0;
right: 0;
bottom: 0;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-o-transition: all .2s;
display: flex;
align-items: center;
}
ul.flexBoxes.flexVids li > span.flexThumb span {
bottom:10px;
}
ul.flexBoxes.flexVids li:hover .h6 {
background:none;
}
.flexBoxes.flexSVC li > span.flexThumb span {
bottom: 10px;
}
ul.flexBoxes.flexIMG.flexPICS li > a span {
background: rgba(0, 0, 0, .2);
}
ul.flexBoxes.flexIMG.flexPICS li > a span:hover {
background: rgba(0, 0, 0, 0);
}
ul.flexBoxes.flexSVC li span.flexThumb span:before, ul.flexBoxes.flexFAQ li span.flexThumb span:before, ul.flexBoxes.flexVids li span.flexThumb span:before, ul.flexBoxes.flexpics li span.flexThumb span:before {
font-family: '1stAuto';
font-style: normal;
text-align: center;
-webkit-transition: all .3s;
-moz-transition: all .3s;
transition-delay: 0s;
-o-transition: all .3s;
margin: 0 auto
}
ul.flexBoxes li a span:before, ul.flexBoxes li span.flexThumb span:before {
display: inline-block;
-webkit-transition-delay: .2s;
transition-delay: .2s;
}
ul.flexBoxes.flexIMG li {
border-radius: 3px;
border-style: solid;
border-width: 0 1px 1px 0 !important;
padding: 1rem;
width: 100%;
display: block;
margin: 1.5rem auto;
background-color: transparent;
cursor: pointer;
}
ul.flexBoxes.flexSVC li {
cursor: pointer;
}
#myPartners.flexBoxes.flexIMG li, #tires.flexBoxes.flexIMG li{
padding: .2rem;
width: 42%;
}
#tirePIC{
display:block;
margin:0 auto;
}
ul.flexBoxes.flexIMG.flexBrands li {
display: flex;
padding: .5rem;
width: 40%;
display: block;
margin: 1rem auto;
}
ul.flexBoxes.flexIMG.flexSBREP li {padding: 0;border: none;margin: 1rem 5px;width: 46%}
ul.flexBoxes.flexIMG.flexSBREP li:hover {background-color: transparent;}
ul.flexBoxes.flexIMG.flexSBREP li a:first-of-type {display: block;font-size: .8rem}
ul.flexBoxes.flexIMG.flexSBREP li ul {margin: 0;}
ul.flexBoxes.flexIMG.flexSBREP li ul li {margin: 0;width: 100%;text-align: left;background-color: transparent;}
ul.flexBoxes.flexSBREP li ul.DropDown li{font-size:1.2rem;float:left;width:45%;margin:0;text-align:center;}
ul.flexBoxes.flexSBREP li ul.DropDown li a{color:#00f;}
ul.flexBoxes.flexSBREP li#sbgRep{width:100%;text-align:center;font-size:1rem}
ul.flexBoxes.flexSBREP li#sbgRep img{width: 50%;margin: 0 auto;display: block;}
ul.flexBoxes.flexCONTACT {
margin: 0;

}
ul.flexBoxes.flexCONTACT li {
padding: 0;
border: none;
margin: 0 0 1rem 0;
width: 50%;
background: transparent;
color:#111111 !important;
}
ul.flexBoxes.flexCONTACT li:first-of-type {
width: 100%;
background-color: transparent;
font-weight:normal;
font-size: 1rem;
margin-block:20px 10px;
text-align: left;
font-weight:600;
}
ul.flexBoxes.flexCONTACT li:first-of-type:hover {
width: 100%;
background-color: transparent;
}
ul.flexBoxes.flexCONTACT li:hover {
background-color: transparent;
}
ul.flexBoxes.flexCONTACT li a:first-of-type {
display: block;
font-size:1rem;
text-align: left;
position: relative;
}
.flexBoxes.flexIMG li .flexThumb {
margin: 0;
position: relative;
width: 100%;
display: block;
}
.flexBoxes.flexIMG li .flexThumb span,
.flexBoxes.flexIMG li .flexThumb span:before {
font-weight: 400;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
opacity: .7
}
.flexBoxes.flexFAQ li span.flexThumb span,
.flexBoxes.flexFAQ li span.flexThumb span:before {
font-weight: 400;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
opacity: .7
}
.flexBoxes.flexFAQ li span.flexThumb span:before {
font-size: 5rem;
}
.flexBoxes.flexVids li a span:before {
content: '\e942';
font-size: 6rem;
}
.flexBoxes.flexSVC li span.flexThumb span:before {
font-size: 5rem;
}
.flexBoxes.flexpics li a span:before {
content: '\e964';
font-size: 5rem;
opacity: 0
}
.flexBoxes.flexBrands li a span:before {
content: '';
}
.flexBoxes.flexIMG li a.flexThumb:hover span:before,
.flexBoxes.flexIMG li a.flexThumb:hover span, 
.flexBoxes.flexIMG li span.flexThumb:hover span:before,
.flexBoxes.flexIMG li span.flexThumb:hover span,
.flexBoxes.flexIMG li.catLink:hover span.flexThumb span:before,
.flexBoxes.flexIMG li.catLink:hover span.flexThumb span {
transform: scale(1);
}
.flexBoxes.flexIMG.flexBrands li a.flexThumb:hover span:before,
.flexBoxes.flexIMG.flexBrands li a.flexThumb:hover span {
transform: scale(1);
}


ul.flexBoxes.flexCards{
align-content: space-around !important;
align-items: normal;
justify-content: space-between;
margin:.8rem 0
}
ul.flexBoxes.flexCards li, ul.flexBoxes.flexCards li:hover{
background:transparent;
padding:0;
color:#000;
margin:2rem auto;
width:auto;
max-width:402px;
}
ul.flexBoxes.flexCards li .h5{
margin:0;
background:#222;
color:#fff;
text-transform: uppercase;
}
ul.flexBoxes.flexCards li p{
padding:0 .5rem;
text-align:center;
}
ul.flexBoxes.flexCards li img{
width:100%;
height:auto;
}
ul.flexBoxes.flexCards li > a:first-of-type.cta {
position:relative;
margin:0 auto 1rem;
font-weight:700;
}



@media only screen and (min-width: 410px) {
ul.flexBoxes.flexNavigation li {width: 50%;}
}



@media screen and (min-width:599px){
ul.flexBoxes.flexNavigation li {width:33%;}
ul.flexBoxes.navigation.testi li{width:25%;color:#222}
}



@media screen and (min-width: 660px) {
ul.flexBoxes li, ul.flexBoxes.flexIMG li {
width: 45%;
}
.flexBoxes.vMFG li {
width: 27%;
margin: 1rem;
}
ul.flexBoxes.flexNavigation {
padding: 1.5rem 0;
display: flex;
}
ul.flexBoxes.flexNavigation li {
width: 33%;
}
ul.flexBoxes.flexCards li, ul.flexBoxes.flexCards li:hover {
background: transparent;
padding: 0;
color: #000;
margin: inherit;
width: 30%;
}
ul.flexBoxes.flexCards li p {
padding: 0 0.5rem;
text-align: left;
line-height: 1.5;
}
ul.flexBoxes.flexCards li > a:first-of-type.cta {
position: relative;
margin: 0 auto 1rem;
font-weight: 700;
font-size: .8rem;
}
}


@media screen and (min-width:767px) {
ul.flexBoxes.navigation.dash li {font-size:.8rem;width:33%;}
}


@media only screen and (min-width:1023px) {
ul.flexBoxes.flexIMG.flexPartners li,
ul.flexBoxes.flexIMG.flexBrands li {
width: 27%;
}
#myPartners.flexBoxes.flexIMG li, #tires.flexBoxes.flexIMG li {
width: 27%;
padding: 1rem;
}
ul.flexBoxes li h6 {
font-size: 1rem;
}
.flexBoxes li .h5 {
font-size: .9rem;
}
ul.flexBoxes.flexShops li ul.followUS li a:before {
font-size: 1.5rem;
}
ul.flexBoxes.flexNavigation li {

}
ul.flexBoxes.flexShops li {
width: 25%;
font-size: 1rem;
display: block
}
ul.flexBoxes.flexCONTACT li a:first-of-type {font-size:1rem;}



}



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

.flexBoxes.vMFG li {
width: 28%;
}
ul.flexBoxes li {
width: 30%;
}
.flexBoxes.flexIMG li {
width: 28%;
}
ul.flexBoxes li, ul.flexBoxes.flexIMG li {
width: 30%;
}
ul.flexBoxes li .h5 {
font-size: .9rem;
}
.flexBoxes.flexFAQ li a span:before {
font-size: 6rem;
}
.flexBoxes.flexVids li a span::before {
font-size: 4rem;
}
ul.flexBoxes.flexIMG.flexSBREP li {
margin: .5rem 14px .5rem 0;
}
ul.flexBoxes.flexIMG li img {
width: 100%;
align-self: center;
}
ul.flexBoxes.flexCONTACT li:first-of-type {
font-size: 1.1rem;
margin: 1rem 0 .5rem
}
ul.flexBoxes.flexCONTACT li a:first-of-type {
font-size: 1.1rem;
letter-spacing: 1px;
}
ul.flexBoxes.flexIMG.flexSBREP li {
margin: 1rem 14px 1rem 0;
}
ul.flexBoxes.flexShops li {
font-size: 1.2rem;
}
ul.flexBoxes.flexShops.flexShopHead{font-size:1.2rem}
ul.flexBoxes.flexShops ul.followUS li{
font-size:.8rem;width:8%;
}
ul.flexBoxes.flexNavigation li {width:25%;text-align:left;}
ul.flexBoxes.navigation.dash li {font-size: .9rem;}
ul.flexBoxes.flexCards li > a:first-of-type.cta{font-size:1rem}

}



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

.flexBoxes.vMFG li {
width: 28%;
}
.flexBoxes.flexGallery li {
width: 45%;
}

}


@media screen and (min-width: 1439px) {
ul.flexBoxes li {
padding: .5rem .8rem;
}
ul.flexBoxes li, ul.flexBoxes.flexIMG li {
width: 33%;
}
ul.flexBoxes li h6 {
font-size: 1.2rem
}
ul.flexBoxes.flexVideos h6, ul.flexBoxes.flexGallery h6 {
font-size: 1rem;
}
ul.flexBoxes.flexCONTACT li:first-of-type {
font-size: 1rem;
margin: 1.5rem 0 .3rem;
}
ul.flexBoxes.flexCONTACT li a:first-of-type {
font-size: 1.3rem;
letter-spacing: 0
}
ul.flexBoxes.flexShops li {font-size: 1rem;}
ul.flexBoxes.navigation.dash li {font-size: .8rem;}

}


@media screen and (min-width: 1595px) {
ul.flexBoxes.flexShops li{font-size:1rem;font-weight:normal}
ul.flexBoxes.flexShops ul.followUS li{font-size:.8rem;}
}




@media screen and (min-width: 2047px) {
ul.flexBoxes.flexNavigation li {width:25%;text-align:left;}
}