/*-------------------- Form Layout ---------------*/
	/***** Structure générale header, body, footer  *****/
div.form {
	position: relative;
	/*border: 3px solid #EFEFEF;*/
	/*float: left;
	width: 100%;*/
}

div.form form {
	/*border: 1px solid #9CD7F3;
	background-color: #FCFDFE;*/
}

div.form .header {
	margin: 3px;
	padding: 20px 8px;
	background-color: #1071A2;
	clear: both;
	color: #FFF;
}

div.form .header h2 {
	color: #FFF;
	font-size: 18px;
	font-weight: normal;
	margin: 0;
}

div.form .footer,div.form .header-actions {
	margin: 3px;
	padding: 10px 12px;
	/*background-color: #E4F4FC;*/
	clear: both;
	text-align: center;
}

div.form .body {
	padding: 15px;
}

#form-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	display: none;
	width: 100%;
	height: 500px;
	background-color: #000;
}

#form-overlay-content {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	display: none;
	width: 100%;
	height: 500px;
	background-color: transparent;
	text-align: center;
}

#form-overlay-content-inner {
	width: 300px;
	margin: auto;
	padding: 10px;
	border: 1px solid #16A2E4;
	background-color: #FFF;
}

/******************** Definition List *******************************/
/* clear fix hack */
div.form dl:after { 
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

div.form dl {
	display: inline-table;/* clear fix hack */
	min-height:0px;/* clear fix hack */
	margin: 0px;
	padding: 0px;
	width: auto;
	clear: both;
}

div.form dl dt {
	float: left;
	clear: left;
	width: 100px;
	margin: 0px 0px 5px 0px;
	color: #000000;
	text-align: right;
}

div.form dl dd {
	margin: 0px 0px 10px 150px;
	color: #666666;
	_text-indent: -3px !important;
}

div.form dl dt label {
	vertical-align: top;
	vertical-align: baseline;
	margin: 0px 8px 0px 0px;
	line-height: 1.6em;
}


/* table-display */

div.form.table-display dl  {
	border: 1px solid #9C9D9F;
	background:url("../images/form-col-bg.gif") repeat-y -225px 0;
}

div.form.table-display dl dt {
	margin: 0 0 0 0;
	padding:6px;
	border-top: 1px solid #9C9D9F;
	background-color:#F2F2F2;
	color:#858688;
}

/* commented backslash hack for mac-ie5 \*/
div.form.table-display dl dt {
	clear: both;
}

/* end hack */
div.form.table-display dl dd {
	float: left;
	width:345px;
	margin: 0 0 0 0;
	padding:5px;
	border-top: 1px solid #9C9D9F;
	border-left: 1px solid #9C9D9F;
}

div.form.table-display dl dd.first, div.form.table-display dl dt.first {
	border-top:none;
}

/***** Structurant pour éléments de formulaire *****/
form div.col {
	float: left;
	width: 50%;
}

form div.col.c-3 {
	width: 33%;
}

form div.col.c-3 label {
	width: 12em;
	text-align: left;
	float: none;
}

form div.col.c-4 {
	width: 25%;
}

/* fieldset */
fieldset {
	clear: both;
	margin: 10px 0 0 0;
	padding: 12px 0;
	/*border: 1px solid #CCC;*/
}

fieldset.main {
	background: #FFFFCC url("../images/fliedset-main-bg.jpg") repeat-x top;
}

legend {
	margin: 0 20px;
	padding: 0 8px;
	color: #000;
	font-weight: bold;
	font-family: "Trebuchet MS", Georgia, Arial;
	font-size: 16px;
	color: #FF7800;
}

/* Que pour IE */
* html legend {
	margin-bottom: 12px;
}

/*-------------------- hint & help ---------------*/
span.hint {
	color: #AAA;
	font-size: 10px;
}

.fieldset-help,.form-help {
	padding: 0 1em 1.5em 1.8em;
	background: url("../images/fieldset-help.gif") no-repeat 0px 3px;
}

.fieldset-help .example,.form-help .example {
	color: #888;
}

.fieldset-help p.example,.form-help p.example {
	margin-top: 10px;
}

/*-------------------- textfield, textarea, password ---------------------*/

input, textarea, select, button {
	font-family: Arial;
	font-size:12px;
	line-height:1.2em;
}

.textfield:focus,select:focus,textarea:focus,.button:hover,.input:hover
{
	background-color: #FFF;
	outline:1px solid #D6FFC9;
}

input.text, input.date, input.time, input.password,input.file {
	color: #666;
	border: 1px solid #BBB;
	vertical-align: middle;
	background:url("../images/input-bg.gif") no-repeat;
	width: 200px;
	padding: 2px;
}

input.text:disabled,input.password:disabled {
	background:none;
	background-color:#F9F9F9;
	border: 1px solid #E0E0E0;
	color:#CCC;
}

input.text:hover,input.text:focus,input.password:hover,input.password:focus
{
	border-color: #66DD55 rgb(85, 187, 85) rgb(69, 148, 85);
}

input.text:disabled:hover,input.password:disabled:hover {
	border-color:#E0E0E0!important;
}

input.number {
	width:60px;
}
input.date {
	width:80px;
}

input.time {
	width:60px;
}

.textarea {
	width: 440px;
	height: 150px;
	background:url("../images/input-bg.gif") no-repeat;
	border: 1px solid #BBB;
	padding:5px;
	color: #666;
}




/*-------------------- file ---------------*/

/* It is not possible to style a file */
input.file {
	border: 1px solid #BBB;
	background:url("../images/input-bg.gif") no-repeat;
}

input.file {
	border: 1px solid #BBB;
	background:url("../images/input-bg.gif") no-repeat;
}

.file-container.photo{
	background:url("../images/file-upload-photo.gif") no-repeat;
	/*padding-left:28px;*/
}
.file-container.video{
	background:url("../images/file-upload-video.gif") no-repeat;
	padding-left:28px;
}
.file-container.download{
	background:url("../images/file-upload-download.gif") no-repeat;
	padding-left:28px;
}

.file-box{
    margin-left:15em;/*same as label*/
}

form .visuel{
    margin:0 0 2px 0;
}
form .visuel img{
    border:1px solid #BBB;
    padding:2px;
}

form p.filename{
	float: none;
	clear:none;
    font-size:10px;
    color:#999;
    padding-top:1px;
    padding-bottom:8px;
}

/*-------------------- checkbox / radio ---------------*/

input.checkbox{
	margin-right:3px;
	vertical-align:middle;
	border: 1px solid #BBB;
}


/*-------------------- select ---------------*/
select {
	background-color: #FEFEFE;
	border-color: #C4CCCC rgb(172, 181, 181) rgb(111, 119, 119);
	border-style: solid;
	border-width: thin;
	padding:1px;
}

select:hover,select:focus {
	border-color: #66DD55 rgb(85, 187, 85) rgb(69, 148, 85);
}




/*-------------------- mise en forme label, fieldset, legend ---------------------*/
label.checkbox {
	display: inline;
	vertical-align: bottom;
	float: none;
	width: auto;
}

/*-------------------- Données présenté dans un tableau ---------------*/
table.form-data {
	border-spacing: 3px;
}

table.form-data th { /*text-align:right;*/
	font-weight: bold;
	color: #777;
}

/*-------------------- champ requis ---------------*/
label em {
	color: red;
}

/*-------------------- messages d'erreurs ---------------*/
	/* span.form-counter-helper est utiliser pour afficher le nombre de caractères ou de mots
   entrer dans un champ text ou texarea.
*/
label.error,.form-counter-helper.error {
	float: none;
	display:block;
	background: url(../images/form-field-error.gif) 0 3px no-repeat;
	margin-right: 0;
	margin-left: 5px;
	padding: 2px 0 2px 18px;
	color: #FF0000;
	font-weight: bold;
	text-align: left;
}

label.valid,.form-counter-helper.valid {
	float: none;
	display: inline;
	background: url(../images/form-field-valid.gif) left center no-repeat;
	padding-left: 25px;
	color: green;
}

label.standalone {
	display: block;
	margin: 10px 0;
}

input.error,input.over:focus,input.error:focus,textarea.error {
	border: 1px solid #FF0000;
}

input.valid {
	
}

label.checkbox {
	font-size: 11px;
}