body {
background-color: lightblue;
}

@media(max-width: 480px) {
	
			div.menu {
				position: relative;
				background-color: white;
				width: 100%;
				margin-left: 0%;
				margin-right: 0%;
				clear: both
			}

			table.menu {
				margin-left: 0px;
				margin-right: 0px;
				width: 100%;							
			}
			th.titre {
				border: none;
				color: #000000;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 18px;
				text-align: center;
				width: 100%;				
			}
			
			th.menu {
				border: none;
				color: #0F53FF;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 14px;
				text-align: justify;								
			}

			th.menu2 {
				border: none;
				color: #404040;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 14px;
				text-align: justify;								
			}			
			
			
			p.titre {
			text-align: justify;
			/*white-space:nowrap; */
			color: #0F53FF;
			font-style: arial-tahoma;
			font-size: 20px;
			font-weight: bold;
			}
			
			h1.titre {
			text-align: center;
			/*white-space:nowrap; */
			color: #000000;
			font-style: arial-tahoma;
			font-size: 24px;
			font-weight: bold;								
			}


				
}



/* écrans TABLETTES largeur MINI 481 px et MAXI 780 px ************************************************************************/
/*******************************************************************************************************************************************/
@media(min-width: 481px) AND (max-width: 780px) {
	
			div.menu {
				position: static;
				background-color: white;
				width: 90%;
				margin-left: auto;
				margin-right: auto;
			}

			table.menu {
				margin-left: auto;
				margin-right: auto;
				width:90%;							
			}	
			
			th.titre {
				border: none;
				color: #000000;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 22px;
				text-align: center;								
			}
			
			th.menu {
				border: none;
				color: #0F53FF;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 20px;
				text-align: justify;								
			}

			th.menu2 {
				border: none;
				color: #404040;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 20px;
				text-align: justify;								
			}			

			h1.titre {
			text-align: center;
			/*white-space:nowrap; */
			color: #000000;
			font-style: arial-tahoma;
			font-size: 28px;
			font-weight: bold;								
			}			

	
}



/* écrans ORDIS largeur MINI 781 px ************************************************************************/
/*******************************************************************************************************************************************/
@media(min-width: 781px) {
	
			div.menu {
				position: static;
				background-color: white;
				width: 50%;
				margin-left: auto;
				margin-right: auto;
			}

			table.menu {
				margin-left: auto;
				margin-right: auto;
				width: 50%;							
			}
			th.titre {
				border: none;
				color: #000000;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 26px;
				text-align: center;								
			}
			
			th.menu {
				border: none;
				color: #0F53FF;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 24px;
				text-align: justify;								
			}	

			th.menu2 {
				border: none;
				color: #404040;
				background-color: #white;	
				font-style: arial,tahoma;
				font-weight: bold;
				font-size: 24px;
				text-align: justify;								
			}			
			h1.titre {
			text-align: center;
			/*white-space:nowrap; */
			color: #000000;
			font-style: arial-tahoma;
			font-size: 28px;
			font-weight: bold;								
			}
				 
				
	
	
}