html {
	height:100%; 
	max-height:100%;  
	padding:0; 
	margin:0; 
	border:0; 
	font-size: 100%; 
	font-family: trebuchet ms, tahoma, verdana, arial, sans-serif; 
	background:#fff url(../img/leaf_veins_2_op_60.jpg) -18px 0 repeat-x; 
	/* hide overflow:hidden from IE5/Mac */ 
	/* \*/ 
	overflow: hidden; 
	/* */ }

body {height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0;}
#content {display:block; height:100%; max-height:100%; overflow:auto; padding-left:210px; position:relative; z-index:3;}
#head {
	position:fixed;
 	margin:0; 
	top:0; right:21px; 
	display:block; 
	width:100%; height:100px; 
	background:#ddd url(../img/leaf_veins_op_top.jpg); 
	background-color: #339933;
	background-color: #666699;
	font-size:3em; 
	font-weight: bold;
	line-height: 2em;
	z-index:5; 
	color: #600;
	}
#foot {position:fixed; margin:0; bottom:-1px; right:21px; display:block; width:100%; height:25px; padding:5px 0 10px; 
background-color: #3B0C11; color:#fff; text-align:right; font-size:1em; z-index:4; }
#foot a, #foot a:visited {color: #fff}
#foot a:hover {color: #ffc;}

#left {position:fixed; left:0; top:0; height:100%; width:200px; 
/*	border-right: 2px inset #999; */
 	background:url(../img/ferns_side.jpg) #aaa; background-position:0 100px; 
	background-color: #cf9;
	background-color:#693;
	background-color:#8CBA1E; 
	font-size:1em; 
	color: #ffc ;
	z-index:4;
	}

* html #head, * html #foot,* html #left {position:absolute;}

#pad-head {display:block; width:36px; height:100px; float:left;  }


#pad4 {display:block; width:80%; height:50px; float: left;}
#pad3 {display:block; width:18px; height:40px; float:left; }
.pad2 {display:block; height:100px; }

#content p {padding:5px;}

.bold {font-size:1.2em; font-weight:bold;}

#wordsleft {float:left; top:100px; left:150px; height:200px; width:150px; background:#efd; border:1px solid #000; margin:5px; padding:5px;}
#wordsright {float:right; top:100px; right:150px; height:200px; width:150px; background:#def; border:1px solid #000; margin:5px; padding:5px;}
#wordsabsolute {position:absolute; top:280px; left:400px; background:#eee; border:1px solid #000; margin:5px; padding:5px; font-size:2em; color:#c00;}
#wordsrelative {position:relative; top:10px; left:30px; background:#ddd; border:1px solid #000; margin:5px; padding:5px; font-size:2em; color:#c00; width:200px;}

/* --- mainNav --*/
a.nav, a.nav:visited {display:block; width:100px; height:25px; text-decoration:none; color:#ffc; font-weight:bold; line-height:25px;}
a.nav:hover {color: #FF6633;}

/*-- columns --*/
.opacity-box {
	background-color:#ffc;
	filter:alpha(opacity=50); /* for IE */
	-moz-opacity:0.5; /* for moz browsers */
	}
.columns-2-AB-A, .columns-2-AB-B {
	top:100px;
	float: left;
	width: 48%;
	clear:none;
	padding: 5px;
	}
.columns-2-AB-A {left: 150px;}	
.columns-2-AB-B { right:150px; float: right;}	

/* Spotlights are boxes with colored headers and usually lists of links  */
.spotlight h2 {margin:0; font-size: 1.25em; padding:0 10px 5px 10px; border-bottom: 1px solid #4c4c4c;}
.spotlight ul { margin-top: 5px !important; margin: 0 10px; padding: 0 0 5px; list-style-type: none;}
.spotlight ul li { margin: 0 0 5px; }
.spotlight p {margin: 0 5px; }
.spotlight img, .spotlight a { padding-left: 10px;}
.spotlight li a, .spotlight p a, .spotlight a.bookmark {padding: 0;}
 
.spotlight {background:#F8F7E7; width:90%; margin:0 0 10px; opacity: .85;}
.subsection {background:#F8F7E7; width:90%; margin:0 0 10px; opacity: .85;}
.subsection-content h2 {margin:0; font-size: 1.25em; padding:0 10px 5px 10px; border-bottom: 1px solid #4c4c4c; border-top: 1px solid #4c4c4c;}
.subsection-content {display:block; height:auto; min-height: 200px; border: 0 solid #4c4c4c;  border-width:0 1px 1px;}


.spotlightTop, .spotlightBottom {display:block; background:transparent; font-size:1px;}
.spotlight .xb1, .spotlight .xb2, .spotlight .xb3, .spotlight .xb4 {display:block; overflow:hidden;}
.spotlight .xb1, .spotlight .xb2, .spotlight .xb3 {height:1px;}
.spotlight .xb2, .spotlight .xb3, .spotlight .xb4 {
	background:transparent;
	border-right: 1px solid #4c4c4c;
	border-left: 1px solid #4c4c4c;
	}
.spotlight .xb1 {margin:0 5px; background:#4c4c4c;}
.spotlight .xb2 {margin:0 3px; border-width:0 2px;}
.spotlight .xb3 {margin:0 2px;}
.spotlight .xb4 {height:2px; margin:0 1px;}

.spotlightContent {display:block;  border: 0 solid #4c4c4c;  border-width:0 1px; height:auto; min-height: 200px; }
* html .spotlightContent {height:1px; height: 200px;}
#guessBaby .spotlightContent {min-height: 850px;}
* html #guessBaby .spotlightContent {height:1px; height: 830px;}

/* color_a is currently used for "See Also" spot lighted boxes */
.spotlight .color_a {background:#B0F04A; color:#000;}
.spotlight .color_b {background:#3B0C11; color:#fff;}
.spotlight .color_c { background-color:#F1A783; color:#000;}
.spotlight .color_d {background:#B0BEE2; color:#000;}
.spotlight .color_e, .subsection .color_e {background:#ffc; color:#000;}
.spotlight .color_f {background:#b2ab9b; color:#000;}

/* -- text --*/
.clear {
	margin-top: -1px;
	padding-top: 1px;
	clear: both;
	}
.emph {font-weight: bold; color: #3B0C11;}	
.addBackGround {background-color: #ffc;opacity: .85; display:inline-block; }
#content .addBackGround p {padding: 0 5px; margin: 0;}