﻿@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,700);
@import 'https://fonts.googleapis.com/css?family=Montserrat';
@import url('https://fonts.googleapis.com/css?family=Montserrat');

body {
    font-family: 'Open Sans', sans-serif;
}

a.vehicle-panel:hover {
    text-decoration: none;
}

div.testimonial {
    position: relative;
    z-index: 10;
}

.menu-container-inner:after {
    content: '';
    display: table;
    clear: both;
}

a.menu-heading {
    font-weight: 100;
    font-size: 14px;
    letter-spacing: 1px;
}

.quicklinkbuttons-horizontal {
    margin-left: inherit !important;
    margin-right: inherit !important;
}

.element-heading {
    font-weight: 100;
    padding-left: 0;
}
    /*Title & Heading*/
    .element-heading h4 {
        font-family: 'Montserrat', sans-serif;
        font-weight: 900;
        text-align: center;
        border: none;
        color: #222;
        padding-bottom: 20px;
        border-bottom: 2px solid #ccc;
        position: relative;
        font-size: 25px;
    }

        .element-heading h4:after {
            content: '';
            position: absolute;
            background-color: #9bc83c;
            width: 8%;
            padding: 5px;
            left: 46%;
            transform: skewX(-20deg);
            bottom: -5px;
        }

span.sub-text {
    color: #ccc;
}

.browse-inventory-image a {
    color: #828283;
}

    .browse-inventory-image a:hover {
        color: #828283;
    }


/*************************************
Banner
********************************************/
.banner-links-bar-wrapper {
    float: none !important;
}

.phonenumber-link a {
    font-size: 20px;
    font-weight: 800;
}

.banner-links-bar-wrapper span.media-icon-small {
    background: none !important;
    box-shadow: none !important;
}

a.banner-link i {
    text-shadow: none;
}

a.banner-link {
    color: #fff;
}

    a.banner-link:hover {
        color: #E4E4E4;
    }

.address-link a {
    font-size: 14px;
}

a.navbar-brand img {
    width: inherit !important;
}

.address-link.pull-left {
    line-height: 28px;
}
/*************************************
Inventory Search
********************************************/

.element-type-inventorysearch .form-control {
    background-color: transparent;
    border-bottom: 1px solid #999 !important;
    border: 0;
    border-radius: 0;
    height: 46px;
    font-size: 26px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.element-type-inventorysearch div.form {
    text-align: center;
}

.element-type-inventorysearch .inventorysearch {
    width: 100% !important;
}

.element-type-inventorysearch .form-group {
    width: 60%;
    display: inline-block;
}

.element-type-inventorysearch .btn-default {
    color: #666;
    background-color: transparent;
    border: none;
}

.element-type-inventorysearch label {
    display: none;
}

.element-type-inventorysearch button {
    font-size: 0;
}

.element-type-inventorysearch .fa {
    font-size: 26px;
}

.element-type-inventorysearch .form-control:focus {
    border: none;
    box-shadow: none;
}



/*************************************
Inventory Slider
********************************************/
.flexslider {
    background: none;
    border: none;
}

.flex-direction-nav a {
    padding: 0 15px;
    border-radius: 0;
    margin: -25px 8px 0;
}

.vehicle-panel-headline, .vehicle-panel-label {
    font-size: 12px;
    padding-top: 8px;
}

.flex-direction-nav a:before {
    font-family: FontAwesome;
    font-size: 40px;
    line-height: 50px;
}

.flex-direction-nav a.flex-next:before {
    content: '\f105';
}

.flex-direction-nav a.flex-prev:before {
    content: '\f104';
}

.element-type-inventoryslider {
    overflow: hidden;
}

.flex-direction-nav a {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.85) !important;
}




