body {
	/* GAME-LIKE PIXEL FONT */
	font-family: Futura, Helvetica, Arial, sans-serif;
	color: whitesmoke;
	background: #74ebd5; /* fallback for old browsers */
	background: -webkit-linear-gradient(
		to right,
		#acb6e5,
		#74ebd5
	); /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(
		to right,
		#acb6e5,
		#74ebd5
	); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

h1 {
	font-size: 3rem;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 0.5rem;
}

#container {
	display: flex;
	align-items: center;
	flex-direction: column;
}

#board {
	border-collapse: collapse;
}

#board td {
	border: 1px solid white;
	width: 18px;
	height: 18px;
}

td.alive {
	background-color: floralwhite;
}

td:hover {
	background-color: rgba(256, 256, 256, 0.5);
}

#control_panel {
	margin: 30px 0 50px 0;
}

.button {
	padding: 0.85em;
	margin: 0.5em;
	border: 1px solid transparent;
	border-radius: 3px;
	font-size: 0.9em;
	text-align: center;
	text-transform: uppercase;
	background-color: whitesmoke;
	letter-spacing: 0.25rem;
	/* color: #fefefe; */
}

.button:hover,
.button:focus {
	background-color: rgba(256, 256, 256, 0.6);
}

.button:focus {
	outline: dashed 1px #lightgray;
}