﻿@font-face {
    font-family: 'Montserrat Light';
    src: url('fonts/Montserrat-Light.otf') format('truetype');
}

@font-face {
    font-family: 'Montserrat Black';
    src: url('fonts/Montserrat-Black.otf') format('truetype');
}

@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@300;400;500;600;700&display=swap');

.el-pagination.is-background .el-pager li:not(.disabled).active {
    background-color: #951926 !important;
    color: #FFF;
}

.el-input--prefix .el-input__inner {
    padding-left: 50px !important;
}

.montBlack {
    font-family: 'Montserrat Black';
    font-size: 16px;
}

::placeholder {
    text-align: center;
    color: #002060 !important;
    font-size: 1em;
    font-family: 'Montserrat Light';
    letter-spacing: 5px;
}

.el-input--prefix .el-input__inner {
    font-family: 'Montserrat Light';
}

.el-input__icon {
    margin-top: 7px !important;
}

.el-textarea__inner:focus {
    border: 1px solid #002244 !important;
}

.imgSearch {
    width: 100%;
    max-width: 420px;
    display: block;
    margin: 0 auto;
}

.el-autocomplete {
    width: 100%;
}

.el-autocomplete-suggestion li {
    font-family: 'Montserrat Light';
}

.el-icon-search:before {
    content: url(/Content/img/Search/iconSearch.svg) !important;
    margin-top: 15px !important;
    margin-left: 15px !important;
}

.el-input.is-active .el-input__inner, .el-input__inner:focus {
    border-color: #002244 !important;
    outline: 0;
}

.el-input__inner {
    border-radius: 20px !important;
}

.el-input__suffix {
    right: 5px;
    transition: all .3s;
    margin-top: -5px;
}

.el-select-dropdown__item {
    height: 50px !important;
    display: flex;
    align-items: center;
}

.el-autocomplete-suggestion li.highlighted, .el-autocomplete-suggestion li:hover {
    background-color: #801822;
    color: white;
}

.el-select-dropdown__item.hover, .el-select-dropdown__item:hover {
    background-color: #801822;
    color: white;
}

.el-select-dropdown__wrap {
    max-height: 500px !important;
}

.cinta {
    color: #ffffff;
    background-color: #081f3f;
}

.customMargin {
    padding-top: 7px;
    padding-bottom: 7px;
}

.imgColision {
    max-width: 160px;
    fill: none;
    cursor: pointer;
}

.colision circle {
    stroke: #999999;
    transition: 0.5s;
}

.colision path {
    fill: #999999;
    transition: 0.5s;
}

.colision > .colisionActivo circle {
    stroke: #ffffff;
    fill: #C97D31;
    transition: 0.5s;
}

.colision > .colisionActivo path {
    fill: #ffffff;
    transition: 0.5s;
}

.colision > .colisionActivo p {
    color: #C97D31;
    font-weight: 800;
    transition: 0.5s;
}

.colision:hover circle {
    stroke: #ffffff;
    fill: #C97D31;
    transition: 0.5s;
}

.colision:hover path {
    fill: #ffffff;
    transition: 0.5s;
}

.colision:hover p {
    color: #C97D31;
    font-weight: 800;
    transition: 0.5s;
}

.electrico {
    cursor: pointer;
}

.imgElectrico {
    max-width: 160px;
    fill: none;
}

.imgElectrico circle {
    stroke: #999999;
}

.imgElectrico path {
    fill: #999999;
}


.electrico:hover circle {
    stroke: #ffffff;
    fill: #4d3a4c;
    transition: 0.5s;
}

.electrico:hover path {
    fill: #ffffff;
    transition: 0.5s;
}

.electrico:hover p {
    color: #1A2038;
    font-weight: 800;
    transition: 0.5s;
}

.electrico > .electricoActivo circle {
    stroke: #ffffff;
    fill: #1A2038;
    transition: 0.5s;
}

.electrico > .electricoActivo path {
    fill: #ffffff;
    transition: 0.5s;
}

.electrico > .electricoActivo p {
    color: #1A2038;
    font-weight: 800;
    transition: 0.5s;
}

.FrenosClutch {
    cursor: pointer;
}

.imgFrenosClutch {
    max-width: 160px;
    fill: none;
}

.imgFrenosClutch circle {
    stroke: #999999;
}

.imgFrenosClutch path {
    fill: #999999;
}

.FrenosClutch:hover circle {
    stroke: #ffffff;
    fill: #771f13;
    transition: 0.5s;
}

