/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|                                   www.ctm-grenoble.org                    |
|---------------------------------------------------------------------------|
|                                                                           |
|                          Styles communs à tout le site                    |
|                                                                           |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|                                              Sabine BOUBEL	- Dec 2010  |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/


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

body {
		font-family:Verdana, Arial, Helvetica, sans-serif;
	}
/* Définition de la zone 'centrage'
-----------------------------------------------------------------------------
	La zone 'centrage' est centrée sur la page, avec une largeur fixe et contient 
	les éléments de la page.
---------------------------------------------------------------------------*/
#centrage {
	position: relative;
	top:10px;
	margin-left: auto;
	margin-right: auto;
	width:952px;
	}
	
/* Définition de la zone 'bandHaut'
-----------------------------------------------------------------------------
	La zone 'bandHaut' contient le menu haut
---------------------------------------------------------------------------*/
#bandHaut {
	position:relative;
	width:952px;
	height:128px;
	background:url(../images/band_haut.jpg) left no-repeat;
	z-index:100;
	}
#bandHaut a.logo {
	position:relative;
	display:block;
	width:218px;
	height:130px;
	}

/*définition de la zone menu haut*/
#menuH ul {
	position:absolute;
	left:218px;
	font:0.75em Verdana, Arial, Helvetica, sans-serif;
	text-align:center;
	list-style:none;
	padding:0;
	margin:0;
	z-index:100;	
	}

/*position de chaque ligne de menu*/
.niveau1 {
		float:left;
	}
.ligne1 {
	top:66px;
}
.ligne2 {
	top:98px;
}

/*positionnenement du sous-menu*/
#menuH li ul {
	position:absolute;
	top:30px;
	padding-top:2px;
	left:-999px;/* positionnement invisible*/
	width:300px;
	background-color:#ffb84d;
	font-size:1em;
}

/*styles des liens*/
#menuH li a {
	display:block;
	width:175px;
	line-height:30px;
	margin-bottom:2px;
	margin-right:1px;
	color:black;
}
#menuH ul ul {
	-moz-border-radius: 0px 0px 18px 0; 
    -webkit-border-radius: 0px 0px 18px 0; 
    border-radius: 0px 0px 18px 0;         
    -webkit-border-bottom-right-radius: 18px; /* pour Chrome */
}
#menuH ul ul li a {
	width:294px;
	margin-right:0;
	padding-left:5px;
	background-color:#FF9900;
	text-align:left;
	line-height:2.2em;
}
#menuH ul ul li:last-child a {
	-moz-border-radius: 0px 0px 18px 0; 
	-webkit-border-radius: 0px 0px 18px 0; 
	border-radius: 0px 0px 18px 0;         
	-webkit-border-bottom-right-radius: 18px; /* pour Chrome */
	margin-bottom:0px;
}
#menuH .niveau1 a:hover {
	background-color:#FF9900;
}
#menuH .niveau2 a:hover {
	background-color:#7685BC;
}
#menuH a.lienMort {
	background-color:#7685BC;
	color:white;
}
#menuH a.lienMort:hover {
	background-color:#7685BC;
}

/* Affichage du sous-menu */
#menuH li:hover ul, #menuH li.sfhover ul
{
	 left:auto; /* Repositionnement normal */
	 min-height: 0; /* Corrige un bug sous IE */
}

	
/* Définition de la zone 'blabla'
-----------------------------------------------------------------------------
	La zone 'blabla' est située sous le bandeau Haut et contient tous
	les contenus textes et images de la page.
---------------------------------------------------------------------------*/
#blabla {
	position:relative;
	float:left;
	width:952px;
	background:url(../images/bandOr.gif) 24px repeat-y;
	z-index:1;
	}
/*Special lettermail */
	#blablaNL {
			position:relative;
			float:left;
			display:inline;/*IE*/
			width:952px;
			background:url(../images/bandOr.gif) 24px repeat-y;
			}
	#blablaNL p#bienvenue {
				position:relative;
				float:left;
				display:inline;
				padding-left:10px;
				background-color:#7685BC;
				height:30px;
				width:136px;
				font:0.75em Verdana, Arial, Helvetica, sans-serif;
				line-height:30px;
				color:white;
				}
	#blablaNL #coin {
				position:relative;
				float:left;
				display:inline;
				}	
/* Définition de la zone 'bandGauche'
-----------------------------------------------------------------------------
	La zone 'bandGauche' contient le sous menu et les infos placées à gauche
---------------------------------------------------------------------------*/
#bandGauche {
	position:relative;
	float:left;
	margin-left:24px;
	width:194px;
	padding-bottom:30px;
	margin-top:0;
	}
#photo {
	height:225px;
	width:194px;
	}
a#home {
	position:absolute;
	display:block;
	width:112px;
	height:30px;
	text-align:center;
	background:url(../images/bout_accueil.gif) 0 0;
	font:0.75em Verdana, Arial, Helvetica, sans-serif;
	line-height:30px;
	color:black;
	}
a#home:hover,a#home.lienMort {
	background:url(../images/bout_accueil.gif) 0 -31px;
	color:white;
	}
img#vitrail {
	position:absolute;
	top:197px;
	left:0;
	width:13px;/*mention obligatoire pour IE*/
	height:83px;/*mention obligatoire pour IE*/
	z-index:50;
	}

#bandGauche h1 {
	position:relative;
	float:left;
	display:inline;/*IE*/
	font:0.9em Verdana, Arial, Helvetica, sans-serif;
	width:170px;
	color:white;
	margin-left:20px;
	margin-top:6px;
	margin-bottom:30px;
	}
#datedujour {
	position:relative;
	float:left;
	display:inline;/*IE*/
	width:184px;
	padding-left:10px;
	font:bold 0.7em Verdana, Arial, Helvetica, sans-serif;
	color:#333399;
	}
#bandGauche h2 {
	position:relative;
	float:left;
	display:inline;/*IE*/
	margin-top:10px;
	height:1.6em;
	width:184px;
	padding-left:10px;
	background-color:#FCC047;
	font:bold 0.7em Verdana, Arial, Helvetica, sans-serif;
	line-height:1.6em;
	color:#970F00;
	}
a.fleche, a.flecheG {
		position:relative;
		float:left;
		margin-left:10px;
		margin-top:5px;
		padding-left:14px;
		width:170px;
		font:0.7em Verdana, Arial, Helvetica, sans-serif;
		line-height:1.4em;
		color:#970F00;
		background:url(../images/flecheOr1.gif) left 3px no-repeat;
	}
a.fleche:hover {
	color:white;
	}
	

	
/* Définition de la zone 'bandPied'
-----------------------------------------------------------------------------
	La zone 'bandPied' contient les infos et navigation de pied de page
---------------------------------------------------------------------------*/
#bandPied {
	position:relative;
	float:left;
	width:952px;
	height:25px;
	background:url(../images/band_pied.jpg) no-repeat;
	color:white;
	padding-top:15px;
	margin-bottom:20px;/*IE*/
	}
#bandPied h1 {
	float:left;
	margin-left:35px;
	width:300px;
	font:0.8em Verdana, Arial, Helvetica, sans-serif;
	}
#bandPied h2 {
	float:left;
	width:600px;
	height:1.6em;
	font:0.7em Verdana, Arial, Helvetica, sans-serif;
	line-height:1.6em;
	}
#bandPied a {
	margin-left:40px;
	padding-left:14px;
	background:url(../images/flecheOr2.gif) 0 3px no-repeat;
	color:white
	}
#bandPied a:hover {
	color:#970F00;
	}
#bandPied hr {
	visibility:hidden;
	height:50px;
	}