/*  # for id and . for class - I don't know why I can't remember 
	id should be for one occurence on a page 						*/

/* DOM */

body {
	width		: auto;
	background	: #FFF;
	font-family	: Georgia, Verdana, Arial, Helvetica, sans-serif;
}
	a {
		text-decoration : none;
		color			: #900;
	}
	a:hover {
		text-decoration	: underline;
	}

/* Branding: brandXxx */
div#brand {
	padding			: 5px 0;
	background		: #900; 
	text-align		: center;
	border-bottom	: 2px solid #FC0;
}
	#brand h2 {
		color	: #FFF;
		margin-right: 86px;
	}
	#brand img {
		border	: none;
	}
	#brand a:hover {
		border-bottom : 1px solid #900;
	}

/* Content: contentXxx */
div.contentAnnounce {
	color			: #000;
	border-top		: 1px dashed #FC0;
	border-bottom	: 1px solid #FC0;
	text-align		: center;
	font-style		: italic;
}
.contentInstrument td{
	border-left : #333 1px groove;
	font-weight	: bold;
}
.contentBook {
}
div#contentMain {
	width			: 70%;
	margin-left		: 15%;
	color			: #000;
	text-align		: center;
	font-size		: large;
	padding			: 0;
	padding-top		: 5px;	
}
	#contentMain table {
		border		: 1px solid #FC0;
		text-align	: center;
	}
	#tableSiteMap {
		margin-top 		: 0.5em;
	}
		#tableSiteMap td {
			text-align	: left;
			line-height	: 1.5em;
		}
		#tableSiteMap .navInactive {
			color : #FC0;
		}
		#tableSiteMap a {
			text-decoration	: underline;
			font-weight		: lighter;
		}
		#tableSiteMap a:hover {
			color	: #FC0;
		}
		.tableHeader {
			color 			: #900;
			font-weight		: bold;
		}
	table#instrument {
		border	: none;
	}
	table#instrument td {
		border-bottom	: 1px dashed #fc3;
	}
	table#instrument th {
		border-top		: 8px solid white;
		border-left		: 15px solid #900;
		border-bottom	: 5px solid #900;
		background		: #fc3;
	}
	
div#contentScore {
	position	: fixed;
	bottom	 	: -10px;
	left		: -20px;
}
/* Forms */
div.row {
	padding-bottom	: 5px;
}
form label {
	display		: block;
	float		: left;
	margin-right: 1em;
	text-align	: right;
	width		: 10em;
}
	span.formFieldError {
		color	: Red;
	}
span.offsetField {
	margin-left	: 11em;
}
div.leftCol {
	display				: block;
	float					: left;
	margin-right	: 1em;
	text-align		: left;
	width					: 380px;
}
div.rightCol {
	margin-left	: 400px;
	text-align	: left;
}
/* Navigation: navXxx */
div#navMain { /* List of links at the bottom of the page */
	width				: 70%;
	margin-left			: 15%;
	margin-top			: 0.5em;
	text-align			: center;
	border-top			: 1px solid #FC0;
}
	#navMain a:link {
		text-decoration	: none;
	}
	#navMain a:hover {
		text-decoration	: underline;
	}

/* Multimedia */
div.photoFloatLeft {
	float		: left;
	padding		: 7px;
	text-align	: left;
}
div.photoFloatRight {
	float		: right;
	padding		: 7px;
	text-align	: left;
}
	.photoIDLeft {
	position	: relative;
	bottom		: 0;
	font-style	: italic;
	font-size	: x-small;
	text-align	: center;
}