#container{
-webkit-animation: scale-in-ver-top 0.5s steps(13, end) 0.6s both;
	        animation: scale-in-ver-top 0.5s steps(13, end) 0.6s both;
}

@-webkit-keyframes scale-in-ver-top {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes scale-in-ver-top {
  0% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}

#logo{
  -webkit-animation: fade-in 0.5s steps(4, end) 1s both;
	        animation: fade-in 0.5s steps(4, end) 1s both;
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

#heart{
  -webkit-animation: fade-in 0.5s steps(4, end) 1.3s both;
	        animation: fade-in 0.5s steps(4, end) 1.3s both;
}

#floatie{
  -webkit-animation: fade-in 0.5s steps(5, end) 1.6s both;
	        animation: fade-in 0.5s steps(5, end) 1.6s both;
}

#frame{
  -webkit-animation: fade-in 0.5s steps(5, end) 1.6s both;
	        animation: fade-in 0.5s steps(5, end) 1.6s both;
}

#splat{
  -webkit-animation: fade-in 0.3s steps(5, end) 1.7s both;
	        animation: fade-in 0.3s steps(5, end) 1.7s both;
}

#chibi{
  -webkit-animation: fade-in 0.6s steps(8, end) 2s both;
	        animation: fade-in 0.6s steps(8, end) 2s both;
}

#musicplayer{
  -webkit-animation: scale-in-hor-right 0.5s steps(20, end) 2.3s both;
	        animation: scale-in-hor-right 0.5s steps(20, end) 2.3s both;
}

@-webkit-keyframes scale-in-hor-right {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes scale-in-hor-right {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
    opacity: 1;
  }
}

#back{
  -webkit-animation: fade-in 1s steps(12, end) 3s both;
	        animation: fade-in 1s steps(12, end) 3s both;
}

