/* ==== Google font ==== */
@import url('http://fonts.googleapis.com/css?family=Lato:400,300,700,900');

@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 400;
  src: local('Dancing Script Regular'), local('DancingScript-Regular'), url(https://www.i-neighbour.com/templates/layout/code/fonts/DK0eTGXiZjN6yA8zAEyM2VhlQWQpSCpzb2Peu3I-Q34.woff) format('woff');
}

html {
  background-color: #434d5a;
  animation: to_deep_space 25s linear infinite alternate;
  overflow: hidden;
}


h2.subtitle {
	font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 400;
	color: #fff;
	font-size: 45px;
	text-align:center;
}

#rocket_div {
  margin: 10% auto;
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  width: 600px;
}

#rocket {
  height: 220px;
  display: block;
  position: absolute;
  z-index: 1;
  animation: rocket_shake .1s linear infinite alternate;
  -webkit-animation: rocket_shake linear .1s infinite; 
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}

#rocket_blur {
  height: 220px;
  display: block;
  position: absolute;
  z-index: 1;
  animation: rocket_shake .15s linear infinite alternate;
  -webkit-animation: rocket_shake linear .15s infinite;
  opacity: 0.3;
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}

#fireglow {
  height: 50px;
  width: 50px;
  position: relative;
  margin-top: 20%;
  margin-left: -435px;
  background-color: white;
  opacity: 0.1;
  border-radius: 90px 90px;
  animation: rocket_shake .1s linear infinite alternate;
  -webkit-animation: rocket_shake linear .1s infinite; 
}

/*#moon {
  animation: fall 200s linear infinite;
  margin: -20% 75%;
  z-index: 0;
  position: absolute;
  background-image: url("https://i.imgur.com/9LY9Cqp.png");
}*/

.star1 {
  position: absolute;
  background-color: yellow;
  height: 2px;
  width: 2px;
  animation: fall 150s linear infinite;
  z-index: 0;
}

.star2{
  position: absolute;
  background-color: yellow;
  height: 3px;
  width: 3px;
  animation: fall 75s linear infinite;
}

.star3{
  position: absolute;
  background-color: yellow;
  height: 3px;
  width: 3px;
  animation: fall 50s linear infinite;
}

@keyframes fall {
  to {margin-top: 500%;}
}

@-webkit-keyframes {
  to {margin-top: 500%;}
}

@keyframes to_deep_space {
  from {background-color: #434d5a;}
  to {background-color: #131619;}
}

@keyframes rocket_shake {
  from {left: 35%;}
  to {left: 36%;}
}

@-webkit-keyframes rocket_shake {
  from {left: 35%;}
  to {left: 36%;}
}