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

div#treehead {background-color:#337777;;height:7.5em}

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

div#treehead h1 span {padding-left:20%; color:yellow}

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

p#author {padding:5%; font: normal 600 120% arial, helvetica, serif; color: #663300;}

p#leadin {padding:5%;text-align:center;font: normal 600 120% arial, helvetica, serif; color: red;}

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 select p a hover pop up text 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.shift {margin-top:0.4em}
p.center {text-align:center;}

/* style rules for links and page end */

div#select {position:relative; width: 100%;}

div#select p {text-align:center; margin-bottom:0.5em;width:100%;borde:2px solid red;}

div#select p a {margin-left:2em; margin-right:2em; padding:0.25em 1em 0.25em 1em; text-align:center; text-decoration:none; border: 0.25em outset #fbd5b3; background-color:#e9e9e9;}

/* 
An inline element does not have a width property but can be given padding, border and margin (only left and right in IE6). p#hover is made a block element to overcome this. Note that a space between 'a' text and </span> causes a slight shift when hover is used
*/

div#select p a:hover span {display:block; position:absolute; top:6.5em; left:20%; width:64%; background:#e9e9e9; margin: 0; padding:0; color:#000099; font:600 120% "times new roman", helvetica, serif; color:#333333}

div#select p a span {display:none;}

div#select p a#press {background-color: #ffffff }

div#select p a:link {color: #000066} /* blue */
div#select p a:visited {color:#006666}
div#select p a:hover {color: red; background: #e9e9e9;} /*  */




/*
For use with prntaurora


p#fin {position:relative; top:0; left:0; width:100%; page-break-before:always;}

*/