

/* HEADER NAV */
    .header hr {
        margin: .75rem auto;
    }

    .header h6 {
        font-size: 1.5rem
    }

    .header h6 img {
        height: 1.25rem;
        display: inline;
        margin-right: .5rem;
    }

    .header .sticky-header {
        position: fixed;
        top: 0;
        width: 100%;
    }

    .header .menu-container {
        z-index: 20;
        width: 100%;
        margin: 0;
        background: #FFFFFF;
        /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
        /* Firefox 3.5 - 3.6 */
        box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
        /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
    }

    .header .menu-mobile {
        z-index: 20;
        width: 100%;
        display: none;
        padding: 1em 0;
        padding-right: 20px;
    }

    .header .menu-mobile::after {
        /* content: "\f0c9"; */
        font-family: 'Font Awesome 5 Pro';
        font-weight: 700;
        font-style: normal;
        font-size: 2em;
        padding: 0;
        float: right;
        position: relative;
        top: 25%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        color: #222222;
    }

    .header .menu-dropdown-icon::before {
        /* content: "\f107"; */
        font-family: 'Font Awesome 5 Pro';
        font-weight: 700;
        font-style: normal;
        display: none;
        cursor: pointer;
        float: right;
        padding: 0;
        margin: 10px 1rem 0;
        color: #222222;
        transition: all 0.25s ease-in-out;
    }

    .header .menu-dropdown-icon.opened::before {
        -webkit-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg);
    }

    .header .header-menu {
        position: relative;
        z-index: 20;
    }

    .header .header-menu>ul {
        margin: 0;
        padding: 0;
        width: 100%;
        background-color: #FFFFFF;
        list-style: none;
        text-align: right;
        position: relative;
        box-sizing: border-box;
    }

    .header .header-menu>ul::after,
    .header .header-menu>ul::before {
        content: "";
        display: table;
    }

    .header .header-menu>ul::after {
        clear: both;
    }

    .header .header-menu>ul>li:not(.cta-container):not(.logo-container) {
        transition: all 0.25s ease-in-out;
    }

    .header .header-menu>ul>li:not(.cta-container):not(.logo-container)>a {
        text-decoration: none;
        color: #595959;
        font-size: 1rem;
        padding: 1.5rem 1rem;
        display: block;
        transition: all 0.25s ease-in-out;
    }

    .header .header-menu>ul>li:not(.cta-container):not(.logo-container)>a:hover {
        color: #222222;
    }

    .header .header-menu>ul>li:not(.cta-container):not(.logo-container):hover {
        background-color: #F7F7F7;
    }

    .header .header-menu>ul>li {
        display: inline-block;
        padding: 0;
        margin: 0;
        text-align: left;
    }

    .header .header-menu>ul>li a {
        text-decoration: none;
        transition: all 0.25s ease-in-out;
    }

    .header .header-menu>ul>li>ul {
        display: none;
        width: 100%;
        height: auto;
        background-color: #F7F7F7;
        padding: 1em 1.5em;
        position: absolute;
        z-index: 99;
        left: 0;
        margin: 0;
        list-style: none;
        box-sizing: border-box;
        /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
        /* Firefox 3.5 - 3.6 */
        box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
        /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
    }

    .header .header-menu>ul>li>ul::after,
    .header .header-menu>ul>li>ul::before {
        content: "";
        display: table;
    }

    .header .header-menu>ul>li>ul::after {
        clear: both;
    }

    .header .header-menu>ul>li>ul>li {
        margin: 0;
        padding: 0;
        list-style: none;
        background: none;
        height: auto;
    }

    .header .header-menu>ul>li>ul>li a {
        font-size: 1rem;
        color: #2d2d2d;
        margin: auto;
        height: auto;
    }

    .header .header-menu>ul>li>ul>li a:hover {
        color: #222222;
    }

    .header .header-menu>ul>li>ul.normal-sub {
        width: 250px;
        left: auto;
    }

    .header .header-menu>ul>li>ul.normal-sub>li {
        width: 100%;
        padding: 0;
    }

    .header .header-menu>ul>li>ul.normal-sub>li a {
        border: 0;
        display: block;
        height: auto;
        line-height: 2em;
        font-size: 1rem;
        color: #595959;
    }

    .header .header-menu>ul>li>ul.normal-sub>li a:hover {
        color: #222222;
    }

    .header .header-menu .logo-container {
        padding-left: 0;
        position: absolute;
        left: 0;
        top: 10px;
    }

    .header .header-menu .logo-container a {
        opacity: 1;
        padding: 0;
        transition: all 0.25s ease-in-out;
    }

    .header .header-menu .logo-container a:hover {
        opacity: 0.8;
    }

    .header .header-menu .logo-container img {
        width: auto;
        height: 38.25px;
    }

    @media print,
    screen and (min-width: 64em) {
        .header .header-menu .logo-container img {
            height: 45px;
        }
    }

    .header .header-menu .logo-container:hover {
        background-color: transparent;
    }

    .header .header-menu .cta-container a {
        margin: 0 0 0 1rem;
    }

    @media screen and (max-width: 1023px) {
        .header .menu-container {
            width: 100%;
        }

        .header .menu-mobile {
            display: block;
            height: 55px;
        }

        .header .menu-dropdown-icon::before {
            /* display: block; */
        }

        .header .header-menu>ul {
            display: none;
            padding-bottom: 1em;
        }

        .header .header-menu>ul>li {
            width: 100%;
            float: none;
            display: block;
        }

        .header .header-menu>ul>li:not(.cta-container) {
            border-bottom: 1px solid #DEDEDE;
        }

        .header .header-menu>ul>li>a {
            padding: 1em 0.5em !important;
            width: 100%;
            display: block;
            height: auto;
        }

        .header .header-menu>ul>li>ul {
            position: relative;
            top: 0;
            height: auto;
            background-color: none;
        }

        .header .header-menu>ul>li>ul.normal-sub {
            width: 100%;
        }

        .header .header-menu>ul>li>ul.normal-sub a {
            /* padding: 0.5em 0 0.5em 1.5em; */
        }

        .header .header-menu>ul>li>ul>li {
            float: none;
            width: 100%;
        }

        .header .header-menu .show-on-mobile {
            display: block;
        }

        .header .header-menu .cta-container {
            text-align: left;
            padding: 1.5rem 0;
        }

        .header .header-menu .cta-container a {
            margin: 0;
        }

        .header .header-menu .link-list .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a:hover {
            color: #222222;
        }

        .header .header-menu .link-list .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a::after {
            color: #222222;
        }
    }

    .sub-navigation {
        position: relative;
        z-index: 10;
        clear: both;
    }

    .sub-navigation .title-bar {
        width: 100%;
        padding: 0;
    }

    .sub-navigation .title-bar .menu-text {
        padding-left: 0;
        padding-right: 0;
        font-weight: bold;
        font-size: 1rem;
    }

    .sub-navigation .title-bar .title-bar-left {
        -webkit-flex: 2 1 auto;
        -ms-flex: 2 1 auto;
        flex: 2 1 auto;
        color: #FFFFFF;
        text-transform: uppercase;
    }

    .sub-navigation .title-bar .title-bar-left li {
        padding: 1em 2em 1em 0;
    }

    .sub-navigation .title-bar .title-bar-right {
        -webkit-flex: 2 1 auto;
        -ms-flex: 2 1 auto;
        flex: 2 1 auto;
    }

    .sub-navigation .title-bar .title-bar-right .menu a {
        padding: 1em;
        color: #595959;
        font-size: 1rem;
        transition: all 0.25s ease-in-out;
    }

    .sub-navigation .title-bar .title-bar-right .menu a:hover {
        color: #FFFFFF;
    }

    .sub-navigation .title-bar .title-bar-right .menu .selected a {
        background-color: #4A90E2;
        color: #222222;
    }

    .sub-navigation .title-bar .accordion-menu {
        width: 100%;
    }

    .sub-navigation .title-bar .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a::after {
        display: none;
        width: 0;
        height: 0;
        border: none;
        content: '';
    }

    .sub-navigation .title-bar .accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a::before {
        content: "\f107";
        font-family: 'Font Awesome 5 Pro';
        font-weight: 700;
        font-style: normal;
        cursor: pointer;
        float: right;
        padding: 0;
        margin: 0;
        border-color: #595959;
        transition: all 0.25s ease-in-out;
    }

    .sub-navigation .title-bar .accordion-menu .is-accordion-submenu-parent a {
        color: #FFFFFF;
        text-transform: uppercase;
        font-weight: bold;
        padding-left: 0;
        width: 100%;
        transition: all 0.25s ease-in-out;
    }

    .sub-navigation .title-bar .accordion-menu .is-accordion-submenu-parent a:hover {
        color: #FFFFFF;
    }

    .sub-navigation .title-bar .accordion-menu .is-accordion-submenu-parent[aria-expanded='true']>a::before {
        -webkit-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg);
    }

    .sub-navigation .title-bar .accordion-menu .is-accordion-submenu-item a {
        color: #595959;
        font-weight: normal;
        text-transform: none;
        transition: all 0.25s ease-in-out;
    }

    .sub-navigation .title-bar .accordion-menu .is-accordion-submenu-item a:hover {
        color: #FFFFFF;
    }

    .sub-navigation .title-bar i {
        margin-right: 0.5em;
    }

    .sub-navigation .title-bar .page-property {
        font-size: 0.7em;
        font-weight: bold;
        text-transform: uppercase;
        color: #E35D5D;
        margin-left: 0.5em;
    }

    .sub-navigation .inner-width {
        width: 100%;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }


    .header .shop-by-activity {
        margin: 2%;
        width: 29%;
        text-align: center;
        line-height: 1;
        padding: 4%;
        border: solid 1px #eee;
    }

    .header .shop-by-activity:hover {
        border: solid 1px #ddd;
        cursor: pointer;
    }

    .header .square {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 100%;
    }

    .header .square:after {
        content: "";
        display: block;
        padding-bottom: 100%;
    }

    .mobile-image-card {
        margin-bottom: 15px;
    }

    .header .square .content {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .header .square img {
        width: 35%;
        margin: auto;
        margin-top: 8%;
        margin-bottom: 10%;
    }

    .header .vertical.menu a::after,
    .header .shop-all a::after,
    .header #accessoriesMenu a::after {
        content: "\f105";
        font-family: 'Font Awesome 5 Pro';
        font-weight: 600;
        font-style: normal;
        cursor: pointer;
        margin: 0 0 0 0.5rem;
        color: #dd1a22;
        transition: all 0.25s ease-in-out;
    }

    .header a {
        font-weight: 500;
    }

    .header #accessoriesMenu,
    .header #shopAllServices {}

    .header #accessoriesMenu img {
        margin: 3rem 0 1rem 0;
        width: 80%;
    }

    .header #accessoriesMenu a {
        margin: 1rem 1rem;
    }

    .header .shop-all {
        padding: 1rem;
        margin: 3rem 0 0 0;
    }

    .header .shop-all a {
        font-weight: bold;
        font-weight: bold;
        text-transform: uppercase;
    }

    .header .special-offer {
        color: white;
        background-color: black;
        text-align: center;
        border-radius: 5px;
        padding: 1rem;
        margin-top: 1rem;
    }

    .header .special-offer img {}

    .header .special-offer h4 {
        margin: 1rem 0 0 0;
    }

    .header .special-offer .button {
        color: white;
        font-weight: bold;
        padding: .5rem 1rem;
    }

    .header .special-offer .button:hover {
        color: white;
    }

    .header h6 i {
        color: #dd1a22;
        margin-right: .5rem;
    }

    .header #vehiclesMenu,
    .header #accessoriesMenu,
    .header #servicesMenu,
    .header #financingMenu,
    .header #resourcesMenu {
        padding-top: 1rem;
    }

    .nav-padding {
        margin-right: 25px;
    }

    .header .header-menu .logo-container img {
        height: 60px;
    }

    @media only screen and (max-width: 1180px) {
        .header .header-menu>ul>li:not(.cta-container):not(.logo-container)>a {
            font-size: 14px;
        }

        .header .header-menu .logo-container img {
            height: 45px;
        }
    }

    @media only screen and (max-width: 1056px) {
        .header .header-menu>ul>li:not(.cta-container):not(.logo-container)>a {
            font-size: 12px;
        }

        .header .header-menu .logo-container img {
            height: 40px;
        }
    }
