.form-row
  +grid-row(nest)
  .form-label
    @media #{$small-only}
      +grid-column($columns:10, $center:true)
    @media #{$medium-only}
      +grid-column($columns:4, $offset:1)
    @media #{$large-up}
      +grid-column(3)
  .form-field
    @media #{$small-only}
      +grid-column($columns:10, $center:true, $last-column:true)
    @media #{$medium-only}
      +grid-column($columns:4, $last-column:true)
    @media #{$large-up}
      +grid-column($columns: 3, $last-column:true)
    &.full
      @media #{$large-up}
        +grid-column($columns: 9, $last-column:true)
  .error-message
    color: $alert-color
  &.form-actions
    padding-top: 12px

.form-errors
  $form-error-color: #822
  color: $form-error-color
  h3
    color: $form-error-color
    font-size: 1.2em
// Temporary hack for some forms
.control-group
  .controls
    .error
      // compensate the margin-bottom of the input above
      margin-top: -16px
body
  label
    &.number
      display: inline-block
      padding: 4px 10px
  input
    &.number
      width: 60px
      display: inline-block
  .apply-filter
    +button($bg: $primary-color, $padding: $button-tny)
  .error
    input, textarea
      border-color: $alert-color
  .new-session-button
    +button
  input[type="number"]
    text-align: right