/* CSS Document */

html {
	background-color: #eee;
}

.hidden {
	display: none;
	margin: 0;
	padding: 0;
}

.clearAll {
	clear: both;
}

#wrapper {
	width: 900px;
	margin: 0 auto;
	font-size: 13px;
	line-height: 1.5em;
}

#mainHeader {
	background: url('/images/header.png') no-repeat top center;
	height: 150px; /*height of image*/
	background-color: #666;
	margin: 0;
}

ul#mainNav {
	background: #ccc;
	height: 30px;
}

	ul#mainNav li {
		display: inline;
	}
	
		ul#mainNav li a {
			display: block;
			float: left;
			padding: 0 10px;
			color: #666;
			text-decoration: none;
			font-weight: bold;
			color: #fff;
			font-size: 15px;
			line-height: 2.0em;
		}
	
		ul#mainNav li a:hover {
			color: #fff;
			background: #666;
		}
		
		ul#mainNav li a#currentPage {
			background: #fff;
			color: #666;
		}

#folioHolder {
	clear:both;
	background: #fff url('images/2col.png') repeat-y top center; /*column image*/
}

#folioHolder, #folioRightCol {
	min-height: 400px;
}

#folioLeftCol {
	width: 390px;
	padding: 10px 0 10px 10px;
	float: left;
	line-height: 2.5em;
	background-color: #fff; /*needs to match #folioHolder bg image*/
}

	#folioLeftCol a {
		cursor: pointer;
		padding: 0 10px;
	}
	
	#folioLeftCol a#selectedItem {
		background-color: #ccc; /*matches #folioRightCol bg color */
		color: #fff;
		display:block;
	}

#folioRightCol {
	padding: 10px;
	width: 480px;
	float: left;
	background-color: #ccc; /*needs to match #folioHolder bg image*/
}

	#folioRightCol li {
		margin-bottom: 50px;
	}

	#folioRightCol img {
		display:block;
		margin: 10px auto;
		width: 300px;
		border: 2px solid #666;
	}

#footer {
	padding: 10px;
	height: 80px;
	background-color: #666;
	margin: 0;
	color: #fff;
}