/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

== Infos Structure: ========================
* Nom du fichier: 		style.css
* Version: 				1.1.0 (30/07/2008)
* Auteur: 				Cédric BOISSEAU
* Société : 			Créamotion [ http://www.creamotion.com ]


== Info site: ==============================
* Site web: 			http://www.cheveau.com/
* Fluide[ ] | Fixe[x]
* Largeur de la page: 	990 px
* Nombre de colonnes: 	2


== Structure à respecter: ==================
* xxx-top
* xxx-middle
* xxx-bottom

* xxx-left
* xxx-center
* xxx-right

/!\ Sauf structure principale :
* header
* center(menu-gauche | content)
* footer

== Outils utiles: ==========================
* http://lab.xms.pl/css-generator/ (générateur de CSS à partir d'un fichier XHTML)
* http://www.blog-and-blues.org/weblog/2004/05/24/214-font-size-em (en cas de problème avec les em)
http://www.eclaireur.net/technique/25-techniques-css-pour-ne-pas-avoir-a-reinventer-la-roue-partie-1/ (techniques CSS - menus, formulaires, tableaux ...)

== Parties: ================================
* Règles générales
* Connexion
* Fil d'Ariane
* Formulaires
* Pagination
* Tableaux
* Structure
* Boite type

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
									  /*********************/
									 /* Règles générales **/
/*********************************************************/
/*
# Couleur 1 : vert	: #6a8c21
# Couleur 2 : rouge	: #A2003C
# Couleur 3 : gris	: #837D76
*/

									  /*********************/
									 /* Règles générales **/
/*********************************************************/
body{
	background: 				#6a8c21 url(../_images/bg.png) top repeat-x;
	color:						#000;
	font-family:				verdana, sans-serif;
	font-size:					62.5%;
}
*{
	margin:						0px;
	padding:					0px;
	outline:					none;
	/*behavior: 					url(iepngfix.htc);*/

}
img{
	border:						0px;
}
.clear{
	clear:						both;
}

/* Titres */
h1{}
h2{}
h3{display:none;}
h4{}
h5{}
h6{}

/* Paragraphes */
p{
	background-color: 			inherit;
	color:						#000;
	line-height:				1.8em;
	padding:					10px;
}

/* Liens */
a{
	background-color: 			inherit;
	color:						#2e507b;
	text-decoration:			underline;
}
a:hover{
	background-color: 			inherit;
	color:						#000;
	text-decoration:			underline;
}
a:visited{
	background-color: 			inherit;
	color:						#999;
	text-decoration:			underline;
}

/* Listes non ordonnées*/
ul{
	list-style: 				none inside none;
					
	/*margin:						10px 0;
	padding:					0 0 0 50px;*/
}
#content #article-middle ul li{
	color:						#333333;
	background: 				url(../_images/puce-programme.gif) no-repeat left center;
	line-height: 				2em;
	padding-left:				20px;	
}

/* Listes ordonnées*/
ol{
	list-style: 				decimal-leading-zero outside none;
	margin:						10px 0;
	padding:					0 0 0 50px;
}

/* balises Diverses */
abbr{
	cursor:						help;
}/*abréviations lue lettre par lettre*/
acronym{
	cursor:						help;
}/*abréviation lue comme un mot*/
big{}/*texte de taille supérieure*/
cite{}/*citations*/
code{}/*code*/
small{}/*texte de taille inférieure*/




											 /**************/
										 	/* Connexion **/
/*********************************************************/
/*#connexion{
	height:						.px;
	left:						.px;
	position:					relative;
	top:						.px;
	width:						.px;
}*/
										  /*****************/
										 /* Fil d'Ariane **/
/*********************************************************/
#ariane{
	color:						#837d76;
	font-size: 					0.9em;
	height:						24px;
	line-height: 				24px;
	padding:					0 0 0 10px;
	width:						543px;/*553-10*/
	overflow: hidden;
}
#ariane ul.filAriane{
	list-style:					none outside none;
	display:					inline;
	padding:					0;
}
#ariane ul.filAriane li{
	display:					inline;
	padding:					0 0 0 2px;
}
#ariane ul.filAriane li a{
	background: 				url(../_images/ariane-separator.gif) no-repeat right 5px;
	padding:					0 13px 0 2px;
}

