/****************************
    NAVBAR
******************************/
@media (max-width: 767.5px) {
    .navbar-default {
        background: var(--clr-neutral-900) !important;
    }
}

@media (min-width: 768px) {
    .navbar-default, .navbar-fixed-top, div:has(.pageid-hom) .navbar-default, div:has(.pageid-hom) .navbar-default.dynamic-fixed.navbar-fixed-top {
        background: var(--clr-neutral-900) !important;
        background-color: var(--clr-neutral-900);
    }
}

/****************************
    ABOUT US PAGE
******************************/

.text-3,
.text-4 {
    font-size: 20px;
    text-align: center;
    padding-bottom: 20px;
    font-weight: 600;
}

@media (min-width: 768px) {
.p-t-50.p-t-50 {
    padding-top: 50px;
}
.text-3 {
    font-size: 28px;
}
.text-4 {
    font-size: 36px;
}
}

/***** spacing *****/
@media (min-width: 768px) {
.m-d-t-50 {
    margin-top: 50px;
}
.m-d-b-50 {
    margin-bottom: 50px;
}
}

/****************************
    GRID
******************************/
.container-grid {  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 20px;
  grid-auto-flow: row;
  grid-template-areas:
    "left-1 right-1"
    "left-2 right-1";
}

.right-1 { grid-area: right-1; }

