body
{
	width: 760px;
	margin: auto; /* Pour centrer notre page */
	margin-top: 10px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
	margin-bottom: 10px;    /* Idem pour le bas du navigateur */
	background-color: #eeeeee;
	/*background-image: url("../images/abdoulaye/citeu.jpg");*/
	/*font-family: Arial, "Arial Black", Times, "Times New Roman", serif; */
	font-family: "Trebuchet MS", "Tahoma", "Lucida Grande", "phetsarath ot", Arial, sans-serif;
	/*font-size: 15px;*/
}

/* L'en-tête */

#en_tete
{
	width: 760px;
	height: 100px;
	background-color: blue;
	padding: 0px;
}

#texte_en_tete
{
	padding-top: 35px;
	padding-left: 45px;
	font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}

#en_tete img
{
	border: none;
}

#en_tete a /* Tous les titres h1 du corps */
{
	color: white;
	font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
	text-decoration: none;
}

#conteneur
{
	background-color: white;
	padding: 5px;
	min-height: 868px;/*1002px;*/
	margin-bottom: 0px;
}

/* Le menu */

#menu
{
	float: left; /* Le menu flottera à gauche */
	width: 130px; /* Très important : donner une taille au menu */
	margin-top: 5px;
}

.element_menu
{
	/*background-color: white;
	/*background-image: url("../images/motif.png");
	background-repeat: repeat-x;*/
   
	border: 2px solid blue;
   
	margin-bottom: 5px; /* Pour éviter que les éléments du menu ne soient trop collés */
}

/* Quelques effets sur les menus */

.element_menu h3 /* Tous les titres de menus */
{   
	background-color: blue;
	margin: 0px;
	color: white;
	font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
	text-align: center;
}

.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
	/*list-style-image: url("images/puce.png"); /* On change l'apparence des puces */
	padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
	/*padding-left: 5px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
	margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
	/*margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
	list-style: none;
}

.element_menu ul li
{
	font-size: 0.8em;
	border-bottom: 1px solid blue;
	padding: 5px;
	padding-right: 0px;
}

.element_menu a /* Tous les liens se trouvant dans un menu */
{
	color: #012650;
	text-decoration: none;
}

.element_menu ul li:hover
{
	background-color: #2c86ee; /*#c9dcdc;*/
}

.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
	text-decoration: underline;
	color: white;
}

/* Le corps de la page */

