@keyframes animate_1 {
    0% {
        top: -25%;
        opacity: 1;
    }

    50% {
        top: 50%;
        opacity: 1;
    }

    100% {
        top: 50%;
        opacity: 0;
    }
}

@keyframes animate_2 {
    0% {
        content: " |";
    }

    10% {
        content: "D |";
    }

    20% {
        content: "De |";
    }

    30% {
        content: "Des |";
    }

    40% {
        content: "Desi |";
    }

    50% {
        content: "Desig |";
    }

    60% {
        content: "Design |";
    }

    70% {
        content: "Designe |";
    }

    80% {
        content: "Designer |";
    }

    90% {
        content: "Designer |";
    }

    100% {
        content: "Designer |";
    }
}