@charset "utf-8";
@import "../../theme/scss/01-variables.scss";
@import "../../theme/scss/02-base-reset.scss";
@import "../../theme/scss/03-reset.scss";
@import "../../theme/scss/04-main.scss";

html {
  overflow-x: hidden;
  overflow-y: auto;
}

#login {
  background: transparent;
  bottom: 3%;
  height: 94%;
  left: 10%;
  margin: auto;
  max-width: 480px;
  padding: 16px;
  position: fixed;
  right: 10%;
  top: 3%;
  width: calc(80% - 32px);
  h1 {
    height: 72px;
    margin-bottom: 16px;
    a {
      background-color: transparent;
      background-size: 72px 72px;
      border: 0;
      box-shadow: none;
      margin: 0px auto 10px;
      position: relative;
      width: 150px;
      z-index: 5500;
    }
  }
  .login-message {
    font-size: $smaller-font-size;
  }
  form {
    background: transparent;
    box-shadow: none;
    margin: 0;
    padding: 0;
  }
  input[type=text],
  input[type=password] {
    border: 1px solid $ocean_green;
    box-shadow: none;
    display: inline-block;
    font-size: 1rem;
    height: 32px;
    position: relative;
    width: 100%;
  }
  input[type=checkbox],
  input[type=radio] {
    -moz-appearance: none;
    -webkit-appearance: none;
    box-shadow: none;
    color: $white;
    height: 20px;
    width: 21px;
  }
  input[type=checkbox]:checked:before {
    color: $shark;
    height: 20px;
    line-height: 20px;
    margin: 0;
    text-indent: -7px;
    width: 21px;
  }
  #login_error {
    background: transparent;
    border: 0;
    color: $red;
    margin: 0;
    padding: 0;
  }
}