/* ----------------
main styles for website
   ----------------*/
body {
	font-family: Veranda, Arial, Helvatica, sans-serif;
	background-color: #222222;
}
/* styles for non-navigation bar links */
a, a:link {
	color: #041D44;
	text-decoration: underline;
}
a:hover, a:active {
	text-decoration: none;
}
/* styles for the header h- tags */
h1 {
	font-family: Veranda, Arial, Helvatica, sans-serif;
	font-weight: bold;
	font-size: 17px;
	margin: 0 10px 5px; 10px;
	color: #225577;
}
h2 {
	font-family: Veranda, Arial, Helvatica, sans-serif;
	font-weight: bold;
	font-size: 15px;
	margin: 0 10px 5px; 10px;
}
h3 {
	font-family: Veranda, Arial, Helvatica, sans-serif;
	font-weight: bold;
	font-size: 14px;
	margin: 0 10px 5px; 10px;
}
h4 {
	font-family: Veranda, Arial, Helvatica, sans-serif;
	font-weight: bold;
	font-size: 13px;
	margin: 0 10px 3px; 10px;
}
/* styles for content stored in <p> tags */
p {
	margin: 0 10px 0 10px;
	font-family: Veranda, Arial, Helvatica, sans-serif;
	font-size: 12px;
}
/* styles for <em> tags */
em {
	color: #CC3300;
	font-style: normal;
	font-weight: bold;
}
/* small text */
.small {
	margin: 0 10px 0 10px;
	font-family: Veranda, Arial, Helvatica, sans-serif;
	font-size: 11px;
	font-weight: normal;
}
/* centers elements. use this class instead of the <center> tag */
.center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
/* floating images to the left or right */
.fl {
	float: left;
	margin-right: 5px;
}
.fr {
	float: right;
	margin-left: 5px;
}
/* makes thumbnails (on home page) a fixed size */
img.thumb {
	width: 78px;
}


/* ----------------
header and image bar at the top of the site
   ----------------*/
div#header {
	background: url("images/header.png") no-repeat center top;
	width: 765px;
	height: 75px;
	margin: -8px auto 0px auto;
}
div#imgbar {
	background: url("images/imgbar.gif") no-repeat center top;
	width: 765px;
	height: 60px;
	margin: 0 auto 0 auto;
}


/* ----------------
navigation bar below the image bar
   ----------------*/
/*	THE FOLLOWING COMMENTED SECTION WAS FOR USE WITH THE NON-DROP-DOWN VERSION OF THE NAVBAR
div#navbar {
	background: url("images/navbar.png") no-repeat center top;
	width: 765px;
	height: 30px;
	margin: 0 auto 0 auto;
}
div#navbar ul {
	margin: 0px;
	padding: 0px;
	font-family: Geneva, Arial, Helvetica, Verdana, sans-serif;
	font-size: 12px;
	text-align: center;
	color: #FFFFFF;
	letter-spacing: 0px;
}
div#navbar li {
	list-style-type: none;
	display: inline;
	line-height: 26px;
}
div#navbar li a {
	text-decoration: none;
	color: #FFFFFF;
	padding: 5px;
}*/
div#navbar {
	background: url("images/navbar.png") no-repeat center top;
	width: 765px;
	height: 30px;
	margin: 0 auto 0 auto;
}
div#navbar ul {
	margin: 0px auto 0 auto;
	padding: 0px 0 0 68px;
	width: 628px;
	font-family: Geneva, Arial, Helvetica, Verdana, sans-serif;
	font-size: 12px;
	text-align: center;
	color: #FFFFFF;
	letter-spacing: 0px;
	list-style-type: none;
}
div#navbar ul li {
	position: relative;
	padding: 0 5px 0 5px;
	list-style-type: none;
/*	display: inline;*/
	float: left;
	line-height: 26px;
}
div#navbar li ul {
	display: none;
	position: absolute;
	left: 0px;
	top: 25px;
	background: #000000;
	padding: 0;
}
div#navbar li:hover ul, div#navbar li.sfh ul/*, li:over ul*/ {
	display: block;
}
div#navbar ul li a {
	display: block;
	text-decoration: none;
	color: #FFFFFF;
	padding: 0 10px 0 10px;
	margin: 0px;
}
#cti {
	width: 150px;
}
#perf {
	width: 115px;
}
#audio {
	width: 156px;
}
#exp {
	width: 90px;
}
#support {
	width: 80px;
}
#about {
	width: 151px;
}
/* link attributes in navigation bar */
div#navbar li a:link {
	color: #FFFFFF;
}
/* visited link attributes in navigation bar */
div#navbar li a:visited {
	color: #FFFFFF;
	text-decoration: none;
}
/* link attributes when cursor hovers over a link in navbar */
div#navbar li a:hover {
	text-decoration: none;
	color: #FF9D00;
}


/* ----------------
styles that relate to the content, or body section of the site
   ----------------*/
