/* CSS document */
/* color reminder: 
	body background: #E7E7E7;
	gris anthracite: #424242;
	bleu logo :      #8dd5d1
	brun logo:       #ae9f7e
*/

body{
	background-color: #e7e7e7;
	text-align: center;
	font-family: Helvetica, Verdana, "Sans-serif";
	font-size: 12px;
	padding: 0px;
	}
a{
	text-decoration: none;
	color: #424242;
	}

h1{
	font-size: 2em;
	font-family: "Trebuchet MS", Verdana, Helevetica, Sans;
	}

h2{
	font-size: 1.2em;
	font-family: "Trebuchet MS", Verdana, Helevetica, Sans;
	color: #424242;
	border-bottom: 1px solid #424242;
	padding-left: 10px;
	padding-bottom: 5px;
	}
h3{
	font-size: 1.2em;
	font-family: "Trebuchet MS", Verdana, Helevetica, Sans;
	font-variant: small-caps;
	color: black;
	border-top: 1px dashed #424242;
	padding-top: 2px;
	padding-bottom: 5px;
	}

hr{
	clear: left;
	}

table{
	font-family: Helvetica, Verdana, "Sans-serif";
	font-size: 12px;
	width: 600px;
	margin: auto;
	}

table.category{
	width: 520px;
	margin: 30px auto;
	
	}

table tr{
	border-collapse: collapse;
	}

table td, th{
	padding: 10px;
	background-color: #E7E7E7;
	text-align: center;
	}

td hr{
	color: white;
	border: 1px solid white;
	}

td.left{
	text-align: left;
	}
	td.left b{
		display : block; 	
		padding: 0;
		margin: 0;
		}
	

#page{
	width: 800px;
	padding: 0px;
	background-color: #FFFFFF;
	margin: auto;
	margin-top: 0px;
	text-align: left;
	min-height: 500px;
	border: 2px solid #D3D3D3;
	overflow: auto;
	}

#header{
	width: 100%;
	height: 120px;
	background-image: url(./img/header.png);
	background-repeat: no-repeat;
	border-bottom: 1px solid #d3d3d3;
	overflow: visible;
	}
	#header h1{
		display: none;
		}
	#header .click-zone{
		display : block;
		position: relative;
		top: 10px;
		left: 10px;
		width: 100px;
		height: 100px;
		background-image: url(./img/logo-header.png);
		background-repeat: no-repeat;
		}
	#header .hidden{
		display:none ;
		}
	#menu_1{
		float: right;
		margin-top: 10px;
		margin-right: 15px;
		color: #d3d3d3;	
		}
		#menu_1 a{
			color: #d3d3d3;	
			}
		#menu_1 a:hover{
			color: #424242;
			}

#menu_haut{
	width: 100%;
	height: 20px;
	text-align: right;
	border-bottom: 1px solid #d3d3d3;
	}
	#menu_haut ul {
		list-style-type: none;
		display: inline;
		padding-left: 5px;
		}
	#menu_haut li{
		display : inline;
		margin-left: 5px;
		}
	/* l'image fait 20 x 80 px */
	#menu_haut a{
		text-decoration: none;	
		font-variant: small-caps;
		font-family: "Trebuchet MS", verdana, arial, "Sans serif";
		font-size: 13px;
		color: #ae9f7e;
		padding-left: 30px;
		margin-right: 20px;
		background-image: url(./img/cupiti.png);
		background-position: 0px -40px; 
		background-repeat: no-repeat;
		}
	#menu_haut a:hover {
		background-position:0px 0px;
		color: #8dd5d1;
		}

	#menu_admin{
		margin-top : 20px;
		border-top : 1px solid #424242;
		border-bottom : 1px solid #424242;
		height: 18px;
		padding-top: 5px;
		text-align: center;
		overflow: hidden;
		}
		#menu_admin ul{
			list-style-type: none;
			margin : 0px;
			margin-right: 15px;
			display : inline;
			}
		#menu_admin li{
			display: inline;
			margin: 0px;
			}
		#menu_admin a{
			padding: 10px;
			margin: 0px;
			}
		#menu_admin a:hover{
			color: #FFFFFF;
			background-color: #424242;
			}

