/*=========================================
 Ann Darnton Web Design CSS stylesheet copyright 2009
 ==========================================
Color Swatches:
fdfbfa - pale gray (bkgr)
ece9d8- lt gray
a6a6a6 - med gray
6d6d6d - steel gray (headings)
888 - another dark gray
c81808 - reddish
ffd38c - canteloupe
f2eec1 - off-white (li hover)
=========================================*/

/*baseline styles--------------------------------------------*/
html, body, div, span, iframe, p,
blockquote, a, abbr, acronym, address, del, dfn, em, font, img, strong, sub, sup, 
b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td  {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
}

img, img a  {
	border:  none;
}

:focus {
	outline: 0;
}

body	{
	font-family:  Verdana, Helvetica, sans-serif;
	font-size:	62.5%;
	text-align:  center;
	background: #ece9d8 url(../images/gray_gradient.jpg) repeat-x top left;
}

/*universal styles------------------------------*/
h1, h2, h3 {
	margin: 0;
	padding: 0;
	font-weight: bold;
	color:  #6d6d6d;
}	

h1  {
	font-size: 1.7em;
	letter-spacing: 0.1em;
	padding-bottom: 0.3em;
	border-bottom: 2px dotted #c81808;
	margin-bottom: 1.3em;
}		
					
h2  {
	font-size: 1.2em;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 2em 0 1em 0;
}

h3 {
	margin-bottom: 0.2em;
}

ul, ol, li 	{ 
	list-style:  none;
}

li, dd, dt, p {
	font-size: 1.3em;
}

td  {
	font-size:  1.2em;
}
		
p  {
	margin-bottom:  1.3em;
	line-height:  1.4;
}

a:link, a:visited {
	text-decoration:  none;
	color:	#c81808;
}

a:hover, a:active {
	text-decoration:  underline;
	color:	#888;		
}

a:active { 
    border:none;
    outline:none;
}


em {
	font-style: italic;
}

strong {
	font-weight: bold;
}

/* main divs-----------------------------*/
#wrap  {
	width:  96em;
	min-width:  96em;
	max-width:  100%;
	margin:  0 auto 15px auto;
	text-align:  left;
	background-color:  #fff;
	-moz-box-shadow:2px 2px 5px #828177;
	-webkit-box-shadow:2px 2px 5px #828177;
	box-shadow:2px 2px 5px #828177;
}		
		
#branding  {
	width:  100%;
	position: relative;
	background:  #feefbb url(../images/oj_gradient0210.gif) repeat-x top left;
}	

#branding img {
	margin-left:  90px;
	display: block;
}

#locbox {
	position: absolute;
	top: 14px;
	right: 15px;
	width: auto;
	background-color: transparent;
	/*border: 1px solid #dad3cd;
	border-width: 1px 0;*/
}
	
#locbox p {
	position: relative;
	margin: 7.5px 0;
	font-size: 11px;
	color: #3e3e3e;
	text-align: right;
}

body#contact #locbox p {
	display: none;
}

/*everything except nav; leaves space for nav at left
=======================================*/
#content {
	float: right;
	width: 59em;
	margin-top: 5em;
	padding: 1em 8em 1px 7em;
	height: auto !important;
	height: 350px;
	min-height: 350px;
	border-left: 1px solid #dad3cd;
}	
/*===================================*/

/* navigation menu -------------------------*/
#nav  {
	width: 17em;
	padding-top: 11.5em;
}	
		
#nav li  {		
	width: 100%;	
	margin-bottom:  1px;
	height:  auto;
}

#nav li a:link, #nav li a:visited  {
	display:  block;
	padding:  5px 0 5px 2.5em;
	background-color:  #a6a6a6;
	color:  #fff;
	font-size:  85%;
	font-weight:  bold;
	letter-spacing: 0.25em;
	text-transform: capitalize;
}			

/*for php that shows what page viewer is on--------------*/									
#nav li a#this_page:link,
#nav li a#this_page:visited {			
	color:  #000;
	background-color:  #dad3cd;
}	
					
#nav li a:hover  {
	background-color: #c81808;
	color: #f2eec1;
}
			
/*end navigation-----------------------------------*/   
   				
