/* CSS issu des tutoriels css.alsacreations.com */
/**********  MISE EN PAGE *******/
html, body {
height: 100%;
width: 100%;
}

body {
font-family:  "Trebuchet MS", "Comic sans MS", Verdana, serif;
font-size: small;
color: rgb(75,0,130); /*indigo (106,90,205);/*le texte est écrit en "slateblue"*/
background-color:white;
margin: 0;/* pour éviter les marges */
padding: 0;
}

#body_test {
background-color:rgb(253,248,255);

}
 
#pop_up{
width:500px;
margin:10px;
/*padding:10px;*/
}

/*ATTENTION: si on modifie #conteneur, #centre, html>body> #centre, #gauche, #pied => faire les mêmes modifs pour le fichier 2.css de Forum*/

#conteneur_test{
position:absolute;
height: 100%;
width:950px;
/*margin-left: auto; /*pour que tout soit centré*/
/*margin-right: auto; /* idem*/
/*text-align: left; /* on rétablit l'alignement normal du texte */
background-color:white;
margin:auto;
/*border:2px ridge rgb(75,0,130);*/
/*border:2px groove rgb(255,168,36);/*couleur "aureoline_yellow" */
}


#conteneur{
position:absolute;
height: 100%;
width:100%;
/*margin-left: auto; /*pour que tout soit centré*/
/*margin-right: auto; /* idem*/
/*text-align: left; /* on rétablit l'alignement normal du texte */
background-color:white;
}

#centre_test{
/*position:absolute;
left:27%;
/*margin-left: 27%;/*210px;*/
/*text-align:center;*/

overflow: auto;
/*border-left: 2px solid rgb(255,168,36);/*couleur "aureoline_yellow" */
padding-left:6px;
padding-bottom:4px;
padding-top:4px;
padding-right:6px;
scrollbar-face-color: rgb(255,168,36);/*couleur "aureoline_yellow"*/
scrollbar-highlight-color: white;/*rgb(253,248,255);*//*couleur "zinc white"*/
scrollbar-arrow-color: white;
/* http://openweb.eu.org/articles/dimensions_boites_css/ => affichage des boîte selon standard ou ie5*/
width: 730px;/*la largeur nécessaire à IE5 pour afficher la largeur voulue*/
height: 96%;/* la largeur nécessaire à IE5 pour afficher la largeur voulue*/
voice-family: "\"}\""; /*  syntaxe particulière qui cachera ce qui suit à IE 5.x Windows et ne le laissera lire qu'aux navigateurs respectant le modèle de boîte standard ;*/
voice-family:inherit;
width: 716px;/*100%-27%=73% - 2px de bordure gauche - 2fois 6px de padding gauche et droite*/
height: 93%;/* 100%-2fois 4 px de padding haut et bas- 4 % du pied*/
/*border-left: 2px solid rgb(255,168,36);/*couleur "aureoline_yellow" */
}

html>body> #centre_test{ /*ie ne comprend pas cete syntaxe et ignore ces lignes
/*  nécessaire pour que Opéra, qui comme ie5 ne lit pas les lignes après voice..., mais qui applique le modèle standard, affiche la bonne dimension*/
width: 716px;/*100%-27%=73% - 2px de bordure gauche - 2fois 6px de padding gauche et droite*/
height: 93%;
}


#centre{
position:absolute;
left:27%;
/*margin-left: 27%;/*210px;*/
/*text-align:center;*/

/*overflow: auto;*/
/*border-left: 2px solid rgb(255,168,36);/*couleur "aureoline_yellow" */
padding-left:6px;
padding-bottom:4px;
padding-top:4px;
padding-right:6px;
/*scrollbar-face-color: rgb(255,168,36);*//*couleur "aureoline_yellow"*/
/*scrollbar-highlight-color: white;*//*rgb(253,248,255);*//*couleur "zinc white"*/
/*scrollbar-arrow-color: white;*/
/* http://openweb.eu.org/articles/dimensions_boites_css/ => affichage des boîte selon standard ou ie5*/
width: 73%;/*la largeur nécessaire à IE5 pour afficher la largeur voulue*/
height: 96%;/* la largeur nécessaire à IE5 pour afficher la largeur voulue*/
voice-family: "\"}\""; /*  syntaxe particulière qui cachera ce qui suit à IE 5.x Windows et ne le laissera lire qu'aux navigateurs respectant le modèle de boîte standard ;*/
voice-family:inherit;
width: 71%;/*100%-27%=73% - 2px de bordure gauche - 2fois 6px de padding gauche et droite*/
height: 93%;/* 100%-2fois 4 px de padding haut et bas- 4 % du pied*/
}