.left-1 { 
    grid-area: left-1;
background-image: url(https://automanagerprodcdn.azureedge.net/wmclients/008807/images/redmountainmotors-117-topleft.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat; 
}

.left-2 { 
    grid-area: left-2; 
background-image: url(https://automanagerprodcdn.azureedge.net/wmclients/008807/images/redmountainmotors-53-bottomleft.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat; 
}

/****************************
    home hero
******************************/
.cus-hom-backimg {
    min-height: 800px;
    background-position: center;
    position: relative;
}

.cus-hom-backimg .container {
    position: absolute;
    top: 0;
    left:0;
    right:0;

  margin-left: auto;
  margin-right: auto;
}

.page-content .container {
    background-color: transparent;
}

/****************************
    IMAGES
******************************/
.element-container.element-type-libraryimage {
    padding: 15px;
}

.circle-img img {
    border-radius: 50%;
}

/* misc */
 .pageid-hom .lazy-background .container {
    background-color: transparent!important;
    padding-top: 105px!important; /*old 340px*/
    padding-bottom: 100px!important;
}

.pageid-dau .lazy-background .container {
    background-color: transparent!important;
    padding-top: 180px!important;
    padding-bottom: 150px!important;
}

.pageid-dau .lazy-background {
    background-position: center;
}

@media (min-width: 768px) {
.pageid-dau .lazy-background {
    padding-top: 12%!important;
    padding-bottom: 12%!important
}
}

/****************************
    HERO SECTION
******************************/
.hero-1 {
    background-color: #212121;
   color: #fff!important;
}
.hero-1 .container,
.hero-1 .container-fluid {
    background-color: transparent;
}

.cent-col-lrg.hero-1 .hero-btn .customhtml {
display: flex;
justify-content: space-evenly;
}

@media (min-width: 1199px) {
    .hero-section a.quicklinkbutton, .ghost-bttn a.quicklinkbutton {
        max-width: 100%;
        margin-inline: auto !important;
    }
.hero-1 .container-fluid {
    margin-left: calc(max((100vw - 1400px) / 2 + 32px, 32px));
}
.hero-1 .element-container.element-type-libraryimage {
    padding: 0px!important
}
}

/****************************
    INVENTORY LIST
******************************/
.pricevalue1.accent-color2 {
    color: #fff!important;
}

.home-inv .palette-bg2.inventory-header,
.home-inv  .palette-bg2.inventory,
.home-inv .col-sm-12 {
    background-color: transparent!important;
}

.thumbnail-overlay-price {
    display: inline-block;
    padding-left: 8px;
    font-size: 32px;
    align-self: center;
    FONT-WEIGHT: 900;
}

.inventory-list-row.inv-grid.gallery-view .col-sm-12 {
    padding: 0px;
}

.inventory-list-row a.btn-default {
    background-color: black;
    border-color: black;
}

.inventory-list-row a.btn-default:hover,
.inventory-list-row a.btn-default:focus,
.inventory-list-row a.btn-default:active {
    background-color: black;
    border-color: black;
    opacity: .8;
    box-shadow: none;
}

.element-container.element-type-inventorylisttitle, 
.element-container.element-type-inventorylistdata,
.promptAvailabilityBtn {
    padding: 0px 15px;
}

.view-all-inventory a.btn-default {
    border-color: var(--clr-neutral-175) !important;
    background-color: var(--clr-neutral-100);
    color: var(--clr-neutral-800);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}

.view-all-inventory a.btn-default:hover,
.view-all-inventory a.btn-default:focus,
.view-all-inventory a.btn-default:active {
border-color: var(--clr-primary-300) !important;
    background-color: transparent;
    box-shadow: none;
}

.btn-check-availability {
    width: 100%!important;
}


/****************************
    TYPOGRAPHY
******************************/
h2.display.display,
h1.display.display  {
    font-size: 24px!important;
}

.subheading {
    font-size: 18px;
}

.subheading-2 {
    font-size: 18px;
}

@media (min-width: 768px) {
h2.display.display,
h1.display.display {
    font-size: 50px!important;
}
.subheading-2 {
    font-size: 20px;
}
}


/****************************
    GENERAL
******************************/
.back-white {
    /*background-color: rgb(255 255 255 / 75%);*/
    background-color: rgb(0 0 0 / 50%);
    margin-bottom: 3rem !important;
    padding: 1rem 6vw !important;
}

.back-white h2 {
    font-size: 3.2rem !important;
    text-wrap: pretty;
    font-weight: lighter !important;
    font-family: sans-serif !important;
    color: #fff;
}

.p-b-20 {
    padding-bottom: 20px;
}
.m-b-20 {
    margin-bottom: 20px;
}

@media (min-width: 768px) {
.vert-center {
    padding-top: 80px!important;
    padding-right: 40px;
}
}

@media (min-width: 1400px) {
    .container {
        width: 1400px;
    }
    .cent-col .first-column {
        padding-top: 20px!important;
        padding-right: 80px;
    }
    .cent-col-lrg .first-column {
        padding-top: 40px!important;/*110px*/
        padding-right: 4vw;
    }
   .p-t-50 {
        padding-top: 50px!important;
    }
    .p-t-100 {
        padding-top: 100px!important;
    }
    .p-t-150 {
        padding-top: 150px!important;
    }
}

h1, h2, h3, h4, h5, h6 {
   text-wrap: wrap;
}

@media (min-width: 1200px) {
   .pageid-hom .review-section {
       padding-bottom: 5rem;
       padding-top: 5rem;
   }
   .pageid-hom .review-section:first-child {
       padding-bottom: 5rem;
       padding-top: 0;
   }
}

/****************************
NAVBAR
******************************/
.menu-container {
    position: sticky;
    top: 0;
    z-index: 9999;
}

.navbar-header {
    margin:10px 0px;
}

.navbar.navbar-top {
    z-index: 9999;
}


/****************************
    Media screen Adjustments
******************************/
.hero-1 .element-container.element-type-libraryimage {
        padding: inherit !important;
}

@media (max-width: 520px) {
   .cent-col-lrg.hero-1 .hero-btn .customhtml {
       display: block;
   }

   .hero-1 .prim-button-1 {
      width: 100%;
    }
}

@media (max-width: 620px) {
   .review-section .prim-button-1 {
      width: 100%;
    }
}

@media (max-width: 767.98px) {
a.navbar-brand img {
    max-height: 70px!important;
}
}

@media (min-width: 768px) {
    div:has(.pageid-hom) .navbar-default.dynamic-fixed {
        background-color: var(--clr-primary-400) !important;
    }
}

@media (min-width: 1200px) {
    .navbar.navbar-top .container {
        width: 1400px;
    }
}

@media (min-width: 768px) {
    .navbar.navbar-top .container {
        max-width: 1400px;
    }
}

/*previous min-width: 768px*/
@media (min-width: 768px) {
    .navbar-collapse.collapse {
        display: none!important;
    }
}

@media (min-width: 768px) {
    .navbar-toggle {
        display: block;
    }
}

@media (min-width: 768px) {
    span.navbar-right-menu-icon {
        display: block;
    }
}

@media (min-width: 768px) {
    p.navbar-right-menu-label {
        display: block;
    }
}

@media (min-width: 768px) {
    .navbar-header {
        width: inherit;
    }
}

@media (min-width: 768px) {
    a.navbar-brand img {
        width: 100% !important;
        min-width: inherit;
    }
}

@media (max-width: 991px) {
    .col-sm-6 {
        width: inherit;
        float: none;
    }
}

@media (max-width: 991px) {
    .col-md-4 {
        width: inherit;
    }
}

@media (min-width: 768px) {
    .hero-1 .element-container.element-type-libraryimage {
        padding: inherit !important;
    }
}

@media (min-width: 1199px) {
    .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important;
    }
}

@media (min-width: 1199px) {
    .navbar-toggle {
        display: none;
    }
}

@media (min-width: 1199px) {
    span.navbar-right-menu-icon {
        display: none;
    }
}

@media (min-width: 1199px) {
    p.navbar-right-menu-label {
        display: none;
    }
}

@media (min-width: 1199px) {
    .navbar-header {
        width: 20%;
    }
}

@media (max-width: 1199px) {
    .navbar-header {
        display: flex;
        align-items: center;
    }
}

/*previous max-width: 767.98px*/
@media (max-width: 1199px) {
    a.navbar-brand img {
        max-height: 70px !important;
    }
}

@media (min-width: 1199px) {
    a.navbar-brand img {
        width: 100% !important;
        min-width: 250px;
    }
}

@media (max-width: 1199px) {
    .navbar-right-menu-icon {
        order: 5;
    }
}

@media (max-width: 1199px) {
    .navbar-toggle {
        order: 6;
    }
}

@media (max-width: 1199px) {
    .navbar-right-menu-label {
        order: 7;
    }
}

@media (min-width: 1199px) {
    .col-sm-6 {
        width: 50%;
    }
}

@media (min-width: 1199px) {
    .hero-1 .element-container.element-type-libraryimage {
        padding: 0!important;
    }
}

/****************************
    BUTTONS
******************************/

/* Buttons */
.view-all-inventory .inventory .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    margin: 8px;
    gap: 8px;
}

