/* 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{
	background: #5f5f5f url(gx/bg.gif) repeat-x top;
	margin: 0;
	padding: 0;
	text-align:center;
	_behavior:url("inc/csshover.htc");
}
html{
	color: #717172;
	font-size: 11px;
	font-family: Arial, Helvetica, Impact;
}
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, h2, h2 a, h2 a:link, h2 a:visited{
	font: normal 23px Impact, Arial;
	color: #fff;
	text-transform: uppercase;
	line-height: 27px;
	text-decoration: none;
	letter-spacing: 1px;
}
h3, h3 a, h3 a:link, h3 a:visited{
	font-size: 18px;
	color: #fff;
	font-weight: normal;
	line-height: 22px;
	text-decoration: none;
	width: auto;
}
h3 a:hover, h3 a:visited:hover{text-decoration: underline;}
p{
	font-size: 12px;
	line-height: 20px;
	color: #fff;
	padding: 5px 0;
	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:#e4bb00; 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:#fff; text-decoration:underline;
}
.gris{color: #999999;}
.orange, .orange a, .orange a:link, .orange a:visited{color: #d26f02;}
.bleu, .bleu a, .bleu a:link, .bleu a:visited{color: #44b5e9;}
.petitepaddroit{padding-right: 20px;}
.droite{text-align: right;}

ul li{color:#fff; font-size:12px; line-height: 20px; list-style:square; margin-left:16px;}
ol li{color:#fff; font-size:11px; line-height: 20px; margin-left:16px;}

a.rss, a.rss:link, a.rss:visited{
	font-size: 14px;
	float: right;
	margin-right: 20px;
	text-decoration:none;
}
a.rss:hover, a.rss:visited:hover{text-decoration: underline;}

.logofeed{float: left;}

/* CONTENEURS ET CLASSES GÉNÉRALES
--------------------------------------------------------------------------------------- */
#conteneur{
	margin: 0 auto;
	text-align: left;
	width: 1000px;
	position: relative;
}
#conteneurint{
	padding-right: 15px;
	width: 949px;
	float: right;
}
.both{clear: both;}
.left{clear: left;}

#entete{
	width: 949px;
	height: 118px;
	position: relative;
}

#logo{
	display: block;
	position: absolute;
	left: 15px;
	top: 0;
	width: 265px;
	height: 187px;
	background: url(Gx/logo.png) no-repeat left top;
	z-index: 1;
	text-decoration : none;
	text-indent : -999em;
	overflow : hidden;
	cursor: pointer;
}

#marc{
	position: absolute;
	left: 0;
	top: 112px;
	width: 266px;
	height: 369px;
	background: url(Gx/marc.png) no-repeat left top;
	z-index: 901;
	text-decoration : none;
	text-indent : -999em;
	overflow : hidden;
}
#introduction{
	width: 949px;
	height: 363px;
	background-color: #373737;
	position: relative;
	z-index: -997;
	float: left;
}
#centre{
	float: left;
	background: #2f2f2f; 
	padding: 0 9px 0 10px;
}
#centreint{
	float: left;
	width: 930px;
	background: #2f2f2f url(Gx/centre_bg.gif) repeat-x top; 
	padding-top: 30px;
}
#contenu{
	width: 630px;
	float: left;
}
#coldroite{
	width: 300px;
	float :left;
}
#coldroite a.banniere, #coldroite div.banniere{margin-bottom: 10px;display: block;}


#bas{
	width: 949px;
	height: 88px;
	float: left;
	background: url(Gx/bas_bg.gif) no-repeat left top;
}
.evenement img{
	display: block;
	float: left;
	margin-right: 10px;
}
.evenement .date{
	background-color: #000;
	padding: 10px 5px;
	text-decoration: none;
	font-size: 12px;
}
.evenement p{
	display: block;
	width: 400px;
	float: left;
}
#lecteuraudio{
	width: 300px;
	height: 30px;
}

/* ACCUEIL
--------------------------------------------------------------------------------------- */
/*#infobuleacc{
	float: left;
	background: url(Gx/00/infubule.png) no-repeat left top;
	width: 423px;
	height: 197px;
	width: 341px;
	height: 175px;
	z-index: 902;
	padding: 22px 22px 0 60px;
}

#calendrieracc{
	float: right;
	width: 310px;
	height: 200px;
	background: url(Gx/00/calendrier.png) no-repeat left top;
}*/
#calendrieracc{
	float: left;
	width: 341px;
	height: 175px;
	margin-top:62px;
	padding: 22px 22px 0 60px;
	background: url(Gx/00/calendrier.png) no-repeat left top;
}
#calendrieracc h1{padding: 0px 10px 5px 0px;}
#calendrieracc h1.petittop{padding: 5px 10px 5px 0px;}