/*************************************
Browse Inventory
********************************************/
.browse-inventory-image {
    margin: 10px auto;
    padding-right: 0 !important;
    padding-left: 0 !important;
    position: relative;
    transition: all .59s ease-in;
}

    .browse-inventory-image a:before {
        content: "\f0d8";
        position: absolute;
        font-family: FontAwesome;
        bottom: -10px;
        font-size: 24px;
        color: #FFB400;
        transition: all 0.3s ease-in;
        left: 0;
        right: 0;
    }

    .browse-inventory-image a {
        border-bottom: 2px solid #ffb400;
        min-height: 82px;
        display: block;
        text-decoration: none;
        font-size: 17px;
        margin: 0 8px;
    }

        .browse-inventory-image a:hover, .browse-inventory-image a:focus {
            opacity: .6;
        }

    .browse-inventory-image img {
        transition: all .30s ease;
        margin-bottom: 4px;
    }

    .browse-inventory-image:hover img {
        transform: translate(0px,3px);
        opacity: .5;
        transition: all .30s ease;
    }

    .browse-inventory-image:hover a:before {
        transform: translate(0,-5px);
    }
/*************************************
Nav Bar
********************************************/
.navbar {
    margin-bottom: 0;
}

.navbar-fixed-spacer {
    height: inherit;
}

div#navbar {
    position: relative;
}

.navbar-default {
    border: none;
}

.navbar-fixed-shadow {
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

a.navbar-brand, nav.navbar.navbar-default,
nav.navbar-fixed-top a.navbar-brand,
.menu-heading, a.menu-heading:hover span:after,
li.menu-heading span,
a.menu-heading.dropdown-toggle,
ul.dropdown-menu,
li.menu-heading.dropdown.open,
.open,
a.banner-link,
.dropdown-menu > li > a,
div.footer-container {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

a.navbar-brand {
    transform: scale(1.0);
}

nav.navbar.navbar-default {
    padding: 1% 0 1%;
}

nav.navbar-fixed-top {
    padding: 0.2% 0 0.2% !important;
}

    nav.navbar-fixed-top a.navbar-brand {
        transform: scale(.7);
    }
/*Nav Bar Colors*/

/*Mouse Hover Effects*/
a.menu-heading span:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #DEDEDE;
    width: 0;
}

a.menu-heading:hover span:after {
    width: 100%;
}

.navbar-default .navbar-nav > .active > a {
    background: none;
    font-weight: 800;
    position: relative;
}

    .navbar-default .navbar-nav > .active > a:after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 2px;
        background: #FFB400;
    }
/*End Hover Effects*/
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #fff;
    background-color: rgba(255,255,255,.20);
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #fff;
    background-color: rgba(255,255,255,0);
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: #fff;
    background-color: rgba(255,255,255,.20);
}
/*************************************
Content Margin
********************************************/
.page-content div.page-content-row:nth-child(1) {
    margin-top: 0;
    padding-bottom: 0;
}

.page-content-row .container {
    padding-top: 50px;
    padding-bottom: 20px;
}

h1.pagetitle {
    background: none;
    margin-top: 40px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
}

/*div.pagetitle-container .container {
    background-color: rgba(0,0,0,0);
}*/
/*************************************
Slideshow
********************************************/
.carousel-indicators .active {
    background-color: rgba(255,255,255,.2);
}

.carousel-indicators li {
    border-radius: 0;
}

.carousel-control {
    background: none !important;
}


/*************************************
Everything below this is for the animated buttons
********************************************/
#btnul {
    position: relative;
    list-style: none;
    overflow: hidden;
    padding: 0;
    margin-top: 10px;
}

    #btnul .animatedbuttonli {
        margin-right: 5px;
        display: block;
        margin: 9px 0;
    }

.animatedbutton {
    bottom: 0;
    display: block;
    font-size: 24px;
    font-weight: 300;
    left: 0;
    letter-spacing: 2px;
    line-height: 50px;
    overflow: hidden;
    position: relative;
    right: 0;
    text-align: center;
    text-decoration: none;
    top: 0;
    transition: all 0.5s ease 0s;
    width: 100%;
}

    .animatedbutton:hover, .animatedbutton:active {
        text-decoration: none;
        background: none;
    }

    .animatedbutton .animatedbuttonspan {
        display: block;
        position: relative;
        padding-right: 0px;
        position: relative;
        transition: padding-right 0.5s;
    }

        .animatedbutton .animatedbuttonspan:after {
            content: '';
            position: absolute;
            top: 0;
            right: 0px;
            opacity: 0;
            width: 10px;
            height: 10px;
            margin-right: 20px;
            margin-top: -10px;
            background: rgba(0, 0, 0, 0);
            border: 3px solid #FFF;
            border-top: none;
            border-right: none;
            transition: opacity 0.5s, top 0.5s, right 0.5s;
            transform: rotate(-45deg);
        }

    .animatedbutton:hover .animatedbuttonspan, .animatedbutton:active .animatedbuttonspan {
        padding-right: 35px;
    }

        .animatedbutton:hover .animatedbuttonspan:after, .animatedbutton:active .animatedbuttonspan:after {
            transition: opacity 0.5s, top 0.5s, right 0.5s;
            opacity: 1;
            right: 0;
            top: 50%;
        }