html>body> #centre{ /*ie ne comprend pas cete syntaxe et ignore ces lignes
/*  nécessaire pour que Opéra, qui comme ie5 ne lit pas les lignes après voice..., mais qui applique le modèle standard, affiche la bonne dimension*/
width: 71%;/*100%-27%=73% - 2px de bordure gauche - 2fois 6px de padding gauche et droite*/
height: 93%;
}

#centre_avec_textaligncenter{
position:absolute;
left:27%;
/*margin-left: 27%;/*210px;*/
text-align:center;

overflow: auto;
/*border-left: 2px solid rgb(255,168,36);/*couleur "aureoline_yellow" */
padding-left:6px;
padding-bottom:4px;
padding-top:4px;
padding-right:6px;
scrollbar-face-color: rgb(255,168,36);/*couleur "aureoline_yellow"*/
scrollbar-highlight-color: white;/*rgb(253,248,255);*//*couleur "zinc white"*/
scrollbar-arrow-color: white;
/* http://openweb.eu.org/articles/dimensions_boites_css/ => affichage des boîte selon standard ou ie5*/
width: 73%;/*la largeur nécessaire à IE5 pour afficher la largeur voulue*/
height: 96%;/* la largeur nécessaire à IE5 pour afficher la largeur voulue*/
voice-family: "\"}\""; /*  syntaxe particulière qui cachera ce qui suit à IE 5.x Windows et ne le laissera lire qu'aux navigateurs respectant le modèle de boîte standard ;*/
voice-family:inherit;
width: 71%;/*100%-27%=73% - 2px de bordure gauche - 2fois 6px de padding gauche et droite*/
height: 93%;/* 100%-2fois 4 px de padding haut et bas- 4 % du pied*/
}

html>body> #centre_avec_textaligncenter{ /*ie ne comprend pas cete syntaxe et ignore ces lignes
/*  nécessaire pour que Opéra, qui comme ie5 ne lit pas les lignes après voice..., mais qui applique le modèle standard, affiche la bonne dimension*/
width: 71%;/*100%-27%=73% - 2px de bordure gauche - 2fois 6px de padding gauche et droite*/
height: 93%;
}

#groupe{
/*position:absolute;
left: 50%; 
margin-top:0;/*-100px;*/
/*margin-bottom:-260px;/*moitié de la largeur*/
/*margin-left: -260px;/*moitié de la largeur*/
width:520px;
/*height:450px;*/
margin:auto;/*OLD*/
text-align:center; /*OLD/* pour corriger le bug de centrage IE  (sauf ie6)*/
margin-bottom:20px;/*OLD*/

}

#gauche_test {
float:left;
width: 210px;/*210px;*/
height: 96%;/* à cause des 4 % du pied*/
/*border-right: 2px solid rgb(255,168,36);/*couleur "aureoline_yellow" */
}

#gauche {
position: absolute;
left:0;
width: 27%;/*210px;*/
height: 96%;/* à cause des 4 % du pied*/
border-right: 2px solid rgb(255,168,36);/*couleur "aureoline_yellow" */
}

#pied_test{
width:950px;
height: 30px;
margin:auto;
background-color:rgb(255,168,36);/*couleur "aureoline_yellow"*/
}

#pied{
position: absolute;
bottom:0;
width:100%;
height: 4%;
background-color:rgb(255,168,36);/*couleur "aureoline_yellow"*/
}

.texte_pied {
font-size:xx-small;
text-align:center;
}

#valide{
position: absolute;
bottom:0;
}

/********** BALISES XHTML **********/

