@import url(https://fonts.googleapis.com/css?family=Noto+Sans);

html, body{font-family:'Noto Sans';position:relative;width:100%;min-height:100%;margin:0 auto;padding:0;top:0;}
body.nonaktif{overflow:hidden;width:100%;}
input,text,textarea,select{outline:none;border-collapse:collapse;border:1px solid #ccc;}
table{border-collapse;collapse;}
p{font-size:14px;color:#000;text-align:justify;line-height:22px;padding:0px;margin:0px;}
a{text-decoration:none;outline:none;}

h1{margin:0px;padding:0px;}
h2{margin:0px 0px 0px 0px;padding:0px;}
h3{margin:0px;padding:0px;}

#logo{width:100%;background:#000;padding:0px;position:fixed;top:0;z-index:10;}
#logo_wrap{width:95%;text-align:left;padding:10px 0px;}#logo_wrap img{height:60px;width:auto;}

#container{width:100%;margin:0px auto;padding:0px auto;background:#fff;}
#container_wrap{width:95%;padding:0px 0px 0px 0px;position:relative;}

#loginframe{padding-top:200px;}
#loginform{
	border-radius:5px;
	width:400px;
	background-color:#fff;border:1px solid #ccc;
	color:#000;font-size:16px;text-align:left;
}
#loginform input,text,select{width:100%;margin:10px 0px 0px 0px;padding:10px;outline:none;font-size:15px;border:1px solid #ccc;text-align:center;}
#loginform input:focus{border:1px solid #2980b9;background:#e4f4fe;}
#loginform #submit{font-weight:bold;cursor:pointer;border:none;border-radius:30px;background:#27ae60;color:#fff;}#loginform #submit:hover{background:#2ecc71;}
#loginform .notes{line-height:24px;padding:5px 0px;} #loginform .notes b{font-size:16px;} 
#loginform .notes a{color:#27ae60;text-decoration:underline;font-size:13px;}#loginform .notes a:hover{text-decoration:none;color:#2ecc71;}

#notif{width:100%;margin:10px 0px;padding:10px 0px;font-size:14px;text-align:center;font-weight:bold;}
#notif a{font-weight:bold;color:#27ae60;text-decoration:underline;}#notif a:hover{text-decoration:none;color:#2ecc71;}

#button{
	font-size:14px;font-weight:bold;color:#ffffff;font-family:'Noto Sans';
	margin:5px 0px;padding:5px 8px;border:1px solid #2980b9;width:100px;
	cursor:pointer;-moz-border-radius:3px;-webkit-border-radius:3px;
	background-color:#3498db;
}#button:hover{background:#2980b9;}
#button.gray{background-color:#eee;border:1px solid #ccc;font-size:12px;color:#000;margin:0px 0px 0px 0px;}#button.gray:hover{background:#ccc;}
#button.hijau{background-color:#2ecc71;border:1px solid #27ae60;}#button.hijau:hover{background-color:#27ae60;}
#button.merah{background-color:#e74c3c;border:1px solid #c0392b;}#button.merah:hover{background-color:#c0392b;}


#login_cek{
	-moz-border-radius:5px;-webkit-border-radius:5px;
	background-color:#ffffdd;border:2px solid #ffd700;
	width:100%;padding:8px 9px;margin:10px 0px 15px 0px;
	font-weight:bold;font-size:14px;}
#login_cek img{margin-right:0px;margin-bottom:-4px;}
#login_cek a{color:#47a7fe;}
#login_cek a:hover{text-decoration:none;}
#login_cek span{-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#00a8ff;color:#000;padding:3px 5px;}