/*footer styles------------------------------------*/			
#footer {
	clear:  both;
	width:  100%;
	padding: 2em 0 1em 0;
	text-align:  center;
}
		
#footer ul li {
	display:  inline;
	padding: 0 1em;
	border-right: 1px solid #777;
}	
		
#footer ul li:last-child {
	border: none;
}	
					
#footer ul a:link, #footer ul a:visited {
	color:  #777;
}	
								
#footer ul a:hover {
	color:  #3e3e3e;
}					
					
#footer p  {
	margin-top: 0.5em;
	color:  #888;
	font-size:  1em;
}						
/*end footer styles-----------------------------*/							
/*end main pg divs-----------------------------*/
                    
p.boldline:first-line {
	font-weight:  bold;
}	

/* styles for index page------------------------------------ */
body#index #nav { 
	margin: 0;
	padding: 5px 0 0 0; 
	float:left;
	width:100%;
	/*background:#000;*/
	overflow:hidden;
	position:relative;
	bottom:  0;
	left:  0;     
	 /*padding:   10px 0 10px 0;
	 font-size:  90%;
	 color:	 #6d6d6d;
	*/
}                   
  
body#index #nav ul, body#index #nav li {
	width: auto;
}
    
body#index #nav ul {
   clear:left;
   float:left;
   position:relative;
   left:50%;
   text-align:center;
}

body#index #nav ul li {
   display:block;
   float:left;
   position:relative;
   right:50%;
   margin: 0;
}

body#index #nav ul li:first-child {
	display: none;
}

body#index #nav ul li a {
   display: block;
   margin: 0;
   padding: 3px 16px;
   background: transparent;
   color: #3e3e3e;
   text-decoration: none;
   line-height: 1.3em;
   letter-spacing: 0.25em;
   border-bottom: 4px solid #fff;
}
  
body#index #nav ul li a:hover {
   color: #a6a6a6;
   border-bottom: 4px solid #c81808;
}  	

body#index #content {
	width: 100%;
	padding: 0 0 30px 0;
	margin: 10px 0 0 0;
	text-align: center;
	border: 0;
}		 
/*end index page*/			

/* for ensemble page--------------------------------------- */		
/* box hovers on faces */	
#hotpic {
	position:  relative;
	width:  580px;
	height:  287px;
}

#hotpic img {
	float: left;
}
		
#hotpic	a .hotspot {
	width:  60px;
	height:  75px;
	position:  absolute;
}	

#hotpic	.rwaters a .hotspot {
	top:  30px;
	left:  20px;
}

#hotpic	.shersh a .hotspot {
	top:  40px;
	left:  100px;
}
		
#hotpic	.jhersh a .hotspot {
	top:  28px;
	left:  170px;
}
		
#hotpic	.rchase a .hotspot {
	top:  15px;
	left:  260px;
}	
		
#hotpic	a:hover .hotspot {
	border:  1px solid #eeedeb;
}		
		
#hotpic	a:hover {
	border:  none;
}			
       							
#ensemble #content ul	{
	float: left;
	margin: 30px 0 0 20px;
	line-height: 1.7; 
}	

#ensemble #content li a:link, #ensemble #content li a:visited {					
	color: #6d6d6d; 
	font-weight: bold;
	text-decoration: underline;
}

#ensemble #content li a:hover {
	color: #000;
	text-decoration: none;
}
		
/*images------------------------------------------------------*/
/*mission*/
.right {
	float: right;
	margin: 0 -25px 0 0;
}

/*ensemble and bio*/
.left {
	float: left;
}
					
img#biopics {
	float: right;
	margin: 4px 0 0 0;
}

body#concerts_current dd img {
	float: right;
	padding: 4px;
	margin: 0 0 10px 10px;
	border: 1px solid #dad3cd;
}

img.rt {
	float: right;
	padding: 4px;
	margin: 0 0 10px 10px;
	border: 1px solid #dad3cd;
}
	
/* end image styles ----------------------------------------------*/	

/* concerts pages ----------------------------------------------*/	
body#concerts_current dl {
	margin-bottom:  3em;
}

