/* Slide Animations */
@keyframes slideFromLeft {
    0% {
        transform: translateX(-100%);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideFromRight {
    0% {
        transform: translateX(100%);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

.mobile-main-content-about-us-content
{
    top: 22%;
}

.mobile-main-content-img {
    overflow: hidden;
}

.mobile-main-content-img img {
    width: 90%;
    height: auto;
    display: block;
    margin: 0 auto;
    opacity: 0; /* Start with opacity 0 */
}

/* Classes that will be added by JavaScript */
.slide-from-left {
    animation: slideFromLeft 1s ease-out forwards;
}

.slide-from-right {
    animation: slideFromRight 1s ease-out forwards;
}

/* Apply animations to each image with delays */
.mobile-main-content-img:nth-child(1) img {
    animation: slideFromLeft 1s ease-out forwards, pulse 2s ease-in-out 1s infinite;
}

.mobile-main-content-img:nth-child(2) img {
    animation: slideFromRight 1s ease-out 0.3s forwards, pulse 2s ease-in-out 1.3s infinite;
    opacity: 0;
}

.mobile-main-content-img:nth-child(3) img {
    animation: slideFromLeft 1s ease-out 0.6s forwards, pulse 2s ease-in-out 1.6s infinite;
    opacity: 0;
}

.mobile-main-content-img:nth-child(4) img {
    animation: slideFromRight 1s ease-out 0.9s forwards, pulse 2s ease-in-out 1.9s infinite;
    opacity: 0;
}