/* 
*   Coded by Jeremy Caldwell of Eternalistic Designs (www.eternalistic.net)
*/

/* Font Size Percentages
----------------------------------------------- */ 
/*

Based on the YUI font sizing chart

9px	69%
10px	77%
11px	85%
12px	93%
13px	100%
14px	108%
15px	116%
16px	123.1%
17px	131%
18px	138.5%
19px	146.5%
20px	153.9%
21px	161.6%
22px	167%
23px	174%
24px	182%
25px	189%
26px	192%

*/


/* LAYOUT
----------------------------------------------- */

html {
  background: url(../images/bg.jpg) repeat;
  color: #46351c;
}

body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-weight: normal;
  line-height: 160%
}

#wrapper {
  border-top: 7px solid #46351c;
  margin: 0 auto;
  padding: 0;
  width: 735px;
}


/* TYPOGRAPHY
----------------------------------------------- */

p {
  font-size: 93%; /* 12px */
  line-height: 146.5%;
  margin: 5px 0 10px 0;
  
}

h1 {
  color: #a92608;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 167%; /* 22px */
  font-weight: bold;
  margin: 10px 0 5px 0;
  line-height: 26px;
}

h2 {
  color: #233a40;
  font-size: 108%; /* 14px */
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 0 0 10px 0;
}

#sidebar h2 {
  color: #eadbb7;
  margin: -30px 0 0 0;
  border-bottom: 1px solid #a92608;
}

#sidebar h4 {
  color: #eadbb7;
  margin: -30px 0 0 0;
font-family: Arial, Helvetica, sans-serif;
}

#sidebar h3 {
  color: #eadbb7;
  border-bottom: 1px solid #a92608;
  font-size: 108%; /* 14px */
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 15px 0 10px 0;
}
#sidebar p {
	color: #fff;
	line-height: 123.1%;
}
#sidebar p a {
	color: #000;
}

h3 {
  color: #326f6e;
  font-size: 123.1%; /* 16px */
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 0 0 .25em 0;
}

h4 {
  color: #fff;
  font-size: 14px; 
  font-weight: bold;
  margin: -15px 0 15px 0;
}

ul,
ol {
  margin: 0 0 1em 30px;
}

ul li,
ol li {
  font-size: 93%; /* 12px */
  line-height: 138.5%;
  list-style: disc;
  padding: 0 0 3px 0;
}

ol li {
  list-style: decimal;
}

ul li li,
ol li li {
  font-size: 93%;
}

img {
  border: none;
}

a {
  color: #326f6e;
}

a:hover {
  color: #a92608;
}

em {
  font-style:italic;
}

strong {
  font-weight: bold;
}


/* HEADER
----------------------------------------------- */

#header {
}

#header-wrapper {
  display: block;
  height: 190px;
  overflow: hidden;
}

#header-left {
  /*background: #fff url(../images/header-left.jpg) no-repeat;*/
  display: block;
  float: left;
  height: 190px;
  width: 218px;
}

#header-right {
  float: left;
}

#header-bottom {
  background: #892104 url(../images/restoreandprotect.jpg) no-repeat;
  display: block;
  height: 61px;
}


/* CONTENT AREA
----------------------------------------------- */

#content-top {
  background: url(../images/content-top.jpg) no-repeat;
  display: block;
  height: 40px;
}

.fullwidth #content-top {
  background: url(../images/content-top-full.jpg) no-repeat;
  height: 10px;
  }

#main {
  background: url(../images/main-bg.jpg) repeat-y;
  padding: 0 0 10px 0;
}
.fullwidth #main {
  background: #EBDBB7;
  padding: 0;
}

#main-wrapper {
  padding: 0 0 0 20px;
}

.fullwidth #main-wrapper {
  padding: 0;

}

#content {
  float: left;
  width: 470px;
}
.fullwidth #content {
  float: none;
  width: 695px;
}
.redrule {
	border-bottom: 1px solid #a92608;
	margin: 15px 0 15px 0;
}


/* SIDEBAR
----------------------------------------------- */

#sidebar {
  background: url(../images/sidebar-bg.jpg) repeat-x;
  float: left;
  margin: 0 0 0 20px;
  min-height: 300px;
  width: 225px;
}

#sidebar-wrapper {
  padding: 15px;
}

#sidebar ul {
  margin-top: 10px;
}

#sidebar ul li {
  color: #a92608;
}

#sidebar a {
  color: #fff;
  text-decoration: none;
}

#sidebar a:hover {
  color: #fff;
  text-decoration: underline;
}


/* FOOTER
----------------------------------------------- */

#footer {
  background: #121212;
  border-top: 7px solid #46351c;
}

#footer-wrapper {
  color: #fff;
  padding: 10px;
}

#footer p {
	font-size: 77%;
	margin: 0 0 5px 10px;
}
#footer a {
	color: #b8c9c9;
	text-decoration: none;
}
#footer a:hover {
	text-decoration: underline;
}

/* PRIMARY MENU
----------------------------------------------- */

#navigation {
  background: url(../images/primary-menu-bg.jpg) repeat;
  height: 36px;
}

#primary-menu {
  margin: 0;
  padding: 0;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
}

#primary-menu ul.menu {
  margin: 0;
  padding: 0;
  /*opacity: .9;
  filter: alpha(opacity:90);*/
}

#primary-menu ul.menu li {                        /* top item layout */
  display: block;
  float: left;
  font-size: 93%;
  line-height: 36px;
}

#primary-menu ul.menu li a {
  color: #fff;
  display: block;
  margin: 0;
  padding: 0 9px 0 9px;
  text-decoration: none;
}

#primary-menu ul.menu li.first a {
  padding-left: 9px;
}

#primary-menu ul.menu li.last a {
  padding-right: 5px;
}

#primary-menu ul.menu li a:hover,
#primary-menu ul.menu li a.active {
  background: #396A69;
  color: #fff;
}

#primary-menu ul.menu li a.active {
  color: #fff;
}

/* Second level menu */
#primary-menu ul.menu li ul.menu {
  left: -999em;
  position: absolute;
  width: 175px;
}

#primary-menu ul.menu li:hover ul,  
#primary-menu ul.menu li.hover ul {
  display: block;
  left: auto;
}
  
#primary-menu ul.menu li ul li {
  border-top: 1px solid #ccc;
  float: left;
  font-size: 93%;
  height: auto;
  margin: 0;
  padding: 0;
  width: 175px;
  line-height: 125%;  
}

#primary-menu ul.menu li ul {
  background: #396A69;
  margin-left: 0;  
  padding: 0;
  width: 175px;
}
  
#primary-menu ul.menu li ul.menu li a {
  display: block;
  font-weight: normal;
  margin: 0;
  padding: 5px 5px 5px 10px;
}

#primary-menu ul.menu li ul.menu li a:hover {
  background: #849995;
  color: #000;
}

#primary-menu ul.menu li.expanded:hover a,
#primary-menu ul.menu li.expanded.hover a {
  background:  #396A69;
  color: #fff;
}

/* IMAGE FLOATS
----------------------------------------------- */
.floatleft {
	float: left;
	padding: 0 10px 5px 0;
}
.floatright {
	float: right;
	padding: 0 0 10px 10px;
}


/* CLEARFIX
----------------------------------------------- */

.clearfix:after {                                 /* add .clearfix class to clear floats after an element */
  clear: both;                                    /* (IE version is in ie6-fixes.css) */
  content: "."; 
  display: block; 
  font-size: 0;
  height: 0; 
  visibility: hidden;
}


/* FORM FIELDS 
----------------------------------------------- */

label {
	font-size: 85%;
}