::-webkit-scrollbar {
 display: none;
}

.acid, .acid-text { position: relative }

@font-face {
  font-family: 'Crafty Girls';
  font-style: normal;
  font-weight: 400;
  src: local('Crafty Girls'), local('CraftyGirls'), url(http://fonts.gstatic.com/s/craftygirls/v5/0Sv8UWFFdhQmesHL32H8o4nF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
}

body, html {
  background-color: #0DFF93;
  height: 100%;
  width: 100%;
  text-align: center
}

body:hover .acid-text, html:hover .acid-text { opacity: .6 }

.acid-text {
  font-family: 'Crafty Girls', cursive;
  font-size: 15vw;
  z-index: 2;
  color: rgba(255,255,255,.2);
  transition: opacity 2s cubic-bezier(.55, .46, .15, .99)
}

.acid .trip, .acid-text {
  opacity: 0;
  -webkit-transition: opacity 2s cubic-bezier(.55, .46, .15, .99)
}

.acid .trip {
  background: 0 0;
  height: 250%;
  height: 250vh;
  margin-left: -150%;
  margin-top: -180%;
  transition: opacity 2s cubic-bezier(.55, .46, .15, .99);
  width: 250%;
  width: 250vw;
  z-index: 1
}

.acid .trip:hover { cursor: crosshair }

.acid .trip.on { opacity: .8 }