/*EXHIBITS 2006 */
/*Created 2006-09-25 by Anne Botman*/
/*Updated 2009-03-31 by Russ Brooks*/
/*PRIMARY*/
html, body {color:#000;
font-family: Verdana, Arial, sans-serif;
font-size: 0.9em;
margin-top: 0px;
margin-bottom: 0px; }
p, li {line-height:1.2em;
margin: 0px 0px 0px 0px; }
a, a:link {color:#FFFF00; }
a:visited {color:#FFFF99; }
a:hover {color:#FFFF99; }
a img {border:0; }
.invisible {display: none; }
.small {font-size: 0.8em; }

#main:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

/**/
/*Clear forces an element to come below a floating element; both clears left and right*/
.clear {clear:right; }
#clear {clear:right; }

/**/
/*PAGE HIERARCHY: Level, Page, Header, Main, Sidebar, Index, Content, Path, Footer*/
/* */
/* Level is part of Body, Main and Index */
/**/
#page {margin: 0 auto;
width:960px; }

/**/
/*PULL DOWN SITE INDEX*/
/*sibox contains the pulldown form -- height is required to fix problem in Netscape 7*/
#sibox {width: 800px;
height: 1px; }
#siteindex {float:right;
margin:8px 0; }

/**/

/*Splash content*/
#splashleft{width:45%; float:left; text-align: right; padding:10px;}
#splashleft h1 {margin:12px 0px 6px 0px;font-size:20px;font-style:italic;}
#splashright{width:45%; float:right; text-align: left; padding:10px;}
#splashright h1 {margin:12px 0px 6px 0px;font-size:20px;font-style:italic;}
#splashcanada{width:200px; float:left; text-align: left; padding:10px; margin-left:100px;}
#splash150nature{width:200px; float:middle; text-align: right; padding:10px; margin-right:100px;}
#splashparks{width:200px; float:right; text-align: right; padding:10px; margin-right:100px;}
/**/


/* HEADER*/
#header {width: 960px;
clear:both; }
#hdr {width: 960px;
float: center;
margin: 0px;
padding: 0px; }

/**/
/*Main -- controls the menu page  background colour, the footer line colour and the sidebar background colour*/
#main {
border-width:0px 0px 0px 0px;
clear:both;
display:block;
padding: 0; }

body#level1 #main, body#level2 #main, body#level3 #main, body#level4 #main, body#level5 #main {}

/*This somehow clears the rest of the content block to the footer level?*/
#main:after {content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }

/**/
/*Path breadcrumbs*/
#path {float: left;
width: 710px;
margin: 0px;
padding: 10px 0px 10px 30px;
font-size: 90%;
background-repeat: no-repeat;
color: #ffffff; }

#path p {width: 700px;}

#path a:link {text-decoration: underline; }

#path a:visited {text-decoration: underline; }

#path a:hover, #nextprev a:active {text-decoration: underline; }

#path .tiny {font-size:.5em; }

/* Wide Path */

#pathwide {float: left;
width: 960px;
height: 90px;
margin: 0px;
padding: 0px 0px 0px 30px;
font-size: 90%;
background-image: url(/h2o/images/nav/hdr_nav_titlewide_bg_e.jpg);
background-repeat: no-repeat; }


/*body#level3 #path, body#level4 #path, body#level5 #path {
     padding:0 0px; }*/
/**/
/* Sidebar is for whole left column*/
#sidebar {float:right;
width:200px;
color: #FFFFFF;
font-size: 0.9em;}

#sidebar p.sidepar {float:right;
margin: 10px 10px 0 10px;
width:170px;
color: #FFFFFF;}

#sidebar h2.sidepar {float:right;
margin: 10px 10px 0 10px;
width:170px;
color: #FFFFFF; }

#sidebar h3.sidepar {float:right;
margin: 10px 10px 0 10px;
width:170px;
color: #FFFFFF; }

#sidebar .sideparbox {
width:170px;
color: #FFFFFF; }

#sidebar .whitemenu {
color: #FFFFFF; }

#sidebar .header3 {
font-size:1.1em;
font-weight: bold;
color: #FFFFFF; }

