div.total {
  margin-left : 100px;
  width : 850px;
  min-height : 600px;
  margin-top : 65px;
}

/*-------------------------------bannière------------------------------------*/
#accueil {
  float : left;
  background-image : url(../images/accueil.gif);
  background-repeat : no-repeat;
  width : 149px;
  height : 134px;
}

#reunitElementsHaut{
  float : left;
  height : 175px;
}

#etatCivil{
  float : left;
  width : 120px;
  height : 55px;
  background-image : url(../images/etatCivil.gif);
  background-repeat : no-repeat;
}

#milieu {
  clear : both;
  float : left;
  width : 43px;
  height : 100px;
  background-image : url(../images/milieu.gif);
  background-repeat : no-repeat;
}


#cv {
  float : left;
  width : 57px;
  height : 60px;
  background-image : url(../images/cv.gif);
  background-repeat : no-repeat;
}

#haut1 {
  float : left;
  width : 85px;
  height : 125px;
  background-image : url(../images/haut1.gif);
  background-repeat : no-repeat;
}

#haut2 {
  float : left;
  width : 66px;
  height : 60px;
  background-image : url(../images/haut2.gif);
  background-repeat : no-repeat;
}

#book {
  float : left;
  width : 138px;
  height : 95px;
  background-image : url(../images/book.gif);
  background-repeat : no-repeat;
}

#haut3 {
  float : left;
  width : 83px;
  height : 95px;
  background-image : url(../images/haut3.gif);
  background-repeat : no-repeat;
}

#haut4 {
  float : left;
  width : 60px;
  height : 95px;
  background-image : url(../images/haut4.gif);
  background-repeat : no-repeat;
}

#contact {
  float : left;
  width : 120px;
  height : 95px;
  background-image : url(../images/contact.gif);
  background-repeat : no-repeat;
}

/************** flags *****************/

#flagCV{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagCV.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}


#flagFormation{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagFormation.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}


#flagExperiences{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagExperiences.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}


#flagConnaissances{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagConnaissances.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}


#flagLoisirs{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagLoisirs.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}

#flagBook{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagBook.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}

#flagContact{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagContact.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}

#flagAccueil{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagAccueil.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}

#flagCivil{
  float : left;
  width : 75px;
  height : 50px;
  background-image : url(../images/flagCivil.gif);
  background-repeat : no-repeat;
  margin-left : 161px;
}

/*-------------------------------menu 1------------------------------------*/

div.menu1 {
  clear : both;
  float : left;
  width : 30%;
  margin-top : -41px;
}

#gauche1{
  background-image : url(../images/gauche1.gif);
  background-repeat : no-repeat;
  width : 150px;
  height : 40px;
  float : left;
}

#formation {
  background-image : url(../images/formation.gif);
  background-repeat : no-repeat;
  width : 74%;
  height : 67px;
  float : left;
}

#gauche2{
  background-image : url(../images/gauche2.gif);
  background-repeat : no-repeat;
  width : 25%;
  margin-left : 70px;
  height : 37px;
  float : left;
}


#experiences {
  background-image : url(../images/experiences.gif);
  background-repeat : no-repeat;
  width : 55%;
  height : 59px;
  margin-left : 34px;
  float : left;
}


#gauche3{
  background-image : url(../images/gauche3.gif);
  background-repeat : no-repeat;
  width : 10%;
  clear : both;
  margin-left : 74px;
  height : 29px;
  float : left;
}


#connaissances {
  background-image : url(../images/connaissances.gif);
  background-repeat : no-repeat;
  width : 70%;
  height : 79px;
  margin-left : 34px;
  float : left;
}

#gauche4{
  background-image : url(../images/gauche4.gif);
  background-repeat : no-repeat;
  width : 50%;
  margin-left : 69px;
  height : 32px;
  float : left;
}

#loisirs {
  background-image : url(../images/loisirs.gif);
  background-repeat : no-repeat;
  width : 50%;
  margin-left : 17px;
  height : 70px;
  float : left;
}

#gauche5{
  background-image : url(../images/gauche5.gif);
  background-repeat : no-repeat;
  width : 30%;
  height : 50px;
  float : left;
  clear : both;
}

/*---------------------------------contenu------------------------------------*/

