@charset "UTF-8";

#page-content {
	height: auto;
}

#login {
	width: 80%;
	margin: 0 auto;
	background-color: #fff;
	padding: 1em;
    padding-bottom: 0;
	font-size: 1.5vw;
}

h2 {
    font-size: 3vw;
    margin: .5em auto;
    text-align: center;
}

label {
	color: var(--pokemon-red);
    text-align: left;
    display: block;
    margin: 2vh 0 1vh;
}

input {
	background-color: #EEE;
	color: #000;
	width: 100%;
	padding: 1em;
	font-size: 1.5vw;
	border: 0.15vw solid var(--pokemon-red);
    border-radius: 0.5em;
}

#submit {
    color: #FFF;
    padding: 1em;
    width: 100%;
    text-align: center;
    border-radius: 0.5em;
    text-transform: uppercase;
    font-family: 'Inter-Bold';
    margin-top: 2.5em;
    font-size: 1.5vw;
	background-color: var(--pokemon-red);
	border: 0.25vw solid var(--pokemon-red);
}
#submit.active {
    color: var(--pokemon-red);
	background-color: #FFF;
}

.button {
    margin-top: 1vh;
}

#err {
    min-height: 2em;
}
.error {
    color: red;
    display: block;
	margin-top: .5em;
}

.nav {
    width: 100%;
    display: flex;
    justify-content: space-around;
    padding-bottom: 5vh;
}

.nav .button {
    width: 30%;
    padding: 0 0 0.3em;
    margin-top: 0;
    font-size: 3vw;
}