#corps_gestion
{
	/*margin-left: 135px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
	margin-bottom: 5px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
	margin-top: 5px;
	padding: 15px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
	min-height: 444px;
	
	background-color: white; /* Une couleur de fond pour le corps */
	/*background-image: url("../images/motif.png");
	background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */
   
	border: 2px solid blue; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

#corps
{
	/*margin-left: 135px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
	margin-bottom: 5px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
	margin-top: 25px;
	/*margin-top: 25px;*/
	padding: 0px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
	/*min-height: 410px;
	
	/*background-color: #7cb8fc; /* Une couleur de fond pour le corps */
	/*background-image: url("../images/motif.png");
	background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */
   
	/*border: 1px solid blue; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

#corps h1 /* Tous les titres h1 du corps */
{
	color: #a8a342; /*#012650;*/
	text-align: center;
	font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}

#corps h3 /* Tous les titres h1 du corps */
{
	color: Blue;
	font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}

#corps h2 /* Tous les titres h2 du corps */
{
	padding-left: 30px;
	color: #012650;
	text-align: left;
}

#corps p
{
	text-align: justify;
}

/* Le pied de page (qui se trouve tout en bas, en général pour les copyrights) */

#pied_de_page
{
	padding: 5px;
	clear: both;
	text-align: center;
	color: #012650;
	background-color: white;
	border: 2px solid blue;
}

#pied_de_page a
{
	color: #2c86ee;
	font-weight: bold;
	text-decoration: none;
}

#pied_de_page a:hover
{
	color: green;
	text-decoration: underline;
}

#corps img.horizontale
{
	width: 4OOpx;
	height: 300px;
}

#corps img.verticale
{
	width: 3OOpx;
	height: 400px;
}

#corps p.center_image
{
	text-align: center;
	padding-bottom:30px;
}

/*Le chat à l'acceuil*/

#news_chat_publicite
{
	float: right; /* Le menu flottera à gauche */
	width: 170px; /* 215 Très important : donner une taille au menu */
	padding: 0px;
	overflow: auto;
}

#contenu
{
	margin-right: 175px; /* 220Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
	margin-bottom: 0px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
	padding: 10px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
	Padding-bottom: 0px;
	Padding-top: 0px;
	border: 2px solid blue;
}

#news_chat_publicite div
{
	border: 2px solid blue;
	padding: 0px;
	margin:0px;
	margin-bottom: 5px;
}

#news_chat_publicite h4
{
	margin: 0px;
	padding-bottom: 5px;
	text-align: center;
	background-color: blue;
	color: white;
}

#news_chat_publicite h4 a
{
	color: white;
	text-decoration: none;
}

#news_chat_publicite p
{
	margin: 5px;
}

#news_chat_publicite ul /* Toutes les listes à puces se trouvant dans un menu */
{
	list-style-image: url("images/puce.png"); /* On change l'apparence des puces */
	padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
	padding-left: 5px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
	margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
	margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}

#news_chat_publicite ul a
{
	text-decoration: none;
	color: black;
	font-size: 0.8em;
}

#news_chat_publicite #chat img
{
	text-align: right;
}

#news_chat_publicite  a:hover, #news_chat_publicite  .sondage p a:hover
{
	text-decoration: underline;
}

.date
{
	font-size: 0.7em;
}

.message
{
	margin-left: 20px;
}

#corps p.auteur
{
	text-align: right;
}

.couleur
{
	background-color: #7cb8fc;
}

/*#commentaires_news ul*/
.liste
{
	padding: 0px;
	list-style: none;
}

/*#commentaires_news ul li*/
.liste .element_liste
{
	background-color: #e2edf6;
	margin-bottom: 2px;
}

/*#commentaires_news ul h5*/
.liste .titre
{
	color: white;
	background-color: #2c86ee;
	margin-bottom: 0px;
	margin-top: 0px;
	display: block;
}

input:focus, textarea:focus
{
	background-color: #e2edf6;
}

label
{
	color: blue;
	font-weight: bold;
}

.label
{
	padding-bottom: 10px;
}

#contenu a, #news_chat_publicite  .sondage p a
{
	text-decoration: none;
	color: #2c86ee;
}

#contenu a:hover
{
	text-decoration: underline;
}

.liste_news
{
	padding: 0px;
	list-style: none;
	border: 1px solid #a8a342;
	border-bottom: none;
}

.liste_news .news_titre
{
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 80px;
	border-bottom: 1px solid #a8a342;
	font-weight: bold;
}


.liste_news .news_date_com
{
	margin-bottom: 0px;
	padding-left: 5px;
	padding-right: 10px;
	padding-top: 5px;
	float: left;
	font-size: 0.7em;
}

.compteur
{
	margin: 0px;
}

#precedente
{
	float: left;
	margin: 0px;
}

#suivante
{
	margin: 0px;
}

#corps #suivante
{
	text-align: right;
}

.aligner_liste
{
	text-align: justify;
}

#cse-search-box
{
	position: relative;
	/*top: 30px;*/
	color: white;
	/*right: 255px;*/
	/*top: 90px;
	right: 510px;*/
	top: -47px;
	left: 250px;
}

/*colorer la page selectionnée*/
#contenu a.selection
{
	text-decoration: underline;
	color: black;
}

/*la musique*/
.musique, .lecteur
{
	border: 1px solid #a8a342;
	padding-top: 5px;
	padding-left: 3px;
}

#contenu .musique
{
	font-weight: bold;
	color: #2c86ee;
	border-right: none;
}

#contenu .lecteur
{
	border-left: none;
}

table.table
{
	border-collapse: collapse;
	width: 100%;/*417px;*/
	margin-bottom:10px;
}

#corps .image img
{
	width: 3OOpx;
	height: 200px;
}

.image 
{
	float: left;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 10px;
}

#contenu .sondage
{
	border: 1px solid blue;
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 5px;
}

#contenu .sondage h4
{
	color: white;
	background-color: blue;
	margin: 0px;
	text-align: center;
}

#contenu .sondage a.titre_sondage
{
	color: white;
}

#contenu .encre
{
	margin: 0px;
	text-align: right;
}

/*sous menu du tournoi de guidimakha*/

#sous_menu , #encres, #encres1, #encres2
{
	padding : 0px; /* pas de marge intérieure */
	margin : 0px; /* ni extérieure */
	margin-top: 2px;
	list-style : none; /* on supprime le style par défaut de la liste */
	line-height : 21px; /* on définit une hauteur pour chaque élément */
	font-weight : bold; /* on met le texte en gras */
	font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
	font-size : 12px; /* hauteur du texte : 12 pixels */
	text-align : center; /* on centre le texte qui se trouve dans la liste */
}

#sous_menu a, #encres a, #encres1 a, #encres2 a /* Contenu des listes */
{
	display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
	padding : 0; /* aucune marge intérieure */      
	color : #fff; /* couleur du texte */
	text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
	background-color: blue;
}

#sous_menu a
{
	width : 82px; /* largeur */
}

#encres a
{
	width : 76px;/*55px; /* largeur */
}

#encres1 a
{
	width : 66px;/*55px; /* largeur */
}

#encres2 a
{
	width : 57px;/*55px; /* largeur */
}

#sous_menu  li, #encres li, #encres h4, #encres1 li, #encres1 h4, #encres2 li, #encres2 h4/* Éléments des listes */      
{ 
	float : left; 
	/* pour IE qui ne reconnaît pas "transparent" */
	border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
	
}

html>body #sous_menu ul li, /*html>body #encres ul li, html>body #encres ul h4*/
{
    border-right: 1px solid transparent ; /* on met une bordure transparente à droite de chaque élément */
}



#encres h4
{
	margin: 0px;
	border-right: 1px solid white;
	padding : 0; /* aucune marge intérieure */      
	color : white; /* couleur du texte */
	width : 85px; /* largeur */
	background-color: blue;
}

#encres1 h4
{
	margin: 0px;
	border-right: 1px solid white;
	padding : 0; /* aucune marge intérieure */      
	color : white; /* couleur du texte */
	width : 81px; /* largeur */
	background-color: blue;
}

#encres2 h4
{
	margin: 0px;
	border-right: 1px solid white;
	padding : 0; /* aucune marge intérieure */      
	color : white; /* couleur du texte */
	width : 86px; /* largeur */

	background-color: blue;
}

#sous_menu .dernier
{
	border: none;
}

#pouleA h1, #pouleB h1, #pouleC h1, #pouleD h1, #pouleE h1, #pouleF h1,  #pouleG h1,  #pouleH h1
{
	margin: 0px;
	font-size: 20px;
}

.journee
{
	background-color: blue;
	width: 100%;
	font-size: 18px;
	border-collapse: collapse;
	color: white;
	margin-bottom: 10px;
}

.journee caption, .classement caption
{
	color: #a8a342;
	text-align: left;
	font-size: 18px;
}

.journee td
{
	border-top: 2px solid white;
	border-bottom: 2px solid white;
	width: 100px;
}

.journee .date
{
	border-bottom: none;
	text-align: center;
}
.droite
{
	text-align: right;
}

.journee .milieu
{
	font-size: 0.7em;
	border: none;
	border-bottom: 2px solid white;
	text-align: center;
}

.classement td.gauche, th.gauche
{
	text-align: left;
}

.classement
{
	width: 100%;
	font-size: 15px;
	border-collapse: collapse;
	color: #2c8af5;
	margin-bottom: 20px;
}

.classement th
{
	/*text-align: left;*/
	background-color: blue;
	color: white;
}

.classement td
{
	text-align: center;
}

.classement tr.color, #palmares tr.color
{
	background-color: #f2f2f2;
}

.transition
{
	color: white;
}

#signature 
{
	width: 280px;
	border: 1px solid blue;
	margin-left: 269px;/*133px;*/
	margin-bottom: 5px;
	font-size: 0.8em;
}

#signature th
{
	text-align: left;
}

#signature h4
{
	background-color: blue;
	margin: 0px;
	color: white;
	text-align: center;
}

#signature p
{
	margin: 0px;
	margin-left: 2px;
	margin-bottom: 2px;
}

/*Mise en forme du forum*/
.question
{
	border: 1px solid blue;
	margin-bottom: 10px;
}

.question .haut
{
	background-color: blue;
	margin: 0px;
	color: white;
	padding-left: 2px;
	font-size: 0.8em;
}

.question .milieu
{
	padding-left: 3px;
	padding-right: 3px;
	font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}

.question .bas
{
	background-color: blue;
	margin: 0px;
	color: white;
	padding-left: 2px;
	font-size: 0.8em;
}

#contenu .question .bas a
{
	color: white;
	margin-left: 325px;/*190px;*/
}

.article
{
	border: 1px solid #a8a342;
	margin: 0px;
	margin-bottom: 10px;
	color: blue;
}

.article .titre
{
	margin: 0px;
	font-weight: bold;
	padding-left: 5px;
	font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}

.auteur_date
{
	background-color: #d3dce3;
	margin: 0px;
	font-size: 0.8em;
}

.auteur_date .droite
{
	margin-left: 222px;/*90px;*/
}

.visualisations_commentaires
{
	background-color: #d3dce3;
	margin: 0px;
	font-size: 0.8em;
}

.visualisations_commentaires .droite
{
	margin-left: 325px;/*190px;*/
}


/*Menu horizontal déroulant*/
#menu_horizontal, #menu_horizontal ul /* Liste */     
{
        padding : 0; /* pas de marge intérieure */
        margin : 0; /* ni extérieure */
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 21px; /* on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */
}

#menu_horizontal /* Ensemble du menu_horizontal */
{
        font-weight : bold; /* on met le texte en gras */
        font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
        font-size : 12px; /* hauteur du texte : 12 pixels */
}

#menu_horizontal a /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 0; /* aucune marge intérieure */
        background : blue; /* couleur de fond */        
        color : #fff; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 124px; /* largeur */
}

#menu_horizontal li /* Éléments des listes */      
{ 
        float : left; 
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
}

#menu_horizontal li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
        width: 124px; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
}


#menu_horizontal li ul li /* Eléments de sous-listes */
{
        /* pour ie qui ne reconnaît pas "transparent" (comme précédemment) */
        border-top : 1px solid #fff; /* on met une bordure blanche en haut de chaque élément d'une sous-liste */
}

#menu_horizontal li ul ul 
{
        margin    : -22px 0 0 124px ; /* On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */ 
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-left     : 1px solid #fff ; /* Petite bordure à gauche pour ne pas coller ... */      
}


#menu_horizontal a:hover /* Lorsque la souris passe sur un des liens */    
{
        text-decoration: underline;
}

#menu_horizontal li:hover ul ul, #menu_horizontal li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
}

