/* Shared auction / fixed-price car card — used by auctioncarlist, related cars, SEO maker listings */
.auct-grid,
#maincar_list_thumb,
.auctocars.auct-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -8px;
    margin-right: -8px;
}

.auct-grid > .auct-col,
.auct-grid > [class*="col-"],
#maincar_list_thumb > .auct-col,
#maincar_list_thumb > [class*="col-"],
.auctocars.auct-grid > .auct-col,
.auctocars.auct-grid > [class*="col-"] {
    float: none !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 8px;
    padding-right: 8px;
    margin-bottom: 16px;
    box-sizing: border-box;
}

.auct-grid .auct,
#maincar_list_thumb .auct,
.auctocars.auct-grid .auct {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    position: relative;
    padding: 8px 8px 12px;
    border: 1px solid #e4e8ea;
    border-radius: 8px;
    background: #fff !important;
    margin-top: 0;
    -webkit-transition: box-shadow .2s ease, border-color .2s ease;
    transition: box-shadow .2s ease, border-color .2s ease;
}

.auct-grid .auct:hover,
#maincar_list_thumb .auct:hover,
.auctocars.auct-grid .auct:hover {
    background: #fff !important;
    border-color: #cfd8dc;
    box-shadow: 0 4px 14px rgba(16, 42, 67, 0.08);
}

.auct-grid .auct:hover a,
.auct-grid .auct:hover p,
.auct-grid .auct:hover ul > li,
.auct-grid .auct:hover .desc,
#maincar_list_thumb .auct:hover a,
#maincar_list_thumb .auct:hover p,
#maincar_list_thumb .auct:hover ul > li,
#maincar_list_thumb .auct:hover .desc,
.auctocars.auct-grid .auct:hover a,
.auctocars.auct-grid .auct:hover p,
.auctocars.auct-grid .auct:hover ul > li,
.auctocars.auct-grid .auct:hover .desc {
    color: inherit;
}

.auct-grid .auct p.black,
#maincar_list_thumb .auct p.black,
.auctocars.auct-grid .auct p.black {
    color: #1f2a33 !important;
    margin: 0 0 2px;
    font-size: 12px;
    font-weight: 700;
}

.auct-grid .auct p.text-primary,
#maincar_list_thumb .auct p.text-primary,
.auctocars.auct-grid .auct p.text-primary {
    color: #0177d7 !important;
    margin: 0 0 4px;
    font-size: 13px;
    font-weight: 700;
}

.auct-grid .auct .desc,
.auct-grid .auct ul > li,
#maincar_list_thumb .auct .desc,
#maincar_list_thumb .auct ul > li,
.auctocars.auct-grid .auct .desc,
.auctocars.auct-grid .auct ul > li {
    color: #4f4949 !important;
    font-size: 11px;
}

.auct-grid .auct-front,
#maincar_list_thumb .auct-front,
.auctocars.auct-grid .auct-front {
    display: block;
    text-decoration: none !important;
    color: inherit;
}

.auct-grid .auct-media,
#maincar_list_thumb .auct-media,
.auctocars.auct-grid .auct-media {
    position: relative;
    width: 100%;
    padding-top: 75%;
    aspect-ratio: 4 / 3;
    background: #e8eef1 url('/img/no-car-photo.svg') center / 48% no-repeat;
    overflow: hidden;
    border-radius: 4px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

@supports (aspect-ratio: 4 / 3) {
    .auct-grid .auct-media,
    #maincar_list_thumb .auct-media,
    .auctocars.auct-grid .auct-media {
        padding-top: 0;
        height: auto;
    }
}

.auct-grid .auct-media img.big-image,
.auct-grid .auct img.big-image,
#maincar_list_thumb .auct-media img.big-image,
#maincar_list_thumb .auct img.big-image,
.auctocars.auct-grid .auct-media img.big-image,
.auctocars.auct-grid .auct img.big-image {
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    object-fit: cover;
    object-position: center;
    display: block;
    background: #e8eef1;
    cursor: pointer !important;
}

.auct-grid .auct-desc,
#maincar_list_thumb .auct-desc,
.auctocars.auct-grid .auct-desc {
    margin-top: 8px;
    min-height: 78px;
}

.auct-grid .auct-desc .list-inline,
#maincar_list_thumb .auct-desc .list-inline,
.auctocars.auct-grid .auct-desc .list-inline {
    margin: 0 0 4px;
    padding: 0;
}

.auct-grid .auct-actions,
#maincar_list_thumb .auct-actions,
.auctocars.auct-grid .auct-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 0 2px;
}

.auct-grid .auct-btn,
#maincar_list_thumb .auct-btn,
.auctocars.auct-grid .auct-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 6px;
    border: 1px solid transparent;
    text-decoration: none !important;
    font-family: Lato, Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    -webkit-transition: background .15s ease, border-color .15s ease, color .15s ease;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    box-sizing: border-box;
}

