/* -- General */
	
input[type="text"],
input[type="password"] {
	width: 100%;
	margin: 10px 0;
	font-size: 1.5rem;
}

input[type="submit"] {
	font-size: 1.5rem;
}



/* -- Logo Box */

.logo_box {
	top: 0;
	right: 0;
	bottom: 0;
	width: 50%;
	background-color: rgba(220,220,220,1);
	 color: #FFF;
}

.logo_box .contain {
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

.logo_box .contain img {
	max-width: 50%;
	max-height: 50%;
}



/* -- Form Box */

.form_box {
	top: 0;
	left: 0;
	bottom: 0;
	width: 50%;
	background-color: #FFF;
	color: #000;
}

.form_box .contain {
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 500px;
	max-width: 80%;
}

.form_box .buttons {
	margin-top: 10px;
}



/* -- Responsive */

@media screen and (max-width: 900px){
	input[type="text"],
	input[type="password"] { font-size: 1.25rem; }
	input[type="submit"] { font-size: 1.25rem; }
}

@media screen and (max-width: 700px){
	.logo_box,
	.form_box { position: relative; top: auto; right: auto; bottom: auto; width: auto; }
	.form_box .contain,
	.logo_box .contain { top: auto; left: auto; transform: none; margin: auto; padding: 25px 0; }
	.logo_box img { height: 50px; }
}

@media screen and (max-width: 500px){
	input[type="text"],
	input[type="password"] { font-size: 1rem; }
	input[type="submit"] { font-size: 1rem; }
}