body {
font-size: .85em;
position : relative;
min-width: 550px;
margin : 0;
padding : 0;
background-color : #62b5df;
background-image : url(images/mapleleafs.jpg);
background-repeat : no-repeat;
background-attachment : fixed;
z-index : 0;
}
div#header {
background-image : url(images/mapletreeheader.jpg);
background-repeat : no-repeat;
background-attachment : fixed;
}
div#content {
background-color : #fff9ec;
background-image : url(images/mptreecon.jpg);
background-repeat : no-repeat;
background-attachment : fixed;
}
div#menuwrapper {
top : 30%;
z-index :3;
left : 1.5%;
width:15%;
max-width:170px;
position : fixed;
border: solid #ffcc99;
padding:0.7%;
text-align : center;
font:.93em kristen itc;
}

/* Unless you know what you do, do not touch this */ 
#primary-nav, #primary-nav ul { 
   list-style: none; 
   margin: 0px; 
   padding: 0px; 
   width: 100%; 
   margin-left: -1px;
}
#primary-nav ul { 
   position: absolute; 
   top: 0; 
   left: 100%; 
   display: none; 
}
#primary-nav li { 
   margin-bottom: -1px; 
   position: relative; 
}


/* Styling the basic apperance of the menu elements */
#primary-nav a { 
   border:1px solid #000;
   padding: 1px 10px; 
   display: block; 
   margin: 0px; 
   color: #000;
   font-weight : bold;
   text-decoration: none;
   min-height:.5em; /* Fixes IE7 whitespace bug*/
  
}

 

#primary-nav li, #primary-nav li.menuparent { 
    background-color: #ffffee;
    background-image:url(images/mapletreenav.jpg);
    background-attachment:fixed;
    background-repeat:no-repeat;
    background-color:#c5c89b;
    background-position:top left;
    min-height:.5em; /* Fixes IE7 whitespace bug*/
 
}

/* Styling the basic apperance of the active page elements (shows what page in the menu is being displayed) */
#primary-nav li.menuactive { 
   background-color: #C7C7C7; 
}

/* Styling the basic apperance of the menuparents - here styled the same on hover (fixes IE bug) */
#primary-nav li.menuparent, 
#primary-nav li.menuparent:hover, 
#primary-nav li.menuparenth { 
background-color: #ffffee;
}


/* Styling the apperance of menu items on hover */

#primary-nav li:hover, 
#primary-nav li.menuh, 
#primary-nav li.menuparenth, 
#primary-nav li.menuactiveh {
background-image:none;
background-color:#ffffee;}

/* The magic - set to work for up to a 3 level menu, but can be increased unlimited */
#primary-nav ul, 
#primary-nav li:hover ul, 
#primary-nav li:hover ul ul, 
#primary-nav li.menuparenth ul, 
#primary-nav li.menuparenth ul ul { 
   display: none; 
}
#primary-nav li:hover ul, 
#primary-nav ul li:hover ul, 
#primary-nav ul ul li:hover ul, 
#primary-nav li.menuparenth ul, 
#primary-nav ul li.menuparenth ul, 
#primary-nav ul ul li.menuparenth ul 
{display: block;}


/* IE Hack, will cause the css to not validate */




div#header {
position : fixed;
z-index : 2;
top : 0;
left : 12.5%;
right : 12.5%;
min-width: 615px;
height: 140px;
max-height: 140px;
color : #fff9ec;
font: 1.42em kristen itc;
text-align: center;
}

div#header a:link {                   
font: 1.52em kristen itc;
color : #fff9ec;
text-decoration : none;
text-align: center;
}

div#header a:visited {
font: 1.52em kristen itc;
color : #fff9ec;
text-decoration: none;
text-align: center;
}

div#content {
position : absolute;
z-index : 1;
top : 152px;
left : 12.5%;
right : 12.5%;
min-width: 615px;
color : black;
}

div#content p {
font-family : arial;
line-height: 1.4;
margin-left : 11.7%;
margin-right : 10%;
text-align : justify;
font-size : 1.25em;
background-color: #fff9ec;
font-weight:550;
}

div#content a {
text-decoration : none;
}
div#content h1 {
margin-left : 11.7%;
margin-right : 11.7%;
font-family : kristen itc;
padding-top : 10px;
text-align : center;
}
div#content h2, h3, h4 {
margin-left : 11.7%;
margin-right : 11.7%;
font-family : kristen itc;
text-align : center;
}
div#content p.i {
background-color : #ccccff;
padding-right: 3px;
padding-bottom: 3px;
font-family : arial;
line-height: 1.4;
margin-left : 11.7%;
margin-right : 10%;
text-align : justify;
font-size : 1.25em;
font-style: italic; 
font-weight: bold;
}

