body {
margin: 0;
padding: 0;
 font-size: 100%;
      }
      
 #bloc_page{
	     width: 1200px;
	     margin: auto;
	    background:  whitesmoke;
	
           }
		   
         

  /* haut | droit | bas | gauche */


/*______________________ HEADER _________________ */

 header
{

    display: flex;
	    width: 100%;
    height: auto;
    flex-direction: row;
    justify-content: center;
     margin: auto ;
     padding: auto;
    }
	
#adressefac
    {
        display:none;
    }	

#input_case	{
	
        -border-radius: 14px;
    height: 20px;
    width: 20px;
    background: #fff;
    border: 1px solid #ccc;
	
		}

#articlehaut
{
   
   width: 100%;
    background: #7BEE9B;
	text-align: center;
   height: auto;
   margin:auto;
  
}

/* haut | droit | bas | gauche */



#articlehaut img
 { width:20%;
 height: auto;
 margin: auto; 
  padding: 1% 0 0 0;
 
 }	
 
 #articlehaut H1
{
  
			 font-size: 1.1em;
			 font-weight: bold;
             padding: 5px;
			 color: #E68A09;
}

/* _______________________________________SECTION _______________________________ */
      

  section1
     {
	  display: flex;
      display: -webkit-flex;	  
	    width: 100%;
	 
    flex-direction: row;
    justify-content:center;
  
     margin: auto;
  }
  
  
  

/* _______________________________________MENU _______________________________ */




/* haut | droit | bas | gauche */


a {	
       padding: 0% 0% 0% 0%; 
        height: auto;
		 }

a.afficher, a.masquer {
                          height: auto;}



 /* Détails pour le menu de navigation */
 a { 
           list-style-type: none;
           line-height: 10px;
		    margin: 3px; /* espace entre boutons*/
			
			color: #E68A09;
					 }




			

  a,  a:visited {
     display: block;
    width:auto;
	 background:#A654E4 ;
	  box-shadow: 2px 2px 2px #000099;
     text-decoration: none;
    /*bottom: 2px;*/
    border-radius: 15px;
    font-size: 0.9em;
    font-weight: bold;
    text-align: center;
     padding: 5px 5px 5px 5px;   /* taille des boutons*/
    color: #FFFFFF;
                                   }

 a:hover {
  color: red;
    border-bottom: 3px solid #e8220c; }





      
 /* _______________________________Corps_____________________ */
 
 

			
/* haut | droit | bas | gauche */	


		  
	
article4 {	
            
		   
			  width: 98%;
			
			  font-size: 90%;
			  margin: 2px ;
			  padding: 1% 0.5% 1% 0.5%;
			 
			  }	
			  
article4 img { width : 95%;
			height: auto;
			 border-radius: 15px;
                    }			  

/* haut | droit | bas | gauche */	
			  
article4 H1 {
	        
			 font-weight: bold;
			 text-align: center;
			 }	
			 
			 
article4 H2 {
	        
			 font-size: auto;
			 font-weight: bold;
			 text-align: justify;
			  padding: 0 3% 0 3%;
			 }	


article3 {	
            
			  width:100%;
			
			  font-size:1.1em;
			  margin: 2px ;
			  padding: 0.5% 0.2% 0.5% 0.2%;
			 
			  }	

			 

article3 p {width:98%;
	              
			  font-size: auto;
			
			   text-align: left;
			  
			margin:1% ;
			
			 }	
			 
article3 H1 {
	
	        width:40%;
	        
			 font-size: auto;
			 font-weight: bold;
			 text-align: center;
			 }	
			 
 article3 H2 {
	          width: 40%;
			
			 font-size:1.5em;
			 font-weight: bold;
			 text-align: center;
			  padding: 0 3% 0 3%;
			 
			 }			 
			 

article3 H3, article4 H3 {
	        
			font-size: 1.3em;
			 color: #5A3A22;
			 text-align: center;
			  padding: 1% 1% 1% 1%;
			 }				 

article3 img{
	           width: 1200px;
			height: auto;
			 border-radius: 10px;
                    }			 
			 


            
section1 H1
  {text-align: center;
   color: #0000FF;
   width:100%;
   font-size: auto;
  }
			  
			  
table,
td {
	width: auto;
	 margin: 1px 1px 1px 1px;
    border: 1px solid black;
	 background-color:#ffffff;
	 font-size: auto;
}

table,
th {
	width: auto;
	 margin: 0 0 0 0;
    border: 1px solid black;
	 background-color:#90EE90;
	  font-size: auto;
	 
}

		  
			  

/* haut | droit | bas | gauche */

/* ______________________________FORMULAIRE _______________ */



#formulaire {
    width: 50%;
}


 input[type=text], input[type=email] {
  width: 80%;
  padding: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 10px;
  margin-right: 0px;
  margin-left: 0px;
  resize: vertical;
  color: #000000;
}