#calendrieracc a, #calendrieracc a:link, #calendrieracc:visited{
	display: block;
	position: relative;
	float: left;
	width: 336px;
	height: 38px;
	border-bottom: 1px #cfbe72 dotted;
	background: url(Gx/00/calendrier_off.png) no-repeat left top;
	font-size: 13px;
	line-height: 17px;
	color: #fff;
	text-decoration: none;
	padding: 5px 0 0 5px;
}
#calendrieracc a.dernier{border: none;}
/*#calendrieracc a strong{color: #373737;}*/
#calendrieracc a:hover, #calendrieracc a:visited:hover{background: url(Gx/00/calendrier_over.png) no-repeat left top;}
#banniereacc{
	float: right;
	padding-left: 10px;
}
#logoCKOI{float:right; width:310px; margin-top:10px}
#logoCKOI a h3{float:left; margin:15px 15px 0 0; font: normal 19px Impact, Arial;}

/* MENUS
--------------------------------------------------------------------------------------- */
#menuu{
	padding: 5px 0 0 0; 
	width:949px;
	position: absolute;
	top:0;
	left: 0;
	z-index: 2;
}

#menuu ul{margin: 0 0 0 0;padding: 0;}
#menuu ul li{padding: 0;margin: 0;list-style-type: none;float:right;}
#menuu ul li a, #menuu ul li a:link, #menuu ul li a:visited{
	text-decoration: none;
	font-size: 11px;
	line-height: 15px;
	text-transform: uppercase;
	font-weight: bold;
	color: #b6b6b6;
	display: block;
	float: left;
	padding: 4px 12px 5px 12px;
}
/* Hover */
#menuu ul li a:hover, #menuu ul li a:visited:hover{color: #fff;}

#menuu ul li.premier a:hover, #menuu ul li.premier a:visited:hover{background-color: #dab300;}
#menuu ul li.deuxieme a:hover, #menuu ul li.deuxieme a:visited:hover{background-color: #d26f02;}
#menuu ul li.troisieme a:hover, #menuu ul li.troisieme a:visited:hover{background-color: #808080 ;}
#menuu ul li.quatrieme a:hover, #menuu ul li.quatrieme a:visited:hover{background-color: #3dacdf ;}
#menuu ul li.cinquieme a:hover, #menuu ul li.cinquieme a:visited:hover{background-color: #82a514;}
#menuu ul li.sixieme a:hover, #menuu ul li.sixieme a:visited:hover{background-color: #dab300;}
/* Actif */
#menuu ul li.premier a.actif, #menuu ul li.premier a.actif:visited{background: #dab300 url(Gx/M/menuu_actif.gif) no-repeat center top;color: #fff;}
#menuu ul li.deuxieme a.actif, #menuu ul li.deuxieme a.actif:visited{background: #d26f02 url(Gx/M/menuu_actif.gif) no-repeat center top;color: #fff;}
#menuu ul li.troisieme a.actif, #menuu ul li.troisieme a.actif:visited{background: #808080 url(Gx/M/menuu_actif.gif) no-repeat center top;color: #fff;}
#menuu ul li.quatrieme a.actif, #menuu ul li.quatrieme a.actif:visited{background: #3dacdf url(Gx/M/menuu_actif.gif) no-repeat center top;color: #fff;}
#menuu ul li.cinquieme a.actif, #menuu ul li.cinquieme a.actif:visited{background: #82a514 url(Gx/M/menuu_actif.gif) no-repeat center top;color: #fff;}
#menuu ul li.sixieme a.actif, #menuu ul li.sixieme a.actif:visited{background: #dab300 url(Gx/M/menuu_actif.gif) no-repeat center top;color: #fff;}



/* Menu Principale */
#menu{float: right;padding: 52px 0 0 0;}
#menu ul{margin: 0;padding: 0;display: block;float: left;}
#menu ul li{padding: 0;margin: 0;list-style-type: none;display: block;float: left;position: relative;z-index: 999;}
#menu ul li a, #menu ul li a:link, #menu ul li a:visited{text-decoration: none;padding: 0 0 0 22px;display: block;float: left;}
#menu ul li a img{display: block;float: left;}

