/* REMOVE AUTOMATED MARGINS AND PADDING PUT IN BY BROWSERS */
* {margin:0px; padding: 0px;}
body {  
  height:		100%; 
/* THIS CONTROLS HEIGHT OF PAGE AND COLUMNS WITHIN PAGE! */
  padding : 		0px;
  margin-left:		0px;
  font-style: 		normal;
  font-weight: 		lighter;
  font-size: 		10pt;
  line-height: 		120%;
  font-family: 		Tahoma, Arial;
  background-color:	#BABFA1;
}

/* PAGE STYLES SETS BACKGROUND OF THE PAGE TO A SPECIFC COLOR AND THE CORRESPONDING TAB TO MATCH */
body#home #links a.home {
color: #411; background: #B9C2AA;
border-right: 5px double white; border-bottom: 5px solid #B9C2AA;
} 
body#reduce {
background-color: #D8D09B;
}
body#reduce #links a.reduce {
color: #411; background: #D8D09B;
border-right: 5px double white; border-bottom: 5px solid #D8D09B;
} 

body#reuse{
background-color: #C5C8A0;
}
body#reuse #links a.reuse {
color: #411; background: #C5C8A0;
border-right: 5px double white; border-bottom: 5px solid #C5C8A0;
} 

body#respect{
background-color: #CBBB9B;
}
body#respect #links a.respect {
color: #411; background: #CBBB9B;
border-right: 5px double white; border-bottom: 5px solid #CBBB9B;
} 

body#about{
background-color: #B9C2AA;
}
body#about #links a.about {
color: #411; background: #B9C2AA;
border-right: 5px double white; border-bottom: 5px solid #B9C2AA;
} 
p {
  font-style: 		normal;
  font-weight: 		normal;
  line-height: 		120%;
  font-size: 		10pt;
}

p.quote {
  margin-left:		10px;
  padding-right: 	20px;
  font-style:		italic;
}

p.intro{
 font: 10pt Verdana, sans-serif; text-align: left; color: #411; padding-top: 10px; padding-bottom: 10px; padding-right: 15px; padding-left: 15px; 
}

/* ---------BANNER STUFF --------------------*/
div#banner {
  margin-top: 		0px;
  padding-top: 		0px;
  text-align:		center;
  line-height: 		20%;
  width: 		100%;
  height: 		105px;
  float: 		left;
 background-color:	#363;  
 /* following ling takes care of slight separation between left and right columns caused by "wrapper" div in mental IE */
 position: relative; right: 3px;

 
}

div#banner h1{
  font-size: 		20pt;
  padding-top: 		0px;
  font-style: 		Normal;
  font-family: 		"Copperplate Gothic Light", "Engravers MT", Elephant, "Times New Roman", serif;
}
div#banner p{
  text-align:		left;
  padding-top: 		0px;
  font-style: 		Normal;
  font-family: 		"Copperplate Gothic Light", "Engravers MT", Elephant, Times New Roman, serif;
 }
div#banner img{
  padding-right: 	40px;
  padding-top: 		10px;
  padding-bottom: 	10px;
  display: 		inline;
  vertical-align: 	middle;
}
/* --------- END BANNER STUFF --------------------*/

/* ------------------HORIZONTAL NAVIGATION LINKS------------------ */
div#links {position: absolute; top: 81px; left: 0px; width: 610px; padding-left: 170px; padding-bottom: 5; /*To get room under links in IE */font: 12pt Verdana, sans-serif; z-index: 100;}

div#links ul {
list-style: none;
margin: 0;
padding: 0;
}
div#links li {
display: inline;
border-bottom: 1px solid #363;
}


div#links a {display: inline; text-align: right; font: bold 1em sans-serif; 
   padding: 5px 10px 0px 5px; margin:  0px 0px 5px -5px; border-width: 0; 
   text-decoration: none; color: #FFC; background: #444;
   border-right: 5px solid #505050; border-bottom: 5px solid #444;
}

