html {
   padding:0;
   margin:0;
}

body {
	font-family: 'Arial'; 
	font-size: 12px; 
	text-decoration: none; 
	margin: 0;
	vertical-align: bottom;
}	

h1 {
	font-size: 28px; 
	color: #8B0000; 
	text-align: center; 
	font-family: Arial; 
	font-style: italic; 
	font-weight: bold; 
	margin:10px 10px 0 0; 
}

h2 {
	font-size: 20px;
	text-decoration: underline;
	color: #8B0000;
	text-align: center;
	font-family: Arial;
	font-weight: bold;
	margin:5px 0 0;
}

h3 {
	font-size: 16px;
	text-align: left;
	color: #8B0000;
	font-family: Arial; 
	font-weight: bold;
	margin:10px 0 5px 20px;
}

h4 {
	font-size: 10px;
	color: #8B0000;
	text-align: left;
	font-family: Arial; 
	margin: 0;
	}

img { border: none; }

b         { color: #ff7f00; font-weight: bold; }
b.bleu    { color: #1A60A2; font-weight: bold; }
b.attente { color: #8B0000; font-weight: bold; }
b.erreur  { color: #FF0000; font-weight: bold; }
b.ok      { color: #00C000; font-weight: bold; }


p.center {
	font-size: 12px;
	text-align: center;
	margin: 0;
}

p.tbl {
	font-size: 12px;
	margin: 2px 0 0 4px;
}

p.tblr {
	font-size: 12px;
	text-align: right;
	margin: 2px 0 0 4px;
}

DIV.tbl p {
	font-size: 12px;
	text-align: left;
	margin: 0;
}

p.menu {
	font-size: 12px;
	text-align: center;
	margin: 5px 0 0 5px;
}

p.menu0 {
	font-size: 12px;
	text-align: left;
	margin: 5px 0 0 5px;
}

p.menu1 {
	font-size: 12px;
	text-align: left;
	margin: 5px 0 0 15px;
}

p.menu2 {
	font-size: 11px;
	text-align: left;
	margin: 5px 0 0 35px;
}

p.menu3 {
	font-size: 11px;
	text-align: left;
	margin: 5px 0 0 55px;
}

a:link { 
	color: #1A60A2; 
	text-decoration: none;
	font-weight: bold;
}

a:visited { 
	color: #1A60A2; 
	text-decoration: none; 
	font-weight: bold;
}

tfoot {
	height: 542px;
	overflow: auto;
}

p.pdp  {
	font-size: 12px;
	text-align: center;
	margin: 5px 0 0 5px;
}

/**************** CSS MDO **********************/


.cache {
   display:none;
}

.hide {
	visibility:hidden;
}

.important {
   font-weight:bold;
   color:#ff7f00;
}

hr {
    border-style:dashed;
	border-color:#666666;
	border-width:1px;
}

a {
	color:#3468d2;
	font-weight:bold;
	text-decoration:none;
}

.aere li {
	padding-bottom:10px;
}


.bloc_centre {
	text-align:center;
}

a img {
	border:0;
}

.nolilipuce ul {
	padding-bottom:15px;
}

.nolilipuce li {
	vertical-align:middle;
}

.nolilipuce li li {
	list-style-type:none;
	clear:both;
}

.nopucetab, .nopucetab  li{ margin:0; padding:0}
.nopucetab li {
	list-style:none;
	min-height:120px;
}

/* CSS des cadres principaux*/
   /* Entete */
#header {
   background-image: url(../images/templates/fond_banniere.jpg);
   width : 990px;
}



/* Entete principal */
#mainHeader {
   background-image: url(../images/templates/banniere.jpg);
   background-repeat: no-repeat;
   height:127px;
}

   /* Footer */
#footer {
   min-height:20px;
   _height:20px;
   background-image: url(../images/templates/footer.jpg);
   clear:both;
   text-align:center;
   padding-top:7px;
   width:990px;
}


 
   /* page principale */
#main {
	background-image:url(../images/templates/main_bg.jpg);
	overflow:hidden; 
	_overflow:visible;
	zoom:1;
	padding-top:2px; /* on rajoute une marge en utilisant le padding car à cause du overflow:hidden on ne peut pas faire de marge negatives usr les colonnes */
	width:990px;
}

#main h3 {
	text-align:center;
	color:#187037;
}

	/* blocs de la partie principale*/
   /* colonne de gauche */
