﻿@import url('https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    /* Font families */
    --ff-primary: "Exo 2", sans-serif;
    --ff-secondary: "Inter", sans-serif;
    --ff-heading: var(--ff-primary);
    --ff-body: var(--ff-secondary);
    /* Font weights */
    --fw-light: 300;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-bold: 700;
    /* Bootstrap-based font sizes */
    --fs-100: 0.875rem; 
    --fs-200: 1rem; /* 16px */
    --fs-300: 1.25rem; 
    --fs-400: 1.5rem; 
    --fs-500: 1.75rem; 
    --fs-600: 2rem; 
    --fs-700: 2.5rem; 
    /* Semantic font sizes */
    --fs-body: var(--fs-200);
    --fs-primary-heading: var(--fs-700);
    --fs-secondary-heading: var(--fs-600);
    --fs-sub-heading: var(--fs-500);
    --fs-nav: var(--fs-200);
    --fs-sm-text: var(--fs-100);
    --fs-button: var(--fs-100);
}

/* Large screens */
@media (min-width: 768px) {
    :root {
        --fs-primary-heading: 3rem; 
        --fs-secondary-heading: 2.5rem; 
        --fs-sub-heading: 2rem; 
    }
}

@media (max-width: 1599.98px) {
    .shareToSocialMedia {
        font-size: 0; /* hides text but keeps element layout */
        height: 42px;
        width: 42px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .shareToSocialMedia i {
            font-size: 1rem; /* restore icon size */
        }
}

/* ============================================
   SEARCH FORM
============================================ */
.searchform .form {
    background: white;
    padding: 4px;
    border: 1px solid #e9e9e9;
    gap: 4px;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    width: max-content;
}

.searchform .form-group {
    height: 44px;
}

.searchform label {
}

.searchform input {
    border: none;
    width: 100% !important;
    box-shadow: none;
}

.searchform .form {
    display: flex;
    align-items: flex-end;
}

.searchform .form-group {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    margin-bottom: 0px;
}

.searchform .btn {
    height: 44px;
    transition: all 0.3s ease;
    font-size: var(--fs-body);
}

.searchform h4 {
    font-size: var(--fs-primary-heading);
    text-align: center;
    text-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.searchform .element-heading-inventorysearch {
    padding-bottom: 0px;
}

/* ============================================
   VDP - VEHICLE DETAILS PAGE
============================================ */
.pageid-ivd h1.pagetitle {
    font-size: var(--fs-sub-heading);
    margin-top: 10px;
    margin-bottom: 10px;
}

.internetvalue {
    font-size: var(--fs-400)!important;
}
.internetlabel {
    font-size: var(--fs-300) !important;
}

.pageid-ivd .modal-content {
    box-shadow: none!important;
}

.vehicle-panel-label {
    text-align: center;
    padding: 10px;
    text-transform: capitalize;
    font-size: var(--fs-sm-text);
}

.pageid-ivd .container {
    padding-bottom: 20px;
}

.vdp-25-1-header .container {
    padding-bottom: 0px;
}

/* ============================================
   FOOTER
============================================ */
div.footer-container {
    font-size: var(--fs-body);
    padding: 0px;
}

.footer-layout-container {
    padding-top: 20px;
    padding-bottom: 20px;
}

.page-bottom .container {
    padding-top: 10px;
}

/* ============================================
   NAVBAR
============================================ */
.navbar-default {
    box-shadow: none;
    border-bottom: 0px;
}
.navbar .container {
    background-color: white;
    border-bottom: 1px solid;
}

.navbar .navbar-nav {
    padding: 10px 0px;
}

@media(min-width: 768px) {
    .navbar-header .navbar-brand:not(:has(img)) {
        position: absolute; /* centers home navbrand */
        top: 0;
        bottom: 0;
        margin: auto 0;
    }
}

/* ============================================
   BANNER
============================================ */
.banner-links-bar {
    padding: 0px;
    font-size: var(--fs-body);
}

a.banner-link {
    text-shadow: none;
    font-size: var(--fs-body);
}

.media-icon-circle {
    box-shadow: none;
}

.banner-links-bar .phonenumber-link, 
.banner-links-bar .address-link, 
.banner-links-bar .social-media-links {
    padding: 10px 0px;
}

.banner-links-bar .social-media-links {
    margin-right: 10px;
}

.banner-links-bar-wrapper > div:not(:first-child) {
    border-right: 1px solid var(--clr-neutral-200); /* or any color you want */
    padding-right: 1rem;
    margin-right: 1rem;
}

/* ============================================
   BROWSE INVENTROY - HOMEPAGE
============================================ */
.home-browse .browse-inventory-link {
    margin-bottom: 10px;
}

/* ============================================
   INVENTORY - HOMEPAGE
============================================ */
.inv-grid.gallery-view {
    text-align: center; /*center bttn*/
}

.homepage-inventory .inventory-header {
    display: none;
}

.view-all-inventory .btn {
    transition: all 0.3s ease;
    transition: all 0.3s ease;
    font-size: var(--fs-body);
    padding: 12px 24px;
}

/* ============================================
   QUICKLINKS
============================================ */
.element-heading-quicklinkbuttons,
.element-heading-quicklinkbuttons h4 {
    padding: 0px;
    margin: 0px;
}

.element-heading.element-heading-quicklinkbuttons {
    padding-bottom: 0px;
}

div.custom-quicklinkbuttons-container {
    margin-top: 0px;
}

a.custom-brand-visitWebsite.custom-brand-visitWebsite {
    flex-direction: column;
    font-size: 24px;
}
a.custom-brand-visitWebsite:hover,
a.custom-brand-visitWebsite:active,
a.custom-brand-visitWebsite:focus {
    text-decoration: none;
}

a.custom-brand-visitWebsite .font-type {
    font-family: var(--ff-primary) !important;
    font-weight: var(--fw-bold);
}

/* Icons */
.custom-brand-bottom a[href*="view-inventory"]::before {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    content: "\f85b";
    font-style: normal;
    display: inline-block;
}

.custom-brand-bottom a[href*="credit-application"]::before {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    content: "\e1d9";
    font-style: normal;
    display: inline-block;
}

.custom-brand-bottom a[href*="schedule-test-drive"]::before {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    content: "\f073";
    font-style: normal;
    display: inline-block;
}

.custom-brand-bottom a[href*="contact-us"]::before {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    content: "\f4b6";
    font-style: normal;
    display: inline-block;
}


.custom-quicklinkbutton-wrapper {
    height: 150px!important;
}

.custom-brand-bottom {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-brand-visitWebsite i {
    display: none;
}

/* Pageload Animation */
.homepage-ql .custom-quicklinkbutton-wrapper {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 1s ease-out forwards;
}

.custom-quicklinkbutton-wrapper:nth-child(1) {
    animation-delay: 0.4s;
}

.custom-quicklinkbutton-wrapper:nth-child(2) {
    animation-delay: 0.6s;
}

.custom-quicklinkbutton-wrapper:nth-child(3) {
    animation-delay: 0.8s;
}

.custom-quicklinkbutton-wrapper:nth-child(4) {
    animation-delay: 1s;
}

.custom-quicklinkbutton-wrapper:nth-child(5) {
    animation-delay: 1.4s;
}

.custom-quicklinkbutton-wrapper:nth-child(6) {
    animation-delay: 1.6s;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Hover Effect */
.custom-brand-visitWebsite {
    transition: transform 0.3s ease;
}

.custom-quicklinkbutton-wrapper:hover .custom-brand-visitWebsite {
    transform: scale(1.1);
}

/* ============================================
   HERO SECTION
============================================ */
.hero-row .element-type-slideshow {
    margin-bottom: -6px;
    overflow: hidden;
}

.home-search {
    margin-bottom: 30px;
}

.home-search .form {
    background: white;
    padding: 4px;
    border: 1px solid #e9e9e9;
    gap: 4px;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.home-search .form-group {
    height: 44px;
    width: 100%;
}

.home-search label {
    display: none;
}

.home-search input {
    border: none;
    width: 100% !important;
    box-shadow: none;
}

.home-search .form {
    display: flex;
    align-items: flex-end;
}

.home-search .form-group {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    margin-bottom: 0px;
}

    .home-search .btn {
        height: 44px;
        transition: all 0.3s ease;
        font-size: var(--fs-body);
    }

.home-search h4 {
    font-size: var(--fs-primary-heading);
    text-align: center;
    text-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.home-search .element-heading-inventorysearch {
    padding-bottom: 0px;
}


@media (min-width: 768px) {
    .hero-row {
        position: relative;
    }

    .home-search {
        position: absolute;
        left: 50%;
        top: 30%;
        transform: translate(-50%, -50%);
        width: max-content;
    }
}


/* ============================================
   GENERAL
============================================ */
@media (min-width: 1400px) {
    .container {
        width: 1400px;
    }
}

@media (min-width: 1600px) {
    .container {
        width: 1600px;
    }
}

/* ============================================
   TYPOGRAPHY
============================================ */

html {
    font-size: 100%;
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: var(--ff-body);
    font-size: var(--fs-body);
    line-height: inherit;
}

/* heading */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--ff-heading);
    line-height: 1.2;
    font-weight: var(--fw-bold);
    margin: 0.5em 0;
    text-wrap: balance;
}

h1 {
    font-size: var(--fs-primary-heading);
}

h2 {
    font-size: var(--fs-secondary-heading);
}

h3 {
    font-size: var(--fs-sub-heading);
}

h4 {
    font-size: var(--fs-500);
}

h5 {
    font-size: var(--fs-400);
}

h6 {
    font-size: var(--fs-300);
    font-weight: var(--fw-medium);
}


a {
    text-decoration: none;
    font-size: var(--fs-body);
}

    a:hover,
    a:focus {
        color: inherit;
    }

input {
    cursor: text;
}

.subheading {
    font-size: var(--fs-sub-heading);
    font-weight: var(--fw-regular);
    line-height: 1.2;
    text-wrap: balance;
}

.element-heading {
    padding-top: 0;
    padding-bottom: 8px;
}

.form-control {
    padding: 0.5em 1em;
    height: auto;
}

.page-content .container,
.page-content .container-fluid {
    background-color: transparent;
}

.pageid-hom {
    h1, h2, h3,
    h4, h5, h6 {
        text-align: center;
    }
}


/* MISC
*************************************/

a.vehicle-panel:hover {
    text-decoration: none;
}
div.testimonial {
  position: relative;
  z-index: 10;
}

/*************************************
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-family: "Open Sans",sans-serif;
    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(255, 180, 0, 0.59);
    color:rgba(95,95,95,1);
}
span.quicklinkbutton-label-img:hover span{right:33px;}
span.quicklinkbutton-anim-img {
    position: absolute;
    right: -10px;
    transition: all .5s ease;
}
/*End Luxury Quick Links*/

@media screen and (max-width: 1199px) {
  #btnul { margin-top: 18px; }
}
@media screen and (max-width: 991px) {
  #btnul { margin-top: 0; }
}


.browse-inventory-image a{
    color:#828283;
}
.browse-inventory-image a:hover {
     color:#828283;
}

.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)   
}

.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;
}
li.menu-heading.carpay-menu-item-wrapper a {
    color: #fff !important;
}

/*****************************************************************************
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 .element-type-vehiclelinks {
        padding: 15px;
    }

    .main-cta-links .vehicle-link {
        width: auto;
    }
}

/* highlight */
.element-type-vdpkeyfeatures .specifics-container {
    margin: 0px;
}

/*****************************************************************************
NEW VDP LAYOUT 3
*****************************************************************************/
.page-content-vdp-row .element-type-price,
.layout-3-estimatedprice  {
    width: max-content;
}

.layout-3-estimatedprice {
    padding-top: 12px;
}

.pageid-ivd .specifics-container {
    margin: 0px;
}

/* Estimated Payment */
.layout-3-estimatedprice .element-heading-vehiclelinks {
    display: none;
}


/* 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;
}

.page-content-vdp-row {
    padding: 0px!important;
}

/*****************************************************************************
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 .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;
}

.layout-4-price .element-type-price > div {
    text-align: left !important;
}


@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;
    }

    .layout-4-price {
        margin-left: auto;
    }

    .layout-4-price .element-type-price > div {
        text-align: right !important;
    }
}

/***************************
  VDP 5-12
***************************/
/******** HEADER ***********/
.vdp-25-1-header {
    display: none;
}

.vdp-25-1-header {
    .vehicle-links-container

{
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 10px;
}

.vehicle-link .btn {
    max-width: max-content;
    padding: 10px 20px;
}

}

@media (min-width: 768px) {
    .vdp-25-1-header {
        display: block;
    }

        .vdp-25-1-header .vehicle-links-container {
            flex-direction: row;
        }
}


/******** QUICK CONTACT ***********/
.element-type-vdpquickcontactform.vdp-25-1 {
    border: 1px solid #DEDEDE;
    border-radius: 4px;
    padding: 20px;
    margin-bottom: 20px;
}

    .element-type-vdpquickcontactform.vdp-25-1 .btn {
        max-width: 100%;
    }

@media (max-width: 767.98px) {
    .element-type-vdpquickcontactform .btn-default {
        width: 100%;
        padding: 10px 20px;
    }
}

/******** BODY ***********/
/* mobile buttons */
.vdp-25-1-mobile .vehicle-link .btn {
    padding: 10px 20px;
}

.vdp-25-1-mobile .element-heading-vehiclelinks {
    padding: 0px;
}

.vdp-25-1-mobile .element-outer-container.element-type-vdpquickcontactform,
.vdp-25-1-mobile div.vehicle-link {
    padding-bottom: 10px;
}


.vdp-25-1 {
    .vdp-25-1-bg.element-outer-container

{
    border-radius: 4px;
    padding: 20px;
    margin-bottom: 20px;
}

.flex-container-features {
    gap: 10px;
}

.vehicle-links-container .vehicle-link {
    margin-bottom: 10px;
}

.flex-item-features {
    padding: 20px;
    border: 1px solid #E3E3E3;
    margin-bottom: 10px;
    border-radius: 4px;
}

.vehicle-link,
.vehicle-link .btn,
.element-type-vdpquickcontactform .btn {
    width: 100%;
}

    .vehicle-link .btn,
    .element-type-vdpquickcontactform .btn {
        padding: 10px 20px;
    }

.vehicle-link {
    padding-left: 15px;
    padding-right: 15px;
}

.element-type-price > div {
    text-align: right !important;
}

.element-heading {
    padding-left: 0px;
    padding-right: 0px;
}

.vehicle-link .btn {
    padding: 10px 20px;
}

}

@media (max-width: 767.98px) {
    .vdp-25-1 {
        .flex-container-features

{
    flex-direction: column;
    column-count: 1;
}

}
}

/******** BOTTOM NAV ***********/
.vdp-25-1-bottomnav {
    position: sticky;
    bottom: 0px;
    z-index: 1;
}

.vdp-25-1-bottomnav {
    position: sticky;
    bottom: 0px;
}

    .vdp-25-1-bottomnav .creditapp.btn-default {
        padding: 10px 20px;
    }


@media (min-width: 768px) {
    .vdp-25-1-bottomnav {
        display: none;
    }
}

/******** update ***********/
.vdp-25-1-bg .vehicle-link,
.vdp-25-1-bg a.btn {
    width: 100%;
}

.vdp-25-1-bg .vehicle-link {
    padding-bottom: 10px;
}

.element-type-vehiclelinks.vdp-25-1-bg {
    padding: 20px 35px;
    border-radius: 4px;
}

.vdp-25-1-bg .element-heading-vehiclelinks,
.vdp-25-1-bg .element-heading-vehiclehistory {
    padding: 0px;
}

h5 {
    font-size: var(--fs-sub-heading) !important;
}

.element-type-vehiclelinks.vdp-25-1-bg {
    border: 1px solid;
}

@media(min-width: 768px) {
    .specifics-label,
    .specifics-value {
        font-size: 14px;
        width: 100%;
    }

    .vdp-25-1-header .vehicle-links-container {
        flex-wrap: wrap;
    }

    div.vehicle-description {
        font-size: inherit;
    }
}