.container {
    width:60%;
    height:50vh;
    background-color: transparent;
    margin-left: auto;
    margin-right: auto;
    margin-top:15vh
}

.loginScreen {
    width:45%;
    height:100%;
    background-color: white;
    border: 1px solid black;
    margin-right: auto;
    margin-left: auto;
}


.loginScreen h2 {
    font-family: sans-serif;
    text-align: center;
}

input {
    width:50%
}

label {

    font-family: sans-serif;
    font-weight: bold;
}
.login {
    margin-top: 25%;
}
.email {
    margin-left: 25%
}

.emailLabel {
    margin-bottom: 5px;
}

.password {
    margin-left: 18.6%;
}

.signup {
    width:30%;
    margin-left: 40%;
    font-family: sans-serif;
    font-weight: bold;
    background-color: transparent;
    margin-top: 1vh;
    border: 1px solid black;
    height:5vh;
    font-size: 2vh;
}

.signupHref {
    text-decoration: none; 
    color:black
}

.loginBtn {
    width:30%;
    margin-left: 40%;
    font-family: sans-serif;
    font-weight: bold;
    background-color: transparent;
    margin-top: 1vh;
    border: 1px solid black;
    height:3.5vh;
    font-size: 2vh;
}

.region {
    margin-left: 23%
}

/* MOBILE PAGE */
@media only screen and (max-width: 600px) {
    .container {
        margin-left: 7.5vw;
    }
    .loginScreen {
        width:85vw;
        height:43vh
    }

    .loginBtn {
        width:30%;
        margin-left: 40%;
        font-family: sans-serif;
        font-weight: bold;
        background-color: transparent;
        margin-top: 1vh;
        border: 1px solid black;
        height:3.5vh;
        font-size: 2vh;
    }

    .signup {
        width:50vw;
        margin-left: 20vw;
        margin-top: 1vh;
        height:5vh;
        font-size: 2vh;
    }

    .emailLabel {
        margin-bottom: 5px;
    }

    .password {
        margin-left: 12vw;
    }
    
    .region {
        margin-left: 18vw
    }
    .regionInput {
        margin-top: 5px;
    }
}