/* TABLE DES MATIÈRES:
	- Classes générales (body, html, h1, h2, ...)
	- Conteneurs
	- Menus et sous-menus
	- Textes
	- Pieds de page
	- Formulaires
----------------------------------------------------------------------------------------*/

/* GÉNÉRALES
--------------------------------------------------------------------------------------- */
body#index{
	background: #FFF url(gx/bg.gif) repeat-x center top;
	margin: 0;
	padding: 0;
	text-align:center;
}
body#main{
	background: #FFF;
	margin: 0;
	padding: 0;
	text-align:center;
}
html{
	color: #717172;
	font-size: 11px;
	font-family: Arial, Verdana, Tahoma; /* Garder seulement 3 fontes */
}
html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, a, img{border:0; margin:0; padding:0;}


/* TEXTES ET HYPERLIENS GLOBAUX
--------------------------------------------------------------------------------------- */
a, a:link, a:visited, a:hover{outline:none;}

h1{color: #3a3a3a; font-size:14px; border-bottom: #8b5c6d 1px solid; text-transform: uppercase;}
h1 a, h1 a:link, h1 a:visited{color:#C21527;}

h2{text-transform:uppercase;color: #603F4B; font-size: 14px; border-bottom: #C1C1C1 1px solid; margin: 0 0 15px 0; }
h2 a, h2 a:link, h2 a:visited{color:#333;}

p{font-size: 12px; line-height: 150%; color: #272829; text-align: justify;}
p.textePetit{font-size:10px;}
p a, p a:link, p a:visited, ul li a, ul li a:visited, ol li a, ol li a:visited{color:#272829; text-decoration:underline;}
p a:hover, p a:visited:hover, ul li a:hover, ul li a:visited:hover, ol li a:hover, ol li a:visited:hover{
	color:#603F4B; text-decoration:underline;
}

#lien1{background:#3a3a3a; color:#fff; font-weight: normal; text-transform:uppercase;padding:2px 5px; font-size:11px;text-decoration:none; margin-bottom:5px;}
a#lien1:hover{background:#555555;}
#lien2{color:#8b5c6d;font-size:12px;text-decoration:none;font-weight:normal;text-transform: none;}
a#lien2:hover{color:#603F4B;}

ul li{color:#1F1F1F; font-size:11px; line-height:150%; list-style:square; margin-left:16px;}
ol li{color:#1F1F1F; font-size:11px; line-height:150%; margin-left:16px;}

.date{
	color: #8b5c6d;
}

/* 
p:first-letter{color:green; font-size:200%; text-transform:uppercase;}
sup{position:relative; bottom:0.3em; vertical-align:baseline;}
sub{position:relative; bottom:-0.2em; vertical-align:baseline;}
*/

/* CONTENEURS ET CLASSES GÉNÉRALES
--------------------------------------------------------------------------------------- */
#conteneur{	margin: 0 auto 0 auto;	text-align:left;	width:980px;}

#conteneurPiedPage{background: #222324; display: block; width:100%; text-align:center;}

#haut{height: 122px;	display:block;	background: #fff url(gx/m/bg_haut.jpg) no-repeat right;margin-bottom:10px;}

#logo{float:left;margin:50px 0 0 10px;}

#contenuAccueil{min-height:500px; height: 100%;  _height:500px;}
#contenu{min-height:500px; height: 100%;  _height:500px;float:left;display:block;width:428px; margin:25px 0 0px 25px;}
#contenuLateral{min-height:500px; height: 100%;  _height:500px;text-align:left;float:right;width:283px;}

#zoneMedia{background: #1c1c1c;width:356px;}
#zoneMedia H2{color:#d53737; font-size:24px;border:none;padding:5px 15px; font-family:times;font-weight:normal;}

#liensSociaux{	display:block; margin:10px 0; border:1px solid #8c5e6f; }
#liensSociaux img{margin:10px 25px;}
#liensSociaux p{font-size:12px;color:#fff; line-height:25px; background:#222324; padding:0 10px; text-transform: uppercase;}

#boiteMp3{position:relative;width:283px;background:#edf1f1;display:block;float:left;}
#boiteMp3 div.titreBoite{color:#fff;background:#222324;display:block;padding:3px 5px;text-transform:uppercase;font-size:12px;}
#boiteMp3 p{color:#8b5c6d;	margin: 0; font-size:11px; line-height: 125%;}
#boiteMp3 p span.nomArtiste{text-transform:uppercase;}
#boiteMp3 img{	margin:0 0 0 5px;}
#boiteMp3 .audioTexte{ float:left; display:block; width:175px;   margin: 10px 0px 0 0px; }
#boiteMp3 .audioPlayer{ float:left; width: 85px;display:block; margin:0 5px;}

#blocListe{float:left; display: block;	border-bottom:0px solid #D4BAE1;margin-bottom:15px;}
#blocListe.listeAccueil{width:490px;border:none; }
#blocListe .imgListe{float:left;display:block;border-right:1px solid #ccc;width:77px;}
#blocListe .ctnListe{float:left;display:block;width:330px;margin-left:15px;}
#blocListe.listeAccueil .ctnListe{width:375px;}
#blocListe p a{text-decoration: none;}

#detailListe{}
#detailListe .imgDetailListe img{margin:0 10px 5px 0; /*float:left; display:block; width: 275px;*/}
#detailListe .ctnDetailListe{}

.both{clear:both;}

/* MENUS
--------------------------------------------------------------------------------------- */
#menu{margin:0; padding:0;float:left; width: 210px; }
#menu ul{display:block;display:Block;padding:20px;background:#8b5c6d; }
#menu ul li{padding:0; margin:0; list-style-type:none;background: url(gx/m/separateurMenu.gif) repeat-x  bottom;}
#menu ul li a, #menu ul li a:link, #menu ul li a:visited{
	color: #fff;
	font-size: 12px;
	font-family: verdana;
	font-weight: normal;
	line-height: 25px;
	height:25px;
	margin: 0 10px 0 0;
	text-decoration: none;
	display: block;
	
	
	
}
#menu ul li.premier{ }
#menu ul li.dernier{background:none;}
#menu ul li a:hover, #menu ul li a:visited:hover{background: url(gx/puce.gif) no-repeat  right;}
#menu ul li a.actif, #menu ul li a.actif:visited{background: url(gx/puce.gif) no-repeat  right;}

#menuu{height:22px; width:262px; background: #fff; float:right; margin:10px 0; padding:0;}
#menuu ul{margin:0 20px 0 0;padding:0;text-align:right;}
#menuu ul li{padding:0; margin:0; display:inline; list-style-type:none; color: #666666;}
#menuu ul li a, #menuu ul li a:link, #menuu ul li a:visited{
	color: #666666;
	font-size: 11px;
	font-weight: normal;
	line-height: 21px;
	padding: 5px;
	text-decoration: none;
}
#menuu ul li a:hover, #menuu ul li a:visited:hover{color:#8b5c6d;}
#menuu ul li a.actif, #menuu ul li a.actif:visited{color:#8b5c6d;}

/* PAGE ACCUEIL
--------------------------------------------------------------------------------------- */
#zoneFlash{float:left;display: block;width:752px;height: 267px;margin-right:20px;border:1px solid #000;}
/*#zoneFlash img{border:1px solid #000;}*/

/* PAGE MULTIMEDIA
--------------------------------------------------------------------------------------- */
#blocMultimedia{float:left; display: block; margin-bottom:15px; width:369px;}
#blocMultimedia .imgMultimedia{float:left;display:block;width:160px;}
#blocMultimedia .ctnMultimedia{float:left;display:block;width:195px;margin-left:5px;}
#blocMultimedia p a{text-decoration: none;}

#albumMultimedia{float:left; display: block; margin-bottom:15px; width:140px;}

/* PAGE CONTACT
--------------------------------------------------------------------------------------- */

/* PAGE SONDAGE
--------------------------------------------------------------------------------------- */
#sondage p{ font-size: 14px; }

#sondage .liste div{ font-size: 10px; width: 330px; margin: 0 0 5px 0; float: left; display: block; }
#sondage .liste div.gauche{ margin: 0 20px 5px 0; }
#sondage .liste div strong{ color: #126eb8; font-size: 11px; font-weight: normal; }

#sondage .formulaire label{ color: #000000; font-size: 12px; width: 180px; padding: 5px 0 0 0; float: left; display: block; }
#sondage .formulaire .Input{ color: #000000; font-size: 12px; border: #000000 1px solid; width: 200px; padding: 3px; margin: 0 20px 0 0; float: left; display: block; }
#sondage .formulaire .Bouton{ color: #ffffff; text-transform: uppercase; border: 0px; height: 23px; }
#sondage .formulaire .vote{ text-align: left; background: #126eb8 url(Gx/00/puceSondage.gif) no-repeat 165px 8px; width: 180px; padding: 0 20px 0 5px; }

/* ICONES GÉNÉRALES
--------------------------------------------------------------------------------------- */
.lienRSS{background: url(Gx/icone_RSS.gif) no-repeat left;padding:5px 0 5px 20px;}
/* .lienPDF{background: url(Gx/icone_PDF.gif) no-repeat left;padding:5px 0 5px 20px;} */

/* PIED DE PAGE
--------------------------------------------------------------------------------------- */

#piedPage{color:#666666; font-size:11px;padding:20px 0; min-height:200px; height:100%; _height:200px; width:980px;margin: 0 auto 0 auto;}
#piedPage a{color:#666666; text-decoration:underline;}
#piedPage a:hover{color:#666666;}
#piedPage #copyrights{float:left; margin:0; text-align:left;}
#piedPage #copyrights a{font-weight:normal;}
#piedPage #copyrights #lienCopyrights{font-weight:normal; text-decoration:none; color:#666666;}
#piedPage #copyrights #lienCopyrights:hover{font-weight:normal; text-decoration:underline; color: #666666;}
#piedPage #menuBas{float:right;text-align:right;}
#piedPage #logoProductionsJ{float:right;}

/* Partager cette page (bookmarker) */
#socialBookmarker {float:right;margin-right:98px;}
#socialBookmarkerPrefix {float:left;color:#8f8f8f;background: #000 url(gx/icone_vortex.gif) no-repeat 5px;padding:2px 5px 2px 30px;margin:0 5px 0 0;}
.bookmarkIconesVisibles {float:left;margin-left:2px;}

#bookmarkHoverPopup {
	position:absolute;
	border:solid 1px;
	background-color:white;
	text-align:left;
	padding:4px;
	width:315px;
	display:none;
}
#bookmarkHoverPopup .bookmarkHoverPopupItems{
	float:left;
	width:150px;
	height:25px;
	margin-right:4px;
}

#bookmarkHoverPopup .bookmarkHoverPopupItems a{
	line-height:25px;
	height:25px;
}

#bookmarkHoverPopup .bookmarkHoverPopupItems a:link, #bookmarkHoverPopup .bookmarkHoverPopupItems a:visited{
	border:none;
	color:black;
	display:block;
	text-decoration: none;
	width:150px;
	padding-left:2px;
}

#bookmarkHoverPopup .bookmarkHoverPopupItems a:active, #bookmarkHoverPopup .bookmarkHoverPopupItems a:hover{
	text-decoration: none;
	color:#333333;
	border: 1px solid #666;
	width:150px;
	height:25px;
	display:block;
	background-color:#eee;
	padding-left:2px;
}

/* FORMULAIRES
--------------------------------------------------------------------------------------- */
fieldset{border:0px solid #000; font-size: 11px; margin-bottom:10px; padding:5px;}
fieldset legend{border: 1px solid #999; color:#000; font-size:14px; font-weight:bold; padding:3px;}
fieldset label{color: #000000; font-size: 12px; width: 180px; padding: 5px 0 0 0; margin: 0 0 10px 0; float: left; display: block; }

/* Formulaire contact */
#formulaireQuestion fieldset label{float:left;width:150px;}
#formulaireQuestion .champTexte{float:left;width:300px;}
#formulaireQuestion .listeDeroulante{float:left;width:300px;}
#formulaireQuestion .boiteTexte{float:left;height:70px;width:330px;}

/* PAGE SONDAGE  */
#sondage p{ font-size: 14px; } #sondage p b{ color: #666666; }
#sondage h2{ color: #146fb4; font-size: 14px; border-bottom: #89b7d9 1px solid; margin: 0 0 15px 0; }
#sondage .erreur{ font-size: 12px; }

#sondage .liste div{ font-size: 10px; width: 350px; margin: 0 0 5px 0; float: left; display: block; }
#sondage .liste div.gauche{ margin: 0 20px 5px 0; width:300px; }
#sondage .liste div strong{ color: #126eb8; font-size: 11px; font-weight: normal; }

#sondage .formulaire label{ color: #000000; font-size: 12px; width: 180px; padding: 5px 0 0 0; margin: 0 0 10px 0; float: left; display: block; }
#sondage .formulaire .Input{ color: #000000; font-size: 12px; border: #000000 1px solid; width: 200px; padding: 3px; margin: 0 20px 10px 0; float: left; display: block; }
#sondage .formulaire .Bouton{ color: #ffffff; text-transform: uppercase; border: 0px; height: 23px; padding: 0 0 2px 0; margin: 0 0 10px 0; }
#sondage .formulaire .vote{ text-align: left; background: #126eb8 url(Gx/00/puceSondage.gif) no-repeat 167px 9px; width: 185px; padding: 0 20px 0 5px; }
#sondage .formulaire .suggestion{ text-align: left; background: #126eb8 url(Gx/00/puceSondage.gif) no-repeat 220px 9px; width: 235px; padding: 0 20px 0 5px; }

.champTexte{
	color: #000000; font-size: 12px; border: #000000 1px solid; width: 200px; padding: 3px; margin: 0 20px 10px 0; float: left; display: block; 
}
.listeDeroulante{
	background: #EEF3F7;	
	border: 1px solid #C9D0D6;
	color: #4E677A;
	font-size: 11px;
	margin:2px 0 2px 0;
}
.boiteTexte{
	background: #EEF3F7;
	border: 1px solid #C9D0D6;
	color: #4E677A;
	font-family: "Trebuchet MS";
	font-size: 11px;
	margin:2px 0 2px 0;
}
.bouton{background:#8b5c6d;
	color: #ffffff; text-transform: uppercase; border: 0px; height: 23px; padding: 0 5px 2px 5px; margin: 0 0 10px 0;
}
.bouton:hover{background-color:#482F38; color:#FFF;}
.caseaCocher{
	float:left; display:block; width: 20px;font-size:12px; background: red;
}
.champCache{display:none; visibility:hidden;} /* Utilisé pour l'anti-spam */

.erreur{color:#FF0000;}

/* CALENDRIER (Popup) */
div#Calendar{ background:#FFFFFF; border:#2266B3 1px solid; font-size:11px; }
div#Calendar div.weekdays div{ border:#FFFFFF 1px solid; color:#2266B3; font-weight:bold; margin:-1px 0 0 -1px; }
div#Calendar div.days a, div#Calendar div.days a:visited{ border:#2266B3 1px solid; color:#3e3328; margin:-1px 0 0 -1px; text-decoration:none; }
div#Calendar div.days a:hover{ color:#999999; }
div#Calendar div.days div{ background:#CFCFCF; border:#2266B3 1px solid; margin:-1px 0 0 -1px; }


