/* CSS Document */

@charset "utf-8";
body {
	font: 84% Tahoma, Verdana, Arial, Helvetica, sans-serif;
	margin: 0; /* il est conseillé de mettre à zéro la marge et le remplissage de l'élément body, pour tenir compte des différentes valeurs par défaut des navigateurs */
	padding: 0;
	text-align: center; /* ce paramétrage centre le conteneur dans les navigateurs IE 5.x. Le texte est ensuite aligné à gauche (valeur par défaut) dans le sélecteur #container */
	color: #fff;
	background-color: #000;
    }
	
	#page {
	width: 70em;
	margin: 0 auto; /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
	text-align: left; /* ce paramétrage annule le paramètre text-align: center de l'élément body. */
	background-color: #000;
    } 
    
	#conteneur { width: 100%;
	}
	
	#entete {
	height: 6.3em;
	/*padding: 0 10px;   ce remplissage correspond à l'alignement à gauche des éléments des div qui apparaissent en dessous. Si, au lieu de texte, c'est une image qui est insérée dans l'élément #header, il est conseillé de supprimer le remplissage. */
	background-color: #000;
	border-bottom:solid 2px #FC3;
  	} 
    
 
 <!-- suppression cadre image cliquable firefox -->
a{outline: none;}
:focus{-moz-outline-style: none;}
 
 
 /*  Habillage du bloc menu (barre de mavigation horizontale)
/*  ------------------------------------------ */
	#menu { 
	margin: 0;
	}
	#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
	}
	#menu ul li {
	display:inline; 
	}
	#menu ul li a {
	margin:4.4em 0px 2px 0px;
	display:block; 
	float:left; 
	text-decoration:none; 
	padding:6px 18px;
	}
	*> #menu ul li a{  /* Internet Explorer 7     */
	!position:relative;
	}
	#menu ul li a.on {
	margin:4.4em 0px 2px 0px;
	display:block; 
	float:left; 
	text-decoration:none; 
	font-size:1em; 
	padding:6px 18px;
	}
	*> #menu ul li a{  /* Internet Explorer 7     */
	!position:relative;
	}
	#menu #contact a{
	width:50px;
	margin:4.8em 0px 0px 260px;
	float:left; 
	background:url(logo/contact_n1.png) no-repeat left bottom;
	text-decoration:none; 
	font-size:1em; 
	padding:8px 18px;
	}
	
	*> #menu #contact a{  /* Internet Explorer 7 */
	!position:absolute;
	!margin:45px 0px 0px 260px;
	}
	#menu #contact a:hover {
	width:50px;
	background:url(logo/contact_n2.png) no-repeat left bottom; 
	}
		
	#logo_site {
	margin:42px 12px 0px 0px;
	float: right;
	height: auto;
	width: auto;
	} 
     
	 /* colonne droite*/
	#conteneur #live {
	float: right; 
	width: 17em; 
	padding: 0px; 
	margin:0px 0px 0px 10px;
	}
    	    
    /* mise en page photo du mardi dans live*/
	.photomardi {
	width: 16em;
	padding:8px 0px 5px 0px;
	text-align:left;
	}
	.photomardi img.spip_logos {
	height: 135px;
	width: 180px;
	padding: 3px;
	margin: 0px 0px 0px 14px;
	border: 1px solid #666;
	}
		
	/* mise en page sites amis dans live */	
	.sitesamislive {
	display:block;
	width: 16em;
	padding:10px 0px ;
	}
	.sitesamislive .spip_logos {
	display:inline;
	height: 40px;
	width: 40px;
	float:left;
	text-align:center;
	}
	
	/*  mise en page que font nos amis dans live*/
	.nosamis {
	width: 16em;
	padding:10px 0px ;
	color:#fff
	}
	.nosamis #documents_joints {
	height: 135px;
	width: 180px;
	margin: 0px 0px 8px 14px;
	padding: 3px;
	border: 1px solid #666;
	}
	
	/*  mise en page Myspace dans live*/
	.myspace {
	width: 16em;
	text-decoration:none;
	border-top:1px solid #FFFFFF;
	font-size:1em;
	padding:2px;
	margin-top: 10px;
	font-weight: bold;
	}	
		
    #conteneur #sommaire {
	margin: 18px 18.4em 10px 10px; /* La marge gauche doit être identique à celles de l'en-tête et du pîed de page pour qu'elles soient alignées correctement. */
	} 
    /* decale les blocs vers la gauche*/
	#sommaire ul {
	width: 100%;
	padding:0 ;
	margin: 0;
	}
	#sommaire ul li{
	list-style-type: none;
	width: 22em;
	float: left;
	padding:0 15px 40px 0px;
	margin: 8px 20px 20px 10px;
	}
	/* rechercher astuce pour opera*/
	#sommaire ul li span.ArtDescriptif {
	display: block;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	text-align:justify;
	padding:5px 0px 5px 0px;
	line-height: 1.3em;
	color: #fff;
	}
	#sommaire ul li img.spip_logos {
	height: 180px;
	width: 135px;
	padding: 3px;
	margin: 10px 3px 3px 2px;
	border: 1px solid #666;
	float: right;	
	}
		
	/* mise en page rubriques*/
	#conteneur #rubrique {
	margin: 18px 18em 10px 10px; /* La marge gauche doit être identique à celles de l'en-tête et du pîed de page pour qu'elles soient alignées correctement. */
	}
	 
    /* decale les blocs vers la gauche*/
	#rubrique ul	{
	width: 100%;
	padding:0 ;
	margin: 0;
	}
				
	#rubrique ul li{
	list-style-type: none;
	width: 23em;
	height:250px;
	float: left;
	padding:0 0 0 0px;
	margin: 8px 20px 20px 10px;
	}

	#rubrique ul li span.ArtDescriptif {
	display: block;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	text-align:justify;
	font-size: 0.9em;
	margin: auto;
	line-height: 1.3em;
	color: #fff;
	}

	#rubrique ul li img.spip_logos {
	/*height: 100px;
	width: 135px;*/
	padding: 3px;
	margin: 15px 10px 0px 2px;
	border: 1px solid #666;
	float: left;
	}
		
	/* lien article flèche*/
	a.ArtLien {
	float:right;
	display: block;
	padding: 5px;
	}
	a:hover.ArtLien {
	float:right;
	display: block;
	padding: 5px;
	} 
	
	/*  mise en page articles*/
	#conteneur #article {
	margin: 18px 18em 10px 10px; /* La marge gauche doit être identique à celles de l'en-tête et du pîed de page pour qu'elles soient alignées correctement. */
	} 
        
	#contenu {
	width: 100%;
	padding:0 ;
	margin: 0;
	}
				
	#texte {
	width: 23em;
	float: left;
	text-align:justify;
	padding:0px;
	margin: 8px 40px 20px 10px;
	}
	
 	#autre {
	width: 46em;
	float: left;
	text-align:justify;
	padding:0px;
	margin: 8px 40px 20px 10px;
	}
	
	#diapo {
	width: 23em;
	float: right;
	padding:0 0 0 0px;
	margin: 8px 10px 20px 10px;
	}
		
	#diapo #documents_portfolio {
	width: 23em;
	float: right;
	padding:0 0 0 0px;
	margin: 0px 20px 20px 10px;
	text-align:left;
	}
	
	#diapo #documents_portfolio a img {border:#FFFFFF 4px solid;} /* bordure blanche autour de l'image */
	/*#article #documents_portfolio {
	clear: both;
	margin-top: 2px;
	padding-top: 2px;
	border-top: 2px solid #333;
	}*/
		
	#la_video {
	list-style-type: none;
	width: 23em;
	float: right;
	padding:30px 0 0 0px;
	margin: 8px 20px 20px 10px;
	}
	
	/*  mise en page dbl impact*/
	#conteneur #double_impact {
	margin: 18px 18em 10px 10px; /* La marge gauche doit être identique à celles de l'en-tête et du pîed de page pour qu'elles soient alignées correctement. */
	background-color: #000;
	}
				
	#double_impact #txt_photo {
	z-index:100;
	float:left;
	padding-left:100px;
	}
	
	/*  mise en page photo mardi*/
	#conteneur #diaporamamardi {
	margin: 18px 18em 10px 10px; 
	background-color: #000;
	}
	
	#flashcontent {
	margin: 0px 0px; 
	float: left;
	}
	
	/* mise en page sites amis*/	
	#sites{
	float:left;
	width:22em;
	background-color:#000;
	margin:5px 10px;
	padding:2px;
	border:solid 1px #262626; 
	}
	
	#sites .spip_logos {
	float:left;
	height: 40px;
	width: 40px;
	padding: 3px;
	margin: 0px 30px 0px 0px;
	border: 1px solid #666;
	}
	
	#sites .txt {
	display:block;
	padding:5px ;
	margin: auto;
	color:#99CC33;
	background-color:#CCCC00;
	float:right
	}
	
	
	/*  documents joints
	#documents_joints {
	height: 135px;
	width: 180px;
	margin: auto;
	padding: 3px;
	border: 1px solid #666;
	text-align:center;
	}*/
	
	/*  Portfolio
---------------------------------------------- */
	/*#documents_portfolio {
	background-color: #f0f;
	clear: both;
	margin-top: 1.4em;
	padding-top: 2px;
	border-top: 2px solid #333;
	}


	#document_actif { margin-top: 1em; }*/


