body {
  color: #cfccc6;
  background-color: #3f3732;

  font-family: "Trebuchet MS", sans-serif;
  font-size: 85%;  /* Enables font size scaling in MSIE */
  margin: 0;
  padding: 0;
}

html > body {
  font-size: 85%;
}

a:link {color: #c78e35; text-decoration: none; }
a:active {color: #c78e35; text-decoration: none; }
a:visited {color: #746f69; text-decoration: none; }
a:hover {color: #746f69; text-decoration: none; }


.smallCaps {
  font-size: 95%;
  font-variant: small-caps;
}


.picture {
	margin-right:10px;
}

a:link .picture {border:2px; border-thickness:1px;
border-color: #746f69; border-style: solid}
a:active .picture {border:2px; border-thickness:1px;
border-color: #746f69; border-style: solid}
a:visited .picture {border:2px; border-thickness:1px;
border-color: #746f69; border-style: solid}
a:hover .picture {border:2px; border-thickness:1px;
border-color: #746f69; border-style: solid}


.image {border:2px; border-thickness:1px;
border-color: #746f69; border-style: solid}
.image {
	margin-top:30px;
}
a.icon:link {border:none; text-decoration: none; }
a.icon:active {border:none; text-decoration: none; }
a.icon:visited {border:none; text-decoration: none; }
a.icon:hover {border:none; text-decoration: none; }

.bigpic {border:2px; border-thickness:1px;
border-color: #746f69; border-style: solid}
.bigpic {
margin-right:30px;
margin-left:30px;
margin-top:40px;}


#container {

    height: auto;
	}

html>body #container {
    height: auto;
	}

#header {
	width:100%;
	padding-bottom:20px;
	height:200px;
	background-color:#333333;
}



#logo {
position:absolute;
top:0px;

left:0px;

}

#logo2 {
width:40%;
position:absolute;
top:-105px;

margin-left:25px;

}



#tagline {

margin-left:128px;


}

#tagline2 {
width:17%;
position:absolute;
top:105px;
margin-left:25px;
margin-bottom:-80px;


}

.link {
	color: #d49d47;
	font-size: 90%;
	font-weight: bold;
	margin-left: 30px;
}
#left {

  width: 40%;
  margin: 20px;
  padding: 0;

}
#right {
  width: 40%;
  margin: 20px;
  padding: 0;
  float: right;

}
.left-index {
	width:50%;
	float:left;
}

.right-index {
	width:50%;
	float:right;
}

.art {
	display:inline;
	margin: 40px 5% 40px 5%;

	padding: 0;
}
#main {
	margin-top:-105px;
}

#main2 {
	margin-top:-90px;
	position: relative;
	z-index: 60;
}

#copy {
	width:70%;
	text-align:center;
	line-height:1.8em;
	font-size:90%;
	padding:10px;
	margin-left:15%;
	margin-top:-65px;
}

#biocopy {
	width:70%;
	text-align:justify;
	line-height:1.8em;
	font-size:90%;
	padding:10px;
	margin-left:15%;
	margin-top: -70px;
}
.bio {
	text-align:justify;
}
#bio {
	width:70%;
	text-align:left;
	line-height:1.8em;
	font-size:90%;
	padding:10px;
	margin-left:15%;
}
/* ##### Main Copy ##### */

#main-copy {
  width: auto;
  color: black;
  background-color: white;
  text-align: justify;
  line-height: 1.5em;
  margin: 0 0 0 12.5em;
  border-left: 1px solid rgb(216,210,195);
}

#main-copy h1 {
  color: rgb(166,140,83);
  background-color: transparent;
  font-family: arial, verdana, helvetica, sans-serif;
  font-size: 175%;
  font-weight: bold;
  font-style: italic;
  text-align: left;
  margin: 1em 0 0 0;
  padding: 1em 0 0 0;
  border-top: 1px solid rgb(216,210,195);
}

#main-copy a {
  color: rgb(168,140,83);
  background-color: transparent;
  text-decoration: underline;
}

#main-copy a:hover {
  text-decoration: none;
}

p {
  margin: 1em 0 1.5em 0;
  padding: 0;
}

dt {
  font-weight: bold;
  margin: 0;
  padding: 0 0 0.5ex 0;
}

dd {
  margin: 0 0 1.5em 1.5em;
  padding: 0;
}

ol {
	list-style-type: none;
}

ul {
	list-style-type: square;margin-top:-5px;
}



#menu {
  width: 100%;
  padding-top:93px;
  padding-bottom: 0px;
  padding-right:2px;

  font-size: 85%;
  text-align: right;
  border-bottom:1px solid #b1aa9e;
 }


#menu a {
  color: #b1aa9e;
  text-decoration: none;
  font-weight: bold;
  margin: 0;
  padding: 0 1ex;
}

#menu a:hover{
  color: #474b42;
  background-color: #b1aa9e;
}

#indexmenu {
  width: 100%;
  margin-top:0px;
  margin-bottom: 5px;
  margin-right:2px;

  font-size: 10px;
  text-align: center;

 }


#indexmenu a {
  color: #b1aa9e;
  text-decoration: none;
  font-weight: bold;
  padding-left:5px;
  padding-right:5px;
}

#indexmenu a:hover{
  color: #474b42;
  background-color: #b1aa9e;
}

ul span.indexmenu {list-style-type:none;}
a span.indexmenu {
	font-variant:normal;


	position:absolute;
	left:32%;
	top:100%;

	visibility:hidden;
	text-align:left;
	cursor:default;
	text-decoration: none;
}


#indexmenu2 {
  position:absolute;
  width: 100%;
  margin-top:5px;
  margin-bottom: 5px;
  margin-right:2px;

  font-size: 85%;
  text-align: center;

 }


#indexmenu2 a {
  color: #b1aa9e;
  text-decoration: none;
  font-weight: bold;
  padding-left:5px;
  padding-right:5px;
}

#indexmenu2 a:hover{
  color: #474b42;
  background-color: #b1aa9e;
}

ul span.indexmenu2 {list-style-type:none;}
a span.indexmenu2 {
	font-variant:normal;


	position:absolute;
	left:32%;
	top:100%;

	visibility:hidden;
	text-align:left;
	cursor:default;
	text-decoration: none;
}

a:hover span.indexmenu {
	visibility:visible;
	display:block;

}
a:hover {
	position:static;
	border: 0;
	text-indent:none; /* makes IE redraw the A tag and its children, I guess. Hooray for workarounds! Thank you to Joshua Seigler for helping me with this problem and for the original idea */
}

.nav {
	width:auto;
	display:inline;
	margin-top:35px;
	padding:2px;
	border-right:1px solid #b1aa9e;
}