body {
    background: black;
/*    color: #145C1E; */
    color: #3B7743;
    font-family: sans-serif;
/*    margin-top: 65px; */
/*    background-attachment: scroll; */
/*    background-repeat: no-repeat; */
/*    background-image: url(kodachi-banner.jpg); */
/*    background-position: top left; */
}

HR {
  border: 0;
  height: 2px;
  color: #3B7743;
  background-color: #3B7743;
}

P         { color: #3B7743; }

A         { text-decoration: none; }
A:link    { color: #629269; }
A:visited { color: #145C1E; }
A:active  { color: #3B7743; }
A:hover   { color: red;     }

IMG       { border: 0px; }

#container {
/*  border: 1px dashed red; */
  width: 90%;
  margin: 10px auto;
  line-height: 130%;
}

#header {
  margin-top: 1em;
  height: 46px;
  border-bottom: 4px solid #3B7743;
}

#banner {
  padding: 0;
  margin: 0;
  float: left;
}

#map {
/*  border: 1px solid blue; */
  width: 100%;
  margin: 2px;
  margin-top: 10px;
}

#buttonbar {
  height: 36px;
  padding: 0;
  margin: 0;
  margin-top: 10px;
  float: right;
}

#navbar {
  clear: both;
  float: left;
  width: 120px;
  padding-top: 4px;
  margin-left: 0;
  min-height: 20em;
/*  border: 1px solid blue;*/
  border-right: 2px solid #3B7743;
}

#navbar .entry {
  clear: both;
  height: 50px;
/*  border: 1px dashed red; */
}

#navbar .marker {
  width: 16px;
  margin: 0px;
  margin-right: 8px;
  float: left;
/*  border: 1px dashed #00FFFF; */
}

#navbar .marker img { 
  height: 16px;
  width: 16px;
  margin: 0px;
  margin-top: 17px;
  margin-bottom: 17px;
  border: 0px;
}

#navbar .thumbnail {
  height: 50px;
  width: 90px;
  float: right;
/*  border: 1px dashed #FFFF00; */
}

#navbar .thumbnail p {
  text-align: center;
/*  border: 1px solid #FFFF00; */
  margin: 0;
/*  background-color: #555555; */
}

#navbar .thumbnail img {
  height: 46px;
  max-width: 90%;
  border: 1px solid #555555;
  padding: 0px;
}

#photoarea {
  max-width: 750px;
  margin-left: 120px;

  /* 
   * Gecko renderers seem to need this stupid invisible border or they
   * screw up centering the image when the window is large.  Why the hell
   * is it so hard to center images???
   */

  border: 1px solid black;
  border-left: 2px solid #3B7743;
  line-height: 110%;
  text-align: center;
}

#photoarea .photo img {
/*   margin: 0; */
  margin-top: .5em;
  margin-bottom: 2px;
  margin-left: .5em;
  border: 0px;
}

#photoarea p {
  text-align: center;
  padding: 0;
  margin: 0;
}

#metadata p {
  text-align: center;
  padding: 0;
  margin: 0;
  font-style: italic;
  font-size: 80%;
  line-height: 105%;
}

.centeredimage { 
  text-align: center;
  margin: 0px;
  padding: 0px;
}

.hrule { 
  text-align: center;
  margin: 0px;
  margin-top: 1em;
  padding: 0px;
}

.intro p { 
  border: 1px solid red;
  text-align: center;
/*  float: center;*/
  padding: 0;
  padding-left: 10%;
  margin-top: 1em;
  width: 80%;
}

.intro li { 
/*  border: 1px solid green; */
  text-align: left;
  padding: 0;
  margin: 0;
  margin-left: 25%;
  width: 50%;
}

#maintext p {
  text-align: left;
  padding: 0;
  padding-left: 20%;
  margin: 0;
  margin-top: 1em;
  width: 60%;
}

#maintext li { 
  text-align: left;
  padding: 0;
  margin: 0;
  margin-left: 25%;
  width: 50%;
}

#commentary p { 
  text-align: center;
  padding: 0;
  padding-left: 10%;
  margin: 0;
  margin-top: 1em;
  width: 80%;
}

#commentary .left {
  width: 49%;
  float: left;
/*  border: 1px dashed red; */
}

#commentary .right {
  width: 49%;
  float: right;
/*  border: 1px dashed red; */
}

#commentary h3 { 
  text-align: center;
  text-decoration: underline;
  padding: 0;
  padding-left: 10%;
  margin: 0;
  margin-top: 1em;
  width: 80%;
}