body#concerts_current dt {
	font-weight:  bold;
	border-bottom:	2px dotted #c81808;
	margin:  0.5em 0 0.5em 0;
	padding:  1.2em 0 0.35em 0;
}	
			
body#concerts_current dl dd.special  {
	margin-top:  8px;
}

dd.toggle_conc p {
	margin-top: 1em;
	font-size: 1em;
}

body#concerts_current dl dd.guest  {
	margin-top:  8px;
}

/*show hide concert details*/
a.toggleLink, a.toggleMore, .toggle_conc a, .panes a {
	letter-spacing: normal;
	text-transform: none;
	font-weight: bold;
}	

body#concerts_current div.toggle {
	background-color: #ece9d8;
	padding: 1em 3em 0.5em 3em;
	border: 2px dotted #6d6d6d;
	border-width: 2px 0;
	margin-bottom: 2em;
}
/*reviews*/
.news_src {
	margin-top: -0.5em;
	font-size: 1em;
}

/*recordings*/
ul.cds {					
	position:  relative;
	width:  100%;
	margin-top:  20px;
}

ul.cds h2 {
	margin-bottom: 0;
}
		
/*ul.cds li {
	clear:  both;
}	*/
		
ul.cds li ul li {
	margin-top:  0;
}			
		
ul.cd_artists, ul.cd_pieces, ul.cds p {
	margin-top: 0.5em;
	margin-left:  220px;
}		
		
ul.cd_artists, ul.cd_pieces {				
	margin-top:  1.5em;
}		
		
ul.cd_artists {
	font-size:  75%;
}		
		
ul.cds li ul.cd_pieces {
	font-size:	65%;
}			

.cdtitle {
	font-size:  80%;
	font-weight:  bold;
	font-style:  italic;
	text-transform: none;
	color: #000;
	letter-spacing:  normal;
	margin-left: 15px;
}
		
body#recordings ul p {
	margin-bottom:  30px;
	font-size: 90%;
}	
				
/*recordings img-------*/
ul.cds h2 img {				
	float:  left;
	clear:  left;
	width:  200px;
	margin:  0 0 50px 0;
}

/*boxgrid for index page---------------------------*/
.boxgrid { 
	width: 530px; 
	height: 380px; 
	margin: 50px auto 20px auto;
	border: 8px solid #404143;
	background:#fff;
	overflow: hidden; 
	position: relative; 
}
.boxgrid img { 
	position: absolute; 
	top: 0; 
	left: 0; 
	border: 0; 
}

.boxcaption { 
	float: left; 
	position: absolute; 
	background: #000; 
	height: 110px; 
	width: 100%; 
	opacity: .65; 
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
}

.caption .boxcaption {
	top: 350px;
	left: 0;
}

.boxgrid h3{ 
	margin: 10px 0 4px 10px; 
	color:#f2eec1; 
	font-size: 17px;
	font-weight: normal; 
	text-transform: none;  
	text-align: left;
}

.boxgrid p { 
	padding: 0 10px 6px 10px; 
	color: #f2eec1; /*#afafaf; */
	font-size: 11px;
	font-weight:bold; 
	text-align: left;
}
				
.boxgrid p span {
	font-weight: normal;
}	

/*ajax on concert pg*/
.panes { 
	border: 1px dotted #a6a6a6;
	padding: 5px 15px 15px 15px; 
	margin: 0 0 10px 0; 
	background-color: #fff;
}		

/*ul.tabs {
	border-bottom: 2px solid #dad3cd;
}	*/
		
ul.tabs {
	display: inline;
	position: relative;
	top: -1px;
}

ul.tabs li {
	display: inline;
	margin-right: 1px;
}	

ul.tabs li a {
	padding: 3px 1.1em;
	font-size: 12px;
	font-weight: bold;
	color:  #fff;
	background-color:  #a6a6a6;
	border-top-left-radius: 4px;
	-webkit-border-top-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	border-top-right-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topright: 4px;
}

ul.tabs a:hover {
	background-color:#ffcc78;
	color:#777;
}
	
/* selected tab */
ul.tabs a.current {
	background-color:#dad3cd;	
	color:#666;	
	cursor:default;
}

li#notes { display: none; }