body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

.page-container {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	min-height: 100%;
}

.welcome {
	text-align: center;
	font-size: 24px;
	margin-top: 2.5%;
	margin-bottom: 0;
}
p.welcome {
	margin-top: 0;
}

.login {
	display: flex;
	margin: 2.5% 15% 5% 15%;
}
.login-box, .reg-box {
	flex: 1;
	margin: 0% 2.5% 2.5% 2.5%;
	padding: 1.5% 2.5% 5% 2.5%;
	background-color: #ebe3e1;
	border: 1.5px solid #a28c8a;
	border-radius: 5px;
	box-shadow: -1.5px 1.5px 5px 2px rgba(0,0,0,0.2);
}
.login-box form {
	display: flex;
	flex-direction: column;
	width: 200px;
}
form input, form select {
	margin-bottom: 12px;
}

form input:not(.check), form select {
	width: 100%;
	height: 25px;
	margin-bottom: 12px;
}

.reg-box form {
	display: flex;
	flex-direction: column;
	width: 750px;
}
.reg-box .form-button {
	width: 160px;
}

.submit {
	padding: 4px;
}
input, select {
	padding: 4px;
}
label {
	margin-bottom: 4px;
}

/*
body {
			width: 100%;
			height: 100%;
			margin: 0;
			padding: 0;
			background-color: #ebe3e1;
		}

		.page-container {
			position: absolute;
			
			display: flex;
			flex-direction: column;

			width: 100%;
			height: 100%;
		}


		.login {
			display: flex;

			margin: 5% 15% 5% 15%;
		}

		.login-box {
			flex: 1;
			margin: 0% 2.5% 0% 2.5%;
			padding: 1.5% 2.5% 5% 2.5%;
		}
		.login-box form {
			display: flex;
			flex-direction: column;
			width: 750px;
		}
		form input:not(.check), form select {
			width: 300px;
			height: 25px;
			margin-bottom: 12px;
		}
		.login-box .form-button {
			width: 160px;
		}

		textarea {
			background-color: #f0f0f0;
		}

		p {
			margin-top: 6px;
			margin-bottom: 6px;
		}
*/

/*Galaxy Fold and really small devices*/
@media screen and (max-device-width: 280px) {
	form input:not(.check), form select {
		height: 25px;
		margin-bottom: 12px;
		width: 75%;
	}
}