#commentary li { 
  text-align: left;
  padding: 0;
  margin: 0;
  margin-left: 25%;
  width: 50%;
}

#pagename {
  height: 45px;
  padding: 0;
  margin: 0;
/*  border: 1px solid red; */
}

#pagename h2 {
  margin: 0;
/*  margin-top: 1em; */
  padding: 0;
  text-align: right;
  vertical-align: bottom;
}

#sidecontainer {
  clear: both;
  float: left;
  width: 10em;
  margin-top: 0;
  margin-left: 0;
  padding: 0;
  min-height: 20em;
  border-right: 2px solid #3B7743;
/*  border: 1px solid blue; */
}

#sidecontainer ul {
  margin: 0;
  padding: 0;
}

#sidebar ul { 
  margin-left: 1em;
  padding: 0;
  width: 9em;
/*  border: 1px solid red; */
}

#sidebar li {
  list-style: none;
  margin: 0;
  text-align: left;
  border-bottom: 1px solid #3B7743;
/*  background: #CEECCE; */
/*  border: 1px solid red; */
}

#sidebar li a {
  display: block;
  padding: 0.25em 10px 0.25em 0;
  margin: 0;
  text-decoration: none;
}

#sidebar li a:link {
  color: #3B7743;
/*  color: #629269; */
}

#sidebar li a:visited {
  color: #3B7743;
/*  color: #629269; */
/*  color: #145C1E; */
}

#sidebar li a:hover { 
/*  background: #CCC; */
/*  color: #3B7743; */
  color: red;
}

#sidebar li a.active:link {
/*  color: #3B7743; */
  color: #629269;
}

#sidebar li a.active:visited {
/*  color: #3B7743; */
  color: #629269; 
/*  color: #145C1E; */
}

#sidebar li a.active:hover { 
/*  background: #CCC; */
/*  color: #3B7743;*/
  color: red;
}

#donations { 
   clear: both;
   float: left;
/*   border: 1px solid #3B7743;*/
   padding-top: 1em;
   padding-right: 1em;
   margin-right: 1em;
/*   vertical-align: center;*/
}

#content {
/*  clear: both; */
  margin: 0;
/*  background-image: url(sandstone-lightgrey.jpg);*/
/*  background-image: url(sand2x2.jpg); */
}

#mainarea {
  margin-left: 10em;
  border-left: 2px solid #3B7743;
  padding: 1em;
}

#mainarea h2 {
  color: #3B7743;
  margin: 0 0 .5em 0;
}

#mainarea h3 {
  color: #3B7743;
  margin: 0 0 .5em 0;
  text-decoration: underline;
}

#footer { 
  clear: both;
  margin: 0;
  padding: .5em;
  text-align: right;
  font-size: 76%;
/*  color: #333; */
/*  background-color: #ddd; */
/*  border-top: 1px solid gray; */
}

/* Styles for gallery-index pages. */

#galleries-left-container {
  clear: both;
  float: left;
  width: 40%;
  margin-top: 0;
  margin-left: 0;
/*  margin: 0; */
  padding: 0;
  min-height: 20em;
/*  border: 2px solid blue; */
  border-right: 2px solid #3B7743;
}

#galleries-left {
  margin: 0;
  margin-right: 1em;
}

#galleries-main {
  margin-left: 40%;
  padding: 1em;
  padding-right: 0;
/*  border: 2px solid red; */
  border-left: 2px solid #3B7743;
}

#galleries-main img {
  border: 1px solid #BBBBBB;
  padding: 1px;
  margin: 1px;
}

#galleries-main form {
  border: 1px solid #3B7743;
  padding: 1px;
  margin: 1px;

  font-family: 'Myriad Pro', sans-serif;
  color: #3B7743;
  background-color: #AAAAAA;
}

#galleries-main input {
  font-family: 'Myriad Pro', sans-serif;
  color: #3B7743;
  background-color: white;
}

#galleries-main div {
  float: left;
  width: 250;
  margin: 2px;
/* border: 1px solid #00FF00; */
}

.dramatis { 
  font-family: 'Minion Pro', 'Palatino', serif;
  text-align: left;
}

.dramatis-sans {
  font-family: 'Myriad Pro', sans-serif;
}

.larger {
  font-size: larger;
}

.gallerylink {
/*  border: 1px solid #FF0000; */
  text-align: center;
/*  width: 250;*/
}