div#links a:hover.home {color: #411; background: #B9C2AA;
   border-right: 5px double white; border-bottom: 5px solid #B9C2AA;}

div#links a:hover.reduce {color: #411; background: #D8D09B;
   border-right: 5px double white; border-bottom: 5px solid #D8D09B;}

div#links a:hover.reuse {color: #411; background: #C5C8A0;
   border-right: 5px double white; border-bottom: 5px solid #C5C8A0;}

div#links a:hover.respect {color: #411; background: #CBBB9B;
   border-right: 5px double white; border-bottom: 5px solid #CBBB9B;}

div#links a:hover.about {color: #411; background: #B9C2AA;
   border-right: 5px double white; border-bottom: 5px solid #B9C2AA;}


div#links a span {display: none;}
/* ------- HORIZONTAL SPANS---------- */

div#links a:hover span#home, a:hover span#reduce, a:hover span#reuse, a:hover span#respect, a:hover span#about {
    display: block;
    position: absolute; 
    top: 25px; left: 150px; 
    width: 610px; height: 480px;
    padding-top: 60px; 
    padding-bottom: 0px; 
    margin: 0px; 
    z-index: 100;
    background-position: top center; 
    font: 24pt Verdana, sans-serif; 
    text-align: center;
}
/* ----These set the colors of the spanned background area ------ */

div#links a:hover span#home {
   background-color: #B9C2AA; 
}

div#links a:hover span#reduce { 
   background-color: #D8D09B; 
}

div#links a:hover span#reuse { 
   background-color: #C5C8A0; 
}

div#links a:hover span#respect { 
   background-color: #CBBB9B; 
}

div#links a:hover span#about { 
   background-color: #B9C2AA; 
}
  
div#links p.intro{
 font: 14pt Verdana, sans-serif; text-align: left; color: #231E14; padding-top: 60px; padding-bottom: 0px; padding-right: 30px; padding-left: 30px; 
}
/* END HORIZONTAL SPANS */



a img {height: 500px; width: 500px; border-width: 1px;}
/* END HORIZONTAL LINKS added : after "a" above */

/* --------- LEFT COL (NOTE: "rightcol" THROUGHOUT SHOULD BE "leftcol" --------------------*/


div#rightcol {
 height:100%;
  margin-left: 		0px;
  float: 		left;
  top: 			0px;
  padding-top: 		10px;
  width: 		150px;
  padding-left: 	0px;
  z-index: 		10;  
  background-color:	#363;
}


div#rightcol h3 {   
  margin-left: 		10px;
  font-style: 		italic;
  color: 		red;
  
}

div#rightcol p.warning {    
  padding-top: 		10px;
  font-style: 		italic;
  color: 		red;
  
}
/* VERTICAL LINKS */
div#rightcol h4 {
    text-align: 	right; 
 margin-top: 		10px;
  margin-left: 		0px;
font-style: 		normal;
  font-weight: 		bold;
  font-size: 		12pt;
  line-height: 		120%;
  color: 		#FFC;
padding: 		5px 15px;
}
div#rightcol ul {
list-style: none;
margin: 0;
padding: 0;
}
div#rightcol li {
border-bottom: 1px solid #363;
}
div#rightcol a { 
    display: 		block;
    text-align: 	right; 
    font: 		bold 1em sans-serif; 
    padding: 		5px 10px; 
    margin: 		0 0 1px; 
    border-width: 	0; 
    text-decoration: 	none; 
    color: 		#FFC; 
    background: 	#444;
    border-right: 	5px solid #505050;
}


div#rightcol  a:hover {
color: #411; 
background: #AAA;
border-right: 5px double white;
}



div#rightcol  a span {
display: none;
}



#rightcol ul ul {
margin-left: 12px;
}
#rightcol  ul ul li {
border-bottom: 1px solid #711515;
margin:0;
}
#rightcol ul ul a:link, #navigation ul ul a:visited {
background-color: #ED9F9F;
color: #711515;
}
#rightcol  ul ul a:hover {
background-color: #711515;
color: #FFFFFF;
}