/* \HEADER NAV */



/* Used in PDP of a model to display model name */
.model-price .model-name {
    font-size: 48px;
    font-weight: bold;
}
/* Used in PDP of a model to stick the navigation to the top of the page */
.sticky-tabs-tor {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    background: #FFF;
    background-color: #FFF;
    z-index: 20;
}
/* Overrides the blue on the product detail table */
.option-price {
    color: #101010
}

/* Sets the height of any component to fixed heights */
.fixed-height-200 {
    height: 200px;
}
.fixed-height-250 {
    height: 250px;
}
.fixed-height-300 {
    height: 300px;
}
.fixed-height-350 {
    height: 350px;
}
.fixed-height-400 {
    height: 400px;
}
.fixed-height-450 {
    height: 450px;
}
.fixed-height-500 {
    height: 500px;
}
.fixed-height-550 {
    height: 550px;
}
.fixed-height-600 {
    height: 600px;
}
.fixed-height-650 {
    height: 650px;
}
.fixed-height-700 {
    height: 700px;
}
.fixed-height-750 {
    height: 750px;
}
.fixed-height-800 {
    height: 800px;
}
.fixed-height-850 {
    height: 850px;
}
.fixed-height-900 {
    height: 900px;
}

@media only screen and (max-width: 655px) {
    .mobile-hero-card {
        margin-top: 30px;
    }
}
