body {
  overflow-x: hidden !important;
}

html, body {
  padding: 0;
  margin: 0;
	width: 100%;
	height: 100%;
	background-color: #333;
}

div#container {
  padding: 0;
  position: relative;
	margin: auto;
	width: 100%;
  height: 100%;
	min-height: 100%;
}

div.movie {
  background-image: url(../images/seamless-bg.jpg);
  background-repeat: repeat;
}

div.star1,
div.star2,
div.star3 {
	background-image: url(../images/star.png);
	background-repeat: no-repeat;
	width: 36px;
	height: 36px;
  margin-left: -18px;
  margin-top: -18px;
	animation-name: animate_one;
  animation-duration: 2s;
  opacity: 0;
}

div.star2 {
	animation-name: animate_two;
	animation-duration: 2s;
	opacity: 0;
}

div.star3 {
  animation-name: animate_three;
  animation-duration: 1s;
  opacity: 0;
}

@keyframes animate_one {
  0% {
  	opacity: 0;
  	transform: rotate(0deg);
  }
  25% {
  	transform: rotate(0deg);
  }
  50% {
  	opacity: 1;
  }
  75% {
  	transform: rotate(60deg);
  }
  100% {
  	transform: rotate(90deg);
  	opacity: 0;
  }
}

@keyframes animate_two {
  0% {
  	opacity: 0;
  	transform: rotate(0deg);
  }
  25% {
  	opacity: 0.1;
  	transform: rotate(0deg);
  }
  50% {
  	opacity: 1;
  }
  75% {
  	transform: rotate(160deg);
  	opacity: 0.9;
  }
  100% {
  	transform: rotate(270deg);
  	opacity: 0;
  }
}

@keyframes animate_three {
  0% {
    transform: scale(0.2)rotate(-30deg);
    opacity: 1;
  }
  10% {
    transform: rotate(20deg) scale(0.2);
    opacity: 1;
  }
  15% {
    transform: rotate(80deg) scale(0.8);
    opacity: 1;
  }
  20% {
    transform: rotate(110deg) scale(0.7);
    opacity: 1;
  }
  100% {
    transform: scale(0.2) rotate(180deg);
    opacity: 0;
  }
}

div.videocontainer {
    position: relative;
    margin: auto;
    width: 80%;
    height: 0;
    padding-bottom: 46.25%;
    margin-bottom: 50px;
}
div.videocontainer iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

div.indicator {
  display: none;
  position: absolute;
  top: 53.5%;
  left: 82.1%;
  margin-left: -50%;
  margin-top: -50%;
  font-size: 10vw;
  transform: rotate(10deg);
  transform-origin: 50% 75%;
  color: #900;
  animation-name: doit;
  animation-duration: 2s;
  animation-iteration-count: 5;
  margin: 0;
}

@keyframes doit {
  0% {
    transform:rotate(15deg);
  }
  10% {
    transform:rotate(25deg);
  }
  20% {
    transform:rotate(10deg);
  }
  30%, 100% {
    transform:rotate(15deg);
  }
  0%, 65%, 80%, 100% {
    margin-top: 0;
  }
  70% {
    margin-top: 20px;
  }

}
