main {
  &.single-page {
    background-color: white;
    height: 100vh;

    margin: 0 !important;

    img{
      height: 50px;
      position: absolute;
      top: $size-large;
      left: 0;
      right: 0;
      margin: auto;
      @include media-breakpoint-up(lg) {
        height: 90px;
        bottom: $size-large;
        left: $size-large;
        right: unset;
        top: unset;
      }
    }

    .content-wrapper {
      width: 100%;
      height: 100%;
      >div{
        width: 90%;
        padding: $size-medium;
        @include media-breakpoint-up(lg) {
          margin-top: $size-large;
          padding: $size-small*2 $size-small;
          width: 400px;
          margin-right: 20%;
        }
        @include media-breakpoint-up(xl) {
          margin-right: 18%;
        }
        @include media-breakpoint-up(xxl) {
          padding: $size-medium*2 $size-medium;
          width: 550px;
          margin-right: 19%;
        }
      }

      .form-error{
        margin-top: 0 !important;
        padding-top: 0 !important;
      }

      form {
        width: 100%;
        margin: auto;

        button {
          text-transform: uppercase;
          margin: $size-small auto;
          display: block;
        }

        @include media-breakpoint-up(sm) {
          width: 75%;
        }

        p {
          padding-bottom: $size-medium;
        }
      }

      img {
        display: block;
        width: 100px;
        margin: auto auto $size-large auto;
        @include media-breakpoint-up(sm) {
          width: 150px;
          margin-bottom: $size-large*2;
        }
        @include media-breakpoint-up(lg) {
          width: 190px;
        }
      }
    }

    .auth-link {
      text-align: center;
      text-decoration: none;
      a{
        color: $muted-color;
        font-size: .9em;
      }

      &:hover {
        text-decoration: underline;
      }
    }

    .form-error {
      text-align: center;
      padding: $size-small 0;
      color: $error-color;
    }

    h1 {
      text-align: center;
      margin: 0 auto $size-medium auto;
      font-size: 1.8em;
      display: block;

      span {
        padding-bottom: $size-medium;
        position: relative;

        &:after {
          content: '';
          display: block;
          position: absolute;
          background-color: $theme-color-1;
          height: 2px;
          width: 40%;
          bottom: 0;
          left: 0;
          right: 0;
          margin: auto;
        }
      }

      @include media-breakpoint-up(sm) {
        margin: 0 auto $size-medium auto;
        font-size: 2em;
        padding-bottom: 0;
      }
    }
  }
}