.locator {
  &__header-wrapper {
    padding-bottom: 40px;

    h2 {
      margin-bottom: 20px;
    }

    p {
      margin-bottom: 0;
      font-size: 1rem;
      line-height: 1.5rem;
      text-align: center;
    }
  }
}

.form-locator-wrapper {
  // No asterisk for required fields on this page
  .form-row__label_required::before {
    content: none;
  }
}

.forms-locator {
  @include make-col(12);

  .form-row__label,
  .form-row__field,
  .form-row__error {
    @include make-col-ready;
  }

  // TODO: delete after adding that control to the elemetns component
  .header-search__submit {
    right: 30px;
  }

  // ie11, edge remove default clear button
  // sass-lint:disable no-vendor-prefixes
  .form-locator__search-inp::-ms-clear {
    display: none;
  }
}

@include media-breakpoint-down(sm) {
  .locator {
    &__header-wrapper {
      padding-bottom: 20px;

      p {
        text-align: left;
        font-size: inherit;
      }
    }
  }

  .forms-locator {
    padding-top: 20px;

    .form-row__label,
    .form-row__field,
    .form-row__error {
      @include make-col(12);
      @include make-col-offset(0);
    }

    .form-row__col-btn {
      @include make-col(12);
      padding: 0;

      &:first-child {
        @include make-col-offset(0);
      }
    }
  }
}
@include media-breakpoint-up(md) {
  .forms-locator {
    .form-row__label,
    .form-row__field,
    .form-row__error {
      @include make-col(10);
      @include make-col-offset(1);
    }

    .form-row__col-btn {
      @include make-col(6);
    }
  }
}

@include media-breakpoint-up(lg) {
  .forms-locator {
    .form-row__label,
    .form-row__field,
    .form-row__error {
      @include make-col(6);
      @include make-col-offset(3);
    }
  }
}

@include media-breakpoint-down(xs) {
  .form-locator-wrapper {
    margin-left: -15px;
    margin-right: -15px;
  }
}