/* CSS Document */
/* This CSS creates horizontal navigation, text area, sidebar, and footer navigation.*/

/* Hides the skip navigation link from browsers that support CSS. Will be visible to devices that don't, such as screen readers, PDAs, cell phones. */
.hide{
	display: none;
}

/* Establishes basic styles such as font type and size. These can be changed in other sections by writing new styles for font type and size. Otherwise, the other sections will inherit the styles established here. Also provides a background image and position, and background color. */
body {
	background-color: #b6b3b0;
	font-family: Geneva, Verdana, Helvetica, Arial, sans-serif;
	font-size: 0.8em;
	line-height: 1.5em;
/*	background-attachment: fixed;
	background-image: url(../images/bgDiagStripe10pxtexGr.gif);
	background-repeat: repeat;*/
	background-position: left top;
	background-repeat: repeat-x;
	background-image: url(../images/greygradW.gif);
/*	background-image: url(../images/diagonalstripes.gif);
	background-repeat: repeat;*/
	margin: 0px;
	padding: 0px;
	color: #333333;
}

/* The container encloses the header, the navigation bar, maincontent, newsbox, and footer. The width is a fixed size of 800px; the right and left margins of auto center the container.*/
#container {
	padding: 0px;
	width: 800px;
	margin-top: 0px;
	margin-bottom: 10px;
	margin-right: auto;
	margin-left: auto;
	background-color: #ffffec; /* off white */
	border: 1px solid #999999;

}

/* Header section contains the logo. It has a fixed size of 800px. */
#header {
	margin: 0px;
	padding: 0px;
	width: 800px;
	height: 160px;
	background-color: #FFFFEC;
	background-repeat: no-repeat;
	background-image: url(../images/logow.gif);
	background-position: 15px 5px;	
	position: relative;
}

#header h1 {
	display: none;
	}
	
#header p {
	position: absolute;
	left: 580px;
	top: 115px;
}

#header a{
	color: #0D7787;
	font-size: 0.9em;
	font-weight: bold;
	text-decoration: none;
	border-bottom: dotted 1px #0d7787;
	}

#header a:hover{
	color: #790f0f;
	font-weight: bold;
	text-decoration: none;
	text-decoration: underline;
	border-bottom: none;
}

/* Start Navigation bar styles */
#nav {

}

/* Gives the horizontal navigation bar a fixed width.  */
#nav ul {
	margin: 0px;
	padding: 0px;
	width: 800px;
	float: left;
	clear: left;
	background-color: #8FB27C;
}

/* Establishes width for buttons. The buttons sit side by side, rather than vertically, because each button is floated left. List style type gets rid of list bullets */
#nav li {
	list-style-type: none;
	float: left;
	padding: 0px;
	text-align: center;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;	
}




/* The following styles give the navigation buttons their color, font color, border, border color, and size. The text decoration gets rid of the underline that browsers apply to links by default. .*/
#nav a {
	display: block;
	font-weight: bold;
	font-size: 0.85em;
	line-height: 1.5em;
	text-decoration: none;
	color: #000000;
	background-color: #8FB27C;
	white-space: nowrap;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #999999;
	border-right-color: #666666;
	border-bottom-color: #666666;
	border-left-color: #999999;
	padding-right: 0.5em;
	padding-left: 0.5em;
	}


/* The following styles provide a rollover effect for the navigation buttons when the user's pointer rests on the button. Gives feedback to the user and lets her know she can click the button. */
#nav a:hover {
	color: #FFFFFF;

	
	border-top-color: #666666;
	border-right-color: #999999;
	border-bottom-color: #999999;
	border-left-color: #666666;
}

#home #nav .home a,
#about #nav .about a,
#archive #nav .archive a,
#board #nav .board a,
#chronicles #nav .chronicles a,
#committee #nav .committee a,
#contact #nav .contact a,
#meetings #nav .meetings a,
#policy #nav .policy a,
#resources #nav .resources a,
#accord #nav .accord a,
#support #nav .support a,
#events #nav .events a,
#account #nav .account a
{
	background-color: #4a6e42;
	color: #ffffec;
	cursor: default;

}


/* Styles for maincontent which contains the main text on each page.*/
#maincontent {
	width: 500px;
	float: left;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 0.5em;
	border-top-width: 0px;
	border-right-width: 1px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #999999;
	border-right-color: #999999;
	border-bottom-color: #999999;
	border-left-color: #999999;
	margin-top: 0em;
	margin-left: 0px;
	margin-bottom: 0em;
	background-color: #f3ffe7; /* very light green */
}

/* Style for Mission statement. */
#mission {
	width: 400px;
	border: 1px solid #999999;
	padding: 10px;
	/*background-color: #f08e76;*/
	background-color: #FCD2BE;
}

/* heading styles */
#maincontent h1 {
	color: #6d2429;
	color: #444;
	line-height: 1.3em;
	margin-bottom: 0;
	font-size: 1.7em;
	font-family: didot, palatino, georgia;
	font-weight: normal;
}