/*----------------------END RIGHT COL ----------------------------------------?
/******************************** CSS container shadow ***********************/
#shadow-container {
position: relative;
left: 3px;
top: 3px;
margin-right: 3px;
margin-bottom: 3px;
}

#shadow-container .shadow2,
#shadow-container .shadow3,
#shadow-container .container {
position: relative;
left: -1px;
top: -1px;
}

#shadow-container .shadow1 {
background: #F1F0F1;
}

#shadow-container .shadow2 {
background: #DBDADB;
}

#shadow-container .shadow3 {
background: #B8B6B8;
}

#shadow-container .container {
background: #F8FFCF;
border: 1px solid #848284;
padding: 10px;
}
/******************************** CSS container shadow ********************************/


div#rightcol a:hover span#menu1{display: block;
position: absolute; top: 225px; left: 320px; width: 320px; height: 96px;
/* Height and padding-top monkeyed with to move text down in box, without extending content into margin (FF)*/
   padding-top: 0px; padding-bottom: 0px; margin: 0px; z-index: 100;
   background-image: url(../images/reduce.gif); background-repeat: no-repeat;
   background-position: top center; 
   background-color: #F8FFCF; 
   color: #AAA; 
   font: 12pt Verdana, sans-serif; text-align: center;}

div#rightcol a:hover span#menu1, a:hover span#menu2, a:hover span#menu3{ 
border-right-style: outset; 
border-right-color: #F1F0F1; 
border-right-width: 2px;
border-bottom-style: outset; 
border-bottom-color: #F1F0F1; 
border-bottom-width: 3px; 
}
div#rightcol a:hover span#menu2{display: block;
position: absolute; top: 375px; left: 320px; width: 320px; height: 96px;
/* Height and padding-top monkeyed with to move text down in box, without extending content into margin (FF)*/
   padding-top: 0px; padding-bottom: 0px; margin: 0px; z-index: 100;
   background-image: url(../images/reduce.gif); background-repeat: no-repeat;
   background-position: top center; 
   background-color: #F8FFCF; 
   color: #AAA; 
   font: 12pt Verdana, sans-serif; text-align: center;}
/*
div#rightcol a:hover span#menu2{ 
border-top-style: inset;
border-top-color: #F1F0F1; 
border-top-width: 1px; 
border-right-style: outset; 
border-right-color: #F1F0F1; 
border-right-width: 5px;
border-left-style: inset; 
border-left-color: #F1F0F1; 
border-left-width: 1px; 
border-bottom-style: outset; 
border-bottom-color: #F1F0F1; 
border-bottom-width: 5px; 
}
*/
div#rightcol a:hover span#menu3 {display: block;
position: absolute; top: 500px; left: 320px; width: 320px; height: 96px;
/* Height and padding-top monkeyed with to move text down in box, without extending content into margin (FF)*/
   padding-top: 0px; padding-bottom: 0px; margin: 0px; z-index: 100;
   background-image: url(../images/reduce.gif); background-repeat: no-repeat;
   background-position: top center; 
   background-color: #F8FFCF; 
   color: #AAA; 
   font: 12pt Verdana, sans-serif; text-align: center;}