/**/
/*These empty spans are used to hide text which is printed instead of background graphics*/
header h2 span, #index dt span, #content h2 span, a span, #content .section li:first-child:before,#themes li:first-child:before {display:none; }
/**/

/*Content*/

#content {width:960px;
float:left;
background: #6699cc;
background-image: url(/puijila/images/layout/pg_bg.gif); }
#container {width:740px;}
#photo700 {margin:0 0 0 30px;}
#content h1 {margin: 12px 15px 0px 30px;
width: 700px;
font-size:1.7em;
font-style:italic;
color: #ffffff; }
.splashh1 {margin: 0px 10px 0px 0px;
font-size:1.5em;
font-style:italic;
color: #009966; }
#content h2 {margin: 1em 20px 0px 30px;

font-size: 1.3em;
color: #ffffcc; }
#content h2.tight {margin:0 30px;
color: #990099; }
#content h2.boxblue {margin:0 30px;
color: #FFFF00; }
#content h2.boxpurp {margin:0 30px;
color: #FFFF00; }
#content h2.boxgreen {margin:0 30px;
color: #FFFF00; }
#content .boxgreentitle {
font-size: 1.3em;
font-weight: bold;
color: #FFFF00; }
#content h3 {margin: 12px 15px 0px 30px;
font-size:1.1em;
color: #FFFFFF; }
#content h3.boxblue {margin:0 30px;
color: #FFFFFF; }
#content h3.boxpurp {margin:0 30px;
color: #FFFFFF; }
#content h3.boxgreen {margin:0 30px;
color: #FFFFFF; }
#content h3.boxsideblue {margin:0 15px;
color: #FFFFFF; }
#content h3.boxsidepurp {margin:0 15px;
color: #FFFFFF; }
#content h3.boxsidegreen {margin:0 15px;
color: #FFFFFF; }
#content h3.tight {margin: 0 30px;
font-size:1.1em;
color: #FFFFFF; }
#content h4 {margin: 12px 15px 0px 30px;
font-size:1.0em;
color: #FFFFFF; }
#content p {margin: 12px 15px 0px 30px;}
#content p.tight {margin: 0px 15px 0px 30px;}
#content p.larger {margin: 12px 15px 0px 30px; font-size: 1.1em;}

#content ul {padding: 0; margin: 12px 15px 0px 30px; }
#content li {margin-left:20px; }

#content a.glossary {
color:#FFFFFF;
background:#6699cc;
text-decoration: none; }
#content a:visited.glossary {
color: #cccccc;
background:#6699cc;
text-decoration: none; }
#content a:hover.glossary {
background:#6699cc;
text-decoration: underline; }

#content .feature {display:block; background:#006699;}
#content div.feature {border:2px solid #ffffff; width:600px; padding: 0 0 0 0px; margin: 30px 0px 0px 30px;}
#content .feature p {color:#ffffff;}
#content .feature li {color:#ffffff;}
#content .feature img {float:right; padding:10px; margin: 10px 10px 20px 10px;}

#content .mapfeature {display:block; background:#006699;}
#content div.mapfeature {border:2px solid #ffffff; width:600px; padding: 0 0 0 0px; margin: 30px 0px 0px 30px;}
#content .mapfeature p {color:#ffffff;}
#content .mapfeature img {padding:10px;}



#content div.subnav{border:2px solid #ffff66; background:#006699;width:715px;display:block;margin:0px 0px 5px 20px; padding:0px 0px 7px 0px;}
#content .subnav li, #themes li{display:inline;list-style:none;margin:0;padding:0;}
#content .subnav li a, #themes li a{padding:0 0 0 0; text-decoration:none;}
#content .subnav li, #related li{display:inline;list-style:none;margin:0;padding:0;}
#content .subnav li a, #related li a{padding:0 0 0 0; text-decoration:none;}
#content .subnav li a.active, #related li a.active{padding:0 0 0 0; font-weight:bold; text-decoration:underline;}
/*#content .feature li:before, #themes li:before{content:" / ";}*/
#content .subnav ul{margin:5;padding:0; width:650px;}



/* Photo Caption */

#content .photocaption {width:302px;
float:right;
margin: 10px 10px 20px 10px;
color: #000;
/*border: 1px solid;*/
 }

#content .photocaption img {
border: 2px solid #fff;
 }
 
#content .photocaption p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of Photo Caption */

