/*	
	CSS pour la nouvelle version de l'accueil
	2009/10/23
	Emilie - egzakt.com
*/


/* PRODUITS
-----------------------------------------*/
#accueil ul#produits {
	list-style-type:none;
	margin:0 0 15px 0;
	padding:0;
	overflow:hidden;
	height:180px;
}

#accueil ul#produits li {
	float:left;
	width:248px;
	list-style-image:none;
}

#accueil ul#produits li a {
	display:block;
	text-decoration:none;
	font:12px/16px Arial, Verdana, sans-serif;
	color:#fff;
}

#accueil ul#produits li h4 {
	font:bold 14px/16px Arial, Verdana, sans-serif;
	margin:0 0 1px 0;
}


/* LVD */
#accueil ul#produits li.lvd {
	margin-right:8px;
}

#accueil ul#produits li.lvd a {
	height:98px;
	padding:82px 20px 0 20px;
	background:url(../images/photos/acc_produit_lvd.jpg) no-repeat left top;
}

#accueil ul#produits li.lvd h4 {
	color:#29ABE2;
}

#accueil ul#produits li.lvd a:hover {
	background-position:left bottom;
}

/* CCR */
#accueil ul#produits li.ccr a {
	height:98px;
	padding:82px 20px 0 20px;
	background:url(../images/photos/acc_produit_ccr.jpg) no-repeat left top;
}

#accueil ul#produits li.ccr h4 {
	color:#99CC00;
}

#accueil ul#produits li.ccr a:hover {
	background-position:left bottom;
}

/* JPJ */
#accueil ul#produits li.jpj {
	float:right;
	position:relative;
}

#accueil ul#produits li.jpj a span.over {
	display:block;
	visibility:hidden;
	position:absolute;
	width:208px;
	height:160px;
	padding:20px 20px 0 20px;
	font:12px/16px Arial, Verdana, sans-serif;
	color:#fff;
	top:0;
	background:url(../images/photos/acc_produit_jpj_over.jpg) no-repeat left top;
}

#accueil ul#produits li.jpj h4 {
	color:#000;
	margin-bottom:5px;
}

#accueil ul#produits li.jpj a:hover {
	background:none; /* Pour IE6 réactivité a:hover enfant */
}

#accueil ul#produits li.jpj a:hover h4.off {
	visibility:hidden;
}

#accueil ul#produits li.jpj a:hover span.over {
	visibility:visible;
}


/* ARCHITECTURE VEDETTES
-----------------------------------------*/
#accueil #colonne_divers {
	float:left;
	width:248px;
	margin-right:8px;
}

#accueil #colonne_ppb {
	float:left;
	width:248px;
	margin-bottom:15px;
}

#accueil #colonne_repertoire {
	float:right;
	width:248px;
	margin-bottom:15px;
}

#accueil .rubrique {
	display:block;
}


/* EDUCALOI.TV
-----------------------------------------*/
#accueil #colonne_divers #tv {
	margin-bottom:15px;
}

#accueil #colonne_divers #tv .boite {
	position:relative;
	width:232px;
	padding:8px 8px 5px 8px;
	background:#b6b6aa url(../images/tuiles/acc_tv_haut.gif) no-repeat left top;
}

#accueil #colonne_divers #tv #play {
	position:absolute;
	top:80px;
	left:112px;
}

#accueil #colonne_divers #tv #preview img {
	display:block; /* Pour IE */
	border:1px solid #C9C9C0;
}

#accueil #colonne_divers #tv .desc {
	margin-top:8px;
	background:#e8e7e1 url(../images/tuiles/acc_tv_desc_haut.gif) no-repeat left top;
}

#accueil #colonne_divers #tv .desc .padding {
	padding:8px 8px 6px 8px;
}

#accueil #colonne_divers #tv h2 {
	font:bold 14px/16px Arial, Verdana, sans-serif;
	margin:0;
}

#accueil #colonne_divers #tv h2 a {
	text-decoration:none;
	color:#CC6707;
}

#accueil #colonne_divers #tv h2 a:hover {
	background:none; /* Pour IE6 réactivité a:hover span */
}

#accueil #colonne_divers #tv .plus {
	text-align:right;
	margin-top:10px;
}

#accueil #colonne_divers #tv .plus a {
	color:#494944;
	font:11px/13px Arial, Verdana, sans-serif;
	text-decoration:underline;
	padding:0 18px 2px 0;
	background:url(../images/icon/acc_tv_plus.gif) no-repeat right 0;
}

