html {
  height: 100%;
}

body {
  font-family:geneva, helvetica, sans-serif ; 
  min-height: 100%;
  margin: 0;
  margin-bottom:10px;
  margin-top:10px;
  padding: 0;
  font-size : 100% ;
}

.button { border:solid 1px #333333 ; font-size:11px ; padding:5px ; background:#eeeeee }

a:link {color:#000066}

a:visited {color:#000066}

a:hover {color:#FF8000}
	
table  { background:#dddddd; width:80%  }

table.adresse { background:#dddddd;  width:600px ; text-align:left }
 
	H1 { color:#FF8000; font-size:1.5em }
	H2 { color:#01A9DB                  }
	TD {  text-align:center ;  font-size:1em ; color:#000066 ; background:#FFFFFF ;  background:#FFFFFF ;  font-family:arial, helvetica, sans-serif ;}
	TD.accueil {  text-align:left;  font-size:1em ; color:#000066 ; background:#FFFFFF ;  background:#FFFFFF ;  font-family:arial, helvetica, sans-serif ;  font-size:1.5em }
	
	TD .TD_right    { text-align:right  ; font-size:1.2em ; color:#000066 ; background:#FFFFFF ;    font-family:arial, helvetica, sans-serif ;}
	TD .TD_champ    { text-align:left   ; text-decoration:underline ; font-size:1.2em ; color:#000066 ; background:#FFFFFF ;    font-family:arial, helvetica, sans-serif ;}
	TD .TD_calendar { text-align:center ; } 
	
	TH {  text-align:center;  background:linear-gradient(to bottom, #FFFFFF, #eeeeff);  font-family:arial, helvetica, sans-serif; color:#0000AA; font-size:1.1em }
	
	TD.color0 {background-color:#EFF5FB; text-align:left;text-decoration:underline}
	TD.color1 {background-color:#E0ECF8; text-align:center;}
	TD.color2 {background-color:#CEE3F6; text-align:center;}
	TD.color3 {background-color:#A9D0F5; text-align:center;}
	TD.color4 {background-color:#81BEF7; text-align:center;}
	TD.color5 {background-color:#58ACFA; text-align:center;}
	TD.color6 {background-color:#EFF5FB; text-align:right ;text-decoration:underline}
	.chevron  {color:#cccccc; text-align:center; font-size:1.5em; text-decoration:none }
	a {text-decoration:none}
	a:hover {text-decoration:underline}  
	.menu { font-size:14px ; border:solid 1px #666666 ; background-color:#EEEEEE;}
	
	#wrap { max-width:100% ; }
	#content { border:solid 1px #000000 ; margin: 0 auto; max-width:95% ; min-width:450px ; padding-bottom:50px;   margin-bottom:20px ;    padding:20px ;  }
	#titre { font-size:100% ; color:#aaaaaa  }
	.th2 { font-size:1em ; color:#01A9DB  ;  background-color:#FFFFFF ; }
	
	input checkbox { width:30px ; height:30px }
	
.bouton_reserver {  background:#FF8000 ; color:#FFFFFF ; border:solid 1px #000000 ; height:30px; width:200px ; font-size:1.4em }

.entete1 {  font-size:12px }

.entete2 {  font-size:11px  }


	/********************************************************/
		/*
		@media only screen and (max-device-width: 500px) {

		.w3-input{ padding:5px;display:block;width:95% ; border:1px solid #ccc!important ; font-size:2em }

		.w3-btn,.w3-button{ margin-top:10px ; border:none;display:inline-block;outline:0;padding:8px 16px;vertical-align:middle;overflow:hidden;
		text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap ; font-size:1.5em }
			
		.w3-blue,.w3-hover-blue:hover{ color:#fff!important;background-color:#2196F3!important }	

		
		table { background:#eeeeee ; width:95% }	
		
		
		}
		*/
	/********************************************************/


.w3-input{ padding:5px;display:block;width:80% ; border:1px solid #ccc!important ; font-size:1.2em }

.selection{ padding:5px;display:block;width:400px ; border:1px solid #ccc!important ; font-size:1.2em }


.w3-btn,.w3-button{ margin-top:10px ; border:none;display:inline-block;outline:0;padding:8px 16px;vertical-align:middle;overflow:hidden;
text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap ; font-size:1.5em ;  }
	
.w3-blue,.w3-hover-blue:hover{ color:#fff!important;background-color:#2196F3!important }	

.w3-gris,.w3-hover-gris:hover{ color:#fff!important;background-color:#cccccc!important }	

.chevron { font-size:2em ; color:#0000FF }


 /*   BODY { font-family:arial, helvetica, sans-serif ; }
	
	TD { width:100px ; text-align:center ;  background:#FFFFFF ;  font-family:arial, helvetica, sans-serif ;}
	TABLE { background:#A9E2F3 ; }
	#TD2 { width:20px }
   .tranche_horaire { margin-top:$de_hor px ; background:$bg ; padding:5px ;  border:solid 1px #333333  ; margin:3px ; font-size:10px }
   H1 { color:#FF6400 }
*/


@media (max-width: 640px) {
	
	
	table { background:#f6f6f6 ; width:95% }	
	
	
	* {
		box-sizing: border-box;
	}
	
	/* passer body (et tous les éléments de largeur fixe) en largeur automatique */

	body {
		width: auto;
		margin: 0;
		padding: 0;
	}
	
	/* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

	img,
	table,
	td,
	blockquote,
	code,
	pre,
	textarea,
	input,
	iframe,
	object,
	embed,
	video {
		max-width: 100%;
	}
	
	/* conserver le ratio des images */

	img {
		height: auto;
	}
	
	/* gestion des mots longs */

	textarea,
	table,
	td,
	th,
	code,
	pre,
	samp {
		-webkit-hyphens: auto; /* césure propre */
		-moz-hyphens: auto;
		hyphens: auto;
		word-wrap: break-word; /* passage à la ligne forcé */
	}
	
	code,
	pre,
	samp {
		white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
	}
	
	/* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */

	.element1,
	.element2 {
		float: none;
		width: auto;
	}
	
	/* masquer les éléments superflus */

	.hide_mobile {
		display: none !important;
	}
	
	/* Un message personnalisé */

	body:before {
		content: "Version mobile du site";
		display: block;
		text-align: center;
		font-style: italic;
		color: #777;
	}
	
	
	
	
	

	
	    .selection { width:100% ; border:1px solid #ccc ; font-size:1.5em }
        option.selection { width:100% ; border:1px solid #ccc ; font-size:1.5em }
	
		.w3-btn,.w3-button{ margin-top:10px ; border:none;display:inline-block;outline:0;padding:8px 16px;vertical-align:middle;overflow:hidden;
		text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap ; font-size:1.5em }
			
		.w3-blue,.w3-hover-blue:hover{ color:#fff!important;background-color:#2196F3!important }	
	
	
	
}


@media (max-device-width:768px) and (orientation: landscape) {
  html {
   -webkit-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
  }
}