img{
border:none;
}

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
/*list-style-type: none;*/
}

p {
margin: 0 0 10px 0;
padding-left:5px; /*rajouté le 4/4/06*/
}

input, select, textarea{
color: rgb(75,0,130); /*indigo (106,90,205);/*"slateblue"*/
background-color:rgb(253,248,255);/*couleur "zinc white"*/
}

legend{
font-weight: bold;
font-size: 1.2em;
}

fieldset{
border:1px solid rgb(75,0,130); /*indigo  (106,90,205);/* "slateblue"*/
}

table{
padding:10px;
}

/********** ASPECT **********/




/***** GAUCHE *****/

/*** TITRES ***/
#gauche h3 /* Tous les titres h3 de la partie gauche */
{
   font-weight: bold;
   text-align: center;
   /*font-family: Arial, "Arial Black", "Times New Roman", Times, serif;*/
}

/*** MENUS ***/
/* pour menu_public_old.php */
.menugauche{
list-style-type: none;
margin: 0;
padding:5px;
padding-bottom:0;
font-size:0.9em;
}

.menugauche li {
margin-bottom: 5px;
font-weight: bold;
padding-left:5px;
}
.menugauche a , .menu_horizontal a {
text-decoration: none; /* Les liens ne seront plus soulignés */
color: rgb(199,21,133); /*mediumvioletred*/
font-weight: bold;
/*padding-left:5px;*/
padding-right: 5px;
}

.menugauche  a:visited
   {
	/*color: rgb(193,112,214); /*(215,140,181);/*orchid*/
   }

.menugauche a:hover, .sous_menu  a:hover, #menu_horizontal a :hover{
background-color: rgb(199,21,133);/*mediumvioletred*/
	/*color: rgb(255,255,240);/*ivory*/
	color: white;
	padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
	padding-left: 5px; 
	padding-right: 5px;
}

.sous_menu{
list-style-type: none;
margin-left: 20px;
padding:5px;
font-size:0.8em;
}

.sous_menu a{
text-decoration: none; /* Les liens ne seront plus soulignés */
color: rgb(199,21,133); /*mediumvioletred*/
padding-left:5px;
padding-right: 5px;
}

/*pour menu_public.php */
#menu {
position: absolute;
top: 180px;
/*left: 1em;*/
list-style-type: none;
margin: 0;
/*padding:5px;*/
padding-bottom:0;
font-size:0.9em;
width: 100%;/*130px;*/
}

#conteneur_test #menu {
margin-top: 180px;
/*left: 1em;*/
list-style-type: none;
margin: 0;
/*padding:5px;*/
padding-bottom:0;
font-size:0.9em;
width: 210px;/*130px;*/
}

#menu dt {
cursor: pointer;
/*background: white;*/
/*margin: 2px 0;*/
text-align: left;
font-weight: bold;
padding-left: 5px; 
padding-right: 5px;
margin-left:0px;
margin-bottom:2px;
/*color: rgb(199,21,133); /*mediumvioletred*/
}

.non_cliquable, .dt_non_cliquable{
background-color:rgb(255,240,245); /*lavenderblush*/
border-left: 2px solid rgb(255,240,245); /*lavenderblush*/
/*width:130px;*/
}

.dt_non_cliquable{
padding-left: 5px; 

}

ul .non_cliquable{

}

.non_cliquable li {
text-align: left;
font-size: 85%;
/*padding-left: 5px; */
list-style-type: none;
margin:0;
border-bottom:2px solid rgb(255,240,245); /*lavenderblush*/
}

#menu dd {
/***position: absolute;***/
/*z-index: 100;*/
/*top:-1.4em;*/
/*margin-top: 10em;*/
/***left:130px;***/
/***width: 78px;***/
/*background: none;*/
/***color: rgb(199,21,133); /*mediumvioletred*/
/*border-left: 2px solid rgb(199,21,133); /*mediumvioletred*/
/***list-style-type: none;***/
}

