/* layoutstyles.css */ 

/* Universal style rule */ 
*{ 
/* Block all browser default margins and padding */ 
  margin: 0;
  padding: 0;
  /* Temporary borders; uncomment this to help see where all the sections are */ 
  /* border: dashed 1px #ff0000; */
} 

body{
	background-color:#FFFFE6;
	background-image:url(creamtexture.jpg);
	/* also could use shorthand  background:#FFFFE6 url(creamtexture.jpg); */
	font-family: Arial, Helvetica, sans-serif;
}

acronym, abbr{
	border-bottom:dotted 1px #000000;
	cursor:help;
}

#wrapper{ 
  width: 45em;
  margin: 20px auto 0 auto;  /* Center the wrapper */
  background-color:#D7F9D7; /* light green */
  position:relative; /* required when using absolute positioning for the other divs */
  /*white-space:pre;*/
}

#wrapper a,
#wrapper a:link,
#wrapper a:visited,
#wrapper a:hover,
#wrapper a:active{
	font-family:Verdana, Geneva, Arial, Sans-Serif;
	font-size:90%;
}

#wrapper a:visited{
	color:#CA00CA;
}

#branding{
	height:9.125em;
	background-color:#FFFFE6; /* cream */
	color:#009000;
	text-align:center;
	/* position:relative; */  /* make the branding div a positioned element; this causes odd behavior in IE7 with ctrl-+ */
}

#branding img{
	display:block;
}

#branding h1{
	font-family:"Apple Chancery", "Brush Script MT", "Monotype Corsiva", cursive;
	font-size:1.8em;
  padding-top:0.25em;
}

#branding a{
	position:absolute; /* anchors are positioned relative to the positioned element rather than the viewport (browser)  */
	text-decoration:none;
	color:#009000;
	font-size:0.8em;
}

/* note: the order for styling pseudo-classes must be: link, visited, hover, active (lhva) */
#branding a:link,
#branding a:visited{
	color:#009000;
}

#branding a:hover{
	color:#000000;
}

#branding a:active{
	color:#c473e5;
}

#leftcolumn{
	/*background:#D7F9D7;*/ /* light green */
	width:10em;  /* Remember to set the Content div's left margin to this value */
	text-align:center; /* centers text (and images) */
	/* height:6em; */
	/*float:left;*/
	position:absolute; /* for an absolutely-positioned left column within the wrapper */
	top:9.125em;  /* same as the height of the branding div */
	left:0em;
}

#leftcolumn img{
	width:80%;
}

#leftcolumn p,
#leftcolumn .leftcollist{
	border:solid 2px #11B76F;
	padding: 0.5em;
	width:80%;
	font-size:0.9em;
	margin:0.5em auto;
	text-align:left;
}

#leftcolumn ul{
	margin-left:1em;
}

#leftcolumn .leftcollist .dropdown,
#leftcolumn .leftcollist .dropdown a{
	list-style-type:none;
	text-decoration:none;
}

#leftcolumn h2{
	font-family: "Apple Chancery", "Brush script MT", "Monotype Corsiva", cursive;
  color:#008000;
  font-weight:bold;
  font-style:italic;
  /*font-variant:small-caps;*/
  letter-spacing:0.08em;
  text-align:center;
  font-size:2.0em;
  line-height:0.7em;
  margin:0.2em 0em 0.2em 0em;
}

#leftcolumn hr{
	color:#008000;
	width:95%;
}

div.scrollbar{
	width:80%;
	height:5em;
	font-size:0.8em;
	padding:0.5em;
	margin:0.5em auto;
	border:thin solid #000000;
	background-color:#DDDDDD;
	overflow:auto;
}

/* Captioned images */

#rightcolumn{
	background-color:#00ffff; /* blue */
	width:10em;  /* Remember to set the Content div's right margin to this value */
	/* height:5em; */
	/*float:right;*/
	position:absolute; /* for an absolutely-positioned right column within the wrapper */
	top:9.125em;  /* same as the height of the branding div */
	right:0em;   /* align right edge of rightcolumn to right edge of wrapper */
}

#navbar{
	background:#D7F9D7 url(navbak.jpg) repeat-x center; /* light green */
	/*margin-left:10em;*/
	height:1.6em; /* equals height x font-size of the navbar links */
	position:absolute; /* for an absolutely-positioned navbar within the wrapper div */
	top:9.125em; /* same as the height of the branding div */
	left:10em;  /* same as the width of the left column */
	width:35em; /* (wrapper width) - (left col width) - (rigth col width, if there is a right col) */
}

#navbar ul{
	list-style-type:none;
}

#navbar li{
	float:left;
	position:relative; /* this is required for the drop-down menus */
}

/* set attributes for links on the navbar */
#navbar a,
#navbar a:link,
#navbar a:visited,
#navbar a:hover,
#navbar a:active{
	font-size:80%;
	text-decoration:none;
	color:#000000;
	background:#D7F9D7 url(navbak.jpg) repeat-x center; /* same as navbar div */
	display:block; /* links are inline by default. need to define as block element so height and width can be styled */
	height:2em;
	width:7em;
	border-right:solid 1px #009000;
	text-align:center;
	line-height:2em;  /* set line-height equal to height of links to center them vertically (approximately) */
	outline-style:none;
}

