@charset "UTF-8";
/* CSS Document */




 body  {

    	font:  .7em Verdana, Arial, Helvetica, sans-serif;
		
		color: #000000;
    	background: #FFFFFF;

    	margin: 0; 
    	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 */

    }
	body a {
	color: #663300;
	font-weight:bold;
	
	}


 
/*///Element de formulaire*/
       #container { 
	 margin-left:auto;
     margin-right:auto;
     width: 700px;

    	background: #FFFFFF;

    	/*margin: 0 auto;  les marges automatiques (et dotées d'une largeur positive) centrent la page si nécessaire */

    	text-align:justify; /* ce paramétrage annule le paramètre text-align: center de l'élément body. */

    }  

	
	
	   #header {
		height:85px;
		background-image: url(haut.jpg);
		background-position:bottom left;
		background-repeat:no-repeat;
    	padding: 0 0px;  
    } 

       #header h1 {
        color:#666666;
    	margin:0px ; 
	padding: 10px 0 10px 10px; 
	
    }

    


       #sidebar1 {

    	float:left; 
		
		text-align:right;
    	width: 12em; /*cet élément est flottant, il faut donc lui attribuer une largeur */
		padding: 0px 0px 0px 0px; 
		margin: 0px 0px 0px 0px; 

    }
	
	
	#sidebar1 li a {

text-decoration: none;



}
	#sidebar1 ul {
	
	list-style: none ;
	text-align:left;
	margin: 25px 0px  0px 35px;
    padding: 0px 0px  0px 0px;
	float:left;
	}
	
	#sidebar1 img{
	float:right;
	
	}
	#sidebar1 li {
	width:140px;
	margin: 10px 0px  0px 0px;
    padding: 0px 0px  0px 0px;
	
	
	}


       #sidebar2 {

    	float: right;
		width: 200px; /* cet élément est flottant, il faut donc lui attribuer une largeur */
		
		
		background: transparent;
		
		margin: 35px 0px  0px 0px;
    	padding: 0px 0px  0px 0px; 

    }
	#sidebar2 img{
	margin: 5px 0px  0px 0px;
	}

       #sidebar1 h3,    #sidebar1 p,    #sidebar2 p,    #sidebar2 h3 {

    	margin-left: 0px; 

    	margin-right: 0px;

    }
	#mainContent ul li a{text-decoration:none;
	
}

#mainContent ul li {margin-bottom:5px;
}
 #mainContent ul li a span{   
font:1em Verdana, Arial, Helvetica, sans-serif;
		
		color: #000000;}
   
       #mainContent { 
	
 
     	margin: 35px 230px 25px 150px ;
		/*padding: 0px 150px 0px 230px ;  la marge droite peut être indiquée en ems ou en pixels. Elle crée l'espace dans la partie inférieure du côté droit de la page. */ 

    	/*padding: 0px 230px 0px 170px;  ce remplissage permet de créer un espace vide à l'intérieur du cadre. */

    } 

       #footer { 

    	margin: 0px 0px 0px 0px;  /* ce remplissage correspond à l'alignement à gauche des éléments des div qui apparaissent au-dessus. */
		height:172px;
    	background-image: url(footer.jpg);
		background-position:0px 0px;
		background-repeat:no-repeat;

    } 

       #footer a {

    	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: 3px ; 
		margin-top:10px;/* 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 */

    }

    

    /* Diverses classes à réutiliser */

    .fltrt { /* cette classe permet de rendre flottant le côté droit d'un élément dans la page. L'élément flottant doit précéder l'élément à côté duquel il doit se trouver dans la page. */

    	float: right;

    	margin-left: 8px;

    }

    .fltlft { /* cette classe permet de rendre flottant le côté gauche d'un élément dans la page */

    	float: left;

    	margin-right: 8px;

    }

    .clearfloat { /* 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:1px;

        font-size: 1px;

        line-height: 0px;

    }