.dd_cliquable{
position: absolute;
z-index: 100;
left: 50%;/*100px;/*11em*/
margin-top: -1.5em;/*-1.4em;*/
width: 50%;/*125px;*/
/*padding-left:1px;*/
background: white;
color: rgb(199,21,133); /*mediumvioletred*/
border:1px solid rgb(199,21,133); /*mediumvioletred*/
/*border-left: 2px solid rgb(199,21,133); /*mediumvioletred*/
/*border-right: 2px solid rgb(199,21,133); /*mediumvioletred*/
/*border-bottom: 2px solid rgb(199,21,133); /*mediumvioletred*/
}

.dd_non_cliquable{
position: absolute;
z-index: 100;
left: 130px;/*11em*/
margin-top: 0em;/*-1.4em;*/
width: 75px;
/*padding-left:1px;*/
background: white;
color: rgb(199,21,133); /*mediumvioletred*/
border-left: 2px solid rgb(255,240,245); /*lavenderblush*/
border-right: 2px solid rgb(255,240,245); /*lavenderblush*/
}

.cliquable{
/*padding: 1px;*/
border-left: 2px solid rgb(199,21,133); /*mediumvioletred*/

}
.cliquable li {
list-style-type: none;
height:23px;
text-align: left;
font-size: 85%;
/*padding-left: 5px; */
margin:0;
border-bottom:2px solid white;
}
#menu li a, #menu dt a {
color: rgb(199,21,133); /*mediumvioletred*/
text-decoration: none;
display: block;
font-weight: bold;
padding-left:5px;

}

#menu li a:hover,  #menu dt a:hover{
background-color: rgb(199,21,133);/*mediumvioletred*/
color: white;

}

/***** CENTRE *****/

/*** TITRES ***/
#centre h1, #centre_avec_textaligncenter h1 /* Tous les titres h1 du corps */
{
	padding-top:10px;
	padding-bottom:10px;
	
	background-color: rgb(199,21,133);/*mediumvioletred*/
	color: white;
   font-weight: bold;
   text-align: center;
   font-size:20px;
}

#centre h2 , #centre_avec_textaligncenter h2/* Tous les titres h2 du corps */
{
	margin: 0px;
	margin-top:10px;
	padding : 0px;
	color: rgb(199,21,133);
   font-weight: bold;
   text-indent: 20px;
   font-size:14px;
  
}

#centre h3 , #centre_avec_textaligncenter h3/* Tous les titres h3 du corps */
{
text-indent: 20px;
font-size:11px;
}

#centre h4 , #centre_avec_textaligncenter h4/* Tous les titres h3 du corps */
{
text-indent: 20px;
font-style: italic;
font-size:11px;
}

#sous_menu_horiz{
width:500px;
margin:auto;
text-align:center;
}

.liens_sousmenu{
font-size:x-small;

}




/*** PARAGRAPHES ***/

#centre p, #centre_avec_textaligncenter p, body#pop_up p
{
text-indent: 20px;
text-align:justify;
}


#centre p:first-letter, #centre_avec_textaligncenter  p:first-letter, body#pop_up p:first-letter/* La première lettre de chaque paragraphe */
{
   font-weight: bold; /* En gras */
   font-size: 1.2em; /* Ecrit légèrement plus gros que la normale */
}

/*** LIENS ***/

#centre a , #centre_avec_textaligncenter a{
text-decoration: none; /* Les liens ne seront plus soulignés */
color: rgb(199,21,133); /*mediumvioletred*/
font-weight: bold;
}

#banniere_fixe a{
color: rgb(199,21,133);/*white;*/
background-color:white;
}



#centre a:hover , #centre_avec_textaligncenter a:hover{
/*background-color:rgb(199,21,133);/*mediumvioletred*/
/*color: rgb(255,255,240);/*ivory*/
/*color: white;*/
text-decoration:underline;
}

#banniere_fixe a:hover{
background-color: white;
color: rgb(199,21,133); /*mediumvioletred*/
}


#compo_orchestre a:hover{
background-color: none;
}

