/******************************************
	Gristmill style sheet
	created by: Taliesin Smith
	updated: December 2, 2007
*******************************************/

/*************** COLOR CHART **************
*******************************************
All colors were matche to the painting.
More colors in colorChart.html
	body	bgcolor = 624340 Dark Chocolate Brown
					9cb6cd light blue
				font color = 703043 Wheel Dark Red
		container bgcolor = e1c480 Golden Tan	
			intro bgcolor = 703043 Wheel Dark Red
						font color = e7c86d Harvest Yellow
					pageHeader
					slogan
					contactInfo					
			nav1, nav3 bgcolor = a4a16b Olive Green
			mainSections bgcolor = ffda89 Yellow-Orange 
			pageFooter bgcolor same as container			
					updated
					htmlValidator, cssValidator buttons 
								bgcolor = 8f6889 Tree Trunk Purple
								font color = 4e3465 Dark Tree Trunk Purple
								These reverse on hover
						   
*******************************************/

/*************************
*** BASIC ELEMENTS
**************************/
html {
	font-size: 62.5%; 
}
body{ 
	/*font: 10pt/12pt georgia;*/ 
	font-family: georgia, serif;
	color: #703043; /* Wheel Dark Red */  
	background-color: #624340; /*Dark Chocolate Brown*/
	margin: 0 auto;
	width: auto;
	text-align: center;
	font-size: 1.3em;
	line-height:1.5em;
	}
/** {
	padding: 0;
	margin: 0;
}*/
table {
	font-size: 1.3em;
	color: #372b2d ; /* Black Brown */
	background-color: #f6fbb8; /* Pale Yellow *//*#c0d88c ; /* very Light Bush Green */
	text-align: center;
	border: 1px dashed;
	padding: 4px; 
	margin-bottom: 5px;
	}
	
	tr.head, tr.foot {
	font-weight: bold;
	background-color: #c0d88c;
	border-width: 1px 1px 1px 0px;
	border-color: #567d53 ; /* Dark Tree Green */
	border-style: solid;
	padding: 4px;
	}
	tr.foot {
	text-align: left;
	font-weight: normal;
	border-width: 1px 1px 1px 0px;
	padding: 0;
	}
	tr.foot ul {
		padding: 5px 0 0 0;
	}
	tr.subhead {
	font-weight: bold;
	background-color: #cccb6e ; /* Leaf Yellow-Green */ 
	border-width: 1px 0px 1px 0px;
	border-color: #567d53 ; /* Dark Tree Green */
	border-style: solid;
	padding: 4px;
	}
	
	tr.tableNotes{
	color: #372b2d; /* Black Brown */
	background-color: #f6fbb8; /* Pale Yellow */
	border: 1px #e4efab solid; /* Pale Yellow Green border*/
	margin-top: 0px;
	text-align: left;}

sup { font-size: 75%;
	line-height: 50%;
}
p, ul {
	padding: 0;
	margin: 0 1em 1em 1em; /*removes top margin of all paragraphs, but keeps the bottom*/	
	}
li {
	list-style-position: inside;
}
img {
	/*margin: 0 1em 1em 0;*/
} 
.feature {
	margin-bottom: 0.5em;
}
h1, h2, h3, h4, h5, h6 {
	padding: 0;
	margin: 0 0 1em 0;
}
h1 {
	font-size:2em;
	font-weight: bold;
	margin-top: 1em;
}
h2 {
	font-size: 1.6em;
	font-weight: bold;
	clear: left;
	margin-top: 1em;
}
h3, h4, h5, h6 {
	font-size: 1.4em;
	font-weight: bold;
}
h3 {
	clear: left;
	padding: 1em 0 0.5em 0;
	/*border-top: 1px solid #4e3465;*/
	}
	
h4  { 
	margin-bottom: 0;
	font: bold normal 12pt georgia; 
	letter-spacing: 1px; 
	}
h2 strong {
	display: block;
	padding-bottom: 0.5em;
}
strong {
	font-weight: bold;
}
em {
	font-style: italic;
	font-weight: bold;
	}
/********************************
*** Specific Divs used for layout
**********************************/

/*** container div contains all other divs ***/
#container {
	margin: 0 auto;
	background-color: #e1c480; /* Golden Tan */ 
	border: 2px solid #77697d ; /* Darkish Silver Border*/
	width: 69em;
	text-align: left;
	}

