CSS3 Flickr Loading Animation (Spinner)

Flickr's loading/spinning animation in CSS3 using bleeding edge CSS3 animation-direction properties like reverse and alternate-reverse. Some info on the different values accepted by animation-direction -

normal - animation plays forward on each cycle and then resets to the beginning at the end. (defaul)
alternate - animation direction and timing functions are reversed after each cycle.
reverse - animation plays backwards every cycle, basically the opposite of normal.
alternate-reverse - animation plays backwards on first play, then forwards and then continues to alternate.

Original code by Lea Verou.