#menu ul li ul li a, #menu ul li ul li a:link, #menu ul li ul li a:visited{
	font: 11px Arial;
	line-height: 15px;
	color: #fff;
	text-decoration: none;
	display:block;
	margin: 0px;
	width: 107px;
	background: #5f5f5f;
	padding: 4px;
	float: none;
	z-index: 999;
	position: relative;
}
#menu ul li ul li a:hover{background: #e6bd00;}

#menu ul li ul{
	position:absolute;
	display: none;
	height: auto;
	margin: 0;
	padding: 0;
	float:none;
	top:33px;
	left:21px;
	width: 115px;
	list-style-type: none;
	list-style-image: none;
	z-index: 999;
}
#menu ul li:hover ul, #menu ul li.hover ul, #menu ul li a:hover ul { 
	display: block;
}
#menu ul li ul li{
	margin: 0;
	padding: 0;
	text-align: left;
	background: none;
	width: 115px;
	float: left;
	height: auto;
	border-bottom: 1px #000 solid;
	border-left: 1px #000 solid;
	border-right: 1px #000 solid;
	z-index: 999;
	position: relative;
}

/* Menu du centre */
#menuc{float: left;padding: 6px 0 0 10px;width: 939px;background-color: #2f2f2f;}
#menuc ul{margin: 0;padding: 0;display: block;float: left;}
#menuc ul li{padding: 0;margin: 0;list-style-type: none;display: block;float: left;}
#menuc ul li a, #menuc ul li a:link, #menuc ul li a:visited{
	text-decoration: none;
}
/* Menu du bas */
#menub{
	
}
#menub ul{margin: 0;padding: 0;display: block;float: left;}
#menub ul li{padding: 10px 15px;margin: 0;list-style-type: none;display: block;float: left;}
#menub ul li a, #menub ul li a:link, #menub ul li a:visited{
	text-decoration: none;
	font-size: 11px;
	color: #8f8f8f;
	font-weight: bold;
}
/* Menu du pied de page */
#menupp{float: right;}
#menupp ul{margin: 0;padding: 0;display: block;float: left;}
#menupp ul li{padding: 0 0 0 12px;margin: 0;list-style-type: none;display: block;float: left;}
#menupp ul li a, #menupp ul li a:link, #menupp ul li a:visited{
	text-decoration: none;
	color: #e6e6e6;
	font-size: 12px;
}

/*
#menu{}
#menu ul{margin: 0;padding: 0;display: block;float: left;}
#menu ul li{padding: 0;margin: 0;list-style-type: none;display: block;float: left;}
#menu ul li a, #menu ul li a:link, #menu ul li a:visited{
	text-decoration: none;
}
*/


/* PIED DE PAGE
--------------------------------------------------------------------------------------- */
#piedPage{color: #000;padding-top: 10px;}
#piedPage a, #piedPage a:link, #piedPage a:visited{color: #000;text-decoration: none;}
#piedPage a:hover, #piedPage a:visited:hover{color: #000;text-decoration: underline;}


/* Partager cette page (bookmarker) */
#socialBookmarker{
	float:left;
	background: url(Gx/socialBookmarker_bg.gif) no-repeat left top;
	width: 154px;
	height: 19px;
	color: #b5b5b5;
	padding-left: 25px;
	line-height: 20px;
}
#socialBookmarkerPrefix {float:left;cursor:default;padding-right: 10px;}
.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;
	border: 1px solid #eee;
}

