/* CSS Document */
/*	-webkit-
	   -moz-
	     -o-*/
input[type='text'], 
input[type='tel'], 
input[type='email'], 
input[type='password'], 
textarea, select {
	font-family: "Quicksand", sans-serif;
	border:#ebeae8 1px solid;
	display:inline-block;
	padding:4px 7px;
	font-size:12px;
	color:#999;
}
select { padding-right:0 }
textarea {
	min-height:100px;
	display:block;
	padding:5px;
	height:auto;
	width:100%;
}

input[type='text']:hover, 
input[type='text']:focus,
input[type='tel']:hover, 
input[type='tel']:hover, 
input[type='email']:focus,
input[type='email']:focus,
input[type='password']:hover, 
 input[type='password']:focus,
select:hover, select:focus, textarea:hover, textarea:focus {
	border-color:#000000;
	color:#000000;
}
input[type='submit'], .submit,
input[type='button'], .button {
	text-transform:uppercase;
	border:#000000 1px solid;
	text-transform: uppercase;
	border-radius: 24px;
	font-size: 14px;
	padding: 0 24px;
	background:#000000;
	font-weight:700;
	cursor:pointer;
	margin: 0 auto;
	height: 40px;
	color:#fff;
}
input[type='button'], .button {
	background-color:transparent;
	border-color:#000000;
	color:#000000;
}
input[type='submit']:hover, .submit:hover,
input[type='button']:hover, .button:hover {
	border-color:#646464;
	background:#646464;
	color:#fff;
}
/*input[type='button']:hover, .button:hover {
	border-color:#e9e6e5;
	color:#666;
}*/
a.button, a.submit { line-height:40px; }

/* --- VALIDATION --- */
textarea.validfield,
input[type='text'].validfield,
input[type='tel'].validfield,
input[type='email'].validfield,
input[type='password'].validfield, select.validfield {
	background-image:url(images/field_valid.png);
	background-position:right center;
	background-repeat:no-repeat;
}

/* --- ERROR -------- */
input[type='text'].errorfield, textarea.errorfield,
input[type='password'].errorfield, select.errorfield {
	background-image:url(images/field_error.png);
	background-position:right center;
	background-repeat:no-repeat;
	border-color:#e30613;
	color:#e30613;
}
textarea.validfield, textarea.errorfield { background-position:right 10px; }
input[type='text'].errorfield:hover, input[type='password'].errorfield:hover, textarea.errorfield:hover {
	border-color:#e30613;
	color:#e30613;
}

/* --- CSS3 --------- */
input[type='tel'], 
input[type='text'], 
input[type='email'], 
input[type='password'], 
textarea, 
input[type='submit'], .submit, 
input[type='button'], .button {
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
	     -o-box-sizing:border-box;
			box-sizing:border-box;
	-webkit-transition-property:color, background-color, border-color, box-shadow;
	   -moz-transition-property:color, background-color, border-color, box-shadow;
	     -o-transition-property:color, background-color, border-color, box-shadow;
			transition-property:color, background-color, border-color, box-shadow;
	-webkit-transition-timing-function:linear;
	   -moz-transition-timing-function:linear;
	     -o-transition-timing-function:linear;			
			transition-timing-function:linear;
	-webkit-transition-duration:.3s;
	   -moz-transition-duration:.3s;
	     -o-transition-duration:.3s;	
			transition-duration:.3s;
}
.formulaire-1 input[type='text']:focus,
.formulaire-1 input[type='password']:focus,
.formulaire-1 select:focus, .formulaire-1 textarea:focus,
.formulaire-2 input[type='text']:focus,
.formulaire-2 input[type='password']:focus,
.formulaire-2 select:focus, .formulaire-1 textarea:focus {
	-webkit-box-shadow:#646464 0 0 5px;
	   -moz-box-shadow:#646464 0 0 5px;
	     -o-box-shadow:#646464 0 0 5px;
			box-shadow:#646464 0 0 5px;
}
input[type='text'].errorfield:focus, textarea.errorfield:focus,
input[type='password'].errorfield:focus {
	border-color:#e30613;
	color:#e30613;
	-webkit-box-shadow:#e30613 0 0 5px;
	   -moz-box-shadow:#e30613 0 0 5px;
	     -o-box-shadow:#e30613 0 0 5px;
			box-shadow:#e30613 0 0 5px;
}


/* FORMULAIRE - 1 */
.formulaire-1 fieldset { padding:10px; }
.formulaire-1 fieldset legend { 
	text-transform:uppercase; font-weight:600;
	margin-bottom:20px;
}
.formulaire-1 legend {
	font-size: 15px; font-weight:700;
	margin-bottom:15px; text-transform:uppercase 
}
.formulaire-1 fieldset.left {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
}
.formulaire-1 label {
	display:block; margin:0 0 20px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
	font-size:13px;
}
.formulaire-1 label.left { padding-right:10px; }
.formulaire-1 label.right { padding-left:10px; }
.formulaire-1 label .textfield { width:100%; margin:5px 0 0 0; }
.formulaire-1 label.floated-label { line-height:30px; }
.formulaire-1 label.floated-label input { width:80%; float:right; }
.formulaire-1 label.floated-label input[type='password'] { width:60%; }

/* FORMULAIRE - 2 */
.formulaire-2 fieldset { padding:10px 0; }
.formulaire-2 fieldset legend { 
	text-transform:uppercase; font-weight:600;
	margin:20px 0;
}
.formulaire-2 legend {
	font-size: 15px; font-weight:700;
	margin-bottom:15px; text-transform:uppercase 
}
.formulaire-2 fieldset.left {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
}
.formulaire-2 label {
	display:block; margin:0 0 10px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
	font-size:13px;
}
.formulaire-2 label.left { padding-right:10px; }
.formulaire-2 label.right { padding-left:10px; }
.formulaire-2 label .textfield { width:100%; margin:5px 0 0 0; }
.formulaire-2 label.floated-label { line-height:30px; }
.formulaire-2 label.floated-label.clearfix { min-height:50px; }
.formulaire-2 label.floated-label input,
.formulaire-2 label.floated-label select { width:65%; float:right; }
.formulaire-2 label.floated-label textarea {
	width:65%; 
	float:right; 
	min-height:120px; 
	height:50px;
}
.formulaire-2 span.inline-label { display:inline-block; width:35%; font-size:13px; }
.formulaire-2 label.inline-label { display:inline-block; margin-right:20px; }
/* */
.error_output {
	background:#e30613;
	text-align:center; 
	font-weight:700;
	padding:30px; color:#fff;
	margin-bottom:30px;
}
.error_output p { 
	margin:0; line-height:17px;
	font-weight:700; font-size:13px;
}
.error_output p em { display:none; }

.valid_output {
	background-color:#ddffd4; border:#28b303 1px solid;
	color:#28b303; padding:10px 20px; text-align:center;
	max-width:900px; margin:0 auto 0;
}
.valid_output p.fs24 { padding:20px; font-size:18px; }