/*** IMAGE DE L'ORCHESTRE ***/
#compo_orchestre {    /* bloc image en arrière-plan */
width:550px;
margin:auto;
text-align:center; /* pour corriger le bug de centrage IE  (sauf ie6)*/
}
/*#batterie {    /* zone cliquable */
/*position:absolute;
top: 100px;
float: left;
width : 4cm;
height: 3cm;
margin-left: 20px;
margin-top: 30px;
background-color: none;
}*/




/*** LISTES ***/
#centre ul, #centre li, #centre dl, #centre_avec_textaligncenter ul, #centre_avec_textaligncenter li, #centre_avec_textaligncenter dl{
margin-left:15px;
}

#centre dt, #centre_avec_textaligncenter dt{
font-weight: bold;
}

#centre dd, #centre_avec_textaligncenter dd{
text-indent: 20px;
}

ul .sans_puce{
list-style-type:none;
}

/*** MENU HORIZONTAL ***/
.horizontal{
width:448px;
margin:auto;
/*background-color:red;*/
}

.menu_horizontal {
list-style-type: none;
/*width: 540px; /* width:100%;précision pour Opera */
/*margin:auto;*/
}

.menu_horizontal li {
float: left;
}

.menu_horizontal a {
margin: 0 2px;
width: 65px;
height: 35px;
display: block;
text-align: center;
border: 1px solid rgb(199,21,133);/*mediumvioletred*/
text-decoration: none;
font-size:0.7em;
/*color: rgb(199,21,133);/*mediumvioletred*/
/*background: white;*/
}

/* IMAGES */
a:hover img/* Toutes les images contenues dans un lien */
{
/*border: none; /* Pas de bordure */
background-color:none; /*NE MARCHE PAS!*/
}


.a_venir
{
font-weight:bold;
}

.liste_instruments{
margin-left: 20px;
padding:5px;
width:160px;
font-size:0.9em;
}

.fleche_haut{
float:right;
}

#champ_texte{
width:60px;
color: rgb(75,0,130); /*indigo  106,90,205);/*"slateblue"*/
background-color:rgb(253,248,255);/*couleur "zinc white"*/
font-size:0.9em;
/*border:1px ridge rgb(75,0,130); /*indigo  106,90,205);/* "slateblue"*/
}

.bouton{
color:rgb(253,248,255);/*couleur "zinc white"*/
background-color:rgb(75,0,130); /*indigo  (106,90,205);/*"slateblue"*/
font-size:0.9em;
font-weight: bold;
}


#acces_musiciens{
margin-top:5px;
margin-right:5px;
padding-top:2px;
padding-right:2px;
font-size:0.9em;
}

.manifestations{
width:520px;
margin:auto;
text-align: center;
/*margin-top: 20px;
margin-bottom: 20px;
padding-top: 20px;
padding-bottom: 20px;*/
border-collapse:collapse;
}

.manifestations td{

border:1px solid rgb(199,21,133);/*mediumvioletred*/
}

.infos_musiciens{
width:96%;
margin:auto;
text-align:center;
background-color: rgb(255,255,224);/*yellow_light*/;
}

.infos_musiciens h3 {
text-align:center; 
background-color:rgb(199,21,133);/*mediumvioletred*/
color:white;
font-size:small;
margin-bottom:0px;
}

.infos_musiciens p{
background-color:rgb(255,255,224);/*yellow_light*/
color:rgb(75,0,130); /* "slateblue"*/
font-size:small;
font-weight:normal;
padding:5px;
margin-top:0px;
margin:0;
margin-bottom:3px;
text-align:justify;
}  


#tableau_liste, .tableau_liste{
width: 90%;
margin: auto; /* Centre le tableau */
border: 1px solid rgb(199,21,133); /* Bordure du tableau avec effet 3D (outset) */
border-collapse: collapse; /* Colle les bordures entre elles */
font-size:small;
}

#tableau_liste caption, .tableau_liste caption /* Titre du tableau */
{
   margin: auto; /* Centre le titre du tableau */
   font-family: Arial, Times, "Times New Roman", serif;
   font-weight: bold;
   font-size: 1.2em;
   color: #009900;
   margin-bottom: 20px; /* Pour éviter que le titre ne soit trop collé au tableau en-dessous */
}

