html, body {
  min-height: 100%;
  overflow: hidden;
  margin: 0px; }

body {
  background: radial-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
  background-size: cover;
  font-family: Lucida Bright;
  font-size: 1em; }

@keyframes welcomeExplosion {
  0% {
    -webkit-filter: blur(10px);
    opacity: 0;
    transform: scale3d(0.5, 0.5, 0.5); }
  10% {
    -webkit-filter: blur(10px);
    opacity: 0;
    transform: scale3d(0.5, 0.5, 0.5); }
  20% {
    -webkit-filter: blur(1px);
    opacity: 0.33;
    transform: scale3d(1, 1, 1); }
  30% {
    -webkit-filter: blur(1px);
    opacity: 0.33;
    transform: scale3d(1, 1, 1); }
  100% {
    -webkit-filter: blur(25px);
    opacity: 0;
    transform: scale3d(2.2, 2.2, 2.2); } }
@keyframes scrollKill {
  0% {
    -webkit-filter: blur(0px); }
  40% {
    -webkit-filter: blur(0px); }
  100% {
    -webkit-filter: blur(25px); } }
@keyframes scrollKillReverse {
  0% {
    -webkit-filter: blur(25px); }
  60% {
    -webkit-filter: blur(0px); }
  100% {
    -webkit-filter: blur(0px); } }
div.scroll_container {
  position: absolute;
  width: 52%;
  padding-bottom: 50.6%;
  left: -3%;
  top: 3%;
  font-size: 1.5em; }

.scroll {
  width: 100%;
  height: 100%;
  background-image: url("../img/oldscroll.png");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute; }
  .scroll .text {
    position: relative;
    left: 24%;
    top: 17%;
    width: 48%;
    height: 66%;
    box-sizing: border-box; }
  .scroll .pantoumBlock {
    /* Pantoum poem variations */
    margin-bottom: 0.5em; }
    .scroll .pantoumBlock .pantoum {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      transition: background 6s ease-in-out, min-height 1.3s ease-in-out, opacity 2s ease-in-out;
      background: radial-gradient(ellipse at center, rgba(35, 58, 62, 0) 0%, rgba(125, 185, 232, 0) 100%);
      /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      min-height: 0em;
      opacity: 1; }
      .scroll .pantoumBlock .pantoum.disabled {
        opacity: 0; }
      .scroll .pantoumBlock .pantoum.next {
        min-height: 1em;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#233a3e+0,7db9e8+100&0.36+0,0+100 */
        background: radial-gradient(ellipse at center, rgba(35, 58, 62, 0.26) 0%, rgba(125, 185, 232, 0) 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ }

div.player_controlled {
  left: 0;
  top: 0;
  position: absolute;
  max-width: 300px;
  font-size: 1.6em; }
  div.player_controlled .splash {
    animation-name: welcomeExplosion;
    animation-duration: 4s;
    animation-timing-function: ease-out;
    position: absolute;
    transform-origin: 50% 50%;
    width: 150px;
    height: 150px;
    margin-left: 50px;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0;
    transform: scale3d(0.5, 0.5, 0.5); }

div.wordFountain {
  position: absolute;
  left: 50%;
  top: 50%;
  font-size: 0.75em;
  margin: -5em;
  padding: 5em; }

@keyframes fountainKill {
  from {
    transform: rotate3d(0, 1, 0.1, 0deg);
    -webkit-perspective: 100px;
    -webkit-perspective-origin: 50% 50%; }
  to {
    transform: rotate3d(0, 1, 0.1, -54deg);
    -webkit-perspective: 1px;
    -webkit-perspective-origin: 35% 50%; } }
@keyframes fountainKillReverse {
  from {
    transform: rotate3d(0, 1, 0.1, -54deg);
    -webkit-perspective: 1px;
    -webkit-perspective-origin: 35% 50%; }
  to {
    transform: rotate3d(0, 1, 0.1, 0deg);
    -webkit-perspective: 100px;
    -webkit-perspective-origin: 50% 50%; } }
.fountain {
  width: 100%;
  height: 100%;
  position: absolute;
  transform: rotate3d(0, 1, 0.1, 0deg);
  -webkit-perspective-origin: 50% 50%;
  -webkit-perspective: 100px;
  -webkit-transform-style: preserve-3d; }

@keyframes overKill {
  0% {
    background-color: transparent; }
  30% {
    background-color: rgba(0, 0, 0, 0.15); }
  100% {
    background-color: black; } }
@keyframes overKillReverse {
  0% {
    background-color: black; }
  100% {
    background-color: transparent; } }
.overlay {
  background-color: black;
  position: absolute;
  width: 100%;
  height: 100%; }

/*# sourceMappingURL=main.css.map */