* {
	box-sizing:content-box;
}
html	{
		background-image:url(../image/background.gif);
		background-size:cover;
}
body	{
	font-family: "open sans", "segoe ui";
}
.header	{
	padding-top:1em;
	text-align:center;
}
.content	{
	width:30vw;
	margin:auto;
	background-color:#FFF;
	margin-top:2em;
	
}
.login-form	{
	margin:auto;
	width:25vw;
}
.login-form .input-container {
	width:25vw;
	border-bottom: 1px solid #CCCCCC;
    margin-top: 1em;
    font-size: 1.25em;
    color: #9e9e9e;
	padding-bottom: 0.5em;
}
.login-form .input {
	width:75%;
	border:0;
}
.login-form .input:focus {
    outline: none;
}
.login-form .rememberme-container {
	margin-top: 1em;;
	padding: 0;
}
.login-form .rememberme-container input {
	margin-left: 0;
}
.login-form .rememberme span {
	vertical-align: top;
}
.login-form .button {
	margin-top: 1em;
    width:auto;
    background: #2e7ec7;
    border: 0;
    color: #FFFFFF;
    padding: 0.7em;
    font-size: 1em;;
	cursor: pointer;
	transition: background .3s;
}
.form_button	{
	width:100%;
	text-align:center;
}
.login-form .button:hover {
	background: #1f6eb7;
}
.login-form .button:focus {
	outline: none;
}
.login-form .register {
	width:auto;
	margin-top: 1em;
    background: #CCCCCC;
    border: 0;
    color: #676464;
    padding: 0.7em;
    font-size: 1em;
    display: block;
    text-align: center;
}
.login-form .register:hover	{
	background: #b7b7b7;
}
.form_button	{
	margin-bottom:1em;
}
.footer {
	margin:1em;
	text-align:center;
}
.footer p	{
	color:#FFF;
	font-family:Verdana, Geneva, sans-serif;
	font-size:100%;
}
.error	{
	color:#FFF;
}
@media screen and (max-width: 600px) {
.content	{
	width:50vw;	
}
.login-form	{
	width:45vw;
}
.login-form .input-container {
	width:45vw;
}
}