/* CSS Document */

body {
	background: #6d5f4f; 
	font: 12px/1.2 Arial, Helvetica, sans-serif;
	color: #333; 
	}

.testBorder {
	border: 1px dashed #900;
	}
	
/* BASE RULES */



a:link {
	color: #900; 
	text-decoration: none;
	}

a:visited {
	color: #900; 
	text-decoration: none;
	}

a:hover	{
	color: #900; 
	text-decoration: underline;  
	}

div, h1, h2, h3, h4, h5, h6, ul, li, dl, dt, dd, p, form, img, body, label, fieldset, table, tr, td {
	margin: 0; 
	padding: 0; 
	border: 0; 
	text-decoration: none;
	} 

img {
	display: block;
	}

.morespace10 {
	margin-top: 10px;
	}
	
.morespace5 {
	margin-top: 5px;
	}

	

/* CONTENT OVERIDES */


.white {
	color:#fff;
	}

.black {
	color:#333;
	}

.red {
	color:#900;
	}

.i {
	font-style:italic;
	}

.b {
	font-weight:bold;
	}

.ni {
	font-style:normal;
	}

.lc {
	text-transform:lowercase;
	}

.uc {
	text-transform:uppercase;
	}
	
.u {
	text-decoration: underline;
	}
	
.overflow {
	overflow:hidden
	}

/* DIV & BODY ELEMENTS */

#wrapper {
	width: 770px; 
	margin:auto;
	background-color: #d0c9c3;
	}
  
#header {
	width: 770px; 
	height: 75px;
	background-color: #8b7961;
	margin: auto;
	}	

#navigationNoSub {
	width: 770px;
	height: 20px;
	background-color: #d0c9c3;
	margin: auto;
	padding-bottom: 15px;
	}

#navigation {
	width: 770px;
	height: 20px;
	background-color: #d0c9c3;
	margin: auto;
	padding-bottom: 8px;
	}


#secondaryNav {
	width: 755px;
	height: 16px;
	background-color: #fff;
	margin: auto;
	margin-bottom: 8px;
	padding-top: 4px;
	padding-left: 15px;
	border-bottom: 1px solid #bbb; 
	border-top: 1px solid #bbb;
	}
	
#secondaryNav a {
	padding-right: 15px;
	color:#333;
	text-decoration:none;
	font-weight:bold;
	text-transform:uppercase;
	}
	
#secondaryNav a:link, #secondaryNav a:active, #secondaryNav a:visited {
	color:#333;
	}

#secondaryNav a:hover {
	color:#990000;
	}
	
#sn-tab03 {
	width: 500px;
	margin-left: 29px;
	}
	
#content {
	width: 770px; 
	height: 685px; /* <-- Change this for height of Main Conent Div !!IMPORTANT - Should be 15px taller than Columns 01, 02, 03!! */
	background-color: #d0c9c3;
	margin: auto;
	}

#address {
	width: 770px; 
	height: 20px;
	background-color: #fff;
	margin: auto;
	font-size: 11px;
	line-height: 20px;
	clear:both;
	}

#footer {
	width: 770px; 
	background-color: #d0c9c3;
	margin: auto;
	clear:both;
	}
	
#column01 {
	width: 275px;
	margin-left: 15px;
	background-color: #DE6344;
	}
	
#column02 {
	width: 220px;
	margin-left: 12px;
	background-color: #c3e892;
	}
		
#column03 {
	width: 220px;
	margin-left: 12px;
	background-color: #b7e2ff;
	}
	
#column01, #column02, #column03 {
	height: 670px; /* <-- Change this for height of Columns 01, 02, 03 !!IMPORTANT - Should be 15px shorter than Content Div!! */
	}
	
.columnHeader {
	height: 14px;
	margin: 0;
	padding: 0;
	}

.columnBody {
	padding: 0 10px 0 10px;
	}
	
.contentContainer01 {
	border: 1px dashed #fff;
	margin: 8px 0 15px 0;
	width: 100%;
	height: 400px; /* <-- Change this for height of TOP section of Columns 01, 02, 03 !!IMPORTANT - If you change height add/remove corresponding height to #column01, #column02, #column03 and #content height attributes!! */
	overflow: hidden;
	}

.contentContainer01b {  /* this is for a full-height container */
	border: 1px dashed #fff;
	margin: 8px 0 15px 0;
	width: 100%;
	height: 100%; /* <-- Change this for height of TOP section of Columns 01, 02, 03 !!IMPORTANT - If you change height add/remove corresponding height to #column01, #column02, #column03 and #content height attributes!! */
	overflow: hidden;
	}

.contentContainer02 {
	border: 1px dashed #fff;
	margin: 8px 0 15px 0;
	width: 100%;
	height: 175px; /* <-- Change this for height of BOTTOM section of Columns 02, 03 !!IMPORTANT - MUST Be 55px TALLER than .contentContainer03. If you change height add/remove corresponding height to #column01, #column02, #column03 and #content height attributes!! */
	overflow: hidden;
	}
	
