styles.css

html, body {
	height: 100%;
	width: 100%;
}

body {
	background-color: hsl(200, 40%, 70%);
	color: hsl(200, 40%, 10%);
	font-family: Raleway, sans-serif;
}

.strike {
	text-decoration: line-through;
}

#gh-link {
	margin-top: 10px;
	font-size: 0.9em;
	color: hsl(30, 100%, 30%);
}

#gh-link:hover {
	color: hsl(30, 100%, 40%);
}

#game, #splash-screen {
	position: absolute;
	height: 600px;
	width: 1000px;
	top: 50px;
	margin: 0 auto;
	left: 0;
	right: 0;
}

#game {
	z-index: 2;
	animation-duration: 4s;
	animation-name: splash-fade;
	animation-fill-mode: forwards;
	-webkit-animation-duration: 4s;
	-webkit-animation-name: splash-fade;
	-webkit-animation-fill-mode: forwards;
	cursor: crosshair;
}

#game *, #splash-screen * {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#splash-screen {
	text-align: center;
	font-family: Raleway, sans-serif;
	background-color: hsl(200, 100%, 20%);
	color: hsl(200, 100%, 80%);
}

#splash-title {
	font-size: 5em;
	font-weight: bold;
	margin: 100px 0 20px 0;
}

#splash-desc {
	font-size: 2em;
}

#instructions {
	position: absolute;
	width: 100%;
	text-align: center;
	top: 700px;
	left: 0;
	right: 0;
	font-size: 1.3em;
}

@keyframes splash-fade {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
		display: none;
	}
}
@-webkit-keyframes splash-fade {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
		display: none;
	}
}