html, body {
    height: 100%;
    position: relative;
    background-color: #FFFFFF;
    font-size: 12px;
    font-family: 'Roboto-Regular', sans-serif;
    color: #555555;
}

.CAire {
    margin: 0;
    padding: 0;
}

/* fuentes tamaños */
.fs12 {
    font-size: 12px;
}

.fs13 {
    font-size: 13px;
}

/* fuentes pesos */
.peso-thin {
    font-family: 'Roboto-Thin', sans-serif;
}

.peso-light {
    font-family: 'Roboto-Light', sans-serif;
}

.peso-regular {
    font-family: 'Roboto-Regular', sans-serif;
}

.peso-medium {
    font-family: 'Roboto-Medium', sans-serif;
}

.peso-bold {
    font-family: 'Roboto-Bold', sans-serif;
}

.peso-black {
    font-family: 'Roboto-Black', sans-serif;
}

/* colores */

.azul {
    color: #323C71;
}

.naranja {
    color: #F79F00;
}

.gris-divisor-1 {
    color: #E1E1E1;
}

.gris-divisor-2 {
    color: #BBBBBB;
}

.gris-borde {
    color: #DBDBDB;
}

.gris-1 {
    color: #CACACA;
}

.gris-texto {
    color: #555555 !important;
}

.gris-pie {
    color: #E6E9EC;
}

.morado {
    color: #56509A !important;
}

.morado-claro {
    color: #D9DAEE;
}

.fondo1 {
    color: #F8F8F8;
}

.fondo2 {
    color: #F0F8FD;
}

.fondo-bloque {
    color: #F8FCFF;
}

.rosa {
    color: #C884B7;
}

.rosa {
    color: #EBC0E0;
}

.rojo {
    color: red;
}

.blanco {
    color: #FFFFFF;
}

.menta {
    color: #51B0BF;
}

.verde {
    color: green;
}

.pointer {
    cursor: pointer;
}

.bgazul {
    background-color: #323C71;
}

.bgnaranja {
    background-color: #F79F00;
}

/* botones */
.btn-naranja {
    background-color: #F79F00;
}

.btn-azul {
    background-color: #323C71;
}

.hf-azul:hover {
    color: #323C71;
}

.hf-blanca:hover {
    color: #ffffff;
}

.hf-gris:hover {
    color: #555555;
}

.hf-menta:hover {
    color: #51B0BF;
}

.fontT {
    font-size: 1.5em !important;
}

.desplazar {
    border: none;
    transition: 0.3s;
}

    .desplazar:hover {
        text-decoration: none;
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }

.sombra {
    border: none;
    transition: 0.3s;
}

    .sombra:hover {
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2), 0 10px 15px rgba(0, 0, 0, 0.2);
        text-decoration: none !important;
    }

.btn-pad-35 {
    padding: 5px 35px;
}

.btn-pad-25 {
    padding: 5px 15px;
}

.btn-pad-quad {
    padding: 13px 13px;
}

.radio-5 {
    border-radius: 5px;
}

.radio-9 {
    border-radius: 9px;
}

.radio-15 {
    border-radius: 15px;
}

.btn-agregar {
    background-color: white;
    border: none;
    color: #F79F00 !important;
    padding: 12px 16px;
    font-size: 20px;
    cursor: pointer;
}

    .btn-agregar:hover {
        color: #F79F00 !important;
    }

.btn-entrar {
    background-color: #F79F00;
    color: #ffffff;
    border-radius: 7px;
    border: none;
    text-align: center;
    font-size: 18px;
    transition: 0.3s;
    font-family: 'Roboto-Regular', sans-serif;
    cursor: pointer;
    height: 34px;
    padding-right: 30px;
    padding-left: 30px;
    width: 180px;
}

    .btn-entrar:hover {
        background-color: #F79F00;
        text-decoration: none;
        text-shadow: 0px 3px 5px rgba(0, 0, 0, 0.3);
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2), 0 10px 15px rgba(0, 0, 0, 0.2);
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }

