body {background-color:#373f43;position:relative;min-height:600px;}

#body {position:relative;}

#other {position:fixed;width:100%;left:0;bottom:12px;padding:0 12px;box-sizing:border-box;}
#other a {filter:alpha(opacity=80);-moz-opacity:0.8;-khtml-opacity:0.8;opacity:0.8;color:#fff;text-decoration:none;}
#other a:hover, #other a.active {filter:alpha(opacity=100);-moz-opacity:1.0;-khtml-opacity:1.0;opacity:1.0;}
#other a.creator {float:left;font-family:'Open Sans',Sans-serif;font-size:16px;font-weight:800;}
#other .version {float:right;font-family:'Open Sans',Sans-serif;font-size:12px;font-weight:400;color:#fff;}

#page {position:relative;margin:0 auto;width:980px;padding:150px 0 65px 0;}
#page .logo {margin:0 auto;padding:0 0 24px 0;color:#fff;text-align:center;}
#page .logo .icon {width:10%;max-width:100px;display:block;margin:0 auto 48px auto;}
#page .logo .text {width:100%;max-width:250px;display:block;margin:0 auto 48px auto;}

#page #login, #page #passwordreset {position:relative;margin:0 auto;width:400px;-webkit-border-radius:24px;-khtml-border-radius:24px;-moz-border-radius:24px;border-radius:24px;background:#fff;-webkit-box-shadow:11px 11px 14px rgba(50, 50, 50, 0.5);-moz-box-shadow:11px 11px 14px rgba(50, 50, 50, 0.5);box-shadow:11px 11px 14px rgba(50, 50, 50, 0.5);}
#page #passwordreset {height:200px;}
#form_login, #form_passwordreset {width:352px;padding:24px;text-align:center;}
#form_login *, #passwordreset * {font-weight:400;color:#666;font-family:'Open Sans',Sans-serif;}
#passwordreset strong {font-size:20px;text-align:center;display:block;margin-bottom:24px;}
#form_login .input, #passwordreset .input {width:338px;border:1px solid #dcdcdc;padding:5px;font-size:16px;color:#000;margin-bottom:12px;outline-style:none;}
#form_login .checkbox {float:left;margin-right:5px;margin-bottom:12px;}
#form_login .minilabel {float:left;font-size:14px;padding-top:1px;font-weight:300;}
#form_login .failed {font-size:14px;color:#f00000;}
#form_login_submit, #form_reset_submit {display:inline-block;font-size:16px;color:#fff;background:#63b32e;padding:8px 12px;margin-top:35px;border:0;-webkit-border-radius:8px;-khtml-border-radius:8px;-moz-border-radius:8px;border-radius:8px;cursor:pointer;outline-style:none;}
#page #login .forgot {position:absolute;bottom:-32px;left:24px;font-weight:300;color:#fff;text-decoration:none;font-family:'Open Sans',Sans-serif;filter:alpha(opacity=80);-moz-opacity:0.8;-khtml-opacity:0.8;opacity:0.8;}
#page #login .forgot:hover {filter:alpha(opacity=100);-moz-opacity:1.0;-khtml-opacity:1.0;opacity:1.0;}
#form_login .error .input {border:1px solid #ee0000;color:#ee0000;}

#page #imprint, #page #legal, #page #whatsapliko {position:relative;margin:0 auto;width:800px;-webkit-border-radius:24px;-khtml-border-radius:24px;-moz-border-radius:24px;border-radius:24px;background:#fff;-webkit-box-shadow:11px 11px 14px rgba(50, 50, 50, 0.5);-moz-box-shadow:11px 11px 14px rgba(50, 50, 50, 0.5);box-shadow:11px 11px 14px rgba(50, 50, 50, 0.5);}
#page #imprint .content, #page #legal .content, #page #whatsapliko .content {padding:40px;color:#666;font-family:'Open Sans',Sans-serif;font-size:14px;}
#page .back {position:absolute;bottom:-32px;left:24px;font-weight:300;color:#fff;text-decoration:none;font-family:'Open Sans',Sans-serif;filter:alpha(opacity=80);-moz-opacity:0.8;-khtml-opacity:0.8;opacity:0.8;}
#page .back:hover {filter:alpha(opacity=100);-moz-opacity:1.0;-khtml-opacity:1.0;opacity:1.0;}

@media (max-width: 980px)
{
	#page {width:100%;}
	#page #login, #page #passwordreset {width:50%;margin:0 25%;}
	#form_login, #form_passwordreset {width:90%;padding:5%;}
	#form_login .input, #passwordreset .input {width:96%;padding:2%;}
}

@media (max-width: 765px)
{
	#page #login, #page #passwordreset {width:90%;margin:0 5%;}
}