/* Content part */

#content{
	min-height: 450px;
	border-bottom : 1px solid #d3d3d3;
	padding: 10px;
	font-size: 13px;
	text-align: justify;
	overflow: visible;
	}
	#googlemaps{
		float: right;
		clear: both;
		padding: 5px;
		border: 1px solid #D3D3D3;
		}

	#content p{
		text-indent : 10px;
		}

	#content .center{
		text-align: center;
		}	

	#links{
		display: block;
		text-align: center;
		font-size: .9em;
		}
	#links a:hover {
		text-decoration: underline;
		}
	
	#text{
		padding-left: 40px;
		padding-right: 20px;
		line-height: 1.5em;
		overflow: auto;
		}

	#text h2{
		margin-left: -30px;
		}

	#text h3{
		font-family: "Trebuchet MS", Verdana, "Sans Serif";
		font-variant: small-caps;
		font-size: 1.2em;
		border: none;
		color: black;
		}
		
	#text h3 small{
		font-variant: normal;
		font-weight: normal;
		font-size: 12px;
		font-family: Arial, Verdana, "Sans serif";
		}

	#text a{
		color: #987654;
		}

	#text img{
		padding: 5px;
		border: 1px solid #D3D3D3;
		margin: 10px;
		float : right;
		clear: right;
		}

	#text img.img_center{
		display: block;
		float: none;
		margin : auto;
		}

	#text img.img_inline{
		display: inline;
		float: none;
		}

	#fond_de_page{
		display: block;
		text-align: left;
		margin-top: 10px;
		margin-left: 25px;
		padding-left: 15px;
		padding-bottom: 0px;
		padding-top : 5px;
		margin-bottom: 0px;
		border-left: 4px solid #E3E3E3;
		border-top: 1px solid #E3E3E3;
		color: #424242;
		font-size: .9em;
		}
	#fond_de_page a{
		color : #987654;
		}

	#content img.img_left{
		display: block;
		clear: right;
		}
	#content img.img_right{
		display: block;
		clear: both;
		margin-right: 200px;
		}

	#content #message{
		display : block;
		width: 50%;
		margin: auto;
		margin-top: 35px;
		padding: 15px;
		border: 1px solid #424242;
		text-align: left;
		}

/* two column display */

h2.top{
	margin-bottom: 0px;
	border-bottom: 1px solid #D3D3D3;
	}

#content.twocol{
	padding: 0px;
	overflow: auto;
	}

.content-left, .content-right{
	padding: 10px;
	padding-right: 20px;
	min-height: 430px;
	float: right;
	overflow: auto;
	}

.content-left{
 	width: 145px;	
	border-left: 1px solid #D3D3D3;
	}

.content-left ul, li{
	/*padding-left: 2px;*/
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	}
.content-left ul{
	padding: 0px;
	border-top: 1px solid lightgrey;
	overflow: hidden;
	}
.content-left li{
	/*list-style-type: circle;*/
	list-style-type: none;
	border-bottom: 1px solid lightgrey;
	margin: 0px;
	padding: 0px;
	text-align: left;
	}
.content-left li a{
	display: block;
	color: #606060;
	height: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 9px;
	margin-top: 2px;
	margin-bottom: 2px;
	}

.content-left li b{
	text-align: center;
	}
.content-left li a:hover {
	background-color: #d1c8b1;/* #ae9f7e;*/
	}

.content-left a.tweets{
	text-align: left;
	font-size: 0.9em;
	}

.content-right{
	width: 550px; ;
	}

.content-right h3, .event_item h3{
	border: none;
	margin: 2px 0px;
	padding: 2px;
	line-height: 1.2em;
	font-variant: normal;
	font-size: 1.1em;
	}