.FrenosClutch:hover path {
    fill: #ffffff;
    transition: 0.5s;
}

.FrenosClutch:hover p {
    color: #771f13;
    font-weight: 800;
    transition: 0.5s;
}

.FrenosClutch > .frenosActivo circle {
    stroke: #ffffff;
    fill: #771f13;
    transition: 0.5s;
}

.FrenosClutch > .frenosActivo path {
    fill: #ffffff;
    transition: 0.5s;
}

.FrenosClutch > .frenosActivo p {
    color: #771f13;
    font-weight: 800;
    transition: 0.5s;
}

.Motor {
    cursor: pointer;
}

.imgMotor {
    max-width: 160px;
    fill: none;
}

.imgMotor circle {
    stroke: #999999;
}

.imgMotor path {
    fill: #999999;
}

.Motor:hover circle {
    stroke: #ffffff;
    fill: #08546b;
    transition: 0.5s;
}

.Motor:hover path {
    fill: #ffffff;
    transition: 0.5s;
}

.Motor:hover p {
    color: #08546b;
    font-weight: 800;
    transition: 0.5s;
}

.Motor > .motorActivo circle {
    stroke: #ffffff;
    fill: #1A2038;
    transition: 0.5s;
}

.Motor > .motorActivo path {
    fill: #ffffff;
    transition: 0.5s;
}

.Motor > .motorActivo p {
    color: #1A2038;
    font-weight: 800;
    transition: 0.5s;
}

.Suspension {
    cursor: pointer;
}

.imgSuspension {
    max-width: 160px;
    fill: none;
}

.imgSuspension circle {
    stroke: #999999;
}

.imgSuspension path {
    fill: #999999;
}

.Suspension:hover circle {
    stroke: #ffffff;
    fill: #7D8035;
    transition: 0.5s;
}

.Suspension:hover path {
    fill: #ffffff;
    transition: 0.5s;
}

.Suspension:hover p {
    color: #7D8035;
    font-weight: 800;
    transition: 0.5s;
}

.Suspension > .suspensionActivo circle {
    stroke: #ffffff;
    fill: #7D8035;
    transition: 0.5s;
}

.Suspension > .suspensionActivo path {
    fill: #ffffff;
    transition: 0.5s;
}

.Suspension > .suspensionActivo p {
    color: #7D8035;
    font-weight: 800;
    transition: 0.5s;
}

.incosolotaRegular {
    font-family: 'Inconsolata', monospace;
    font-weight: 400;
}

.cgrey {
    color: #808080;
}

.bg-azul {
    background-color: #002244;
}


a {
    color: #002244;
}

a:hover {
    color: #A12B2A;
}

@media (max-width: 576px) {
    ::placeholder {
        text-align: center;
        color: #002244 !important;
        font-size: 9px;
        font-family: 'Montserrat Light';
    }

    .el-select .el-input__inner {
        cursor: pointer;
        padding-right: 35px;
        margin-top: 15px;
    }

    .imgSearch {
        max-width: 28%;
    }

    .imgColision, .imgElectrico, .imgFrenosClutch, .imgMotor, .imgSuspension {
        max-width: 100px;
        fill: none;
        cursor: pointer;
    }

    .titleLine {
        font-size: 14px;
    }

    .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
        margin: 0 2px;
    }

    .container-fluid {
        padding-right: 0px;
        padding-left: 0px;
    }

    .row {
        margin-right: 0px;
        margin-left: 0px;
    }

    .iconFooter {
        font-size: 35px;
        margin-left: 0px !important;
        margin-top: 15px;
    }

    #arrowDown {
        display: none;
    }

    .btn {
        font-family: 'Montserrat Bold';
        font-size: 15px;
    }

    li {
        list-style: none;
    }

    ul {
        padding: 0px !important;
    }

    .p25 {
        font-size: 20px;
    }

    .textLg {
        margin-top: 15px;
        font-size: 37px;
    }

    .spacer-120 {
        margin-top: 120px !important;
    }
}

.titleLineSearch {
    color: #002060;
}

.titleLineSearch:hover {
    color: #951926;
}

.el-select-dropdown__item.selected {
    color: #951926;
    font-weight: 700;
}

.el-select-dropdown__item.selected.hover {
    color: white;
    font-weight: 700;
}

el-pagination.is-background .el-pager li:not(.disabled):hover {
    color: #002060;
}