.auct-grid .auct-btn-bid,
#maincar_list_thumb .auct-btn-bid,
.auctocars.auct-grid .auct-btn-bid {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 0;
    padding: 0 8px;
    color: #fff !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #01b1ec;
    border-color: #01b1ec;
}

.auct-grid .auct-btn-bid:hover,
#maincar_list_thumb .auct-btn-bid:hover,
.auctocars.auct-grid .auct-btn-bid:hover,
.auct-grid .auct:hover .auct-btn-bid,
#maincar_list_thumb .auct:hover .auct-btn-bid,
.auctocars.auct-grid .auct:hover .auct-btn-bid {
    background: #0199cc;
    border-color: #0199cc;
    color: #fff !important;
}

.auct-grid .auct-btn-bid.red,
#maincar_list_thumb .auct-btn-bid.red,
.auctocars.auct-grid .auct-btn-bid.red {
    background: #8a939a;
    border-color: #8a939a;
}

.auct-grid .auct-btn-bid.btn-success,
#maincar_list_thumb .auct-btn-bid.btn-success,
.auctocars.auct-grid .auct-btn-bid.btn-success {
    background: #2e9e6b !important;
    border-color: #2e9e6b !important;
}

.auct-grid .auct-btn-icon,
#maincar_list_thumb .auct-btn-icon,
.auctocars.auct-grid .auct-btn-icon {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 32px;
    flex: 0 0 32px;
    width: 32px;
    background: #f4f7f8;
    border-color: #d7e0e4;
    color: #31414c;
}

.auct-grid .auct-btn-icon:hover,
#maincar_list_thumb .auct-btn-icon:hover,
.auctocars.auct-grid .auct-btn-icon:hover {
    background: #e8f7fc;
    border-color: #01b1ec;
    color: #01b1ec !important;
}

.auct-grid .auct-btn-icon .auct-ico,
#maincar_list_thumb .auct-btn-icon .auct-ico,
.auctocars.auct-grid .auct-btn-icon .auct-ico {
    width: 15px;
    height: 15px;
    display: block;
}

.auct-grid .auct-btn-heart.is-bookmarked,
#maincar_list_thumb .auct-btn-heart.is-bookmarked,
.auctocars.auct-grid .auct-btn-heart.is-bookmarked {
    background: #fff0f2;
    border-color: #e85a6b;
    color: #e5394a !important;
}

.auct-grid .auct-start-price,
.auct-grid .auct p.auct-start-price,
.auct-grid .auct p.price.auct-start-price,
#maincar_list_thumb .auct-start-price,
#maincar_list_thumb .auct p.auct-start-price,
#maincar_list_thumb .auct p.price,
.auctocars.auct-grid .auct-start-price,
.auctocars.auct-grid .auct p.auct-start-price,
.auctocars.auct-grid .auct p.price {
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    top: auto !important;
    margin: 8px 2px 0 !important;
    color: #c62828 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

.auct-grid .auct .favicons,
#maincar_list_thumb .auct .favicons,
.auctocars.auct-grid .auct .favicons {
    display: none;
}

.auct-grid .auctForm,
#maincar_list_thumb .auctForm {
    border-radius: 8px;
    padding: 12px 10px 10px;
}

.auct-grid .auct-form-close,
#maincar_list_thumb .auct-form-close {
    text-align: right;
    margin: -4px 0 4px;
}

.auct-grid .auct-form-close a,
#maincar_list_thumb .auct-form-close a {
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 22px;
    text-align: center;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    color: #fff !important;
    font-size: 18px;
    text-decoration: none !important;
}

.auct-grid .auctForm .form-control,
#maincar_list_thumb .auctForm .form-control {
    height: 28px;
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 4px;
}

.auct-grid .auctForm textarea.form-control,
.auct-grid .auctForm .auct-inq-msg,
#maincar_list_thumb .auctForm textarea.form-control,
#maincar_list_thumb .auctForm .auct-inq-msg {
    height: auto;
    min-height: 54px;
    resize: vertical;
    line-height: 1.35;
}

.auct-grid .auctForm .form-control[readonly],
#maincar_list_thumb .auctForm .form-control[readonly] {
    background: #f0f0f0;
    cursor: default;
}

.auct-grid .auctForm .form-group,
#maincar_list_thumb .auctForm .form-group {
    margin-bottom: 6px;
}

.auct-grid .auctForm h4,
#maincar_list_thumb .auctForm h4 {
    margin: 0 0 8px;
    font-size: 14px;
}

.auct-grid .auct-inq-submit,
#maincar_list_thumb .auct-inq-submit {
    width: 100%;
    border-radius: 4px;
    margin-top: 4px;
}
