htlm, body {
	height: 100%;
    margin: 0;
    padding: 0;
	font-family:Arial,sans-serif;
  	background-color : #f2eacb;
	background-image : url(./images/fond2.png),url(./images/fond2.png),url(./images/fond2.png);
	background-position:	left top, 100px 40px, 250px 170px ;	 
}

body {
  height: 100%;
  width: 100%;
  min-width : 630px;
  margin-right: 0;
  margin-left: 0;
  font-weight: inherit;
  font-family: Arial,Helvetica,sans-serif;
}

a:link {color:#192f71;}
a:visited {color:#192f71;} 
a:hover {color:black;} 
a:active {color:black;} 
a:focus  {color:black;} 




#logo{
display : none;
}

#deco_volute{
position: absolute;
margin-top:500px;
background-size : 150px;
background-image : url(./images/vol2.png);
height: 500px;
width: 100%;
background-position:right top;
right:20px;
z-index:15;
background-repeat: no-repeat;
z-index :-1;
}

#header {
  position : fixed;
  width : 100%;
  height : 70px;
  background-color : #192f71;
  box-shadow: 0px 5px 6px 0px #656565;
  z-index : 10;
 }
  
 #box_menu {
  display :none;
}

div#menu_mobile {
display : block;
height : 50px;
width : 50px;
position : absolute;
top : 10px;
left : 10px;
z-index : 1000;
border-radius :10px;
border : 1px solid grey;
background-color: #f2eacb;
background-image:		url(./images/menu_mobil.png);
background-position:	center center;
background-repeat:		no-repeat;
}

.menu { 
  display : block;
  left : 50px;
  text-align : center;
  height : 65px;
  vertical-align : center;
  font-weight: 700;
  font-size: 30px;
  padding-left : 15px;
  padding-right : 15px;
  line-height : 65px;
  color : #f2eacb;
}

.en_cours{
  color : #192f71;
  background-color : #f2eacb;
  background-image : url(./images/fond2.png);
}

.menu:hover {
  color : #192f71;
  background-color : #f2eacb;
  background-image : url(./images/fond2.png);
}

#menu-vertical, #menu-vertical ul {
  padding:0;
  margin:0;
  margin-left : 50px;
  list-style:none;
  width: 150px; /* seule ligne rajoutée */
  border : 1px solid grey;
  background-color: #f2eacb;
  box-shadow: 0px 5px 6px 0px #656565;
  background-image : url(./images/fond2.png);
  
  
}

#menu-vertical li {
  padding-left : 10px;
  padding-right : 10px;
  position: relative;
  line-height : 35px;
}

#menu-vertical a {
  display:block;
  text-decoration: none;
  color: #000;
  font-weight : bold;
}

#menu-vertical ul {
  position: absolute;
  left:-999em;
}

#menu-vertical li:hover ul {
  top: 0;
  left: 150px;
  width: 130px;
}

#menu-vertical a:hover {
  top: 0;
  left: 181px;
  COLOR:#192f71;
}



#contenus {
  width : 100%;
  margin-right: auto;
  margin-left: auto;
  padding-bottom : 60px;
}

#cadre_texte {
  margin-right: auto;
  margin-left: auto;
  max-width : 1000px;
  padding : 20px;
  text-align : justify;
  background-color : #7f8dc5;
  border:5px double black;
  border-radius: 6px;
  box-shadow: 5px 5px 6px 0px #656565;
 }
 
 #cadre_texte2{
  margin-right: auto;
  margin-left: auto;
  max-width : 1000px;
  padding : 20px;
  text-align : justify;
  border: 2px solid grey;
  border-radius: 6px;
  box-shadow: 5px 5px 6px 0px #656565;
  background-color : #f2e4c1;
  background-image : url(./images/fond2.png),url(./images/fond2.png),url(./images/fond2.png);
  background-position:	left top, 100px 40px, 250px 170px ;

  }
 
 
 #cadre_titre {
text-align:center; /* centrage horizontal */
   }
   
 div.image_titre {
  display:inline-block;
  vertical-align:middle;
  text-align:left; /* on rétablit l'alignement du texte */
   }
   
 div.texte_titre {
  font-size : 80px;
  margin-left : 30px;
  display:inline-block;
  vertical-align:middle;
  text-align:left; /* on rétablit l'alignement du texte */
   }