#accueil #colonne_divers #tv .plus a:hover {
	color:#CC6707;
}


#accueil a#colloque {
	display:block;
	margin-bottom:15px;
}


/* NOUVELLES
-----------------------------------------*/
#accueil #colonne_divers #nouvelles {
	margin-bottom:15px;
}

#accueil #colonne_divers #nouvelles ul {
	list-style-type:none;
	margin:0;
	width:232px;
	padding:2px 8px 5px 8px;
	background:#e8e7e1 url(../images/tuiles/acc_rubrique_pale_haut.gif) no-repeat left top;
}

#accueil #colonne_divers #nouvelles li {
	list-style-image:none;
	padding:0;
	margin-top:6px;
	background:#fff url(../images/tuiles/acc_rubrique_pale_desc_haut.gif) no-repeat left top;
}

#accueil #colonne_divers #nouvelles li .padding {
	padding:8px 8px 6px 8px;
}

#accueil #colonne_divers #nouvelles .date {
	font:bold 11px/13px Arial, Verdana, sans-serif;
	color:#494944;
}

#accueil #colonne_divers #nouvelles h2 {
	font:bold 12px/16px Arial, Verdana, sans-serif;
	color:#CC6707;
	margin:2px 0 0 0;
}

#accueil #colonne_divers #nouvelles h2 a {
	color:#CC6707;
	text-decoration:none;
}

#accueil #colonne_divers #nouvelles h2 a:hover {
	text-decoration:underline;
	color:#494944;
}


/* RESTEZ BRANCHÉ
-----------------------------------------*/
#accueil #colonne_divers #branche {
	margin-bottom:15px;
}

#accueil #colonne_divers #branche .boite {
	position:relative;
	width:232px;
	padding:8px 8px 5px 8px;
	background:#e8e7e1 url(../images/tuiles/acc_rubrique_pale_haut.gif) no-repeat left top;
}

#accueil #colonne_divers #branche .desc {
	background:#fff url(../images/tuiles/acc_rubrique_pale_desc_haut.gif) no-repeat left top;
}

#accueil #colonne_divers #branche .desc .padding {
	width:216px;
	padding:8px 8px 2px 8px;
	overflow:hidden;	
}

#accueil #colonne_divers #branche a {
	display:block;
	padding-left:35px;
	font:12px/12px Arial, Verdana, sans-serif;
	color:#4E5249;
	text-decoration:none;
}

#accueil #colonne_divers #branche a:hover {
	text-decoration:underline;
}

#accueil #colonne_divers #branche a.bulletin {
	height:25px;
	padding-top:4px;
	background:url(../images/partager/acc_logo-bulletin.gif) no-repeat left top;
	border-bottom:1px solid #D9D9D9;
	margin-bottom:5px;
}

#accueil #colonne_divers #branche a.facebook {
	float:left;
	height:20px;
	padding-top:9px;
	margin-right:16px;
	background:url(../images/partager/logo-facebook.gif) no-repeat left top;
}

#accueil #colonne_divers #branche a.twitter {
	float:left;
	height:20px;
	padding-top:9px;
	background:url(../images/partager/logo-twitter.gif) no-repeat left top;
}


/* JUSTICE PARTICIPATIVE
-----------------------------------------*/
#accueil #colonne_divers a#justice_participative {
	display:block;
	margin-bottom:15px;
}

#accueil #colonne_divers a#justice_participative img.over {
	position:absolute;
	visibility:hidden;
}

#accueil #colonne_divers a#justice_participative:hover {
	background:none; /* Pour IE6 réactivité a:hover img.over */
}

#accueil #colonne_divers a#justice_participative:hover img.over {
	visibility:visible;
}


/* PLACE PUBLIQUE
-----------------------------------------*/
#accueil #colonne_ppb dl {
	width:232px;
	padding:8px 8px 5px 8px;
	margin:0;	
	background:#e8e7e1 url(../images/tuiles/acc_rubrique_pale_haut.gif) no-repeat left top;
}

#accueil #colonne_ppb dt {
	font:bold 14px/16px Arial, Verdana, sans-serif;
	color:#4E5248;
	margin-top:15px;
}
#accueil #colonne_ppb dt.manchette {
	margin-top:0;
}

#accueil #colonne_ppb dd {
	margin:4px 0 0 0;
	padding:0;
	background:#fff url(../images/tuiles/acc_rubrique_pale_desc_haut.gif) no-repeat left top;
}

