body{
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	margin:0; 
	padding: 0;
	text-align: center;
	background-image: url("image/body_01.png");
	background-attachment: fixed;
	background-size: cover; 
	font-size:30px;
	font-family:"Times New Roman","Times", sans serif;
}
                     /* L'en-tête */
#entete
{
     width:920px;
    height:200px;
	background-image: url("image/entete_001.gif");
    margin: auto;
    margin-top: 0;
    margin-bottom: 0px;
	padding:0;
	border: 0;
	
}
#entete h1
{
	font-size: 16px;
	text-align: center;
	color: lime;
	font-size:24px;	
}
                                                /* Le menu */
#menu
{
	background-image: url("image/beige024.gif");
	font-size: 16px;
	width:884px;
	padding: 15px;	
	text-align: center;
	height:auto;
	margin: auto;
	border: 2px solid black;
}
#menu h1
{
	font-size: 18px;
	padding: 10px;
	text-align: center;
}
#menu h2
{
	font-size: 18px;
	padding: 5px;
	text-align: center;
	color:black;
}
#menu h3
{    
   font-size: 14px;
   color: black;
   text-align: center;
}
#menu h4 
{   
   font-size: 14px;
   color: black;
   text-align: center;
   padding: 30px;
}
#menu h5 
{ 
	height:200px; 
	width:250px; 
	font-size: 14px;
	color: black;
	text-align: center;
    text-indent: 0;
    overflow: auto;
    border: 2px solid #000;
    position: scroll;
    background-image: url("image/bleucla_001.jpg");
}

/************contenant************************/

.contenant{
	display: block;
	background-image: url("image/beige024.gif");
	width:92%;
	padding: 15px;	
	text-align: center;
	height:auto;
    border: 2px solid #000;
	margin: auto;
	margin-top: 20px;
}
/**************pied de page*******************/

.pied {
	padding:0;
	width: 500px;
	margin: auto;
	margin-bottom: 20px;
	margin-top: 20px;
	background-image: url("image/beige024.gif");
	text-align: center;	
	border: 2px solid black;
}
                                              /*Les effets*/ 

a 
{
    background-image : none;
	color : black;
	border: none;
	font-size :18px;
	padding:5px;
	text-decoration: none;	
}
hr 
{
	height: 2px;
	text-align: center;
	margin: -0.5em 0;
	padding: 0;
	color: navy;
	background-color: #B22222;
	border: 0;
}
table 
{
	width:180px;
    height:80px;
	margin: auto;
	padding:20px;
}
tr
{
	border: 0;
	margin: auto;
}
td
{
	border: 0;
	margin: auto;
}
th
{
	border: 0;
	margin: auto;
}
strong 
{
	text-decoration : blink;
}
input
{
   cursor: default;    
}
strong 
{ 
	color : #cd853f;
	font-size : 16px;
	font-family : "Monotype Corsiva", Arial, "Arial Black", "Times New Roman", Times, serif;
}
small 
{ 
	color : blue;
	font-size : 18px;
	font-family : "Monotype Corsiva", Arial, "Arial Black", "Times New Roman", Times, serif;
}
.souligne 
{ 
	text-decoration : underline;
} 
.barre 
{ 
	text-decoration : line-through;
} 
.ligne_dessus 
{ 
	text-decoration : overline;
} 
.left 
{ 
	float : left;
} 
.right 
{ 
	float : right;
} 
.dessous 
{ 
	clear : both;
} 
.special 
{ 
	font-size : 30px;
	color : red;
	text-decoration : underline;
}

@media only screen and (max-width : 767px) {

	body {
		background-image : url( image/body_mobile_0);
		}
}
@media all and (max-width: 767px) {
  nav {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    transform: translate(-850px, 0);
  }
  nav > a {
    width: auto;
  }
  #ch:checked + nav {
    transform: translate(0, 0);
    transition: all 0.5s ease;
  }
  #lab{
    display: block;
  }
}