/* New Navigation Styles */


li {margin-bottom:10px}











/* PRINT SETTING */

#print_header{display:none;}

/* Rotator Controls*/

a:hover.rotatorccontrols {
	color: #FFFFFF; 
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif; 
	text-decoration:none; 
	background-color:#939598; 
	text-transform:uppercase;
	}
	
a.rotatorccontrols {
	color: #939598; 
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif; 
	text-decoration:none; 
	text-transform:uppercase;  
	}
	
.rotatorccontrols {
	color: #939598; 
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif; 
	text-decoration:none; 
	text-transform:uppercase; 
	padding:2px 10px 0px 5px;  
	border-left:1px #939598 solid;  }






/* new stuff GLOBALLY APPLIED */

 html, body {
   height: 100%;
 }
 

/* wrapper forces footer to bottom of page */
#wrapper {
     min-height: 100%;
	 height: auto !important;
     height: 100%;
     margin: 0 auto -20px;
	 clear:both;
	
 }
 


.top{font-size: 12px; font-family: arial, helvetcia, sans-serif}


#content{float:left; width:640px; padding:10px;}


#exhibition_content{
	float:left; width:640px; padding:10px;
}

.thumb{ 
	float:left;
	margin-top: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	margin-right: 7px;
	}
	
.exhibition{
	width:640px; 
	float:left; 
	border-bottom: #CCC 1px solid; 
	padding-bottom:5px; 
	margin-bottom:10px; }

.exhibition_description{
	float: left; 
	width:400px; 
	padding-top:0px;
	padding-left:10px;
	padding-bottom:10px;
	padding-right:10px;
	vertical-align:top;
	}
	
.exhibition_images{ float: left; width:210px;}

#exhibition_navigation{ float:left; width:139px; margin-left:10px;}

