html {
  font-size: 100%;
}

body {
	background-color: #99CCFF; /* Bleu léger */
	font-family: Arial, Helvetica, "Nimbus Sans L", sans-serif;	
	font-size: 0.9em;	
	width: 100%;
	height: 100%;
	margin: 0 0;
	padding: 0; /* Légères marges sur les côtés de la page */
	text-align: center;
}


/* OVER-HEADER */

#over-header {
  /*border: 1px solid #ccff00;*/
  font-size: 1em;
  margin: 0 auto;
  width: 770px;
  padding: 10px 0 10px 0;
}

/* ACCESSIBILITE */

#accessible {
  /*border: 1px solid #000000;
  background-color: #ff00aa;*/
  text-align: right;
  width: 60%;
  float: right;
  font-size: 0.8em;
}

#accessible ul {
  margin: 0;
  padding: 0;
}

#accessible li{
  color: #FFFFFF;
  font-weight: bold;
  display: inline;
}

#accessible a{
  background-color: transparent;
  color: #FFFFFF;
}

#accessible a:hover{
  text-decoration: none;
}

#style {
  /*border: 1px solid #ffff00;
  background-color: #ffffaa;*/
  margin: 0;
  padding: 0;
  margin-right: 40%;
  text-align: left;
  font-size: 1em;
}

#style p {
  margin: 0;
  padding: 0;
}

#style form {
  margin: 0;
  padding: 0;
}

#style label {
  font-size: 0.8em;
  color: white;
  font-weight: bold;
}

/* HEADER */

#header {
	height: 170px; /* Hauteur paramétrable, égale ou supérieure à la hauteur de l'image */
	width: 770px;
	font-size: 1em;
	background-color: white;
	text-align: left;
	margin: 0 auto;
	padding: 0 0 0 0;
}

/* élément h1 */
h1 {
  padding: 0 0 0 50px;
  font-size: 1.3em;
}

h1 img {
  border: none;
}

h1 span {
  display: none; /* Permet de ne pas visualiser le texte de la balise h1 */
}

/* paragraphe header */
#header p {
	margin: 0;
	text-align: center;
	font-size: 0.8em;
	font-weight: bold;
}



/* CONTENEUR */

#conteneur {
	height: auto;/*680px;  Hauteur paramétrable, doit être la même que : le menu et le contenu */
	padding: 0;
	font-size: 1em;
	width: 770px;
	margin: 0 auto;
	background-color: white;
}

/* NAV-INFO */
#nav-info {
  text-align: left;
  padding: 25px 0 10px 40px;
  color: #0000CD; /* Medium blue */;
  font-size: 0.75em;
  font-weight: bold;
}

#nav-info h2 {
  font-size: 1em;
}

#nav-info a:hover {
  background-color: #AFEEEE;
	text-decoration:none;
}

#nav-info a:visited {
  color:#0000CD;
}

/* MENUS */

#menu {
	border:1px dotted red;
  text-align: left;
  margin-right: 2%;
  padding: 20px 15px 100px 10px;
  /*height: 640px;  Hauteur paramétrable, est égale à la hauteur du conteneur - this.getPaddingTop()*/
  height: auto;
  font-size: 1em;
  float: right;
  width: 25%;
}

/* élément h2 */
#menu h2 {
  font-size: 0.8em;
  text-transform: uppercase;
  color: #000000;
  margin-bottom: 5px;
  padding: 5px 0 0 0;
  border-bottom: 2px solid;
  border-color: #99CCFF;
}

#menu h2:first-letter {
  font-size: 1.2em;
  color: red; 
}

/* Lien sur h2 */
#menu h2 a {
  text-decoration: none;
  color: #000000;
  font-size: 1em;
}

/* élément h3 */
#menu h3 {
  font-size: 1em;
  font-weight: normal;
  padding: 0;
  margin: 0;
}

/* Menu à part entière */
#menu ul {
  padding: 0 5px 0 5px;
  list-style-type: none;
  margin: 0;
}

#menu li {
  margin: 0 0 5px 15px;
  padding: 0;
  font-size: 0.8em;
  line-height: 1.25em; /* Hauteur de ligne est égale à la moitié de la hauteur de l'image insérée (moitié haute) */  
}

#menu li a {
  display: block;
  width: 200px; /* Largeur paramétrable */
  text-decoration: none;
  color: black;
  text-indent: 15px;
}

#menu li a:hover {
  background: url(../../img/menu-straight-white-blue.png) 0 -2em no-repeat; /* on decale l'image du background de 21px vers le haut pour laisser apparaitre la 2eme partie de l'image*/
  font-weight: bold;
}


/* CONTENU */

#contenu {
  width: 450px; /* = Largeur de 770px du bloc conteneur, minorée de la largeur du menu */
  margin-left: 5%;
  text-align: left;
  padding: 0 20px 100px 20px;
  height: auto;
  color: black;
  font-size: 1em;
}

#contenu h2 {
  font-size: 1.1em;
  color: #0000CD; /* Medium blue */
  padding: 15px 5px 5px 0;
}

#contenu h3 {
  font-size: 1em;
  color: #20B2AA; /* Light sea green */
}

#contenu p {
  text-indent: 25px;
  text-align: justify;
  padding: 0 5px 0 0;
  font-size: 0.8em;
}

#contenu p:first-letter {
  font-size: 1em;
  font-weight: bold;
}

#contenu ul {
	font-size: 0.85em;
	margin:0 0 0 30px;
	padding:0 20px 0 0;
}

#contenu li {
	margin:0 0 5px 15px;
	padding:0 0 0 0;
	font-size: 0.95em;
}

#contenu a {
  font-size: 1em;
  color: #0000CD; /* Medium blue */
}

#contenu a:hover {
  text-decoration: none;
}

#contenu a:visited {
  color: #0000CD; /* Medium blue */
}

/* FOOTER */

#footer {
  margin: 0 auto;
  width: 770px;
  padding: 0;
  font-size: 1em;
  height: 60px; /* Hauteur paramétrable */
  color: white;
  font-weight: bold;
}

#footer p {
  font-size: 0.8em;
}

#footer p span {
  display: none;
}

#footer a {
  color: white;
}

#footer a:hover{
  text-decoration: none;
}