body { 
	background-color: #303030; 
	font-family: normal 100% Verdana, Arial, sans-serif; 
}

#container {
	margin: 15px auto;
	padding: 0 1em;
	max-width: 61.75em;		/* 988px / 16px = 61.75em */
}

#wrapper {
	width: 100%;
	padding-top: 3%;
}

#content {
	width: 100%;
}

a {
	text-decoration: none;
}

.red {
	border: 7px solid #CC0000;
}

.red h2 {
	color: #CC0000;
}

.red a {
	color: #CC0000;
}

.red a:hover {
	color: #FFFFFE;
	background-color: #CC0000;	
}

.orange {
	border: 7px solid #FF6600;
}

.orange h2 {
	color: #FF6600;
}

.orange a {
	color: #FF6600;
}

.orange a:hover {
	color: #FFFFFE;
	background-color: #FF6600;
}

.purple {
	border: 7px solid #660099;
}

.purple h2 {
	color: #660099;
}

.purple a {
	color: #660099;
}

.purple a:hover {
	color: #FFFFFE;
	background-color: #660099;
}

.box {
	float: left;
	width: 30.364%;	/* 300 / 988 = 0.3036437246963563 */
	margin: 5px;
	padding 5px;
	background-color: #FFFFFE;
	height: 380px;
}

h2 {
	margin: .5em 0 1.07em;
	text-align: center;
}

h3, h7 {
	color: #FFFFFE;
}

p {
	padding: 5px;
}

.list {
	margin-left: 20px;
}

#contact ul li img {
	margin: 5px;
	vertical-align: middle;
}