#ariane a{
	background-color: 			inherit;
	color:						#837d76;
	text-decoration: 			underline;
}
#ariane form{
	display:inline;
}
#ariane a:hover{
	background-color: 			inherit;
	color:						#A2003C;
	text-decoration: 			underline;
}
										   /****************/
										  /* Formulaires **/
/*********************************************************/
/*form{
	width:						500px;
}
form p{
	margin:						2px 0;
	padding:					0;
}*/

fieldset{
	border:						none;
	padding:					2%;
	font-weight: 				bold;
}
fieldset table{
	width:						100%;
}
fieldset table tr td{
	border-bottom:				1px dotted #bfa995;
	background-color: 			#f4f0e7;
	padding:					5px;
}
legend{
	padding:					0 0 0 100px;
}
/*label{
	background-color:			#eee;
	color:						#000;
	display:					block;
	width:						45%;
	float:						left;
	margin-right: 				1%;
	padding-right:				1%;
	text-align:					right;
}
input.checkbox{}
input.radio{}
input.text{
	padding:					1px;
	width:						50%;
}
input.password{
	padding:					2px;
	width:						50%;
}
input.submit,
input.button,
input.reset{
	cursor: 					pointer;
}
textarea{}
*/


											/***************/
										   /* Pagination **/
/*********************************************************/
.pagination{
	border-top:					1px dotted #ddd;
    height:						30px;
    float:						left;
    margin:						0 9px 0 0;
    padding:					5px 0 10px 0;
    /*width:						.px;*/
}
.pagination *{
	display:					block;
    float:						left;
    font-weight: 				bold;
    margin:						0 0 0 2px;
    padding:					3px;
    text-decoration: 			none;
}
.pagination a{
	background-color: 			#ffffff;
    border:						#386296 1px solid;
    color:						#4976ad;
    text-decoration: 			none;
}
.pagination a:hover{
    background-color:			#4976ad;
    border:						#386296 1px solid;
	color:						#fff;
}
.pagination  span.selected {
    background-color: 			#4976ad;
	border:						#386296 1px solid;
    color:						#fff;
}
.pagination .etc{
    background-color: 			#ffffff;
	border:						#4976ad 1px solid;
    color:						#ccc;
    cursor:						default;
}
											  /*************/
											 /* Tableaux **/
/*********************************************************/
table{}
th{}
tr{}
td{}
											 /**************/
											/* Structure **/