/*************************************
Image Quick links Buttons
********************************************/

a.btn.btn-block.btn-large.quicklinkbutton.quicklinkimage {
    background: none !important;
    border: 0;
    margin-top: inherit !important;
}

a.quicklinkimage {
    text-align: center;
}

span.quicklinkbutton-img {
    display: block;
    max-width: 244px;
    margin-top: 5px;
    margin-bottom: 15px;
    position: relative;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}

    span.quicklinkbutton-img img {
        max-width: 100%;
    }

    span.quicklinkbutton-img:hover span.filter {
        transform: skewX(180deg);
        opacity: 1;
    }

        span.quicklinkbutton-img:hover span.filter i {
            color: #000;
        }

span.filter {
    position: absolute;
    width: 95%;
    height: 94%;
    background-color: rgba(255,180,0, 0.59);
    margin: 5px;
    padding-top: 50px;
    opacity: 0;
    transition: all .5s ease;
}

    span.filter i {
        font-size: 40px;
        color: #fff;
    }

span.quicklinkbutton-label-img {
    display: block;
    border: 1px solid rgba(95,95,95,1);
    max-width: 244px;
    line-height: 50px;
    position: relative;
    font-size: 24px;
    overflow: hidden;
    transition: all .5s linear;
    background-color: rgba(204,204,204,0);
    color: #5f5f5f;
    font-weight: 100;
    margin-left: auto;
    margin-right: auto;
}

    span.quicklinkbutton-label-img:hover {
        border-color: rgba(95,95,95,.15);
        background-color: rgba(204,204,204,.1);
        box-shadow: inset 0 0 0 2px #ffffff;
        color: #fff;
    }

        span.quicklinkbutton-label-img:hover span {
            right: 33px;
        }

span.quicklinkbutton-anim-img {
    position: absolute;
    right: -10px;
    transition: all .5s ease;
}

/*************************************
Parallax 
********************************************/
/*This make background transparant for parallax*/
.page-content-row.bg-parallax .container {
    background: rgba(0,0,0,0);
}

.test-drive {
    padding: 10% 0;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
}

    .test-drive p {
        font-size: 50px;
        color: #fff;
        text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
    }

    .test-drive a {
        display: inline-block;
        background-color: #222;
        padding: 15px 40px;
        font-size: 22px;
        color: #fff;
        border: 1px solid #fff;
        text-decoration: none;
        position: relative;
        overflow: hidden;
        transition: all .59s ease;
    }

        .test-drive a:hover {
            border-color: rgba(255,255,255,.20);
        }

        .test-drive a i {
            position: absolute;
            right: -18px;
            font-size: 30px;
            top: 14px;
            transition: all .59s ease;
        }

        .test-drive a:hover i {
            right: 18px;
            transition: all .59s ease;
        }

/*************************************
Footer
********************************************/
.page-bottom span.media-icon-small {
    background: none !important;
    box-shadow: none;
}

@media (min-width: 1200px) {
    .container {
        width: 1200px;
    }
}

@media screen and (max-width: 1199px) {
    #btnul {
        margin-top: 18px;
    }
}

@media screen and (max-width: 991px) {
    #btnul {
        margin-top: 0;
    }
}

@media (min-width: 768px) {
    .navbar-header {
        float: inherit;
    }

    ul.nav.navbar-nav {
        position: absolute;
        bottom: 0;
        right: 15px;
    }
}

@media (max-width:480px) {
    a.navbar-brand img {
        max-width: 195px !important;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }

    .element-type-inventorysearch .form-group {
        width: 80%;
    }

    .element-type-inventorysearch .form-control {
        font-size: 14px;
    }

    .element-type-inventorysearch .fa {
        font-size: 20px;
    }
}

