body {
	background-color: black;
	background: black url('img/galaxy.gif') 50% 50% repeat;
	top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0px;
    display: table;
    position: absolute;
}

.scrollbar { width: 0; height: 5px; background: white; max-width: 100%; margin: 0 auto; }

html { overflow: hidden; font-family: sans-serif; color: white; }
a { color: white; }
h1 { font-size: 1.5em }
h4.explain { display: none; }
p { white-space: pre-line; font-size: 0.8em; }
html * { box-sizing: border-box; }

:selection { background-color: transparent; }

div.topstats, div.bottomstats {
	position: fixed; width: 100%; z-index: 99;
	text-align: center; font-size: 0.65em; letter-spacing: 2px; text-transform: uppercase }
div.bottomstats { bottom: 1em }
table.space { 
	position: relative; top: 0; left: 0;
	width:100%; height: 100%; vertical-align: middle; text-align: center; 
	}
	table.space img {
	transform: scale(0.05);
	/*
	-webkit-transition: transform 50ms;
	-moz-transition: transform 50ms;
	-o-transition: transform 50ms;
	transition: transform 50ms;
	*/
}
table.space td#layer0 {
    position: relative !important;
}
table.space { display: none; }

table.space td {
    position: absolute !important;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.space.zero { z-index: 6; display: table;
	-webkit-transform: scale(1) !important;
	-moz-transform: scale(1) !important;
	-o-transform: scale(1) !important;
	transform: scale(1) !important;
	}
	div.textbox { border: 1px solid white; padding: 2em; max-width: 30em; width: 70%; margin: 0 auto; color: white }
.space.one { z-index: 5; }
	.space.one { }
.space.two { z-index: 4; }
.space.three img {
    max-height: 35%;
    margin: 25% 0px;
}
/* .space.two td img { max-height: 100vh; } */
td img { max-width: 100%; max-height: 100%; }

.rotates_fast {
	-webkit-animation: rotate 8s linear infinite;
	-moz-animation: rotate 8s linear infinite;
	-o-animation: rotate 8s linear infinite;
	animation: rotate 8s linear infinite;
	}
.rotates {
	-webkit-animation: rotate 20s linear infinite;
	-o-animation: rotate 20s linear infinite;
	-moz-animation: rotate 20s linear infinite;
	animation: rotate 20s linear infinite;
	}
.rotates_slow {
	-webkit-animation: rotate 60s linear infinite;
	-o-animation: rotate 60s linear infinite;
	-moz-animation: rotate 60s linear infinite;
	animation: rotate 60s linear infinite;
}
@-webkit-keyframes rotate {
	 from {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	 }
	 to {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		}
}
@keyframes rotate {
	 from {
		transform: rotate(0deg);
	 }
	 to {
		transform: rotate(360deg);
		}
}
@-moz-keyframes rotate {
	 from {
		-moz-transform: rotate(0deg);
	 }
	 to {
		-moz-transform: rotate(360deg);
		}
}

.showexplain, .showabout { cursor: pointer }
div.explainer, div.aboutthis {
	background: rgba(0,0,0,0.9);
	border-style: dashed;
	cursor: pointer;
	display: none;
	position: fixed; left: 25vw; width: 50vw;
	z-index: 999;
}
div.explainer { top: 5%; }
div.aboutthis { bottom: 5%; }

span.shownames { text-decoration: underline; font-size: 0.8em; }
.showingcaptions { text-decoration: underline; }
span.shownames.showingcaptions { text-decoration: line-through }