div#bhome {
	background: url("images/home.jpg") no-repeat left top;
	background-color: #000000;
	width: 765px;
	min-height: 524px;
	margin: -5px auto 0 auto;
}
div#bconcert {
	background: url("images/concert.jpg") no-repeat left top;
	background-color: #000000;
	width: 765px;
	min-height: 524px;
	margin: -5px auto 0 auto;
}
div#bperf {
	background: url("images/performers.jpg") no-repeat left top;
	background-color: #000000;
	width: 765px;
	min-height: 524px;
	margin: -5px auto 0 auto;
}
div#baudio {
	background: url("images/audio.jpg") no-repeat left top;
	background-color: #000000;
	width: 765px;
	min-height: 524px;
	margin: -5px auto 0 auto;
}
div#bexpl {
	background: url("images/exploration.jpg") no-repeat left top;
	background-color: #000000;
	width: 765px;
	min-height: 524px;
	margin: -5px auto 0 auto;
}
div#bsupport {
	background: url("images/support.jpg") no-repeat left top;
	background-color: #000000;
	width: 765px;
	min-height: 524px;
	margin: -5px auto 0 auto;
}
div#babout {
	background: url("images/about.jpg") no-repeat left top;
	background-color: #000000;
	width: 765px;
	min-height: 524px;
	margin: -5px auto 0 auto;
}
/* yellow bars across the sides of the site */
div#yb {
	border-left: 4px solid #EFAD00;
	border-right: 4px solid #EFAD00;
	padding: 17px 0px 17px 0px;
	min-height: 524px;
}
/* philharmonia vertical text on right side */
div#side {
	background: url("images/sidetext.png") no-repeat right top;
	width: 755px;
	min-height: 572px;
}
/* top rounded corner section for content box */
div.topbar {
	background: url("images/topbar.png") no-repeat center;
	width: 570px;
	height: 18px;
	margin: 0 auto 0 auto;
}
/* bottom rounded corner section for content box */
div.bottombar {
	background: url("images/bottombar.png") no-repeat center;
	width: 570px;
	height: 18px;
	margin: 0 auto 0 auto;
	padding-left: 10px;
	padding-right: 10px;
}
/* middle section for content box */
div.content {
	background: url("images/content.png") repeat-y center;
	width: 570px;
	min-height: 78px;
	margin: 0 auto 0 auto;
	padding: 0 10px 0 10px;
}
/* box enclosing square news boxes *//*
div#sqbox1 {
	height: 136px;
	width: 570px;
	margin: 0 auto 0 auto;
	padding: 0 auto 0 auto;
	position: relative;
	left: 214px;
}
div#sqbox2 {
	height: 136px;
	width: 570px;
	margin: 0 auto 0 auto;
	padding: 0 auto 0 auto;
	position: relative;
	left: 130px;
}
div#sqbox3 {
	height: 136px;
	width: 570px;
	margin: 0 auto 0 auto;
	padding: 0 auto 0 auto;
	position: relative;
	left: 130px;
}
div#sqbox4 {
	height: 136px;
	width: 570px;
	margin: 0 auto 0 auto;
	padding: 0 auto 0 auto;
	position: relative;
	left: 130px;
}
/* top rounded corner section of square news box 
.sqtop {
	background: url("images/sq_top.png") no-repeat center;
	width: 142px;
	height: 18px;
	margin: 0 10px 0 auto;
}
/* bottom rounded corner section of square news box 
.sqbottom {
	background: url("images/sq_bottom.png") no-repeat center;
	width: 142px;
	height: 18px;
	margin: 0 10px 0 auto;
}
/* middle section of square news box 
.sqcontent {
	background: url("images/sq_content.png") repeat-y center;
	width: 142px;
	height: 100px;
	margin: 0 10px 0 auto;
}
.sqfloat {
	float: left;
}*/
/* THE FOLLOWING COMMENTED SECTION WAS TO IMPLEMENT AN 'OTHER NEWS' BOX WITH ITEMS ON THE LEFT AND RIGHT SIDES OF A SEPARATOR
/* separator line for other news 
div.separator {
	width: 570px;
	height: 100%;
	background: url("images/separator.jpg") repeat-y center;
}
/* left side of content box in other news with separator 
div.left {
	width: 284px;
	height: 100%;
	padding-right: 5px;
	float: left;
}
/* right side of content box in other news with separator 
div.right {
	width: 284px;
	height: 100%;
	padding-left: 5px;
	float: right;
}*/


/* ----------------
footer area of site
   ----------------*/
div#footer {
	background: url("images/footer.png") no-repeat center bottom;
	width: 765px;
	height: 87px;
	margin: 0 auto -8px auto;
}
.footext {
	font-family: Veranda, Arial, Helvatica, sans-serif;
	font-size: 11px;
	color: #8A8A8A;
	padding: 65px 0 0 0px;
}
.foolink a:link {
	color: #999999;
}