} .son{ position: absolute; top: 15em; left: 15em; width: 10em; height: 10em; border-radius: 50%; background-color: blue; box-shadow: 00 3em yellow; } .earth,.moon{ position: absolute; border-style:relative; border-color: white transparent; border-width: 0.10em 0.1em 00; border-radius: 50%;
} .earth{ top: 2em; left: 2em; width: 15em; height: 15em; animation:orbit 36.5em linear infinite;
} .moon{ top: 0; right: 0; width: 4em; height: 4em; animation: orbit 2.7s linear infinite; } .earth::before, .moon::before{ content: ""; position:absolute; border-radius:50%; } .earth::before{ top:2.8em; right:2.8em; width:1.2em; height:1.2em; background-color: silver;
} @keyframes orbit{ to{ transform: rotate(360deg); } } } }