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


p {text-align: left; overflow: visible; line-height: 1.2;}

/*setting p width to 100% causes problems*/

h1 { font: normal 600 200% "times new roman", helvetica, serif; color: #1359ba; letter-spacing: 6px;}

h2 { font: normal 500 110% arial, "times new roman", helvetica, serif; color: #000000; width: 80%; margin-left:10%; margin-right:auto;}

.central{text-align:center}

div#frame {float:left; width:100%;}

div#frame p {padding: 0em 1em 0em 1em;}

 /* 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.*/


p span {font: normal 600 130% "times new roman", helvetica, serif; color: brown;}

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

div#select p {text-align:center;}

.s0w30 {position: relative; top: 0%; left: -20%}
.s0e30 {position: relative; top: 0%; left: 20%}

img {margin:1em 1%; border: 1px solid #000000}
img.left {float: left }
img.right {float: right }

a {text-decoration:none;font: normal 600 110% "times new roman", helvetica, serif;}
a:link {color: #ff3300;} /*red */
a:visited {color: #ff6633;} /* light red */
a:hover {color: #339933;} /*light green */

@page preset {size: auto}
div.newpage {page:preset; page-break-before:always}