*/ feuille de style de mon site  (ceci est juste une remarque qui n'est pas prise en compte par le système)*/
* {
margin: 0;
padding: 0;
}

/* body c'est l'ensemble du site contenu entre <body< et </body>*/
body {   
margin: 0; /* marge à zéro*/
background: url('heep://la.caracole.free.fr/images/marche.jpg'); /* image du fond de page! */
color: #666; /* couleur des textes ici gris */
text-align: left; /* les textes seront alignés à gauche */
;
}

/*La propriété "clear" va être utilisée pour définir si un élément doit se trouver sur la même bande horizontale qu’un élément flottant. On peut donc écrire que cette propriété indique de quelle manière le texte va être placé par rapport à une boîte flottante précédente. Cette propriété ne bénéficie pas de l'héritage. both : ici la boîte générée va se déplacer sous chacune des boîtes flottantes qui précèdent dans le code source.*/

.nettoyeur {
clear:both;
}

/* le bloc principal englobant toutes les div*/
#main{
 margin-left: auto;
 margin-right: auto;
 width: 980px; height:auto;
 text-align: center; 
 background: #fff;
}

/* le bandeau superieur*/

#header {
 background: url('../images/banniere.jpg'); /* on affiche l'image en fond*/
 width: 100%; /*la div prend la totalité de la place*/
 height:350px; /* la hauteur de l'image est de 350 pixels */
 text-align:left; /* le texte sera aligné à gauche*/
 color:#000; /* le texte sera noir*/
 }
#header h1
{
padding:100px; /* Si on applique <h1> la marge interne dans le header sera de 100 pixels*/
} 
/*Le contenu*/
#contenu {
 float:left; /* on aligne la div à gauche */
 margin-left: auto;
 margin-right: auto;
 width:686px;
 padding: 5px;
 text-align: left;
 background:#fff; /* le fond est blanc*/

}#contenu ul {padding: 20px;}  

#droite {
 float:right;/* on aligne la div à droite */
 margin-left: auto;
 margin-right: auto;
 width:274px;
 padding: 5px;
 text-align: left;
 background:#fff; /*le fond est blanc*/
 border-left:1px dotted #000;/* ligne verticale de 1px en pointillés sur la gauche*/
}
#droite ul {
list-style-type:none;/* on supprime les puces des listes à puces dans la div de droite*/
}
/*le pied de page*/

#footer {
 margin-left: auto;
 margin-right: auto;
 width: 980px;
 text-align: center;
 border-top:1px dotted #000;
 border-bottom:1px dotted #000;