/* =====================================================
   CARA NARANJA - LGP
===================================================== */


/* =====================================================
   COMPONENTE BASE
===================================================== */

.lgp-cara-naranja{
    display:block;

    margin:0 !important;
    padding:0 !important;

    line-height:0;
    font-size:0;

    flex-grow:0 !important;
    flex-shrink:0 !important;
}


/* =====================================================
   CONTENEDOR INTERNO DE ELEMENTOR
===================================================== */

.lgp-cara-naranja > .elementor-widget-container{
    display:block;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    line-height:0;
    font-size:0;
}


/* =====================================================
   CONTENEDOR DEL SVG
===================================================== */

.lgp-cara-naranja .cara-naranja{
    display:block;

    width:100%;
    height:auto;

    margin:0;
    padding:0;

    line-height:0;
    font-size:0;
}


/* =====================================================
   SVG
===================================================== */

.lgp-cara-naranja svg{
    display:block;

    width:100% !important;
    height:auto !important;

    margin:0;
    padding:0;

    vertical-align:top;
    overflow:visible;

    animation:lgpSaltoCara 2.4s ease-in-out infinite;

    transform-origin:center bottom;
}


/* =====================================================
   OJOS
===================================================== */

.lgp-cara-naranja #Capa_3{
    animation:lgpCerrarOjos 2.4s ease-in-out infinite;

    transform-box:fill-box;
    transform-origin:center center;
}


/* =====================================================
   VARIANTE ESTÁTICA
===================================================== */

.lgp-cara-estatica svg{
    animation:none !important;
}

.lgp-cara-estatica #Capa_3{
    animation:lgpCerrarOjos 2.4s ease-in-out infinite;
}


/* =====================================================
   TAMAÑOS
===================================================== */


/* XL */

.lgp-cara-naranja.lgp-icono-xl{
    width:105px !important;
    min-width:105px !important;
    max-width:105px !important;

    flex-basis:105px !important;
}


/* MD */

.lgp-cara-naranja.lgp-icono-md{
    width:86px !important;
    min-width:86px !important;
    max-width:86px !important;
	
}


/* SM */

.lgp-cara-naranja.lgp-icono-sm{
    width:70px !important;
    min-width:70px !important;
    max-width:70px !important;

    flex-basis:70px !important;
}


/* =====================================================
   ANIMACIÓN SALTO
===================================================== */

@keyframes lgpSaltoCara{

    0%,
    70%,
    100%{
        transform:translateY(0);
    }

    78%{
        transform:translateY(-14px);
    }

    84%{
        transform:
            translateY(0)
            scaleY(.94);
    }

    90%{
        transform:translateY(-5px);
    }

}


/* =====================================================
   ANIMACIÓN PARPADEO
===================================================== */

@keyframes lgpCerrarOjos{

    0%,
    68%,
    100%{
        transform:scaleY(1);
    }

    74%,
    82%{
        transform:scaleY(.08);
    }

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width:1024px){

    .lgp-cara-naranja.lgp-icono-xl{
        width:92px !important;
        min-width:92px !important;
        max-width:92px !important;

        flex-basis:92px !important;
    }

    .lgp-cara-naranja.lgp-icono-md{
        width:78px !important;
        min-width:78px !important;
        max-width:78px !important;

        flex-basis:78px !important;
    }

    .lgp-cara-naranja.lgp-icono-sm{
        width:66px !important;
        min-width:66px !important;
        max-width:66px !important;

        flex-basis:66px !important;
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width:767px){

    .lgp-cara-naranja.lgp-icono-xl{
        width:70px !important;
        min-width:70px !important;
        max-width:70px !important;

        flex-basis:70px !important;
    }

    .lgp-cara-naranja.lgp-icono-md{
        width:62px !important;
        min-width:62px !important;
        max-width:62px !important;

        flex-basis:62px !important;
    }

    .lgp-cara-naranja.lgp-icono-sm{
        width:55px !important;
        min-width:55px !important;
        max-width:55px !important;

        flex-basis:55px !important;
    }

}


/* =====================================================
   ACCESIBILIDAD
===================================================== */

@media (prefers-reduced-motion:reduce){

    .lgp-cara-naranja svg,
    .lgp-cara-naranja #Capa_3{
        animation:none !important;
    }

}