body {width:100%; background-color: #fefebf; color: black; font: normal 500 100% "times new roman", helvetica, serif; margin:0; padding:0}

div#treehead {background-color:#663300;}

div#treehead h1 {font: normal 800 200% "times new roman", helvetica, serif; color: #fff; margin:0; padding: 0em 0 0em 10%; border-right: .5em solid #ebdac6; letter-spacing: normal;}

p{text-align: left; padding: 1em 0 1em 0; line-height: 1.2; margin:0;}

p.author {text-align:center; font: normal 600 120% arial, helvetica, serif; color: #663300;}
p.author {background-color: #ffffaa; border-bottom:0px solid #663300; margin: 2em;}

p.central {text-align:center}
p.rtext {text-align:right;margin:0; padding:0}
p.notes {width:90%; margin-left:5%; color: #663300}
p#hist {margin:0 16% 0 16%; font: normal 600 120% "times new roman", helvetica, serif; color: #663300;}

div.frame {float:left; width:99%; margin: 1em 0;padding:0 0.5%}

 /* This ensures that when one img float follows another, it appears below it. Achieved by each img contained in a 'float left (or right), width 100%' container. To bring flow below the last float, a blank paragraph is used below and outside last float. It is as though floated elements act on another plane separate from flow plane.*/

div.frame p span{ font: italic 600 120% arial, helvetica, serif; color: #663300; padding:2em 0em 2em 0em; line-height:2}

/*  space paragraph a necessary hack to end float divisions. Otherwise div allmid border starts at top of first float */

img {margin:0 1%}
img.top {vertical-align:top}
img.mid {vertical-align:middle}
img.left {float: left;}
img.right {float: right;}

img.azure {border: 10px ridge #a1c7fb}
img.oliv {border: 10px ridge #a3a300}
img.green {border: 10px ridge #ccffcc} /*light green*/
img.grey {border: 10px ridge #cccccc}
img.pink {border: 10px ridge #ff6666}
img.brown{border: 10px ridge #ff9e04}
img.white {border: 10px ridge #ffffff}
img.none {border: none }

a {text-decoration:none;}
a:link {color: #ff3300;} /*red */
a:visited {color: #ff6633;} /* light red */
a:hover {color: #339933;} /*light green */


div#select  {position:relative;}

div#select p {text-align:center; width:60%; margin-left:auto; margin-right:auto; border: 1px solid #663300; background-color: #f2fada; font: normal 600 90% "times new roman", helvetica, serif; color:#000000; padding:1em 0em;}


#s0w30 {position: relative; top: 0; left: -20%}
#s0e30 {position: relative; top: 0; left: 20%}
#s3c0 {position: relative; top: 3em; left: 0%}