/* 
	___________________________________________________________________________________________
	   
	ESG Alumni - Styles personnalisés
	
	ATTENTION: Consulter reset.css pour vérifier l'état d'origine de toutes les balises 
	___________________________________________________________________________________________ 

	Couleurs utilisées 
	
	#00B3DC : bleu turquoise
	#3374AE : bleu ESG
	#BCC7D3 : bleu fond teaser
	#FFECC6 : jaune pâle
	#FFCC66 : jaune d'oeuf
	___________________________________________________________________________________________ 
	
*/

/*   R E D E F I N I T I O N   D E   B A L I S E S   */

body {
  color: #333; 
  background: #fff;
  font-family:Arial, Helvetica, sans-serif;
  background-image:url(../images/fond_page.png);
  background-repeat:repeat-x;
}
h1,
.titreRub { 
	font-size: 2em;
	line-height: 1;
	margin: 0.8em 0;
	color: #3374AE;
}
h2 {
	font-size: 1.6em;
	margin: 0.5em 0;
	color: #83B0DA;
}
h3 {
	font-size: 1.5em;
	margin: 0.8em 0;
	color: #A5B4C5;
}
a {
	color: #48A8C4;
	font-weight:bold;
	text-decoration: none;
}
a:hover {
	text-decoration:underline;
}



/*   C O N T E N E U R   
________________________________________________*/

.container {
	width: 950px;
	margin: 0 auto;
	padding-bottom:20px;
	/*background-color:#fff;*/
}



/*   H E A D E R   
________________________________________________*/

#header {
	width:950px;
	height:100px;
	margin: 0 auto;
	/*background-color:#0C6;*/
	}
	#logo {
		float:left;
		width:150px;
		margin:10px 0 0 0;
		/*background-color:#09C;*/
		}	
	#baseline {
		float:left;
		width:272px;
		margin:41px 0 0 20px;
		/*background-color:#09C;*/
		}	
		#directAccess .logos {
			float:left;
			margin:23px 0 0 218px;
			/*background-color:#309;*/
			}
		#directAccess .logos img {
			margin:0 2px 0 2px;
			padding:0;
			vertical-align: bottom; /* supprime les 3px sous les images */
			}
		#directAccess .logos img:hover {
			background-color:#FFCC66;
			cursor:pointer;
			}
			



/*    N A V I G A T I O N   
_____________________________________________

OK, même affichage sous IE7 IE8 et FIREFOX 3.6.8 */

	
#nav {
	position:relative;
	width:948px;
	height:21px;
	top:4px;
	border-left:1px solid #fff;
	border-right:1px solid #fff;
	border-bottom:1px solid #fff;
	background-color:#3374AE;
	z-index:100;
}
#nav ul {
	padding:0;
	margin:0;
	list-style:none;
	}

#nav ul ul {
	position:absolute;
	left:-9999px;
	}

#nav ul li {
	float:left;
	}
	
	/* Rubrique active par défaut */
	#nav ul li.menuHaut-act  {
		display:block;
		padding:0 20px 3px 20px;
		font: normal 14px "Trebuchet MS", Arial, Helvetica, sans-serif;
		color:#fff;
		text-decoration:none;
		background-color:#00B3DC;
		}
		
	/* Rubrique non active par défaut */
	#nav ul li.menuHaut-no	{
		display:block;
		text-decoration:none;
		padding:0 20px 3px 20px;
		font:normal 14px "Trebuchet MS", Arial, Helvetica, sans-serif;
		color:#fff;
	}
	
	/* Hover sur rubrique non active */	
	#nav ul li.menuHaut-no:hover,
	#nav ul li.menuHaut-no a:hover{
		color:#fff;
		background-color:#00B3DC;
	}


	/*   S O U S    M E N U S
	_______________________________________________*/
	
	#nav ul li:hover ul {
		display:block;
		left:0;
		width:180px;
		top:21px;
		background-color:#fff;
		filter:alpha(opacity=90);
		-moz-opacity:0.9;
		-khtml-opacity:0.9;
		opacity:0.9;
		}
	#nav ul ul li {
		margin:0;
		float:none;
		}
	#nav ul li:hover {
		position:relative;
		}

	
