/*ensemble du site*/
body {
margin:0 0 0 0;
padding:0 0 0 0;
font-family:Arial;
}

#global {
width:1024px;
height:auto;
margin:auto;
padding: 0 0 0 0;
background-repeat: no-repeat;
border:0px;
position:relative;
}

/*bandeau en haut de la page*/
#pageHeader {
border:0px;
width:1024px;
height:200px;
padding-left:15px;
padding-top:15px;
}

/*menu: toutes les proprietes du menu avec les images sont en bas de page*/
#menu {
width:400px;
height:inherit;
float:left;
padding-left:15px;
padding-top:15px;
margin:0 0 0 0;
border:0px dotted #999999;
}

#newsletter {
width:400px;
float:left;
padding-left:15px;
padding-top:15px;
margin-top:550px;
margin-right:560px;
border:0px;
display:block;
}

#main {
width:560px;
height:auto;
margin-left:400px;
padding-left:15px;
padding-right:15px;
padding-top:15px;
border:0px;
}
/*menu page boire*/
#mainHeaderBoire {
list-style-type:none;
padding-top:10px;
}

#mainHeaderBoire li {
display:inline;
padding:10px;
font-size:12px;
font-family:Arial;
color:#5D3281;
}

#mainHeaderBoire a {
text-decoration:none;
color:#5D3281;
font-weight:bold;
}
/*__*/
/*menu page manger*/
#mainHeaderManger {
list-style-type:none;
padding-top:10px;
}

#mainHeaderManger li {
display:inline;
padding:10px;
font-size:12px;
font-family:Arial;
color:#D30027;
}

#mainHeaderManger a {
text-decoration:none;
color: #D30027;
font-weight:bold;
}
/*menu page Ecouter*/
#mainHeaderEcouter {
list-style-type:none;
padding-top:10px;
}

#mainHeaderEcouter li {
display:inline;
padding:10px;
font-size:12px;
font-family:Arial;
color:#E95D0F;
}

#mainHeaderEcouter a {
text-decoration:none;
color: #E95D0F;
font-weight:bold;
}
/*menu page Voir*/
#mainHeaderVoir {
list-style-type:none;
padding-top:10px;
}

#mainHeaderVoir li {
display:inline;
padding:10px;
font-size:12px;
font-family:Arial;
color:#2F2D2E;
}

#mainHeaderVoir a {
text-decoration:none;
color: #2F2D2E;
font-weight:bold;
}

#mainContainer {
width:auto;
height:auto;
margin:0 0 0 0;
padding-top:25px;
padding-left:10px;
padding-right:20px;
font-family:Arial;
font-size:12px;
color:#2F2D2E;
}

#pageFooter  {
border:0px;
width:990px;
height:30px;
padding-left:15px;
padding-right:15px;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #D6D6D6;
}


.h1 {
font-size:14px;
font-style:normal;
font-weight:200;
color: #5E5E5E;
}

.h2 {
font-size:12px;
color: #2F2D2E;
}

.h3 {
font-size:28px;
color: #2F2D2E;
}
/* ---------------------------------------------------------------------------------------- Gestion des images rollOver */
/* -------------------------------------- Gestion des blocks générique 
!!! ATTENTION !!! 
ne pas oublier d'ajouter virgule a.imageNomimage avant l'accolade 
c'est une syntaxe d'affectation multiple, ça évite de d'écrire plusieurs fois la même chose et de factoriser les valeurs 
par exemple il suffit de changer la valeur padding pour l'affecter à tous les blocks */
a.imageBoire, a.imageManger, a.imageEcouter, a.imageVoir { 
     display: block;
	 margin: 10px, 0, 0, 0;
	 float:left;
	 width: 370px; 
     height: 60px; 
     background-repeat: no-repeat;
}

a.imageBoireActive, a.imageMangerActive, a.imageEcouterActive, a.imageVoirActive {
	display: block;
	 margin: 10px, 0, 0, 0;
	 float:left;
	 width: 370px; 
     height: 60px; 
     background-repeat: no-repeat;
}

