body{
background: #D3D3D3; 
 
}

header{
background: #627c9b; 		/*clair : #627c9b - foncé : #465c76*/
height: 80px;
width: 100%;
color: white;
font-family: verdana;
font-size:2.5em;
text-align: center;
padding-top: 20px;

background-color:#627c9b; 
background-image:-webkit-linear-gradient(top, #627c9b 0%, #465c76 100%);
background-image: linear-gradient(to bottom, #627c9b 0%, #465c76 100%);
border-radius: 6px;
margin-bottom:2px;
box-shadow: 3px 3px 3px #999;
border:solid 1px #333A40;

 font-weight: bold ;

}

.gauche{
width: 12%;
float: left;

padding-top:20px;

}

.milieu{
//background: #FFFFFFF; 
background: white; 
float: left;
width: 75%;
margin-left:2%;
margin-top:17px;
text-align: center;

border: 0.1rem solid;

padding-left: 40px;
padding-right: 40px;

border-radius: 6px;
box-shadow: 3px 3px 3px #999;
}

.clear{
clear: both;
}


img {
	
border-radius: 15px;
	
}

p {

font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
font-size : 16px; 
font-weight: normal;
color : #000000;
text-align : left; 
}


h1{ 


  background-color:#627c9b; 
  background-image:-webkit-linear-gradient(top, #627c9b 0%, #465c76 100%);
  background-image: linear-gradient(to bottom, #627c9b 0%, #465c76 100%);
  border-radius: 6px;
  margin-bottom:2px;
  box-shadow: 3px 3px 3px #999;
  border:solid 1px #333A40;
  color: white;
  font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
  font-size : 28px; 
  font-weight: bold ;
  text-align : center; 
  margin-bottom: 50px;
  width: 100%;

}


h2{ 
font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
font-size : 14px; 
font-weight: bold ;
color : #000000; 
text-align : left; 
}

h3 {

font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
font-size : 16px; 
font-weight: normal;
color : #000000;
text-align : center; 
} 

h4 {

font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
font-size : 16px; 
font-weight: normal;
color : red;
text-align : center; 
}   

table {

font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
font-size : 16px; 
font-weight: normal;
color : #000000;
text-align : left; 	
	
}

ul {
	
font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
font-size : 16px; 
font-weight: normal;
color : #000000;
text-align : left; 	
	
}

a {

font-family : Arial, Verdana, Geneva, Helvetica, sans-serif; 
font-size : 16px; 	
	
}


  
/*----------------------------------------------------------------------------*/



#menu-accordeon {
  padding:0;
  margin:0;
  list-style:none;
  text-align: center;
   width: 100%;
}
#menu-accordeon ul {
  padding:0;
  margin:0;
  list-style:none;
  text-align: center;
}
#menu-accordeon li {
   background-color:#627c9b; 
   background-image:-webkit-linear-gradient(top, #627c9b 0%, #465c76 100%);
   background-image: linear-gradient(to bottom, #627c9b 0%, #465c76 100%);
   border-radius: 6px;
   margin-bottom:2px;
   box-shadow: 3px 3px 3px #999;
   border:solid 1px #333A40
}
#menu-accordeon li li {
   max-height:0;
   overflow: hidden;
   transition: all .5s;
   border-radius:0;
   background: #444;
   box-shadow: none;
   border:none;
   margin:0
}
#menu-accordeon a {
  display:block;
  text-decoration: none;
  color: #fff;
  padding: 8px 0;
  font-family: verdana;
  font-size:1em
}
#menu-accordeon ul li a, #menu-accordeon li:hover li a {
  font-size:1em
}
#menu-accordeon li:hover {
   background: #627c9b
}
#menu-accordeon li li:hover {
   background: #999;
}
#menu-accordeon ul li:last-child {
   border-radius: 0 0 6px 6px;
   border:none;
}
#menu-accordeon li:hover li {
  max-height: 15em;
}

/*----------------------------------------------------------------------------*/