/*
design.css

Par JMR
Le 15/12/2011
*/

/* Eléments principaux de la page */

body
{
	margin: auto; /* Pour centrer notre page */
	margin-top: 10px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
	margin-bottom: 20px;    /* Idem pour le bas du navigateur */
	background-image: url("images/vagues_orange.jpg"); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */

	max-width: 1500px;
	min-width: 600px;
}

#wrap 
{
	overflow:hidden;
}

p, section h1, section h2, section h3, section h4, petit, .element_menu h3
{
	color : blue; /* Ecriture bleue */
}

section h1
{
	text-align: center; /* Pour centrer le titre */
	font-family: "Arial Black", Arial, Verdana, serif; /* On essaie d'avoir Arial Black en priorité */
	font-size : 1.6em; /* Taille titre 1 */
	text-shadow: 2px 2px 9px #777;
}

section h2
{
	font-family: "Arial Black", Arial, Verdana, serif; /* On essaie d'avoir Arial Black en priorité */
	font-size : 1.3em; /* Taille titre 2 */
}

section h3
{
	font-family: "Arial Black", Arial, Verdana, serif; /* On essaie d'avoir Arial Black en priorité */
	font-size : 1em; /* Taille titre 3 */
}

section h4
{
	font-family: "Arial Black", Arial, Verdana, serif; /* On essaie d'avoir Arial Black en priorité */
	font-size : 1em; /* Taille titre 4 */
	font-weight: bold;
	text-align: center;
}

em
{
	font-style: normal;
	font-weight: bold;
}

strong
{
	font-style: normal;
	font-weight: bold;
	color: red;
}

p
{
	/* La police Comic Sans MS est agréable à lire pour les paragraphes je trouve */
	font-family: "Comic Sans MS", "Trebuchet MS", Georgia, serif;
	font-size : 1em; /* Taille paragraphe */
}


img
{
	padding: 3px;
	vertical-align:middle;
}

table
{
	margin: auto; /* Centre le tableau */
	border-collapse: collapse;
	font-family: "Comic Sans MS", "Trebuchet MS", Georgia, serif;
	font-size : 1em;
	color : blue;
	text-align : center;
}

td, th /* Mettre une bordure sur les td ET les th */
{
   border: 1px solid blue;
}

label {
display:block;
width:250px;
float:left;
}



.trespetit
{
	font-size: 0.2em;
}

.petit
{
	font-size: 0.8em;
}

.centre
{
	text-align: center;
}

.droite
{
	text-align: right;
}

.lienspp
{
	font-size : 0.7em;
	color: gray;
}


/* L'en-tête */

#en_tete
{
	/* position : center; */

	width: 850px;
	height: 100px;
	background-image: url("images/banniere.gif");
	background-repeat: no-repeat;	
	margin: auto;
	margin-bottom: 20px;
}



#menu_haut {
	width: 875px;
	height: 50px;
	margin: auto;
	padding: 0;
	margin-bottom: 40px;
	background: url(images/menu_haut-bg.jpg) no-repeat left top;
	font-family: "Arial Black", Arial, Verdana, serif; /* On essaie d'avoir Arial Black en priorité */
	font-weight: bold;
	font-size : 1.0em; /* Taille menu haut */
}

#menu_haut ul {
	list-style: none;
	margin: 0;
	padding: 0;
} 
#menu_haut ul li {
	display: inline;
	margin: 0px;
} 
#menu_haut ul li a {
	height:33px;
	display: block;
	float: left;
	padding: 17px 15px 0 15px;
	color: #0000ff;
	text-decoration: none;
	background: url(images/menu_haut-separator.png) no-repeat right center;
} 

#menu_haut ul li a:hover {
	color:#ff0000;
	background: url(images/menu_haut-hover.png) repeat-x left top;
}

#menu_haut ul li#active a {
	color:#FFF;
	background: url(images/menu_haut-hover.png) repeat-x left top;
}	


/* Navigation */


#menu
{
	float:left;
	width: 200px; /* Très important : donner une taille au menu */
	
	margin-left: 5px;
}

.element_menu
{
	/* background-image: url("images/jaune.jpg"); */
	border: 4px ridge red;
	border-radius: 15px;
	box-shadow: 3px 3px 12px #555;
	margin-bottom: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
	text-align: center;
}

.element_menu li
{
	text-align: justify;
}



/* Le corps de la page */

article
{
	/* clear:both; */
	width: 75%;
	
	margin: auto;
	margin-left: 220px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
	margin-right: 20px;
	margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
	padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
	/* background-image: url("images/vagues_orange.jpg"); */
	
	border: 5px ridge red; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
	border-radius: 15px;
	box-shadow: 3px 3px 12px #555;
}


#map_canvas
{
	/* position : center; */
	width: 95%;
	height: 400px;
	padding : 10px;
	border : 1px solid #1B5EA8;
	margin : 0 auto;
}



/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

footer
{
	padding: 5px;
	clear: both;

	text-align: center;

	/* background-image: url("images/jaune.jpg"); */
	background-repeat: repeat-x;
	font-family: "Arial Black", Arial, Verdana, serif; /* On essaie d'avoir Arial Black en priorité */
	font-size : 0.8em; /* Taille pied de page */
	
}