.btn-Base {
    background-color: #F79F00;
    color: #ffffff;
    border-radius: 7px;
    border: none;
    text-align: center;
    transition: 0.3s;
    font-family: 'Roboto-Regular', sans-serif;
    cursor: pointer;
    height: 36px;
    padding-right: 30px;
    padding-left: 30px;
    z-index: 100;
    position: relative;
}

    .btn-Base:hover {
        background-color: #F79F00;
        text-decoration: none;
        text-shadow: 0px 3px 5px rgba(0, 0, 0, 0.3);
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2), 0 10px 15px rgba(0, 0, 0, 0.2);
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }

.btn-Cancelar {
    background-color: #E6E9EC;
    color: #ffffff;
    border-radius: 7px;
    border: none;
    transition: 0.3s;
    font-family: 'Roboto-Regular', sans-serif;
    cursor: pointer;
    height: 36px;
    padding-right: 30px;
    padding-left: 30px;
}

    .btn-Cancelar:hover {
        background-color: #F79F00;
        text-decoration: none;
        text-shadow: 0px 3px 5px rgba(0, 0, 0, 0.3);
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2), 0 10px 15px rgba(0, 0, 0, 0.2);
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }

.btn-corazon {
    background-color: #F79F00;
    color: #ffffff;
    transition: 0.3s;
}

.btn-corazon-activo {
    background-color: #51B0BF;
    color: #ffffff;
}

.hovw:hover {
    background-color: #F7F7F7;
    cursor: pointer;
}

/* Extra small devices (phones, 320px and up) */
@media (min-width: 320px) {
    .fs14 {
        font-size: 9px !important;
        line-height: 17px;
    }

    .fs16 {
        font-size: 13px !important;
        line-height: 19px;
    }

    .fs18 {
        font-size: 14px !important;
    }

    .fs24 {
        font-size: 18px !important;
    }

    .fs26 {
        font-size: 20px !important;
    }

    .fs30 {
        font-size: 24px !important;
    }

    .fs36 {
        font-size: 24px !important;
    }

    .fs42 {
        font-size: 30px !important;
    }

    .fs48 {
        font-size: 32px !important;
        line-height: 41px;
    }

    .corazon-render {
        height: 28px;
        width: 28px;
    }
}

.fa {
    -webkit-font-smoothing: none !important;
}

/* Large devices (tablets, 767px and up) */
@media (min-width: 767px) {
    .fs14 {
        font-size: 10px !important;
        line-height: 18px;
    }

    .fs16 {
        font-size: 14px !important;
        line-height: 19px;
    }

    .fs18 {
        font-size: 16px !important;
    }

    .fs24 {
        font-size: 20px !important;
    }

    .fs26 {
        font-size: 22px !important;
    }

    .fs30 {
        font-size: 26px !important;
    }

    .fs36 {
        font-size: 32px !important;
    }

    .fs42 {
        font-size: 38px !important;
    }

    .fs48 {
        font-size: 44px !important;
        line-height: 49px;
    }

    .corazon-render {
        height: 30px;
        width: 30px;
    }
}

/* Large devices (desktops, 991px and up) */
@media (min-width: 991px) {
    .fs14 {
        font-size: 14px !important;
        line-height: 19px;
    }

    .fs16 {
        font-size: 16px !important;
        line-height: 21px;
    }

    .fs18 {
        font-size: 18px !important;
    }

    .fs24 {
        font-size: 24px !important;
    }

    .fs26 {
        font-size: 26px !important;
    }

    .fs30 {
        font-size: 30px !important;
    }

    .fs36 {
        font-size: 36px !important;
    }

    .fs42 {
        font-size: 42px !important;
    }

    .fs48 {
        font-size: 48px !important;
        line-height: 53px;
    }

    .corazon-render {
        height: 34px;
        width: 34px;
    }
}

@media(min-width:1028px) {
    .imga {
        width: 290px;
        height: 290px;
    }
}