/* ZERO OUT GLOBAL ELEMENTS --------------------------------- */
/* --------------------------------------------------------- */

body, h1, h2, h3, h4, p, li, ul {
  margin: 0px; /* Removes default margin that some browsers add. */
  padding: 0px; /* Removes default padding that some browsers add. */
}

/* SET THE BODY STYLES ------------------------------------- */
/* --------------------------------------------------------- */

body {
	color: #333333; /* Sets the background image to tile across the x axis of the page. Also sets the background color in case images are turned off or are unavailable. */
	text-align: center; /* Centers the page in various versions of WinIE5. */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 95%;
	background-color: #9C6D40;
	background-image: url(body_bg.jpg);
	background-repeat: repeat-x;
}


a:link {
	color: #9F531F;
}
a:visited {
	color: #9F531F;
}
a:hover {
	color: #43302D;
}
a:active {
	color: #9F531F;
}

.more {
	padding-top: 10px;
}

#wrapper {
  text-align: left; /* Resets the text alignment to left to override what was set for versions of WinIE5. */
  margin: 0px auto; /* Centers the content of the page within the window in all but versions of WinIE5. */
  width: 750px; /* Sets the overall width of the layout. */
}

/* STYLE THE HEADER DIV ------------------------------------ */
/* --------------------------------------------------------- */

#header {
	height: 262px; /* Sets the height of the header to the same height as the background image. */
	background-repeat: no-repeat;
	background-position: center top;
}

/* STYLE THE INNER WRAPPER THAT HOLDS THE COLUMNS ---------- */
/* --------------------------------------------------------- */

#innerwrapper {
	float: left; /* Floating all columns and their container helps avoid IE bugs.*/
	width: 750px; /* This odd padding is added to the top and bottom of the DIV to avoid the escaping margin effect. */
	background-color: #FFFFFF;
	background-image: url(div_content_bg.jpg);
	padding-top: 1px;
	padding-right: 0px;
	padding-bottom: 1px;
	padding-left: 0px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
}

/* STYLE THE CONTENT COLUMN --------------------------------- */
/* --------------------------------------------------------- */

#content {
	float: left; /* Floats the content DIV to the left of the layout. */
	width: 530px; /* Sets the width of the content column to 420 pixels. */
	background-color: #FFFFFF;
}
#content h1 {
	font-size: 120%;
	font-weight: bold;
	margin-top: 20px;
	margin-right: 10px;
	margin-left: 20px;
	color: #9F531F;
	margin-bottom: -10px;
}



#content p {
  font-size: 85%;  /* Sets the font size to 85% of the user's browser preference, */
  margin-top: 15px; /* Places 5 pixels of margin above content paragraphs. */
  margin-right: 20px; /* Places 10 pixels of space between the right edge of the content paragraphs and the right edge of the container. */
  margin-left: 20px; /* Places 20 pixels of space between the left edge of the content paragraphs and the left edge of the container. */
  line-height: 140%; /* Opens up the spacing (leading) between lines of text. */
}


.members {
	padding-left: 0px;
	margin-left: 50px;
	margin-top: 10px;
}

.membersheader {
	font-size: 110%;
	font-weight: bold;
	margin-top: 20px;
	margin-right: 10px;
	margin-left: 15px;
	color: #9F531F;
	background-color: #F0E0C1;
	width: 85%;
	padding-left: 5px;
}

.members td {
	line-height: 120%; /* Opens up the spacing (leading) between lines of text. */
	vertical-align: top;
	font-size: 85%;
}

.rule {
	background-image:  url(rule.jpg);
	background-repeat: repeat-x;
	background-position: 0% 50%;
	height: 5px;
}

.bullet {
	background-image:  url(bullet.jpg);
	background-repeat: no-repeat;
	background-position: 0% 50%;
}

.first {
	font-size: 90%;
	font-weight: bold;
	color: #9F531F;
}

#content ul {
	font-size: 85%;
	margin-top: 20px;
	margin-right: 10px;
	margin-left: 20px;
	line-height: 140%;
	padding-left: 35px;
	padding-right: 20px;
}

#sidebar {
	float: left; /* Floats the sidebar to the left within its container. */
	width: 220px; /* Sets the width of the sidebar to 200 pixels. */
	background-color: #F0E0C1;
}

#sidebar h2 {
	font-size: 90%;  /* Sets the font size to 100% of the user's browser preference, */
	font-weight: bold; /* Removes the default bolding that the browser puts on heading text. */
	margin-top: 5px; /* Adds 20 pixels of top margin so that the baseline of the  sidebar h2 text starts at the baseline of the Welcome image. */
	margin-right: 15px; /* Adds some space on the right of the h2 to make sure it doesn't touch the edge of the container. */
	margin-left: 15px; /* Adds some space on the left of the h2 to make sure it doesn't touch the left edge of the container. */
	color: #9F531F;
}

#sidebar p {
	font-size: 80%;  /* Sets the font size to 80% of the user's browser preference, */
	margin-top: 5px; /* Adds top margin to the paragraph text so that the baseline of the first line is even with the first line of text in the first content paragraph. */
	margin-right: 15px; /* Adds some space on the right of the h2 to make sure it doesn't touch the edge of the container. */
	margin-left: 15px; /* Adds some space on the left of the h2 to make sure it doesn't touch the left edge of the container.*/
	  line-height: 140%; /* Opens up the spacing (leading) between lines of text. */
}


#footer {
	width: 750px;
	height: 63px; /* Sets a height that equals the height of the background image. */
	background-image: url(div_footer.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}
#footer p {
	font-size: 70%;  /* Sets the font size to 70% of the user's browser preference, */
	text-align: left; /* Aligns footer paragraph text in the center of the DIV. */
	padding-top: 37px; /* Pads the footer paragraph text so that it starts in the soft, rounded, green rectangle. */
	color: #FFFFFF;
	margin-left: 20px;
}

/* CLASSES FOR IMAGES AND CLEARING FLOATS -------- */
/* --------------------------------------------------------- */


.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	font-size: 1px; /* Sets the font size to 1 pixel */
	line-height: 0px; /* Sets line-height to 0 -font and line-height, even if not explicitly on the page, might add diemnsion to the clearing element rather than make it larely invisible */
	clear: both; /* Keeps floated divs from draping over objects beneath them. */
	height: 0px; /* Makes sure the clearing element has no height */
}