/*--------------------------------------------------------------
 * HTML tags
 *------------------------------------------------------------*/

body {
  background-color: #caac6f;
  text-align    : center;
  padding       : 0;
  margin        : 0;
  }
a, a:active {
  text-decoration: none;
  color         : #ff9;
  }
a:visited {
  text-decoration: none;
  color         : #ff9;
  }
a:hover {
  color         : #fff;
  text-decoration: underline;
  }

p, pre, dl, ul, label, input, .link { font-size: 80%; }
td { font-size  : 75%; }
h3 {
  font-size     : 100%;
  color         : #554;
  }
h4 {
  font-size     : 85%;
  margin-bottom : 0;
  color         : #330;
  }
h5 { margin-bottom: 0; }

dt {
  font-weight   : bolder;
  font-style    : italic;
  color         : #;
  }
dd {
  margin-left   : 2em;
  }
img {
  border        : 0;
  }
li:first-child {
  margin-top    : -0.5em;
  }

/*--------------------------------------------------------------
 * Thanks to www.alistapart.com/articles/footers for this
 * technique to extend the container to the viewport's bottom
 *------------------------------------------------------------*/
/* height: auto;  So IE plays nice */
/***
html, body {
  height        : 100%;
  }
html>body #container {
  height        : auto;
  }
#container {
  position      : relative;
  min-height    : 100%;
  }
***/

/*--------------------------------------------------------------
 * Major section elements
 *------------------------------------------------------------*/

#container {
  overflow      : hidden;
  width         : 47.5em;
  margin        : 0 auto;
  padding       : 0 0 0.75em 0;
  border-left   : 0.0625em solid #030;
  border-right  : 0.0625em solid #030;
  border-bottom : 0.0625em solid #030;
  font-family   : verdana,helvetica,sans-serif;
  text-align    : left;
  line-height   : 1.5;
  color         : #000;
  background-color: #ba9c5f;
}
/* from www.alistapart.com/articles/holygrail */
#container .column {
  padding-bottom: 400em;  /* X + padding-bottom */
  margin-bottom : -400em;  /* X */
}

#banner {
  float         : right;
  height        : 6.375em;
  }
#banner img { width: 37.5em; }

#content {
  float         : right;
  width         : 33.5em;
  border-left   : 10em solid #ba9c5f;
  margin        : 0 2em 0 -8em;
  background-color: #ba9c5f;
}

#nav {
  float         : right;
  width         : 10em;
  margin-top    : -6.375em;
  background    : url('img/menubox-bg.png');
  background-repeat: repeat-y;
  line-height   : 1.25;
  text-align    : left;
  }
.menu {
  padding         : 0.25em 1em 0.25em 0.75em;
  margin          : 0 0.75em 0 1.25em;
  border-bottom : 0.16em solid #242203;
  font-size     : 75%;
  font-weight   : bolder;
  text-align    : center;
  color         : #fff;
  }
.menu a, .menu a:active, .menu a:visited {
  color         : #ff9;
  }
.menu a:hover {
  color         : #ffc;
  text-decoration: underline;
  font-style    : italic;
  }

/*-------------------------------------------------------
 * Other elements
 *-----------------------------------------------------*/

.img400  { width: 25em; }
.caption {
  float         : right;
  width         : 10em;
  font-size     : 75%;
  }

.oneline { margin-top: 0.5em; margin-bottom: 0; }  /*for customized <p>*/
.top     { font-size: %; }

/*-----------------------------------------------------*/