@keyframes arriba {
    0% {
        transform: translateY(500px);
    }
    80% {
        transform: translateY(-5px);
    }

    100% {
        transform:translateY(0px);
    }
}

.subir{
    animation-name: arriba;
    animation-duration: 2s;
    animation-fill-mode: both;

    .uno {
        animation-delay: 1s;
    }
    .dos {
        animation-delay: 1.5s;
    }
    .tres {
        animation-delay: 2s;
    }

}

@keyframes izquierda {
    0% {
        transform: translateX(-500px);
        opacity: 0;
    }
    80% {
        transform: translateX(0px);
    }

    100% {
        transform:translateX(-5px);
        opacity: 1;
    }
}

.mover_izquierda {
    animation-name: izquierda;
    animation-duration: 2s;
    animation-fill-mode: both;
}


@keyframes aparecer {
    0% {
        opacity: .2;
        transform: scale(1.2);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.mostrar {
    animation-name: aparecer;
    animation-duration: 6s;
    animation-fill-mode: both;
}

@keyframes crecer {
    0% {
        opacity: 0;
        transform: scale(0);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.zoom {
    animation-name: crecer;
    animation-duration: 1s;
    animation-fill-mode: both;
}