/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|                                   index                                   |
|---------------------------------------------------------------------------|
|                                                                           |
|                          Site MCAE.org			                         |
|                                                                           |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|                                              Sabine BOUBEL - sept 2008	 |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/


/* Comportement général des balises
-----------------------------------------------------------------------------
	Les règles associées aux balises ci-dessous modifient le comportement de
	ces balises, sur toute la page, quelque soit leur place dans
	l'arborescence.
---------------------------------------------------------------------------*/

/* Toutes les marges et padding sont mises à 0 */
* {
	margin: 0;
	padding: 0;
	}
	
/* Suppression du soulignement des liens */
a {
	text-decoration: none;
	}
img {
	border:none;
	}	

/* Fond de la page en blanc */
body {
	background-color: #fff;
	}


/* Définition de la zone 'global'
-----------------------------------------------------------------------------
	La zone 'global' est centrée sur la page, avec une largeur fixe. Tous
	les autres éléments (à quelques exceptions prêt) sont des enfants de
	cette balise <div>
---------------------------------------------------------------------------*/
#global {
	position: relative;	
	width: 814px;
	margin-right: auto;
	margin-left: auto;
	top:20px;
	}




/* Définition de la zone haut
-----------------------------------------------------------------------------
	La zone 'haut' se place en haut de la page, et affiche une image.
---------------------------------------------------------------------------*/
#haut {
	position: relative;
	float: left;
	width: 814px;
	height: 302px;
	background-image:url(../images/bandeauHaut.jpg);
	background-repeat:no-repeat;
	}
	
#haut ul#menuHaut {
	position:relative;
	float:left;
	margin-top:180px;
	margin-left:9px;
	z-index:100;
	list-style-type:none;
	}
#haut ul#menuHaut li a {
	display:block;
	height:22px;
	width:120px;
	background-image:url(../images/fondBoutonHaut.jpg);
	background-position:0 0;
	background-repeat:no-repeat;
	font:0.7em Verdana, Arial, Helvetica, sans-serif;
	color:#33CC33;
	line-height:22px;
	padding-left:80px;
	}

#haut ul#menuHaut li a:hover, #haut ul#menuHaut li a.lienMort {
	color:#FF6600;
	background-position:-15px -22px;
	padding-left:90px;
	}

#haut a#tpe, #haut a#social {
	position:absolute;
	display:block;
	top:200px;
	width:155px;
	font:0.8em Verdana, Arial, Helvetica, sans-serif;
	height:58px;
	background-image:url(../images/grosBouton.jpg);
	background-repeat:no-repeat;
	color:#66CC00;
	}	
#haut a#tpe {
	left:280px;
	}
#haut a#social {
	left:480px;
	}

#haut a#tpe:hover, #haut a#social:hover {
	color:#FF6600;
	/*background-position:0 -58px;*/
	}
#haut a.lienMort span, #haut a.lienMort {
	background-position:0 -58px;
	}
#haut a#tpe span, #haut a#social span {
	display:block;
	padding-left:85px;
	}



/* Définition de la zone centre
-----------------------------------------------------------------------------
	La zone 'centre' se place au centre de la page, et affiche une image.
---------------------------------------------------------------------------*/
#centre {
	position: relative;
	float: left;
	width: 814px;
	background-image:url(../images/fondCentre.jpg);
	/*background-color:#FFCC00;*/
	}
#centre .vert {
	color:#66CC33;
	}
#centre .orange {
	color:#FF6600;
	}
#centre .gras {
	font-weight:bold;
	}

#centre a {
	color:#66CC33;
	}
#centre a:hover {
	color:#FF6633;
	}
#centre table {
	border:none;
	}

/* Définition de la zone bas
-----------------------------------------------------------------------------
	La zone 'bas' se place en bas de la page, et affiche une image.
---------------------------------------------------------------------------*/
#bas {
	position: relative;
	float: left;
	width: 814px;
	height:150px;
	background-repeat:no-repeat;
	}
#bas p {
	position:absolute;
	text-align:center;
	height:20px;
	font:0.7em Verdana, Arial, Helvetica, sans-serif;
	}
#bas p span.separateur {
	font:1.2em bold Arial, Helvetica, sans-serif;
	color:#66CC00;
	margin:0 5px;
	}
#bas p#menu1 {
	top:39px;
	width:814px;
	}
#bas p#menu1 a {
	color:#fff;
	}
#bas p#menu1 a:hover {
	color:#33CC33;
	}
#bas p#menu2 {
	top:72px;
	padding-left:150px;
	}
#bas p#menu2 a {
	color:#FF6600;
	}
#bas p#menu2 a:hover{
	color:#33CC33;
	}
#bas p#menu2 img{
	float:left;
	margin:0 5px;
	}