/* css du site animactions.org */
/* titre du fichier : animactions.css*/


	
body
{
	font: 11px verdana, sans-serif;
	background:#000000;
	margin: 0;
	padding: 0;
	text-align: center; /* pour corriger le bug de centrage IE */
}


/*Pour positionner le site au milieu de la page */

#global {
     margin-left: auto;
     margin-right: auto;
	 background:transparent url("imcss/bandeau_haut.jpg") no-repeat;
	 background-color:#444141;
     width: 961px ;
     text-align:left; /* on rétablit l'alignement normal du texte */
     }
	 
	 
	 
/* Le bloc conteneur(global) du site est positionné au milieu de la page. Il est composé de deux bloc: le bloc 01(haut) et le bloc 02(bas)*/	 
/* Bloc conteneur01 (haut)---------------------------------------------------------------------------------------------------*/	 
/*Bandeau-haut */
 
div#bloc01 {
	width: 961px;
	height:185px;


}

div#titre {
position:relative;
left:20px;
width:270px;
height:auto;
}



/* Formulaires loggin et moteur de recherche----------------------------------------------------------------------------------------*/
/* menu utilisateur*...................................*/
div#utilisateur {
position:absolute;
left:622px;
top:6px;
width:340px;  
}




/* Moteur de recherche*/
.moteur_recherche {
position:absolute;
left:620px;
top:24px;
width:350px;
}




/* Menu de navigation horizontal......................*/

/* Style du menu déroulant*/
.menuDeroulant
{
	width: 500px;
	list-style-type: none;
	float:left;
	margin: 0px;
	left: 0px;
	top: -2px;

}

div#flash{ width:400px;
           height:120px;
		   float:left;
		   margin-left:15px;
		   margin-top:40px   
}	

.menuDeroulant li
{
 float: left;
 width: 100px;
 margin: 0;
 padding: 0;
 border: 0;
}

/* Style des sous menu déroulant*/
.menuDeroulant .sousMenu
{
 display: none;
 list-style-type: none;
 margin: 0;
 padding: 0;
 border: 0;
}
.menuDeroulant .sousMenu li
{
 float: none;
 margin: 0;
 padding: 0;
 border: 0;
 width: 100px;
 border-top: 1px solid transparent;
 border-right: 1px solid transparent;
}
/* Style des liens sous menu déroulant*/

.menuDeroulant li a:link, .menuDeroulant li a:visited
{
 display: block; 
 height: 1%;
 color: #FFF;
 background:transparent url("imcss/nav.gif") repeat;
 margin: 0;
 padding: 4px 8px;
 border-right: 1px solid #fff;
 text-decoration: none;
}
.menuDeroulant li a:hover { background:transparent url("imcss/nav_hover.gif") repeat; }
.menuDeroulant li a:active { background:transparent url("imcss/nav_hover.gif") repeat; }

.menuDeroulant .sousMenu li a:link,
.menuDeroulant .sousMenu li a:visited
{
 display: block;
 color: #FFF;
 margin: 0;
 border: 0;
 text-decoration: none;
 background: transparent url("imcss/nav_transparent.png") repeat;
}
.menuDeroulant .sousMenu li a:hover
{
 background-image: none;
 background-color:#E50083;
}
.menuDeroulant li:hover > .sousMenu { display: block; }
/* Fin du menu de navigation horizontal...................................................*/




/* Fin bloc conteneur haut---------------------------------------------------------------------------------------------------*/



/* Contenu éditorial de la page : le contenu éditorial est contenu dans le bloc conteneur02 qui comprend également le bandeau bas(en arrière plan)---------------------------------------------------------------------------------------------------------------------*/

/*bloc 02 (= contenu éditorial)*/

div#bloc02 {
	padding-bottom: 110px;
	background: transparent url("imcss/bandeau_bas.jpg") bottom left no-repeat;
	padding-left: 10px;
	text-decoration: none;
	color: #FFFFFF;
	padding-right: 10px;
}



/*Propriétés générales du contenu éditorial.....................................*/
/* Paragraphes*/
p { 
	margin-top: 0; 
	text-align: justify;
	margin: 0 10px
	}

p.gauche { 
	margin-top: 0; 
	text-align: left;
	margin: 0 10px
	}
	
p.centre {
	margin-top: 0;
	text-align: center;
	}
	
p.legende{
	margin-top: 0;
	font-size:9px;
	}
	