.event_item{
	width: 90%;
	border: 1px solid #D3D3D3;
	padding: 10px;
	margin: 2px;
	line-height: 1.5em;
	}

.event_item .label{
	float: left;
	clear: left;
	width: 5em;
	}

.event_date{
	margin-left: 10px;
	line-height: 1.2em;
	font-size: .9em;
	}

.event_img{
	float: right;
	border: 1px solid #D3D3D3;
	width: 64px;
	height: 64px;
	margin-left : 10px;
	margin-right: 20px;
	padding: 2px;
	}

.event_img img{
	border: none;
	}

/* la page d'accueil */
#index_top{
	margin: auto;
	border-top: 1px solid #D3D3D3;
	border-bottom: 1px solid #D3D3D3;
	overflow: auto;
	line-height: 1.2em;
	}

#index_top .strong{
	font-variant: small-caps;
	margin-bottom: 5px;
	}

#index_top .adresse{
	display: block;
	padding-left: 5px;
	border-left: 2px solid #D3D3D3;
	margin-bottom: 5px;
	}

	/*Le bloc contenant l'agenda */	
	#index_agenda{
		width: 30%;
		color: #424242;
		margin-left: 3px;
		float: left;
		padding: 10px;
		}

	/*flash news */
	#flash_news{
		/* display : none;*/
		padding: 0px;
		padding-top: 5px;
		width: 290px;
		float: left;
		/*height: 60px;*/
		/*-moz-border-radius: 6px;*/
		}
		#flash_news p{
			margin: 0;
			padding: 2px;
			text-align: right;
			}

		#flash_news a{
			color: white;
			text-decoration: underline;
			}

		#flash_news .strong{
			display: block;
			border-bottom: 1px solid black;
			}


	#flash_top, #flash_bottom{
		padding: 0px 10px;
		height: 9px;
		}

	#flash_top{
		background-image: url('./img/top_hot_news.png'); 
	 	background-repeat: no-repeat;	
		}

	#flash_bottom{
		background-image: url('./img/bottom_hot_news.png'); 
	 	background-repeat: no-repeat;	
		background-position: bottom center;
		}

	#flash_body{
		padding: 0px 15px;
		background-color: #BB20C0;
		background-image: url('./img/body_hot_news.png'); 
	 	background-repeat: repeat-x;	
		}

	/*Le bloc contenant les news */
	
	#index_news{
		padding: 10px;
		color: #424242;
		margin-left: 3px ;
		width: 30%; 
		float: left;
		}
	#index_news a, #index_agenda a{
		color: #ae9f7e;
		}

	#index_news ul, #index_agenda ul{ 
		margin: 0px;
		padding: 0px;
		}

	#index_news li, #index_agenda li{
		margin: 0px;
		padding: 0px;
		padding-left: 5px;
		}

	/*Le bloc contenant l'adresse */
	#index_infos{
		padding: 10px;
		color: #424242;
		margin-left: 10px;
		width: 200px; 
		float: left;
		}

	#index_infos a{
		color: #ae9f7e;
		}

/* la page contact */

	fieldset#email{
		float: left;
		}

	form.contact{
		margin : auto;
		}
	
	form.contact fieldset{
		margin: auto;
		width: 600px;
		}

	form.contact .submit{
		float: none;
		margin: auto;
		display: block;
		width: 620px;
		}

	form.contact textarea{
		width: 300px;
		height: 200px;
		padding: 0px;
		border: 1px solid #424242; 
		background-color: #F0F0F0;
		}

	#adresse, #horaires{
		line-height: 1.4em;
		margin-left: 20px;
		padding-top: 20px;
		padding-left: 10px;
		width: 90%;
		}
		#adresse p, #horaires p{
		text-indent: 0px;
		padding: 5px;
		}
	