#tableau_liste th, .tableau_liste th /* Les cellules d'en-tête */
{
   background-color: rgb(255,192,203); /*pink*/
   color: white;
   font-size: 1.1em;
   font-family: Arial, "Arial Black", Times, "Times New Roman", serif;
}

#tableau_liste td, .tableau_liste td /* Les cellules normales */
{
   border: 1px solid rgb(199,21,133);
   /*font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;*/
   text-align: center; /* Tous les textes des cellules seront centrés*/
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

#nom_instr{
border: 1px solid rgb(199,21,133);
/*font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;*/
text-align: center; /* Tous les textes des cellules seront centrés*/
padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
background-color: navy; /*pink*/
color: white;
width:200px;
font-size: 1em;
}

.tableau_formulaire{
width: 90%;
margin: auto; /* Centre le tableau */
border: 4px outset rgb(199,21,133); /* Bordure du tableau avec effet 3D (outset) */
border-collapse: collapse; /* Colle les bordures entre elles */
}

.tableau_formulaire td /* Les cellules normales */
{
   border: 1px solid rgb(199,21,133);
   /*font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;*/
   text-align: center; /* Tous les textes des cellules seront centrés*/
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
   width:15%;
}


#bureau{
margin:auto;
margin-top: 20px;
margin-bottom: 20px;
padding-top: 20px;
padding-bottom: 20px;
}

#bureau td{
padding-left:10px;
}

.texte_gauche
{
text-align: left;
}

.texte_centre{
text-align:center;
}

.texte_a_droite{
text-align:right;
}

.symbole{
float:left;
margin-right: 5px;
height:200px;
width:85px;
}

.image_flottante{
float:left;
margin-right: 5px;
}

.dessous
{
   clear: both;
}


.texte_dessous{
/*position:absolute;
top:380px; /*la hauteur du div "groupe" placé au-dessus
/*background-color:yellow;*/
}


.important{
color: rgb(255,168,36);/*couleur "aureoline_yellow"*/
font-weight: bold;
}

.calendrier{
margin-left:15px;
}

.calendrier li{
list-style-type:disc;
}

/* CSS pour les galeries photo*/
div#galerie
{
width:98%; /*100%;/*520px ;
background: #eed ;
border: 1px solid #dcb ;
padding-top: 10px ;
/*margin: 15px 30px ;*/
margin:auto;
text-align: center ;
font: 0.9em Georgia, serif ;
}

ul#galerie_mini
{
margin: 0 ;
padding: 0 ;
list-style-type: none ;
}

.non_flottant{
clear:both;
/*width: 130px;*/
}

ul#galerie_mini li
{
float: left ;
/*width:100px;*/
/*height:120px;*/
list-style-type: none ;
}

ul#galerie_mini li a img 
{
margin: 2px 1px ;
border: 1px solid #dcb ;
}

dl#photo
{
clear: both ;
width:98%;
margin: 0 auto ;
text-align:center;
}

dl#photo dt
{
font: italic 2.5em/1.5em Georgia, serif ;
color: #dcb ;
}

dl#photo dd
{
margin: 0 ;
}

dl#photo img
{
border: 1px solid #dcb ;
}

#big_pict2{
width:77%;/*la largeur  maximale des des photos verticales
/*width:100%; => pb pour les photos verticales, qui se retouven affichée plus larges qu'elles ne sont*/
text-align:center;
margin:auto;
}

#anim_flash{
width:600px;
height:400px;
margin:auto;
}


#big_pict{
width:520px;
text-align:center;
margin:auto;
}

.presentation_miniatures{
height:230px;
width:100%;/*510px;*/
padding-top:10px;
overflow:auto;
border:1px solid #dcb
}

.liste_image{
width: 115px;
 height: 120px;
float: left;
text-align: center;
font-size: 12px;
border-top:1px solid #dcb;
padding:5px;
}



.banniere{
width:500px;

margin:auto;
}

#banniere_fixe{
width:96%;
margin-left:auto;
margin-right:auto;
background-color:rgb(199,21,133);/*mediumvioletred*/
color:white;
margin-bottom:20px;
text-align:center;
font-weight:bold;
padding:5px;
}

