html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,
pre, form, fieldset, table, th, td { margin: 0; padding: 0; }

/* Elements de base
-------------------------------------------------------------- */
html * { font-size: 100.01% }
body { font-size: 62.5%;  /*(0.625 * 16px = 10px)*/
	font-family: Arial, Helvetica, sans-serif;color: #000;}
a { color: #035292; text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus { outline: 0;} /* Pour firefox*/
h1,h2,h3,h4,h5,h6 { font-weight: bold; margin: 0 0 0.25em 0; text-align: left;  }
h1 { font-size: 3em; }
h2 { font-size: 2em; }
h3 { font-size: 1.6em;}
p {margin: 0 0 1.5em; }
p, li, dt, dd { font-size: 12px; line-height: 1.5em; text-align: left; }
li ul, li ol  { margin:0 1em; }
ul, ol { list-style-type: none; margin: 0; padding: 0; }
img {border: none;}

/* Layout 
-------------------------------------------------------------- */
#container{width:760px;margin:30px auto 0 auto}
#navigation{float:left;width:350px}
#extra{float:right;width:410px}
#footer{clear:both;width:100%}

/* Habillage
-------------------------------------------------------------- */

#container{background: url(../images/page-fond.gif) repeat-y left top;}
#header {height:197px; background: url(../images/header-connexion.jpg) no-repeat left top; position: relative;}
#header p {margin: 0;}
#header p.logo-our-world a {text-indent: -3000px; display: block; width: 169px; height: 45px;
	position: absolute; top: 0; left: 0; color: black;}
#header h1 {text-indent: -3000px;}
#header p.slogan {position: absolute; top: 180px; left: 30px; color: black; font-weight: bold;}
#header p.slogan a {color: black; text-decoration: underline;}
#header ul { position: absolute; top: 27px; left: 390px; margin: 0; text-transform: uppercase;}
#header ul li { padding-left:0.8em;}
#header ul li a {color: #EDFFEC; }

#content {background: #EAEBE5; padding: 10px 0 20px 0;}
#content h2 {margin: 20px 0 0 30px;}
#content p {margin: 0 30px;}
#content #about {display: none; height: 90px;padding-bottom: 25px;}

#mediamovie {text-align: center;}

#navigation{background:#212121; color: white; }
#navigation img {border: 1px solid white; }
#navigation p, #extra p {font-size: 12px; margin-left: 30px; margin-right: 30px;  }
#navigation dl {margin: 20px 30px;}
#navigation dd {padding-left: 20px;}
#navigation #credits dt { text-transform: uppercase; margin: 10px 0 5px 0;}
#navigation #credits dd {padding-left: 30px;}

#navigation #scene dt, #navigation #participants dt { width: 106px; padding: 0; margin: 0 0 20px 0;float: left;}
#navigation #scene dd, #navigation #participants dd { margin-left: 110px; padding-top: 10px;}
dd.clear {margin: 0; padding: 0;}

#gallery { margin-left: 30px;}
#gallery li { clear: left}
#gallery li span.image { display: block; width: 106px; padding: 0; margin: 0 0 20px 0;float: left;}
#gallery li span.caption { display: block; margin-left: 115px; padding-top: 10px;}
#pagination {clear: both; padding-left: 180px; font-size: 12px;}
#pagination a.qp_disabled {color: #757575; cursor: default;}
#pagination a.qp_prev {padding-left: 30px;}
#pagination a {padding-left: 30px; border: none;}

#navigation div.tabs ul.tabNavigation {margin: 0 0 0 22px; } 
#navigation div.tabs ul.tabNavigation li {display: inline; }   
#navigation div.tabs ul.tabNavigation a { font-size: 12px; float: left;margin-bottom: 20px;
	padding: 15px 6px; font-weight: bold; text-decoration: none; }
#navigation div.tabs ul.tabNavigation a:hover,
#navigation div.tabs ul.tabNavigation a.selected {background: url(../images/tabnavhover.gif) no-repeat left top;} 


#extra{background:#000000; color: white;position: relative;}
#extra h2 {width: 130px; }
#extra .margin {padding: 12px 20px;}
#extra div.tabs2 ul.tabNavigation {position: absolute; top: 15px; left: 200px;}
#extra div.tabs2 ul.tabNavigation li {display: inline; margin-right: 15px; font-weight: bold;}
#extra div.tabs2 ul.tabNavigation li a {border-bottom: 1px solid #38342B;color: #FEBD51;  }
#extra div.tabs2 ul.tabNavigation a:hover,
#extra div.tabs2 ul.tabNavigation a.selected {color: white; border: none;} 
#extra dl {margin-top: 20px; } 
#extra dt { width: 106px; padding: 0; margin: 0 0 20px 0;float: left;}
#extra dd { margin-left: 110px; padding-top: 10px;}
#extra dd.clear { border-bottom: 1px solid #222222; margin: 0 0 20px 0; padding: 0;}
#extra dd ul li {margin-left: 20px; padding-left: 25px; }
#extra dd ul li.title {background: url(../images/puce-extras.gif) no-repeat left top; margin-bottom: 10px; font-weight: bold;}
#extra dd ul li.title a {color: #FEBD51;}
li.description {color: #FEBD51; font-size: 10px;}
li.description span.length {color: #FFFFFF;}
#navigation a, #extra a {color: #FFCC66;}

#footer {width:100%; background: #333333; color: white;clear:both;}
#footer a {color: white; text-decoration: none;}
#footer h3 {font-size: 18px; line-height: 1.8em; color: #FFFFFF; margin-bottom: 40px;}
#footer dt {text-indent: -3000px;}
#footer dt a {display: block;background: url(../images/logo-onf.gif) no-repeat left top; height:37px; width:78px; float: left; margin-right: 15px;} /* logo onf */
#footer ul {margin: 10px;}
#footer li {display: inline; font-size: 12px}
#footer dd {font-size: 12px;}
#footer p#logoCanada {text-indent:-3000px; width: 100px; height: 33px;
	background: url(../images/logo-canada.gif) no-repeat left top; position: absolute; 
	left: 800px; top: 100px; }
#footer .margin {width: 900px; margin: 0 auto;padding: 20px; position: relative;}


/* Classes generiques
-------------------------------------------------------------- */
.left { float: left; display:inline; margin-right: 1em; margin-bottom: 0.15em;  }
.right { float: right; display:inline; margin-left: 1em; margin-bottom: 0.15em;  }
.center { text-align:center; margin: 0.5em auto }
.hide { display: none; }
.top { margin-top: 0; padding-top: 0; }
.bottom { margin-bottom: 0; padding-bottom: 0; }
.clear {clear: both}
.margin {padding: 20px 30px}

/* Liste horizontale et fil d'ariane
-------------------------------------------------------------- */

ul.horizontal li { display:inline; font-size: 1.1em;}
ul.horizontal li a  { color: #333; padding: 0 5px 0 0; margin: 0;}
ul.horizontal.ariane { margin-bottom: 15px;color: #666;}
ul.horizontal.ariane li a  { padding: 0;color: #666;}