<div class="millennium_falcon"></div>
<!-- TODO: Add more spaceships -->
body {
  background-color: black;
  background-image: url(https://thepracticaldev.s3.amazonaws.com/i/mqrxqwndr0u0meb28xm4.jpg);
  background-size: cover;
  height: 100vh;
  width: 100vw;
}

.millennium_falcon {
  position: absolute;
  right: 30%;
  top: 40%;
  animation: hyperjump 9s ease-in-out infinite;
  animation-delay: 1s;
  width: 5px;
  height: 5px;
  opacity: 0;
  box-shadow: 30px 20px 0 #363435, 35px 20px 0 #333132, 40px 20px 0 #363435, 45px 20px 0 #363435, 50px 20px 0 #363435, 55px 20px 0 #363435, 60px 20px 0 #363435, 20px 25px 0 #363435, 25px 25px 0 #363435, 30px 25px 0 #363435, 35px 25px 0 #363435, 40px 25px 0 #363435, 45px 25px 0 #363435, 50px 25px 0 #363435, 55px 25px 0 #363435, 60px 25px 0 #363435, 65px 25px 0 #363435, 70px 25px 0 #363435, 20px 30px 0 #363435, 25px 30px 0 #8c8c8c, 30px 30px 0 #8c8c8c, 35px 30px 0 #8c8c8c, 40px 30px 0 #b3b3b3, 45px 30px 0 #b3b3b3, 50px 30px 0 #8c8c8c, 55px 30px 0 #8c8c8c, 60px 30px 0 #8c8c8c, 65px 30px 0 #8c8c8c, 70px 30px 0 #363435, 75px 30px 0 #363435, 80px 30px 0 #363435, 15px 35px 0 #363435, 20px 35px 0 #8c8c8c, 25px 35px 0 #8c8c8c, 30px 35px 0 #8c8c8c, 35px 35px 0 #8c8c8c, 40px 35px 0 #b3b3b3, 45px 35px 0 #b3b3b3, 50px 35px 0 #8c8c8c, 55px 35px 0 #8c8c8c, 60px 35px 0 #8c8c8c, 65px 35px 0 #8c8c8c, 70px 35px 0 #8c8c8c, 75px 35px 0 #8c8c8c, 80px 35px 0 #8c8c8c, 85px 35px 0 #363435, 15px 40px 0 #363435, 20px 40px 0 #8c8c8c, 25px 40px 0 #8c8c8c, 30px 40px 0 #8c8c8c, 35px 40px 0 #8c8c8c, 40px 40px 0 #b3b3b3, 45px 40px 0 #b3b3b3, 50px 40px 0 #b3b3b3, 55px 40px 0 #8c8c8c, 60px 40px 0 #8c8c8c, 65px 40px 0 #8c8c8c, 70px 40px 0 #8c8c8c, 75px 40px 0 #8c8c8c, 80px 40px 0 #8c8c8c, 85px 40px 0 #8c8c8c, 90px 40px 0 #363435, 15px 45px 0 #363435, 20px 45px 0 #8c8c8c, 25px 45px 0 #333132, 30px 45px 0 #8c8c8c, 35px 45px 0 #5c5c5c, 40px 45px 0 #5c5c5c, 45px 45px 0 #5c5c5c, 50px 45px 0 #5c5c5c, 55px 45px 0 #ababab, 60px 45px 0 #ababab, 65px 45px 0 #ababab, 70px 45px 0 #ababab, 75px 45px 0 #363435, 80px 45px 0 #363435, 85px 45px 0 #363435, 90px 45px 0 #363435, 15px 50px 0 #363435, 20px 50px 0 #8c8c8c, 25px 50px 0 #8c8c8c, 30px 50px 0 #8c8c8c, 35px 50px 0 #5c5c5c, 40px 50px 0 #8c8c8c, 45px 50px 0 #8c8c8c, 50px 50px 0 #5c5c5c, 55px 50px 0 #ababab, 60px 50px 0 #ababab, 65px 50px 0 #ababab, 70px 50px 0 #ababab, 75px 50px 0 #363435, 15px 55px 0 #363435, 20px 55px 0 #8c8c8c, 25px 55px 0 #333132, 30px 55px 0 #8c8c8c, 35px 55px 0 #5c5c5c, 40px 55px 0 #5c5c5c, 45px 55px 0 #5c5c5c, 50px 55px 0 #5c5c5c, 55px 55px 0 #ababab, 60px 55px 0 #ababab, 65px 55px 0 #ababab, 70px 55px 0 #ababab, 75px 55px 0 #363435, 80px 55px 0 #363435, 85px 55px 0 #363435, 90px 55px 0 #363435, 15px 60px 0 #363435, 20px 60px 0 #8c8c8c, 25px 60px 0 #8c8c8c, 30px 60px 0 #8c8c8c, 35px 60px 0 #8c8c8c, 40px 60px 0 #b3b3b3, 45px 60px 0 #b3b3b3, 50px 60px 0 #b3b3b3, 55px 60px 0 #8c8c8c, 60px 60px 0 #8c8c8c, 65px 60px 0 #8c8c8c, 70px 60px 0 #8c8c8c, 75px 60px 0 #8c8c8c, 80px 60px 0 #8c8c8c, 85px 60px 0 #8c8c8c, 90px 60px 0 #363435, 15px 65px 0 #363435, 20px 65px 0 #8c8c8c, 25px 65px 0 #8c8c8c, 30px 65px 0 #8c8c8c, 35px 65px 0 #8c8c8c, 40px 65px 0 #b3b3b3, 45px 65px 0 #b3b3b3, 50px 65px 0 #8c8c8c, 55px 65px 0 #8c8c8c, 60px 65px 0 #8c8c8c, 65px 65px 0 #8c8c8c, 70px 65px 0 #8c8c8c, 75px 65px 0 #8c8c8c, 80px 65px 0 #8c8c8c, 85px 65px 0 #363435, 20px 70px 0 #363435, 25px 70px 0 #8c8c8c, 30px 70px 0 #8c8c8c, 35px 70px 0 #8c8c8c, 40px 70px 0 #b3b3b3, 45px 70px 0 #b3b3b3, 50px 70px 0 #8c8c8c, 55px 70px 0 #8c8c8c, 60px 70px 0 #8c8c8c, 65px 70px 0 #8c8c8c, 70px 70px 0 #363435, 75px 70px 0 #363435, 80px 70px 0 #363435, 20px 75px 0 #363435, 25px 75px 0 #363435, 30px 75px 0 #363435, 35px 75px 0 #363435, 40px 75px 0 #363435, 45px 75px 0 #363435, 50px 75px 0 #363435, 55px 75px 0 #363435, 60px 75px 0 #363435, 65px 75px 0 #363435, 70px 75px 0 #363435, 30px 80px 0 #363435, 35px 80px 0 #363435, 40px 80px 0 #363435, 45px 80px 0 #363435, 50px 80px 0 #363435, 55px 80px 0 #363435, 60px 80px 0 #363435;
}

@keyframes hyperjump {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  1% {
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(-100vw);
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.