/* CSS Document */
* {
	font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
}

body {
	background-color: #c7c7c7;
	display: grid;
	grid-template-columns: 10% 80% 10%;
	margin: 0px;
}

h1 {
	font-size: 72px;
	margin: 8px 0px;
}

#about {
	display: grid;
	grid-template-columns: 20% 60% 20%;
}

#about p, #about h2 {
	grid-column-start: 2;
}

#about h2 {
	font-size: 48px;
	margin-bottom: 0px;
}

#about p {
	font-size: 22px;
	padding: 0px 40px;
	text-indent: 2em;
}

#content {
	background-color: #949494;
	grid-column-start: 2;
	border: 8px solid black;
	border-top: 0px;
	border-bottom: 0px;
	padding: 0px 60px;
}

#nav {
	border-radius: 10%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr; 
}

#nav a {
	font-size: 36px;
	color: black;
	text-align: center;
	background-color: #c7c7c7;
	text-decoration: none;
	padding: 12px 0px;
	border: 4px solid black;
}

#nav a:hover {
	color: #c7c7c7;
	background-color: black;
}

#menu {
	display: grid;
	grid-template-columns: 5% 90% 5%;
}

.box {
	background-color: #c7c7c7;
	display: grid;
	grid-template: 10% 90% / 35% 65%;
	grid-column-start: 2;
	border: 4px solid black;
	padding: 24px;
	margin: 16px 0px;
}

.boximg {
	width: 90%;
	height: auto;
	margin: 16px;
	grid-row: 2;
}


.box h2 {
	margin: 0px 16px;
	font-size: 36px;
	grid-column-start: 1;
	grid-column-end: 3;
}

.pbox {
	grid-row-start: 2;
	height: 100%;
	display: grid;
	grid-template-columns: 35% 30% 35%;
}

.box p {
	margin: 16px;
	font-size: 18px;
	text-indent: 2em;
	grid-column: 1 / 4;
}

.box a {
	background-color: #949494;
	text-align: center;
	border: 2px solid black;
	font-size: 18px;
	text-decoration: none;
	color: black;
	padding: 6px;
	grid-column-start: 2;
	height: 30px;
	line-height: 30px;
	vertical-align: middle;
}

.box a:hover {
	background-color: black;
	color: #949494;
}

footer {
	border-top: 4px solid #c7c7c7;
	margin-top: 60px;
}

footer a {
	text-decoration: underline;
	color: #3D3D3D;
}

footer a:hover {
	color: black;
}