/****************************************************/
/******************** FORMULAIRE ********************/
/****************************************************/

.cs-form-abstract,
.cs-form-abstract *:not(.ui-multiselect),
.ui-widget:not(.ui-multiselect) {
	box-sizing:content-box;
	-moz-box-sizing:content-box;
}
 
.cs-form-abstract {
	margin: 0;
	line-height: 18px;
}

/****************************************************/
/********************* FIELDSET *********************/
/****************************************************/
	
.cs-form-abstract fieldset {
	background: #fff;
/* 	background: -webkit-linear-gradient(left, #D7D7D7, #FFF) repeat scroll 0 0 transparent;
   background: -moz-linear-gradient(left, #D7D7D7, #FFF) repeat scroll 0 0 transparent;
	background: -ms-linear-gradient(left, #D7D7D7, #FFF) repeat scroll 0 0 transparent;
	 background: -o-linear-gradient(left, #D7D7D7, #FFF) repeat scroll 0 0 transparent;
	background: linear-gradient(to right, #D7D7D7, #FFF) repeat scroll 0 0 transparent; */
	border: 1px solid #AAA;
	/* border-radius: 8px; */
	margin: 11px 0 25px;
	padding: 20px 10px 10px;
}
.cs-form-abstract fieldset:last-child {
	margin-bottom: 15px;
}
	.cs-form-abstract legend {
		background: #eee;
		/* background: -webkit-linear-gradient(#FFF, #D7D7D7) repeat scroll 0 0 transparent;
		   background: -moz-linear-gradient(#FFF, #D7D7D7) repeat scroll 0 0 transparent;
			background: -ms-linear-gradient(#FFF, #D7D7D7) repeat scroll 0 0 transparent;
			 background: -o-linear-gradient(#FFF, #D7D7D7) repeat scroll 0 0 transparent;
				background: linear-gradient(#FFF, #D7D7D7) repeat scroll 0 0 transparent; */
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#D7D7D7', GradientType=0); /* IE 9- */
		float: left; /* Nécessaire pour corriger un bug sur le border-radius sous IE 10- */
		border: 1px solid #AAA;
		border-radius: 6px;
		/* box-shadow: 0 0 15px #AAA; */
		font-weight: bold;
		margin: -32px 0 0; /* 32 = padding-top du fieldset + moitié de la hauteur de la légende */
		padding: 2px 10px;
	}
	.cs-form-abstract legend + * {
		clear: left;
	}
	


/****************************************************/
/************** ÉLÉMENTS DE FORMULAIRE **************/
/****************************************************/