/* Liens par défaut des sous-rubriques actives et non-actives */
	#nav ul li.menuHaut-act li a,
	#nav ul li.menuHaut-no li a{
		font:bold 12px Arial, Helvetica, sans-serif;
		color:#00B3DC;
		background:none;
		border-bottom:1px solid #ddd;
		display:block;
		padding:3px 3px 3px 20px;
		}
	/* Liens survolés des sous-rubriques actives et non-actives */
	#nav ul li.menuHaut-act li:hover,
	#nav ul li.menuHaut-no li:hover,
	#nav ul li.menuHaut-act li a:hover,
	#nav ul li.menuHaut-no li a:hover{
		display:block;
		background-color:#ddd;
		color:#00B3DC;
		}


/*   B L O C   T E A S E R   
_______________________________________________*/

#teaserBloc {
	position:relative;
	padding:0;
	top:4px;
	/*background-color:#609;*/
	}
	#visuel {
		width:900px;
		height:200px; /* pour firefox seulement: hauteur image (211px) - largeur border(10px)*/
		padding:0 25px;
		}	
	#visuel img{
		border-left:1px solid #fff;
		border-right:1px solid #fff;
		}
		
		

/*   C O N T E N U   P R I N C I P A L  
______________________________________________*/

#content {
	margin:0;
	padding:0 25px;
	}
	#main {
		float:left;
		width:570px;
		text-align:left;
		/*background-color:#9C9;*/
		}
	#contentFCE {
		width:570px;
		}
	#breadcrumb {
		padding: 11px 0 7px 0;
		border-bottom:1px solid #94A5B9;
		}
		
		
	/* Témoignages - plugin wec_staffdirectory
	------------------------------------------ */
	
	.temoignage {
		width: 550px;
		padding:10px;
		margin-bottom:10px;
		background-color:#EBEDEC;
		}
	.temImage {
		float:left;
		margin-right:10px;
		}
	.temPrenom,
	.temNom{
		font: normal 26px Tahoma, Geneva, sans-serif;
		color:#3374AE;
		}
	.temNom{
		margin-left:10px;
	}
	.temPromo {
		font: bold 16px Tahoma, Geneva, sans-serif;
		color:#333;
		margin:10px 0 10px 0;
		}
	.temFonction {
		font: bold 14px Tahoma, Geneva, sans-serif;
		color:#94A5B9;
		}
	.temDescription {
		font: italic 13px Tahoma, Geneva, sans-serif;
		color:#333;
		}
	.temImageSmall {
		float:left;
		margin:10px 10px 0 0;
		}
						
	
	
	
	/* Tableau clubs
	---------------- */
	
	.tblClubs {
		font: normal 11px Arial, Helvetica, sans-serif;
		background-color: #CDCDCD;
		margin:10px 0pt 15px;
		text-align: left;
	}
	.tblClubs tr th {
		background-color: #e6EEEE;
		border: 1px solid #FFF;
		font-weight: bold;
		padding: 4px;
	}
	.tblClubs tr td {
		color: #3D3D3D;
		padding: 4px;
		background-color: #FFF;
		vertical-align: top;
	}
		
	
	
	/* Tableau Dates clés
	--------------------- */
	
	.tblDateCles {
		font: normal 12px Arial, Helvetica, sans-serif;
	}
	.tblDateCles tr td {
		color: #3D3D3D;
		padding: 6px;
		border-bottom:1px solid #ccc;
	}
	.tblDateCles tr td b{
		font: bold 16px Arial, Helvetica, sans-serif;
		color:#F63;
	}
	
	
	
	/* Formulaires
	-------------- */
	
	#form label{
		display: inline-block;
		width:150px;
		padding: 2px;
		color:#666;
		font-weight:bold;
	}
	#form input,
	#form select,
	#form textarea,
	#form input[type=submit] {
		margin: 1px 5px;
	}
	#form .error {
		display: inline-block;
		/*width:200px;*/
		font:bold 12px Arial, Helvetica, sans-serif;
		color: #ff0000;	
	}
	input[type=submit] {
		font:bold 13px Arial, Helvetica, sans-serif;
		color:#fff;
		padding:4px 14px;
		background-image:url(../images/fond_btn_submit.png);
		background-repeat:repeat-x;
		border:1px solid #E6E6E6;
		cursor:pointer;
	}
	input[type=submit]:hover {
		border:1px solid #00B3DC;
		}

	
	
	/* Divers
	--------- */
	
	.RTEcontentRight {
		float:right;
		width:280px;
		padding:15px 15px 0 15px;
		margin: 0 0 0 10px;
		background-color:#eee;
		border:1px solid #ccc;
	}
	
	/* Liste sur la home "Le réseau ESG Alumni" 
	-------------------------------------------*/
	.liensReseau {
		padding:0;
		margin:10px 0 0 0;
		list-style-image: url(../images/puce_liens_utiles.png);
		}
	
	/* Classe génére par typo3 lors de la création du contenur du flux rss
	Permet le défilement vertical du flux RSS 
	----------------------------------------------------------------------*/
	#c453 {
		border:1px solid #ddd;
		width:530px;
		height:50px;
		padding:10px 10px 10px 40px;
		overflow: hidden;
		background-image:url(../images/picto_news_reuters.png);
		background-position:center left;
		background-repeat:no-repeat;
		/background-repeat:repeat-y;
	}
	
	/* Message d'avertissement pour mettre à jour son navigateur */
	.msgUpdateVersionBrowser {
		width:530px;
		background-color:#F9B877;
		border:5px solid #F60;
		padding:15px;
		}

		