/* la partie news */

	.news{
		/*la boite contenant la news */
		margin: 5px;
		margin-left: 30px;
		width: 80%;
		}

	.news small{
		margin-left: 10px;
		}
	
	.news small a{
		color : #ae9f7e;
		}

	.news h3{
		border : none;	
		margin: 0; 
		padding: 0px;
		padding-top : 5px;
		padding-bottom : 2px;
		font-weight: 300;
		font-size: 1.2em;
		color: #424242;
		}
	.news h3 a {
		text-decoration: none;	
		font-variant: small-caps;
		font-family: "Trebuchet MS", verdana, arial, "Sans serif";
		color: #ae9f7e;
		/*color: #424242;*/
		padding-left: 30px;
		margin-right: 20px;
		background-image: url(./img/cup_gray.png);
		background-position: 2px -39px; 
		background-repeat: no-repeat;
		}
	/*.news h3 a:hover {
		background-position:2px 1px;
		color: #8dd5d1;
		}*/

	.news img.img_center{
		display: block;
		float: none;
		margin : auto;
		}
	.date_box{
		/* la boite contenant la date */
		color: #424242;
		display : block;
		padding: 2px;
		padding-left : 10px;
		border-bottom: 1px solid #E3E3E3;
		border-top: 1px solid #E3E3E3;
		margin: 10px;
		font-size: .9em;
		font-style: italic;
		}

	.right_from_the_date{
		display : block;
		float: right;
		font-style: normal;
		}
	.right_from_the_date a{
		color : #424242;
		}
	
	.subtitle{
		font-size: .9em;
		padding-left: 30px;
		color :#424242;
		}
	.chapo, .body_text{
		/*margin-left: 30px;*/
		line-height: 1.5em;
		}

/* La partie Administration */

#content.admin{
	border-right : 2px solid #D3D3D3;
	float: right;
	width: 600px;
	}

#content.admin img.preview{
	display: block;
	margin: auto;
	}

.info_session{
	text-align: right;
	padding-top: 5px;
	padding-right: 10px;
	margin-top: 10px;
	clear: left;
	}
	.info_session .button{
		font-family: "courier news", courier;
		font-size: 14px;
		}
/* All about forms */

form.form_hot textarea{
	width: 60%;
	height: 50px;
	}

form.form_hot #text{
	padding: 0px;
	margin: 5px;
	}

form.form_news textarea{
	width: 80%;
	overflow: auto;
	}
	form.form_news fieldset.text_flds label{
		width: 15%;
		}
	form.form_news #text{
		padding: 0px;
		}

	#chapo{
		height: 55px;
		}

#right_menu{
	float: right;
	width: 150px;
	margin-left: 10px;
	padding-top: 12px;
	overflow: hidden;
	}
	#right_menu ul, li{
		padding: 3px;
		margin: 2px;
		list-style-type: none;
		}

	#right_menu .img_list{
		text-align: center;
		background-color: #D3D3D3;
		height: 300px;
		width: 130px;
		overflow: scroll;
		}

#ErrorMsg{
	width: 500px;
	border: 1px dashed red;
	padding: 10px;
	margin-left: 50px;
	margin-bottom: 20px;
	clear: both;
	}

img.compo{
	width: 780px;
	margin-left: 0px;
        margin-top: 5px;
	margin-bottom: 5px;
	}
	
small.legend{
	margin: 0px 3px;
	padding: 0px;
	}

/* help pages */

table.help td{
	text-align: left;
	font-family : Verdana;
	}

/* Generic Form definition */

form fieldset{
	width: 500px;
	margin-left: 50px;
	}
	form fieldset legend{
		font-family : "Trebuchet MS", Helvetica, Verdana;
		}

form label{
	float: left;
	clear: left;
	display: inline;
	width: 150px;
	text-align: right;
	margin-right: 5px;
	font-weight: bold;
	}
	form label.error{
		color: red;
		}

form input{
	background-color: #E7E7E7;
	border: 1px solid #464646;
	margin-bottom: 5px;
	}
form .submit{
	float: left;
	margin-left: 70px;
	margin-top: 15px;
	clear: both;
	}

form textarea{
	width: 400px;
	height: 300px;
	}

fieldset textarea{
	width: 325px;
	border: 1px solid #424242;
	}

