@import "media-queries";

.login-wrapper {
  width: 560px;
  margin: 0 auto;
  margin-top: 20px;

  > img {
    margin: 0 auto;
    display: block;
    margin-bottom: 20px;
  }

  .screen-xs {
    display: none;
  }
}

.wrapper .login-wrapper {

  margin-bottom: 100px;

  @include max-screen($screen-xs) {
    width: 320px;

    .screen-xs {
      display: block;
    }

    .screen-lg {
      display: none;
    }
  }
}

.login-wrapper {
  .control-group {
    padding: 10px;
    display: inline-block;
    @extend .col-md-6;

    &.error {
      @extend .alert-danger;
    }

    .help-inline {
      display: block;
    }
  }

  #email, #password {
    @extend .form-control;
  }

  .btn-primary {
    @extend .btn;
  }
}