/* --- THE ANIMATION CLASS --- */
.reveal-on-scroll {
    opacity: 0;                  /* Hidden by default */
    transform: translateY(50px); /* Pushed down 50px */
    transition: all 1s ease;     /* Smooth 1 second animation */
}

/* --- THE ACTIVE STATE --- */
/* JavaScript adds this class when the element is on screen */
.reveal-on-scroll.is-visible {
    opacity: 1;                  /* Become visible */
    transform: translateY(0);    /* Slide up to original position */
}