#menu_horizontal li:hover ul , #menu_horizontal li li:hover ul, #menu_horizontal li.sfhover ul, #menu_horizontal li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
}

#contenu p.partage, #contenu div.addthis_toolbox
{
	text-align: center;
}

.addthis_toolbox, .addthis_default_style
{
	margin-bottom: 0px;
	padding-bottom: 0px;
}

/*Menu circulaire*/
#menuCirculaire
{
 width: 250px;
 height: 130px;
 background-color: blue; 
 margin: auto;
 margin-top: 5px;
 padding-top: 60px;
}

#corps #menuCirculaire h2
{
 color: white;
 font-size: 15px;
 padding: 5px;
 text-align: center;
}

#menuCirculaire li
{
 list-style-type: none;
 list-style-position: inside;
}

#menuCirculaire a
{
	color: white;
}

#centre
{
 height: 70px;
 width: 70px;
 margin: auto;
}

.item
{
 position: absolute;
}

/* mise en forme du palmares*/
#palmares 
{
	margin-top: 10px;
	width: 100%;
	width: 100%;
	font-size: 18px;
	color: blue;
	margin-bottom: 10px;
	border-collapse: collapse;
}
#palmares th
{
	background-color: blue;
	text-align: left;
	color: white;
}
#palmares caption
{
	color: #a8a342;
	font-size: 20px;
}