@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #C7C7C7;
    }
}

@media screen and (max-width: 992px) {
    ul.nav.navbar-nav {
        position: relative;
        right: 0;
    }
}


/*************************************
 Master Child themes Styles
********************************************/

/*********** Child Themes - Remove Padding Class ***********/
.remove-padding .container {
    padding-top: 10px;
}

/*********** Child Themes - slider Text ***********/
.carousel-indicators {
    bottom: 0;
}

.carousel-fade .carousel-control {
    z-index: 120;
}

div.slider-text {
    text-align: center;
    position: absolute;
    top: 25%;
    left: 0;
    right: 0;
    font-family: 'Open Sans', sans-serif;
    z-index: 99;
}

    div.slider-text a, div.slider-text h2 {
        color: #fff;
        font-weight: 700;
        font-size: 55px;
        text-shadow: 1px 1px 2px rgba(0,0,0,.80);
    }

    div.slider-text a {
        text-decoration: none;
        display: inline-block;
        border-radius: 3px;
        border: 1px solid transparent;
        padding: 0px 20px;
        line-height: 50px;
        font-size: 20px;
        background: linear-gradient(to bottom,rgba(0, 197, 0, 1) 0,rgba(2, 111, 2, 1) 100%);
        text-transform: uppercase;
        transition: all 0.3s ease;
    }

        div.slider-text a:hover {
            border-color: #fff;
            box-shadow: inset 0 0 0 2px #fff;
        }

        div.slider-text a i {
            padding-right: 15px;
            font-size: 24px;
        }

.slider-bg {
    width: 100%;
    height: 100%;
    top: 0;
    background: url(images/overlay.png) repeat 0 0;
    background-color: rgba(0, 0, 0, .059);
    position: absolute;
}

.page-content div.page-content-row:nth-child(1) .element-outer-container.element-type-customhtml {
    padding: 0;
}

@media (max-width: 767px) {

    div.slider-text {
        top: 1%;
    }

        div.slider-text h2 {
            font-size: 20px;
        }

        div.slider-text a {
            font-size: 11px;
            padding: 0px 5px;
            line-height: 30px;
        }

            div.slider-text a i {
                font-size: 15px;
                padding-right: 10px;
            }

            div.slider-text a:hover {
                box-shadow: inset 0 0 0 1px #fff;
            }

    .slider-bg {
        background-image: radial-gradient(circle at 48% 108%,rgba(255, 255, 255, 0.09),rgba(0, 0, 0, 0.7));
    }
}

/*********** Child Themes - Luxury Search Class ***********/

div.luxury-search.element-type-inventorysearch {
    background: none;
    padding: 0;
}

div.luxury-search .element-type-inventorysearch {
    background: rgba(255, 255, 255, .85);
    padding: 0;
}

div.luxury-search {
    position: absolute;
    bottom: 35px;
    width: 40%;
    z-index: 99;
    background-color: white;
    left: 30%;
    border: 1px solid #ababab;
    padding-bottom: 0;
    box-shadow: 0 1px 5px 1px rgba(0, 0, 0, .50);
}

    div.luxury-search .element-type-inventorysearch .form-group {
        width: 90%;
        margin: 0;
    }

    div.luxury-search .element-type-inventorysearch .btn-default {
        float: right;
        padding: 10px 0;
        color: #333;
        background-color: transparent;
    }

    div.luxury-search .element-container.element-type-inventorysearch,
    div.luxury-search div.form {
        padding-bottom: 0 !important;
        text-align: left;
    }

    div.luxury-search .element-type-inventorysearch .form-control {
        border-bottom: 0 !important;
        padding: 0;
        font-size: 20px;
        border: 0 !important;
        color: #555;
    }


@media (max-width: 991px) {
    div.luxury-search {
        position: relative;
        width: inherit;
        left: inherit;
        bottom: 0;
    }
}

/*********** Child Themes - H1,H2,H3 ***********/
.luxuryh1 span {
    font-size: 15px;
}

.luxuryh1 {
    font-weight: bold;
    color: #fff;
}