.contentContainer03 {
	border: 1px dashed #fff;
	margin: 8px 0 15px 0;
	width: 100%;
	height: 120px; /* <-- Change this for height of BOTTOM section of Columns 01 !!IMPORTANT - MUST Be 55px SHORTER than .contentContainer02. If you change height add/remove corresponding height to #column01, #column02, #column03 and #content height attributes!! */
	overflow: hidden;
	}

.contentContainer04 {
	border: 1px dashed #fff;
	margin: 8px 0 15px 0;
	width: 100%;
	height: 40px; 
	overflow: hidden;
	}

.contentContainer01 img, .contentContainer01b img, .contentContainer02 img, .contentContainer04 img {
	margin: 4px auto 1px auto;
	border: 1px solid #fff;
	}
	
.contentContainer01 p, .contentContainer01b p, .contentContainer02 p, .contentContainer03 p, .contentContainer04 p {
	padding: 0 4px 5px 4px;
	}
.Pimg img {
border: 1px solid #fff
	}
.caption {
	font-size: .85em;
	}
	
.artists {
	font-weight:bold;
	}
	
.exhibitionTitle {
	font-weight:bold;
	font-style:italic;
	}
	
.upcoming {
	font-weight:bold;
	}
	
.contentHeader {
	font-weight: bold;
	text-transform:uppercase;
	}
	
/* SUB-PAGES */	

#subContent {
	width: 770px; /* 770 */
	height:auto;
	background-color: #d0c9c3;
	padding-bottom: 15px;
	float: left;
	}

#subColumn01-Orange {
	width: 370px;
	margin-left: 15px;
	padding-bottom: 10px;
	background-color: #DE6344;
	}
	
#subColumn01-Green {
	width: 370px;
	margin-left: 15px;
	padding-bottom: 10px;
	background-color: #C3E892;
	}
	
#subColumn01-Blue {
	width: 370px;
	margin-left: 15px;
	padding-bottom: 10px;
	background-color: #B7E2FF;
	}
	
#subColumn02 {
	width: 370px;
	margin-left: 12px;
	background-color: #d0c9c3;
	}
	
.subColumnBody {
	padding: 14px 15px 0 5px;
	}

.subColumnBody p {
	padding-top: 10px;
	}
	
.subColumnBody ul {
	padding-left: 30px;
	padding-top: 5px;
	}

.subContentContainer {
	border: 1px dashed #fff;
	margin: 8px 0 15px 0;
	width: 100%;
	padding: 0px 0px 3px 0px;
	}
	
.subContentContainer img {
	margin: 4px auto 1px auto;
	border: 1px solid #fff;
	}
	
.subContentContainer p {
	padding: 0 4px 5px 4px;
	}

/* ESSAY DIVS */

#subColumn01-Essay {
	width: 275px;
	margin-left: 15px;
	padding-bottom: 10px;
	background-color: #B7E2FF;
	}

#subColumn02-Essay {
	width: 450px;
	margin-left: 12px;
	background-color: #d0c9c3;
	}

/* NEEDS WORK! navList Code */


.navpadding {
	padding: 0px 7px 0px 7px;
	}

.navpaddingR {
	padding: 0px 11px 0px 11px;
	}

.navpaddingL {
	padding: 0px 11px 0px 11px;
	}

#navList {
	width: 770px;
	height:30px; /* set the width and the height to the right size  */
	padding: 0px; /* fill the whole space */
	margin-left:auto;
	margin-right:auto; /* a left and right auto margin centers the div */
	background:#d0c9c3; /* backing color */
	}
#navList ul, #navList li {
	list-style-type:none; /* removes the bullets */
	}
#navList li{ /* settings for the individual list items */
	height:20px;

	line-height:20px; /* this keeps the text verticallly centered */
	margin-left:6px; /* spaces them by 7 pix */
	float:left; 
	/* 
	float, is a usefull and misunderstood css property 
	this pushes an item all the way left or right and allows other items to wrap around it
	each 104 pixel list item moves a 7 pixel margin shy of the very left.
	*/
	display:block;
	text-align:center; /* centers the text */
	font-weight:bold; /* bold text */
	background:#fff
	}
#navList li.first{
	margin-left:0px; 
	/* 
	the first li and only the first li gets the class "first" in css when you give items orders the last one wins. 
	this overwrite the 7 pixel left margin on the first one and puses it alll the way to the left, 
	making sure that 7 x 104px list items and 6 x 7px margins make up the full 770px div
	*/
}
#navList a {
	text-decoration:none;
	display:block; /* all links in the navList are block with no underline */
	}

#navList a:visited{
	color:#adadad;
	background:#ffffff;
	}
	
#navList a:link {
	color:#adadad;
	background:#ffffff; /* all resting links have a light grey text and white background*/
	}	
	
#navList a:hover{
	color:#333;
	background:#d0c9c3; /* mouse over a link to change the text and background color of the 104px x 20px box */
	}	
	
#navList a.selected{
	color:#333;
	background:#d0c9c3; 
	/* 
	this rule MUST be the last one this makes the selected link ALWAYS this color 
	if this is not last then the mouseover effect will also work on the selected link
	*/
	}