/*   C O L O N N E   D R O I T E  
____________________________________________________*/	

#sidebar {
	float:left;
	width:258px; /* 300px -2*20px de padding -2px de border */
	margin:20px 0 20px 30px;
	padding:20px; 
	background-color:#fff;
	background-image:url(../images/fond_sidebar.png);
	background-repeat:repeat-x;
	border:1px solid #DDD;
	}
	#sidebar h3{
		color:#3374AE;
		margin-bottom:0.3em;
		}	
	#sidebar .txt{
		font:normal 11px Arial, Helvetica, sans-serif;
		color:#3374AE;
		}
		
	
	/* Section des 2 boutons "adhérez maintenant" et "actualisez votre profil" 
	-------------------------------------------------------------------------*/
	
	.btnTeaser ul{
		padding:0;
		margin:0 0 10px 0;
		/margin:4px 8px 10px 0;
		/*background-color:#30F;*/
		}
	.btnTeaser li{
		display:inline-block;
		/display:inline;
		width:110px;
		margin:0 10px 0 0;
		padding:5px 0 0 5px;
		/padding:5px 3px 2px 5px;
		list-style:none;
		}
	.btnTeaser li:hover{
		background-color:#BCC7D3;
		}
	
	
	/* Section Accès directs 
	------------------------ */
	
	.liensUtiles li{
		padding:0;
		margin:10px 0 -10px 0;
		list-style-image: url(../images/puce_liens_utiles.png);
		}
	.liensUtiles li a{
		font: bold 12px Arial, Helvetica, sans-serif;
		color:#65B6CD;
		text-decoration:none;
		margin-left:0;
		}
	.liensUtiles li a:hover{
		text-decoration:underline;
		}
			
			
	/* Section Communautés 
	---------------------- */
	
	.communautes {
		/*background-color:#E0E0E0;*/
		padding:10px 0;
		margin:30px 0;
		}
		.communautes ul{
			padding:0;
			margin:0;
			/margin:4px 8px 0 0;
			/*background-color:#30F;*/
			}
		.communautes li{
			display:inline-block;
			/display:inline;
			width:22px;
			margin:0 0 0 0;
			padding:3px 3px 0 3px;
			/padding:5px 3px 2px 3px;
			list-style:none;
			/*background-color:#30F;*/
			}
		/*.communautes li:hover{
			background-color:#00B3DC;
			}*/
		
		
	/* Section offre Spéciale 
	------------------------- */
	
	.offreSpeciale ul{
		padding:0;
		margin:0;
		/margin:4px 8px 0 0;
		/*background-color:#30F;*/
		}
	.offreSpeciale li{
		display:inline-block;
		/display:inline;
		width:110px;
		margin:0 4px 0 0;
		padding:5px 5px 1px 5px;
		/padding:5px 3px 2px 5px;
		list-style:none;
		}
	.offreSpeciale li:hover{
		background-color:#00B3DC;
		}
		
	
/*  B L O C   P U B   3 0 0 x 2 5 0 px (si bseoin)
_______________________________________________ */

#pub {
	float:left;
	width:300px;
	margin:10px 0 10px 30px;
	/*background-color:#ff0000;*/
	}



/*   F O O T E R   
_______________________________________________ */

#footer {
	width:100%;
	padding:20px 0;
	background-color:#F0F0F0;
	border-top:2px solid #94A5B9;
	text-align:center;
	}