#earth {
    width: 470px;
    height: 470px;
    background: url(world-map.png);
    border-radius: 50%;
    background-size: 100%;
    box-shadow: inset 8px 36px 80px 36px rgb(0 0 0), inset -6px 0 12px 4px rgb(255 255 255 / 30%);
    animation-name: rotate;
    animation-duration: 12s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: rotate;
    -webkit-animation-duration: 12s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    opacity: 0.1;
    background-repeat:repeat-x;
}

@keyframes rotate {
    from { background-position: 0px 0px; }
    to { background-position: 800px 0px; }
}
@-webkit-keyframes rotate {
    from { background-position: 0px 0px; }
    to { background-position:800px 0px; }
}