//
// FORM 
//

ul.form {
  margin-bottom: 10px;
  background-color:transparent;
  border:none;
}


ul.form li.formSeparationRow:last-child {
  background-color:transparent;
  margin-bottom:0px;
}

ul.form ul li.error {
  border: 2px solid red;
}

ul.form li.error + li.error {
  border-top: 0;
}

ul.form li * {
  white-space: normal;
  text-overflow: ellipsis;
}

ul.form input[type="text"], ul.form input[type="number"], ul.form input[type="password"] {
  display:block;
  width:50%;
}

input[type="text"]:not(.selectbox),input[type="number"], input[type="password"] {
  .border-radius(.4em);
  .background-clip(padding-box);
  text-indent:4px;
  height:1.7em;
}

input, select {
  vertical-align: middle;
}

input, select, textarea {
  font-family: Helvetica;
  font-size: 0.9em;
}

input[type="text"], input[type="password"],input[type="number"], textarea {
  .appearance(textarea);
  width: 100%;
  outline: none;
}

input[type="text"].invalid, input[type="password"].invalid, textarea.invalid {
  border: 1px solid red;
}

input[type="checkbox"], input[type="radio"] {
  margin: 0;
  padding: 10px 10px;
}

ul.form li .scrollContainer {
  height: 140px;
}

textarea {
  resize: none;
  padding-top:4px;

  .background-clip(padding-box);
  text-indent:4px; 
  height:1.7em;

  .border-radius(none);

  overflow:hidden;
}

//
// RENDERING
//

.formElementError {
  color: red;
  text-align:right;
  border-top:0;
  padding: 0px 10px 10px 10px;
}

.formSeparationRow, .formRowGroupHeader, .formRowGroupFooter {
  padding:0px;
}

.formSeparationRow {
}

.formRowContent {
  border-top:0;
  padding: 10px 10px 10px 10px;
}

.formRowContent + .formRowContent {
  padding-top:0px;
}

// If one row is excluded: hide its separationRow
.formRowContent.exclude + .formSeparationRow {
  border-top:0;
}