/*********************************************************/
#main{
	background: 				url(../_images/bg-main.jpg) repeat-y;
	/*font-size: 					1.2em;*/
	margin:						0 auto;
	width:						990px;
}
	#colonne-1{
		float:					left;
		font-size: 				1.2em;
		width:					396px;
	}
		#logo span{
			display:			none;
		}
		#logo a{
			background: 		url(../_images/logo.jpg) no-repeat;
			display:			block;
			height:				77px;
			width:				396px;
		}
		#composition{
			background: 		url(../_images/composition.jpg) no-repeat;
			height:				461px;
			width:				396px;
		}
		#recherche{
			background: 		url(../_images/recherche.png) no-repeat;
			color:				#fff;
			font-weight: 		bold;
			height:				34px;
			line-height: 		34px;
			margin-left:		27px;
			padding-left:		20px;
			width:				335px;/*355-20*/
		}
		#recherche form{
				color:			#fff;
				height:			34px;
			}
			#recherche label{
				float:			left;
			}
			#recherche .input{
				background-color:	transparent;
				border:				0;
				color:				#000;
				display:			block;
				float:				left;
				height:				24px;
				margin:				10px 0 0 15px;
				padding: 			0 0 0 0;
				width:				175px;
			}
			#recherche .button{
				background-color:	transparent;
				border:				0;
				color:				#7b4d2e;
				cursor: 			pointer;
				display:			inline;
				float:				left;
				font-size: 			0.9em;
				font-weight: 		bold;
				height:				24px;
				margin:				6px 0 0 8px;
				/*position: 			relative;
				top:				5px;*/
				width:				50px;
			}
		#infos{
			background: 		#fff url(../_images/infos.png) bottom center no-repeat;
			color:				#000;
			margin:				0 0 20px 27px;
			text-align:			center;
			padding: 			0 0 4px 0;
			width:				355px;
		}
		#infos h4{
			color:				#A2003C;
			font-size: 			1.2em;
			font-variant: 		small-caps;
			text-align: 		left;
			text-indent: 		20px;
			padding: 			10px 0 0 0;
		}
		#infos p{
			font-size: 			0.9em;
			text-align: 		center;
		}
	#colonne-2{
		float:					left;
		width:					594px;
	}
		#menu{
	  		background: 		url(../_images/menu.jpg) no-repeat;
			height:				71px;
			width:				594px;

	  	}
			#menu ul li{
				list-style: 		none outside;
				float:				left;
				margin-left: 		10px;
			}
			#menu ul li a{
				color:				#796f67;
				display:			block;
				float:				left;
				font-size: 			9px;
				font-weight: 		bold;
				height:				41px;
				line-height:		41px;
				margin: 			0 0 0 1px;
				padding: 			0 5px 0 0;
				text-decoration:	none;
				/*text-transform: 	uppercase;*/
			}
			#menu ul li a span{
				float:				left;
				font-size: 			1px;
				width:				5px;
			}
			#menu ul li a.selected, #menu ul li a:hover{
				background: 		url(../_images/menu-right.gif) center right no-repeat;
				color:				#fff;
			}
			#menu ul li a.selected span,#menu ul li a:hover span{
				background: 		url(../_images/menu-left.gif) center left no-repeat;
			}
			#menu ul li a.selected{
				cursor: 			default;
			}
			#menu ul ul{
				/*position: 			absolute;
				top:				33px;*/
				display:			none;
			
			}
			/*#menu ul ul li a span,#menu ul ul li a.selected span,#menu ul ul li a:hover span{
				background: 		none;
			}
			#menu ul ul li a{
				background-color: 	#000;
				background: 		none;
				color:				#000;
				display: 			block;
				font-size:			0.9em;
				float: 				left;
				margin:				0;
				padding:			0;
				text-transform: 	inherit;
				position:			relative;
				top:				100%;
			}
			#menu ul ul li a:hover, #menu ul ul li a.selected{
				background: 		none;
				display: 			block;
				float: 				left;
				margin:				0;
				padding:			0;
				text-decoration: 	underline;
			}

			#menu ul ul li{
				display: 			none;
			}
			#menu ul li:hover ul li {
				display: 			block;
			}*/

	  	#content{
	  		background: 	url(../_images/bg-content.png) top right no-repeat;
	  		padding-left:	14px;
	  		width:			580px;/*594 - 14*/
	  		/*padding-top:	10px;*/
		}
			#langue{
		  		background: 		url(../_images/langue.png) no-repeat;
				height:				18px;/*23-5*/
				margin-left: 		414px;
				padding:			5px 0 0 0;
				text-align: 		center;
				width:				128px;
		  	}
		  	#langue a{
		  		color:				#999;
		  		padding:			0 5px;
				text-decoration: 	none;
			}
			#langue a:hover{
		  		color:				#999;
				text-decoration: 	none;
			}
			#langue a.selected{
		  		color:				#000;
		  		cursor: 			default;
				text-decoration: 	none;
			}
			#content #article-top{
				background: 	url(../_images/article.png) top center no-repeat;
		  		height:			53px;
		  		width:			553px;
			}
			#content #article-top h1{
				background-color: inherit;
				color:			#fff;
				font-size: 		1.6em;
				font-weight: 	bold;
				height:			29px;
				line-height: 	29px;
				padding-left:	10px;
			}
			#content #article-middle{
				background:		#fff;
				padding:		10px;
				width:			533px;/*553-10*/
			}
			#content #article-middle h2{
				background-color: inherit;
				color:			#a2003c;
				font-size: 		1.4em;
				font-weight: 	bold;
				padding-top:	10px;
			}
			#content #article-middle h2 a{
				background-color: inherit;
				color:			#a2003c;
				font-weight: 	bold;
			}
			#content #article-middle h2 a:hover{
				color:			#000;
			}
			#content #article-middle p{
				font-size:		1.1em;
				padding:		10px 0 10px 5px;
				/*margin:			15px 15px 25px 10px;
				border-top:	1px dotted #ddd;
				border-bottom:	1px dotted #ddd;*/
			}
			#content #article-bottom{
				background: 		url(../_images/article-bottom.png) no-repeat;
				height:				4px;
				width:				553px;
			}

