.user-container {
  @include container($total-columns);
  padding: 0 $grid-padding;
}

.user-account {
  min-height: 100vh;
  padding-top: 100px;

  @include susy-breakpoint($tablet) {
    padding-top: 120px;
  }
}

.user-onboarding {
  font-size: 1.2rem;

  @include susy-breakpoint($tablet) {
    min-height: 100vh;
    background-image: linear-gradient(to right, $white, $white 50%, $beige 50%);

    h2 {
      font-size: 1.6rem;
    }
  }
}

.user-onboarding-intro {
  @include susy-breakpoint($mobile) {
    @include bleed(0 $gutter-width);
    background: $beige;
    padding: 100px $gutter-width $gutter-width $gutter-width;
  }

  @include susy-breakpoint($tablet) {
    @include span(6 first);
    padding-top: 120px;

    p {
      padding-right: $gutter-width;
    }
  }
}

.user-onboarding-form {
  padding: $gutter-width 0;

  h2 {
    color: $darkGreen;
  }

  @include susy-breakpoint($tablet) {
    padding: 0 $gutter-width;

    @include span(6 last);
    padding-top: 120px;
  }
}