#trees A { text-decoration: none; }
.gen1 { color: red;}
.gen2 { color: orange;}
.gen3 {color: #008000;} /* dark green */
.gen4 { color:  blue;}
.gen5 {color: purple;}
.gen6 {color: teal;}
.gen7 { color: deeppink;}

.gen8 { color: #800000;}
.gen9 { color: darkgoldenrod;}
.gen10 { color: #30c830;}
.gen11 { color: #008880;}
.gen12 { color: #9030d0;}
.gen13 { color: #4080b0;}
.gen14{ color: #ff1090;}
.gen15 { color: crimson;}
.gen16 { color: darkorange;}
.gen17 { color: darkolivegreen;}
.gen18 { color: cadetblue;}
.gen19 { color: darkorchid;}
.gen20 { color: cornflowerblue;}
.gen21 { color: salmon;}



#trees ul {   /*1st Gen Black*/
	font-size: 12px;

}

/* 1st Gen Red */
#trees ol  { 
	color: black;
	list-style-type: upper-roman;
	text-align: justify;
}

#trees ul { margin: 0 0 -1em -12px; padding:1em 0 0 0; position:relative; border-color:#A2D3FF; }
	#trees	li { 
			border-left:3px solid #A2D3FF; 
			padding:0 0 1em 32px; 
			margin-left:0; 
			list-style:none; 
			font-size:13px; 
			position:relative;
		}
		/* FireFox ignores absolute positioning on the generated content */
	#trees	body:not([class*=""]) li:before {  margin-top:-1em; margin-bottom:-.6em ;margin-left:-35px; }
	#trees	body:not([class*=""]) li:first-child:before { margin-top:-1.55em; }
		
#trees	li:last-child { border-left:none; margin-left:3px; /* moves the text over by the same amount as the line would have */ }
		
		#trees li input { left: 11px; z-index:1; margin-top:-1px; position:absolute; opacity:.3; }
		#trees li label { font-weight:bold;  }
		
		/* special for the root of the list: */
		#trees ul#master {margin-left:0; }
		#trees ul#master > li:first-child:before { display:none; }
		#trees ul#master > li:first-child { border-left-width: 0; }
		
		/* here's the part that does the expanding and collapsing: */
		#trees input + label + ul { display:none; }
		#trees input:checked + label + ul { display:block; }
		
		#trees h1 { font-size:18px; }
		#trees h3 { font-size:15px; }
		#trees p, code { font-size:12px; }