/* CONSTRUCTOR */
body{
    font-family: 'Inter' , sans-serif;
    background-color: '#E5E7EB';
    color: #1F2937;
}

/* BOTONES */

    /* acciones */
    .consensum-buttons-basic{
        color:white;
        background-color: #10B981;
        border-radius: 10px;
        padding: 8px;
        border: 1px solid #10B981;
        transition: background-color 0.3s ease, color 0.3s ease, border 0.3s ease;
    }.consensum-buttons-basic:hover{
        color: #10B981;
        background-color: #E5E7EB;
        border: 1px solid #10B981;
    }

    /* botones de oferta */
    .consensum-buttons-offert{
        color:#1F2937;
        transition: background-color 0.3s ease, color 0.3s ease, border 0.3s ease;
        text-decoration: none;
    }.consensum-buttons-offert:hover{
        color: #E5E7EB;
        background-color: #1F2937;
    }

/* FONDOS */

.consensum-background-darkblue{
    background-color: #1F2937;
}.consensum-background-lightgreen{
    background-color: #10B981;
}.consensum-background-lightgray{
    background-color: #E5E7EB;
}.consensum-background-lightblue{
    background-color: #3B82F6;
}

/* COLORES DE LETRA */

.consensum-letter-darkblue{
    color: #1F2937;
}.consensum-letter-lightgreen{
    color: #10B981;
}.consensum-letter-lightgray{
    color: #E5E7EB;
}

/* ESTILOS DE LETRA */

.consensum-letterstyle-inter{
    font-family: "Inter" , sans-serif;
}.consensum-letterstyle-interlight{
    font-family: "Inter-Light" , sans-serif;
}

/* FUENTES */

    /* Inter Font */
    @font-face {
        font-family: "Inter";
        src: url('../upload/fonts/INTER/Inter-VariableFont_opsz\,wght.ttf') , format('ttf');
        font-weight: 700;
        font-style: normal;
    }

    @font-face {
        font-family: "Inter-light";
        src: url('../upload/fonts/INTER//static/Inter_18pt-Light.ttf') , format('ttf');
        font-weight: 700;
        font-style: normal;
    }

/* ANIMACIONES */

    /* rotacion 360 grados */
    .consensum-rotatable {
        transition: transform 0.6s ease;
        cursor: pointer;
    }

    .consensum-rotated {
        transform: rotate(360deg);
    }

    /* aumento navbar */

    .consensum-transform-nav{
        height: 200px;
        transition: height 0.6s ease , background-color 0.6s ease;
        transform-origin: top;
        cursor: pointer;
    }
    
    .consensum-transformed-nav{
        height: 480px;
    }

    /* aparicion con animacion */

    .consensum-animation-aparicion {
        display: none;
        opacity: 0;
        transform: translateY(40px);
        pointer-events: none;
        transition: transform 0.3s ease, opacity 0.3s ease , display 0.3s ease;
    }
    
    .consensum-animation-aparecido {
        display: block;
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }