textarea {
  @include transition(max-height, $transition-duration--fast);
  min-height: $baseline * 11;
  overflow: hidden;
  resize: none;
  vertical-align: top;

  &.fixed-size {
    min-height: $baseline * 20;
    overflow: auto;
  }
}

.textarea--expand {
  min-height: $baseline * 6;
  max-height: $baseline * 16;
  overflow-y: auto;

  @include viewport--m {
    max-height: $baseline * 18;
  }
}

@include viewport--l {
  textarea {
    min-height: $baseline * 15;

    &.fixed-size {
      min-height: $baseline * 25;
    }
  }
}