/* left aligned Photo Caption */

#content .photocaptionleft {width:302px;
float:left;
margin: 10px 30px 20px 30px;
color: #000;
/*border: 1px solid;*/
 }

#content .photocaptionleft img {
border: 2px solid #fff;
 }
 
#content .photocaptionleft p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of left aligned Photo Caption */

/* center aligned Photo Caption */

#content .photocaptioncenter {width:302px;
margin: 10px 30px 20px 250px;
color: #000;
/*border: 1px solid;*/
 }

#content .photocaptioncenter img {
border: 2px solid #fff;
 }
 
#content .photocaptioncenter p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of center aligned Photo Caption */

/* left aligned Photo Caption 200 wide */

#content .photocaptionleftthin {width:202px;
float:left;
margin: 10px 30px 20px 30px;
color: #000;
/*border: 1px solid;*/
 }

#content .photocaptionleftthin img {
border: 2px solid #fff;
 }
 
#content .photocaptionleftthin p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of left aligned Photo Caption 200 wide */

/* left aligned Photo Caption 300 wide */

#content .photocaptionleftnormal {width:302px;
float:left;
margin: 10px 15px 20px 30px;
color: #000;
/*border: 1px solid;*/
 }

#content .photocaptionleftnormal img {
border: 2px solid #fff;
 }
 
#content .photocaptionleftnormal p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of left aligned Photo Caption 300 wide */

/* no border left aligned indented image (puijila in Inuktitut */

#content .photocaptionleftin {width:190px;
margin: 10px 10px 10px 40px;
color: #000;
/*border: 1px solid;*/
 }

#content .photocaptionleftin p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of no border left aligned image (puijila in Inuktitut */

/* biography Photo Caption 200 */

#content .photocaptionbio {width:202px;
float:right;
margin: 10px 10px 20px 10px;
color: #000;
/*border: 1px solid;*/
 }

#content .photocaptionbio img {
border: 2px solid #fff;
 }
 
#content .photocaptionbio p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of Photo Caption */

/* wide Photo Caption 700 */

#content .widephotocaption {width:700px;
margin: 15px 0px 10px 30px;
color: #000;
/* border: 1px solid;
*/ }

#content .widephotocaption p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* End of wide Photo Caption */

/* wide Photo Caption */

#content .centerimage {width:302px;
padding: 15px 0px 10px 230px;}

#content .centerimage img {border: 2px solid #fff; }

#content .centerimage p {font-size: 90%;
/*width: 300px;*/
padding: 0em 8px 1.3em 8px;
margin:0;
line-height:1.3;
color: #ffffff; }

/* wide End of Photo Caption */

#sidebar p {margin:0px 15px 0 15px;
/*width:100px;*/ }

#sidebar sidephotocaption p {font-size: 90%;
/*width: 300px;
padding: 0em 8px 1.3em 8px;*/
margin:0;
line-height:1.3;
color: #ffffff; }


/*In Page Nav - used for linking to "level 4"  content pages, usually on Gallery pages*/

/* NAVBAR BEGINS */

#navbar {
width: 533px ;
margin: 12px 15px 0px 30px; 
background-image: url(/h2o/images/nav/nav_bg.jpg);
background-repeat: no-repeat; }

/* NAVBAR ENDS */


#inpagenav {display: block;
float:right;
width:175px;
background:#006699;
margin: 15px 15px 0px 30px;
color:#FFFFFF;
font-size: 90%;
padding: 10px 8px 0px 0px;
/*right padding keeps all levels equal rather than do it in the li*/
     border: 2px #ffff66 solid; }
#inpagenav ul {list-style-type: none;
margin: 0;
padding: 0;
width:150px; }
#inpagenav li {list-style-type: none;
margin: 0;
padding-top: 0px;
padding-right: 0px;
/*Right padding is handled by div so it's not cumulative*/
     padding-bottom: 6px;
/*space between li items*/
     padding-left: 11px;
line-height: 1.2; }
/*space between text rows for text wrapping*/
#pageindex li a, #pageindex li a:link, #inpagenav li a, #inpagenav li a:link {/*display: block;
* Moved block to inpagenav to accomodate pageindex links*/
     
