@keyframes slideRight{
    from{
        transform: translateX(-500px);
    }

    to{
        transform: translateX(0);
    }
}

@keyframes slideLeft{
    from{
        transform: translateX(500px);
    }

    to{
        transform: translateX(0);
    }
}


.ser-anime  #DoctorAppointments, 
.ser-anime  #OnlineConsultation, 
.ser-anime  #PharmacyServices, 
.ser-anime  #EmergencyServices 
{
    animation: slideRight 1s;

}

.ser-anime #MedicalRecordsManagement,
.ser-anime #LabTestBookings,
.ser-anime #HealthPackages,
.ser-anime #HealthInformation{
    animation: slideLeft 1s;

}

/* .ser-anime  #DoctorAppointments{ animation: slideRight 1s forwards 0.2s;}
.ser-anime  #OnlineConsultation{ animation: slideLeft 1s forwards 0.4s;}
.ser-anime  #MedicalRecordsManagement{ animation: slideRight 1s forwards 0.6s;}
.ser-anime  #LabTestBookings{ animation: slideLeft 1s forwards 0.8s;}
.ser-anime  #PharmacyServices{ animation: slideRight 1s forwards 1.0s;}
.ser-anime  #EmergencyServices{ animation: slideLeft 1s forwards 1.2s;}
.ser-anime  #HealthPackages{ animation: slideRight 1s forwards 1.4s;}
.ser-anime  #HealthInformation{ animation: slideLeft 1s forwards 1.6s;} */