/*TROMBINO */
table#nom_instr_img{
 /*margin: auto;*/
width:300px;
border-top: 4px outset rgb(199,21,133); /*mediumvioletred*/
border-collapse: collapse;
text-align:left;
padding:5px;
margin:10px;
}

table#nom_instr_img td{ 
text-align:left;
}

.table_coordonnees{
width:300px;
/*margin:auto;*/
text-align: left;
/*margin-top: 20px;*/
/*margin-bottom: 20px;*/
/*padding-top: 20px;*/
/*padding-bottom: 20px;*/
border-collapse:collapse;
padding:5px;
margin:10px;
/*border:1px solid green;*/
}

.table_coordonnees td{
text-align: left;
padding: 10px;
/*border:1px solid green;*/
}


#compteur{
   background-color: rgb(199,21,133);
   color: white;
    font-weight: bold;
   /*border: 1px solid green;*/ 
   position: absolute;
   /*right: 50%;*/
   bottom: 10px;
   margin-left:20px;
   padding:5px;
}

table.bureau{
width:92%;
border:4px outset rgb(199,21,133); /*mediumvioletred*/
border-collapse: collapse; 
margin: auto;
}

table.bureau td{
border-top: 1px solid rgb(199,21,133); /*mediumvioletred*/
text-align:left;
padding-left:8px;
}

td.ph{
width:85px;
}

td.nom{
width:40%;
border-left:1px solid rgb(199,21,133); /*mediumvioletred*/
padding-left:8px;
}

dl.liste_normale{
margin-left:30px;
}

ul.liste_normale{
list-style-type:disc;
margin-left:30px;
}

ul.musique{
list-style-image: url("../Images/note.gif");
margin-left:30px;
}

.label{
/*display:block;*/
float: left;
width: 280px;
/*text-align: right;*/
}

div.partenaires{
border: 2px solid rgb(199,21,133);
margin-bottom:5px;
padding:5px;
}

li.vert{
color:green;
}

li.rouge{
color:red;
}

li.orange{
color:orange;
}

#tableau_coordonnees_perso{
width: 800px;
margin: auto; /* Centre le tableau */
border: 1px outset rgb(199,21,133); /* Bordure du tableau avec effet 3D (outset) */
border-collapse: collapse; /* Colle les bordures entre elles */
font-size:small;
}

td#tableau_coordonnees_perso{
width:200px;
text-align:left;
border: 1px solid rgb(199,21,133);
}

.titre_dewplayer{
color:rgb(199,21,133);
font-weight: bold;
}

.auteur_dewplayer{
font-style:italic;
}

#pied_dewplayer{
position: absolute;
top:60;
font-size:xx-small;
text-align:center;
}

#tableau_jeu{
width: 90%;
margin: auto; /* Centre le tableau */
border: 4px solid rgb(199,21,133); /* Bordure du tableau avec effet 3D (outset) */
border-collapse: collapse; /* Colle les bordures entre elles */
font-size:small;
}

#tableau_jeu caption /* Titre du tableau */
{
   margin: auto; /* Centre le titre du tableau */
   font-family: Arial, Times, "Times New Roman", serif;
   font-weight: bold;
   font-size: 1.2em;
   color: #009900;
   margin-bottom: 20px; /* Pour éviter que le titre ne soit trop collé au tableau en-dessous */
}

#tableau_jeu th /* Les cellules d'en-tête */
{
   background-color: rgb(255,192,203); /*pink*/
   color: white;
   font-size: 1.1em;
   font-family: Arial, "Arial Black", Times, "Times New Roman", serif;
}