#info_login{
	width:200px;
	border-bottom:1px solid #cdcdcd;border-left:1px solid #cdcdcd;border-right:1px solid #cdcdcd;
	margin:-25px 0px 20px 0px;padding:5px 0px;
	font-size:11px;color:#666666;font-weight:bold;text-transform:normal;
	-moz-border-radius:0px 0px 5px 5px;-webkit-border-radius:0px 0px 5px 5px;
	background-color:#dddddd;
	background:-moz-linear-gradient(top,#ffffff,#dddddd);
	background:-webkit-gradient(linear,left top,left bottom,from(#ffffff),to(#dddddd));
}

#info{font-size:13px;width:300px;height:105px;
	border:1px solid #cdcdcd;
	margin:15px 15px 10px 0px;padding:10px 20px;
	color:#666666;text-align:left;font-weight:bold;line-height:20px;
	-moz-border-radius:10px;-webkit-border-radius:10px;
	background-color:#eee;
}

#mainmenu {
	background:#b0b0b0;
	min-height:100%;
	position: fixed;
	left:0; top:0;
	padding-top:73px;
	text-align:left;
	z-index:0;width:250px;
}
#mainmenu ul{list-style:none;padding:0px 0px;}
#mainmenu li {padding:18px 0px 18px 35px;font-size:16px;font-weight:bold;border-bottom:1px solid #444;}
#mainmenu a{color:#000;}
#mainmenu img{height:auto;width:18px;margin:0px 15px -3px 0px;}
#mainmenu li:hover{background:#ccc;}
#mainmenu li.selected{background:#eee;}

#content {margin:0px 70px 0px 300px;padding-top:110px;text-align:left;min-height:10px;}

#data{border-collapse:collapse;padding:10px;font-size:13px;border:1px solid #ccc;}#data a{color:#2980b9;}#data a:hover{text-decoration:underline;}#data a img:hover{opacity: 0.70;filter:alpha(opacity=70);}
#tabel_judul{background-color:#dddddd;background:-moz-linear-gradient(top,#f6f6f6,#ddd);background:-webkit-gradient(linear,left top,left bottom,from(#f6f6f6),to(#ddd));font-weight:bold;}#tabel_cell{border:1px solid #ccc;}

#addcell{padding:0px 10px 15px 0px;font-size:15px;color:#444;text-align:center;}#addinput, .tgl{padding:8px 10px;border:1px solid #cbcac9;font-size:12px;font-weight:bold;color:#000;}#addinput:focus, .tgl:focus{border:1px solid #2980b9;background:#e4f4fe;outline:none;}

#halaman{text-align:left;margin:0px;font-size:12px;padding:0px;}#halaman a{border:1px solid #ccc;padding:4px 8px 3px 8px;margin:0px 6px 0px 0px;color:#444;}#halaman a:hover{background:#eee;color:#000;}#halaman a.selected{background:#ccc;border:1px solid #ccc;font-weight:bold;}

#detail a{color:#2980b9;}#detail a:hover{text-decoration:underline;}

#toTop {border:2px solid #3498db;height:40px;width:40px;border-radius:50%;background:none;position:fixed;bottom:10px;right:10px;display:none;cursor:pointer;}
#toTop:hover{background:#3498db;}
#toTop:hover #arrow{border:2px solid #fff;border-left:none;border-bottom:none;}
#arrow{width:10px;height:10px;border:2px solid #3498db;border-left:none;border-bottom:none;transform: rotate(315deg);margin:16px 0px 0px 0px;}

#overlay {display:none;position:fixed;width:100%;height:100%;z-index:100;top:0;overflow:auto;}
#modal{display:table;left:-200px;background-color: #ffffff;}
#modal_box{vertical-align:middle;display:table-cell;text-align:center;position:relative;}
#large_img{padding:20px;}#large_img img{float:left;width:100%;height:auto;}
#close img{float:right;position:fixed;top:20;right:17%;margin:0px 0px 0px 0px;z-index:200;}#close img:hover{opacity: 0.70;filter: alpha(opacity=70);}
#fade {display:none;position:fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 50;opacity: 0.85;filter: alpha(opacity=85);background-color: black;}

#step_tab a{color:#fff;padding:10px;margin-right:2px;background:#7f8c8d;font-size:14px;font-weight:bold;border:1px solid #444;border-bottom:none;letter-spacing:1px;}
#step_tab a:hover{background:#444;text-decoration:none;color:#fff;}#step_tab a.selected{background:#fff;border:1px solid #444;border-bottom:1px solid #fff;color:#c0392b;}
#step_tabb{border-bottom:1px solid #444;padding:0px 0px 9px 0px;}

#filter{margin:0px 0px 5px 0px;}#filter a{border:1px solid #ccc;border-radius:3px;margin:0px 2px 20px 2px;padding:3px 10px;color:#444;text-decoration:none;font-size:14px;line-height:35px;}#filter a.selected{background:#ccc;}

@-moz-document url-prefix() {#step_tabb{padding-bottom:10px;}}

@media only screen and (min-width: 1000px) {.menu_mobile{display:none;}#mobile{display:none;}#sidebar{display:none;}}