# CSS - circular movement animation

Recently, when playing with CSS animation, I was wondering how to create a circular movement e.g. the moon orbiting around the earth.

So after some experimentation and googling this is what i came up with:

The trick is to

1. add a rotation animation to the moon:

animation: rotation 3s linear infinite;

2. move the rotation point from the middle of the moon to earths center:

transform-origin: 25px 200px;