#cadre_accueil {
  border:5px double black;
  width : 600px;
  height : 359px;
  margin-right: auto;
  margin-left: auto;
  background-image : url(./images/image-acc.jpg);
  background-size : 600px 359px;
  background-repeat : no-repeat;
  background-position : center center;
  
}

#attention{
  height : 60px ;
   background-image : url(./images/attention.png);
   background-repeat : no-repeat;
   background-size : 60px auto;
   padding-left : 75px;
   padding-top : 10px;
   color : #B50000;
}

#cadre_compte-rebours{
  font-family: 'Pinyon Script', cursive;
  text-align : center;
  font-size: 40px;
  width : 100%;
  margin-right: auto;
  margin-left: auto;
}   
   
#cadre_item{
  width : 320px;
  height :390px ;

  margin-top: 10px;
  margin-left: 10px;
  margin-bottom : 10px;
  border: 2px solid grey;
  border-radius: 6px;
  padding : 9px;
  background-color : #f2e4c1;
  background-image : url(./images/fond2.png),url(./images/fond2.png),url(./images/fond2.png);
  background-position:	left top, 100px 40px, 250px 170px ;

  }
  
  #cadre_retour{
display : none;
  }
  
#cadre_participer2 {
width : 360px;
height :450px ;
padding : 20px;
height :420px;
padding:0px;
}
    
#cadre_participer {
border: 2px solid grey;
border-radius: 6px;
margin-right: auto;
margin-left: 10px;
width : 640px;
padding : 20px;
float :left;
height :420px;
background-color : #f2e4c1;
background-image : url(./images/fond2.png),url(./images/fond2.png),url(./images/fond2.png);
background-position:	left top, 100px 40px, 250px 170px ;
text-align : justify;
}
   

#prix{
 margin-top: 1px;
 text-align : center;
 float : right;
 font-weight: 700;
}

#sexe_M{
padding : 0px;
  float : right;
  height : 20px ;
  width : 20px;
  background-image : url(./images/M.png);
  background-position:	center top;
  background-repeat : no-repeat;
  }
  
 #sexe_F{
  float : right;
  height : 20px ;
  width : 22px;
  background-image : url(./images/F.png);
  background-position:	center center;
  background-repeat : no-repeat;
  }
  
 #sexe_MF{
  float : right;
  height : 20px ;
  width : 39px;
  background-image : url(./images/MF.png);
  background-position:	center center;
  background-repeat : no-repeat;
  } 
  
 
#photo_item{
  width : 200px;
  height : 180px ;
  margin-right: auto;
  margin-left: auto;
  transform: rotate(-5deg);
  background-color :white ;
  box-shadow: 8px 8px 5px #555;
}

#mini_photo_item{
  width : 60px;
  height : 60px ;
  float: left;
  margin-left : 35px;
}

#cadre_photo_item{
  width : 100%;
  height : 100% ;
  background-image : url(./images/cadre_photo.png);
  background-position:	left top;
  background-size: 100% 100%;
 }

 .offert {
margin-left : 15px ;
}
 
.avancement {
    background-color: #484848 ; 
	float : left;
    height: 30px;
    width: 120px;       
    border-radius: 15px;
    box-shadow: 0 1px 15px #000 inset ;
	overflow : hidden;	
}

.avancement2 {
    background-color: #484848 ; 
    height: 30px;
    width: 120px;       
    border-radius: 15px;
    box-shadow: 0 1px 15px #000 inset ; 
	overflow : hidden;		
}


.avancement span {
    display: inline-block;
    height: 100%;
    border-radius: 15px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;   
}

.avancement2 span {
    display: inline-block;
    height: 100%;
    border-radius: 15px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;   
}

.sepia span {
    background-color: #81a8c1; 
	box-shadow: inset 0px 0px 5px 2px #000;
}

.stripes span {
    background-size: 30px 30px;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%,
                        transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%,
                        transparent 75%, transparent);            
    
    animation: animate-stripes 3s linear infinite;             
}