p.captcha{
	margin-top: 0;
	font-size:9px;
	color:#666666 ;
	}

p.ancre{
	text-align: right;
	color: #B7A5DF;
	text-decoration:underline;
	font-size:9px;
	}

p.date{
	text-align: right;
	text-decoration:none;
	font-size:9px;
	}
	

p.auteur{
	text-align: right;
	font-size:10px;
	font-weight: bolder;
	}
	
/* Rollover d'images en css(effet d'aggrandissement) */

p.thumb{
		float:left;
		margin-left:10px;
		margin-right:10px;
		border:1px solid #999;	
		padding:2px;
	}
	p.thumb a{
		display:block;
		float:left;
		width:100px;
		height:100px;
		line-height:100px;
		overflow:hidden;
		position:relative;
		z-index:1;	
	}	
	p.thumb a img{
		float:left;
		position:absolute;
		top:-20px;
		left:-50px;	
	}
	
	/* mouse over */
	
		p.thumb a:hover{
			overflow:visible;
			z-index:10;
			border:none;		
		}
		p.thumb a:hover img{
			border:1px solid #999;	
			background:#fff;
			padding:2px;			
		}	
	

/* Fin rollover css */


img {
	border: none;
	text-align: left;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 9px;
	padding-top: 10px;
}


img.bouton {
	border: none;
	text-align: left;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-top: 0px;
}


/* Diaporama Lightbox */

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 0px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 50;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(images/blank.gif) no-repeat; 
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif)right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	 background: url(images/closelabel.gif)right 15% no-repeat;}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}

/* Fin diaporama Lightbox */

hr {
	color:none ;
}

/* Liens*/
a:link { 
	text-decoration:none; 
	color: #B7A5DF;
	}
a:visited { 
	text-decoration: none; 
	color: #D4CDDC;
	}
a:hover{ 
	text-decoration: none; 
	color: #E50083;
	}

/* Style des titres */
h1,h2, h3, h4{margin: 0 10px}
h1{
	font-size: 20px;
	font-weight:bold;
	color: #FFF;
}
   
h2{
   font-size:16px;
   color: #F5AD48;
}

h3 { 
	font-size:12px; 
	color:#F5AD48;
	}


/* formulaires */

.submit {
	margin-left: 100px;
	   }
/*Fin propriétés générales du contenu éditorial.....................................*/

/* menu de ressources vertical ...........................................................*/
#ressources{
	width: 198px;
	list-style-type:none;
	background:transparent url("imcss/ressources.gif") repeat;
	height: 650px;
	float: left;
	
}

#ressources ul {
	margin: 0;
	padding: 0;
	}


#ressources li{
	line-height: 1.5ex;
	display: block;
	padding-top: 5px;
	padding-left: 20px;
	margin-left: 15px;
	margin-bottom: 5px;
	list-style-type: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#FFFFFF;
	background:transparent url("imcss/puce_ressources.png") top left no-repeat;
}


#ressources li a:link {
	color:#FFFFFF;
}
	
#ressources li a:hover {
	color:#F5AD48;
}
	
/* Fin du menu de ressources vertical..................................... */


/*Contenu éditorial.....................................*/

div#editorial{
	background: #595858;
	width: 530px;
	position: relative;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

/*Pour avoir un fond avec des bords arrondis*/
b.rtop, b.rbottom{display:block;background:#444141}
b.rtop b, b.rbottom b{display:block;height: 1px;
    overflow: hidden; background: #595858}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}



div#droit{
	background: #595858;
	width: 170px;
	float: right;
	margin-right: 10px;
	margin-top: 10px;
}



div#en_tete{
	background:#E50083;
	width: 530px;
}


div#visionnage{
	background:transparent url("imcss/tele.jpg") center no-repeat;
	width: 530px;
	text-align:center;
}

/* Formulaires */




/*formulaire loggin*/
form{
     width:129px ;
	}
	
input {
	   margin:3px;
       border:1px solid #878bab;
       background:#cccccc;
       font-family:"arial",sans-serif;
	   font-size:12px;
	   text-indent:5px;

}

input[type=submit], input[type=reset] {
margin:5px;
border:2px outset #878bab;
font-weight:bold;
cursor:pointer;
}
input[type=submit]:hover, input[type=reset]:hover {
border:2px outset white;
background-color:#3399cc;
}
input[type=submit]:active, input[type=reset]:active {
border:2px inset #A6BEDE;
background-color:#A6BEDE;
color:black;
}