/* Container holding animated elements */
.overflow {
    overflow: hidden; /* Hide any content that moves out of bounds */
}

.fadein, .fadeinTop, .fadeinLeft, .fadeinRight {
    opacity: 0;
    transition: all 1.5s;
}

/* Specific animations */
.fadein {
    transform: translate(0, 100px); /* Fades in from bottom */
}

.fadeinTop {
    transform: translate(0, -100px); /* Fades in from top */
}

.fadeinLeft {
    transform: translate(-100px, 0); /* Fades in from left */
}

.fadeinRight {
    transform: translate(100px, 0); /* Fades in from right */
}

/* Animation on entering viewport */
.fadein.visible, .fadeinTop.visible, .fadeinLeft.visible, .fadeinRight.visible {
    opacity: 1;
    transform: translate(0, 0); /* Move to original position */
}