div#navcol {
   font-size:11px;
   width: 190px;
   float: left;
   padding-left:5px;
   min-height:500px;
   color:#3468d2;
   margin-right: 5px;
   margin-top:-2px; /*marge negative sur la colonne de gauche pour la coller au header*/
}

#navcol ul {
   margin:0;
   padding:0;
   padding-left:5px;
}

#navcol ul ul{
   border:0;
}

#navcol li {
    list-style-type:none;
   	padding-top: 2px;
	padding-bottom: 2px;
	margin:0;
	padding-left:0;
}

#navcol li li {
    padding-left:10px;
}
     
#navcol li a{
	text-decoration:none;
	display:block;
	padding-left:15px;
}

#navcol li img {
	vertical-align: middle;
	border:none;
	text-decoration:none;
	float:left;
	margin-top:2px;
}

#navcol h1 {
	font-size : 16px;
	font-weight:bold;
	color:#3468d2;
}

/* CSS pour le menu de gauche */
#navcol .open {
	display: block;
}
	
#navcol .closed {
	display: none;
}
	
#navcol a:hover {
	color: #ff7f00;
}

#navcol a.nodeSelected {
	background-color: #c0d2ec;
}

div.first {
	color:#000000;
	background-color:#FFFFFF;
	border: thin solid #CCCCCC;
	margin : 5px;
	text-align:justify;
	_overflow:visible; 
	zoom:1;
	padding:2px;
	width:564px;
}

div.firstSSBorder {
	overflow:hidden; 
	_overflow:visible; 
	zoom:1;
}

div.second {
	color:#000000;
	border: thin solid #CCCCCC;
	margin : 5px;
	margin-left:10px;
	text-align:justify;
	padding:2px;
}

.blocHeader {
	background-image: url(../images/templates/header.jpg);
	color:#ffffff;
	font-weight:bold;
	font-size :13px;
	height:25px;
	line-height : 25px;
	vertical-align:middle;
	padding-left : 5px;
}

.blocTitle {
	background-image: url(../images/templates/title.jpg);
	color:#000000;
	font-weight:bold;
	font-size :13px;
	height:25px;
	line-height : 25px;
	vertical-align:middle;
	padding-left : 5px;
        min-width:2px;
}

.blocContent {
	padding:10px;
}

#bloc_right {
	float:right;
	width:220px;
        min-height:500px
}

#bloc_right a:hover {
	color: #ff7f00;
}

.little_right {
	width:205px;
	border: thin solid #CCCCCC;
	min-height:150px;
	padding:2px;
	margin-left: 5px;
	margin-top:5px;
	margin-right:10px;
}

/*#navcol, #bloc_right, .first  {
	padding-bottom:100000px; 
	margin-bottom:-100000px;
}*/

.logoLeft {
	vertical-align:middle;
	float:left;
	width : 110px;
	padding-top:10px;
	text-align:center;
}

.textRight {
	text-align: justify;
	vertical-align:middle;
	overflow:hidden; 
	_overflow:visible;
	zoom:1;
	min-height:100px;
	_height:100px;
}

/* CSS du menu horizontal */
.menu {
	position:absolute;
	top:100px;
	left:120px;
	display:block;
	margin:0;
	padding:0;
}

.menu ul {
   position:absolute; /* pour sortir la liste du flux de donnée */
   display:block;
   /*width:120px;*/
   margin:0;
   padding:0;
}
    
.menu li {
   list-style:none;
   font-size:12px;
   height:23px;
   display:block;
   float:left;
   margin:0;
   padding-left:8px;
   padding-right:8px;
   margin:2px;
}

.menu .cat1:hover{
   /*background-color: #FFFFFF;*/
}

.menu a {
   text-align:left;
   color:#3126bf;
   display:block;
   height:18px;
   text-decoration:none;
   padding-left:10px;
   padding-right:10px;
}
    
.menu li a { 
   /*background-color: #9FFCCB;*/
   padding-top:4px;
}

.menu li a:hover { 
	background-color: #3468d2;
	color:#FFFFFF;
}

   /* for a mozilla better display with key nav */
.menu a:focus {
   background-color: #DDDD63;
}

   /* hide some accessibility stuff */
.menu span {
   display:none;
}

   /* correct a little IE bug */
* html .menu li li {
   display:inline;
}