text-decoration: none; }
#pageindex li a:visted, #inpagenav li a:visited { }
#pageindex li a:hover, #pageindex li a:active, #inpagenav li a:hover, #inpagenav li a:active {
text-decoration: underline; }
/*Page Index for targeted links within a page - like on calexhibits */
#pageindex {display: block;
background-color: #D4F7F7;
margin:  20px;
padding: 12px;
text-align: center; }
#pageindex ul {list-style-type: none;
margin: 0;
padding: 0; }
#pageindex li {display: inline;
margin: 0px;
padding: 0px;
/* font-size: 90%;
*/
     line-height: 1.3; }
/*Top of Page arrow*/
div.top a {display:block;
background-image:url(/graphics/style/top_exh.gif);
background-repeat:no-repeat;
float: right;
width: 70px;
height: 50px;
margin: 0px;
padding: 0px;
background-position: left center; }
/**/





/*Next/Prev Navigation - used in Gallery pages*/
#content #nextprev {
margin: 20px 20px 0px 20px;
clear: both; }


#contentwide #nextprev {
margin: 20px 20px 0px 20px;
clear: both; }
#nextprev a:link {text-decoration: none; }
#nextprev a:visited {text-decoration: none; }
#nextprev a:hover, #nextprev a:active {text-decoration: underline; }
#nextprev .prev {float:left;
padding:5px 10px 20px 10px; }
#nextprev .next {float:right;
text-align: right;
padding: 5px 10px 20px 10px }



/*FOOTER*/
#footer a#copyright {float:left;
padding:10px 10px 10px 10px;
text-decoration: none;
color: #ffff00; }
#footer a#comments {float:right;
padding:10px 10px 10px 10px;
text-decoration: none;
color: #ffff00; }
#footer p {clear:both;
margin:0;
padding: 0px 0px 0px 10px;
color: #ffffff; }
#footer {clear:both;
float:left;
background-image: url(/puijila/images/layout/ft_bg_a351.jpg);
padding: 20px 0px 0px 0px;
font-size: 90%;
width: 760px;
height: 129px; }


#ftphoto {
float:right;
padding: 0px 0px 0px 0px;
font-size: 90%;
width: 200px;
height: 129px; }


/*SPECIFIC FONT RELATED*/
.super {vertical-align:super;
display:inline !important;
font-size:9px; }
.sub {vertical-align:sub;
display:inline !important;
font-size:9px; }
.pub {font-family: "Times New Roman", Times, serif;
font-size: 1.2em; }
#content p.indent {padding-left:30px;
display:block;
/*width:650px;*/}
#content p.indent1 {padding-left:50px;
display:block;
width:650px; }
.nature {color: #ccffff;
font-weight:bold; }
.latin {font-style:italic; }
.smalltight {/*     font-size: 95%;
*/
     margin-top: 0px !important;
margin-bottom: 0px !important;
font-family:  Arial, Helvetica, sans-serif; }
.warning {background:#FFFF00;
color:#FF0000; }
/*For the Skip Nav link at the top of each page*/
.accessibility {display:none; }
/*PAGE SPECIFIC STYLES - INDCATE PAGE*/
/*FIP content*/
#fippage {margin:0 auto;
width:700px; }
#fip {font-size: 1.4em;
font-weight: bold;
margin: 0;
padding: 0; }
#fip a.e {display: block;
float: left;
margin: 5px 0;
padding: 5px 0 0 155px; }
#fip a.f {display: block;
float: right;
margin: 5px  0;
padding: 5px 190px 0 0; }
#fip #canada {float:left;
padding:0px;
margin: 15px 0;
clear: both; }
#fip #cmn {float:right;
padding:0px;
margin: 20px 0; }

/*Used in calexibit page*/
.min {
	font-size: .80em;
}

.pdf {
font-size: 80%;
display: block;
}



.white {
color:FFFFFF;
}

/*SPECIALITY*/
/*Reveal is for the disappearing layer javascript effect for curriculum links */
.reveal { text-decoration:underline; color:#FFFF99; cursor:pointer; margin-bottom:12px; display:block;}

img {border-color: #ffffff ;} 

/* Used for polls */
#poll p {margin: 5px 5px 0px 10px;
font-size: 0.8em;}

p.cap {color:#FFFFFF;
}