#maincontent h2{
	margin-bottom: 0.2em;
	margin-top: .5em;
	color: #658454;
	color: #749860; /* green */
	color: #384a2e;
	color: #555;
	font-size: 1.5em;
	padding: 0px;
	font-family: didot, palatino, georgia;
	font-weight: normal;
}

#maincontent h3{
	margin-bottom: 0.1em;
	margin-top: 0.5em;
	padding: 0px;
	/*color: #224b79;*/
	/*color: #4c643f;*/
	color: #121212;
	font-family: didot, palatino, georgia;
	font-size: 1.3em;
	font-weight: normal;
}

#maincontent h4 {
	margin-bottom: 0.1em;
	margin-top: 0;
	padding: 0px;
	color: #4A7AAA;
	color: #749860;
	font-size: 1.1em;
	font-family: didot, palatino, georgia;
	color: #333333;
	font-weight: normal;
}


/* No top margin means the paragraph will be right under the heading. A bottom margin provides a gap between the last line of the paragraph and any subsequent content. */
#maincontent p{
	margin-top: 0px;
	margin-bottom: 1.5em;
	margin-left: 1em;
	margin-right: 1em;
}

.burgundy {
	font-weight: bold;
	color: #6d2429;
}

#maincontent .bigType {
	font-size: 1.3em;
	}

#maincontent .inset{
	margin-left: 2em;
	}

/* Styles for links within the content section */
#maincontent a{
	color: #0D7787;
	font-size: 0.9em;
	font-weight: bold;
	text-decoration: none;
	border-bottom: dotted 1px #0d7787;
	}

#maincontent a:hover{
	color: #790f0f;
	font-weight: bold;
	text-decoration: none;
	text-decoration: underline;
	border-bottom: none;
}

/* Style for any list in the maincontent. */
#maincontent li {
	list-style-type: none;
	list-style-image: url(../images/bullet4.gif);

}

/* Styles for table cells and table headings on Meetings page. */
#maincontent td {	
	vertical-align: top;
}

#maincontent td h1 {
	font-size: 1.5em;
	color: #4c643f;
	font-family: didot, palatino, georgia;
	margin-top: 0;
	margin-bottom: .2em;
	}
	
#maincontent td h2 {
	font-size: 1.4em;
	color: #4c643f;
	font-family: didot, palatino, georgia;
	margin-top: 0;
	margin-bottom: .2em;
	}

#maincontent td h3{
	margin-top: 0px;
	margin-bottom: 0.5em;
	color: #002c5d; /* dk. blue */
	color: #384a2e;
	color: #749860;
	color: #8A3D42;
	font-family: didot, palatino, georgia;
	font-size: 1.2em;
}

#maincontent td h4{
	margin: 0px;
	color: #454545;
	font-size: 1.05em;
	font-family: didot, palatino, georgia;
}

/* Style for location information for Educational Forums on Meetings page. */	
.location {
	font-size: 0.8em;
	color: #000000;
	line-height: 1.1em;
}

/* Puts a dark grey border around any image in the maincontent area. */
#maincontent img {
	border: 1px solid #333;
	/*background-color: #0c4e81; blue */
	/*background-color: #8a3d42;*/
	/*padding: 0.3em;*/
	margin: .5em;
}

/* The following styles are for images and captions in the maincontent div.*/
/* This style will place an image on the right side of the maincontent area. The text will flow around it. The margins put space between the image and the text. The image should be no wider than 455px for the maincontent area. Text will not flow around an image that big. Better width is 250-300px.  This style should be wrapped around both the image and the caption that goes with it. The caption will be the same width. */
#maincontent .imageRight {
	float: right;
	margin-bottom: .3em;
	margin-left: 10px;
	margin-top: .3em;
}

/* Puts a background behind photo and caption */
#maincontent .imageRightBG {
	width: 275px;
	float: right;
	margin-bottom: .3em;
	margin-left: 10px;
	margin-top: .3em;
	/*background-color: #EBEBEB;*/
	background-color: #DBE9D6;
	border: 1px solid #999999;
}


/* This style will place an image on the left side of the maincontent area. The text will flow around it. The margins put space between the image and the text. The image should be no wider than 455px for the maincontent area. Text will not flow around an image that big. Better width is 250-300px.  This style should be wrapped around both the image and the caption that goes with it. The caption will be the same width. */
#maincontent .imageLeft {
	float: left;
	margin-bottom: .3em;
	margin-right: 10px;
	margin-top: .3em;
}

/* CHF logo on bottom of each page */
#maincontent #center {
	border: 0px;
	display: block;
	height: 127px;
	width: 200px;
	margin-left: 140px;
}

#maincontent #pcenter{
	display: block;
	margin-left: 155px;
	color:#999999;
	font-size: 0.9em;
}

/*Styles for link to go to the Top of the page */
.pageTop a{
	color: #4c5ad7;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	margin-left: 0;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #4c5ad7;
}

.pageTop a:hover{
	color: #790f0f;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: underline;
	border-bottom-width: 0;
}



