
/*--------------------------------------------------------- 
  Form 
-----------------------------------------------------------*/

/* form */
form { position: relative;}

/* fieldset */
form fieldset { padding: 10px 0 0 0; width: 100%; display: block;}
form fieldset:first-child { padding: 0;}
form fieldset.form-terms { padding: 5px 0 0 0;}

/* form column */
form .form-column-70 { margin-left: 0%; width: 70%; float: left;}
form .form-column-60 { margin-left: 1.5%; width: 58.5%; float: left;}
form .form-column-50 { margin-left: 1.5%; width: 48.5%; float: left;}
form .form-column-40 { margin-left: 0%; width: 40%; float: left;}
form .form-column-33 { margin-left: 1.5%; width: 32.3%; float: left;}
form .form-column-30 { margin-left: 1.5%; width: 28.5%; float: left;}
form fieldset p.form-column:first-child { margin-left: 0;}
/*---*/
@media (max-width: 800px) {
	form .form-column-70{ margin-left: auto; margin-right: auto; width: 100%; text-align: center; float: none;}
	form .form-column-60{ margin-left: auto; margin-right: auto; width: 100%; text-align: center; float: none;}
    form .form-column-50{ margin-left: auto; margin-right: auto; width: 100%; text-align: center; float: none;}
	form .form-column-40{ margin-left: auto; margin-right: auto; width: 100%; text-align: center; float: none;}
	form .form-column-33{ margin-left: auto; margin-right: auto; width: 100%; text-align: center; float: none;}
	form .form-column-30{ margin-left: auto; margin-right: auto; width: 100%; text-align: center; float: none;}
    form fieldset.form-submit.form-aligned { float: none; }
}


/* p */
form p { padding: 0 0 10px 0; width: 100%; display: block;}

/* form submit/terms */
form fieldset.form-submit { margin-left: auto; margin-right: auto; }
form fieldset.form-submit.form-aligned { float: right; top: 0; right: 0; position: absolute;}
form fieldset.form-submit p { padding: 0;}
form fieldset.form-terms { margin-left: auto; margin-right: auto; }
form fieldset.form-terms p { padding: 0;}
/*---*/
@media (max-width: 800px) {
	form fieldset.form-submit.form-aligned { position: static; }
}


/* label */
form label { margin: 0 0 5px 3px; font-size: 90%; line-height: 1.2em; display: block !important;}
form label.label-checkbox{ width: 100%; text-align: left; line-height: 1.3em; font-size: .7em; }
form label.label-checkbox input[type=checkbox]{ margin-top: 1px; margin-right: 10px;}
form label .sublabel{ padding: .3em 0 .5em; font-size: 80%; font-style: italic; line-height: 1.2em; display: block !important; }


/*--------------------------------------------------------- 
  INPUT SELECT TEXTAREA
-----------------------------------------------------------*/
input[type=radio] {display: block; float: left; margin: 1px 10px 0 0; cursor: pointer;}
input[type=checkbox] {display: block; float: left; margin: 0 10px 0 0; cursor: pointer;}
input[type=image] {vertical-align: middle; margin: 0;}
input[type=text], input[type=email], input[type=password], input[type=number], input[type=tel]{
  margin: 0;
  padding: 0.7em 15px;
  font-family: 'decorative';  
  font-size: 0.9em;  
  letter-spacing: 0;
  background: #fff;
  border: 1px solid #fff;
  border-radius: 0px;  
  vertical-align: middle;
  width: calc(100% - 32px);  
}

select{
  margin: 0;
  padding: 0.7em 15px; 
  padding-right: 35px;
  font-family: 'decorative';  
  font-size: 0.9em;  
  letter-spacing: 0;
  background: #fff url('img/icon-form-select-a.png') no-repeat 100% 50%;
  border: 1px solid #fff;
  border-radius: 0px;  
  vertical-align: middle;
  width: 100%;
  appearance: none; -moz-appearance: none; -webkit-appearance: none;
  cursor: pointer;
}
select::-ms-expand { display: none;} /* for IE 11 */

textarea{
  margin: 0;
  padding: 0.7em 15px;  
  font-family: 'decorative';  
  font-size: 0.9em; 
  line-height: 1.4em;
  background: #fff;
  border: 1px solid #fff;
  border-radius: 0px; 
  width: calc(100% - 32px);
  overflow-x: hidden;
  resize: vertical;
  outline: none;  
}
input:hover[type=text], input:hover[type=password], input:hover[type=number], input:hover[type=tel], select:hover,  textarea:hover{ }
input:focus[type=text], input:focus[type=password], input:focus[type=number], input:focus[type=tel], select:focus,  textarea:focus{ }
select:hover, select:focus{ }
textarea:hover,  textarea:focus{ }


/* INPUT FILE */
input[type=file] {
}
.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}
.inputfile + label {
	margin-top: 0 !important;
	display: inline-block !important;
	cursor: pointer;
}
.inputfile + label * {
	pointer-events: none;
}
.inputfile:focus + label, .inputfile + label:hover {
}
.inputfile + label svg {
    width: 1.4em;
    height: 1.4em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.9em;
    margin-right: 0.4em;
}


/* style SEARCH */
.header-search input { 
  padding: 8px 15px;  
}

/* error */
label.error { margin-top: 5px; font-size: 12px; color: #e64435; display: none;}
input.error, select.error, textarea.error { border: #fbbeb8 1px solid; background: #fef5f4;}

/* placeholder */
select:invalid { color: #cca7a2; font-weight: normal; font-style: normal; text-transform: normal; letter-spacing: 0; opacity:  1; }
option[value=""][disabled] { display: none;}
option { }

::-webkit-input-placeholder { color: #cca7a2; font-weight: normal; font-style: normal; text-transform: normal; letter-spacing: 0; opacity:  1;}
::-moz-placeholder { color: #cca7a2; font-weight: normal; font-style: normal; text-transform: normal; letter-spacing: 0; opacity:  1;}
:-ms-input-placeholder { color: #cca7a2; font-weight: normal; font-style: normal; text-transform: normal; letter-spacing: 0; opacity:  1;}
:-moz-placeholder { color: #cca7a2; font-weight: normal; font-style: normal; text-transform: normal; letter-spacing: 0; opacity:  1;}


/*--------------------------------------------------------- 
  BOTONES SUBMIT
-----------------------------------------------------------*/
button[type=submit], input[type=submit] { }
button[type=submit]:hover, input[type=submit]:hover { }

/* SEARCH */
.form-search{ position: relative;}
.form-search button[type=submit] { 
  margin: 0; width: 20px; height: 20px; 
  background: url('img/icon-form-search-submit.png') no-repeat 50% 50%; 
  z-index: 10;
  cursor: pointer;
  top: 0.7em;    
  right: 0.8em;  
  position: absolute;
}
.form-search button[type=submit]:hover{ 
  background: url('img/icon-form-search-submit-hover.png') no-repeat 50% 50%; 
}











