/*
COLORS
================
GOLD: #C69C6D (i.e., nav links)
DARK GRAY-BROWN: #362F2D (i.e., main content h1)
DARK RED: #900019 (i.e., main content links)
LIGHT GRAY: #8C8A85 (i.e., footer)
LIGHT GRAY 2: #B8B5AF (i.e., footer top border)
*/

body {
	margin: 0 auto;
	padding: 0;
	width: 868px;
	background-color: #EBE8E0;
	font: 12px/1.6em normal Tahoma, Verdana, Arial, sans-serif;
	color: #362F2D;
	text-align: center;
}

div#site {
	text-align: left;
}
	
/****************************
FONT FAMILY DECLARATIONS
****************************/
div#main-content, div#nav, h1, footer, table {
	font-family: Georgia, Palatino, "Palatino Linotype", Bookman, "Bookman Old Style", Times, serif;
}
div#main-content div.info, div#main-content h2 {
	font-family: Tahoma, Verdana, Arial, sans-serif;
	font-weight: normal !important;
}
div#main-content {
	font-weight: normal;
}
div#main-content h1, div#main-content h2, div#main-content h3, div#main-content h4 {
	font-weight: bold;
}

/****************************
SHARED ELEMENTS
****************************/

h1, h2, h3, h4, h5 {
	margin: 0;
	padding: 0;
	color: #362F2D;
}

h1 {
	font-size: 21px;
}
h2 {
	font-size: 21px;
}
h3 {
	font-size: 12px;
}
h4 {
	font-size: 11px;
}

a { 
	color: #900019;
	text-decoration: none;
	outline: none;
}
a:focus {
	outline: none;
}
a:hover {
	color: #D63854;
}
a.pdf {
	background: transparent url("../images/icon-pdf.gif") no-repeat left center;
	padding-left: 12px;
}

p {
	margin: 0 0 1em;
	padding: 0;
}

img, a img {
	border: 0;
}

ul, ul li {
	list-style: outside none none;
	margin: 0;
	padding: 0;
}

blockquote {
	margin: 0 0 1.6em;
	font-size: 11px;
}

table, tr, td, th, thead, tbody {
	border-collapse: collapse;
	border-spacing: 0;
	border: 0;
	padding: 0;
	vertical-align: top;
}

.inner-content { /* Catch-all class for interior content to move it away from the sides of #site for alignment purposes*/
	padding-left: 4px;
	padding-right: 4px;
}

.hide-me {
	display: none !important;
	visibility: hidden !important;
}

.no-wrap {
	white-space: nowrap;
}

/****************************
CLEARFIX (for fixing float problems)
****************************/
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
.clearfix {
	display: inline-block;
}
html[xmlns] .clearfix {
	display: block;
}
* html .clearfix {
	height: 1%;
}

/****************************
MASTHEAD
****************************/
div#masthead {
	width: 868px;
	height: 96px;
	background: transparent url("../images/masthead.jpg") no-repeat left top;
}
div#masthead h1 a {
	display: block;
	overflow: hidden;
	height: 0 !important;
	padding: 60px 0 0; /* Typically whatever element gets this code has to set a padding-top to whatever the height of the background image is. */
	text-indent: -999em;
}

/****************************
NAVIGATION
http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support
****************************/
div#nav, div#nav ul, div#nav ul li {
	position:relative;
	float:left;
}
div#nav {
	width:100%;
	overflow:hidden;
	font: 12px normal Tahoma, Verdana, Arial, sans-serif;
	color: #FFF;
}
div#nav ul, div#nav ul li {
	list-style:none;
	padding:0;
}
div#nav ul {
	left:50%;
	clear:left;
	margin: 12px 0 0;
	text-align:center;
}
div#nav ul li {
	right:50%;
	display:block;
	margin:0 0 0 10px;
	padding: 0 0 0 14px;
	background: transparent url("../images/nav-bullet.gif") no-repeat left center;
}
div#nav ul li.first {
	margin-left: 0;
	padding-left: 0;
	background-image: none;
}
div#nav ul li.last {
}
div#nav ul li a {
	display: block;
	font-size: 11px;
	font-weight: bold;
	color: #C69C6D; 
	text-decoration: none;
}
div#nav ul li a:hover, div#nav ul li a.current-section { 
	color: #FFF; 
}

/****************************
MAIN CONTENT
****************************/
div#main-content {
	font-size: 12px;
	color: #362F2D;
	background: transparent url("../images/masthead-shadow.gif") no-repeat center top;
	padding: 20px 0 70px;
}

/*
#main-content .music h2 { /* i.e., "The “Masterpiece” compositions included..." * /
	font-size: 17px;
}
#main-content .music h3 { /* i.e., "St. Joseph, Husband of Mary, Roman Catholic Church" * /
	font-size: 18px;
}
#main-content .music p {
	font-size: 13px;
}
*/
div#main-content h2.section-title {
	margin: 0 0 20px;
	padding: 14px 0 0;
	height: 34px;
	background: transparent url("../images/section-title-bkgd.jpg") no-repeat center center;
	text-align: center;
}

/****************************
MUSIC SECTION CONTENT
****************************/

div.newSection-title {
	width: 868px;
	height: 48px;
	background: transparent url("../images/section-title-bkgd.jpg") no-repeat center center;
	margin-bottom: 20px;
	}
	
	div.newSection-title ul {
	width: 244px;
	height: 20px;
	margin: 0 auto;
	}
	
	div.newSection-title li 
	{
	float: left;
	width: 80px;
	border-right: 1px solid #C69C6D;
	margin-top: 14px; 
	}
	
	div.newSection-title #mMusic 
	{
	border: none;
	}
	
	div.newSection-title a
	{
	display: block;
	font: 16px/1.6em normal Tahoma, Verdana, Arial, sans-serif;
	line-height: 20px;
	color: #C69C6D;
	padding: 0;
	height: 20px;
	text-align: center;
	}
	
	div.newSection-title a:hover, body#cds div.newSection-title #mCds a,
	body#dvds div.newSection-title #mDvds a, body#music div.newSection-title #mMusic a 
	{
	color: #362F2D;
	}
	
/*  *** Music Sheets only  */

#main-content table 
{ 
margin: 0; padding: 0; 
} 
  
#mSheets .basic p
{
font: 12px/18px normal Tahoma, Verdana, Arial, sans-serif; 
text-align: left;
}

#mSheets .head
{
font: 18px/1.6em bold Tahoma, Verdana, Arial, sans-serif; 
text-align: left;
}

#mSheets .subhead
{
padding: 0 0 25px 0;
}

hr {position: relative; top: 0; margin: 0; padding: 0;}

#mSheets .subhead img
{
float:left;	
border: 1px solid #000;
}

#mSheets .subhead p
{
font: 15px/1em AGaramond,Georgia,Times New Roman,Times,serif; 
text-align: left;
font-weight: bold;
padding-top: 20px;
}
	
.description	
{
float:left;
}	
	
.description td	
{
font: 13px/1.6em normal AGaramond,Georgia,Times New Roman,Times,serif;
text-align: left;
}

/****************************
FOOTER
****************************/
#footer {
	margin: 0 0 2em;
	padding-top: 1em;
	font-size: 11px;
	line-height: 1em;
	color: #8C8A85;
	border-top: 4px solid #B8B5AF;
}
#footer ul, #footer ul li {
	list-style: outside none none;
	margin: 0;
	padding: 0;
}
#footer ul {
	text-align: center;
	margin-bottom: 1em;
}