body {
  color: #cfccc6;
  background-color: #3f3732;

  font-family: "Trebuchet MS", sans-serif;
  font-size: 100%;  /* Enables font size scaling in MSIE */
  margin: 0;
  padding: 0;
}

html > body {
  font-size: 11pt;
}

a:link {color: #746f69; text-decoration: none; }
a:active {color: #746f69; text-decoration: none; }
a:visited {color: #746f69; text-decoration: none; }
a:hover {color: #746f69; text-decoration: none; }

#header {
	width:100%;

	background:#333333;
}
.smallCaps {
  font-size: 90%;
  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}

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 {color: #746f69; text-decoration: none; }


}
.left-index {
	width:48%;
	float:left;

}

.right-index {
	width:50%;
	float:right;
	clear:both;
}

#container {
    position: relative;
    min-height: 100%;
    height: 100%;

    height: auto;
	}

html>body #container {
    height: auto;
	}


#logo {
width:35%;
position:relative;
top:-94px;
z-index:3;
margin-left:25px;
}
#tagline {
width:35%;
position:relative;
top:-112px;
margin-left:25px;
z-index:3;

}
#left {

  width: 40%;
  margin: 20px;
  padding: 0;

}
#right {
  width: 40%;
  margin: 20px;
  padding: 0;
  float: right;

}


.art {
	display:inline;
	margin: 40px 5% 40px 5%;

	padding: 0;
}
#main {
	margin-top:-85px;
}

#copy {
	width:70%;
	text-align:center;
	line-height:1.8em;
	font-size:85%;
	padding:10px;
	margin-left:15%;
	margin-top:-65px;
}

.bio {
	text-align:justify;
}
#bio {
	width:70%;
	text-align:left;
	line-height:1.8em;
	font-size:85%;
	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;
}



#menu {
  width: 100%;
  margin-top:93px;
  margin-bottom: 0px;
  margin-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:5px;
  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;
}


#imenu {
display:inline;
}
.indexmenu ul {
      font-variant:normal;

	height:auto;
	position:absolute;
	left:32%;
	top:100%;

	display:none;
	text-align:left;
	cursor:default;
	text-decoration: none;
    }

    .indexmenu ul li {

	text-indent: 0;

      padding: 0.2em;
    }

.indexmenu:hover ul {

       display: block;
      margin: 0;
      padding: 0;
      border: 0;

    }
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;
}
