Advanced CSS - is it possible to group CSS animations ... like, umm - ....

Question

What i mean is... if I had 5 different elements and they each have their own animations (it could be the same animation)
and different durations (could be same dur)l.
So I want them all to play. When they cycle one (or more) they stop.
After all of them stop, then they all start over.
- - - - - -
I can make a quick code if needed.
- - - -

Imagine: there are four runners. They each have to run one mile. Not all of them have the same speed.
After they all four finish running, they line up and run again...

Answer 1

Yes. All the animations will have same duration,
different animation names,
Animation Iteration count will be infinite.
In keyframes of each animation the animations will stop at 100%.
Each keyframes will start at different %.
Sorry If I can't put it in words properly...I can code an example for you..

Answer 2

this is what im trying to make:
let's say i have 5 different text | paragraph | or words.
Exmple: the cow, is now, running, down, fast)

All those words are on the same line and at the same spot. which you cant't read them while they are piled @ the same spot.
So, I want them all to be transparent. --- then with the animation, I want them to color:black (display block).
So the cow shows, then disappear, then the 'is now' shows, then disappears... after all of them go theough the same process, then they all restart (restart from 'the cow).
a starter code:
https://code.sololearn.com/Winz7c2nG54T/?ref=app

i tried to do it, but.. i can't time it correctly..