:root {
    --primary-color: #bd1b1b;
    --secondary-color: #b51721;
    --bs-font-sans-serif: "DM Sans", "Arial", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 15pt;
    --bs-body-font-weight: 400;
    --bs-primary: var(--primary-color);
    --bs-primary-rgb: 189, 27, 27;
    --bs-secondary: var(--secondary-color);
    --bs-secondary-rgb: 181, 23, 33;
    --bs-body-bg: #fff;
    --bs-body-color: #262626;
    --bs-body-color-rgb: 38, 38, 38;
    --light-grey: #f2f2f2;
    --dark-grey: #585859;
    --bs-black: #262626;
    --bs-white: #FFFFFF;
}


/*********************************
           Service providers
**********************************/
@media (min-width: 768px) {
    .service-provider-left-card {
        padding-right: 30px;
    }
}

.provider-icon {
    height: 20px;
    width: 20px;
}


/*********************************
           General
**********************************/

.home-product-description {
    font-size: 20px;
}

body {
    font-size: 17px;
}

.footer-title {
    font-weight: bold;
    font-size: 15px;
}

.footer-text {
    font-size: 13px;
    font-weight: 500;
}

.link-unstyled,
.link-unstyled:link,
.link-unstyled:hover {
    color: inherit;
    text-decoration: inherit;
}

.dropdown-unstyled {
    padding: 0;
}

.bg-light-grey {
    background-color: var(--light-grey);
}

.img-100 {
    max-height: 100px;
}

.img-400 {
    max-height: 400px;
}

@media (max-width: 767px) {
    .no-background-sm-or-smaller {
        background-image: none !important;
    }
}

@media (max-width: 991px) {
    .no-background-md-or-smaller {
        background-image: none !important;
    }
}

.bold {
    font-weight: bold;
}

.bg-contact {
    background-color: #f7f7f7;
}

.bg-inventory {
    background-color: #f7f7f7;
}

.text-grey {
    color: #bfbfbf;
}

.product-image {
    max-height: 200px;
}

.sold-banner-text {
    rotate: -45deg;
    font-size: 40px;
    position: absolute;
    left: 0;
    top: 25px;
    font-weight:bold;
    color: white
}

.sold-banner {
    background-color: var(--primary-color);    
    height: 150px;
    position: absolute;
    top: 0px;
    clip-path: polygon(100% 0%, 50% 0%,0% 50%,0% 100%);
    width: 150px;
}

.sold-banner-container {
    position: relative
}

.modal-body .card-body {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}

/***
    Parts
*/
.part-image {
    max-height: 100px;
}

/*********************************
    Banner
**********************************/
.banner-video-overlay {
    position: absolute;
    top: 0;
    left: 0px;
    height: 100%;
}


.banner-video-container {
    position: relative;
}

.ratio-banner {
    aspect-ratio: calc(42 / 9);
}

.banner-video-container img {
    width: 100%;
    height: 100%;
}

.banner-video-container video {
    max-height: 100%;
    object-fit: cover;
}

.home-banner-video {
    max-height: 600px !important;
}

/*********************************
         Team
**********************************/
.team-img {
    max-height: 300px
}

.short-bio {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* number of lines to show */
    line-clamp: 3;
    -webkit-box-orient: vertical;
}

.bio {
    display: none;
}

.bio-button {
    cursor: pointer;
}

/*********************************
    Bootstrap overrides
**********************************/
@media (min-width: 1600px) {
    .container {
        max-width: 1520px;
    }
}




.modal.fade .modal-dialog {
    max-width: 600px;
}


.btn {
    text-transform: uppercase;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:active:focus {
    background-color: var(--primary-color);
    border-width: 2.5px;
    border-color: var(--primary-color);
}

    .btn-primary:focus,
    .btn-primary:active:focus {
        box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.5);
    }

.btn-outline-primary,
.btn-outline-primary:focus,
.btn-outline-primary:active:focus {
    color: var(--primary-color);
    border-width: 2.5px;
    border-color: var(--primary-color);
}

    .btn-outline-primary:focus,
    .btn-outline-primary:active:focus {
        box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.5);
    }

    .btn-outline-primary:hover,
    .btn-outline-primary:active,
    .btn-outline-primary:active:focus {
        color: var(--bs-body-bg);
        border-color: var(--primary-color);
        border-width: 2.5px;
        background-color: var(--primary-color);
    }

/*********************************
           Navbar
**********************************/

.navbar-header {
    background-color: #cc0814;
}

