:local {
  /* calculate padding based on height, line height and border */ }
  :local select {
    background: url("./selectArrows.svg") no-repeat;
    appearance: none;
    background-position: 99%;
    background-size: contain; }
    :local select.input {
      padding-right: 24px; }
  :local select::-ms-expand {
    display: none; }
  :local .form-fields-container {
    margin-bottom: 18px;
    vertical-align: top;
    position: relative; }
  :local .label {
    display: block;
    margin-bottom: 0;
    color: #33334b;
    font-size: 1rem;
    line-height: 1.3;
    font-weight: bold; }
  :local .label-note {
    font-weight: normal; }
  :local .input {
    background-color: #fff;
    border: 1px solid #9999a5;
    border-radius: 3px;
    color: #33334b;
    display: block;
    height: 42px;
    padding-right: 12px;
    padding-left: 12px;
    padding-top: 19.35px;
    padding-bottom: 19.35px;
    width: 100%;
    font-size: 1rem;
    line-height: 1.3; }
    :local .input.is-small {
      height: 36px;
      padding-top: 8px;
      padding-bottom: 8px;
      line-height: 18px; }
    :local .input[disabled] {
      background-color: #f0f0f0;
      border: 1px solid #e6e6e9;
      color: #e6e6e9; }
      :local .input[disabled]::placeholder {
        color: #e6e6e9; }
      :local .input[disabled]::selection {
        background-color: transparent;
        color: inherit; }
    :local .input[readonly] {
      padding-left: 0;
      background-color: transparent;
      border-color: transparent;
      box-shadow: none;
      color: #33334b; }
    :local .input::placeholder {
      color: #9999a5; }
    :local .input.is-error {
      border-color: #d10202;
      color: #d10202; }
    :local .input:focus {
      outline: none;
      border-color: #0098ee; }
  :local textarea.input {
    height: auto; }
  :local .text-error {
    color: #d10202; }
  :local .label-optional {
    color: #33334b;
    font-size: 1rem; }
  :local .field-error-message {
    display: block;
    position: absolute;
    top: 100%;
    color: #d10202;
    font-size: 0.75rem;
    line-height: 1.3; }
  :local .input-wrapper {
    position: relative;
    display: table;
    border-collapse: separate; }
    :local .input-wrapper .input-addon {
      background-color: #fff;
      border: 1px solid #9999a5;
      border-radius: 3px;
      box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2);
      color: #33334b;
      display: table-cell;
      padding: 12px 12px;
      font-size: 1rem;
      line-height: 1.3;
      text-align: center;
      width: 1%;
      white-space: nowrap;
      vertical-align: middle; }
    :local .input-wrapper .input-addon:first-child {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
      border-right: 0; }
    :local .input-wrapper .input-group {
      margin-bottom: 0; }
      :local .input-wrapper .input-group input {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0; }
