.login-page-container {
  background-color: $color-background-grey;
  font-family: DINProBold, Arial, sans-serif;
  
  .login-body-container {
    width: 505px;
    max-width: 505px;
    margin: auto;
    padding: 30px;
    min-height: calc(100vh - 400px);
    position: relative;
    top: 100px;
  }

  h3 {
    text-align: center;
    font-size: 24px;
    font-family: "DIN Pro", Arial, sans-serif;
  }

  h4 {
    text-align: center;
    font-size: 20px;
    font-family: DINProBold, Arial, sans-serif;
  }

  a {
    font-size: 20px;
    color: $color-dessa-blue;
    font-weight: 500;
  }

  form {
    background-color: #fff;
    border-radius: 5px;
    padding: 30px;
    padding-top: 60px;
    height: 250px;
    -webkit-box-shadow: 1px 4px 5px 1px #c3c3c3;
    -moz-box-shadow: 1px 4px 5px 1px #c3c3c3;
    box-shadow: 1px 4px 5px 1px #c3c3c3;
    ul {
      width: 300px;
      margin: 0 auto;
      padding: 0;
      li {
        margin-bottom: 30px;
        width: 100%;

        .login-form-password, .login-form-username {
          height: 35px;
          border: 1px solid #e4e4e4;
          font-size: 18px;
          padding: 4px;
          padding-left: 60px;
        }

        .login-form-username {
          background: url('../assets/svgs/user.svg') no-repeat 15px 7px;
        }

        .login-form-password {
          background: url('../assets/svgs/key.svg') no-repeat 15px 15px;
        }

        input {
            width: 78.5%;
            border-radius: 5px;
            display: inline-block;
            &:focus {
              outline: none;
              box-shadow: 0 0 1pt 1pt rgba(75, 92, 240, 1);
            }
            &::placeholder {
              color: #999999;
            }
          }

        .auth-error {
          color: #ce5555;
          font-size: 18px;
          text-align: center;
          margin: 0 auto;
          padding: 0;
        }
        &:last-child {
          margin: 0;
        }
 
        }
        .login-submit {
        width: 100%;
        height: 50px;
        border-radius: 5px;
        background-color: $color-dessa-blue;
        color: #fff;
        font-size: 18px;
        border: none;
        letter-spacing: 0.8px;
        &:hover {
          background-color: $color-hover-blue;
          cursor: pointer;
        }
      }
    }
  }
  
}