/* Keyframes Index */

@keyframes brecha {
    0%{
        transform: scaleX(0%);
    }
    100%{
        transform: scaleX(100%);
    }    
}

@keyframes ojitosmovimiento{
    0%{
        transform: translateY(10px);
    }
    50%{
        transform: translateY(-10px);
    }
    100%{
        transform: translateY(10px);
    }
}

@keyframes fondobuclenubes {
    0%{
        transform: translateX(0%);
    }
    100%{
        transform: translateX(-33.33333333%);
    }
}

/* Keyframes Home */

    @keyframes glowperfil {
        0%{
            box-shadow: #ff0048 0px 0px 10px;
        }
        50%{
            box-shadow: #ff0048b6 0px 0px 3px;
        }
        100%{
            box-shadow: #ff0048 0px 0px 10px;
        }
    }

    @keyframes spin {
        from {translate: 0;}
        to {translate: -100%;}
    }

    @keyframes cartelitointro {
        0%{
            transform: scaleY(0%);
            opacity: 0%;
        }
        100%{
            transform: scaleY(100%);
            opacity: 100%;
        }
    }

    @keyframes fondohomeanimado {
        0%{
            opacity: 100%;
        }
        50%{
            opacity: 0%;
        }
        100%{
            opacity: 100%;
        }
        
    }

    /* ventanas */

    @keyframes ventanaintroizqui {
        0%{
            transform: translateX(-50%) rotate(-3deg);
            opacity: 0%;
        }
        100%{
            transform: translateX(0%);
            opacity: 100%;
        }
    }

    @keyframes ventanaintrodere {
        0%{
            transform: translateX(50%) rotate(3deg);
            opacity: 0%;
        }
        100%{
            transform: translateX(0%);
            opacity: 100%;
        }
    }

    @keyframes ventanaintrocentro {
        0%{
            transform: translateY(20%);
            opacity: 0%;
        }
        100%{
            transform: translateY(0%);
            opacity: 100%;
        }
    }

/* Keyframes Generales */

    @keyframes tituloefecto {
        0%{
            text-shadow: -2px 2px 2px rgb(255, 0, 47);
        }
        25%{
            text-shadow: 2px 2px 2px rgb(255, 0, 47);
        }
        50%{
            text-shadow: 2px -2px 2px rgb(255, 0, 47);
        }
        75%{
            text-shadow: -2px -2px 2px rgb(255, 0, 47);
        }
        100%{
            text-shadow: -2px 2px 2px rgb(255, 0, 47);
        }
    }

    @keyframes fade-down {
    0%{
        opacity: 0%;
        transform: translateY(-10px);
    }
    100%{
        opacity: 100%;
        transform: translateY(0px);
    }
}

    @keyframes fade-up {
        0%{
            opacity: 0%;
            transform: translateY(10px);
        }
        100%{
            opacity: 100%;
            transform: translateY(0px);
        }
}

    @keyframes fade-in {
        0%{
            opacity: 0%;
        }
        100%{
            opacity: 100%;
        }
}

/* Keyframes Overlay */

    @keyframes parpadeo {
        0%{
            opacity: 0.1;
        }
        25%{
            opacity: 0.3;
        }
        50%{
            opacity: 0.1;
        }
        75%{
            opacity: 0.3;
        }
        100%{
            opacity: 0.1;
        }
    }