/*********** Child Themes - New Quick Links ***********/
.luxury-new-quicklink {
    padding-bottom: 25px;
    text-align: center;
    color: #fff;
}

    .luxury-new-quicklink a {
        text-decoration: none;
        display: block;
        transition: all 0.3s ease-in-out 0s;
        color: #fff;
    }

        .luxury-new-quicklink a:after {
            content: "";
            position: absolute;
            width: 50%;
            height: 4px;
            bottom: 25px;
            left: 25%;
            background-color: #317aff;
            visibility: hidden;
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
        }

    .luxury-new-quicklink:hover a:after {
        visibility: visible;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }

    .luxury-new-quicklink h4 {
        font-size: 30px;
        padding-bottom: 10px;
    }


/*********** Child Themes - Map Icon ***********/
.maptitle {
    text-align: center;
    border-bottom: 2px dashed;
}

    .maptitle i {
        font-size: 21px;
    }

    .maptitle h3 {
        display: inline-block;
        padding-left: 10px;
        font-family: 'Montserrat', sans-serif;
    }

/*********** Child Themes - Inverted Class ***********/
.inverted {
    background-color: #0a275b;
    border-top: 5px solid #0056b1;
    border-image: linear-gradient(to right, #ffc600 0%, #ffc600 25%, #0056b1 25%, #0056b1 50%, #0056b1 50%, #0056b1 75%, #ed1c24 75%, #ed1c24 100%) 1;
    border-image-width: 0px 0px 5px 0px;
}


/*********** Child Themes - Background img ***********/
/*body, body.main-body {
    background-size: cover !important;
}*/

.interstate .quicklinkbuttons-vertical {
    padding: 0 10px;
}

.test-drive-interstate1 {
    padding: 10px 25px;
}

/*********** Child Themes - Highway 2 ***********/
.inventory-slider-home .container {
    background: transparent !important;
}

.inventory-slider-home {
    background: url(images/newbgforluxuryrows.png);
}

    .inventory-slider-home .element-heading h4 {
        color: #828283;
        border-bottom: 2px solid #828283;
    }

    .inventory-slider-home .luxury-new-quicklink, .inventory-slider-home .luxury-new-quicklink a {
        color: #212121;
    }

        .inventory-slider-home .luxury-new-quicklink a:after {
            background-color: #212121;
        }

        .inventory-slider-home .luxury-new-quicklink a:hover {
            color: #212121;
        }

.luxury-map-invert {
    filter: invert(100%);
}

div.luxury-search .element-type-inventorysearch .form-control {
    color: #666;
}

/*********** Child Themes - Highway 3 ***********/
.highway3-quicklinks {
    padding-top: 50px;
}

    .highway3-quicklinks .quicklinkbutton-bigicon {
        background-color: #0a275b;
        border-radius: 100px;
        height: 100px;
        width: 100px;
        padding: 25px 0;
        font-size: 45px;
        left: 32%;
        margin-top: -107px;
        color: white !important;
    }

    .highway3-quicklinks .quicklinkbutton-label {
        color: #212121 !important;
        font-weight: 900;
    }

    .highway3-quicklinks a.buttonanim-bigicon {
        background: rgba(0,0,0,0) !important;
    }

        .highway3-quicklinks a.buttonanim-bigicon:hover,
        .highway3-quicklinks .quicklinkbutton:focus {
            background-color: rgba(0, 0, 0, 0) !important;
            border-color: rgba(153, 153, 153, 0);
        }

@media(max-width:768px) {
    .highway3-quicklinks .quicklinkbutton-bigicon {
        left: 42%;
    }
}

@media(max-width:480px) {
    .highway3-quicklinks .quicklinkbutton-bigicon {
        left: 38%;
    }
}

.luxuryh1.highway3 {
    color: #131110;
}

/*********** Child Themes - Interstate 2 ***********/
.padding-top-bottom {
    padding-top: 50px !important;
    padding-bottom: 25px !important;
}

.interstate2 .row .page-content-column:nth-child(2) {
    background-color: #404040;
    border-left: 1px dashed rgba(255, 255, 255, 0.3);
    border-right: 1px dashed rgba(255, 255, 255, 0.3);
    /*box-shadow: -3px -1px 13px rgba(162, 162, 162, .59);*/
}

.no-space .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


.interstate2 .row .page-content-column:nth-child(2) .element-heading h4 {
    border-color: #828283;
}

/*********** Child Themes - Interstate 3 ***********/
.interstate3-browseinventory img {
    max-width: 80px;
}

.have-padding {
    padding: 10px;
}

/*********** Disabling Menu Hover Effects for Small Devices ***********/
@media (max-width: 767px) {
    a.menu-heading span:after {
        display: none;
    }
}

.sitemap-links div {
    padding: 10px 0;
}

.sitemap-links div {
    margin-bottom: 10px !important;
}

/*********** CAR PAY ***********/
.accent-bg2{
    width: 90%;
    background: #d61414!important;
    padding: 16px 10px;
    border-radius: 0px;
border:0px;
    border-bottom: 3px solid #8a0000;
}
.accent-bg2:hover{
    background: #a00101 !important;
    border-bottom: 3px solid #ec1919;
text-decoration:none;
}

li.menu-heading.carpay-menu-item-wrapper {
     background: #d61414!important;
    border-radius: 0px;
    border-bottom: 3px solid #8a0000;
}
li.menu-heading.carpay-menu-item-wrapper>a:hover {
     background: #a00101 !important;
    border-radius: 0px;
}
li.menu-heading.carpay-menu-item-wrapper span {
    font-weight: 400;
}

/*****************************************************************************
NEW VDP LAYOUT 1 & 2
*****************************************************************************/

/** HEADER **/
.Automart-Price .element-type-price > div,
.automart-vdp-header .element-type-price > div {
    text-align: left !important;
}

.Automart-Price .element-heading.element-heading-price {
    display: none;
}

.automart-vdp-header a.creditapp {
    width: 100%;
    padding: 14px;
}

.automart-vdp-header a.loancalculator,
.automart-vdp-header a.loancalculator:hover,
.automart-vdp-header a.loancalculator:focus {
    color: #ffffff;
    background-color: transparent;
    border: none;
}

.automart-vdp-header .element-heading.element-heading-price {
    display: none;
}

.main-cta-links .vehicle-link {
    flex-grow: 1;
}

@media (min-width: 768px) {
    .automart-vdp-header .row {
        position: relative;
    }

    .main-cta-links .vehicle-links-container {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 8px !important;
    }

    .automart-vdp-header .row > div:not(.first-column) {
        position: absolute;
        bottom: 0;
        right: 0;
    }
    .automart-vdp-header .vehicle-links-container {
        align-items: center;
    }

    .automart-vdp-header .vehicle-link-creditapp {
        order: 2;
    }
}

/** Main **/
.vehicle-links-container .btn-default {

    transition: all 0.3s ease;
}

    .vehicle-links-container .btn-default:hover,
    .vehicle-links-container .btn-default:focus {
        transition: all 0.3s ease;

    }

.page-content-vdp-row .element-heading-featuredphoto {
    display: none;
}

.page-content-vdp-row .featured-photo div {
    display: flex;
}

.specifics-container{
    margin: 0px;
}

@media (min-width: 768px) {
    .page-content-vdp-row .sticky-column {
        top: 80px;
    }
}

/* Estimated Payment */
.layout-3-estimatedprice .element-heading-vehiclelinks {
    display: none;
}

.layout-3-estimatedprice .btn {
    width: max-content;
    padding: 12px 24px;
    height: auto !important;
}

/* Mileage */
.layout-3-mileage .specifics-container .row div {
    border: none;
}

.layout-3-mileage .specifics-container .row div {
    padding: 0px;
}

.layout-3-mileage .specifics-label {
    justify-content: flex-start;
    width: auto;
}

.layout-3-mileage .element-heading-vehiclespecifics {
    display: none;
}

.layout-3-mileage .specifics-container {
    margin: 0px;
}

.layout-3-bg {
    background-color: var(--clr-neutral-200);
}

/*****************************************************************************
NEW VDP LAYOUT 1 & 2
*****************************************************************************/

/* Header
*****************/
/* price */
.automart-vdp-header .element-container.element-type-price {
    max-width: max-content;
}

.automart-vdp-header .element-heading.element-heading-price {
    display: none;
}

.automart-vdp-header .element-type-price .accent-color1 {
    text-align: left !important;
}

/* cta buttons */
.automart-vdp-header .row {
    position: relative;
}

.main-cta-links div.vehicle-links-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
}