div.principal {
  float : left;
  width : 62%;
  text-align : left;
  font-family : arial, verdana;
  font-size : 14pt;
  padding-bottom : 4%;
  height : 100%;
  /*margin-left : -30px;*/
  /*margin-top : -70px;*/
}


h1 {
  text-align : left;
  margin-top : 0px;
  margin-bottom : 0px;
  padding-bottom : 0px;
  color : #AC3A48;
  font-family : arial, verdana;
  font-size : 18pt;
  font-weight : 900;
}

p {
  text-align : left;
  font-family : arial,verdana;
  font-size : 10pt;
  font-weight : 400;
}

h3 {
  text-align : left;
  margin-top : 0px;
  font-family : arial, verdana;
  font-size : 10pt;
  font-weight : 600;
}

h4 {
  text-align : left;
  margin-bottom : 0px;
  margin-top : 0px;
  color : #D55729;
  font-family : arial, verdana;
  font-size : 13pt;
  font-weight : 400;
}

h5 {
  text-align : left;
  margin-top : 0px;
  margin-bottom : 0px;
  font-family : arial, verdana;
  font-size : 10pt;
  font-weight : 600;
  font-style : italic;
}

h6 {
  text-align : left;
  margin-top : 0px;
  font-family : arial, verdana;
  font-size : 10pt;
  font-weight : 400;
}

h2 {
  text-align : center ;
}

/*--------------------------    titres    -----------------------------------*/
#enSavoirPlus{
  height : 25px;
  width : 130px;
  background-image : url(../images/enSavoirPlus.gif);
  background-repeat : no-repeat;
  cursor : pointer;
}

#commentaires{
  height : 25px;
  width : 130px;
  background-image : url(../images/commentaires.gif);
  background-repeat : no-repeat;
  cursor : pointer;
}

#jobs{
  height : 30px;
  width : 140px;
  background-image : url(../images/jobs.gif);
  background-repeat : no-repeat;
  cursor : pointer;
}

#retour{
  height : 25px;
  width : 50px;
  background-image : url(../images/retour.gif);
  background-repeat : no-repeat;
  cursor : pointer;
}

#jobs2{
  height : 37px;
  width : 175px;
  background-image : url(../images/jobs2.gif);
  background-repeat : no-repeat;
}

#actualites{
  height : 30px;
  width : 90px;
  background-image : url(../images/actualites.gif);
  background-repeat : no-repeat;
}

#postale{
  height : 30px;
  width : 160px;
  background-image : url(../images/postale.gif);
  background-repeat : no-repeat;
}

#electronique{
  clear : both;
  height : 30px;
  width : 175px;
  background-image : url(../images/electronique.gif);
  background-repeat : no-repeat;
}

#telephone{
  height : 30px;
  width : 90px;
  background-image : url(../images/telephone.gif);
  background-repeat : no-repeat;
}

#informatique{
  height : 30px;
  width : 120px;
  background-image : url(../images/informatique.gif);
  background-repeat : no-repeat;
}

#culture{
  height : 30px;
  width : 90px;
  background-image : url(../images/culture.gif);
  background-repeat : no-repeat;
}

#communication{
  height : 30px;
  width : 140px;
  background-image : url(../images/communication.gif);
  background-repeat : no-repeat;
}

#telecharger{
  height : 25px;
  width : 250px;
  background-image : url(../images/telecharger.gif);
  background-repeat : no-repeat;
  cursor : pointer;
}

#vieAssociative{
  height : 30px;
  width : 135px;
  background-image : url(../images/vieAssociative.gif);
  background-repeat : no-repeat;
}

#voyages{
  height : 37px;
  width : 80px;
  background-image : url(../images/voyages.gif);
  background-repeat : no-repeat;
}

#sports{
  height : 37px;
  width : 60px;
  background-image : url(../images/sports.gif);
  background-repeat : no-repeat;
}

#langues{
  height : 37px;
  width : 78px;
  background-image : url(../images/langues.gif);
  background-repeat : no-repeat;
}

#parametres{
  height : 35px;
  width : 215px;
  background-image : url(../images/parametres.gif);
  background-repeat : no-repeat;
}

#realisations{
  height : 35px;
  width :145px;
  background-image : url(../images/realisations.gif);
  background-repeat : no-repeat;
}

