body
{
width:760px;
height:700px;
margin:auto;
margin-top:none; /*pour eviter de coller avec le haut du navigateur*/
margin-bottom:20px; /*idem pour le bas de la page*/
background-color:#cbe0ef;
background-image:url("imfond.png");
background-repeat:repeat;
}

/*en_tête*/

#en_tete
{
width:760px;
height:138px;
background-image:url("tetecafinal.jpg");
background-repeat:no-repeat;
}

/*le menu*/

#menu
{
float:left;/*le menu flottera à gauche*/
width:186px;/*Très important: donner une taille au menu*/
margin-top:10px;  
background-image:url("blanc.png");
background-repeat:no-repeat;
}

.element_monprojet
{
width:186px;
background-color:#88b5d4;
border:1px;
text-align:center;
padding:none;
padding-top:0px; /*pour que le menu colle à l'en-tête*/
position:absolute;
top:128px;
left:122px!important;
left:121px;
background-color:#e8f0f4
}
.element_flash
{
position:absolute;
top:158px;
right:699px!important;
right:698px;
}

.element_menu
{
width:186px;
line-height:23px;/*permet d'agrandire l'interligne*/
background-color:#ffffff;
border:1px;

margin-top:25px;
margin-bottom:20px;/*pour éviter que les éléments du menu ne soient trop collés*/
position:absolute;
top:178px!important;
top:200px;
left:122px!important;
left:121px;
background-color:#e8f0f4
}

/*Quelques effets sur les menus*/

.element_menu ul /*tout les listes à puces se trouvant dans le menu*/
{
list-style-image:url("puceca.png");/*on change l'apparence des puces*/
padding:0px;/*tous les cotés ont une marge intérieure de 0pixels*/
padding-left:20px;/*sauf la marge de gauche qui fera 20px*/
margin:0px;/*idem pourmargin, ca nous évite d'avoie à en écrire 4 (margin-left, margin-right...)*/
margin-bottom: 5px;/*sauf margin-bottom*/
}

.element_menu a /*Tous les liens se trouvant dans un menu*/
{
color:#003399;
font-family:Arial,Veranda,"Truchet MS","Times New Roman",Times,serif;
text-decoration:none; /*les liens ne seront pas soulignés*/
}

.element_menu a:hover /*quand on pointe sur un lien du menu*/
{
color:#f87c00;
}

.element_menu1
{
width:186px;
background-color:#ffffff;
border:1px;
margin-bottom:30px;/*pour éviter que les éléments du menu ne soient trop collés*/
position:absolute;
top:460px!important;
top:470px;
left:122px!important;
left:121px;
background-color:#e8f0f4
}

.element_menu1 ul
{
list-style-image:url("pucetri.png");/*on change l'apparence des puces*/
padding:0px;/*tous les cotés ont une marge intérieure de 0pixels*/
padding-left:20px;/*sauf la marge de gauche qui fera 20px*/
margin:0px;/*idem pourmargin, ca nous évite d'avoie à en écrire 4 (margin-left, margin-right...)*/
margin-bottom: 5px;/*sauf margin-bottom*/
}
.element_menu1 a
{
color:#003399;
font-family:Arial,Veranda,"Truchet MS","Times New Roman",Times,serif;
text-decoration:none; /*les liens ne seront pas soulignés*/
}

.element_menu1 a:hover
{
color:#f87c00;
}

.deroulant
{
position:absolue;
top:495px;
margin-left:4px;
}

.element_menu2
{
height:702px!important;/* IE ne le comprend pas*/
height:712px;
width:186px;
background-color:#ffffff;
border:1px;
margin-bottom:20px;/*pour éviter que les éléments du menu ne soient trop collés*/
position:absolute;
top:520px!important;
top:530px;
left:122px!important;
left:121px;
background-color:#e8f0f4
}

.element_menu2 ul
{
line-height:20px;/*permet d'agrandire l'interligne*/
padding-top:10px;/*tous les cotés ont une marge intérieure de 0pixels*/
padding-left:10px;/*sauf la marge de gauche qui fera 10px*/
margin:0px;/*idem pourmargin, ca nous évite d'avoie à en écrire 4 (margin-left, margin-right...)*/
margin-bottom: 5px;/*sauf margin-bottom*/
list-style-type:none;
}

.element_menu2 a /*lorsque la souris n'est pas sur le lien*/
{
color:#003399;
font-family:Arial,Veranda,"Truchet MS","Times New Roman",Times,serif;
text-decoration:none; /*les liens ne seront pas soulignés*/
}

.element_menu2 a:hover /*lorsqque la souris est sur le lien*/
{
text-decoration:underline;/*les liens seront soulignés*/
}

.exeption
{
padding-left:10px;
}

.exeption a
{
color:#cc6600;
font-family:Arial,Veranda,"Truchet MS","Times New Roman",Times,serif;
text-decoration:underline;/*les liens seront soulignés*/
}

.exeption a:hover
{
color:#cc6600;
text-decoration:none;/*les liens seront soulignés*/
}


/*le corps de la page*/

#corps
{
height:1063px!important;
height:1075px;
width:529px;
margin-left:186px!important;/*Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu*/
margin-left:188px;
margin-bottom:20px;/*ca c'est pour éviter que le corps colle trop au pied de page en-dessous*/
margin-top:10px; 
padding:20px;/*pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure*/

color:#383838;
background-color:#fdfdfd;
font-family:Verdana,Arial,"Times New Roman","Truchet MS",Times,serif;
font-size:12px;
text-align:justify;
border:1px solid #bababa;
background-image:url("borhori.png");
background-repeat:repeat-x;
position:relative;
right:2px!important;
right:5px;
bottom:20px!important;
bottom:20px;
}

.phrase6
{
color:#000089;
font-weight:bold;
}

.reaction
{
position:absolute;
top:100px;
}

.chapitre
{
position:relative;
bottom:3px;
}

.exemple
{
position:relative;
left:120px;
left:150px!important;
font-size:10px;
}

.message
{
position:relative;
bottom:150px;
}

.nom
{
position:relative;
bottom:3px;
}

.prenom
{
position:relative;
bottom:3px;
}

.mail
{
position:relative;
bottom:3px;
}

.facultatif
{
position:relative;
left:0px!important;
right:60px;
left:0px;
font-size:10px;
bottom:6px;
}

.block1
{
position:relative;
left:33px;
}

.block2
{
position:relative;
left:80px;
}

.block3
{
position:relative;
left:50px;
}

.block4
{
position:relative;
left:71px;
}

.block5
{
position:relative;
left:60px;
}

.envoyer
{
position:relative;
top:10px;
left:200px;
}

a img /* Toutes les images contenues dans un lien */
{
border: none; /* Pas de bordure */
}

.haut
{
float:left;
position:absolute;
bottom:196px;
left:10px;
}


.imprimable
{
position:absolute;
bottom:160px;
left:10px;
}

.print
{
position:absolute;
bottom:163px;
left:45px;
color:#0114d0;
}

/*Le pied de page*/

#pied_de_page
{

width:754px;
color:white;
font-family:"Times New Roman",Arial,Veranda,"Truchet MS",Times,serif;
font-size:medium;
text-align:center;
background-color:#79a6d3;
position:relative;
bottom:50px!important;
bottom:50px;
}