textarea {
  width: 80%;
  height  : 15%;
  padding: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  margin-right: 0px;
  margin-left: 0px;
  resize: vertical;
}



input[type=submit] {
  background-color: #1255a2;
  font-size: 0.9rem;
  color: white;
  padding: 5px 20px;
  border: none;
  border-radius: 10px;
  cursor: pointer;
}
			
Label { text-align: center;
      }
	
span
	     {
		
		  display: block;
		   width:98%;
		   font-size: 1.0em;
		      
           height: auto;
           margin: auto;
           padding: 5px 0;
          text-align: center;

	   }	
/*____________________________________LES DIVS ____________________ */



/* haut | droit | bas | gauche */

 .box1 {
   width: auto;
         padding: 5px 5px;
       margin: 5px 5px 5px 5px;
	   font-size: 1.0em;
       background-color: #f8f8f8;
       border: 2px solid #ccc;
      border-radius: 5px;
       box-sizing: border-box;
   } 




grand
	                   { display:block;	
	                   }
					   
moyen
	                   { display:none;	
	                   }
					   

petit
	                   { display:none;	
	                   }
					   

/*____________________________________________ 1024 __________________________________________________________ */

@media all and (min-width: 720px) and (max-width: 1199px) {
	
#bloc_page{
	     width: 100%;	
}
	
	
article3 {	
            
			  width:95%;
              font-size: 1.0em;			  
          }

article3 H3, article4 H3 {
	        
			font-size: 1.2em;	
}			
	
article3 img{
	           width: 600px;
			height: auto;
                    }	
					
input[type=text], input[type=email], textarea {
  width: 95%;
}

grand
	                   { display:none;	
	                   }
					   
moyen
	                   { display:block;	
	                   }
					   

petit
	                   { display:none;	
	                   }				
					

}
/*____________________________________________ 1024 __________________________________________________________ */

@media all and (min-width: 10px) and (max-width: 719px) {
	
#bloc_page{
	     width: 100%;	
}	
	

article3 {	
            
			  width:95%;
			  font-size:0.7em;
            }	

article3 H3 {
	        
			font-size: 1.1em;	
}			

article3 img{
	           width: 300px;
			height: auto;
                    }	
					
article1 img{
	           width: 300px;
			height: auto;
                    }						
					
article3 H2 {
	          width: 100%;
			 font-size:1.5em;
			 font-weight: bold;
			 text-align: center;
			  padding: 0 3% 0 3%;
			 
			 }						
					

article3 H3, article4 H3 {
	       	 font-size:0.9em;
			
			 text-align: center;
			  padding: 3% 3% 3% 3%;
			 }

article1 H3 {
	          font-size:0.7em;
			
			 text-align: center;
			  padding: 0 0 0 0;
			 }

			 

article4 {	
            
		     width: 90%;
			
			  font-size: 90%;
			  margin: 2px ;
			  padding: 1% 0.5% 1% 0.5%;
			 
			  }	
	  

article4 H1, article3 H1 {
	        
			 font-size: 100%;
			 
			 }	

article4 H2, article3 H2 {
	          width: 100%;
			 font-size:0.8em;
			 font-weight: bold;
			 text-align: left;
			  padding: 0 3% 0 3%;
			 
			 }
			 
				 
			 
article4 img { width : 95%;
			  height: auto;
                    }
	 
   

input[type=text], input[type=email], textarea {
  width: 95%;
}


/* haut | droit | bas | gauche */
			

				
		
	
	   
grand
	                   { display:none;	
	                   }

petit
	                   { display:block;	
	                   }

moyen
	                   { display:none;	
	                   }



	
	
}