/* CSS for New Media Project */

* {
  box-sizing: border-box;
}
body {
	background-color: #000000;
	color: #cccccc;
	font-size: 16px;
	font-family: Verdana, Helvetica, Garamond, Arial, sans-serif;
}
a {
	color: #ffffff;
}
a:hover, a:focus {
	color:#CC0000;
	text-decoration: underline;
}
h1 {
	font-weight: normal;
	font-size: 1.4em;
	border-bottom: 1px solid #666666;
}
h2 {
	font-weight: normal;
	font-size: 1.2em;
	border-bottom: 1px solid #333333;
}
ul.grid {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	text-align: center;
	margin: 0;
	padding: 0;
}
ul.grid li {
	list-style-type: none;
	flex: 1 0 45%;
	margin: 0;
	padding: 0;
}
ul.grid li a {
	display: block;
	padding: 1.5em 1em;
	border: 1px solid white;
	text-decoration: none;
}
ul.grid li a:hover, ul.grid li a:focus {
	border-color: #CC0000;
	text-decoration: none;
	background-color: #222;
}
@media (min-width: 710px) {
	ul.grid li {
		flex: 1 0 21%;
	}
}
.page-wrapper {
	max-width: 700px;
	margin: 0 auto;
}
.text-centered {
	text-align: center;
}
.view-link {
	font-size: 12pt;
	font-weight: bold;
	padding: 1.5em 1em;
	display: inline-block;
	border: 1px solid white;
	text-decoration: none;
}
.view-link:hover, .view-link:focus {
	border-color: #CC0000;
	text-decoration: none;
}
#copyright {
	margin: 2em 0;
	color: #aaa;
}