/* 
   The 'Echoes' design is based on the CSS Zen Garden's
   (http://www.csszengarden.com/) 'Bamboo' design by Giuseppe
   Benvenutoi, which was in turn based on the 'Tranquille' design
   by Dave Shea.  This design is the joint effort of Jeremy Green
   and Guy Antony Halse.

   All sizing in ems except where image sizes dictate pixels
*/ 
/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/  */

body { 
  font-family: "Trebuchet MS", "Lucida Sans Unicode", Verdana, Georgia, sans-serif;
  font-size: small;
  line-height: 1.1em;
  background: url(/images/fixed) 1.5em 19px no-repeat fixed #bec2b4; /* fix horiz position */
  color: black;
  margin: 0em;
  padding: 0em;
}

h1, h2, h3, h4 {
  color: #0c3103;
  background-color: inherit;
  text-transform: uppercase;
}

h1 {
  font-size: 1.3em; 
}

h2 {
  font-size: 1.2em; 
}

h3 {
  font-size: 1.1em; 
}

a { 
  text-decoration: none; 
  font-weight: bold;
  color: #334c3f;
  background-color: inherit;
}

a:hover {
  text-decoration: underline; 
  color: #707c51;
  background-color: inherit;
}

/*---divs---*/

div {
  margin: 0em;
  padding: 0em;
}

#container { 
  margin-top: 1.5em;
  margin-left: 126px; /* width of left image */
  width: 65em;
  text-align: left;
  background: url(/images/container.png) 12em 0em repeat-y #eef0e3;
  color: inherit;
}

#pageheader h1 {
  margin: 0em;
  padding: 0em;
  background: url(/images/header) right top repeat-x;
  height: 180px; /* height of header image */
}

#pageheader h1 span {
  display:none;
}

#navigation {
  padding-left: 1em;
  background:url(/images/navigation) repeat-x top left;
  width: 11em;
  float: left;
}

#navigation ul {
  list-style: none;
  padding: 0em;
  margin-left: 0em;
}

#navigation li {
  padding-left: 0em;
  padding-bottom: 0.5em;
  font-size: 1.2em;
}

#footer {
  margin-top: 1em;
  height: 40px; /* height of footer image */
  background:url(/images/footer-alt2) right top repeat-x;
  width: 100%;
}

#content {
  padding-left: 1em;
  padding-right: 1em;
  background: url(/images/content) left top repeat-x transparent;
  width: 51em;
  float: right;
}

#bits {
  background: #bec2b4;
  color: inherit;
  width: 100%;
  padding-top: 0.4em;
}

#bits .right {
  text-align: right;
  float: right;
  background: #bec2b4;
  color: inherit;
}

#bits .left {
  text-align: left;
  float: left;
  font-size: xx-small;
  background: #bec2b4;
  color: inherit;
}

h1.topheader {
  /* this fits in a fixed height image, so absolute sizing is necessary */
  color: white;
  background: transparent;
  margin-bottom: 10px;
  padding-left: 0px;
  margin-top: 15px;
  text-transform: none;
  font-size: 17px;
  font-family: "Arial",  "Trebuchet MS", "Lucida Sans Unicode", Verdana, Georgia, sans-serif;

}

iframe.livejournal {
  border: 0em;
  padding: 0em;
  margin: 0em;
  width: 100%;
  height: 30em;
}

p.center {
  text-align: center;
}

p.center img {
  border: #bec2b4 0.1em solid;
  padding: 0.1em 0.1em 0.1em 0.1em;
}

div.imgbox {
  clear: both;
}

div.imgbox img {
  border: #bec2b4 0.1em solid;
  padding: 0.1em 0.1em 0.1em 0.1em;
  margin: 0em 1em 1em 0em;
  display: inline;
  float: left;
  clear: left;
}

div.imgbox img.right { 
  float: right;
  margin: 0em 0em 1em 1em;
}

pre.geekcode {
  text-align: center;
}

p.attribution {
  text-align: right;
  font-size: smaller;
  font-style: italic;
  margin-bottom: 1.5em;
}

#content img {
  max-width: 45em;
}