/* Borders */
.thinridgeGrayBorder	{
BORDER-RIGHT: #eeeeee thin ridge; BORDER-TOP: #eeeeee thin ridge; BORDER-LEFT: #eeeeee thin ridge; BORDER-BOTTOM: #eeeeee thin ridge;}

/* Legend Border */
.legendBorder  { 
border-top: 1px #999 solid; border-left: 1px #999 solid; border-right: 1px #999 solid; border-bottom: 1px #999 solid; font-size: 10px; margin: 0; padding:0; }



/* ----------------------------------- Extra Span Styles------------------------ */



/*  ADD  SPANS AS NEEDED FOR ADDITIONAL MENU ITEMS. THE NUMBER OF SPANS MUST EQUAL THE NUMBER OF ITEMS ON THE LARGEST PAGE */
nter;}



div#links a img {height: 500px; width: 500px; border-width: 1px;}

/* ------- VERTICAL SPANS---------- */


/*Places image below rightcoligation
div#rightcol img{
margin-right: 10px;
}*/
/* --------- END RIGHT COL --------------------*/

/* ---------WRAPPER ----------------------------*/
div#wrapper {
 width: 		100%;
 margin-left: 		150px;  
 padding-left: 0px;
  z-index: 1;
 /*
border-left-style: solid;
border-left-width: 2px;
border-left-color: black;
*/



}
/* --------- END WRAPPER --------------------*/


/* --------- CONTENT STUFF --------------------*/

div#content {
/*  height:               100%;
THIS WITH BODY @100% CONTROLS COLUMN HEIGHTS! */
  margin-top: 		0px;
  margin-left: 		0px;
  margin-right:     50px;
  padding-top: 		10px;
  padding-left: 	30px;
  padding-right: 	35px;
  width: 		610px;
  float: left;
  line-height: 		120%;
  z-index: 		0;
   background-position: top center;   
}

div#content h1{
  line-height: 		100%;
  font-size: 		14pt;
}
div#content h2{
  font-style: 		normal;
  font-weight: 		bold;
  font-size: 		12pt;
  line-height: 		120%;
  color: 		maroon;
  margin: 		0px;
  padding: 		0px;
}

div#content h3{
  font-style: 		normal;
  font-weight: 		bold;
  font-size: 		11pt;
  line-height: 		120%;
  margin: 		0px;
  padding: 		0px;
}
div#content p{
  margin: 		5px;
  padding: 		2px;
}
div#content a { 
    text-decoration:    none;
    font: 		bold 1em sans-serif; 
}

div#content ul{
  margin-left:		0px;
  padding-left: 	30px;
}
div#navigation ul {
list-style: none;
margin: 0;
padding-top: 15px;
padding-bottom: 15px;
padding-left: 0px;
}

#navigation {
width: 550px;
}

#navigation li {
border-bottom: 1px solid #FFC; ;
}
#navigation li a:link, #navigation li a:visited {
font-size: 90%;
display: block;
padding: 5px;
color: 		#FFC; 
background: 	#444;
border-right: 	5px solid #505050;8
text-decoration: none;
}
#navigation li a:hover {color: #411; 
background: #AAA;
border-right: 5px double white;
}




div#content p.intro{
 font: 14pt Verdana, sans-serif; text-align: left; color: #231E14; padding-top: 60px; padding-bottom: 0px; padding-right: 30px; padding-left: 30px; 
}

div#content p.quote {
  padding-left:		10px;
  padding-right: 	20px;
  font-style:		italic;
}
  
div#content img.floatleft {
float:left;
clear: left; 
margin-top:5px;
margin-right:20px;
margin-bottom:10px;
}

div#content img.floatright {
float:right;
clear: right; 
margin-top:5px;
margin-left:20px;
margin-bottom:10px;
}
/* ------------ END CONTENT STUFF --------------------*/
/*----------------- FOOTER --------------------------*/
div#footer {
  clear: 		left;
  text-align: 		center;
  padding-top: 		 0px;
  margin-top: 		0px;
}

div#footer p {
  text-align: 		center;
  font-style: 		italic;
}
div#footer h2 {  
  text-align: 		center;
  font-size: 		14pt;
  color: 		maroon;
  font-family: 		"Copperplate Gothic Light", "Engravers MT", Elephant, "Times New Roman", serif;
  }

div#footer h3 {  
  text-align: 		center;
  font-style: 		italic;
  font-size: 		14pt;
  font-weight: 		bold;
  }
/*------------END FOOTER --------------------------*/