.lista-principal {
    width: 100%;
    background-color:#fff;
    display:flex;
    justify-content:space-around;
    padding:1% 12%;
    flex-wrap:wrap;
}

.texto-tipo-vehiculo-anio {
    margin:0% 2%; 
    text-align:center;
    font-family:'Roboto';
    font-size: 24px;
    font-weight: 400;
    color: #0d184e;
}

.texto-tipo-vehiculo-anio:hover{
    text-decoration:underline;
}

.margin-contenedor{
    margin:0% 12%;
}

.width-auto{
    width:90%!important;
}

.nombre-anio-auto{
    text-align: center!important; 
    font: 400 30px Segoe UI, sans-serif!important;
    color:#000!important;
    line-height:30px!important;
}

.tarjeta-promociones {
    width: 250px;
    margin:10px;
}

.contenedor-tarjetas {
    background-color:#fff;
    width:100%;
    height:auto;
    display:flex;
    justify-content:center;
    flex-wrap: wrap;
}

.width-logo-plan {
    width:80%!important;
}

.titulo-promo {
    font-size: 1.2rem!important; 
    font-weight:400!important;
    text-align:center; 
    color:#000;
}

.titulo-promo-sgf {
    font-size: 1.2rem!important; 
    font-weight:400!important;
    text-align:center; 
    /*color:#000;*/
}

.titulo-monto-porcentaje {
    font-size: 2.5rem!important; 
    font-weight:700!important;
    text-align:center; 
    color:#000;
}

.titulo-monto-porcentaje-sgf {
    font-size: 2.5rem!important; 
    font-weight:700!important;
    text-align:center; 
    /*color:#000;*/
}

.img-dialog-legales {
    display:block;
    margin:auto;
    max-width:90%; 
    padding:15%;
}

.img-marca{
    display:block;
    margin:auto;
    max-width:15%;
}

.contenedor-legales {
    border:3px solid; 
    border-radius:7px; 
    border-color:#b1cedd; 
    margin-bottom:5%;
    display:none;
}

.texto-legales {
    padding:2%;
    font-size: 0.8rem!important; 
    font-weight:400!important;
    text-align:justify; 
    color:#0d184e;
}

.btn-cotizar {
    display:block;
    margin:auto;
    border-radius:10px!important; 
    background-color:#b8b0ae!important; 
    border-color:#b8b0ae!important; 
    color:#0d184e!important;
    font:700 30px Segoe UI, sans-serif!important;
    text-align:center;
    width:30%;
    padding:1.5% 2.5%;
}



.legal-abajo {
    /*position: absolute;
    bottom: 0;
    width: 100%;    
    left: 0;*/
    /* margin: 0; */
    /* background-color: aqua; */
}



.descarga-catalogo {
    margin:2% 2%; 
    text-align:center;
    font-family:'Roboto';
    font-size: 24px;
    font-weight: 400;
    color: #0d184e;
}

/*.descarga-catalogo:hover{
    text-decoration:underline;
}*/






@media (max-width: 1590px) {

    .margin-contenedor{
        margin:0% 5%;
    }

}

@media (max-width: 1340px) {

    .margin-contenedor{
        margin:0% 0%;
    }

}

@media (max-width: 500px) {

    .btn-cotizar {
        display:block;
        margin:auto;
        border-radius:10px!important; 
        background-color:#b8b0ae!important; 
        border-color:#b8b0ae!important; 
        color:#0d184e!important;
        font:700 20px Segoe UI, sans-serif!important;
        text-align:center;
        width:45%;
        padding:1.5% 2.5%;
    }

    .img-marca{
        display:block;
        margin:auto;
        max-width:35%;
    }

    .descarga-catalogo {
        margin:2% 2%; 
        text-align:center;
        font-family:'Roboto';
        font-size: 18px;
        font-weight: 400;
        color: #0d184e;
    }

    .titulo-promo {
        font-size: 1rem!important; 
        font-weight:400!important;
        text-align:center; 
        color:#000;
    }
    
    .titulo-promo-sgf {
        font-size: 1rem!important; 
        font-weight:400!important;
        text-align:center; 
        /*color:#000;*/
    }
    
    .titulo-monto-porcentaje {
        font-size: 2rem!important; 
        font-weight:700!important;
        text-align:center; 
        color:#000;
    }
    
    .titulo-monto-porcentaje-sgf {
        font-size: 2rem!important; 
        font-weight:700!important;
        text-align:center; 
        /*color:#000;*/
    }

    .img-dialog-legales {
        display: block;
        margin: auto;
        max-width: 25%;
        padding: 5%;
    }

}








/* Contenedor del popup */
.popup {
    position: relative;
    /*display: inline-block;*/
    display: block;
    cursor: pointer;
}

/* pop-up actual */
.popup .popuptext {
    visibility: hidden;
    width: 460px;
    background-color: #555;
    color: #fff;
    text-align: justify;
    border-radius: 6px;
    padding: 2%;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 82%;
    margin-left: -420px;
    font-size: 10px;
}

/* Cambio para mostrar/ocultar el contenedor del pop-up */
.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s
}

/* Animación del pop-up */
@-webkit-keyframes fadeIn {
    from {opacity: 0;} 
    to {opacity: 1;}
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
}