.headcover {
	display: block;
	background-size: cover !important; background-position: center center; 
	background-repeat: no-repeat;
	background: url('imgs/letenergygrow.jpg');
}
.headcover h1 {display: inline-block; margin-top: 5rem; margin-right: 2rem;  
	transform:rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg);
	/*text-shadow: 3px 3px 6px #000;*/
}

/* 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, .dune {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');}
.dune{background: url('imgs/dunescape.jpg');}

/* crossfader */
.crossfade-left, .crossfade-right, .crossfade-mid {display: block; height: 50vh; 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/stjoepier-bw.jpg'); }
.crossfade-left > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('imgs/nocturnal-crosswalk.jpg');
}
.crossfade-left > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('imgs/industrial-nature.jpg');
}
.crossfade-left > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('imgs/purgatory-stairs.jpg');
}
.crossfade-left > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('imgs/covid-everywhere.jpg');
}

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

.crossfade-right > figure:nth-child(1) { background-image: url('imgs/nuclear-edgeland.jpg'); }
.crossfade-right > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('imgs/grassy-knoll.jpg');
}
.crossfade-right > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('imgs/confined_illumination.jpg');
}
.crossfade-right > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('imgs/dreamcorridor.jpg');
}
.crossfade-right > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('imgs/purple-parking.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 */
.outline-list {list-style-type: none;}
.outline-list>li {border-bottom: 2px solid #fff; margin-bottom: 0.75em; padding-bottom: 0.75em;}
.outline-list .parent {font-weight: 600; }
.outline-list>ul { margin-left: 1.25em;}
.outline-list>ul>li {font-weight: normal;}

.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;}