.cs-form-element {
	clear: both;
	margin: 6px 0;
	position: relative;
}
.cs-form-element:first-child {
	margin-top: 0;
}
.cs-form-element:last-child {
	margin-bottom: 0;
}
	.cs-form-element:before,
	.cs-form-element:after {
		content: ' ';
		display: table;
	}
	.cs-form-element:after {
		clear: both;
	}
	
	.cs-form-abstract label,
	.cs-form-abstract input,
	.cs-form-abstract button,
	.cs-form-abstract select,
	.cs-form-abstract textarea {
	  font-weight: normal;
	}
	
	.cs-form-abstract select,
	.cs-form-abstract textarea,
	.cs-form-abstract input[type="text"],
	.cs-form-abstract input[type="password"],
	.cs-form-abstract input[type="datetime"],
	.cs-form-abstract input[type="datetime-local"],
	.cs-form-abstract input[type="date"],
	.cs-form-abstract input[type="month"],
	.cs-form-abstract input[type="time"],
	.cs-form-abstract input[type="week"],
	.cs-form-abstract input[type="number"],
	.cs-form-abstract input[type="email"],
	.cs-form-abstract input[type="url"],
	.cs-form-abstract input[type="search"],
	.cs-form-abstract input[type="tel"],
	.cs-form-abstract input[type="color"],
	.cs-form-abstract .uneditable-input {
		border-radius: 6px;
		color: #555;
		display: inline-block;
		height: 15px;
		line-height: 15px;
		padding: 4px 6px;
		vertical-align: middle;
		-moz-user-select: text;
	    -webkit-user-select: text;
	    -ms-user-select: text;
	    user-select: text;
	}
	
	.cs-form-abstract textarea,
	.cs-form-abstract input[type="text"],
	.cs-form-abstract input[type="password"],
	.cs-form-abstract input[type="datetime"],
	.cs-form-abstract input[type="datetime-local"],
	.cs-form-abstract input[type="date"],
	.cs-form-abstract input[type="month"],
	.cs-form-abstract input[type="time"],
	.cs-form-abstract input[type="week"],
	.cs-form-abstract input[type="number"],
	.cs-form-abstract input[type="email"],
	.cs-form-abstract input[type="url"],
	.cs-form-abstract input[type="search"],
	.cs-form-abstract input[type="tel"],
	.cs-form-abstract input[type="color"],
	.cs-form-abstract .uneditable-input {
		background: #FFF;
		background: -webkit-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
		   background: -moz-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
			background: -ms-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
			 background: -o-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
				background: linear-gradient(#FFF, #EEE 1px, #FFF 15px);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EEEEEE', endColorstr='#FFFFFF',GradientType=0); /* IE 9- */
		border: 1px solid #CCC;
		box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
		-webkit-transition: border linear 0.4s, box-shadow linear 0.4s;
		   -moz-transition: border linear 0.4s, box-shadow linear 0.4s;
			 -o-transition: border linear 0.4s, box-shadow linear 0.4s;
				transition: border linear 0.4s, box-shadow linear 0.4s;
	}
		.cs-form-abstract textarea:focus,
		.cs-form-abstract input[type="text"]:focus,
		.cs-form-abstract input[type="password"]:focus,
		.cs-form-abstract input[type="datetime"]:focus,
		.cs-form-abstract input[type="datetime-local"]:focus,
		.cs-form-abstract input[type="date"]:focus,
		.cs-form-abstract input[type="month"]:focus,
		.cs-form-abstract input[type="time"]:focus,
		.cs-form-abstract input[type="week"]:focus,
		.cs-form-abstract input[type="number"]:focus,
		.cs-form-abstract input[type="email"]:focus,
		.cs-form-abstract input[type="url"]:focus,
		.cs-form-abstract input[type="search"]:focus,
		.cs-form-abstract input[type="tel"]:focus,
		.cs-form-abstract input[type="color"]:focus,
		.cs-form-abstract .uneditable-input:focus,
		.cs-form-abstract .ui-multiselect.ui-state-active {
			border-color: rgba(82, 168, 236, 0.8);
			box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
			outline: 0;
			outline: thin dotted \9; /* IE9- */
		}
	
	.cs-form-abstract label {
		cursor: pointer;
	}
	.cs-form-element > label {
		display: block;
		float: left;
		line-height: 24px;
		margin: 0 5px 0 0;
		text-align: right;
		width: 130px;
	}
	
	.cs-form-abstract input,
	.cs-form-abstract textarea,
	.cs-form-abstract .uneditable-input {
		/* ATTENTION : en cas de modification, penser à modifier l'attribut "width"
		   du sélecteur ".cs-form-abstract select" ci-dessous. */
		width: 200px;
	}

	.cs-form-abstract textarea {
	  height: auto;
	  resize : vertical;
	}
	
	.cs-form-abstract input[type="file"],
	.cs-form-abstract input[type="image"],
	.cs-form-abstract input[type="submit"],
	.cs-form-abstract input[type="reset"],
	.cs-form-abstract input[type="button"],
	.cs-form-abstract input[type="radio"],
	.cs-form-abstract input[type="checkbox"] {
		/* border-width: 1px; */
		width: auto;
	}
		.cs-form-abstract select:focus,
		.cs-form-abstract input[type="file"]:focus,
		.cs-form-abstract input[type="radio"]:focus,
		.cs-form-abstract input[type="checkbox"]:focus {
			outline: thin dotted #333;
			outline: 5px auto -webkit-focus-ring-color;
			outline-offset: -2px;
		}
	
	
	/* ##### AUTOCOMPLETE ##### */
	
	.cs-form-abstract input.ui-autocomplete-loading {
		background: url(../../images/cs-form-loader.gif) right 4px; 
	 	background: url(../../images/cs-form-loader.gif) right 4px, -webkit-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/cs-form-loader.gif) right 4px,    -moz-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/cs-form-loader.gif) right 4px,	    -ms-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/cs-form-loader.gif) right 4px,	     -o-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/cs-form-loader.gif) right 4px,		    linear-gradient(#FFF, #EEE 1px, #FFF 15px);
		background-repeat: no-repeat;
	}
	
	
	/* ##### INPUT RADIO & CHECKBOX ##### */
	
	.cs-form-element.buttonset input {
		display: none;
	}
	
	.cs-form-abstract .element-radio {
		float: left;
		padding: 4px 0 0 0;
	}
		.cs-form-abstract .element-radio label {
			line-height: 17px;
			text-align: left;	
			float: left;
			clear: left;
		}
		.cs-form-abstract .cs-form-element .element-radio.ui-buttonset label {
			float: none;
			clear:none;
		}

		.cs-form-abstract input[type="radio"],
		.cs-form-abstract input[type="checkbox"] {
			border: 0; /* Pour IE */
			cursor: pointer;
			float: left;
			line-height: normal;
			position: relative;
		}
		.cs-form-abstract input[type="radio"] {
			margin: 0 5px 0 0;
			position: relative;
			top: 1px;
			top: 2px \9;
			vertical-align: baseline;
		}
		.cs-form-abstract input[type="checkbox"] {
			margin: 6px 6px 6px 0;
			top: 1px \9;
			vertical-align: sub;
		}
		
		/** Gestions des CHECKBOX avec label en APPEND **/
		.cs-form-abstract .append input[type="checkbox"] {
			margin-left: 135px;
			margin-right: 1px;
		}
		.cs-form-abstract .append label {
			margin-left: 5px; /* = margin-right de .cs-form-element > label */
			margin-right: 0;
			text-align: left;
			width: auto;
		}
	
	
	/* ##### SELECT ##### */
	
	.cs-form-abstract select {
		width: 188px; /* Explications dans le fichier "/FW2.0/CS/_www/css/form/plugins/jquery.multiselect.cs.css" sur le pourquoi de cette valeur */
	}
	
	.cs-form-abstract select[multiple],
	.cs-form-abstract select[size] {
		height: auto;
	}
	
	/* ##### INPUT HIDDEN ##### */
	
	.cs-form-element.hidden,
	.cs-form-element.hidden * {
		border: 0 none !important;
		height: 0 !important;
		font-size: 0 !important;
		line-height: 0 !important;
		margin: 0 !important;
		outline: 0 none !important;
		padding: 0 !important;
		width: 0 !important;
	}
	
	
	/* ##### INPUT SUBMIT ##### */
	
	.cs-form-element.submit {
		clear: none;
		padding-right: 0;
		text-align: center;
	}
	
	/* ##### BUTTONS ##### */
	
	.cs-form-element.button {
		padding: 0;
	}
	.cs-form-abstract button {
		cursor: pointer;
		margin: 0; /* Chrome adds a default margin */
	}
	
	.cs-form-abstract button::-moz-focus-inner,
	.cs-form-abstract input[type="button"]::-moz-focus-inner,
	.cs-form-abstract input[type="submit"]::-moz-focus-inner,
	.cs-form-abstract input[type="reset"]::-moz-focus-inner {
	}
	
	
	/* ##### DATEPICKER / TIMEPICKER  / DATETIMEPICKER ##### */
	
	.cs-form-abstract input.hasDatepicker {
		background: url(../../images/pictos/calendar.png) right 4px; 
	 	background: url(../../images/pictos/calendar.png) right 4px, -webkit-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/pictos/calendar.png) right 4px,	-moz-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/pictos/calendar.png) right 4px,	 -ms-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/pictos/calendar.png) right 4px,	  -o-linear-gradient(#FFF, #EEE 1px, #FFF 15px);
	 	background: url(../../images/pictos/calendar.png) right 4px,		 linear-gradient(#FFF, #EEE 1px, #FFF 15px);
		background-repeat: no-repeat;
	}
		.cs-form-abstract input.hasDatepicker:focus {
			background-position: right -41px, 0 0;
		}
		
	.cs-form-element.date input		{ width: 90px;  }
	.cs-form-element.time input		{ width: 55px;  }
	.cs-form-element.datetime input { width: 125px; }
	
	
	/* ##### CHAMPS NOTE ##### */
	.cs-form-element.note .content{
		padding: 0 0 0 130px;
	}
	
	/* ##### AUTRES CHAMPS ##### */
	
	.cs-form-abstract .ui-corner-all {
		border-radius: 3px;
	}
	
	
	/* ##### CHAMPS OBLIGATOIRES ##### */

	.cs-form-abstract .element-required sup {
		color: red;
		font-weight: bold;
		line-height: 11px;
	}
	
	
	/* ##### CHAMPS DÉSACTIVÉS ##### */
	
	.cs-form-abstract textarea[disabled],
	.cs-form-abstract input[type="text"][disabled],
	.cs-form-abstract input[type="password"][disabled],
	.cs-form-abstract input[type="datetime"][disabled],
	.cs-form-abstract input[type="datetime-local"][disabled],
	.cs-form-abstract input[type="date"][disabled],
	.cs-form-abstract input[type="month"][disabled],
	.cs-form-abstract input[type="time"][disabled],
	.cs-form-abstract input[type="week"][disabled],
	.cs-form-abstract input[type="number"][disabled],
	.cs-form-abstract input[type="email"][disabled],
	.cs-form-abstract input[type="url"][disabled],
	.cs-form-abstract input[type="search"][disabled],
	.cs-form-abstract input[type="tel"][disabled],
	.cs-form-abstract input[type="color"][disabled],
	.cs-form-abstract .uneditable-input[disabled],
	.cs-form-abstract .cs-form-element > button[disabled],
	.cs-form-abstract textarea[readonly],
	.cs-form-abstract input[type="text"][readonly],
	.cs-form-abstract input[type="password"][readonly],
	.cs-form-abstract input[type="datetime"][readonly],
	.cs-form-abstract input[type="datetime-local"][readonly],
	.cs-form-abstract input[type="date"][readonly],
	.cs-form-abstract input[type="month"][readonly],
	.cs-form-abstract input[type="time"][readonly],
	.cs-form-abstract input[type="week"][readonly],
	.cs-form-abstract input[type="number"][readonly],
	.cs-form-abstract input[type="email"][readonly],
	.cs-form-abstract input[type="url"][readonly],
	.cs-form-abstract input[type="search"][readonly],
	.cs-form-abstract input[type="tel"][readonly],
	.cs-form-abstract input[type="color"][readonly],
	.cs-form-abstract .uneditable-input[readonly],
	.cs-form-abstract .cs-form-element > button[readonly] {
		background: #F0F0F0;
		color: #B7B7B7;
		border-color: #E0E0E0;
		cursor: no-drop;
		opacity:1;
	}
		.cs-form-abstract input[readonly]:focus {
			border-color: #E0E0E0;
			box-shadow: none;
		}
	
	
	/* ##### INFORMATIONS DE L'ÉLÉMENT ##### */
	
	.cs-form-element-infos {
	 	position: absolute;
	 	top: 0;
	}
		.cs-form-element-infos > span {
			background-position: 0 bottom;
			background-repeat: no-repeat;
			display: inline-block;
			height: 16px;
			margin: 4px 0 4px 4px;
			vertical-align: text-top;
			width: 16px;
		}
			.cs-form-element-infos > span:hover {
				background-position: 0 0;
			}
		
		.cs-form-element-infos .toast-hint {
			background: url(../../images/pictos/info_16x16.png) no-repeat 0 bottom;
			cursor: help;
		}
		.cs-form-element-infos .toast-hint		{ background-image: url(../../images/pictos/info_16x16.png);	}
		.cs-form-element-infos .loading			{ background-image: url(../../images/cs-form-loader.gif);		}
		.cs-form-element-infos .success			{ background-image: url(../../images/pictos/check_16x16.png);	}
		.cs-form-element-infos .errors			{ background-image:	url(../../images/pictos/error_16x16.png);	}
		
		.cs-form-element.tinymce .cs-form-element-infos {
			right: 0;
		}
		.cs-form-element.captcha .cs-form-element-infos-status.success {
			display: none !important;
		}  



/****************************************************/
/*************** GESTION DES ERREURS ****************/
/****************************************************/

.cs-form-element ul.errors,
.cs-form-element.errors >label {
	color: red;
}
.cs-form-element.errors input,
.cs-form-element.errors button,
.cs-form-element.errors select,
.cs-form-element.errors textarea {
	background-color: #D78F94;
}
	.cs-form-element.errors input:focus,
	.cs-form-element.errors button:focus,
	.cs-form-element.errors select:focus,
	.cs-form-element.errors textarea:focus {
		border-color: rgba(255, 50, 50, 0.8);
	  	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 50, 50, 0.6);
		outline: 0;
		outline: thin dotted \9; /* IE9- */
	}



/****************************************************/
/********************** DIVERS **********************/
/****************************************************/

.clearfix:before,
.clearfix:after {
	content: ' ';
	display: table;
}

.clearfix:after {
	clear: both;
}