#footer{
	background: 				#6a8c21 url(../_images/footer.jpg) top no-repeat;
	height:						5px;
	padding-bottom: 			15px;
	width:						990px;
}
											/***************/
										   /* Balises CMS**/
/*********************************************************/
#loading-mask {
	color:						#D85909;
	font-size:					1.1em;
	font-weight:				bold;
	/*opacity:					0.8;*/
	position:					absolute;
	text-align:					center;
	z-index:					500;
}

#loading-mask .loader {
	background:					#fff4e9 none repeat scroll 0%;
	border:						2px solid #F1AF73;
	color:						#d85909;
	font-weight:				bold;
	left:						50%;
	margin-left:				-140px;
	padding:					15px 60px;
	position:					fixed;
	text-align:					center;
	top:						45%;
	width:						160px;
	z-index:					1000;
}

.highlight_word{
	font-weight:				bold;
	font-style:					italic;
	text-decoration:			underline;
}

.error {
 	border:						1px solid red;
	background-color:			#fff;
	color:						#660000;
	padding:					5px;
	margin:						0 5px;
}

.error h3{
	padding-bottom:				5px;
	text-decoration:			underline;
}

.error ul{
	padding-left:				20px;
}

.error ul li{
	/*font-weight:				bold;*/
}

.notify {
	border:						1px solid #336699;
	background-color:			#fff;
	color:						#336699;
	padding:					5px;
}

.notify h3{
	display:block;
}

.lastname,
.hidden{
	display:					none;
}

blockquote {
	margin:						16px;
    padding:					8px;
    background-color:			silver;
}

address{
	display:					inline;
}

/*styles*/
.bord-haut{
	border-top:		1px dotted #ddd;
	margin-top:		10px;	
}
.bord-bas{
	border-bottom:	1px dotted #ddd;
	margin-bottom:	10px;
}
.bord-gauche{
	border-left:	1px dotted #ddd;
}
.bord-droit{
	border-right:	1px dotted #ddd;
}
.image-bord{
	border:			1px solid #edeae3;
	padding:		4px;
	background-color: #f7f3ea;
}
.couleur-marron{
	color:			#7b4d2e;/*marron*/
}
.couleur-vert{
	color:			#6b8e21;/*vert*/
}
.couleur-rouge{
	color:			#a2003c;/*rouge*/
}
.couleur-bleu{
	color:			#2e507b;/*bleu*/
}
.paragraphe-indent{
	text-indent:	1.5em;
}
.interligne-10{
	line-height: 1em;
}
.interligne-15{
	line-height: 1.5em;
}
.interligne-20{
	line-height: 2em;
}
.interligne-25{
	line-height: 2.5em;
}
tr.tableau-image td{
	border-left:	1px solid #f4f0e7;
	border-right:	1px solid #f4f0e7;
	border-top:		1px solid #f4f0e7;
}
tr.tableau-titre td{
	border-left:	1px solid #f4f0e7;
	border-right:	1px solid #f4f0e7;
	border-bottom:	1px solid #f4f0e7;
}
table tr td{
	padding:	5px;	
}

											/***************/
										   /* Boite type **/
/*********************************************************/
/*.xxx-top{
	background-image:			url(../_images/xxx-top.png);
	background-repeat:			no-repeat;
	color:						#.;
	height:						.px;
	line-height:				.px;
	text-align:					center;
	width:						.px;
}
.xxx-middle{
	background-image:			url(../_images/xxx-middle.png);
	background-repeat:			repeat-y;
	color:						#.;
	height:						.px;
	line-height:				.px;
	text-align:					center;
	width:						.px;
}
.xxx-bottom{
	background-image:			url(../_images/xxx-bottom.png);
	background-repeat:			no-repeat;
	color:						#.;
	height:						.px;
	line-height:				.px;
	text-align:					center;
	width:						.px;
}*/