My example/work: <http://thomasdebelder.be/1/>
I'm trying to rotate a moon, planet like this: <https://www.google.com/doodles/new-horizons-pluto-flyby> but it doesnt work, I tryed in my css code to transform:rotate it with 180 and 360 deg, rotating it around the X, with transform-origin:center but it still rotates badly. It needs rotate around the center, like in the google link not from left to right.

`@keyframes moon {
100% {
 transform:rotate(180deg);
}}`

```
      <!-- MOON -->
        <div class="moon">
        <img src="images/moon.png">
        </div> 

```