:root {
  --color-accent: #c11c3f;
  --color-secondary: #C0C0C0;
  --color-text: #1C1C1E;
  --color-white: white;
  --color-black: black;
  --bg-header: #F0F0F0;
  --bg-primary: #1C1C1E;
  --bg-secondary: #F0F0F0;
  --bg-black: black;
  --bg-white: white;

  --size: clamp(10rem, 1rem + 40vmin, 30rem);
  --gap: calc(var(--size) / 14);
  --duration: 90s;
  --scroll-start: 0;
  --scroll-end: calc(-100% - var(--gap));
}

.inc-specials-container {font-size:0;}
.veh1, .veh2, .veh1over, .veh2over {background-color:transparent; display:inline-block; width: 16.666%; border-radius: 5px; margin: 0 auto; vertical-align: top; background: white;}
.veh1over, .veh2over {background: white;} 
.vehdata {text-align:center; width:100%; color:#ddd; padding: 5px 0 10px; font-size:16px;line-height:22px;letter-spacing:.5px; font-weight:600;} 
.veh1over .vehdata, .veh1over .vehdata span, .veh2over .vehdata, .veh2over .vehdata span{color:#000 !important;}
.vehdata1, .vehdata2 {width:100%;} 
.vehdata1over, .vehdata2over {width:100%;} 
.vehdata1over span, .vehdata2over span { color:#fff !important;}
.vehpic {margin:8px; border:#ccc 0px solid; position: relative;} 
.vehpic img{width:100%; background-color: #fff;}
.ar_new, .vehicle_fineavail, .ar_sold, .ar_pending, .ar_special {font-family:arial,geneva,helvetica,sans-serif; color:#fff; text-align:center; font-weight:500; letter-spacing:1px; font-size:12px; margin: 4px 0 0 4px; padding:6px; position:absolute; border:#747474 1px solid;}
.ar_new, .vehicle_fineavail { background-color:#FFD700; color:#102552; border:#ffffff 1px solid; width:150px;}
.ar_sold {background-color:#ff0000;}
.ar_pending {background-color:#ffff00; color:#000;}
.ar_special {background-color:#009900; }
.ar_new, .ar_pending, .ar_sold, .ar_special{left:inherit; left:initial; right:5px;}


.inc-specials-container {
    font-size: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
}

.veh1,.veh1over,.veh2,.veh2over {
    display: inline-block;
    width: 23%;
    border-radius: 5px;
    margin: 10px auto;
    vertical-align: top;
}

.vehdata {
    text-align: center;
    width: 100%;
    color: #000;
    padding: 5px 0 10px;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: .5px;
    font-weight: 500;
}

.veh1over .vehdata,.veh1over .vehdata span,.veh2over .vehdata,.veh2over .vehdata span {
    color: #fff!important;
}

.vehdata1,.vehdata2 {
    width: 100%;
}

.vehdata1over,.vehdata2over {
    width: 100%;
}

.vehdata1over span,.vehdata2over span {
    color: #fff!important;
}

.vehpic {
    margin: 8px;
    border: #ccc 0 solid;
    position: relative;
}

.vehpic img {
    width: 100%;
    background-color: #fff;
}

.ar_new,.ar_pending,.ar_sold,.ar_special,.vehicle_fineavail {
    color: #fff;
    text-align: center;
    font-weight: 500;
    letter-spacing: 1px;
    font-size: 12px;
    margin: 4px 0 0 4px;
    padding: 6px;
    position: absolute;
    border: #747474 1px solid;
}

.ar_new,.vehicle_fineavail {
    background-color: gold;
    color: #102552;
    border: #fff 1px solid;
    width: 150px;
}

.ar_sold {
    background-color: red;
}

.ar_pending {
    background-color: #ff0;
    color: #000;
}

.ar_special {
    background-color: #090;
}

.ar_new,.ar_pending,.ar_sold,.ar_special {
    left: inherit;
    left: initial;
    right: 5px;
}

@media (max-width: 970px) {
    .veh1, .veh1over, .veh2, .veh2over {
        width: 33.333%;
    }
}

@media (max-width: 640px) {
    .veh1, .veh1over, .veh2, .veh2over {
        width: 50%;
    }
}

@media (max-width: 580px) {
    .search_criteria {
        padding-bottom: 30px;
    }

    .search_criteria td {
        width: 100%;
        display: block;
    }

    .search_criteria td.search_left {
        width: 100%!important;
        display: block;
        margin-bottom: 20px;
    }

    .search_make {
        width: 50%;
    }
}

@media (max-width: 480px) {
    .veh1, .veh1over, .veh2, .veh2over {
        width: 100%;
    }
}

.veh1, .veh2, .veh1over, .veh2over {
    padding: 2rem;
    border: 1px solid #fff;
    color: #000;
}

.veh1over, .veh2over {
    position: relative;
    border-color: #e8e8e8;
    box-shadow: 0 2px 15px -10px #000;
}

.vehpic {
    margin: 0;
}

.veh1over .vehpic, .veh2over .vehpic {
    background: #000;
}

.veh1over .ar_pending, .veh1over .ar_sold, .veh2over .ar_pending, .veh2over .ar_sold, .veh1over img, .veh2over img {
    opacity: .25;
    transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
}

.veh1over .vehpic:after, .veh2over .vehpic:after {
    content: 'View More';
    font-weight: bold;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 6px;
    color: #fff;
    text-align:center;
    font-size: 14px;
    transition: .2s ease-in-out;
    letter-spacing: .25px;
    line-height: 24px;
    display: inline-block;
    padding: 6px 15px;
    border: none;
    background: var(--color-accent);
}

.specials-car-content {
    padding: 16px 12px 12px;
}

.specials-name {
    font-size: 18px;
    margin: 0 0 5px;
    font-weight: 600
}

.specials-pricing {
    display: block;
    line-height: 26px;
    margin: 0 0 5px;
}

.specials-pricing:after {
    display: table;
    content: '';
    clear: both;
}

.specials-price {
    float: left;
    width: 50%;
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    color: green;
    line-height: 30px;
}

.specials-location {
    float: right;
    margin: 0 auto;
    width: 50%;
    font-size: 14px;
    text-align: right;
    line-height: 30px;
}

.specials-info {
    display: block;
    border-top: 0 solid #e7e6e6;
    margin: 0 auto;
    overflow: hidden;
    padding: 0;
    width: 100%;
    background: transparent;
}

.specials-info li {
    display: flex;
    align-items: center;
    justify-content: start;
    font-size: 13px;
    list-style: outside none none;
    line-height: 26px;
    margin: 0 auto;
    padding: 0;
}

.specials-info li .fa, .specials-info li .fas {
    font-size: 15px;
    margin: 0;
    margin-right: 8px;
}

.specials-info li svg {
    display: block;
    width: 14px;
    height: auto;
}

.specials-info li.specials-info-mpg, .specials-info li.specials-info-desc {
    width: 100%;
}

@media (max-width: 1050px) {
    .veh1, .veh2, .veh1over, .veh2over {
        width:32.333%;
    }
}

@media (max-width: 740px) {
    .veh1, .veh2, .veh1over, .veh2over {
        width:49%;
    }
}

@media (max-width: 480px) {
    .veh1, .veh2, .veh1over, .veh2over {
        width:100%;
    }
}

.fa-road svg path, .fa-car svg path, .fa-tachometer-alt svg path:first-child {
    fill: #000
}
