@charset "UTF-8";


/* ==================================================================

  style.css

================================================================== */

html,
body,
#wrapper,
.inner {
  position: relative;
  width: 100%;
  height: 100%;
}

/* wrapper
__________________________________________ */
#wrapper {
  z-index: 10;
}
h1 {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url("../img/logo.svg");
  background-repeat: no-repeat;
  background-size: 200%;
  background-position: center center;
  text-indent: -9999px;
}
@media screen and (max-width: 768px) {
  h1 {
    background-size: 300%;
  }
}

/* huerotator
__________________________________________ */
#huerotator {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: -webkit-linear-gradient(left top, #a6d900 0, #ff4454 100%) #a6d900;
  background: linear-gradient(to right bottom, #a6d900 0, #ff4454 100%) #a6d900;
  opacity: .8;
  -webkit-transition: opacity 5s;
  transition: opacity 5s;
  -webkit-animation: huerotator 40s infinite alternate;
  animation: huerotator 40s infinite alternate
}
@-webkit-keyframes huerotator {
  0% {-webkit-filter:hue-rotate(0)}
  100% {-webkit-filter:hue-rotate(360deg)}
}
@keyframes huerotator {
  0% {-webkit-filter:hue-rotate(0);filter:hue-rotate(0)}
100% {-webkit-filter:hue-rotate(360deg);filter:hue-rotate(360deg)}
}

/* btn
__________________________________________ */
.btn {
  position: absolute;
  right: 30px;
  top: 30px;
}
.btn a {
  font-size: 13px;
}