body {
	background-color: #222034;

	/* background: -webkit-radial-gradient(50% 50%, circle farthest-corner, #666, #333); */
}

.state.game {
	text-align: center;
	background: transparent;
}
.stage {
	border: solid 1px rgba(0,0,0,0.5);
	box-shadow: 0 0 8em rgba(0,0,0,0.5);
}
#game-stage {
	margin: 1em auto;
}

.stage .layer {
	border: none;
}

canvas, img {
    image-rendering: optimizeSpeed;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: optimize-contrast;
    image-rendering: pixelated;
    -ms-interpolation-mode: nearest-neighbor;
    border: 5px solid #ddd;
}

.game-controls button {
	padding: 0.75em 1.25em;
	margin: 0.5em;
	font-size: 30px;
	border-radius: 1em;
	border: solid 1px black;
	font-weight: bold;
	color: rgba(0,0,0,0.8);
	background-color: #3F3F74;
	outline: none;
	text-align: center;
	box-shadow: inset 0.04em .3em 0em rgba(255,255,255,0.2), 
		inset -0.04em -.3em 0 rgba(0,0,0,0.4),
		.2em .2em .4em rgba(0,0,0,0.2);
	transition: background 0.2s ease-in-out;
}
	.game-controls button:hover,
	.game-controls button.hover {
		background-color: #306082;
	}
	.game-controls button:active, 
	.game-controls button.active {
		background-color: #639BFF;
	}

header {
	background-image: none;
	text-align: center;
}
	header h1 {
		font-size: 5em;
	}

.game h2 {
	display: block;
	font-family: 'Press Start 2P';
	color: #9BADB7;
}

.gameInfo {
	width: 600px;
	padding: 0 20px;
	margin: 6em auto;
	font-size: 80%;
	color: #9BADB7;
	text-align: left;
	font-family: 'Press Start 2P';
	line-height: 1.5em;
}
.credits {
	font-size: 60%;	
}
.gameInfo a,
.gameInfo a:visited {
	color: #CBDBFC;
}
.gameInfo a:hover {
	color: #fff;
}