.login-page {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  background-color: #eee;

  .login-form-wrapper {
    background-color: #fff;
    box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
    font-family: Arial,Helvetica,sans-serif;
    margin: 0;
    padding: 0;
    text-align: left;
    width: 575px;

    .login-layout {
      position: relative;

      > span {
        position: absolute;
        bottom: 0;
        right: 20px;
        font-size: 11px;
        
        a {
          color: #505050;
        }
      }
    }

    form {
      display: flex;
      position: relative;

      > div {
        input[type="text"],
        input[type="password"] {
          width: 100%;
        }
      }

      .c1 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 30%;
      }

      .c2 {
        width: 70%;
        margin-left: 3.5rem;

        .forgot-password {
          font-size: 11px;
          text-transform: uppercase;
          letter-spacing: .75px;
          text-decoration: none;
        }

        button[type="submit"] {
          background-color: #9FBF0C;
          border: 1px solid #9FBF0C;
          padding: 1px 16px 3px;
          font-size: 13px;;
          width: 100px;
          height: 35px;
          color: #fafafa;
          border-radius: 3px;

          &:hover {
            border: 1px solid #C0E60F;
            background-color: #C0E60F;
            color: #555;
          }

          .disabled {
            cursor: not-allowed;
          }
        }

        div.error-message {
          margin-top: 1rem;
          color: #BE5ABF;
        }
      }
    }
  }
}