.prim-button-1,
.btn-check-availability {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000;
    color: #fff;
    text-decoration: none;
    padding: 12px 32px;
    min-height: 50px;
    width: max-content;
    transition: all 0.5s;
    gap: 8px;
    border-radius: 0px;
    border-color: #000;
    margin-bottom: 20px;
    border: 1px solid;
}

.hero-1 .prim-button-1 {
    border-color: #fff;
}

.hero-1 .prim-button-1:hover, .prim-button-1.red:hover {
 border-color: #fff;
}

.hero-1 .prim-button-1:hover,
.hero-1 .prim-button-1:active,
.hero-1 .prim-button-1:focus {
  background-color: #fff;
  color: #000 !important;
}

.prim-button-1.red {
   background-color: #db2e34;
   border-color: #db2e34;
}

.btn-check-availability {
    margin-inline: auto;
    margin-top: 16px;
}

.prim-button-1:hover,
.prim-button-1:active,
.prim-button-1:focus,
.btn-check-availability:hover,
.btn-check-availability:active,
.btn-check-availability:focus {
    background-color: #000;
    border-color: #000;
    color: #fff;
    opacity: .8;
    color: #fff!important;
    text-decoration: none;
}

/****************************
MENU
******************************/
@media (min-width: 768px) {
    a.navbar-brand img {
        width: 100% !important;
        min-width: 250px;
    }
}

.navbar-default .navbar-nav > li:nth-last-child(1) > a {
    background-color: #db2e34 !important;
    border: 1px solid;
    border-color: #db2e34;
    margin-left: 10px;
}/*originally li:nth-last-child(1) last element is temporary hidden*/

.navbar-default .navbar-nav > li:nth-last-child(2) > a {
    border: 1px solid;
    border-color: white;
}

.navbar-default .navbar-nav > li:nth-last-child(1) > a, .navbar-default .navbar-nav > li:nth-last-child(2) > a {
   padding: 10px 8px;
}


/****************************
    Here’s how it works
******************************/

.first-box .subheading {
padding-top: 20px;
}

@media (min-width: 991px) {
    .first-box .subheading {
         padding-top: 3.3rem;
     }
}

/****************************
    VDP
******************************/
div.vehicle-link:last-child .btn-default {
    border-color: #db2e34 !important;
    background-color: #db2e34;
    color: #fff;
}

div.vehicle-link:last-child .btn-default:hover, div.vehicle-link:last-child .btn-default:active {
    border-color: var(--clr-neutral-175) !important;
}

/****************************
    TESTIMONIAL
******************************/
.review-img-horizontal .element-container.element-type-libraryimage img:not([src*="star-rating"]) {
max-width: 556px;
}

.review-img-vertical .element-container.element-type-libraryimage img:not([src*="star-rating"])  {
    width: 70% !important;
    max-width: 500px;
}


/****************************
    Privacy Policy
******************************/