body {
  background-color: #00245e;
}
body #body-wrap {
  bottom: 0;
  left: 0;
  padding-top: 50px;
  position: fixed;
  right: 0;
  top: 0;
  z-index: -1;
}
body .star {
  background-color: #4568a0;
  width: 60px;
  height: 10px;
  border-radius: 20px 20px;
  position: absolute;
}
body .star:nth-of-type(1) {
  top: 5%;
  animation: animateStar 10s linear infinite;
}
body .star:nth-of-type(2) {
  top: 10%;
  animation: animateStar 8s linear infinite;
}
body .star:nth-of-type(3) {
  top: 20%;
  animation: animateStar 6s linear infinite;
}
body .star:nth-of-type(4) {
  top: 30%;
  animation: animateStar 9s linear infinite;
}
body .star:nth-of-type(5) {
  top: 50%;
  animation: animateStar 7s linear infinite;
}
body .star:nth-of-type(6) {
  top: 60%;
  animation: animateStar 30s linear infinite;
}
body .star:nth-of-type(7) {
  top: 70%;
  animation: animateStar 18s linear infinite;
}
body .star:nth-of-type(8) {
  top: 80%;
  animation: animateStar 20s linear infinite;
}
body .star:nth-of-type(9) {
  top: 90%;
  animation: animateStar 25s linear infinite;
}
body .star:nth-of-type(10) {
  top: 99%;
  animation: animateStar 10s linear infinite;
}
body .rocket {
  top: 35%;
  position: relative;
  overflow: hidden;
  height: 200px;
  animation: animateShip 20s linear infinite;
}
body .rocket svg {
  animation: enlarge 2s infinite;
  height: 200px;
  overflow: visible;
  max-height: 80%;
}

@keyframes enlarge {
  0% {
    transform: scale(0.4) rotate(45deg);
  }
  50% {
    transform: scale(0.5) rotate(45deg);
  }
  100% {
    transform: scale(0.4) rotate(45deg);
  }
}
@keyframes animateShip {
  0% {
    margin-left: -300px;
  }
  55% {
    margin-left: 55%;
  }
  60% {
    margin-left: 40%;
  }
  100% {
    margin-left: 100%;
  }
}
@keyframes animateStar {
  0% {
    margin-left: 100%;
    opacity: .3;
  }
  100% {
    margin-left: -300px;
    opacity: .1;
  }
}