body {background:#fff;background-size:100%;padding:0;margin:0 auto;line-height:1.5;}

.clearfix:after {clear:both;content:".";display:block;height:0;visibility:hidden;}

#bgcontainer {width:100%;height:100%;display:table;position:fixed;text-align:center;}
#bocontainer {display:table-cell;text-align:center;vertical-align:middle;font-family:'Roboto Condensed', sans-serif;}
#cocontainer {width:100%;margin:0 auto;padding:0;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;background:#FFF;color:#000;border-radius:10px;display:inline-flex;align-items:center;}

#containerleft {width:25%;float:left;margin:0 auto;padding:0 65px;}
#containerrite {width:75%;float:left;}
.containerriteimg {width:100%;height:auto;overflow:hidden;}
.containerriteimg img {width:140%;height:auto;}

#form {margin:0 auto;padding:0;}
#formlogin {width:100%;margin:auto;border-radius:10px;float:none;padding-bottom:10px;}
#formcover {padding:0;}
.formcovertitle {margin:0 auto 20px;padding:20px 0 0;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;text-align:center;}
.formcovertitle img {width:80%;height:auto;}
.formcoversubtitle {font-weight:700;font-size:18px;font-family:'Roboto Condensed', sans-serif;color:#253544;padding-bottom:15px;}
.formcovertitles {font-weight:700;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%;margin:5px auto;padding:12px 0;border:none;border:1px solid #ddd;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;text-align:center;border-radius:2px;}
.formcoverinput:focus {background:#fff;color:#000;outline:none;border-bottom:1px solid #253544;}
.formcoverbuttontombol {margin:0;padding:0;}
.formcoverbutton {margin:0;padding:0;}

#copyright {width:100%;height:auto;text-align:center;padding-bottom:20px;font-size:14px;}
.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:#FFF;
	font-weight:700;
	font-size:14px;
	font-family:'Roboto Condensed', sans-serif;
	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, #1B2833), color-stop(1, #1B2833));
	background:-moz-linear-gradient(top, #1B2833 5%, #1B2833 100%);
	background:-webkit-linear-gradient(top, #1B2833 5%, #1B2833 100%);
	background:-o-linear-gradient(top, #1B2833 5%, #1B2833 100%);
	background:-ms-linear-gradient(top, #1B2833 5%, #1B2833 100%);
	background:linear-gradient(to bottom, #1B2833 5%, #1B2833 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1B2833', endColorstr='#1B2833',GradientType=0);
	background-color:#1B2833;
}
.loginbutton:active {
	position:relative;
	top:1px;
}
@media screen and (max-width:990px)
{
	body {background:#fff;background-size:100%;padding:0;margin:0 auto;line-height:1.5;}

	#bgcontainer {width:100%;height:auto;display:block;position:fixed;text-align:center;}
	#bocontainer {display:table-cell;text-align:center;vertical-align:middle;font-family:'Roboto Condensed', sans-serif;}
	#cocontainer {width:100%;margin:0 auto;padding:0;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;background:#FFF;color:#000;border-radius:10px;display:inline-block;align-items:center;}

	#containerleft {width:80%;float:left;margin:0 auto;padding:5% 10%;}
	#containerrite {width:100%;float:left;}
	.containerriteimg {width:100%;height:auto;overflow:hidden;}
	.containerriteimg img {width:110%;height:auto;}
	
	#form {margin:0 auto;padding:0;}
	#formlogin {width:100%;margin:0 auto;border-radius:10px;float:none;padding-bottom:10px;}
	#formcover {padding:0;}
	.formcovertitle {margin:0 auto 20px;padding:20px 0 0;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;text-align:center;}
	.formcovertitle img {width:100%;height:auto;}
	.formcoversubtitle {font-weight:700;font-size:18px;font-family:'Roboto Condensed', sans-serif;color:#253544;padding-bottom:15px;}
	.formcovertitles {font-weight:700;font-size:20px;font-family:'Roboto Condensed', sans-serif;padding:20px 0 0;text-align:center;color:#990000;}
	.formcoversubtitles {font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;color:#253544;padding-bottom:15px;}
	.formcoverinput {width:100%;margin:5px auto;padding:12px 0;border:none;border:1px solid #ddd;font-weight:400;font-size:15px;font-family:'Roboto Condensed', sans-serif;text-align:center;border-radius:2px;}
	.formcoverinput:focus {background:#fff;color:#000;outline:none;border-bottom:1px solid #253544;}
	.formcoverbuttontombol {margin:0;padding:0;}
	.formcoverbutton {margin:0;padding:0;}
	
	#copyright {width:100%;height:auto;text-align:center;padding-bottom:20px;font-size:14px;}
	.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:#FFF;
		font-weight:700;
		font-size:14px;
		font-family:'Roboto Condensed', sans-serif;
		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, #1B2833), color-stop(1, #1B2833));
		background:-moz-linear-gradient(top, #1B2833 5%, #1B2833 100%);
		background:-webkit-linear-gradient(top, #1B2833 5%, #1B2833 100%);
		background:-o-linear-gradient(top, #1B2833 5%, #1B2833 100%);
		background:-ms-linear-gradient(top, #1B2833 5%, #1B2833 100%);
		background:linear-gradient(to bottom, #1B2833 5%, #1B2833 100%);
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1B2833', endColorstr='#1B2833',GradientType=0);
		background-color:#1B2833;
	}
	.loginbutton:active {
		position:relative;
		top:1px;
	}
}