#tableau_jeu td /* Les cellules normales */
{
   border: 1px solid rgb(199,21,133);
   /*font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;*/
   text-align: left; /* Tous les textes des cellules seront centrés*/
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

a.observations{
position:relative;
color:#0e6ab3;
text-decoration:none;
font-weight:bold;
display: block;
height:20px;
/*font-size:larger;*/
/*text-transform:capitalize;*/
}

a.observations span{
   display: none; /* on masque l'infobulle */
   font-weight:normal;
   font-size:10px;
   text-decoration:none;
}


a.observations:hover {
   background: none; /* correction d'un bug IE */
   z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
text-decoration:none;
   cursor:help;/* on change le curseur par défaut en curseur d'aide */
}

a.observations:hover span{
   display: block; /* on affiche l'infobulle */
   position: absolute;
	z-index: 501;
   /*white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */

   top: 10px; /* on positionne notre infobulle */
   /*bottom:0;*/
   left: 50px;
   width: 100px;
   background: white;
   color:#0e6ab3;
   padding: 3px;
   border: 1px solid #0e6ab3;
   border-left: 4px solid #0e6ab3;
   text-decoration:none;
}

a.lienblanc {color: white; text-decoration: none;}
a.lienblanc:hover{color: white; text-decoration: none;}

#petit_calendrier{
position:relative;
width:300px;
/*float:left;*/
/*margin-right:20px;*/
text-align:center;
/*margin-left:20px;*/
margin:auto;
}

#petit_calendrier a{color: white; text-decoration: none;}
#petit_calendrier a:hover{color: white; text-decoration:underline;}

#petit_calendrier table{
width:200px;
height:150px;
font-size:10px;
background-color:#d7cbf5;
}

#ejs_texte{
position:absolute;
top:10px;
left:200px;
width:150px;
}

#ejs_texte p{
background-color: navy;
color:white;
padding:3px;
}

.separation{
clear:both;
visibility:hidden;
}

#tableau_resa_0, #tableau_resa_1{
width: 90%;
margin: auto; /* Centre le tableau */
border-collapse: collapse; /* Colle les bordures entre elles */
font-size:small;
}

#tableau_resa_0{
border: 4px outset orange;
}

#tableau_resa_1{
border: 4px outset green;
}

#tableau_resa_0 th, #tableau_resa_1 th /* Les cellules d'en-tête */
{
   color: white;
   font-size: 1.1em;
   font-family: Arial, "Arial Black", Times, "Times New Roman", serif;
}

#tableau_resa_0 th{
background-color: orange;
}

#tableau_resa_1 th{
background-color: green;
}

#list3 {
border: 1px solid #d7cbf5;
width:600px;
margin:auto;
 }
 

#list3 div.selected .title {
font-weight: bold;
}
#list3 div div {
	border-left:8px solid #d7cbf5;/*#6699CC;*/
	padding: 5px;
}

#list3 div .title{
 background:url(../Images/fond_accordeon.jpg) top no-repeat;
 }

#list3 div div div{
	border:none;
	padding: 0;
}
#list3 div.title {
	border: 1px solid white;/*#3366AA;*/
	background-color: #d7cbf5;;/*#6699CC;*/
	padding: 10px;
	cursor: pointer;
	color:navy;
}
#list3 div.selected {
	border-bottom: none;
}
/* tables */
table.tablesorter {
	font-family:arial;
	background-color: #CDCDCD;
	margin:10px 0pt 15px;
	font-size: 8pt;
	width: 100%;
	text-align: left;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
	background-color: #e6EEEE;
	border: 1px solid #FFF;
	font-size: 8pt;
	padding: 4px;
}
table.tablesorter thead tr .header {
	background-image: url(bg.gif);
	background-repeat: no-repeat;
	background-position: center right;
	cursor: pointer;
}
table.tablesorter tbody td {
	color: #3D3D3D;
	padding: 4px;
	background-color: #FFF;
	vertical-align: top;
}
table.tablesorter tbody tr.odd td {
	background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
	background-image: url(asc.gif);
}
table.tablesorter thead tr .headerSortDown {
	background-image: url(desc.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
background-color: #8dbdd8;
}

.suggestionsBox {
    position: relative;
    left: 30px;
    margin: 10px 0px 0px 0px;
    width: 200px;
    background-color: #212427;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border: 2px solid #000;
    color: #fff;
}

.suggestionList {
    margin: 0px;
    padding: 0px;
}

.suggestionList li {
    margin: 0px 0px 3px 0px;
    padding: 3px;
    cursor: pointer;
}

.suggestionList li:hover {
    background-color: #659CD8;
}