body		{ margin: 0; padding: 0;
			  background-color: #444f5f;
			  font-size: 15px; font-family: "Lucinda Grande", helvetica, sans-serif;
			  text-align: center;
			  height: 100%;
			  }
.container	{ position: relative;
			 height: auto;
			  max-width: 960px;
			  height:auto !important;
			  height: 100%
			  min-height: 100%; 
			  margin: 0 auto -30px;
			  text-align: left;
			  background-color:#C1D5EF;
			  padding: 1px;
			  }
			  
a:link		{ color: #1a3252; text-decoration: none;}
a:hover		{ color: #83bdb0; }

.header		{ background-color: #73A461; 
			  color: #185144; display: inline;
			  width: 95%;
			  text-align: center;
			  }
#nav{
	list-style:none;
	font-size: 115%;
	font-variant: small-caps;
	margin-bottom: 8px;
	background: #ffffff;
	/* Clear floats */
	float:left;
	width:95.9%;
	
	position:relative;
	z-index:5;
	
}
#nav li{
	float:left;
	margin-right:15px;
	margin-left:5px;
	position:relative;
}
#nav a{
	display:block;
	padding:5px;
	color:#1a3252;
	background:#ffffff;
	text-decoration:none;
}
#nav a:hover{
	color:#83bdb0;
	background:#ffffff;
	text-decoration:none;
}
/*--- DROPDOWN ---*/
#nav ul{
	background:#fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li{
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
#nav ul a{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{ /* Display the dropdown on hover */
	left:-35px; /* Bring back on-screen when needed */
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background:#ffffff;
	text-decoration:none;
}
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background:#333;
}

ul			{ list-style-type: none; }
			
p, blockquote { padding: 5px;
			   margin-left: 15px;
			   font-size: 100%;
			   line-height: 1.5em;
			   }
h1			{ font-size: 90%}
h2, h3	 	{ font-variant: small-caps;
			 margin-left: 15px;
			  padding: 5px;
			  color: #444;
			  letter-spacing: 1px;
			  }

.main		{ margin: 70px 20px 20px 20px;
			  padding: 10px;
			  background-color: #ffffff;
				}


#bio		{ font-size: 115%;
			  background-color:#ffffff;
			  padding: 10px;
			  }
#books	 	{ float: left;
			  width: 30%;
			  line-height: 2em;
			  }
#books footer {padding-left: 30px;
			   font-size 100%;
			   }
#blurb 		{ float: right;
			  font-size: 115%;
			  width: 35%;
			  padding-left: 10px;
			  }

#sample		{ float: right;
			 width: 30%;
			}
#sample p   { line-height: 2em;
			  font-size: 115%;
			}
#audio, #visual		{ margin: 10px;
			  float: left;
			  width: 29%;
			  }
#audio, #visual p { padding: 0px;
				}

#video		{ float: right;
			  width: 65%;
			  }
#video li	{ padding: 5px;
				}

img			{ border: solid 10px #FFFFFF; 
              opacity: 1.0;
			  filter:alpha (opacity=100);
			  }
			  
#cover		{ margin: 20px;
			padding: 20px 50px;
			text-align: center;
			}

#images 	{ margin: 15px;
			  padding: 10px;
			  text-align: center;
			  }
			

#images img:hover,
#cover img:hover	{ opacity:0.4;
			   filter:alpha (opacity=40);
			   }
		
#slideshow { position: relative;
			 padding: 15px;
			 text-align: center;
			 margin: 70px 20px 20px 20px;
			 }
#slideshow ol {display: inline;
				}
#slideshow li {padding: 20px;
				display: inline;
				}
#form table { width: 75%;
			  }


.push { height: 30px;
		clear: both;
			  }
.footer { position: relative;
		  text-align: center;
		  background-color:#FFFFFF;
		 height: 30px;
		 font-size: 90%;
			}