@media(min-width: 992px) {
    .navbar-header {
        background: linear-gradient(105deg, #f2f2f2 60%, #cc0814 60%);
    }


}

.navbar-icon {
    height: 25px;
}

.icon {
    height: 25px;
}

.navbar-logo {
    height: 50px;
    width: auto;
}

.navbar-toggler {
    color: var(--bs-primary);
}

.navbar-sm-logo {
    max-height: 40px;
    width: auto;
    max-width: 80%;
}

.bullet-heading {
    color: #262626;
    font-weight: normal;
    font-size: 20px;
    margin-bottom: 0px;
}

.copyright {
    font-size: 10px;
    font-style: italic;
}


.navbar-item > a:hover,
.navbar-item > a:focus,
.navbar-item > a:focus-within,
.navbar-item > a:focus-visible,
.navbar-active > a {
    border-bottom: var(--bs-primary) 3px solid;
    color: var(--bs-primary);
    padding-bottom: 5.5px;
    margin-bottom: -9px;
    text-decoration: none;
    cursor: pointer;
}

.navbar-item > a:active,
.navbar-item .dropdown-item:active {
    color: var(--bs-primary);
}

.navbar-item .dropdown-item {
    border: 0;
    border-bottom: white 3px solid;
    padding-bottom: 5.5px;
    text-decoration: none;
    cursor: pointer;
}

.navbar-item .dropdown-item:hover,
.navbar-item .dropdown-item:focus-visible,
.navbar-item .dropdown-item:focus {
    border-color: var(--bs-primary);
    background-color: white;
}

/*********************************
       Element overrides
**********************************/
a {
    color: var(--primary-color);
}

a:hover {
    color: var(--primary-color);
}

footer {
    background-color: #58585a;
    color: #ffffff;
}

span, div, p {
    font-family: var(--bs-font-sans-serif) !important;
}

select {
    max-width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--primary-color);
    font-weight: bold;
    text-transform: uppercase;
}

iframe {
    max-width: 100%;
}

body {
    font-weight: normal;
    word-break: break-word;
}

.heading-black {
    color: var(--bs-black);
}

.heading-white {
    color: var(--bs-white);
}
/**
    Home Page
*/
.home-truck-image {
    margin: 0 auto;
}

.slick-track {
    display: flex;
}

.slick-slide {
    display: flex;
    height: auto;
    align-items: center;
}

.product-container {
    height: calc(100% - 50px);
}

.slick-product-container .slick-arrow:before,
.slick-part-container .slick-arrow:before {
    color: black;
    font-size: 30px;
    margin-left: 5px;
}

.slick-testimonial-container {
    max-width: 100%;
}

.slick-testimonial-container .slick-arrow:before {
    color: white;
    font-size: 30px;
    margin-left: 5px;
}

.full-page-width {
    margin-left: -0.75rem;
    width: calc(100% + 1.5rem) !important;
}

.product-card {
    min-height: 600px;
}

img {
    max-width: 100%;
}

.slick-dots li {
    width: 50px;
}

    .slick-dots li.slick-active a,
    .slick-dots li.slick-active a:focus,
    .slick-dots li.slick-active a:active:focus {
        color: var(--primary-color);
        border-width: 2.5px;
        border-color: var(--primary-color);
    }

        .slick-dots li.slick-active a:hover,
        .slick-dots li.slick-active a:active,
        .slick-dots li.slick-active a:active:focus {
            color: var(--bs-body-bg);
            border-color: var(--primary-color);
            border-width: 2.5px;
            background-color: var(--primary-color);
        }

textarea {
    height: auto !important;
}

.table td.fit,
.table th.fit {
    white-space: nowrap;
    width: 1%;
}

.table td {
    vertical-align: middle;
}

/*********************************
       2 Column Imaging
**********************************/

.clip-right {
    clip-path: polygon(0% 0%,90% 0%,100% 100%,0% 100%);
}

.clip-left {
    clip-path: polygon(10% 0%,100% 0%,100% 100%,0% 100%);
}

.background-img {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    max-height: 100%
}

.z-1 {
    z-index: 1
}

.z-2 {
    z-index: 1
}

/*********************************
       Lightbox Overrides
**********************************/

/*#lightboxOverlay {
    width: 100% !important;
}

#lightbox {
    height: auto !important;
    width: 90vw !important;
    margin: auto !important;
    left: 5% !important;
}

.lb-outerContainer {
    width: 75% !important;
    height: 75% !important;
}

.lb-container {
    width: 100% !important;
    height: 100% !important;
}

.lb-image {
    width: 100% !important;
    height: auto !important;
}*/

.lb-image {
    width: 600px !important;
    height: auto !important;
}

.lb-outContainer {
    height: fit-content!important;
}

.slick-product-container > .slick-next {
    right: -5px;
}


/*********************************
          Small screen only 
**********************************/
@media(max-width: 576px) {
    .dropdown-menu-center {
        left: 50% !important;
        right: auto !important;
        text-align: center !important;
        transform: translate(-50%, 0) !important;
    }

    .banner-video-container img {
        width: 100%;
        object-fit: cover;
        min-height: 250px;
        height: 100%;
    }

    .banner-video-container video {
        max-height: 100%;
        min-height: 350px;
        object-fit: cover;
    }
}