/* --- Betsy Bauer Style Sheet May 2008 --- */

body {
	font-family: verdana, helvetica, arial, sans-serif;
	font-size: small;
	color: #663300;
	background-color: #FFFFCC;
	margin: 0;
}
/* standard HTML tags --------------------------------------------*/

p, li, table, td {
	font-family: verdana, helvetica, arial, sans-serif;
	font-size: small;
	color: #663300;
	line-height: 150%;
}
p, li, ul, ol, td, h1, h2, h3, h4 {
	font-family: verdana, helvetica, arial, sans-serif;
} /* Extra coding for old Netscape */
p {
	margin: 0 0 6px 0;
}
ul {
	text-align: left;
	text-indent: 0;
	list-style-image: url('../images/bullet.jpg');
	margin: 0;
	padding: 0 0 0 20px;
}
li {
	text-indent: 0;
	text-align: left;
	margin: 0 0 6px 0;
}
table {
	margin: 0;
	border: none;
}
table td {
	border-width: 0;
	vertical-align: top;
}
img {
	border: none;
}
/* HEADINGS H1 for page title */
h1, h2, h3, h4 {
	font-family: verdana, helvetica, arial, sans-serif;
	color: #6C3C00;
	font-weight: bold;
}
h1 {
	font-family: "Verdana Ref", verdana, helvetica, arial, sans-serif;
	font-size: 130%;
	text-transform: uppercase;
	letter-spacing: 5px;
	text-align: center;
	padding: 0;
	margin: 0 0 10px 0;
}
h2 {
	font-family: "Verdana Ref", verdana, helvetica, arial, sans-serif;
	font-size: 110%;
	text-transform: uppercase;
	letter-spacing: 5px;
	text-align: center;
	margin: 20px 0 10px 0;
}
h2.top {
	margin: 0 0 10px 0;
}
h3 {
	font-size: 100%;
	margin: 0;
}
h4 {
	font-size: 100%;
	margin: 0;
}
hr {
	color: #E3F4E3;
	height: 1px;
	margin: 5px 0 10px 0;
	padding: 0;
	background: #E3F4E3;
	border: none;/* background and border needed for FireFox */
}
/* Links --------------------------------------------------*/

a:link {
	color: #993300
}
a:visited {
	color: #663300
}
a:hover {
	color: #CC0000
}
/* Page Layout --------------------------------------------*/

/* Outer wrapper is not fixed size. This lets us set a header color that goes for the whole screen.*/
div#outerwrapper {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: left;
	background: transparent url(../images/background-header.gif) top left repeat-x;
	/* This creates the brown background behind the header that goes past the end of the page. Same color also set in Header div. */
}
/* Wrapper sets the page size */
div#wrapper {
	width: 980px;
	margin: 0;
	padding: 0;
	text-align: left;
	background: transparent url(../images/background.gif) top left repeat-y;
	/* This creates the brown background on the navigation column and off white page background - 
	page background also set in Body tag - change in Body tag is want a different color at end of the page */
}
/* Header */

div#header {
	width: 100%;
	height: 100px;
	padding: 0;
	margin: 0;
	text-align: left;
	background-color: #6c3c00; /* background set in outerwrapper with graphic but also set here to make it appear first */
}
div#corner {
	float: left;
	padding: 0;
	margin: 0;
}
div#name {
	padding: 36px 0 0 0; /* padding to center graphic */
	margin: 0;
	text-align: center;
}
div#header a {
	text-decoration: none;
}
div#header a:hover {
	text-decoration: none;
}
/* Content - main text part of page, variations set by class on body tag */

div#pagecontent {
	clear: both;
	width: 100%;
}
/* Page with standard two columns - pagenav, content */

