HTML/CSS - A car cruising on the road! Pure CSS, no JS! Online Editor and JavaScript Compiler

html

<!DOCTYPE html>
<html>
    <head>
        <title>Moving Car by Emmanuel Nwokoma</title>
    </head>
    <body>
    <div class="moon"></div>
    <div class="skyline">
        <div class="building1-shadow"></div>
        <div class="building1">
            <div class="building-left-half"></div>
            <div class="building-right-half"></div>
        </div>
    </div>
    <div class="road">
        <div class="road-top-half"></div>
        <div class="road-bottom-half"></div>
    </div>
    <div class="car-container">
        <div class="car-top1">
            <div class="window1"></div>
            <div class="window2"></div>
        </div>
        

css

   html {
        box-sizing: border-box;
    }
    *,
    *:before,
    *:after {
        box-sizing: inherit;
    }
body {
    over        }
    }
    @keyframes road-moving {
        100% {
            transform: translate(-2400px);
        }
    }
    @keyframes wheelsRotation {
        100% {
            transform: rotate(360deg);
        }
    }
@keyframes moon {
  50% {
    transform: translateY(-20px);
  }
   100% {
    transform: translate(80px, -140px);
  }

BROWSER

Console