/* css du tableau des auteurs */
#tabauteurs {
	width:100%;
	padding:1px;
   	margin:0;
	text-align : justify;
}

#tabauteurs td {
	border: 1px solid #CCCCCC; 
}

#tabauteurs .aut {
	vertical-align:top;
}

div#txt_hutopy {
	display: block;
	text-align: left;
}

div#ban_hutopy img {
	display: block;
	border: none;
	margin: 0 auto;
}

#reportage_ligne1 {
	margin-left:120px;
}
#reportage_ligne4 {
	margin-left:80px;
}
#reportage_ligne1 a, #reportage_ligne2 a, #reportage_ligne3 a, #reportage_ligne4 a {
	font-size: 11px;
}
.reportage_carte1 {
	float: left;
	background:transparent url(images/acceuil.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:35px;
width:60px;
	padding-left: 15px;
}
.reportage_carte2 {
	float: left;
	background:transparent url(images/soleil.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:35px;
	width:60px;
	padding-left: 15px;
}
.reportage_carte3 {
	float: left;
	background:transparent url(images/monde.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:100px;
	width:50px;
	padding-left: 15px;
}
.reportage_carte4 {
	float: left;
	background:transparent url(images/buvette.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 15px;
	margin-left: 35px;
}
.reportage_carte5 {
	float: left;
	background:transparent url(images/enfance.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 15px;
}
.reportage_carte6 {
	float: left;
	background:transparent url(images/cle.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:23px;
	width:50px;
	padding-left: 10px;
}
.reportage_carte7 {
	float: left;
	background:transparent url(images/animlibre.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:23px;
	width:50px;
	padding-left: 10px;
}
.reportage_carte8 {
	float: left;
	background:transparent url(images/figurines.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:45px;
	padding-left: 15px;
}
.reportage_carte9 {
	float: left;
	background:transparent url(images/cartes.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:15px;
	width:50px;
	padding-left: 5px;
}
.reportage_carte10 {
	float: left;
	background:transparent url(images/sarakro.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 15px;
	margin-left: 35px;
}
.reportage_carte11 {
	float: left;
	background:transparent url(images/geant.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 15px;
}
.reportage_carte12 {
	float: left;
	background:transparent url(images/tournoi.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:23px;
	width:50px;
	padding-left: 10px;
}
.reportage_carte13 {
	float: left;
	background:transparent url(images/animperm.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:23px;
	width:50px;
	padding-left: 10px;
}
.reportage_carte14 {
	float: left;
	background:transparent url(images/auteurs.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 15px;
}
.reportage_carte15 {
	float: left;
	background:transparent url(images/jdr.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:30px;
	width:50px;
	padding-left: 10px;
}
.reportage_carte16 {
	float: left;
	background:transparent url(images/gn.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 10px;
	margin-left: 35px;
}
.reportage_carte17 {
	float: left;
	background:transparent url(images/carrom.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 10px;
}
.reportage_carte18 {
	float: left;
	background:transparent url(images/boutique.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 10px;
}
.reportage_carte19 {
	float: left;
	background:transparent url(images/expo.jpg) no-repeat 0px 0px;
	padding-top:110px;
	padding-right:18px;
	width:50px;
	padding-left: 10px;
}
.reportage_spacer {
	clear: right;visibility:hidden;
}
.reportage_copy {
	position: relative;
	text-align: right;
	font-size:9px;
}
.reportage_thumbs img {
	padding:5px;
}
.reportage_retour {
	text-align:center;
}
ul.reportage {
	margin-left:150px;
	margin-top:50px;
}
li.reportage_logo {
	display : list-item;
	list-style-image : url(../images/historique_2010reportage/logos/mascotte.png);
}
li.reportage_stats {
	display : list-item;
	list-style-image : url(../images/historique_2010reportage/logos/chart_pie.png);
}
li.reportage_coeur {
	display : list-item;
	list-style-image : url(../images/historique_2010reportage/logos/heart.png);
}
li.reportage_video {
	display : list-item;
	list-style-image : url(../images/historique_2010reportage/logos/television.png);
}
li.reportage_presse {
	display : list-item;
	list-style-image : url(../images/historique_2010reportage/logos/book_open.png);
}
li.reportage_livre {
	display : list-item;
	list-style-image : url(../images/historique_2010reportage/logos/emoticon_grin.png);
}