tagblog/css/404.css

/* WEIRD GLITCH EFFECTS FOR THE 404 PAGE */

/*section#content {
  height:100%;
  background-image: url("/stuff/blog/404chimp.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}*/
h1 {
    font-size: 8em;
    font-weight: bold;
  }
.inner {
  animation: flicker 9s linear infinite alternate;
}
span.flicker {
    animation: flicker-less 14s linear infinite alternate;
}
span.invisible {
    animation: invisible 11s linear infinite alternate;
}
/*
header * {
    animation: flicker-less 20s linear infinite;
  }
footer * {
    animation: flicker-less 23s linear infinite;
  }
*/
/*
section#sidebar {
    animation: flicker-less 20s linear infinite;
  }
*/
@keyframes flicker {
  0%,10%,10.2%,39.9%,40.1%,99.8% {
    transform: skew(0deg, 0deg);
  }
  10.1% {
    transform: scale(.1) skewX(80deg);
  }
  40% {
    transform: rotate(360deg);
  }
  99.9% {
    transform: scale(.1) skewY(100deg);
  }
}
@keyframes flicker-less {
  0%, 44.9%, 45.1%, 61.9%, 62.1%, 99.8% {
    opacity: 1;
  }
  45%,62%,99.9% {
    opacity: 0;
  }
}
@keyframes invisible {
  0%, 44.9%, 45.1%, 51.9%, 52.1%, 99.8% {
    opacity: 0;
  }
  45%,52%,99.9% {
    opacity: 1;
  }
}