@charset "utf-8";
/* CSS Document */

html {font-size: 125%;}
body {margin: 0; padding: 0; background: rgb(181,170,142); font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; color: rgb(0,0,0); font-size:50%;}
html>/**/body {overflow-y: scroll;}
div#wrapper {position: relative; width: 800px; margin: 10px auto 0 auto; padding: 0; background: rgb(255,255,255);}

/* Header */
div#header {margin: 0; padding: 0; width: 100%; background: url(../images/header-bg.jpg) right top no-repeat;}
#header img {border: none;}

div#page {margin: 0; padding: 0; width: 800px; background-color: rgb(255,255,255);}

ul#nav, ul#nav ul {
  float: left;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Site Navigation */
ul#nav {background-color: rgb(114,92,39); width: 100%;}
ul#nav li {display: block; width: 120px; float: left; overflow: hidden; font-size:1.3em;}
ul#nav li a {display: block; width: 120px; height: 20px; line-height: 20px; text-align: center; padding: 2px 0;}
ul#nav li ul {position: absolute; left: -999em; z-index: 2; width: 128px; font-size: 75%;}
ul#nav li:hover ul, ul#nav li.sfhover ul {left: auto;}

/* Inactive menu items */
ul#nav li a, li.active ul li a {text-decoration: none; font-weight: normal; color: white; background-color: rgb(114,92,39);}

/* Hovering menu items */
ul#nav li a:hover, ul#nav li ul a:hover {color: white; background-color: rgb(181,170,142);}

/* Active menu items */
ul#nav a.active {font-weight: bold;}

div#text {margin: 0; padding: 0; float: left; width: 380px;}
#text h1 {margin: 10px 0 10px 30px; padding: 0; font-family:"Times New Roman", Times, serif; font-size: 2em; color: rgb(114,92,39); font-weight: normal;}
#text h2 {margin: 10px 0 0 30px; padding: 0; font-size: 1.3em; color: rgb(0,0,0); font-weight: bold;}
#text p {margin: 0 25px 10px 30px; padding: 0; font-size: 1.2em; line-height: 1.3em;}
#text a {text-decoration: none; color: rgb(114,92,39);}
#text a:hover {text-decoration: underline; color: rgb(181,170,142);}

span.bigfont {font-size: 120%; font-weight: bold;}

div#images {margin: 0; padding: 0; float: right; width: 420px; font-size: 1.2em; text-align: right;}
table.images {margin: 4px 0 0 3px; padding: 0; width: 417px;}
table.text {margin: 5px 0 5px 3px; padding: 0; width: 417px;}
#images img {border: none;}

/* Footer */
div#footer {margin: 0; padding: 4px 0 4px 30px; clear: both; background-color: rgb(114,92,39); color: rgb(255,255,255); font-size:1.3em;}
/* Hide from IE5/Mac \*/
*html div#footer {height: 1%;}
/* End hide from IE5/Mac */
#footer a {font-weight: bold; text-decoration:none; color: rgb(255,255,255);}

 /* here follows the brillant "no-extra-markup" clearing method devised by Tony Aslett - www.csscreator.com */
/* simply add the clearfix class to any containter that must enclose floated elements */
/* read the details of how and why this works at http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {

    content: ".";              /* the period is placed on the page as the last thing before the div closes */
	display: block;          /* inline elements don't respond to the clear property */ 
    height: 0;                  /* ensure the period is not visible */
    clear: both;               /* make the container clear the period */
    visibility: hidden;	     /* further ensures the period is not visible */
}

.clearfix {display: inline-block;}   /* a fix for IE Mac */

/* next a fix for the Guillotine bug in IE6 */
* html .clearfix {height: 1%;}
.clearfix {display: block;}