/*!********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./src/styles/custom/carSelector/car-selector.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************/
.selector {

    display: flex;

    flex-wrap: nowrap;

    align-items: center;

    justify-content: space-between
}

@media (min-width: 280px) {

    .selector {

        display: grid;

        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 0.5rem
    }
}

@media (min-width: 768px) {

    .selector {

        display: flex;

        height: 58px;

        border-radius: 0.5rem;

        --tw-bg-opacity: 1;

        background-color: rgb(255 255 255 / var(--tw-bg-opacity));

        padding-left: 0.875rem;

        padding-right: 0.875rem
    }
}

.selector-item {

    display: flex;

    height: 3.5rem;

    flex: 1 1 0%;

    align-items: center;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    border-radius: 0.5rem;

    --tw-bg-opacity: 1;

    background-color: rgb(255 255 255 / var(--tw-bg-opacity));

    padding-left: 0.75rem;

    padding-right: 0.75rem;

    text-align: start;

    font-weight: 600
}

.selector-item:disabled {

    --tw-text-opacity: 1;

    color: rgb(203 213 225 / var(--tw-text-opacity))
}

@media (min-width: 280px) {

    .selector-item {

        width: 100%;

        justify-content: space-between;

        padding: 0px;

        padding-left: 0.75rem;

        padding-right: 0.75rem
    }
}

@media (min-width: 768px) {

    .selector-item {

        height: 2.5rem;

        gap: 0.5rem;

        font-size: 0.875rem;

        line-height: 1.25rem
    }
}

@media (min-width: 1024px) {

    .selector-item {

        max-width: 245px;

        justify-content: space-between;

        font-size: 1rem;

        line-height: 1.5rem
    }
}
/*!*************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./src/styles/custom/benefits/benefits.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************/
@media (max-width: 1243px) {
    .benefits-title:first-of-type {
        height: 93px;
    }
}

@media (max-width: 1023px) {
    .benefits-title:first-of-type {
        height: 56px;
    }
}

@media (max-width: 796px) {
    .benefits-title:first-of-type {
        height: 84px;
    }
}

@media (max-width: 767px) {
    .benefits-title:first-of-type {
        height: auto;
    }
}

@media (max-width: 613px) {
    .benefits-title:first-of-type {
        height: 43px;
    }
}

@media (max-width: 405px) {
    .benefits-title:first-of-type {
        height: 65px;
    }

    .card-third {
        height: auto !important;
    }

    .card-fourth {
        height: auto !important;
    }
}


@media (min-width: 1024px) and (max-width: 1089px) {
    .custom-truncate-last-card {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

@media (max-width: 1023px), (min-width: 1090px) {
    .custom-truncate-last-card {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }
}

@media (max-width: 360px) {
    .custom-truncate-last-card {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}



