/* global states */
html
{
	background:#ffffff;
	font-family:"Georgia", serif;
	font-size:10pt;
	line-height:150%;
	word-spacing:1pt;
}

a
{
	color:#0000ff;
	text-decoration:underline;
}

a:visited
{
	color:#aa00aa;
	text-decoration:underline;
}

@media print
{
	form, object
	{
		display:none;
	}
}


/* fixed-width body, centered */
body 
{
	width:737px;
	margin:0 auto;
	padding:0;
	text-align:center;
	border:none;
}


/* common parameters for each section */
#header, #menu, #footer, #content, #sub-section
{
	overflow:hidden;
	text-align:left;
	margin:0;
}

#header, #menu, #footer
{
	width:100%; /* safari and opera need this */
}


/* header: background image */
#header
{
	height:226px;
	width:737px;
	background:url(/style/smc.jpg) no-repeat center;
	border:none;
}

#header h1
{
	margin:0;
	display:none;
}

@media print
{
	#header
	{
		font-size:150%;
		line-height:140%;
		height:2em;
		width:100%;
		background:none;
	}

	#header h1
	{
		font-weight:normal;
		text-transform:uppercase;
		letter-spacing:3pt;
		text-align:left;
		display:block;
	}
}


/* menu, use unsigned list for items */
#menu
{
	width:737px;
	margin:0;
}

#menu ul
{
	list-style:none;
	padding:0;
	margin:0;
} 

#menu li
{
	display:inline;
}

#menu li a
{
	background:url(/style/button.png) #ffffff bottom left repeat-x;
	font-size:110%;
	font-weight:normal;
	font-variant:small-caps;
	letter-spacing:1pt;
	height:2em;
	line-height:2em;
	float:left;
	width:91px;
	display:block;
	border-top:1px solid #6080a0;
	border-bottom:1px solid #6080a0;
	border-right:1px solid #6080a0;
	color:#0d2474;
	text-decoration:none;
	text-align:center;
}

#menu li:first-child a
{
	border-left:1px solid #6080a0;
}

#menu li a:hover
{
	background:url(/style/buttonsel.png) #ffffff bottom left repeat-x;
} 

.home #menu li.home a,
.concerts #menu li.concerts a,
.music #menu li.music a,
.members #menu li.members a,
.about #menu li.about a,
.contact #menu li.contact a,
.friends #menu li.friends a,
.donate #menu li.donate a,
.news #menu li.news a,
.schedule #menu li.schedule a,
.practice #menu li.practice a,
.info #menu li.info a,
.memcontact #menu li.memcontact a,
.collection #menu li.collection a
{
	background:url(/style/buttonsel.png) #ffffff bottom left repeat-x;
	text-decoration:none;
}

.home #menu li.home a:hover,
.concerts #menu li.concerts a:hover,
.music #menu li.music a:hover,
.members #menu li.members a:hover,
.about #menu li.about a:hover,
.contact #menu li.contact a:hover,
.friends #menu li.friends a:hover,
.donate #menu li.donate a:hover,
.news #menu li.news a:hover,
.schedule #menu li.schedule a:hover,
.practice #menu li.practice a:hover,
.info #menu li.info a:hover,
.memcontact #menu li.memcontact a:hover,
.collection #menu li.collection a:hover
{
	background:url(/style/buttonsel.png) #ffffff bottom left repeat-x;
	text-decoration:none;
}

@media print
{
	#menu
	{
		display:none;
	}
}


/* content, 70% of the total width */
#content
{
	float:left;
	width:508px;
	background:#ffffff;
	color:#304050;
	padding-bottom:16pt;
	padding-right:8px;
}

#content.full
{
	width:720px;
	padding-right:0px;
}

#content h1
{
	margin-top:16pt;
	margin-bottom:12pt;
	text-align:left;
	font-size:180%;
	font-weight:normal;
	text-transform:uppercase;
	letter-spacing:1.75pt;
}

#content h2
{
	margin-top:12pt;
	margin-bottom:4pt;
	text-align:left;
	font-size:140%;
	font-weight:normal;
	font-variant:small-caps;
}

#content h3
{
	margin-top:8pt;
	margin-bottom:4pt;
	text-align:left;
	font-size:115%;
	font-weight:bold;
	font-variant:small-caps;
}

#content img
{
	margin:3px;
	border:1px solid #dcdce9;
}

#content a:hover img
{
	margin:2px;
	border:2px solid #0000ff;
}

#content blockquote
{
	padding-left:10%;
	padding-right:10%;
}

#content td.rep-left
{
	text-align:right;
	font-size:130%; 
	padding-right:4pt;
	vertical-align:baseline;
	width:50%;
}

#content td.rep-right
{
	text-align:left; 
	font-size:80%; 
	padding-left:4pt;
	vertical-align:baseline;
	width:50%;
}

#content td.calendar
{
	text-align:center; 
	vertical-align:top; 
	border:#4f7692 1px solid; 
	padding:10px 5px;
}

#content table.withborder
{
	border:#a0b0c0 1px solid;
    border-collapse: collapse; 
}

#content table.withborder tr,#content table.withborder th,#content table.withborder td 
{
	border:#a0b0c0 1px solid;
	padding:4px;
}

#content p.sample
{
	margin-top:16pt;
	margin-left:15%;
	margin-right:15%;
	margin-bottom:16pt;
	border:#a0b0c0 1px solid;
	background:#eeeeff;
	padding-top:12pt; 
	padding-bottom:12pt; 
	text-align:center;
}

#content p.caption
{
	margin-top:0pt;
	padding-top:0pt;
	padding-bottom:10pt; 
	text-align:center;
}

@media print
{
	#content
	{
		float:none !important;
		overflow:visible !important;
		width:auto;
		color:#000000;
	}
}


/* sub-section, 35% of the total width */
#sub-section 
{
	background:url(/style/sidebar.png) #eeeeff bottom left;
	float:left;
	width:210px;
	padding-left:10px;
	padding-bottom:16pt;
	color:#304050;
	font-size:90%;
	line-height:140%;
}

#sub-section h1
{
	margin-top:16pt;
	margin-bottom:12pt;
	text-align:left;
	text-decoration:none;
	font-size:175%;
	font-weight:normal;
	font-variant:small-caps;
}

#sub-section h2
{
	margin-top:12pt;
	margin-bottom:1pt;
	text-align:left;
	text-decoration:none;
	font-size:120%;
	font-weight:bold;
	font-variant:small-caps;
}

#sub-section p
{
	margin-top:0;
	margin-bottom:20pt;
}

#sub-section img
{
	margin:2px;
	border:1px solid #dcdce9;
}

#sub-section a:hover img
{
	margin:1px;
	border:2px solid #0000ff;
}

@media print
{
	#sub-section
	{
		float:none !important;
		overflow:visible !important;
		width:auto;
		color:#000000;
		border:1pt dotted #000000;
		page-break-inside:avoid;
	}
}


/* footer */
#footer
{
	text-align:center;
	color:#7090a0;
	font-size:75%;
	width:100%; /* safari and opera need this */
	clear:left;
	border-top:1px dotted #6080a0;
}

@media print
{
	#footer
	{
		border-top:none;
	}
}
