/*
-----------------------------------------------------------------------------------------
NOM DU SITE / FORMS
Email: contact@goweb.fr
Date de création : 20/08/2012
Dernière modification : 20/08/2012 par Laurent Andrzejak

-----------------------------------------------------------------------------------------
*/
.text-std,
.text-box {
  border: #ccc 1px solid;
  font-size: 14px;
  padding: 6px 10px;
  margin: 0;
  color: #666;
  font-family: Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
  background: #fff;
  /* Old browsers */
}
.text-std.readonly,
.text-box.readonly {
  opacity: 0.8;
  border-color: #f4f4f4;
  background: #f4f4f4;
  /* Old browsers */
  background: -moz-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4f4f4), color-stop(100%, #f4f4f4));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #f4f4f4 0%, #f4f4f4 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #f4f4f4 0%, #f4f4f4 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4', endColorstr='#f4f4f4', GradientType=0);
  /* IE6-9 */
}
label {
  color: #666;
  font-size: 13px;
}
textarea {
  resize: none;
  height: 80px;
}
.field {
  display: block;
  width: 100%;
  position: relative;
  margin-top: 15px;
  float: left;
}
.field.field-inline {
  margin-top: 5px;
}
.field.field-inline label {
  float: left;
  clear: none;
  margin-right: 5px;
}
.field span.result {
  font-size: 13px;
}
.field .field-mini {
  width: calc((100%/4) - 12px);
  float: left;
  margin-right: 15px;
  position: relative;
}
.field .field-mini:last-child {
  margin-right: 0;
}
.field .datepicker,
.field .k-dropdown,
.field .k-datepicker,
.field .k-combobox {
  width: 100%;
}
.field label {
  display: block;
  clear: both;
  padding-bottom: 3px;
}
.field input,
.field textarea {
  width: calc(100% - 20px);
}
.field label.togglebutton {
  float: left;
  margin-right: 20px;
  clear: none;
  margin-top: 15px;
}
.field label.togglebutton input {
  float: left;
  margin: 0 3px 0 0;
}
.field .k-upload {
  border: 1px #ccc dashed;
}
.field input[type="checkbox"],
.field input[type="radio"] {
  width: auto!important;
}
/*------------------------FIELD FULL ------------------------------*/
.field-full {
  width: 100%;
  position: relative;
}
/*------------------------FIELD HALF ------------------------------*/
.field-half {
  width: calc(50% - 7.5px);
  float: left;
  margin-right: 15px;
  position: relative;
}
.field-half.field-inline {
  margin-top: 5px;
}
.field-half.field-inline label {
  float: left;
  clear: none;
  margin-right: 5px;
}
.field-half .k-widget.k-datepicker {
  padding: 0;
}
.field-half:last-child {
  margin-right: 0;
}
.field-half .field-mini {
  width: calc((100%/3) - 12px);
  float: left;
  margin-right: 15px;
  position: relative;
}
.field-half .field-mini:last-child {
  margin-right: 0;
}
/*------------------------FIELD WIDE ------------------------------*/
.field-wide {
  width: calc((100%/3) - 10px);
  float: left;
  margin-right: 15px;
  position: relative;
}
.field-wide:last-child {
  margin-right: 0;
}
.field-wide .field-mini {
  width: calc((100%/2) - 10px);
  float: left;
  margin-right: 15px;
  position: relative;
}
.field-wide .field-mini:last-child {
  margin-right: 0;
}
.publish-state {
  float: right;
  background-color: #8ebc00;
  padding: 5px 10px;
  line-height: 25px;
}
.publish-state label {
  color: #fff;
}
.publish-state input {
  float: right;
  margin-top: 6px;
  margin-left: 5px;
}
.publish-state span.label {
  color: #fff;
}
/* LIST DE PHOTO UPLOAD*/
div.field .multi-photo {
  float: left;
  width: 100%;
}
div.field .multi-photo .k-widget {
  background-color: transparent;
}
div.field .multi-photo ul {
  float: left;
  width: 100%;
  border: none;
}
div.field .multi-photo ul li {
  float: left;
  padding: 6px;
  margin: 10px 10px 0 0;
  position: relative;
  width: 200px;
  height: 53px!important;
  list-style: none!important;
  overflow: hidden;
  cursor: move;
  background-color: #fff;
  border: 2px transparent dashed;
}
div.field .multi-photo ul li .details-attribute {
  position: absolute;
  z-index: 15;
  right: 16px;
  bottom: 10px;
  display: block;
  width: 25px;
  height: 25px;
}
div.field .multi-photo ul li .details-attribute .iconfont {
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 25px;
  color: #fff;
  cursor: pointer;
}
div.field .multi-photo ul li .details-attribute p {
  color: #fff;
  display: none;
  position: absolute;
  width: 194px;
  left: -165px;
  padding: 3px;
  top: -83px;
  height: 96px;
  background-color: rgba(0, 0, 0, 0.8);
}
div.field .multi-photo ul li .details-attribute:hover p {
  display: block;
}
div.field .multi-photo ul li:hover {
  border-color: #8ebc00;
}
.IconSup {
  font-family: icone;
  position: absolute;
  right: 15px;
  top: 15px;
  font-size: 20px;
  text-decoration: none;
  background: #fff;
  border-radius: 3px;
  padding: 3px;
  z-index: 10;
}
.IconSup:hover {
  background-color: #e9e9e9;
}
div.field .multi-photo .k-upload-empty {
  border: 1px dashed #dadada;
}
div.field .multi-photo .k-upload-empty .k-button span small {
  font-size: 12px!important;
  font-style: italic!important;
}
li.hint {
  float: left;
  background-color: #fff;
  padding: 6px;
  margin: 10px 10px 0 0;
  position: relative;
  width: 200px!important;
  height: 53px!important;
  list-style: none!important;
  overflow: hidden;
  opacity: 0.8;
  border: 2px transparent dashed;
  border-color: #8ebc00;
}
li.placeholder {
  background-color: #dceffd;
  color: #52aef7;
  text-align: right;
}
/*---------------------VALIDATION ------------------------------*/
.k-invalid {
  border-color: #b82323;
}
.k-tooltip.k-tooltip-validation {
  position: absolute;
  right: 0;
  top: -7px;
  z-index: 0;
  border-color: transparent!important;
  background-color: #b82323!important;
  -webkit-box-shadow: 0px 0px 0px 0px rgba(50, 50, 50, 0);
  -moz-box-shadow: 0px 0px 0px 0px rgba(50, 50, 50, 0);
  box-shadow: 0px 0px 0px 0px rgba(50, 50, 50, 0);
  border-radius: 0;
  color: #fff!important;
  font-size: 12px;
}
.k-tooltip.k-tooltip-validation .k-icon.k-warning {
  display: none!important;
}
.toggle-inline {
  background-color: #F5F5F5;
  width: 100%;
  box-sizing: border-box !important;
  padding: 15px;
}
.toggle-inline label {
  float: left;
  clear: none;
  margin-right: 15px;
}
.toggle-inline span.label {
  float: left;
  clear: both;
  width: 100%;
  font-size: 13px;
  padding-top: 1px;
  font-weight: bold;
  margin-bottom: 10px;
}
.toggle-inline label input {
  float: left;
  margin-top: 2px;
}
/*--------------------------STATUS PAGE -----------------------*/
div.status {
  background-color: #8ebc00;
  width: 500px;
  position: fixed;
  top: 10%;
  left: 50%;
  margin-left: -250px;
  z-index: 10000;
  border-radius: 5px;
  display: none;
}
div.status.valid {
  background-color: #8ebc00;
}
div.status.invalid {
  background-color: #b82323;
}
div.status.saving {
  background-color: #FF8000;
}
div.status p {
  color: #fff;
  padding: 20px;
  text-align: center;
  font-size: 14px;
}
/*----KENDO MULTI SELECT-----*/
.k-multiselect-wrap .k-input {
  padding: 5px 0!important;
}
.group-toggle label {
  clear: none;
  margin: 18px 10px 0 0;
  float: left;
  background: #e9e9e9;
  padding: 0 10px 0;
  margin-right: 5px;
  line-height: 30px;
  border: 1px transparent solid;
}
.group-toggle label.selected {
  border-color: #7ea700;
  background-color: #8ebc00;
  color: #fff;
}
.group-toggle label input {
  float: left;
  margin-right: 5px;
  margin-top: 9px;
}
.group-toggle label:hover {
  border: 1px #c6c6c6 solid;
}
.group-toggle strong label {
  background-color: #8ebc00;
  color: #fff;
  text-transform: uppercase;
  line-height: 20px;
  padding-top: 5px;
}
.group-toggle strong label:hover {
  border-color: transparent;
}
.k-calendar .k-content {
  font-size: 14px;
}
.loading-pages .pages-wrapper .inner-pages .group-toggle label {
  margin-top: 15px;
}