/*** intro div contains pageHeader, slogan, contactInfo ***/
#intro {
	margin: 0;	
	padding: 0;
	/*border: 1px dotted; /*uncomment borders for position testing*/
	background-image: url(../images/headerOld.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
	background-color: #703043; /* Wheel Dark Red */ 
	color:#e7c86d; /* Harvest Yellow */ 
	width: auto;
	height: 240px;
	}

#pageHeader{
	position:relative;
	/*border: 1px dotted; /*uncomment borders for position testing*/
	background-color: transparent;
	padding: 10px 0px 10px 20px;
	/*margin-right: 46%;*/	
	}
	
#homeLink, #homeLink:link, #homeLink:visited, #homeLink:hover, #homeLink:focus, #homeLink:active{
	position: absolute;
	top: 1px;
	left: 1px;
	width: 383px;
	height: 193px;
	border:none;
	outline:none;
	text-indent: -9999px;
}
#homeLink:active{
	outline:1px dotted #e7c86d;
}
#pageHeader h1, #pageHeader h2, #pageHeader h1 a{
	padding: 0;
	margin: 0;
	color: #e7c86d;
	display: inline;
	}

#slogan, #contactInfo, #pageHeader h2 { 
 /*border: 1px dotted; /*uncomment borders for position testing*/ 
 text-align: right; 
	}
#slogan {
	height: 25px;
	}
#slogan h3{
	font: italic 16pt/16pt georgia;	
	margin-top: 10px;
	margin-bottom: 4px;
	}
#slogan  h3, #contactInfo p{
	text-align: right;
  line-height: 75%;
	padding: 0px 10px 0px 0px;
	}
#contactInfo p.p1{
	padding: 10px 10px 0px 0px;
	}
	
/******************************************* 
*** navbar divs - anchors are defined elsewhere
********************************************/	
#nav1, #nav3 {
	border-width: 1px 0 1px 0; 
	border-style: dashed;
	padding: 0; 
	height: 2em;    
	background-color: #a4a16b ; /* Olive Green */ 
	text-align: center;
	padding-top: 5px;
	}
	
#nav3 {
	clear: both;
}
/*********************************************
*** mainSections div contains the main content area 
**********************************************/
#mainSections {
	background-color: #ffda89; /* Yellow-Orange */   
	border-width: 0 1px 0 1px;
	border-style: dashed;
	padding: 1em 1em 7.5em 2em; /*10px 10px 75px 20px*/
	margin-right: 3em;
	margin-left: 3em;
	height: 1%;
	overflow: auto;  
	}
	
#mainSections h3 {
	padding: 0;
}
#rotate {
	margin-left: 160px;
}

/*** pageFooter div contains 
updated and validation funtions ***/
#pageFooter{
	clear: both;
	border-top: 1px dashed;
	padding: 1em;
		}
#pageFooter .credits {
	float: left;
}
#pageFooter p.date, p#validation {
	text-align: right;
	}

/*************************************
***  STYLES FOR IMAGES and PHOTOS 
**************************************/
#smallPhoto {
		padding: 0;
		}
img.smallPhoto, img {
	border: 1px solid #77697d ; /* Darkish Silver Border*/
	padding: 0;
	margin: 0 1em 0.25em 0;
	} 
.right {
	float: right; 
	margin-left: 10px;
	
}
.left {
	float: left; 
	}
div.item {float: left; border: 1px solid; padding: 5px; width: 75%;}
div.item img {float: left; margin: 0 20px 10px 0;}
div.item h3, div.item p{
	display: inline;
}

/****************************
***  LISTS, ANCHORS, NAVBAR  STYLES 
*****************************/
a, a:link, a:visited { 
	font-weight: bold; 
	color: #4e3465 ; /* Dark Tree Trunk purple*/ 
	text-decoration: none;
	padding: 0;
	}

a:hover, a:focus, a:active { 	 
	text-decoration: underline; 
	}
	
h2 a, h2 a:link, h2 a:visited { 
	font-weight: bold; 
	color: #624340;
	text-decoration: none;
	padding: 0;
	}

h2 a:hover, h2 a:focus, h2 a:active { 
	font-weight: bold; 
	color: #a4a16b; /* dark olive green */	 
	text-decoration: none; 
	}

#nav1 a, 
#nav3 a,	
#nav1 a:link, 
#nav3 a:link,
#nav1 a:visited,
#nav3 a:visited { 
	text-decoration: none;
	color: #624340 ; /* Dark choc brown */	
	}
	