.main-cta-links .vehicle-link {
    width: 100%;
}

.automart-vdp-header a.btn.loancalculator {
    box-shadow: none;
    border: none;
    padding: 6px 12px;
}

.automart-vdp-header .vehicle-links-container {
    align-items: center;
}

.automart-vdp-header .vehicle-link-creditapp {
    order: 0;
}

.modal-content .automart-vdp-header div.row > div:not(.first-column) {
    position: relative !important;
}

/* wating for column class */ 
@media (min-width: 768px) {
    .automart-vdp-header div.row > div.col-lg-4:not(.first-column) {
        position: absolute;
        bottom: 0;
        right: 0;
        padding: 0px;
    }

    .main-cta-links div.vehicle-links-container {
        justify-content: flex-end;
        flex-direction: row;
    }

    .automart-vdp-header .vehicle-link-creditapp {
        order: 2;
    }

    .main-cta-links .vehicle-link {
        width: auto;
    }

}

/* highlight */
.element-type-vdpkeyfeatures .specifics-container {
    margin: 0px;
}

/*****************************************************************************
NEW VDP LAYOUT 3
*****************************************************************************/

/* price */
.layout-3-vprice.element-type-price {
    width: max-content;
    margin-bottom: 12px;
}

/* Estimated Payment */
.layout-3-estimatedprice {
    width: max-content;
}