/*  Listes de documents joints (a un article ou une rubrique)
---------------------------------------------- */
/* #documents_joints {
	margin-top: 1.4em;
	padding-top: 2px;
	border-top: 2px solid #CCC; }
#documents_joints h2 { margin-bottom: 0.4em; font-size: 0.88em; font-weight: bold; }
#documents_joints ul { margin: 0; padding: 0; list-style: none; }
#documents_joints li { margin-bottom: 0.4em; }
#documents_joints li .spip_doc_titre {}
#documents_joints li .spip_doc_titre small { font-weight: normal; }
#documents_joints li .spip_doc_descriptif {}*/
	
	#pied {
		margin: 5px 0px;
		padding: 5px 10px; /* ce remplissage correspond à l'alignement à gauche des éléments des div qui apparaissent au-dessus. */
    	background:#000; 
    	text-align:center;
		border-top:#FFCC33 solid 1px;
		color:#FFCC33;
		} 
    
	#pied p {
    	margin: 0; /* la mise à zéro de la marge du premier élément du pied de page permet d'éviter une possible disparition de la marge 																																				(espace entre les éléments div) */
    	padding: 10px 0; /* l'utilisation d'un remplissage pour cet élément crée un espace, tout comme une marge l'aurait fait, mais en 		évitant le risque de disparition de la marge */
    }
    
        
    .nettoyeur { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */
    	clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    }
	
	h1{
	font-size: 1.4em;
	color:#333;
	padding: 0 0 1px 0px;
	font-family:Tahoma;
	border-bottom:inset #333 .8px;
	font-weight:100;
	}
	
	h3{
	font-size: 0.9em;
	font-weight:bold;
	color:#fff;
	padding: 4px 0px;
	border-top:solid 1px #fff; 
	margin-right : 150px;
	}
	
	h2{
	font-size: 0.9em;
	font-weight:bold;
	color:#fff;
	padding: 4px 0px;
	border-top:solid 1px #fff; 
	}
		
	h4{
	font-size: .8em;
	color:#FFFFFF;
	padding: 5px 10px;
	}
	
	img {border:none;}
	
/*  Couleurs des liens */
a { text-decoration: none; color: #fc3; }
a:hover { text-decoration: underline; }