body { font:13px/1.5 "Century Gothic", Arial, "Trebuchet MS" }
pre, code { font-family:"DejaVu Sans Mono", Menlo, Consolas, monospace }
hr { border:0 #ccc solid; border-top-width:1px; clear:both; height:0 }
h1 { font-size:25px }
h2 { font-size:23px }
h3 { font-size:21px }
h4 { font-size:19px }
h5 { font-size:17px }
h6 { font-size:15px }
h7 { font-size:14px }
ol { list-style:decimal }
ul { list-style:disc }
a { color:#06C; text-decoration:none }
a:hover { text-decoration:underline }
p { margin-bottom:10px }

/******************************************************************/

input, select, textarea {
	margin:0;
	padding:0;
	outline:none
}
input[type=text], input[type=password], textarea { padding:1px 4px; }
input[type=text], input[type=password], select.fm, textarea {
	-moz-border-radius:1px;
	-moz-box-sizing:border-box;
	-webkit-border-radius:1px;
	-webkit-box-sizing:border-box;
	background-color:#fff;
	border:1px solid #d9d9d9;
	border-radius:1px;
	border-top:1px solid #b9b9b9;
	box-sizing:border-box;
	font:400 13px/1.3 arial;
}
input[type=text]:focus, input[type=password]:focus, select.fm:focus, textarea:focus {
	border:1px solid #777;
	box-shadow:0 1px 2px rgba(0,0,0,0.3) inset;
	outline:medium none
}
input.error[type=text], input.error[type=password], select.fm.error, textarea.error, 
input.required[type=text], input.required[type=password], select.fm.required, textarea.required { border:1px solid red }

input.btn, input.btn2, input.btn3, input.btn4, input.dis {
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	color:#fff;
	cursor:pointer;
	font:bold 12px Tahoma;
	letter-spacing:1px;
	padding:4px 6px;
	text-shadow:0 -1px 0 rgba(0,0,0,0.38)
}
input.btn:hover, input.btn2:hover, input.btn3:hover { background-position:100% 100% }

input.btn { background:url(../images/bg_btn_blue_1x100.png) repeat-x 50% 50% scroll transparent; border:1px solid #003C77 }
input.btn:hover { -moz-box-shadow:0 0 3px #003C77; -webkit-box-shadow:0 0 3px #003C77; box-shadow:0 0 3px #003C77 }

input.btn2 { background:url(../images/bg_btn_red_1x100.png) repeat-x 50% 50% scroll transparent; border:1px solid #b80405 }
input.btn2:hover { -moz-box-shadow:0 0 3px #b80405; -webkit-box-shadow:0 0 3px #b80405; box-shadow:0 0 3px #b80405 }

input.btn3 { background:url(../images/bg_btn_green_1x100.png) repeat-x 50% 50% scroll transparent; border:1px solid #014f55 }
input.btn3:hover { -moz-box-shadow:0 0 3px #014f55; -webkit-box-shadow:0 0 3px #014f55; box-shadow:0 0 3px #014f55 }

input.btn4 { background:url(../images/bg_btn_grey_1x100.png) repeat-x 50% 50% scroll transparent; border:1px solid #666; color:#666; text-shadow:0 1px 0 #fff }
input.btn4:hover { -moz-box-shadow:0 0 3px #999; -webkit-box-shadow:0 0 3px #999; background-position:100% 80%; border:1px solid #333; box-shadow:0 0 3px #999; color:#333 }

input.dis { background:url(../images/bg_btn_dis_1x100.png) repeat-x 50% 50% scroll transparent!important; border:1px solid #999!important; color:#666!important }
input.dis:hover { -moz-box-shadow:none!important; -webkit-box-shadow:none!important; box-shadow:none!important; cursor:default!important }

/******************************************************************/

.subbtn-l { text-align:left }
.subbtn-c { text-align:center }
.subbtn-r { text-align:right }
.subbtn-l, .subbtn-c, .subbtn-r { margin-top:10px; }
.subbtn-l a, .subbtn-c a, .subbtn-r a { font:100 12px/1.5 "Century Gothic"; margin:0 5px; }
.subbtn-l ul, .subbtn-c ul, .subbtn-r ul { list-style:none; margin-top:8px }
.subbtn-l ul li, .subbtn-c ul li, .subbtn-r ul li { list-style:none; list-style-position:inside }
.subbtn-l img, .subbtn-c img, .subbtn-r img { cursor:pointer }
.subbtn-r img#load { margin:0 0 -3px 5px }

/******************************************************************/

.spacer-5, .spacer-10, .spacer-15, .spacer-20, .spacer-30, .spacer-40, .spacer-50, .spacer-8, .spacer-16, .spacer-24, .spacer-32 { display:block }
.spacer-5 { height:5px }
.spacer-10 { height:10px }
.spacer-15 { height:15px }
.spacer-20 { height:20px }
.spacer-8 { height:8px }
.spacer-16 { height:16px }
.spacer-24 { height:24px }
.spacer-32 { height:32px }
.spacer-30 { height:30px }
.spacer-40 { height:40px }
.spacer-50 { height:50px }
.clear { clear:both }
.clearfix { zoom:1 }
.clearfix:after { clear:both; }
.clearfix:after, .clearfix:before {
	content:'.';
	display:block;
	overflow:hidden;
	visibility:hidden;
	font-size:0;
	line-height:0;
	width:0;
	height:0;
}

/******************************************************************/

.alert, .errormsg { color:red }
.alert { font:700 Arial }
.errormsg { font:100 11px Arial }
.errormsg.ml { margin-left:10px }
.attention { border:1px dotted #ccc; display:block; margin:10px 0; padding:5px; position:relative }
.attention h3 { color:#333; font:700 12px Arial; letter-spacing:1px }
.attention h3.red { color:red }
.attention h3.box { background-color:#eaeaea; border:1px dotted #333; color:#333; text-shadow:0 1px 0 #fff }
.attention ul, .attention ul li { list-style:none }
.attention ul li { background:url(../images/list2.png) no-repeat 0 -2px scroll transparent; font:400 10px/1.3 arial; padding-left:12px }
.hint { color:#999; font:400 11px/1.2 Arial; margin:0 5px }

/******************************************************************/

#msg-error, #msg-success { font-size:11px; letter-spacing:1px; margin-bottom:10px; padding:5px 10px }
#msg-error { background-color:#FFDFDF; border:1px dotted red; color:red }
#msg-success { background-color:#C6FFC6; border:1px dotted #060; color:#060 }

/******************************************************************/

.curve5-all {
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px
}
.curve5-top {
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
.curve5-bottom {
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

/******************************************************************/

#all { margin:0 auto; width:960px; }

/*--------------------*/

.header { position:relative; }

/*--------------------*/

.container { background-color:#eee; border:1px solid #ccc; position:relative }
.container h6 { font:700 18px/1.3 Arial; letter-spacing:1px; margin-bottom:5px }
.container .c-left { margin-right:242px; border-right:1px solid #eee; }
.container .c-left .cl-left { padding:10px 0 0 10px; margin-right:170px; }
.container .c-left .cl-right { float:right; width:150px; padding:10px; }
.container .c-right { border-left:1px solid #eee; float:right; overflow:hidden; width:242px }

.container {
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px
}


/*--------------------*/

.footer { text-align:center; font:400 11px "Century Gothic"; }
.footer .copyright { font:700 11px arial; letter-spacing:1px }
.footer .menu-foot { text-align:center; margin-top:5px; }
.footer .menu-foot ul li { display:inline; list-style:none; padding:0 7px; border-left:1px solid #ccc; }
.footer .menu-foot ul li:first-child { border-left:none; }
.footer .menu-foot a { color:#999; font:400 11px/1.3 "Century Gothic"; text-decoration:none; }
.footer .menu-foot a:hover { text-decoration:underline; }

/*--------------------*/

.banner { }
.banner2 { margin-bottom:10px; padding:0 10px;  overflow:hidden;}
.banner2 .hyperlink { float:left; width:732px }
.banner2 .hyperlink .image { background-color:#fff; border:1px solid #ccc; padding:3px }
.banner2 .hyperlink img { }
.banner2 .login { float:right; width:198px }
.login { background-color:#fff; border:1px solid #ccc; padding:1px; }
.login h2 {
	background:url(../images/bg_btn_blue_1x100.png) repeat-x 50% 100% scroll transparent;
	color:#fff;
	font:700 13px/1.2 tahoma;
	letter-spacing:1px;
	padding:10px;
	text-align:center;
	text-shadow:0 -1px 0 rgba(0,0,0,0.38)
}

.signin, .username, .password { margin-bottom:10px }
.signin { text-align:right }
.username label,
.password label { display:block; font:400 12px/1.2 "Century Gothic"; margin-bottom:2px }
.username input[type=text],
.password input[type=password] { background-color:#FFFFDF; padding:6px; width:100% }

.login_info { margin-bottom:10px }
.login_info span { border-left:1px solid #069; padding:2px 10px }

/*--------------------*/

.menu-main {
	background:url(../images/bg_btn_blue_1x100.png) repeat-x 50% 100% scroll transparent;
	border:1px solid #069;
	color:#fff;
	margin-bottom:10px;
	padding:10px
}
.menu-main ul { overflow:hidden }
.menu-main ul li { display:inline; float:left; list-style:none; margin-right:3px }
.menu-main ul li a {
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	border:1px solid #005b88;
	color:#fff;
	display:block;
	font:700 12px Arial;
	letter-spacing:1px;
	padding:8px 10px;
	text-decoration:none;
	text-shadow:0 -1px 0 #000
}
.menu-main ul li a:hover,
.menu-main ul li a.active {	background-color:#fff; color:#069; text-shadow:none }

/*--------------------*/

.content { background-color:#fff; overflow:hidden }
.content .menu-sub { margin-bottom:10px; overflow:hidden }
.content .menu-sub ul li { display:inline; float:left; list-style:none; padding-right:7px }
.content .menu-sub ul li a { border:1px solid #fff; display:block; padding:3px 5px }
.content .menu-sub ul li a.active {
	/*-moz-box-shadow:0 0 2px #005078 inset;
	-webkit-box-shadow:0 0 2px #005078 inset;
	box-shadow:0 0 2px #005078 inset;*/
	background:url(../images/bg_btn_blue_1x100.png) repeat-x 50% 100% scroll transparent;
	color:#fff;
	font-weight:700;
	text-shadow:0 -1px 0 rgba(0,0,0,0.38);
}

.content {
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

/*--------------------*/

.box { border:1px dotted #ddd; margin-bottom:10px; padding:10px }
.grp { padding:10px }
.logo {
	border:1px solid #ccc;
	background-color:#fff;
	padding:10px;
	position:absolute;
	overflow:hidden;
	right:10px;
	text-align:center;
	top:-5px;
	width:50px;
	z-index:999;
	/*filter:alpha(opacity=100);
	opacity:1;*/
}
.open { background-color:#eee; border:1px solid #ccc; overflow:hidden; padding:10px; text-align:center }
.visitor { border:1px solid #ccc; margin-bottom:10px; padding:6px; text-align:center }

/*--------------------*/

.page-title { padding:20px; }
.page-title h2 {
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;

	background:url(../images/rightsign.png) no-repeat 0 52% scroll transparent;
	padding-left:15px;
	font-family:"Century Gothic";
	color:#888;
	text-shadow:1px 1px 1px #fff;
}

/*--------------------*/

.sub-topic { margin-bottom:15px; }
.sub-topic h2 {
	display:block;
	background:url(../images/bg_btn_blue_1x100.png) repeat-x 50% 100% scroll transparent;
	color:#fff;
	text-align:center;
	font:700 13px/1.2 Arial;
	padding:7px;
	letter-spacing:1px;
	text-shadow:0 -1px 0 rgba(0,0,0,0.38);
}

/*--------------------*/

.pautan { margin-bottom:10px; padding:6px 0 0 6px }
.pautan ul { overflow:hidden }
.pautan ul li { display:inline; float:left; margin:0 6px 6px 0 }

/*--------------------*/

table.tbl-form, table.tbl-list { border-collapse:collapse }

table.tbl-form thead tr th,
table.tbl-list thead tr th { border-top:3px solid #069; color:#069; font:700 13px/1.2 Arial; letter-spacing:1px }

table.tbl-form thead tr th { padding:10px }
table.tbl-list thead tr th { background-color:#e7e7e7; text-align:left }

table.tbl-form tr th,
table.tbl-form tr td,
table.tbl-list tr th,
table.tbl-list tr td { border:1px solid #ddd; padding:5px }

table.tbl-list tr td { padding:2px 5px }

table.tbl-form tbody tr { background-color:#f7f7f7 }
table.tbl-form tbody tr:hover { background-color:#eee }

table.tbl-list tbody tr { background-color:#fff }
table.tbl-list tbody tr.mm { background-color:#f8f8f8 }
table.tbl-list tbody tr:hover { background-color:#f3f3f3; outline:1px solid #777; }
table.tbl-list tfoot tr td { border:none; padding-top:10px; text-align:center }

table.tbl-list input[type=text],
table.tbl-list select { width:100% }

/*--------------------*/

.data ul li { color:#000; font-family:verdana; font-size:13px; list-style:none; margin:5px 0 }

.pagination { font:normal 12px Tahoma; height:25px; width:800px }
.pagination ul li.inactive,
.pagination ul li.inactive:hover { background-color:#ededed; border:1px solid #bababa; color:#bababa; cursor:default }
.pagination ul li {
	background-color:#f2f2f2;
	border:1px solid #069;
	color:#069;
	float:left;
	font:700 14px/1.3 arial;
	list-style:none;
	margin:0 3px;
	padding:2px 6px
}
.pagination ul li:hover { background-color:#069; color:#fff; cursor:pointer }
.pagination ul li a { font-weight:bold; text-decoration:none }

/*--------------------*/

.div-search {
	border:1px dotted #ccc;
	padding:10px;
	margin-bottom:10px;
}
.div-search span { margin-right:10px; }