.layout-3-estimatedprice .element-heading-vehiclelinks {
    display: none;
}

.layout-3-estimatedprice .btn {
    width: max-content;
    padding: 12px 24px;
    height: auto !important;
}

/* Mileage */
.layout-3-mileage .specifics-container .row div {
    padding: 0px;
    border: none;
}

.layout-3-mileage .specifics-label {
    justify-content: flex-start;
    width: auto;
}

.layout-3-mileage .element-heading-vehiclespecifics {
    display: none;
}

.layout-3-mileage .specifics-container {
    margin: 0px;
}

/*****************************************************************************
NEW VDP LAYOUT 4
*****************************************************************************/
/* HEADER */
.layout-4-header .specifics-container {
    margin: 0px;
}

.layout-4-price {
    padding-bottom: 12px;
}

.layout-4-vehiclelinks,
.layout-4-price,
.layout-4-header .specifics-label {
    width: max-content;
}

.layout-4-header .element-heading-vehiclespecifics,
.layout-4-header .element-heading-vehiclelinks {
    display: none;
}

.layout-4-header .specifics-container .row div {
    border-top: none;
    padding: 0px;
}

.layout-4-vehiclelinks div.vehicle-link {
    flex-grow: 0;
}

    .layout-4-vehiclelinks div.vehicle-link .btn {
        height: auto;
        padding: 6px 12px;
        border: none;
    }

.layout-4-vehiclelinks .vehicle-links-container {
    display: flex;
    justify-content: flex-end;
}

.layout-4-price .element-type-price > div {
    text-align: right !important;
}

.layout-4-price .internetvalue,s
.layout-4-price .showroomlabel {
    padding-right: 0px !important;
}

.layout-4-header .container {
    position: relative;
}

.layout-4-vehiclelinks div.vehicle-link .btn-default {
    box-shadow: none;
}

    .layout-4-vehiclelinks div.vehicle-link .btn-default:hover,
    .layout-4-vehiclelinks div.vehicle-link .btn-default:active,
    .layout-4-vehiclelinks div.vehicle-link .btn-default:focus {
        text-decoration: none;
    }


ul.nav-pills,
.nav-pills li {
    padding: 4px;
}

ul.nav-pills {
    border-radius: 4px;
}

.vdp-contactform-4 {
    border-radius: 4px;
}

.pageid-ivd .element-heading.element-heading-dealershipinfo {
    padding: 0px;
}

.pageid-ivd .element-data-column {
    padding: 0px;
}


@media (min-width: 992px) {
    .layout-4-header .row > div:has(.internetvalue),
    .layout-4-header .row > div:has(.layout-4-price) {
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .layout-4-vehiclelinks,
    .layout-4-price,
    .layout-4-header .specifics-label {
        width: auto;
    }
}
