Случайная «начальная точка» для анимации ключевых кадров CSS

У меня есть список полей с фоновым изображением, которое прокручивается по вертикали:

@keyframes movie {
   0% { background-position: 50% 5%; }
   50% { background-position: 50% 95%; }
   0% { background-position: 50% 5%; }
}

.movie {
    animation: movie 50s linear infinite;
}

«Проблема» заключается в том, что таким образом все окна имеют фон, перемещающийся одновременно.
Я хотел бы иметь «случайную стартовую точку», чтобы у каждой коробки была своя анимация.

Например, один фон движется вниз, а другой движется вверх.

Это возможно с чистым CSS? Я не могу найти простой способ ни с Javascript ..

Ответы на вопрос(4)

Ваш ответ на вопрос