@import "vdp/text-expand.css";

/* ------------------------------------------------------------ *\
	Grid
\* ------------------------------------------------------------ */
.grid {
    margin: -1.6rem -2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
}
@media (max-width: 767px), screen and (max-width: 812px) and (orientation: landscape) {
    .grid {
        margin: -1.3rem -2rem;
    }
}
.grid .grid__col {
    padding: 1.6rem 2rem;
    max-width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
}
@media (max-width: 767px), screen and (max-width: 812px) and (orientation: landscape) {
    .grid .grid__col {
        padding: 1.3rem 2rem;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}
.grid .grid__col--1of2 {
    max-width: 50%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
}
.grid .grid__col--1of3 {
    max-width: 33.3333333333%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.3333333333%;
    flex: 0 0 33.3333333333%;
}
@media (max-width: 767px), screen and (max-width: 812px) and (orientation: landscape) {
    .grid .grid__col--1of3 {
        max-width: 100%;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    }
}
.grid .grid__col--1of4 {
    max-width: 25%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
}
@media (max-width: 767px), screen and (max-width: 812px) and (orientation: landscape) {
    .grid .grid__col--1of4 {
        max-width: 100%;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    }
}
/*  Grid Big Gutter  */
.grid--big-gutter {
    margin: -2rem -3.4rem;
}
.grid--big-gutter .grid__col {
    padding: 2rem 3.4rem;
}


.popular-cars {
    display: flex;
}

.section__quick-navs {
    margin: 0 -1rem -3.1rem;
    padding-top: 0.3rem;
}
@media (max-width: 767px), screen and (max-width: 812px) and (orientation: landscape) {
    .section__quick-navs {
        padding-top: 0;
        margin: 0;
    }
}
.section__quick-nav {
    padding: 0 1rem;
    margin-bottom: 3.1rem;
}
@media (max-width: 767px), screen and (max-width: 812px) and (orientation: landscape) {
    .section__quick-nav {
        padding: 0;
        margin-bottom: 1.5rem;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33%;
        flex: 0 0 33.33%;
        max-width: 33.33%;
    }
}
@media (max-width: 575px) {
    .section__quick-nav {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}
@media (max-width: 414px) {
    .section__quick-nav {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}
@media (max-width: 767px), screen and (max-width: 812px) and (orientation: landscape) {
    .section__quick-nav:last-child {
        margin-bottom: 0;
    }
}
@media (min-width: 768px) {
    .section__quick-nav h5.horizontal-links {
        position: relative;
        top: -1rem;
    }
}
.section__quick-nav h5 {
    font-size: 1.8rem;
    line-height: 1.67;
    letter-spacing: 0;
    margin-bottom: 0.9rem;
}
span.linkDesc {
    display: block;
}
.section__quick-nav-item .linkDesc{
    margin-top: .5rem;
}
.section__quick-nav-item .link3{
    font-size: 1.4rem;
    font-weight: normal;
}
.section__quick-nav-item {
    margin-bottom: 1.38rem;
    font-size: 1.2rem;
    line-height: 1.33;
}
@media (min-width: 767.02px) {
    .section__quick-nav-item:last-child {
        margin-bottom: 0;
    }
}
.section__quick-nav .section__quick-nav-toggle {
    font-weight: 600;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 0;
}
.section__quick-nav-items-hidden {
    display: none;
}
.section__quick-nav-items-hidden.is-active {
    display: block;
}