/* تنسيق حاوية الصور */
.images-container {
    display: flex; /* تفعيل flexbox */
    justify-content: flex-start; /* محاذاة الصور من اليسار */
    align-items: center; /* محاذاة الصور عمودياً في المركز */
}

/* تنسيق الصور الداخلية */
.animated-image1, .animated-image2, .animated-image3 {
    width: 5%; /* تعديل النسبة المئوية حسب الحاجة */
    height: 5%; /* يحافظ على نسب الأبعاد */
    position: relative;
    display: block;
    margin: 5px; /* توفير مسافة بين الصور */
}

/* حركات الصور تبقى كما هي */
.animated-image1 {
    animation: vertical-move 5s infinite ease-in-out;

}

.animated-image2 {
    animation: move-vertical 3s infinite alternate ease-in-out;
}

.animated-image3 {
    animation: quick-scale 1s infinite alternate ease-in-out;
}

/* تعريفات الحركة تبقى كما هي دون تغيير */
@keyframes vertical-move {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }
}

@keyframes move-vertical {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(30px);
    }
}

@keyframes quick-scale {
    from {
        transform: scale(1);
    }

    to {
        transform: scale(1.2);
    }
}