.headcover {display: inline-block; margin-top: 4rem; margin-right: 2rem;  
	transform:rotate(-7deg); -webkit-transform: rotate(-7deg); -moz-transform: rotate(-7deg);
	text-shadow: 3px 3px 6px #ff0000;
}
.author span, .headcover h2 {background: rgba(0,0,0,0.3); padding: 4px;}

/* general */
.shape.large {width: 512px; height: 512px;}
.shape.medium {width: 256px; height: 256px;}
.shape.small {width: 128px; height: 128px;}
@media (max-width: 960px) {
	.shape.large {width: 256px; height: 256px;}
	.shape.medium {width: 128px; height: 128px;}
	.shape.small {width: 64px; height: 64px;}
}

.dreamschool, .ruins, .sullensky, .forsaken {background-size: cover !important; background-position: center center; background-repeat: no-repeat;}
.dreamschool {background: url('imgs/dreamscapeskoolantique.jpg');}
.ruins {background: url('imgs/swindled.jpg');}
.sullensky{background: url('imgs/sullensky.jpg');}
.forsaken{background: url('imgs/open-roof.jpg');}

/* crossfader */
.crossfade-left, .crossfade-right, .crossfade-mid {display: block; height: 35vh; position: relative;}
.crossfade-left > figure, .crossfade-mid > figure, .crossfade-right > figure {
  animation: imageAnimation 30s linear infinite 0s;
  backface-visibility: hidden; background-size: cover;
  background-position: center center; color: transparent;
  height: 100%; left: 0px;
  opacity: 0; position: absolute;
  top: 0px; width: 100%; z-index: 0;
}

.crossfade-left > figure:nth-child(1) { background-image: url('imgs/swindled.jpg'); }
.crossfade-left > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('imgs/gymgrunge.jpg');
}
.crossfade-left > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('imgs/forgotten-factory.jpg');
}
.crossfade-left > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('imgs/lonely_chair.jpg');
}
.crossfade-left > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('imgs/forgotten-fuelstation1.jpg');
}

.crossfade-mid > figure:nth-child(1) { background-image: url('imgs/dreamscapeskoolantique.jpg'); }
.crossfade-mid > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('imgs/zoo-grafiti.jpg');
}
.crossfade-mid > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('imgs/evil-beckons.jpg');
}
.crossfade-mid > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('imgs/bathed-heart.jpg');
}
.crossfade-mid > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('imgs/perishedpeters.jpg');
}

.crossfade-right > figure:nth-child(1) { background-image: url('imgs/sullensky.jpg'); }
.crossfade-right > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('imgs/westingended.jpg');
}
.crossfade-right > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('imgs/excluded_seat.jpg');
}
.crossfade-right > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('imgs/demonhall.jpg');
}
.crossfade-right > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('imgs/lima-tb.jpg');
}
@keyframes imageAnimation {  
0% {
 animation-timing-function: ease-in;
 opacity: 0;
}
 8% {
 animation-timing-function: ease-out;
 opacity: 1;
}
 17% { opacity: 1}
 25% { opacity: 0}
 100% { opacity: 0}
}

/* tree list UI */
.tree-list li ul.nested {margin-left: 1em;}
.tree-list li:hover {background: #000; color: #fff;}
.tree-list li ul {list-style-position: inside; list-style-type: square;}

/* HELLFIRE */
.hellfire {
  background-image: url('imgs/smoke-cloud.jpg'), url('imgs/smoke-cloud.jpg'), linear-gradient(#fff, #999);
  background-blend-mode: difference, difference, normal;
  filter: sepia(1) contrast(6);
  animation: sliding 5s linear infinite;
}
@keyframes sliding {
  from { background-position: 1536px 9216px, 0 7168px, 0 0;}
  to {background-position: 512px 0, 1024px 0, 0 0;}
}