.exhibition_creditline { color: #666; font-size: 12px; font-family: arial, helvetcia, sans-serif }

/* LEFT HAND NAVIGATION */



#navigation{ float:left; width:139px; margin-left:10px;}

.navigation_dates{
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif;
	display: block;
	margin-left:20px;}

.navigation_subcategory_dates{
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif;
	display: block;
	margin-left:10px;}

.navigation_category { 
	font-size: 12px; 
	font-family: arial, helvetcia, sans-serif;
	font-weight:bold;
	/*border-bottom:1px solid;*/
	display: block;
	margin-left:10px;
	margin-bottom:-1em;
	border-bottom:dotted 1px;
	text-decoration:none;
	}
	
a:hover.navigation_category { 
	color: #000000; 
	font-size: 12px; 
	font-family: arial, helvetcia, sans-serif;
}

.navigation_subcategory { 
	color: #669966; 
	font-size: 12px; 
	font-family: arial, helvetcia, sans-serif;
	text-decoration:none;
	display: block;
	font-weight:bold;
	margin-left:10px;}
	
a:hover.navigation_subcategory { color: #000000;}

.navigation_item{ 
	font-size: 12px; 
	font-family: arial, helvetcia, sans-serif;
	font-weight:normal;
	text-decoration:none;
	display: block;
	padding-left:20px;
	}

	
	
	
.navigation_item_noparent{ 
	font-size: 12px; 
	font-family: arial, helvetcia, sans-serif;
	font-weight:normal;
	text-decoration:none;
	display: block;
	padding-left:10px;
	}
.navigation_item_noparent_dates{
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif;
	display: block;
	margin-left:10px;}
	
	
	
a:hover.navigation_subcategory { color: #000000;}

.navigation_page{
	
	font-size: 12px; 
	font-family: arial, helvetcia, sans-serif;
	font-weight:bold;
	text-decoration:none;
	display: block;}



H1{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	font-weight:bold;
	font-size: 20px; 
	font-family: arial, helvetcia, sans-serif; }
	
H2{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	font-weight:bold;
	font-size: 16px; 
	font-family: arial, helvetcia, sans-serif; }
	
	
H3{
	margin-top:1em;
	margin-bottom:0px;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	font-weight:bold;
	font-size: 14px; 
	font-family: arial, helvetcia, sans-serif; }
	
	
H5{
	margin: 0;
	padding: 0;
	outline: 0;
	font-size:12px;
	vertical-align: baseline;
	background: transparent;

	font-weight: normal;
	font-family: arial, helvetcia, sans-serif;
	}
	
H6 {margin-top:1em;
	margin-bottom:0px;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	font-weight:bold;
	font-size: 12px; 
	font-family: arial, helvetcia, sans-serif;}
	
	


/* ########################################### */





.arial 
{  
font-family: "Arial", Helvetica, sans-serif; 
font-size: 12px; 
font-weight: bold; 
color: #000000; 
text-decoration: none
}

.arial_nar
{  
font-family: "Arial", Helvetica, sans-serif; 
font-size: 12px; 
font-weight: bold; 
color: #000000; 
letter-spacing: 1pt;
text-decoration: none
}

.arial_spacing
{  
font-family: "Arial", Helvetica, sans-serif; 
font-size: 10px; 
font-weight: normal; 
color: #000000; 
letter-spacing: 1pt;
text-decoration: none
}

.arial_spacing_bold
{  
font-family: "Arial", Helvetica, sans-serif; 
font-size: 11px; 
font-weight: bold; 
color: #000000; 
letter-spacing: 1pt;
text-decoration: none
}

.events
{  
font-family: "Arial", Helvetica, sans-serif; 
font-size: 10px; 
font-weight: normal; 
color: #000000; 
text-decoration: none
}




/* Navigation ---------------------------------------------------------------*/

/*PREVIOUS*/
/* 

a:hover.exhheader { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.exhheader { color: #CC9900; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.infoheader { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.infoheader { color: #CC6600; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.collectionsheader { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.collectionsheader { color: #999900; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.programsheader { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.programsheader { color: #669966; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.joinusheader { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.joinusheader { color: #666699; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

*/

/*REDESIGNED*/


#quicklinks{	
	position:absolute; 
	top:10px; 
	left:400px;
}

a:hover.quicklinks { 
	color: #999999; 
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight: normal; 
	text-decoration: none;
	}
	
.quicklinks { 
	color: #FFFFFF; 
	font-size: 9px; 
	font-family: arial, helvetcia, sans-serif; 
	
	font-weight: normal; 
	text-decoration: none;
}


a:hover.exhheader { 
	color: #000000; 
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight: normal; 
	text-decoration: none;
	}
	
.exhheader { 
	color: #CC9900; 
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight: normal; 
	text-decoration: none}

.infoheader { 
	color: #CC6600; 
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight:normal; 
	text-decoration: none}

a:hover.infoheader { 
	color: #000000!important;
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight:normal;
	text-decoration: none;
	}
	
a:hover.joinusheader { 
	color: #000000; 
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight: normal; 
	text-decoration: none
	}
.joinusheader { 
	color: #666699; 
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight: normal; 
	text-decoration: none
	}


a:hover.collectionsheader { 
	color: #000000; 
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight: normal; 
	text-decoration: none
	}

.collectionsheader { 
	color: #999900; 
	font-size: 11px; 
	font-family: arial, helvetcia, sans-serif; 
	font-weight: normal; 
	text-decoration: none}

a:hover.programsheader { color: #000000; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none}
.programsheader { color: #669966; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none}



/* This is used for all text links on the site on pages with gray backgrounds  */
.whitelinks { color: #ffffff; font-size: 13px; font-family: arial, helvetcia, sans-serif }

a:hover.rootlinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.rootlinks { color: #757575; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.rootheader { color: #757575; font-size: 17px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.exhlinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.exhlinks { color: #CC9900; font-size: 12px; font-family: arial, helvetcia, sans-serif }

a:hover.exhsectheader { color: #000000; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.exhsectheader { color: #CC9900; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
a:hover.exhsmall { color: #000000; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.exhsmall { color: #CC9900; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
a:hover.exhsmaller { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none}
.exhsmaller { color: #CC9900; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none}

a:hover.infolinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.infolinks { color: #CC6600; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.infobold { color: #CC6600; font-size: 12px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none }

a:hover.infosectheader { color: #000000; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.infosectheader { color: #CC6600; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
a:hover.infosmall { color: #000000; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.infosmall { color: #CC6600; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.collectionslinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.collectionslinks { color: #999900; font-size: 12px; font-family: arial, helvetcia, sans-serif }

a:hover.collectionssectheader { color: #000000; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.collectionssectheader { color: #999900; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.programslinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.programslinks { color: #669966; font-size: 12px; font-family: arial, helvetcia, sans-serif }


a:hover.progsmall { color: #000000; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.progsmall { color: #669966; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}


a:hover.programssectheader { color: #000000; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.programssectheader { color: #669966; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

a:hover.programssmaller { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none}
.programssmaller { color: #669966; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none}

a:hover.joinuslinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.joinuslinks { color: #666699; font-size: 12px; font-family: arial, helvetcia, sans-serif }

.joinussectheader { color: #666699; font-size: 15px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}

/*/////////////////Holiday links////////////*/
a:hover.holidaylinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.holidaylinks { color: #E92C2C; font-size: 12px; font-family: arial, helvetcia, sans-serif }
a:hover.holidayheader { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.holidayheader { color: #E92C2C; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none}
.smallholiday { color: #E92C2C; font-size: 9px; font-family: arial, helvetcia, sans-serif }
.holiday_header_red { color: #E92C2C; font-size: 15px; font-family: arial, helvetcia, sans-serif }
.holiday_body_red { color: #E92C2C; font-size: 12px; font-family: arial, helvetcia, sans-serif }
/*//////////////////////////////////////////*/

.body { color: black; font-size: 12px; font-family: arial, helvetcia, sans-serif }

.bodysmall { color: black; font-size: 10px; font-family: arial, helvetcia, sans-serif }

/* default settings to clean-up the pages' architecture and expediate updates*/
/*h1 {font-size: 15px; font-family: arial, helvetcia, sans-serif;}
h2 {font-size: 12px; font-family: arial, helvetcia, sans-serif; font-weight:bold;}
h3 {font-size: 12px; font-family: arial, helvetcia, sans-serif;}
h4 { font-size:9px; font-family: arial, helvetcia, sans-serif;}
a:hover {color: #000000;}*/



/* This is used in the /art/ folder for the first letter on all of the pop-up pages. */
.biglett { color: black; font-size: 25px; font-family: arial, helvetcia, sans-serif }

/* This is used in the /art/ section for the smaller type encouraging the user to click on the image for larger view */
/* It is also used in the /programs/progstt/ section for smaller type and captions. */
.smalltype { color: #555555; font-size: 9px; font-family: arial, helvetcia, sans-serif }

/* This is used throughout mainly on the index.htm page to make <br> tags take up less whitespace.  */
.smallblack { color: #000000; font-size: 9px; font-family: arial, helvetcia, sans-serif }

/* These classes are only used on one page in the site -- Programs for Children. These fonts are primary colors and 
only work on this page */
.bodyredkids { color: #cc3333; font-size: 13px; font-family: arial, helvetcia, sans-serif }
.bodybluekids { color: #0000cc; font-size: 13px; font-family: arial, helvetcia, sans-serif }

/* This is used throughout the site for larger, white-colored headers */
.bodyheaderwhite { color: white; font-weight: bold; font-size: 17px; font-family: arial, helvetcia, sans-serif }

/* This is used throughout the site for larger, black-colored headers */
.bodyheader { color: black; font-size: 16px; font-family: arial, helvetcia, sans-serif }

/* Style choices for the /root/ section */    
.root_header_black { color: #000000; font-weight: bold; font-size: 15px; font-family: arial, helvetcia, sans-serif }
.root_body_black { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }

/* Style choices for the /exhibit/ section */    
.exh_header_gold { color: #CC9900; font-weight: bold; font-size: 15px; font-family: arial, helvetcia, sans-serif }
.exh_body_gold_bold { color: #CC9900; font-weight: bold; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.exh_body_gold { color: #CC9900; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.smallgold { color: #CC9900; font-size: 9px; font-family: arial, helvetcia, sans-serif }


/* These styles represent the three sizes of type to be used in the programs section */
.prog_header_green { color: #669966; font-size: 15px; font-family: arial, helvetcia, sans-serif }
.prog_body_green { color: #669966; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.smallgreen { color: #669966; font-size: 9px; font-family: arial, helvetcia, sans-serif }
.prog_list {list-style:square; color: #669966;}


/* These are used in the /Visiting/ section */
.body2headergreen { color: #006666; font-size: 15px; font-family: arial, helvetcia, sans-serif }
.body2green { color: #006666; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.smallbody2green { color: #006666; font-size: 9px; font-family: arial, helvetcia, sans-serif }


/* This is used exclusively on the program/progstt/events.htm page for the orange text and headers. */
.orangebody { color: #ff8c00; font-size: 12px; font-family: arial, helvetcia, sans-serif }
.orangeheader { color: #ff8c00; font-size: 15px; font-family: arial, helvetcia, sans-serif }

/* This was used on the specially designed pages for the "Light" exhibition. */
.lightred { color: #bf2b25; font-size: 13px; font-family: arial, helvetcia, sans-serif }

/* This is used exclusively on the html/programs/progstt/artists.htm page for the yellow type  */
.arialyellow { color: #cc9900; font-size: 13px; font-family: arial, helvetcia, sans-serif }

/* This is throughout the site whenever a larger font-size white text is required. Specific examples include
the titles in white at top of the press releases and the headers in the maroon boxes on the left side of the Exhibitions
section.*/
.largewhite { color: #ffffff; font-size: 16px; font-family: arial, helvetcia, sans-serif }

/* This is used primarily in the Exhibitions and Programs sections and usually applies the style to the dates
of the program or exhibition under the larger font link to the event or program on the page */
.smallwhite { color: #ffffff; font-size: 9px; font-family: arial, helvetcia, sans-serif }

/* This is used exclusively on the home page for the teenie section link*/
.red_teenie { color: #663333; font-size: 9px; font-family: arial, helvetcia, sans-serif }
a:hover.red_teenie { color: #000000; font-size: 9px; font-family: arial, helvetcia, sans-serif }
.smallred_teenie { color: #663333; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none }
a:hover.smallred_teenie { color: #000000; font-size: 11px; font-family: arial, helvetcia, sans-serif; font-weight: bold; text-decoration: none }

.medred_teenie { color: #663333; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none }
a:hover.medred_teenie { color: #000000; font-size: 10px; font-family: arial, helvetcia, sans-serif; font-weight: normal; text-decoration: none }

.teenielinks { color: #663333; font-size: 12px; font-family: arial, helvetcia, sans-serif }
a:hover.teenielinks { color: #000000; font-size: 12px; font-family: arial, helvetcia, sans-serif }

/*this is for the "see more" rollover*/
.ajaxtooltip{
	position: absolute; /*leave this alone*/
	display: none; /*leave this alone*/
	/*width: 300px;*/
	left: 0; /*leave this alone*/
	top: 0; /*leave this alone*/
	background: #FFFFFF;
	border: solid 1PX #000000;
	padding: 10px;
	}



/* font for the pop-up previews that appear on the exhibitions pages*/
.exhibitionpreview { color: #000000; font-size: 9px; font-family: arial, helvetcia, sans-serif; padding-bottom:10px; }

/* this is for the art and nature announcement in the schools & teachers section */
a.artandnature{ color:#fe7d1a; font-size: 12px; font-family: arial, helvetcia, sans-serif}
.artandnature{ color:#fe7d1a; font-size: 12px; font-family: arial, helvetcia, sans-serif}