/**
 * Project style sheet.
 *
 * @package    vanilla
 * @subpackage css
 * @author     Loops <evrard at h2a dot lu>
 * @version    SVN: $Id: styles.css 38 2014-08-22 15:38:29Z loops $
 */


/*** MESSAGES ------------------ ***/

.msgerror { color: #e63030;}
.msgsuccess { color: #008913; }



/*** ELEMENTS ------------------ ***/

/* default */
select, textarea, input { border-width: 1px; border-style: solid; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
/* hover */
select:hover, textarea:hover, input:hover {}
/* focus, active */
select:focus, textarea:focus, input:focus,
select:active, textarea:active, input:active {border-color:#666;}
/* error (by default #e63030) */
.\:error select, .\:error textarea, .\:error input { border-color: #e63030; color: #e63030; }
/* invalid/required - for now, only on mozilla */
select:-moz-ui-invalid, textarea:-moz-ui-invalid, input:-moz-ui-invalid { border-color: #e63030; color: #e63030; }

/** padding **/
/* try to harmonize with select */
textarea, input { padding: 15px 10px; border-color:#dfdfdf; display:block;}
select { padding: 1px 0; }
  option { padding: 0 4px; }
  optgroup { padding: 0 4px; }
    optgroup > option { padding: 0 0 0 1em; margin: 0 -4px; }

textarea{min-height:240px;}

/** stupid webkit shit, put your own colors **/
/** / input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #xxxxxx inset; color: #xxxxxx !important; } /**/
/** / input:-webkit-autofill:hover { -webkit-box-shadow: 0 0 0 1000px #xxxxxx inset; color: #xxxxxx !important; } /**/
/** / input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 1000px #xxxxxx inset; color: #xxxxxx !important; } /**/
/** / .\:error input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #xxxxxx inset; color: #xxxxxx !important; } /**/



/*** PLACEHOLDER --------------- ***/
/* each variation needs to be separated */

/* normal */
::placeholder {}
::-webkit-input-placeholder {}
:-moz-placeholder {}
::-moz-placeholder { opacity: 1; } /* FF 19+ had an opacity to the placeholder */
:-ms-input-placeholder {}
.\:placeholder {} /* @see jquery.placeholder.js */
/* hover */
:hover::placeholder {}
:hover::-webkit-input-placeholder {}
:hover:-moz-placeholder {}
:hover::-moz-placeholder {}
:hover:-ms-input-placeholder {}
.\:placeholder:hover {} /* @see jquery.placeholder.js */
/* focus, active */
:focus::placeholder, :active::placeholder {}
:focus::-webkit-input-placeholder, :active::-webkit-input-placeholder {}
:focus:-moz-placeholder, :active:-moz-placeholder {}
:focus::-moz-placeholder, :active::-moz-placeholder {}
:focus:-ms-input-placeholder, :active:-ms-input-placeholder {}
.\:placeholder:focus, .\:placeholder:active {} /* @see jquery.placeholder.js */
/* error (by default #e63030) */
.\:error ::placeholder { color: #e63030; }
.\:error ::-webkit-input-placeholder { color: #e63030; }
.\:error :-moz-placeholder { color: #e63030; }
.\:error ::-moz-placeholder { color: #e63030; }
.\:error :-ms-input-placeholder { color: #e63030; }
.\:error .\:placeholder { color: #e63030; } /* @see jquery.placeholder.js */
/* invalid/required - for now, only on mozilla */
:-moz-ui-invalid::placeholder, :-moz-ui-invalid::placeholder { color: #e63030; }
:-moz-ui-invalid:-moz-placeholder, :-moz-ui-invalid:-moz-placeholder { color: #e63030; }
:-moz-ui-invalid::-moz-placeholder, :-moz-ui-invalid::-moz-placeholder { color: #e63030; }



/*** LABELS -------------------- ***/

label {margin:0 0 10px; display:block; color:#666;}
/* on error */
.\:error label { color: #e63030; }
/* for checkboxes */
input[type="checkbox"] + label{}



/*** RADIO/CHECKBOX ------------ ***/

/*** default display ***/
input[type="checkbox"], input[type="radio"] {padding: 0 !important; border: 0 !important; width: 16px !important; vertical-align: -2px; }

/*** iconized sample ***/
/* this sample assume three status (inactive, active, error) - for checked and unchecked state - and icon of 13px x 13px */
/* do not hesitate to adapt it if necessary */
/* for IE8, do not forgot to activate jquery.checked.js in view.yml file */

/* hide it behind the label, but keep it at correct place and visible (for focus) */
input[type="checkbox"], input[type="radio"] { display:none; position: absolute; z-index: -1; margin-top: 2px; margin-left: 2px; opacity: 0; }
input[type="checkbox"] + label, input[type="radio"] + label {display: inline-block; vertical-align:middle; position:relative; padding-left:30px;}
/* background display */
input[type="checkbox"] + label:before{ content:''; display:inline-block; position:absolute; top:0; left:0; width: 20px; height: 20px; outline:1px solid rgba(0,0,0,0.15); background:transparent; vertical-align:middle; margin-right:15px; box-sizing:border-box; border:10px solid #fff;}

/*checked*/
input[type="checkbox"]:checked + label:before{border-width:4px;}



/*** DISPLAY ------------------- ***/

/** fieldset **/
.formfieldset {}
  .formfieldset_title {}

/** row **/.formrow {margin:20px 0;}.formrow:after{content:''; display:block; margin:0; padding:0; clear:both;}.formrow + .formrow {}   /* label */  .formrow > label {}  /* help */  .formhelp {}  /* errors */  .formerror { color: #e63030; margin-top:5px; font-size:13px;}  .half_row{display:block; width:50%; box-sizing:border-box; vertical-align:top;}  .half_row:first-child{float:left; padding-right:15px;}  .half_row:last-child{float:right; padding-left:15px;}  .half_row > label + br{display:none;}

/** submit **/
.formrow_submit {width:50%;}
  .form_submit {}

.wpcf7 .form_submit, .wpcf7 .wpcf7-submit{color:#fff; background:#f3d200; border:0; outline:none; opacity:1; -webkit-transition:opacity .3s ease; -moz-transition:opacity .3s ease; -ms-transition:opacity .3s ease; -o-transition:opacity .3s ease; transition:opacity .3s ease;}
.wpcf7 .form_submit:hover, .wpcf7 .wpcf7-submit:hover{opacity:.8;}
.wpcf7 .form_submit:active, .wpcf7 .form_submit:focus, .wpcf7 .wpcf7-submit:active, .wpcf7 .wpcf7-submit:focus{border:0; outline:none;}

div.wpcf7-validation-errors{border:0; margin:20px 0!important; padding:20px 20px 20px 60px!important; color:#fff; background:#f33535; position:relative; border:0!important;}
/*div.wpcf7-validation-errors:before{content:''; display:inline-block; width:20px; height:20px; background:url(icons/icons.svg) no-repeat 0 -105px; position:absolute; top:26px; left:20px;}*/

.wpcf7-not-valid{border-color:#f33535;}

.wpcf7-form .formrow br{display:none;}

@media screen and (max-width: 460px)
{
  .wpcf7-form .half_row{padding:0!important; width:100%;}
  .wpcf7-form .half_row + .half_row{margin-top:20px;}
}