/* Modifié le 17/08/2007 */

  /****************************************************************/
 /*              Styles communs à toutes les pages               */
/****************************************************************/

body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 70%; background-color: #000000; padding: 0px; margin: 0px; min-width: 1000px; }
img { border: 0px; }
form { margin: 0px; display: inline; }
input, textarea { font-size: 90%; font-family: Verdana, Arial, Helvetica, sans-serif; border : 1px solid #000000; background-color: #FFFFFF; margin: 3px; vertical-align: middle; }
p { margin: 0; }
p.center { margin: 10px; text-align: center; }

.underline { text-decoration: underline; }
.formulaire { width: 400px; margin: auto; margin-bottom: 20px; }
.formulaire TD { padding: 5px }
.clearing { clear: both; height: 0px; font-size: 0px; }
.entete { width: 100%; height: 63px; }
.erreur, .confirmation{ font-weight: bold; color: #CC3333; text-align: center; padding: 10px 0px 10px 0px; font-size: 110%; }
.confirmation { color: #33CC33; }
.footer { font-size: 90%; text-align: center; color: #FFFFFF; padding: 5px; background-color: #222222; border-top: 1px solid #555555; border-bottom: 1px solid #555555; }
.footer A, .footer A:visited { color: #FFFFFF; }
.cadre { border: 1px solid #000000; line-height: 12px; padding: 5px; text-align: center; }
.cadre IMG { margin-top: 10px; }
.gras { font-weight: bold; }
.quote { margin: 5px; padding: 10px; background-color: #eee; border: 1px solid #ddd; }

/* Barre du logo */
#barre_logo { background:url('/ressources/fond_logo.gif'); height: 42px; margin-bottom: 1px; }
#logo { background:url('/ressources/logo.jpg') no-repeat left top; height: 42px; }
#barre_logo_info { float: right; margin: 7px 10px 0 10px; font-size: 80%; text-align: right; }
#barre_formulaires { background:url('/ressources/fond_haut.gif') repeat-x; background-color: #000; height: 75px; }

/* Contenu de la barre grise du haut */
#chat_messages_top { width: 340px; height: 50px; overflow : hidden; }
#div_recherche { float: right; width: 250px; text-align: center; margin: 15px 15px 0 0; }
#div_chat { float: left; width: 350px; margin: 5px 15px 0 5px; font-size: 80%; }
#div_login { float: left; width: 300px; margin: 5px 15px 0 0; font-size: 90%; text-align: center; }
#div_login a { color: #333; text-decoration: none; }
#div_login a:hover { text-decoration: underline; }
#div_login h1 { font-size: 100%; margin: 0px; }
#saisie_chat { border-top: 1px solid #cccccc; font-size: 110%; }

/* Styles pour les onglets */
/*#onglets { background: #000000; line-height: normal; clear: both; height: 23px; padding-left: 20px; border: 0px solid #ffffff; width: 800px; }
#onglets ul { float: left; margin: 0; padding:0; list-style: none; }
#onglets li { float: left; background:url("/ressources/onglet_left.gif") no-repeat left top; margin: 0; padding: 0 0 0 15px; }
#onglets a { float: left; display: block; background: url("/ressources/onglet_right.gif") no-repeat right top; padding: 5px 15px 4px 0; text-decoration: none; font-weight: bold; color: #666666; }
/* Commented Backslash Hack
cache la règle à IE5-Mac \*/
/*#onglets a { float:none; }*/
/* Fin du hack IE5-Mac */
/*
#onglets a:hover { background-image:url("/ressources/onglet_right.gif"); color:#222222; }
#onglets #current { background-image: url("/ressources/onglet_left_on.gif"); border-width: 0; }
#onglets #current a { background-image:url("/ressources/onglet_right_on.gif"); color:#333; padding-bottom:5px; }
*/

/*****************************************************************/
/* Blocs de contenus */
#contenu_gauche { margin: 0 185px 0 10px; background-color: #EFEFEF; }
#contenu_droite { float: right; width: 170px; margin-right: 10px; display: inline; background-color: #efefef; }
/* Hack pour IE afin d'éviter la double marge à droite : display: inline; */
#contenu_gauche #colgauche { width: 180px; float: left; }
#contenu_gauche #colcentre { margin-left: 180px; border-left: 1px solid #555; }

#contenu_droite .publicite { width: 120px; height: 240px; margin: 10px 25px 0 25px; }
#contenu_gauche #colgauche .publicite { text-align: center; margin: 10px; }

/* Angles arrondis */
.contenu_tl { background: url(/ressources/contenu_gauche_tl.gif) no-repeat top left; padding-left: 5px; font-size: 90%; }
.contenu_tr { background: url(/ressources/contenu_gauche_tr.gif) no-repeat top right; padding-top: 5px; font-size: 1px; }
.contenu_bl { background: url(/ressources/contenu_gauche_bl.gif) no-repeat bottom left; padding-left: 5px; font-size: 90%; }
.contenu_br { background: url(/ressources/contenu_gauche_br.gif) no-repeat bottom right; padding-top: 5px; font-size: 1px; }

/*****************************************************************/
/* Barre de navigation */
#navigation { border-bottom: 1px solid #555; padding: 0 10px 5px 10px; font-size: 90%; }
#navigation a { color: #222; text-decoration: none; }
#navigation a:hover { text-decoration: underline; color: #555; }

/*****************************************************************/
/* Barre de position pour les commentaires */
.container_position { text-align: center; width: 97%; margin-left: 1%; }
.position { height: 30px; width: 530px; margin-left: auto; margin-right: auto; }
.position ul			{ margin: 0; padding: 0; list-style: none; }
.position li 			{ color: #000; width: 35px;  float: left; margin: 5px; font-weight: bold; border: 1px solid #59B400; line-height: 20px; text-align: center; }
.position a			{ background-color: #fff; color: #000; width: 35px; display: block; text-decoration: none; }
.position a:hover	{ background-color: #59b400; color: #fff; }
.position li.active	{ background-color: #59b400; color: #fff; }
.position li.pointilles { background-color: #fff; }
.position li.vide		{ border: 0; }

/*****************************************************************/
/* Barres de titre */
.title_blue .gauche { background:url('/ressources/blue_tl.gif') no-repeat left top; margin: 15px; margin-bottom: 0; }
.title_blue .droite { background:url('/ressources/blue_tr.gif') no-repeat right top; color: #FFFFFF; font-weight: bold; line-height: 22px; padding: 2px; padding-top: 0; margin-left: 5px; }
.title_green .gauche { background:url('/ressources/green_tl.gif') no-repeat left top; margin: 15px; margin-bottom: 0; }
.title_green .droite { background:url('/ressources/green_tr.gif') no-repeat right top; color: #FFFFFF; font-weight: bold; line-height: 22px; padding: 2px; padding-top: 0; margin-left: 5px; }
.title_yellow .gauche { background:url('/ressources/yellow_tl.gif') no-repeat left top; margin: 15px; margin-bottom: 0; }
.title_yellow .droite { background:url('/ressources/yellow_tr.gif') no-repeat right top; color: #FFFFFF; font-weight: bold; line-height: 22px; padding: 2px; padding-top: 0; margin-left: 5px; }
.title_orange .gauche { background:url('/ressources/orange_tl.gif') no-repeat left top; margin: 15px; margin-bottom: 0; }
.title_orange .droite { background:url('/ressources/orange_tr.gif') no-repeat right top; color: #FFFFFF; font-weight: bold; line-height: 22px; padding: 2px; padding-top: 0; margin-left: 5px; }

/*****************************************************************/
/* Contenu des colonnes de gauche et de droite */

/* Styles communs */
#topactualites, #actus_par_annee, #rand_pics, #links, #fortunes, #arborescence  { background-color: #eeeeee; border-bottom: 1px solid #555; padding-top: 10px; font-size: 90%; }
#topactualites a, #actus_par_annee a{ display: block; text-decoration: none; border-top: 1px solid #ddd; color: #000000; text-decoration: none; padding: 8px; text-align: justify; }
#topactualites a:hover, #actus_par_annee a:hover { background-color: #ffffff; background-image: none; }
#rand_pics h1, #links h1, #fortunes h1, #topactualites h1, #actus_par_annee h1, #arborescence h1 { margin: 0; font-size: 110%; font-weight: bold; margin-bottom: 10px; color: #333; text-align: center; }
#fortunes p, #arborescence p { padding: 10px; margin: 0; }
#rand_pics img, #links img { border: 1px solid #000; margin: 2px; }
#rand_pics, #links { text-align: center; }
#links { border: 0; }

/* Arborescence des articles */
#arborescence { line-height: 10px; }
#arborescence IMG { vertical-align: middle; }
#arborescence A { color: #222222; text-decoration: none; }
#arborescence A:hover { text-decoration: underline; }

/*****************************************************************/
/* Liste des actualités */
.liste_actualites { border: 1px solid #007CC3; background-color: #ffffff; margin: 0 15px 15px 15px; }
.liste_actualites A { text-decoration: none; color: #000000; line-height: 17px; padding: 4px; display: block; border-bottom: 1px solid #ACDEFB; }
.liste_actualites A:hover { background-color: #ACDEFB; background-image: none; }

/* Fond clignotant pour les nouvelles actualités*/
.nouveau1 { background-image:url(/ressources/nouveau1.gif); }

/*****************************************************************/
/* Affichage des articles */
#article { border: 1px solid #007CC3; background-color: #ACDEFB; line-height: 17px; text-align: justify; margin: 0 15px 0 15px; }
#article p { margin: 0 10px 0 10px; }
#article a { color: #000; }
#article a:hover { color: #555; }
/* Alignement des images dans les articles */

.imgleft { float: left; border: 0px; margin: 5px 10px 5px 0px; border: 1px solid #46320B; }
.imgright { float: right; border: 0px; margin: 5px 0px 5px 10px; border: 1px solid #46320B; }
.imgcenter { border: 0px; margin: 5px 10px 5px 10px; border: 1px solid #46320B; }


/* Gallerie d'images des articles */
.actuimages td { text-align: center; }
.actuimages td { padding: 5px; width: 600px; }
.actuimages img { border: 1px solid #000000; }
/* Barre de navig */
.navig_images { height: 15px; padding: 10px; border: 1px solid #bbbbbb; background-color: #ffffff; margin: 0 14px 0 14px; }
.navig_images a, .navig_images a:hover { text-decoration: none; font-weight: normal; color: #333333; }
.navig_images .gauche { float: left; }
.navig_images .droite { float: right; line-height: 10px; }
.navig_images .droite img, .navig_images .gauche img { margin: 0 10px 0 10px; vertical-align: middle; }

#article #videos {
	text-align: center;
	border-top: 1px solid #A8CAFB;
	padding: 10px;
}

/*****************************************************************/
/* Styles de la barre de navigation */
.barre_navig { background-color: #EEEEEE; border-bottom: 1px solid #656565; font-weight: bold; padding: 5px; color: #555555; }
.barre_navig A { text-decoration: none; color: #555555; }
.barre_navig A:hover { text-decoration: none; color: #000000; }

/*****************************************************************/
/* Box arrondies */

/* Boîte orange avec les coins arrondis */
.orange { margin: 15px; }
.orange #content { background-color: #f90; color: #fff; margin: 0; padding: 0 10px 0 10px; }
.orange .topleft { background: url(/ressources/orange_15_tl.gif) no-repeat top left; padding-left: 15px;  }
.orange .topleft .topright { background: url(/ressources/orange_15_tr.gif) no-repeat top right; height: 15px; font-size: 1px; }
.orange .bottomleft { background: url(/ressources/orange_15_bl.gif) no-repeat bottom left; padding-left: 15px;  }
.orange .bottomleft .bottomright  { background: url(/ressources/orange_15_br.gif) no-repeat top right; height: 15px; font-size: 1px; }

/* Fond gris avec bords */
.grey_5b .topleft { background: url(/ressources/grey_5b_tl.gif) no-repeat top left; padding-left: 5px; }
.grey_5b .topleft .topright { background: url(/ressources/grey_5b_tr.gif) no-repeat top right; height: 5px; font-size: 1px; }
.grey_5b .bottomleft { background: url(/ressources/grey_5b_bl.gif) no-repeat bottom left; padding-left: 5px;  }
.grey_5b .bottomleft .bottomright  { background: url(/ressources/grey_5b_br.gif) no-repeat top right; height: 5px; font-size: 1px; }
.grey_5b .contentleft { background: url(/ressources/grey_b_l.gif) repeat-y top left; padding-left: 5px; }
.grey_5b .contentleft .contentright { background: url(/ressources/grey_b_r.gif) repeat-y top right; padding-right: 5px; }
.grey_5b input { border: 1px solid #808080; vertical-align: middle; }

/* Fond blanc avec bords */
.white_5b .topleft { background: url(/ressources/white_5b_tl.gif) no-repeat top left; }
.white_5b .topleft .topright { background: url(/ressources/white_5b_tr.gif) no-repeat top right; margin-left: 5px; padding-top: 5px; }
.white_5b .bottomleft { background: url(/ressources/white_5b_bl.gif) no-repeat bottom left; }
.white_5b .bottomleft .bottomright  { background: url(/ressources/white_5b_br.gif) no-repeat top right; margin-left: 5px; padding-top: 5px; }
.white_5b .contentleft { background: url(/ressources/white_b_l.gif) repeat-y top left; padding-left: 5px; }
.white_5b .contentleft .contentright { background: url(/ressources/white_b_r.gif) repeat-y top right; padding-right: 5px; }

/*****************************************************************/
/* Barre de bas de page */
#footer_bar_t { background:url('/ressources/blue_bar_t.gif'); height: 26px; margin-top: 10px; }
#footer_bar { background-color: #53a9e4; text-align: center; font-size: 80%; padding: 0 15px 0 15px; line-height: 2em; }
#footer_bar A { color: #000000; }
#footer_bar_b { background:url('/ressources/blue_bar_b.gif'); height: 26px; }

/*****************************************************************/
/* Styles d'affichage et de masquage des divs */
.hideshow, IMG.hideshow, IMG.lien { float: right; margin: 5px 5px 5px 10px; z-index: 3; }

/*****************************************************************/
/* Styles pour la pop-up d'affichage des images */
.afficheimage {	display: block; position: absolute; visibility: hidden; z-index: 4; background: black; border: 1px solid #000000; }
.afficheimage IMG { border: 0; }

/*****************************************************************/











  /****************************************************************/
 /*           Styles particuliers pour certaines pages           */
/****************************************************************/


/* Module de chat */
#chat { margin: 15px; }
#chat_messages, #chat_connectes, #chat_message_a_poster { background-color: #FFFFFF; border: 1px solid #333333; padding: 5px; }
#chat_messages { margin: 0 3px 3px 0; overflow: hidden; line-height: 19px; }
#chat_connectes { float: right; width: 150px; line-height: 19px; }
#chat_messages, #chat_connectes { height: 400px; }
#chat_connectes h1 { font-size: 90%; text-align: center; }
#chat_message_a_poster a { color: #333333; text-decoration: none; }
#chat_message_a_poster a:hover { text-decoration: underline; }

/* Styles du contenu des messages du chat */
.date_chat { color: #555555; }
.pseudo_chat { color: #3A85AC; }
.pseudo_chat_absent { color: #666666; }
.message_chat { color: #222222; }



/*****************************************************************/
/* Informations sur la homepage */

#info { color: #222222; padding: 15px 15px 0 15px; }
#info .gras { color: #444444; }
#info h1	{ font-size: 140%; text-align: center; margin: 0 0 25px 0; color: #164191; }
#info ul { margin: 0 5px 5px 5px; padding: 5px 0 10px 25px; list-style-image: url(/ressources/puce_jaune.gif); }
#info p { margin: 10px; text-align: justify; }
#info .contentright { padding: 10px; line-height: 15px; }










/* Styles communs */
.div_commentaire,	.div_utilisateur	{ margin: 15px; margin-top: 0; text-align: justify; }
.div_commentaire H2,	.div_utilisateur H2	{ font-size: 11px; padding: 3px 8px 3px 8px; margin: 0px; line-height: 17px; }
.div_commentaire .texte { padding: 10px; }
/*.div_commentaire P,	.div_utilisateur P	{ padding: 10px; margin: 0; }*/

/* Affichage des commentaires */
.div_commentaire 		{ border: 1px solid #59B400; border-top: 0; background-color: #FFFFFF; }

.div_commentaire STRONG	{ color: #39A400; }
.div_commentaire A		{ color: #59B400; text-decoration: underline; }
.div_commentaire A:hover	{ color: #555555; }
UL#commentaires			{ margin: 0; padding: 0px; list-style:none; border-bottom: 0; }
UL#commentaires LI		{ border-top: 1px solid #59B400; }
UL#commentaires H3		{ font-size: 11px; font-weight: bold; margin: 0; border-bottom : dotted 1px #C8E6AB; padding: 5px 10px 5px 10px; }

INPUT.nom { background-image: url(/ressources/form-nom.gif); }
INPUT.sujet { background-image: url(/ressources/form-sujet.gif); }
INPUT.mail { background-image: url(/ressources/form-mail.gif); }
INPUT.url { background-image: url(/ressources/form-url.gif); }
INPUT.verifmodele { border: 1px solid #00FF00; }
TEXTAREA.texte { background-image:url(/ressources/form-texte.gif); }

/* Formulaire de création et de modification de l'utilisateur */
.div_utilisateur { border: 1px solid #ff821d; background-color: #ffffff; }
.div_utilisateur h1 { color: #444444; font-weight: bold; font-size: 100%; margin: 25px 10px 5px 10px; }
.div_utilisateur p { margin: 10px; }
.div_utilisateur ul { list-style-image: url(/ressources/puce_jaune.gif); }

#form_creation_compte		{ margin: 15px; }
#form_creation_compte TABLE	{ border-collapse: collapse; }
#form_creation_compte TH	{ color: #444444; padding: 4px; }
#form_creation_compte TH, #form_creation_compte TD { border-top: 1px solid #999999; padding: 5px; }


























/* Boîtes de contenus de la colonne centrale */
.contenubox, .contenuboxb { background-color: #FFFFFF; border: 1px solid #888888; text-align: left; margin: 0 15px 0 15px; }
.contenubox P, .contenuboxb P { margin: 10px; text-align: justify; line-height: 17px; }
.contenubox A, .contenuboxb A { color: #222222; }
.contenubox A:hover, .contenuboxb A:hover { color: #666666; font-weight: bold; }
.contenudate { font-size: 90%; color: #555555;  }
.contenubox H1 { text-align: left; margin-top: 0px; margin-bottom: 2px; font-size: 110%; font-weight: bold; padding: 4px; border-bottom: 1px solid #888888; }



/*
Encore utilisés par dernières actualités
*/
.listboxcolor1, .contenuboxcolor1, .listboxcolor3, .listboxcolor4, .listboxcolor5, .contenuboxcolor6, .listboxcolor6 { background-color: #FFFFFF; margin: 0 15px 15px 15px; text-align: justify; line-height: 14px; }
.colgauche .listboxcolor1, .colgauche .listboxcolor6 { margin: 8px 0px 0px 0px; line-height: 11px; font-size: 90%; }
.colgauche .listboxcolor1 H2, .colgauche .listboxcolor6 H2 { line-height: 16px; font-size: 90%; text-align: center; }
.listboxcolor1 H2, .contenuboxcolor1 H2, .listboxcolor3 H2, .listboxcolor4 H2, .listboxcolor5 H2, .contenuboxcolor6 H2, .listboxcolor6 H2 { color: #FFFFFF; font-size: 11px; padding: 3px 8px 3px 8px; margin: 0px;  line-height: 17px; }
.listboxcolor1 A, .listboxcolor3 A, .listboxcolor4 A, .listboxcolor5 A, .listboxcolor6 A { display: block; color: #000000; text-decoration: none; padding: 4px 8px 4px 8px; }

.infos_actualite { position: absolute; z-index: 5; width: 99%; height: 20px; text-align: right; color: #777777; font-size: 10px; font-weight: bold; line-height: 20px; vertical-align: middle; }
.infos_actualite IMG { vertical-align: middle; }

/*.listboxcolor1 { position: relative; z-index: 2; border: 1px solid #007CC3; }*/
.listboxcolor1 { position: relative; border: 1px solid #777; }
.listboxcolor1  H2 { background-color: #007CC3; }
/*.listboxcolor1 A { border-bottom: 1px solid #ACDEFB; }*/
.listboxcolor1 A { border-bottom: 1px solid #bbb; color: #777; }

/* Bleu */
a.typearticle1 { background-color: #e6f0fe; }
a.typearticle1:hover { background-color: #c1dcff; color: #222; }
/* Jaune */
a.typearticle2 { background-color: #ffe6ad; }
a.typearticle2:hover { background-color: #fedc8f; color: #222; }
/* Rose */
a.typearticle3 { background-color: #ffcff2; }
a.typearticle3:hover { background-color: #feace8; color: #222; }
/* Vert */
a.typearticle4 { background-color: #e2ffd6; }
a.typearticle4:hover { background-color: #c7ffb0; color: #222; }
/*a.typearticle4:hover { background-color: #b8fe9c; color: #222; }*/

/*.listboxcolor1 A:hover { background-color: #ACDEFB; background-image: none; }*/




.contenuboxcolor1 { border: 1px solid #007CC3; background-color: #ACDEFB; }
.contenuboxcolor1 H2 { background-color: #007CC3; font-weight: bold; }
.contenuboxcolor1 P { margin: 8px 8px 8px 8px; }
.contenuboxcolor1 A { color: #000000; }
.contenuboxcolor1 A:hover { color: #007CC3; }


.listboxcolor3 { border: 1px solid #6B0098; }
.listboxcolor3 H2 { background-color: #6B0098; }
.listboxcolor3 A { border-bottom: 1px solid #C392FA; }
.listboxcolor3 A:hover { background-color: #C392FA; }

.listboxcolor4 { border: 1px solid #FF5723; }
.listboxcolor4 H2 { background-color: #FF5723; }
.listboxcolor4 A { border-bottom: 1px solid #FFD1D1; }
.listboxcolor4 A:hover { background-color: #FFD1D1; }


.listboxcolor5 { border: 1px solid #888888; }
.listboxcolor5 H2 { background-color: #666666; }
.listboxcolor5 A { border-bottom: 1px solid #EEEEEE; }
.listboxcolor5 A:hover { background-color: #EEEEEE; }


.listboxcolor6 { border: 1px solid #FFD800; }
.listboxcolor6 H2 { background-color: #FFD800; color: #444444; }
.listboxcolor6 A { border-bottom: 1px solid #FFD800; }
.listboxcolor6 A:hover { background-color: #FDF5B3; }
.contenuboxcolor6 { border: 1px solid #FFD800; background-color: #FDF5B3; }
.contenuboxcolor6 H2 { background-color: #FFD800; color: #444444; font-weight: normal; }
.contenuboxcolor6 H2 A { color: #444444; }
.contenuboxcolor6 H2 A:hover { color: #999999; }
.contenuboxcolor6 P { margin: 8px 8px 8px 8px; }









/*****************************************************************/
/* Liste des articles */
.liste_articles {
	border: 1px solid #007CC3;
	background-color: #fff;
	margin: 15px;
}
.liste_articles h1 {
	color: #fff;
	background: url(blue_tr.gif);
	font-size: 12px;
	font-weight: bold;
	padding: 4px 0 4px 5px;
	margin: 0;
}
.liste_articles h1 a {
	color: #fff;
	text-decoration: none;
}
.liste_articles h1 a:hover {
	
}
.liste_articles .row a {
	text-decoration: none;
	color: #000000;
	line-height: 17px;
	padding: 4px 0 4px 10px;
	display: block;
	border-top: 1px solid #DDF;
	border-bottom: 1px solid #BBE;
}
.liste_articles .row a:hover {
	background-color: #ACDEFB;
	font-weight: bold;
}
.liste_articles .row .date {
	color: #447;
	font-weight: bold;
}
.liste_articles .row .nbclics {
	color: #888;
}
.liste_articles .row .niveau {
	color: #888;
}

.stop_in {
	text-align: center;
	border: 1px solid #9c0003;
	background: #e7e7e7 url(../ressources/stop.png) no-repeat 20px 20px;
	width: 400px;
	height: 45px;
	padding: 25px 50px 0px 90px;
	font-weight: bold;
	font-size: 12px;
	margin: auto;
	color: #9c0003;
}

.stop_out {
	text-align: center;
	padding: 40px;
}