/**
 * @file
 * Form component's rules.
 *
 * Defines rules for form components : input, label, etc.
 * 
 */



/**
 * WEBFORM
 */
.contact-webform .form-item, .contact-webform .form-actions, .contact-webform .captcha{
  margin:0.5rem 0;
  padding:0 0.5rem;
}
.contact-webform .form-item label{
  width:100%;
  text-align: left;
}
.contact-webform .form-item input, .contact-webform .form-item textarea, .contact-webform .form-actions input{
  padding:0.435rem;
  border:1px solid #dddddd;
}
.contact-webform .form-item textarea{
  height:150px;
}
.contact-webform .form-item input, .contact-webform .form-item .form-textarea-wrapper{
  width:100%;
}
.contact-webform .form-type-textfield, .contact-webform .form-type-email, .contact-webform .form-type-textarea{
  width:100%;
}
.contact-webform .form-actions{
  float: right;
  text-align: center;
  width: 180px;
}
.contact-webform .form-actions input{
  width: 100%;
  color:#dddddd;
  background-color:#ffffff;
  transition: all 0.25s;
}
.contact-webform .form-actions input:hover{
  color:#ffffff;
  background-color:#167394;
  border-color:#167394;
  transition: all 0.25s;
}

@media screen and (min-width: 600px){
  .contact-webform .form-type-textfield, .contact-webform .form-type-email{
    float: left;
    width:50%;
  }
  .contact-webform .form-type-textarea, .contact-webform .captcha{
    float: right;
    width: 50%;
  }
  .contact-webform .captcha{
    text-align: right;
  }
  .contact-webform .g-recaptcha > div{
    display: inline-block
  }
}
@media screen and (min-width: 768px){
  .contact-webform .form-item textarea{
    height:100px;
  }
  .contact-webform .form-item label{
    width:34%;
    text-align: right;
  }
  .contact-webform .form-item input, .contact-webform .form-item .form-textarea-wrapper{
    width:64%;
  }
  .contact-webform .form-actions{
    margin-right:7px;
  }
}
@media screen and (min-width: 900px){
  .contact-webform .form-item label{
    width:44%;
  }
  .contact-webform .form-item input, .contact-webform .form-item .form-textarea-wrapper{
    width:54%;
  }
}




/**
 * SEARCH FORM
 */
.search-form .form-search{
  border:none;
  border-bottom:1px dashed #cccccc;
  padding:0;
  margin:0;
  color:#aaaaaa;
  font-size:0.875em;
  padding:2px 0;
  width:260px;
  background-color:transparent;
}
.search-form .form-submit{
  margin:0;
  border:none;
  width:1.5rem;
  height:1.5rem;
  background-color:transparent;
  overflow: hidden;
  text-indent:-999em;
  background-image:url('../images/icon-loupe.svg');
  border-bottom:1px dashed #cccccc;
}
.layout-content .search-form .form-submit{
  width:1.6rem;
  height:1.6rem;
}
.form-type-search{
  margin:0;
  position: relative;
}
.search-block-form .form-type-search:before{
  content:'';
  display: block;
  position: absolute;
  left: -1rem;
  bottom: -1rem;
  width:30px;
  height:30px;
  background-image:url('../images/icon-coccinelle.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.search-block-form{
  position: relative;
}
.search-block-form .label-search{
  position: absolute;
  left:1rem;
  top:0;
  transition:all 0.25s;
  color:#aaaaaa;
}
.search-block-form .form-search{
  padding:2px 0 2px 1rem;
}
.label-search.label-moved{
  top:-18px;
  font-size:0.75rem;
  transition:all 0.25s;
}