/* now set the hover and active properties so the current page is highlighted */
#navbar a:hover,
#navbar a:active,
#nabvbar li.selected a:link,
#navbar li.selected a:visited{
	background:#D7F9D7 url(navhover.jpg) repeat-x center;
	color:#000000;
}

/* set the color for visited links on the navbar, but still leave the current page highlighted */
#navbar a:visited,
#navbar li.selected a:visited{
	color:#CA00CA;
}

#navbar li.dropdown a:visited{
	background:#D7F9D7;
	color:#CA00CA;
}

/* style rule for drop down menus, which are ul's below li's in the navbar div */
#navbar li ul{
	position:absolute;
	z-index:100;
	visibility:hidden;
	border:solid 1px #009000;
}

/* make the drop down menu items visible on navbar hover */
#navbar li:hover ul,
#navbar li a:hover ul{ /* IE6 hack */
	visibility:visible;
	top:1.6em;
	left:0;
	border:solid 1px #009000;
	border-right:none;
	border-top:none;
	margin-left:-1px;
}

/* style rule for links on the drop down menus */
#navbar li:hover ul li a,
#navbar li a:hover ul li a{ /* IE6 hack */
	background:#D7F9D7; /* removes the background image and applies a color */
	color:#000000;
	text-align:left;
	display:block;
	width:10em;
	padding:0 0 0 1em;
	height:auto;
	/*border:solid 1px #009000; */
}

/* style rule for hovered links on the drop down menus */
#navbar li:hover ul li a:hover,
#navbar li a:hover ul li a:hover{ /* IE6 hack */
	background:#64EE00 url(navhover.jpg) repeat-x center;
	color:#000000;
}

/* style rule for tables in the navbar - which only applies to the IE6 hacks */
#navbar table{
	margin:-1px;
	border-collapse:collapse;
	position:absolute;
	top:0.5em;
	left:0;
	z-index:100;
	/*border:solid 1px #009000; */
}

#content{
	background-color:#ffffff; /* white */
	color:#000000;            /* black */
	margin-left:10em;  /* This value must match the Left Column div's width */
	/*If there's a right column div, then set a margin-right to match the Right Column div's width */
	padding:2em 10px 10px 20px;  /* top should be same as height of navbar, plus a little bit */
	height:30em;
	overflow:auto;
}

#content li em{
	font-style:italic;
	font-weight:bold;
	/*text-decoration:underline; */
	color:#228B22;
}

#content p,
#content ul,
#content ol{
  text-align:left;
  line-height:1.15em;
  font-size:0.85em;
}

/* Applies to all lists in the content division */
#content ul,
#content ol{
  padding:10px 0 10px 40px; 
}

/* Applies to all h1, h2, and h3 styleheadings in the content division */
#content h1,
#content h2,
#content h3{
  font-family: "Arial Narrow", Calibri, sans-serif;
  color:#B22222;
  font-weight:normal;
  font-style:italic;
  font-variant:small-caps;
  letter-spacing:0.05em;
}

/* Size h1 headings in the content division */
#content h1{
  font-size:1.75em;
}

/* Size h2 headings in the content division */
#content h2{
  font-size:1.5em;
}

#content h2.newsletter{
	text-decoration:underline;
	font-weight:bold;
	font-size:1.1em;
	font-variant:normal;
	color:#1f7e1f;
}

/* Size h3 headings in the content division */
#content h3{
  font-size:1.25em;
  font-style:normal;
}

#content ul li{
	list-style: url(bullet_image.jpg) disc
}

#content ul li.nobullet{
	list-style-type:none;
}

#content ol li{
	text-indent:0em;
}

#content ul ol li{
	text-indent:0em;
	list-style-type:decimal;
}

#content li li{
	font-size:100%;
}

#content table{
	position:relative;
	left:1.5em; /*indent tables in the content div; but let normal flow set the top position */
}

#content table,
#content th,
#content td{
	background-color:white;
	border:none;
	/*cellspacing:3;*/
	padding:1px 2px;
	margin:0px;
	font-size:0.9em;
	text-align:center;
}

#content th,
#content td{
	background-color:#FFFFE6;
	background-image:url(creamtexture.jpg);
	border:1px white outset;
}

#footer{
	background-color:#E5E5E5; /* gray */
	position:absolute;
	bottom:0;
	left:0;
	width:44.5em; /* wrapper width minus left and right padding */
	padding:0.25em;
}

#footer p,
#printFooter p{
	text-align:left;
	font-size:0.6em;
}

#footer span.foot{
	position:absolute;
	right:0;
	padding-right:0.25em;
}

#printFooter{
	visibility:hidden;
}

/*style rules for print-only */
@media print{
	#wrapper{
		width:100%;
		/*height:50em;*/
		margin:0;
	}
	
	#leftcolumn,
	#content{
		position:absolute;
		top:0;
	}
	
	#footer{
		visibility:hidden;
	}
	
	#printFooter{
		visibility:visible;
	}
	
	#branding img,
	#rightcolumn,
	#navbar{
		display:none;
	}
	
}/* end of print-only styles */