.anim {
    opacity: 0;
    transform: translateY(30px);
    animation: moveup 0.5s linear forwards;
}
@keyframes moveup {
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

.sub_anim {
    opacity: 0;
    transform: translateY(30px);
    animation: moveup 0.5s linear forwards;
    /* animation-delay: 0.5s; */
}
@keyframes moveup {
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

.hero-subtext {
    opacity: 0;
    transform: translateY(30px);
    animation: moveup 0.5s linear forwards;
    animation-delay: 0.5s;
}
@keyframes moveup {
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

.hero-actions {
    opacity: 0;
    transform: translateY(30px);
    animation: moveup 0.5s linear forwards;
    animation-delay: 1s;
}

@keyframes moveup {
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

.hero-media  {
    opacity: 0;
    transform: translateY(30px);
    animation: moveup 0.5s linear forwards;
    animation-delay: 0.5s;
}
@keyframes moveup {
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}