form .textarea{
	display : block;
	float: left;
	clear: right;
	border-left : 2px solid #D3D3D3;
	border-bottom : 1px solid #D3D3D3;
	padding-left: 10px;
	width: 400px;
	padding-bottom : 5px;
	margin-top: 5px;
	}

form small{
	display: block;
	text-align :right;
	margin-right: 80px;
	margin-top : 3px;
	color: #424242;
	font-size: .9em;
	}

form .formspan{
	}

.new_page label{
	display: none;
	}
.new_page textarea{
	margin-left: 20px;
	width:90%;
	}


/*specificity for agenda forms */

fieldset#fd01{
	float: left;
	width: 220px;
	margin-right: 0;
	}

fieldset#fd01 input{
	width : 90px;
	}
fieldset#fd01 label{
	width : 105px;
	}

fieldset#fd02{
	margin-left: 40px;
	float: left;
	width: 220px;
	}

fieldset#fd02 input{
	width : 90px;
	}
fieldset#fd02 label{
	width : 105px;
	}

fieldset#fd03 label{
	width: 105px;;
	}
fieldset#fd03 textarea{
	width: 380px;
	}  

fieldset#fd03 input#title{
	width: 380px;
	}

/* Summary of events */
table.summary th{
	font-size: 1em;
	padding: 3px;
	}

tr.past td.color{
	color: darkred;
	}

tr.running td.color{
        color: green;
	}

tr.runnning td.nostyle{
	color: black;
	}

/* Calendar */
table.calendar{
	/* Correction bug IE 
	width: inherit;
	-- 	*/
	width: 145px;
	margin: 0px;
	padding: 0px;
	}
table.calendar td, th{
	font-size: 0.8em;
	padding: 1px;
	
	background-color: #FFFFFF;
	}

table.calendar td.busy{
	background-color: #8dd5d1;
	}

table.calendar td.busyToday{
	background-color: #8dd5d1;
	border: 1px solid #424242;
	}

table.calendar td.Today{
	border: 1px solid black;
	}

table.calendar td.today{
	border: 1px solid black;
	}

table.calendar td a.date{
	color: red;
	}

/* displaying an event */

#event_header, #event_body, #event_footer{
	border: 1px solid #D3D3D3;
	width: 90%;
	margin: auto;
	margin-bottom: 10px;
	padding: 10px;
	overflow: hidden;
	}

.event_header_img{
	float: right;
	border: 1px solid #D3D3D3;
	padding: 2px;
	background-color: #FFFFFF;	
	}

.event_header_img img{
	border: none;
	padding: 0px;
	margin: 0px;
	}

#event_header h2{
	margin-top: 0px;
	}

#event_body p{
	line-height: 1.5em;
	}

span.label{
	float: left;
	font-weight: bold;
	text-align: right;
	clear: right;
	clear: left;
	width: 70px;
	padding-right : 5px;
	color: #424242;
	}

/* Vignettes  */

.vignette{
	float: left;
	clear: right;
	/*width: 150px;*/
	background-color: #F1F1F1;
	margin: 5px 10px 5px 0;
	border: 1px solid gray;
	padding: 5px;
	text-align: center;
	-moz-border-radius : 5px;
	}

.vignette img{
	border: 1px solid black;
	}

fieldset.upl_vig{
	clear: left;
	}

#liste_vignettes{
	width: 90%;
	padding: 10px;
	border-color: #D3D3D3;
	}

/* bottom of the page */

#footer{
	height: 20px;
	width: 100%;
	padding-top: 5px;
	text-align : center;
	font-size: .9em;
	clear: left;
	}
	
	#footer .private{
		float: right;
		margin-right: 10px;
		}
		#footer .private a{
			color: #D3D3D3;
			}
		#footer .private a:hover{
			color: #424242;
			}

.ponebague{
	float: left;
	text-align: left;
	margin-left: 10px;
	}

	.ponebague a {
		color: #3B5998;
		}