@charset "windows-1252";   /* ceci est une règle */
   			 
  a {
    TEXT-DECORATION: none
  }
  a:hover {
    TEXT-DECORATION: underline
  }
  a:link {
    color: blue
  }
  a:visited {
    color: #000080
  }
  a:active {
    color: red
  }

  body { 
		min-height: 100%; 
		background-image: url(../images/fond.png);	 
		background-size: cover; 
		margin: 0; 
		padding: 2em;
	}
  
  table {
	border-collapse : collapse;
  }
  td { 
    border-width:2px;
    border-style:solid; 
    border-color:black;
  }

	.liste {
    clear: both;
	float: left;
	margin: 40px 15% 0px 15%;
	color: black;
	font-size: 12pt;
	text-align: justify;
	background-color: white;
  }

@media screen and (max-width: 480px) {
	
  .form1 {
    display: none;
  }
  
  .form2 {
    display: block;
    
  }
  
  .ecran {
		width: 350px;
		margin: 0 auto;
		float: none;	 
		font-family:  Tahoma, Arial, Helvetica, sans-serif; 
		font-size: 14pt;  
		border-radius: 7px;
		background-color: white; 
		text-align: center;
	}
	
	.entete	{
		clear: both;
		float: left;
		margin-top: 1em;
	  background-color: white;
	}
		
	.logo{
		width: 320px;
		float: left;
	}

	.titre{
		margin-top: 15px;
		width: 350px;
		float: left;
		color: black;
		font-size: 24pt;
	}
	
  .soustitre{
		clear: both;
		margin-top: 30px;
		float: left;
		width: 100%;
		color: black;
		font-size: 14pt;
	}
	
	.texte { 
    clear: both;
		float: none;
		margin: 30px 30px 30px 30px;
		color: black;
		font-size: 12pt;
		text-align: justify;
		background-color: white;
	}

	.image_droite{
    width: 100%;
    margin: 10px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}

	.image_gauche{
    width: 100%;
    margin: 10px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
  }	

	.image_centre{
    width: 100%;
    margin: 10px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}		   
	
  .image{
		width: 100%;
		height: auto;
	}

  .image_reduite{
    width: 100%;
		height: auto;
	}

  .image_exacte{
		display: none;
	}
  
  .pied_de_page {
    clear: both;
    font-style: italic;
    border-top: thin;
    border-top-color: black;
    border-top-style: solid;
	}
}

@media screen and (max-width: 767px) and (min-width: 481px){
		
  .form1 {
    display: none;
  }
  
  .form2 {
    display: block;
    
  }
  
  .ecran {
		width: 450px;
		margin: 0 auto;
		float: none;	 
		font-family:  Tahoma, Arial, Helvetica, sans-serif; 
		font-size: 14pt; 
		background-color: white; 
		text-align: center;
		border-radius: 7px;
	}
	
	.entete	{
		clear: both;
		float: left;
		margin-top: 1em;
	    background-color: white;
	}
		
	.logo{
		width: 320px;
		float: left;
	}

	.titre{
		clear: both;
		margin-top: 15px;
		width: 450px;
		float: left;
		color: black;
		font-size: 24pt;
	}
	
  .soustitre{
		clear: both;
		margin-top: 30px;
		float: left;
		width: 100%;
		color: black;
		font-size: 14pt;
	}
	
	.texte { 
    clear: both;
		float: none;
		margin: 30px 30px 30px 30px;
		color: black;
		font-size: 12pt;
		text-align: justify;
		background-color: white;
	}
    
	.image_droite{
    float: right;
    width: 60%;
    margin: 10px 0px 0px 10px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}

	.image_gauche{
    float: left;
    width: 60%;
    margin: 10px 10px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
    }	

	.image_centre{
    width: 100%;
    margin: 10px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}		   
	
  .image{
		width: 100%;
		height: auto;
	}
      
  .image_reduite{
    width: 100%;
		height: auto;
	}

  .image_exacte{
		display: none;
	}

  .pied_de_page {
    clear: both;
    font-style: italic;
    border-top: thin;
    border-top-color: black;
    border-top-style: solid;
	}
}
		