/*mise en forme de la liste des chefs de village*/
#chefVillage 
{
   width: 100%; 
   border: 4px outset blue; /* Bordure du tableau avec effet 3D (outset) */
   border-collapse: collapse; /* Colle les bordures entre elles */
   margin-bottom: 10px;
}

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

#chefVillage td /* Les cellules normales */
{
   border: 1px solid black;
   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 */
}

#news_chat_publicite .sondage
{
	font-size: 0.7em;
	font-family: Arial, "Arial Black", Times, "Times New Roman", serif;  
	margin: 0px;
	margin-bottom: 5px;
}

.commentaire
{
	background-image: url("../images/abdoulaye/commentaire.png");
	background-repeat: no-repeat;
	background-position: center center;
	text-align: center;
	width: 32px;
	color: white;
}

#news table
{
	border-collapse: collapse; /* Colle les bordures entre elles */
	width: 100%;
	font-family: Arial, "Arial Black", Times, "Times New Roman", serif; 
}

.top
{
	border-top: 1px solid #a8a342;
}

.bottom
{
	border-bottom: 1px solid #a8a342;
}

.bold
{
	font-weight: bold;
	color: #4d9dc7;
}

.chanson
{
	width: 100%;
}

.distance
{
	height: 20px;
}

/*Carousel*/