/************** page book ******************/
#agathe{
  float : left;
  width : 150px;
  height : 125px;
  background-image : url(../images/agathe.gif);
  background-repeat : no-repeat;
}

#fanal{
  margin-left : 20px;
  margin-bottom : 20px;
  float : left;
  width : 155px;
  height : 130px;
  background-image : url(../images/fanal.gif);
  background-repeat : no-repeat;
}

#alamanierede{
  clear : both;
  float : left;
  width : 150px;
  height : 135px;
  background-image : url(../images/alamanierede.gif);
  background-repeat : no-repeat;
}

#diaporama{
  margin-left : 20px;
  float : left;
  width : 155px;
  height : 125px;
  background-image : url(../images/diaporama.gif);
  background-repeat : no-repeat;
}

#contenuAgathe{
  margin-left : 350px;
  width : 200px;
  height : 270px;
  visibility : hidden
}

#contenuFanal{
  margin-left : 350px;
  width : 200px;
  height : 270px;
  margin-top : -282px;
  visibility : hidden
}

#contenuALaManiereDe{
  margin-left : 350px;
  width : 200px;
  height : 270px;
  margin-top : -282px;
  visibility : hidden
}

#contenuDiaporama{
  margin-left : 350px;
  width : 200px;
  height : 270px;
  margin-top : -284px;
  visibility : hidden
}

#reunitElementsBook{
  float : left;
  width : 325px;
}

/***************page état civil  ***************/

#photoIdentite{
  margin-left : 50px;
  margin-top : -240px;
  float : left;
  width : 105px;
  height : 127px;
  background-image : url(../images/photo.gif);
  background-repeat : no-repeat;
}

#photo2{
  float : left;
  width : 115px;
  height : 127px;
  background-image : url(../images/photo.gif);
  background-repeat : no-repeat;
}

#infosIdentite{
  margin-top : -260px;
  margin-left :165px;
  float : left;
}

#carte{
  float : left;
  width : 510px;
  height : 270px;
  background-image : url(../images/carte.gif);
  background-repeat : no-repeat;
}
/***************page cv  ***************/


#format1{
  float : left;
  width : 89px;
  height : 68px;
  background-image : url(../images/format1.gif);
  background-repeat : no-repeat;
}

#pdf{
  float : left;
  margin-top : 34px;
  width : 93px;
  height : 80px;
  background-image : url(../images/pdf.gif);
  background-repeat : no-repeat;
}

#format2{
  float : left;
  margin-top : 51px;
  width : 60px;
  height : 30px;
  background-image : url(../images/format2.gif);
  background-repeat : no-repeat;
}

#word{
  float : left;
  margin-top : 50px;
  width : 98px;
  height : 91px;
  background-image : url(../images/word.gif);
  background-repeat : no-repeat;
}

#format3{
  float : left;
  margin-top : 29px;
  width : 110px;
  height : 50px;
  background-image : url(../images/format3.gif);
  background-repeat : no-repeat;
}

/***************page contact ***************/

#france{
  width : 190px;
  height : 190px;
  background-image : url(../images/france.gif);
  background-repeat : no-repeat;
  margin-left : 80px;
}

#pouliguen{
  width : 160px;
  margin-top : -70px;
  text-align : right;
  float : left;
}

#chateau{
  float : left;
  width : 200px;
  margin-left : 70px;
  margin-top : -130px;
}

#commentairesAccueil{
}

/*--------------------------cacher - montrer --------------------------------*/

#visible{
  display : block;
}

#petitsJobs{
  display : none;
  margin-top : 5px;
}

/*--------------------------elements-textes-----------------------------------*/
#orange{
  color : orange;
}

span.cacher {
  display : none;
}

hr {
  margin-top : 1%;
  margin-bottom : 1%;
  margin-left : 0px;
  margin-right : 5%;
}

li{
  text-align : left;
  font-family : arial,verdana;
  font-size : 10pt;
  font-weight : 400;
  
}

#gauche{
  
  float : left;
  width : 50%;
}

#droit{
  float : left;
  width : 49%;
}

#clear{
  clear : both;
  float : left;
}

a{
  text-decoration : none;
  color : black;
}

a:hover{
  color : grey;
}