body {
	font-family: Arial, Helvetica, sans-serif;
	color: #f0f0f0;
	background-color: #202020;
	background-image: url("images/website_bg.png");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
a:link, a:visited {
	color: #d0a0f0;
	text-decoration: none;
	font-weight: bold;
}
a:hover, a:active {
	color: #b080d0;
}
.grid {
	display: grid;
	column-gap: 20px;
	row-gap: 20px;
	margin-top: 20px;
	margin-bottom: 30px;
	margin-right: 20%;
	margin-left: 20%;
}
.grid-nav {
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: auto auto auto auto;
	grid-template-areas:
		"tile-nav-1 tile-nav-2 tile-nav-3 tile-nav-4"
}
.tile {
	justify-self: stretch;
	padding: 10px;
	background-color: #303030;
}
.tile:link, .tile:visited {
	color: #f0f0f0;
	background-color: #303030;
	font-weight: normal;
}
.tile:hover, .tile:active {
	color: #f0f0f0;
	background-color: #343038;
}
.tile-nav-1 {
	grid-area: tile-nav-1;
}
.tile-nav-2 {
	grid-area: tile-nav-2;
}
.tile-nav-3 {
	grid-area: tile-nav-3;
}
.tile-nav-4 {
	grid-area: tile-nav-4;
}