html, body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  height: 100%;
}
canvas {
  display: block;
}

.animated {
  background-image: url(/css/images/logo.png);
  background-repeat: no-repeat;
  background-position: left top;
  padding-top:95px;
  margin-bottom:60px;
  -webkit-animation-duration: 10s;
  animation-duration: 3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

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

@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}


@-webkit-keyframes fadeInOut {
  0% {opacity: 0;}
  50% {opacity: 0.75;}
  100% {opacity: 0;}
}

@keyframes fadeInOut {
  0% {opacity: 1;}
  50% {opacity: 1;}
  100% {opacity: 0;}
}


.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

.fadeInOut {
   -webkit-animation-name: fadeInOut;
  animation-name: fadeInOut;
}

.overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background-color: #eee;
  padding-top: 50vh;
  text-align: center;
}