#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: none; font-size: 11px; padding: 0;}
fieldset legend{border: 1px solid #999; color:#000; font-size:14px; font-weight:bold; padding:3px;}
fieldset label{
	font-size:12px;
	color:#fff;
	margin:2px 0 2px 0;
	float: left;
	width: 100px;
}

.champTexte{
	background: #4d4d4d;
	border: 1px #969696 solid;
	color: #fff;
	font-size: 12px;
	margin:2px 0 2px 0;
	padding: 2px;
	width: 300px;
}
.listeDeroulante{
	background: #EEF3F7;	
	border: 1px solid #C9D0D6;
	color: #4E677A;
	font-size: 11px;
	margin:2px 0 2px 0;
}
.boiteTexte{
	background: #4d4d4d;
	border: 1px #969696 solid;
	color: #fff;
	font-size: 12px;
	font-family: Arial;
	margin:2px 0 2px 0;
	padding: 2px;
	width: 300px;
	height: 100px;
}
.bouton{
	background-color: #EEF3F7;
	color: #498ECB;
	font-family: "Trebuchet MS";
	font-size: 13px;
	font-weight: bold;
}
.bouton:hover{background-color:#1A80B6; color:#FFF;}

.champCache{display:none; visibility:hidden;} /* Utilisé pour l'anti-spam */

.erreur{color:#FF0000;}


/* Infolettre */
#infolettre{
	float: right;
	width: 300px;
	padding: 15px 20px 0 0;
}
.infolettretext{
	background: #2e2e2e;
	border: none;
	color: #fff;
	font-size: 11px;
	margin: 8px 10px 0 0;
	padding: 6px;
	display: block;
	float: left;
	width: 240px;
}

.infolettresubmit{
	font-size: 0;
	width: 33px;
	height: 26px;
	display: block;
	border: none;
	margin-top: 6px;
	float: left;
	background: url(Gx/M/infolettresubmit.gif) no-repeat left top;
	text-indent: -999em;
}
.infolettresubmit:hover{background: url(Gx/M/infolettresubmit_over.gif) no-repeat left top;}

/*Formulaire Contact */

.contactsubmit{
	font-size: 0;
	width: 106px;
	height: 30px;
	display: block;
	border: none;
	margin-left: 100px;
	float: left;
	background: url(Gx/07/contactsubmit.gif) no-repeat left top;
}
.contactsubmit:hover{background: url(Gx/07/contactsubmit_over.gif) no-repeat left top;}

.contactreset{
	font-size: 0;
	width: 106px;
	height: 30px;
	display: block;
	border: none;
	float: left;
	background: url(Gx/07/contactreset.gif) no-repeat left top;
}
.contactreset:hover{background: url(Gx/07/contactreset_over.gif) no-repeat left top;}

/* CALENDRIER
--------------------------------------------------------------------------------------- */
#boiteCalendrier{
	width: 290px;
	height: 235px;
	float: left;
	padding: 5px;
	background: url(Gx/02/boiteCalendrier.gif) no-repeat left top;
	margin-bottom: 10px;
}

#boiteCalendrier a.lemois, #boiteCalendrier a.lemois:link, #boiteCalendrier a.lemois:visited{
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	text-transform: capitalize;
}
#calendrier{margin-top: 5px;}
tr.calendarheader td{
	background-color: #000;
	color:#fff;
	height: 26px;
	font-size:12px;
	vertical-align: middle;
	text-transform: uppercase;
	font-weight: bold;
}
.calendar {
	color:#fff;
	font-size:12px; 
	
	}
.calendartoday{font-weight:bold;}

#calendrier a.calendarActif, #calendrier a.calendarActif:link, #calendrier a.calendarActif:visited{
	color:#000;
	font-weight: normal;
	text-decoration:none; 
	display: block;
	padding-top: 4px;
	line-height: 12px;
}
td.tdcalendarActif{background: url(Gx/02/dateactif.gif) no-repeat 9px 5px;}

#calendrier a.calendarActif:hover, #calendrier a.calendarActif:visited:hover{color:#fff;}
table#calendrier tr td a, #blocCal p a{color: #fff; font-size: 11px; text-decoration: underline;}
table#calendrier tr td a:hover, #blocCal p a:hover{color:#fff;}
/* Outils d'info-bulles en javascript onMouseover="ddrivetip('')"
************************************************************** */
#dhtmltooltip { position: absolute; left: -300px; width: 150px; padding: 10px; visibility: hidden; z-index: 100; text-align : left; }
#dhtmltooltip dt, #dhtmltooltip dd { width : auto; padding : 0; margin : 0 }
#dhtmltooltip dd { padding-left : 5px; font: bold 10px Verdana, Arial, Helvetica, sans-serif; color: #9A6219; text-align: left; }
#dhtmltooltip dt { margin-bottom : 2px; font: bold 10px Verdana, Arial, Helvetica, sans-serif; color: #513903; text-align: left;}
#dhtmlpointer { position:absolute; left: -300px; z-index: 101; visibility: hidden; }
#dhtmltooltip { border: 1px solid #555; background-color: #dab300; color : #000; }
#dhtmltooltip dt { color : #000; border-bottom : 1px solid #000; }

