html, body {
    min-height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
.loginForm {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100vw;
    margin: 0;
    min-height: 100vh;
    padding-top: 8rem;
    background-color: black; 
    background-image:
        linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7) 60%, rgba(0, 0, 0, 1) 100%),
        url('../imgs/hl2-bg4.jpeg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center -20rem; /* crop black area from the top of this background image (hl2-bg4.jpeg)*/
    color: rgb(200, 200, 200);
    font-family: "Segoe UI Light", sans-serif;
    font-size: 1.2rem;
    }

.loginDiv {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    width: 15rem;
    border: 2px solid #3333337e;
    border-radius: 10px;
    background: linear-gradient(rgba(20, 20, 20, 0.40), rgba(0, 0, 0, 0.7));
    padding: 4rem 8rem 3rem 8rem;
    gap: 0.3rem;
    }
.loginDiv > input {
    width: 15rem;
    padding: 5px;
    border-radius: 10px;
    font-size: 1rem;
    }
.loginDiv > label {
    text-align: center;
    margin-top: 1.2rem;
    margin-bottom: 0.5rem;
    }
      
.loginDiv > button {
    margin-top: 3rem;
    background: linear-gradient(to bottom, orange, darkorange);
    color: rgb(0, 0, 0);
    border: none;
    border-radius: 10px;
    padding: 10px 15px;
    cursor: pointer;
    margin-bottom: 1rem;
    font-size: 1.2rem;
    }
.loginDiv > button:hover {
    background: linear-gradient(darkorange);
    }
#Orange {color:orange;}
a { text-decoration: none; color : inherit; border: 0px; -moz-outline-style: none;}
a:active, a:hover { text-decoration: underline;text-decoration-thickness:2px;border: 0px; -moz-outline-style: none;}
a:focus { outline: none;-moz-outline-style: none;}
      
/* Make loginForm and its content larger for mobile */

      @media only screen and (max-width: 1000px) {
        .loginForm {
          width: 100%;
          font-size: 3rem;
        }
        .loginDiv > button {
            margin-top: 2em;
            font-size: 2.5rem;
          }
        .loginDiv {
            font-size: 1em;
            width: 10em;
            gap: 2rem;
        }
        .loginDiv > input {
            width: 10em;
            padding: 5px;
            border-radius: 10px;
            font-size: 0.8em;
        }

      }