#nav1 a:hover, 
#nav3 a:hover,
#nav1 a:focus, 
#nav3 a:focus,
#nav1 a:active,
#nav3 a:active { 
	text-decoration: underline;
	color: #cccb6e ; /* Leaf Yellow-Green */
	}	
	
li.current {
	border-top: 1px solid;
	}
	
#pageFooter #validation a,
#pageFooter #validation a:link,
#pageFooter #validation a:visited {
	background-color: #8f6889 ; /* Tree Trunk */ 
	border-width: 2px;
	border-style: solid;
	padding: 0 1em 0 1em;
	text-decoration: none;
	}	
#pageFooter #validation a:hover,
#pageFooter #validation a:focus,
#pageFooter #validation a:active {
	color: #8f6889 ; /* Tree Trunk */
	background-color: #4e3465 ; /* Dark Tree Trunk purple*/  
	border-width: 2px;
	border-style: solid;
	padding: 0 1em 0 1em;
	}
	
/** Two Column Styles
-----------------------**/
#contentSkinny {
	width: 68%;
	margin-right: 0;
	float: left;
}

#sideBar, #imageSideBar, #sideMenu {
	width: 28%;
	float: left;	
	color: #3a3464;
	margin-left: 1em;
}

#sideBar, #sideMenu{
	background-color: #9cb6cd; /*muted light blue*/
}

#sideBar ul, #imageSideBar ul, #sideMenu ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

#sideBar li, #imageSideBar li {
	margin: 1em 15px 1em 15px;
	padding: 0;
}
#sideBar li {
	padding: 0 0 1em 0;
	border-bottom: 1px solid;
}
#sideBar li.last {
	border-bottom: none;
}
#sideBar h3, #sideMenu h3 {
	font:1.8em/2em helvetica, sans-serif;
	font-weight: bold;
	text-align: center;
	margin: 0;
	padding: 0;
	border-top: none;
	color: #fff;
	background-color: #3a3464; /*for the side bar heading*/
}
#sideBar p {
	margin: 0 0 1em 0;
	text-align: justify;
}
#sideBar h2, #sideMenu h2 {
	margin: 0;
	padding: 0;
	text-align: center;
	font-size:1.3em;
	line-height: 1.5em;
}
#sideMenu ul {
	margin-bottom: 20px;
}
#sideBar img, #imageSideBar img {
	display: block;
	margin: 0 auto 1em auto;
}
#sideBar .plain li {
	border-bottom: none;
	margin: 0;
	padding: 0 0 5px 0;
}

#sideMenu a {
	display: block;
	text-align: center;
}
#imageSideBar a, 
#imageSideBar a:link,
#imageSideBar a:visited,
#imageSideBar a:active,
#imageSideBar a:hover {
	padding: 0;
	margin: 0;
	display: inline;
	text-decoration: none;
}
#sideBar a, #sideBar a:link, #sideBar a:visited,
#sideMenu a, #sideMenu a:link, #sideMenu a:visited { 
	font-weight: bold; 
	color: #3a3464;
	text-decoration: none;
	}

#sideBar a:hover, #sideBar a:focus, #sideBar a:active,
#sideMenu a:hover, #sideMenu a:focus, #sideMenu a:active { 
	text-decoration: underline;	
	padding: 0;
	}
/* my handy in-line menu class */
.pipeLine, .inline {
	list-style-position: inherit;
}
.pipeLine li, .inline li {
	height: 50%;
	display: inline;
	border-right-width: 1px;
	border-right-style: solid;
	padding: 0 0.55em 0 0; /* padding bigger on li to compensate for border */
	margin: 0;
}
.pipeLine a, .inline a {
	padding-left: 0.5em;
	padding-bottom: 2px;
}
.pipeLine li.last {
	border-right: none;
}
.inline li {
	border-right: none;
}
dl.inline {
	clear: left;
}
.inline dt, .inline dd {
	float: left;
	padding: 0;
}
.inline dt {
	clear: both;
}

/* == General Formatting classes */
.clear         { clear:both; }
.clearLeft  { clear:left; }
.floatLeft    { float:left; }
.floatRight   { float:right;}
 
.textLeft     { text-align:left; }
.textRight    { text-align:right; }
.textCenter   { text-align:center; }
.textJustify  { text-align:justify; }
 
.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
 
.imgLeft      { float:left;margin: 0 20px 0 0; }
.imgRight     { float:right;margin: 0 0 0 20px; }
 
.nopadding     { padding:0; }
.noindent      { margin-left:0; padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }