html, body{
width:100%;
/*background-image:url(img/tissu.jpg);*/
background-color:#2a1812;
margin: 0;
padding: 0;
}


#pere{
width:1200px;
height:800px;
background-image:url(img/fond.jpg);
background-repeat:no-repeat;
margin:auto;
}


#adresse{/*style appliqué aux coordonnées inscrit sur les enveloppes page index*/
width:292px;
height:233px;
margin-top:559px;
float:left;
}

#mentions{
width:227px;
height:135px;
margin-top:660px;
float:left;
}

#lettre{/*style appliqué à la div ce trouvant sur la lettre, pour la page index*/
width:500px;
margin-left:55px;
height:640px;
float:left;
margin-top:140px;
}

#titre{/*style appliqué au titre de la page index*/
width:500px;
height:70px;
margin-top:40px;
}

#photo{/*style appliqué à la photo d'Evelyne page index*/
width:184px;
height:277px;
margin-top:40px;
margin-left:158px;
}

#francais{/*style appliqué à la div contenant le drapeau français et entrer*/
width:177px;
height:35px;
margin-top:40px;
margin-left:158px;
}

#anglais{/*style appliqué à la div contenant le drapeau anglais et enter*/
width:174px;
height:35px;
margin-top:40px;
margin-left:158px;
}

#annuaire{
width:65px;
}

#annuaire a:link, a:visited{
color:#fdf3dd;
font-family:verdana;
font-size:12px;
font-weight:normal;
text-decoration:none;
}

#annuaire a:hover{
color:#ffffff;
font-family:verdana;
font-size:12px;
font-weight:normal;
text-decoration:none;
}

#menu{/*style appliqué à la div contenant le menu pour la page presentation, portfolio et informations*/
width:176px;
padding-top:220px;
margin-left:110px;
}

#informations{/*style appliqué à la div informations dans le menu (chevauche l'autre)*/
margin-top:-15px;
}

#adresse-pages{/*style appliqué aux coordonnées inscrit sur les enveloppes pour les pages presentations, portfolio, informations*/
width:292px;
height:233px;
margin-top:120px;
float:left;
}

#mentions-pages{
width:227px;
height:135px;
margin-top:221px;
float:left;
}

#lettre-pages{/*style appliqué à la div ce trouvant sur la lettre, pour les pages presentation, portfolio, informations*/
width:500px;
margin-left:55px;
height:640px;
float:left;
margin-top:-305px;
}

#lettre-mentions{/*style appliqué à la div ce trouvant sur la lettre, pour les pages presentation, portfolio, informations*/
width:500px;
margin-left:45px;
height:640px;
float:left;
margin-top:-305px;
}

#text-presentation{/*style appliqué au texte 1 sur la page presentation*/
width:500px;
margin-top:30px;
}

#text-mentions{/*style appliqué au texte ur la page mentions*/
width:500px;
margin-top:45px;
}

#anniversaire{/*style appliqué à la div contenant l'affiche des 20 ans et le texte*/
width:500px;
margin-top:25px;
}

#affiche20ans{/*style appliqué à la div contenant l'affiche des 20 ans*/
width:210px;
height:299px;
float:left;
margin-left:5px;
}

#text20ans{/*style appliqué à la div contenant le texte des 20 ans*/
width:207px;
height:145px;
float:left;
margin-left:10px;
}

#lettre-portfolio{/*style appliqué à la div sur la lettre, dans la page portfolio*/
width:500px;
margin-left:55px;
height:640px;
float:left;
margin-top:-280px;
}


#acces{/*style appliqué à la div contenant les informations routières et le plan page informations*/
width:500px;
margin-top:100px;
}

#indications{/*style appliqué à la div contenant les informations routières page informations*/
width:207px;
height:145px;
float:left;
margin-left:20px;
}


/**CARROUSSEL**/
*{
margin:0;
padding:0;
}

#navigation{
width:429px;
height:135px;
/*background-color:#7a9cc1;*/
margin-top:20px;
margin-left:5px;
}
#thumb{
width:360px;
height:135px;
overflow:hidden;
position:relative;
float:left;
/*background-color:#7a9cc1;*/

border:1px solid #000000;

}
#defileur {
position:absolute;
left:0px;
top:0px;
}
#defileur li {
float:left;
list-style:none;
width:110px;
height:135px;
margin-right:10px;
overflow:hidden;
border:none;
}
.last,.first{
visibility:hidden;
}

a:link #prev, a:visited #prev{
background-image:url(img/prec1.png);
background-repeat:no-repeat;
width:33px;
height:33px;
float:left;
}

a:hover #prev{
background-image:url(img/prec2.png);
background-repeat:no-repeat;
width:33px;
height:33px;
float:left;
}


a:link #next, a:visited #next{
background-image:url(img/suiv1.png);
background-repeat:no-repeat;
width:33px;
height:33px;
float:left;
}

a:hover #next{
background-image:url(img/suiv2.png);
background-repeat:no-repeat;
width:33px;
height:33px;
float:left;
}

#img{
width:434px;
height:448px;
}

/**VERSION ANGLAISE**/
#information{/*style appliqué à la div informations dans le menu (chevauche l'autre)*/
margin-top:-15px;
width:164px;
height:57px;
}

#reception{
width:164px;
height:59px;
}
#presentation-ang{
width:164px;
height:37px;
margin-top:-15px;
}

#portfolio-ang{
width:200px;
height:65px;
}

#adresse-ang{/*style appliqué aux coordonnées inscrit sur les enveloppes pour les pages presentations, portfolio, informations*/
width:292px;
height:233px;
margin-top:151px;
float:left;
}

#mentions-ang{
width:227px;
height:135px;
margin-top:260px;
margin-left:10px;
float:left;
}

#lettre-ang{/*style appliqué à la div ce trouvant sur la lettre, pour les pages presentation, portfolio, informations*/
width:500px;
margin-left:45px;
height:640px;
float:left;
margin-top:-280px;
}

#anniversaire-ang{/*style appliqué à la div contenant l'affiche des 20 ans et le texte*/
width:500px;
margin-top:15px;
}

#lettre-portfolio-ang{/*style appliqué à la div sur la lettre, dans la page portfolio*/
width:500px;
margin-left:55px;
height:640px;
float:left;
margin-top:-250px;
}