@media screen and (max-width: 979px) and (min-width: 768px){
		
  .form1 {
    display: none;
  }
  
  .form2 {
    display: block;
    
  }
  

  .ecran {
		width: 700px;
		margin: 0 auto;
		float: none;	 
		font-family:  Tahoma, Arial, Helvetica, sans-serif; 
		font-size: 14pt; 
		background-color: white; 
		text-align: center;
		border-radius: 7px;
	}
 	
	.entete	{
		clear: both;
		float: left;
		margin-top: 1em;
	  background-color: white;
	}
		
	.logo{
		width: 320px;
		float: left;
	}

	.titre{
		margin-top: 15px;
		margin-left: 30px;
		width: 480px;
		float: left;
		color: black;
		font-size: 24pt;
	}
	
  .soustitre{
		clear: both;
		margin-top: 30px;
		float: left;
		width: 100%;
		color: black;
		font-size: 14pt;
	}
	
	.texte { 
    clear: both;
		float: none;
		margin: 30px 30px 30px 30px;
		color: black;
		font-size: 12pt;
		text-align: justify;
		background-color: white;
	}
    
	.image_droite{
    float: right;
    width: 40%;
    margin: 10px 0px 0px 10px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}

	.image_gauche{
    float: left;
    width: 40%;
    margin: 10px 10px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
    }	

	.image_centre{
    width: 100%;
    margin: 10px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}		   
	
  .image{
		width: 100%;
		height: auto;
	}

  .image_reduite{
    width: 100%;
		height: auto;
	}

  .image_exacte{
		display: none;
	}

  .pied_de_page {
    clear: both;
    font-style: italic;
    border-top: thin;
    border-top-color: black;
    border-top-style: solid;
	}
}
		
@media screen and (max-width: 1199px) and (min-width: 980px){
		
  .form1 {
    display: none;
  }
  
  .form2 {
    display: block;
    
  }
  

  .ecran {
		width: 900px;
		margin: 0 auto;
		float: none;	 
		font-family:  Tahoma, Arial, Helvetica, sans-serif; 
		font-size: 14pt; 
		background-color: white; 
		text-align: center;
		border-radius: 7px;
	}
	
	.entete	{
		clear: both;
		float: left;
		margin-top: 1em;
	    background-color: white;
	}
		
	.logo{
		width: 320px;
		float: left;
	}

	.titre{
		margin-top: 15px;
		margin-left: 30px;
		width: 480px;
		float: left;
		color: black;
		font-size: 24pt;
	}
	
  .soustitre{
		clear: both;
		margin-top: 30px;
		float: left;
		width: 900px;
		color: black;
		font-size: 14pt;
	}
	
	.texte { 
    clear: both;
		float: none;
		margin: 30px 30px 30px 30px;
		color: black;
		font-size: 12pt;
		text-align: justify;
		background-color: white;
	}
    
	.image_droite{
    float: right;
    width: 38%;
    margin: 10px 0px 0px 10px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}

	.image_gauche{
    float: left;
    width: 38%;
    margin: 10px 10px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
    }	

	.image_centre{
    width: 100%;
    margin: 10px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}		   
	
  .image{
    width: 100%;
		height: auto;
	}

  .image_reduite{
		display: none;
    width: 100%;
		height: auto;
	}
  
  .image_exacte{
		height: auto;
	}
    
  .pied_de_page {
    clear: both;
    font-style: italic;
    border-top: thin;
    border-top-color: black;
    border-top-style: solid;
	}
}

@media screen and (min-width: 1200px) {
			
  .form1 {
    display: block;
  }
  
  .form2 {
    display: none;
    
  }
  

  .ecran {
		width: 1000px;
		margin: 0 auto;
		float: none;	 
		font-family:  Tahoma, Arial, Helvetica, sans-serif; 
		font-size: 14pt; 
		background-color: white; 
		text-align: center;
		border-radius: 7px;
	}
 	
  .entete	{
    clear: both;
    float: left;
    margin-top: 1em;
    background-color: white;
	}
		
	.logo{
		width: 320px;
		float: left;
	}

	.titre{
		margin-top: 15px;
		margin-left: 80px;
		width: 480px;
		float: left;
		color: black;
		font-size: 24pt;
	}
	
  .soustitre{
		clear: both;
		margin-top: 30px;
		float: left;
		width: 1000px;
		color: black;
		font-size: 14pt;
	}
	
	.texte { 
		clear: both;
		float: none;
		margin: 30px 30px 30px 30px;
		color: black;
		font-size: 12pt;
		text-align: justify;
		background-color: white;
	} 
	
  .image_droite{
    float: right;
    width: 38%;
    margin: 10px 0px 0px 20px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}

	.image_gauche{
    float: left;
    width: 38%;
    margin: 10px 20px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
    }	

	.image_centre{
    width: 100%;
    margin: 10px 0px 0px 0px;
    text-align: center;
    font-style: italic;
    font-size: 9pt;
	}		   
	
  .image{
    width: 100%;
		height: auto;
	}

  .image_reduite{
		display: none;
    width: 100%;
		height: auto;
	}
  
  .image_exacte{
		height: auto;
	}
    
  .pied_de_page {
    clear: both;
    font-style: italic;
    border-top: thin;
    border-top-color: black;
    border-top-style: solid;
	}
}