a.imageAteliers, a.imageAdherents, a.imageLieu, a.imageInfos, a.imagePartenaires, a.imagePresse, a.imagePhotos {
     display: block;
	 margin: 10px, 0, 0, 0;
	 float:left;
	 width: 370px; 
     height: 33px; 
     background-repeat: no-repeat;
}

a.imageAteliersActive, a.imageAdherentsActive, a.imageLieuActive, a.imageInfosActive, a.imagePartenairesActive, a.imagePresseActive, a.imagePhotosActive {
     display: block;
	 margin: 10px, 0, 0, 0;
	 float:left;
	 width: 370px; 
     height: 33px; 
     background-repeat: no-repeat;
}
		
/* -------------------------------------- Gestion des blocks personnalisés 
c'est là que tu affectes les images en fonction des blocks
il faut créer une classe par objet, une classe pour le rollOut (celle par defaut) a.imageNomilage
et une classe pour le rollOver a.imageNomimage:hover
*/
a.imageBoire { 
	 background-image:url(img/menu/boire.png);
}
a.imageBoire:hover { 
     background-image:url(img/menu/boire_hover.gif);
}
a.imageBoireActive {
	 background-image:url(img/menu/boire_hover.gif);
}
a.imageManger { 
	 background-image:url(img/menu/manger.png);
}
a.imageManger:hover { 
     background-image:url(img/menu/manger_hover.gif);
}
a.imageMangerActive { 
     background-image:url(img/menu/manger_hover.gif);
}

a.imageEcouter { 
	 background-image:url(img/menu/ecouter.png);
}
a.imageEcouter:hover { 
     background-image:url(img/menu/ecouter_hover.gif);
}
a.imageEcouterActive { 
     background-image:url(img/menu/ecouter_hover.gif);
}
a.imageVoir { 
	 background-image:url(img/menu/voir.png);
}
a.imageVoir:hover { 
     background-image:url(img/menu/voir_hover.gif);
}
a.imageVoirActive { 
     background-image:url(img/menu/voir_hover.gif);
}
a.imageAteliers { 
	 background-image:url(img/menu/ateliers.png);
}
a.imageAteliers:hover { 
     background-image:url(img/menu/ateliers_hover.gif);
}
a.imageAteliersActive {
	background-image:url(img/menu/ateliers_hover.gif);
}
a.imageAdherents { 
	 background-image:url(img/menu/carte-adherent.png);
}
a.imageAdherents:hover { 
     background-image:url(img/menu/carte-adherent_hover.gif);
}
a.imageAdherentsActive {
	background-image:url(img/menu/carte-adherent_hover.gif);
}

a.imageLieu { 
	 background-image: url(img/menu/lieu.png);
}
a.imageLieu:hover { 
     background-image:url(img/menu/lieu_hover.gif);
}
a.imageLieuActive {
	background-image:url(img/menu/lieu_hover.gif);
}
	
a.imageInfos { 
	 background-image:url(img/menu/infos.png);
}
a.imageInfos:hover { 
     background-image:url(img/menu/infos_hover.gif);
}
a.imageInfosActive {
	background-image:url(img/menu/infos_hover.gif);
}

a.imagePartenaires { 
	 background-image:url(img/menu/partenaires.png);
}
a.imagePartenaires:hover { 
     background-image:url(img/menu/partenaires_hover.gif);
}
a.imagePartenairesActive{
	background-image:url(img/menu/partenaires_hover.gif);
}


a.imagePresse { 
	 background-image:url(img/menu/presse.png);
}
a.imagePresse:hover { 
     background-image:url(img/menu/presse_hover.png);
}
a.imagePresseActive{
	 background-image:url(img/menu/presse_hover.png);
}

a.imagePhotos { 
	 background-image:url(img/menu/photos.png);
}
a.imagePhotos:hover { 
     background-image:url(img/menu/photos_hover.gif);
}
a.imagePhotosActive{
	background-image:url(img/menu/photos_active.gif);
}