div#nav {
	width: 130px;
	float: left;
	text-align: center;
	padding: 10px;
	margin: 0;
	background-color: #6C3C00; /* background set in wrapper with graphic but also set here to make it appear first */
}
/* Navigation - buttons down the side */
#buttons {
	width: 120px;
	margin: 0 auto 20px auto;
}
#buttons a:link, #buttons a:visited {
	display: block;
	font-size: 85%;
	line-height: 125%;
	text-align: center;
	text-transform: uppercase;
	color: #FFFFCC;
	text-decoration: none;
	background-color: #6C3C00;
	border: 1px solid #AD5C10;
	margin: 12px 0;
	padding: 3px;
}
#buttons a:hover {
	background-color: #AD5C10;
	text-decoration: none;
}
/* TURN ON Navigation Buttons by Body ID */
#biopg #buttons a#bio, 
#commentspg #buttons a#comments, 
#commissionspg #buttons a#commissions, 
#contactpg #buttons a#contact, 
#exhibitionspg #buttons a#exhibition, 
#homepg #buttons a#home, 
#linkspg #buttons a#links, 
#statementpg #buttons a#statement, 
#portfoliopg #buttons a#portfolios, 
#pubpg #buttons a#pub, 
#studiopg #buttons a#studio, 
#operapg #buttons a#opera {
	background-color: #AD5C10;
	text-decoration: none;
}
div#content {
	width: 790px;
	padding: 20px;
	margin: 0 0 0 150px; /* left margin for nav column */
	text-align: left;
}
/* Footer */

div#footer {
	clear: both;
	width: 100%;
	padding: 10px 0;
	margin: 0;
	text-align: center;
}
div#footer p {
	padding: 0 30px;
	font-size: 85%;
}
div#footer a {
	color: #663300;
	text-decoration: none;
}
div#footer a:hover {
	color: #CC0000;
	text-decoration: underline;
}
/* Breadcrumbs - list of links at top of page */

.bc {
	color: #663300;
	font-size: 85%;
	margin: 0 0 10px 0;
	line-height: 100%;
}
.bc a {
	color: #993300;
	text-decoration: none;
}
.bc a:hover {
	color: #CC0000;
	text-decoration: underline;
}
/* Back to Top */

.backtotop {
	font-size: 85%;
	font-variant: small-caps;
	line-height: 1;
	margin: 10px 0 0 0;
	padding: 0;
}
.backtotop a {
	color: #993300;
	text-decoration: none;
}
.backtotop a:hover {
	color: #660000;
	text-decoration: underline;
}
/* text in navbar */

.smallwhite {
	font-size: 85%;
	text-align: center;
	line-height: 125%;
	color: #FFFFCC;
	margin: 10px 0 0 0;
}
.smallwhite a {
	color: #FFFFCC;
	text-decoration: none;
	background: transparent;
}
.smallwhite a:hover {
	color: #FFFFCC;
	text-decoration: underline;
	background: transparent;
}
/* Images --------------------------------------------*/

.floatimgleft {
	float: left;
	margin: 0 10px 10px 0;
}
.floatimgright {
	float: right;
	margin: 0 0 10px 10px;
}
.floatimgcenter {
	text-align: center;
	margin: 10px 0;
}
/* Image on top of page above h1 */
.floatimgcentertop {
	text-align: center;
	margin: 0 10px 20px 10px;
}
/* FORMS */
table.inputform {
	margin: 10px;
	border: 1px solid #6C3C00;
}
table.inputform th {
	text-align: right;
	font-weight: bold;
	vertical-align: top;
	padding: 5px;
	margin: 0;
}
table.inputform td {
	text-align: left;
	vertical-align: top;
	padding: 20px;
	margin: 0;
}
/* TABLE for text and image layout - works with images on either side - not centered - not in Portfolio */

table.textimage {
	margin: 0;
}
table.textimage td {
	text-align: left;
	padding: 0 20px 20px 0;
	margin: 0;
}
table.textimage img {
	padding: 0 0 10px 0;
	margin: 0;
}
/* PORTFOLIO page of thumbs - index page */
table.portfoliothumbs {
	margin: 0 auto;
}
table.portfoliothumbs td {
	text-align: center;
	padding: 20px;
	margin: 0;
}
table.portfoliothumbs img {
	padding: 0;
	margin: 0;
}
table.portfoliothumbs p {
	padding: 10px 0 0 0;
	margin: 0;
}
/* PORTFOLIO single image page */
table.portfolioimage {
	margin: 0 auto;
}
table.portfolioimage td {
	padding: 0 0 20px 0;
	margin: 0;
}
table.portfolioimage img {
	padding: 0 20px 20px 0;
	margin: 0;
}
table.portfolioimage p {
}
table.portfolioimage h4 {
}
/* PORTFOLIO navigation */
.photonav {
	color: #663300;
	text-align: center;
	margin: 0 0 20px 0;
}
.photonav a {
	color: #993300;
	text-decoration: none;
}
.photonav a:hover {
	color: #CC0000;
	text-decoration: underline;
}