/*Styles for newsbox */
/* Use the newsbox for freuqent updates, current events, and breaking news. */
#newsbox{
	margin-top: 3em;
	margin-bottom: 1.5em;
	margin-left: 545px;
	margin-right: auto;
	width: 240px;
	/*font-size: .85em;*/
	line-height: 1.3em;
	
}

#newsbox h1{
	font-size: 1.5em;
	line-height: 1.3em;
	font-family: didot, palatino, georgia;
	margin-top: 3em;
	margin-left: 0.15em;
	color: #6d2429;
	font-weight: normal;
}

#newsbox h2 {
	font-size: 1.3em;
	color: #384a2e;
	color: #444;
	font-family: didot, palatino, georgia;
	margin-top: .7em;
	margin-bottom: 0;
	font-weight: normal;
}

#newsbox h3 {
	font-size: 1.15em;
	color: #384a2e;
	color: #666;
	font-family: didot, palatino, georgia;
	margin-top: .5em;
	margin-bottom: 0;
	margin-left: .5em;
	font-weight: normal;
}

#newsbox p{
	margin-left: 1em;
	margin-top: .5em;
	margin-bottom: 1em;
	line-height: 1.4em;
	/*font-size: 1.2em;*/
	font-family: arial narrow, franklin gothic medium cond;
}

#newsbox li{
	margin-bottom: .75em;
	font-family: arial narrow, franklin gothic medium cond;
}

/*Styles for links in the News box */
#newsbox a{
	color: #0D7787;
	font-weight: bold;
	text-decoration: none;
	font-family: arial narrow, franklin gothic medium cond;
	border-bottom: dotted 1px #0d7787;
}

#newsbox a:hover{
	color: #790f0f;
	font-weight: bold;
	/*text-transform: uppercase;*/
	text-decoration: underline;
	border-bottom: none;
}

#newsbox a img {
	color: #ffffec;
	border: none;
}

#newsbox a:hover img {
	color: #ffffec;
}

#newsbox ol {
	font-family: arial narrow, franklin gothic medium cond;
	font-size: 1.2em;
	}

/* Puts a dark grey border around the background color behind images in the maincontent area. */
#newsbox img {
	/*border: 1px solid #000000;*/
	/*background-color: #0c4e81;*/ /* blue */
	/*background-color: #8a3d42;*/
	/*padding: 0.2em;*/
}


/* The following styles are for images and captions in the newsbox area. */
/* This style will place an image on the right side of the newsbox area. The text will flow around it. The margins put space between the image and the text.  The image should be no wider than 225px for the newsbox area. Text will not flow around an image that big. Better width is 100-150px. This style should be wrapped around both an image and the caption that goes with it. The caption will be the same width. */

#newsbox .imageRight {
	float: right;
	margin-bottom: .3em;
	margin-left: 10px;
	margin-top: .3em;
}

/* This style will place an image on the left side of the newsbox area. The text will flow around it. The margins put space between the image and the text.  The image should be no wider than 225px for the newsbox area. Text will not flow around an image that big. Better width is 100-150px. This style should be wrapped around both an image and the caption that goes with it. The caption will be the same width. */

#newsbox .imageLeft {
	float: left;
	margin-bottom: .3em;
	margin-right: 10px;
	margin-top: .3em;
}

#newsbox #donate {
	color: #ffffec;
	}
	
#newsbox a#donate {
	border-bottom: none;
}
	
#newsbox #orangebox {
	width: 220px;
	background-color: #FCD2BE;
	padding: 5px;
	border: solid 1px #999999;
	margin-bottom: 1em;
	}
	
#newsbox #greybox {
	width: 220px;
	background-color: #CCC;
	padding: 5px;
	border: solid 1px #999999;
	}
	
#newsbox .notice {
	width: 239px;
	background-color: #98BBE8;
	border: solid 1px #666666;
	padding: 0.1px 5px;
	}
	
form {
	margin-bottom: 1.5em;
	}


/* Styles for footer */
#footer {
	clear: both;
	width: 800px;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #666666;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #666666;	
	height: 220px;
	/*background-color: #FFFFEC;*/ /* off white color */
	background-color: #749860;
}

#footer-inner {
	margin-left: 130px;
}

#footer p{
	text-align: center;
	margin-top: 0px;
	margin-bottom: 0px;
}

#footer #action, #footer #people, #footer #coalition {
	width: 200px;
	float: left;
	height: 180px;
}

#footer h2 {
	font-size: 1.1em;
	margin-bottom: .3em;
	margin-left: .75em;
}

#footer ul {
	list-style-type: none;
	padding-left: 20px;
	margin-top: .3em;
}

#footer li {
	list-style-type: none;
}

#footer a{
	color: #222;
	font-size: .8em;
	font-weight: bold;
	text-decoration: none;
	border-bottom: dotted 1px #222;
	line-height: 2em;
	
}
#footer a:hover {
	color: #222;
	font-weight: bold;
	text-decoration: underline;
	border-bottom: none;
}

#footer #email{
	border: 0px none;
	font-size: 1em;
	line-height: 2em;

}

.clear-both {
	clear: both;
}