form {
  max-width: 4in;
}

form .field {
  display: block;
  margin-bottom: 1em;
}

form .check.field,
form .check.field label,
form .radio.field label {
  height: 2em;
  line-height: 2em;
  overflow: auto;
}

form .radio.field .row {
  overflow: auto;
}

form .check.field + .check.field {
  margin-top: -1em;
}

form .radio.field .row + .row {
  margin-top: -8pt;
}

form .field label {
  display: block;
  height: 14pt;
  line-height: 14pt;
}

form .field .error {
  color: #800;
  font-size: smaller;
}

form .field .hint {
  color: #888;
  font-size: smaller;
  margin-top: 2pt;
}

form .field .control {
  float: right;
  font-size: smaller;
}

form .field .control input {
  display: inline-block;
  float: none;
  height: unset;
  margin: 0;
}

input, select {
  padding: 0 2pt;
  line-height: 20pt;
  height: 20pt;
}

textarea {
  height: 1in;
  resize: vertical;
}

input, select, textarea {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 3pt;

  display: block;
  box-sizing: border-box;
  width: 100%;

  margin-top: 2pt;
}

input[type=checkbox],
input[type=radio] {
  float: left;
  margin-right: 4pt;
  width: auto;
}

input[type=file] {
  background-color: transparent;
  border-style: none;
}

form .buttons {
  padding-right: 1em;
  text-align: right;
}

form .buttons a {
  margin-left: 1em;
}

button {
  background-color: #aac;
  border-radius: 4pt;
  border-style: none;

  font-weight: bold;

  height: 24pt;
  line-height: 24pt;
  margin-left: 1em;
  padding: 0 1em;

  cursor: pointer;
}

button:hover {
  background-color: #88a;
}
