Losowy „punkt początkowy” dla animacji klatek kluczowych CSS

Mam listę skrzynek z obrazem tła, który przewija się w pionie za pomocą:

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

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

„Problem” polega na tym, że wszystkie pola mają ruchome tło w tym samym czasie.
Chciałbym mieć „losowy punkt początkowy”, aby każde pudełko miało inną animację.

Na przykład jedno tło przesuwa się w dół, a drugie porusza się w górę.

Jest to możliwe dzięki czystemu CSS? Nie mogę znaleźć prostego sposobu z Javascriptem ..

questionAnswers(4)

yourAnswerToTheQuestion