.ombre {
  position: relative;
  width: 400px;
  height: 300px;
  background-color: #fff;
  box-shadow: 0 1px 5px rgba(0,0,0,0.25), 0 0 50px rgba(0,0,0,0.1) inset;
  border-radius: 1%     1%     1%     1% /     1%     1%     1%     1%;
}
.ombre:before {
      position: absolute;
      right: 80px;
      bottom: 5px;
      width: 100%;
      height: 37%;
      border-radius: 0 10% 0 0;
      z-index: -1;
      content: "";
      box-shadow: 86px 0 17px rgba(0,0,0,0.33);
      -webkit-transform: skew(-36deg);
     -moz-transform: skew(-36deg);
     -ms-transform: skew(-36deg);
     -o-transform: skew(-36deg);
     transform: skew(-36deg);
      -webkit-transform-origin: 0% 100%;
     -moz-transform-origin: 0% 100%;
     -ms-transform-origin: 0% 100%;
     -o-transform-origin: 0% 100%;
     transform-origin: 0% 100%;
      }
	  
.tableau {
margin-left : 110px;
width : 450px;
}



@keyframes animate-stripes {
    0% {background-position: 0 0;} 100% {background-position: 60px 0;}
}

#bouton_participer a{
  display :block;
  text-decoration : none ;
  border: thin solid #bbbbbb;
  text-align : center ;
  width : 110px;
  height : 30px ;
  line-height : 30px;
  float : right;
  margin-right : 17px;
  background-color: rgb(239, 240, 242);
  border-radius: 6px;
  font-weight: 700;
  color : #000000;
  box-shadow: 0px 0px 5px #555;
}

#bouton_participer a:hover{
  border: thin solid #000000;
  background-color: #81a8c1;
  }
  
 .bouton_valider {
  display :block;
  text-decoration : none ;
  border: thin solid #bbbbbb;
  text-align : center ;
  width : 110px;
  height : 30px ;
  line-height : 30px;
  margin-right : auto;
  margin-left : auto;
  background-color: rgb(239, 240, 242);
  border-radius: 6px;
  font-weight: 700;
  color : #000000;
}

.bouton_valider:hover{
  border: thin solid #000000;
  background-color: #81a8c1;
  }

.bouton_valider:active{
  border: thin solid #000000;
  background-color: #81a8c1;
} 

.bouton_modifier a{
text-decoration : none ;
  border: thin solid #bbbbbb;
  background-color: rgb(239, 240, 242);
  border-radius: 6px;
  font-weight: 700;
  color : #000000;
  padding : 2px;
}
.bouton_modifier a:hover{
  border: thin solid #000000;
  background-color: #81a8c1;
  }

.bouton_modifier a:active{
  border: thin solid #000000;
  background-color: #81a8c1;
} 

.categorie {
font-style : italic;
}

.center{
text-align : center;
}

.gros{
font-weight: 700;
font-size: 50px;
}

.moyen{
font-weight: 600;
font-size: 40px;
}

.moyen-{
font-weight: 400;
font-size: 25px;
}

.titre_accueil{
font-size: 80px;
}
.ss_titre_accueil{
font-size: 20px;
}

.titre {
  font-size: 17px;
  font-weight: 700;
}

.grand{
  font-size: 45px;
}
.police_spe{
font-family: 'Pinyon Script', cursive;
letter-spacing: -0.02em;
}

.bloc_center{
margin-left : auto ;
margin-right: auto ;
}

.overlay { /* masque pour bloquer le scrolling des maps */
   background:transparent; 
   position:relative; 
   width:100%;
   height:300px; /* your iframe height */
   top:300px;  /* your iframe height */
   margin-top:-300px;  /* your iframe height */

}




hr
{
   width: 100%;
   border-top: 5px solid black;
}


#cadre_connexion1{
height : 50px;
width : 520px;
margin-right : auto;
margin-left : auto;
z-index : 100;
}

#cadre_connexion2{
height : 50px;
width : 260px;
margin-right : auto;
margin-left : auto;
z-index : 100;
}


#bouton_connexion{
height : 32px;
margin-top : 6px;
width : 250px;
margin-right : 5px;
margin-left : 5px;
float :left;
}

#bouton_connexion a{
  display :block;
  text-decoration : none ;
  border: thin solid #bbbbbb;
  text-align : center ;
  padding : 3px;
  line-height : 30px;
  margin-right : auto;
  margin-left : auto;
  background-color: rgb(239, 240, 242);
  border-radius: 6px;
  font-weight: 700;
  color : #000000;
  box-shadow: 0px 0px 5px #555;
}

#bouton_connexion a:hover{
  border: thin solid #000000;
  background-color: #81a8c1;
  }



#footer {
display:none;
 }

 #spacer{
  clear :both;
}