body {background:#253544;background-size:100%;padding:0;margin:0 auto;}

#container {width:100%;height:100%;display:table;position:fixed;text-align:center;}
#containerbox {display:table-cell;text-align:center;vertical-align:middle;font-family:'Roboto Condensed', sans-serif;line-height:1.6;}
#containerbg {width:320px;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;margin:0 auto;background:#fff;color:#000;border-radius:5px;padding:40px;}

#form {margin:0 auto;padding:0;}
#formlogin {width:100%;margin:auto;border-radius:10px;float:none;padding-bottom:10px;}
#formcover {padding:0;}
.formcovertitle {font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;padding:20px 0 0;text-align:center;line-height:1.6;}
.formcoversubtitle {font-weight:700;font-size:20px;font-family:'Roboto Condensed', sans-serif;color:#253544;padding-bottom:15px;line-height:1.6;}
.formcovertitles {font-weight:400;font-size:20px;font-family:'Roboto Condensed', sans-serif;padding:20px 0 0;text-align:center;color:#C00;line-height:1.6;}
.formcoversubtitles {font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;color:#253544;padding-bottom:15px;line-height:1.6;}
.formcoverinput {width:100%;padding:10px;margin:5px 0;border:1px solid #ddd;background:#fff;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;color:#999;text-align:center;border-radius:3px;line-height:1.6;box-sizing:border-box;}
.formcoverinput:focus {background:#fff;color:#253544;border:1px solid #253544;outline:none;}
.formcoverbuttontombol {margin:0;padding:0;line-height:1.6;}
.formcoverbutton {margin:0;padding:0;}

#copyright {width:100%;height:auto;text-align:center;padding-bottom:20px;font-size:13px;line-height:1.6;}
.copyrightlink {margin:10px 0;}
.copyrightlink a {text-decoration:none;color:#253544}
.copyrightlink a:hover {color:#C00}
.copyrightcopy {padding:5px 0;}
.copyrightdeveloped {width:100%;height:auto;text-align:center;line-height:1.6;}
.copyrightdeveloped a {color:#000;text-decoration:none;}
.copyrightdeveloped a span {color:#C00;text-decoration:none;}

@media screen and (max-width:960px)
{
	body {background:#253544;background-size:100%;padding:0;margin:0 auto;}

	#container {width:100%;height:100%;display:table;position:fixed;text-align:center;}
	#containerbox {display:table-cell;text-align:center;vertical-align:middle;font-family:'Roboto Condensed', sans-serif;}
	#containerbg {width:80%;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;margin:0 5%;background:#fff;color:#000;border-radius:5px;padding:5%;}
	
	#form {margin:0 auto;padding:0;}
	#formlogin {width:100%;margin:0 auto;border-radius:10px;float:none;padding-bottom:10px;}
	#formcover {padding:0;}
	.formcovertitle {font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;padding:20px 0 0;text-align:center;}
	.formcoversubtitle {font-weight:700;font-size:20px;font-family:'Roboto Condensed', sans-serif;color:#253544;padding-bottom:15px;}
	.formcovertitles {font-weight:400;font-size:20px;font-family:'Roboto Condensed', sans-serif;padding:20px 0 0;text-align:center;color:#C00;}
	.formcoversubtitles {font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;color:#253544;padding-bottom:15px;}
	.formcoverinput {width:100%;padding:10px;margin:5px 0;border:1px solid #ddd;background:#fff;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;color:#999;text-align:center;border-radius:3px;line-height:1.6;box-sizing:border-box;}
	.formcoverinput:focus {background:#fff;color:#253544;border:1px solid #253544;outline:none;}
	.formcoverbuttontombol {margin:0;padding:0;}
	.formcoverbutton {margin:0;padding:0;}
	
	#copyright {width:100%;height:auto;text-align:center;padding-bottom:20px;font-size:13px;}
	.copyrightlink {margin:10px 0;}
	.copyrightlink a {text-decoration:none;color:#253544}
	.copyrightlink a:hover {color:#C00}
	.copyrightcopy {padding:5px 0;}
	.copyrightdeveloped {width:100%;height:auto;text-align:center;}
	.copyrightdeveloped a {color:#000;text-decoration:none;}
	.copyrightdeveloped a span {color:#C00;text-decoration:none;}
}

.loginbutton {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #253544), color-stop(1, #253544));
	background:-moz-linear-gradient(top, #253544 5%, #253544 100%);
	background:-webkit-linear-gradient(top, #253544 5%, #253544 100%);
	background:-o-linear-gradient(top, #253544 5%, #253544 100%);
	background:-ms-linear-gradient(top, #253544 5%, #253544 100%);
	background:linear-gradient(to bottom, #253544 5%, #253544 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#253544', endColorstr='#253544',GradientType=0);
	background-color:#253544;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:0 solid #253544;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:'Roboto Condensed', sans-serif;
	font-size:15px;
	padding:10px 0;
	text-decoration:none;
	width:100%;
	margin-top:10px;
}
.loginbutton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #2E4255), color-stop(1, #2E4255));
	background:-moz-linear-gradient(top, #2E4255 5%, #2E4255 100%);
	background:-webkit-linear-gradient(top, #2E4255 5%, #2E4255 100%);
	background:-o-linear-gradient(top, #2E4255 5%, #2E4255 100%);
	background:-ms-linear-gradient(top, #2E4255 5%, #2E4255 100%);
	background:linear-gradient(to bottom, #2E4255 5%, #2E4255 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2E4255', endColorstr='#2E4255',GradientType=0);
	background-color:#2E4255;
}
.loginbutton:active {
	position:relative;
	top:1px;
}