#carousel
{
	width: 700px;
	height: 150px;
	position: absolute;
	top: 100px;
	left: 50%;
	margin-left: -350px;
}
#carousel a
{
	position: absolute;
	width: 110px;
}

#ImageBoxOverlay
{
	background-color: #000;
	z-index: 1000;
}
#ImageBoxOuterContainer{
	z-index: 1000;
}
#ImageBoxCaption
{
	background-color: #F4F4EC;
}
#ImageBoxContainer
{
	width: 250px;
	height: 250px;
	background-color: #F4F4EC;
}
#ImageBoxCaptionText
{
	font-weight: bold;
	padding-bottom: 5px;
	font-size: 13px;
	color: #000;
}
#ImageBoxCaptionImages
{
	margin: 0;
}
#ImageBoxNextImage
{
	background-image: url(images/imagebox/spacer.gif);
	background-color: transparent;
}
#ImageBoxPrevImage
{
	background-image: url(images/imagebox/spacer.gif);
	background-color: transparent;
}
#ImageBoxNextImage:hover
{
	background-image: url(images/imagebox/next_image.jpg);
	background-repeat:	no-repeat;
	background-position: right top;
}
#ImageBoxPrevImage:hover
{
	background-image: url(images/imagebox/prev_image.jpg);
	background-repeat:	no-repeat;
	background-position: left bottom;
}

/*Mise en forme du bredcrumbs*/
#bredcrumbs
{
	font-size: 11px;
	/*background-color: red;*/
	margin-bottom: -25px;
	/*padding-bottom: 0px;*/
}
#bredcrumbs a
{
	color: blue;
	text-decoration: none;
}
#bredcrumbs a:hover
{
	text-decoration: underline;
}