#accueil #colonne_ppb dd .padding {
	padding:8px 8px 6px 8px;
}

/* Manchette */
#accueil #colonne_ppb dd.manchette .date {
	font:bold 11px/13px Arial, Verdana, sans-serif;
	color:#494944;
}

#accueil #colonne_ppb dd.manchette h1 {
	font:bold 12px/16px Arial, Verdana, sans-serif;
	color:#CC6707;
	margin:2px 0 6px 0;
}

#accueil #colonne_ppb dd.manchette h1 a {
	color:#CC6707;
	text-decoration:none;
}

#accueil #colonne_ppb dd.manchette h1 a:hover {
	text-decoration:underline;
	color:#494944;
}

#accueil #colonne_ppb dd.manchette .intro {
	font:12px/16px Arial, Verdana, sans-serif;
	color:#494944;
}

#accueil #colonne_ppb dd.manchette .plus {
	text-align:right;
	margin-top:8px;
}

#accueil #colonne_ppb dd.manchette .plus a {
	font:11px/13px Arial, Verdana, sans-serif;
	color:#494944;
	text-decoration:underline;
	padding:0 18px 2px 0;
	background:url(../images/icon/acc_manchette_plus.gif) no-repeat right 0;
}

#accueil #colonne_ppb dd.manchette .plus a:hover {
	color:#CC6707;
}


#accueil #colonne_ppb dd h3 {
	font:12px/16px Arial, Verdana, sans-serif;
	color:#CC6707;
	margin:0;
}

#accueil #colonne_ppb dd h3 a {
	color:#CC6707;
}

#accueil #colonne_ppb dd h3 a:hover {
	color:#494944;
}


/* RÉPERTOIRE
-----------------------------------------*/
#accueil #colonne_repertoire .boite {
	width:232px;
	padding:6px 8px 8px 8px;
	background:#b6b6aa url(../images/tuiles/acc_tv_haut.gif) no-repeat left top;
}

#accueil #colonne_repertoire .intro {
	background:url(../images/icon/acc_repertoire_exclamation.gif) no-repeat left top;
	font:11px/13px Arial, Verdana, sans-serif;
	color:#4E5248;
	padding:4px 0 10px 34px;
}

#accueil #colonne_repertoire ul {
	width:224px;
	padding:0 4px;
	margin:0;
	list-style-type:none;
	background:#e8e7e1 url(../images/tuiles/acc_repertoire_themes_haut.gif) no-repeat left top;
}

#accueil #colonne_repertoire li {
	width:224px;
	padding:9px 0 8px 0;
	list-style-image:none;	
	background:url(../images/graphiques/acc_repertoire_themes_separateur.gif) no-repeat center bottom;
}
#accueil #colonne_repertoire li.dernier {
	background:none;
}

#accueil #colonne_repertoire li h3 {
	font:bold 11px/13px Arial, Verdana, sans-serif;
	color:#4E5249;
	text-transform:uppercase;
	margin:0;
}

#accueil #colonne_repertoire li h3.selected {
	border:1px solid #50544c;
	padding:2px 4px 2px 0;
	background:#7b7d77 url(../images/boutons/acc_repertoire_themes_selected.gif) repeat-x left bottom;
}

#accueil #colonne_repertoire li h3 a {
	display:block;
	padding:0 0 0 16px;
	text-decoration:none;
	color:#4E5249;
	background:url(../images/boutons/acc_repertoire_themes.gif) no-repeat 4px -14px;
}

#accueil #colonne_repertoire li h3 a:hover {
	background-position:4px -52px;
}

#accueil #colonne_repertoire li h3.selected a,
#accueil #colonne_repertoire li h3.selected a:hover {
	color:#fff;
	background-position:4px -94px;
}

/* 2e niveau */
#accueil #colonne_repertoire ul ul {
	width:200px;
	padding:4px 8px 6px 16px;
	background:#fff url(../images/tuiles/acc_repertoire_theme_liste_bas.gif) no-repeat left bottom;
}

#accueil #colonne_repertoire ul ul li {
	width:200px;
	padding:0;
	background:none;
}

#accueil #colonne_repertoire ul ul a {
	font:12px/14px Arial, Verdana, sans-serif;
	color:#4E5248;
	text-decoration:underline;
}

#accueil #colonne_repertoire ul ul a:hover {
	color:#CC6707;
}