div#content p.movie {text-align:center; background-color:transparent;z-index:1;}

div#main {float:left; width:80%;}
div#news {float:right; width:17%; padding-right:10px; padding-left:5px; text-align:justify;}
div#news h2 {background-color:#85cd66; border: solid #ffcc99;}
div#main p {margin-right: 15px;}
div#main h2 {margin-right: 15px; background-color:#85cd66; border: solid #ffcc99;}
div#footer {position: absolute; width:100%; bottom:0px;}
div#content br.clear {clear:right;}
div#news h3 {font-family: arial; text-align: left; padding:0px; margin-left: 0px;}

div#content ol {
list-style-type : decimal;
margin-left : 4cm;
margin-right : 3cm;
text-align : justify;
font-size : 1.25em;
}
div#content ul {
list-style-type : disc;
font-family: arial;
font-size : 1.25em;
margin-left : 13%;
font-weight : bold;
}
div#content li {
font-family: arial;
font-size : 1em;
margin-left : 0.5cm;
margin-right : 12%;
text-decoration : none;
font-weight : normal;
}
div#content li.small {
font-family: arial;
font-size : 0.9em;
margin-left : 1cm;
}
div#content p.centeredImage {
text-align:center; 
margin-top:0px; 
margin-bottom:0px; 
padding:0px; 
background-color: transparent;
margin-left:11.7%; 
margin-right:11.7%;
}
img.floatleft {
float : left;
margin-left : 11.7%;
padding-right : 1%;
padding-top : 1%;
}
img.floatright {
float : right;
margin-right : 10%;
padding-left : 1%;
padding-top : 1%;
}

#gallery {
position : absolute;
margin-left: 13%;
width : 600px;
height : 380px;
padding : 10px;
border : 0 solid #ffcc99;
background : #fff9ec;
}

#gallery b.default {
position : absolute;
left : 10px;
top : 10px;
width : 400px;
height : 300px;
text-align : center;
}
#gallery b.default img.gallery {
display : block;
margin : 0 auto 10px auto;
border : 1px solid #eee;
border-color : #555 #ddd #eee #333;
}
#gallery b.default span.gallery {
display : block;
color : black;
font-family : arial, sans-serif;
font-weight : normal;
font-size : 11px;
width : 350px;
margin : 0 auto;
}
#gallery ul.gallery {
list-style : none;
padding : 0;
margin : 0;
width : 180px;
position : relative;
float : right;
}
#gallery ul li.gallery {
display : inline;
width : 52px;
height : 52px;
float : left;
margin : 0 0 5px 5px;
}
#gallery ul li a.gallery {
display : block;
width : 50px;
height : 50px;
text-decoration : none;
border : 1px solid #000;
border-color : #eee #555 #333 #ddd;
}
#gallery ul li a span.gallery {
display : none;
}
#gallery ul li a img.gallery {
display : block;
width : 50px;
height : 50px;
border : 0;
}
#gallery ul li a:hover.gallery {
white-space : normal;
border-color : #555 #ddd #eee #333;
background : #85cd66;
}
#gallery ul li a:hover b.gallery {
position : absolute;
left : -420px;
top : 0;
width : 400px;
height : 380px;
text-align : center;
background : #fff9ec;
z-index : 20;
}

#gallery ul li a:hover span.gallery {
display : block;
color : black;
font-family : verdana, arial, sans-serif;
font-weight : normal;
font-size : 11px;
width : 350px;
margin : 0 auto;
}
#gallery ul li a:hover img.gallery {
margin : 0 auto 10px 0;
width : auto;
height : auto;
border : 1px solid #eee;
border-color : #555 #ddd #eee #333;
}
#gallery ul li a:active.gallery, #gallery ul li a:focus.gallery {
white-space : normal;
border-color : #555 #ddd #eee #333;
background : #777;
}
#gallery ul li a:active b.gallery, #gallery ul li a:focus b.gallery {
position : absolute;
left : -420px;
top : 0;
width : 400px;
height : 380px;
text-align : center;
background : #fff9ec;
z-index : 10;
}
#gallery ul li a:active span.gallery, #gallery ul li a:focus span.gallery {
display : block;
font-family : arial, sans-serif;
font-weight : normal;
font-size : 11px;
width : 350px;
margin : 0 auto;
}
#gallery ul li a:active img.gallery, #gallery ul li a:focus img.gallery {
margin : 0 auto 10px auto;
width : auto;
height : auto;
border : 1px solid #eee;
border-color : #555 #ddd #eee #333;
}
div#content img {
border-color : #fff9ec;
}