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

	Title: XENGINE CMS
	Theme: Design 01
	Date: Sept 2009
	Copyright: Departemen Perhubungan Republik Indonesia

***********************************************************************************************

	1. GENERAL

	2. GENERAL ELEMEMENTS

	3. LAYOUT

	4. LAYOUT ELEMENTS

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


/* 1. GENERAL
-----------------------------------------------------------------------------------------------
===============================================================================================*/
/* Global reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd,q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

table {
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
}

body {
	font: 72.5% arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;
}

/* 1.2	Forms
-----------------------------------------------------------------------------------------------*/

input, textarea {
	font: 12px arial,helvetica,clean,sans-serif;
	vertical-align: middle;
}

input, textarea {
	color: #000;
}
select {
	font: 12px arial,helvetica,clean,sans-serif;
	vertical-align: middle;
}
INPUT.field {
	BORDER-BOTTOM: #ccc 1px solid; BORDER-LEFT: #ccc 1px solid; PADDING-BOTTOM: 2px; PADDING-LEFT: 2px; WIDTH: 150px; PADDING-RIGHT: 2px; FONT: 1em Verdana, Arial, Serif; BACKGROUND: url(http://dephub.go.id/image/design13//shadow_top.gif) #fff repeat-x 50% top; BORDER-TOP: #ccc 1px solid; BORDER-RIGHT: #ccc 1px solid; PADDING-TOP: 2px;
}
TEXTAREA {
	BORDER-BOTTOM: #ccc 1px solid; BORDER-LEFT: #ccc 1px solid; PADDING-BOTTOM: 10px; PADDING-LEFT: 10px; WIDTH: 80%; PADDING-RIGHT: 10px; FONT: 1em Verdana, Arial, Serif; BACKGROUND: url(http://dephub.go.id/image/design13//shadow_top.gif) #fff repeat-x 50% top; HEIGHT: 8em; BORDER-TOP: #ccc 1px solid; BORDER-RIGHT: #ccc 1px solid; PADDING-TOP: 10px;
}
.field:focus {
	BORDER-BOTTOM: #999 1px solid; BORDER-LEFT: #999 1px solid; BACKGROUND: url(http://dephub.go.id/image/design13//shadow_top.gif) #fff repeat-x 50% top; BORDER-TOP: #999 1px solid; BORDER-RIGHT: #999 1px solid;
}
TEXTAREA:focus {
	BORDER-BOTTOM: #999 1px solid; BORDER-LEFT: #999 1px solid; BACKGROUND: url(http://dephub.go.id/image/design13//shadow_top.gif) #fff repeat-x 50% top; BORDER-TOP: #999 1px solid; BORDER-RIGHT: #999 1px solid;
}

/*input.field, textarea {
	padding: 2px;
	border: 1px solid #000066;
	background-color: #fff;
}
input.field{
	height: 18px;
	padding: 3px 3px 1px;
}*/
input#search{
	font: 12px arial,helvetica,clean,sans-serif;
	vertical-align: middle;
	height: 18px;
	line-height: 18px;
	border: 1px solid #000066;
	color: #000;
	width: 185px;
}

input.button,
input.checkbox,
input.radio {
	background: transparent none;
	padding: 0;
	color: #000;
}
p,fieldset,table,pre {margin-bottom : 1em;}
blockquote,ul,ol,dl {margin : 1em;}ol,ul,dl {margin-left : 2em;}ol li {list-style  : decimal outside;}ul li {list-style: none;}dl dd {margin-left : 1em;}
input.checkbox,
input.radio {
	margin: 5px;
}
/* Links
-----------------------------------------------------------------------------------------------*/
a {
	color:#5b0202;
	text-decoration: none;
	font-size:10px;
	text-transform:uppercase;
}
a:hover, a:active {
	text-decoration: underline;
	outline: none;
}
/* Firefox Dotted Outline Fix */
a:focus {
	-moz-outline-style: none;
}

/* Miscellaneous
-----------------------------------------------------------------------------------------------*/

hr {
	display: none; }

strong {
	font-weight: bold; }

em {
	font-style: italic; }

abbr, acronym {
	border-bottom: none;
}

blockquote {
	margin: 0 0 0 0;
}

li, th, td {
}

li li, li h3, li p, li input, li select, li textarea {
}

/* 2. GENERAL ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/
.hide {position: absolute;left: -9999px;}
.clear {clear: both;font-size: 0;height: 0;line-height: 0;overflow: hidden;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.clearfix {height: 1%;}
.clearfix {display: block;}

/* 3. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/
/* 12 columns, 80 pixels each, with 2 pixel gutter */
.grid_1{ width:80px;}
.grid_2{ width:162px;}
.grid_3{ width:244px;}
.grid_4{ width:326px;}
.grid_5{ width:408px;}
.grid_6{ width:490px;}
.grid_7{ width:572px;}
.grid_8{ width:654px;}
.grid_9{ width:736px;}
.grid_10{ width:818px;}
.grid_11{ width:900px;}
.grid_12{ width:982px;}

.grid_1a { width:74px;} /*-6*/
.grid_1b { width:35px;} /*(1a-35)*/
.grid_2a { width:156px;} /*-6*/
.grid_3a { width:238px; } /*-6*/
.grid_5a { width:402px;} /*-6*/
.grid_5b { width:438px;} /*(5a)+(1b)*/
.grid_6a { width:484px;} /*-6*/
.grid_8a { width:648px;} /*-6*/
.grid_8b { width:684px;} /*(8a)+(1b)*/
.grid_9a { width:728px;} /*-9*/

.column {
	margin: 0 1px;
	overflow: hidden;
	float: left;
	display: inline;
}
.fixed {
	overflow: hidden;
	float: left;
	display: inline;
}
.row {
	width: 985px;
	margin: 0 auto;
	overflow: hidden;
}
.row .row{
	margin: 0 -1px;
	width: auto;
	display: inline-block;
}
.reposition-left{
	padding-left:2px;
}
.reposition-right{
	padding-right:2px;
}

html
{
	color: #000;
	height: 100%;
	background:#fff !important;
}
body{
	height: 100%;
	scrollbar-3dlight-color: #f0f0ee;
	scrollbar-arrow-color: #676662;
	scrollbar-base-color: #f0f0ee;
	scrollbar-darkshadow-color: #dddddd;
	scrollbar-face-color: #e0e0dd;
	scrollbar-highlight-color: #f0f0ee;
	scrollbar-shadow-color: #f0f0ee;
	scrollbar-track-color: #f5f5f5;
	background:#fff !important;
}
div.page{
	/*width:989px;
	min-width:989px;*/
	margin: auto;
	padding:0;
}
.page_border{
	border:1px solid #271602; border-top:none; border-bottom:none;
}
div.page #placeHolder_Main{
	padding:4px 0;
}

/* Header
-----------------------------------------------------------------------------------------------*/
div.header-id, div.header-en{
	padding:0;
	background:url(http://dephub.go.id/image/design13//header-bg.jpg) repeat-x 0 0;
}
div.header-id .header-logo{
	height:147px;
	background:url(http://dephub.go.id/image/design13//header-t01.jpg) no-repeat 0 0;
}
div.header-en .header-logo{
	height:147px;
	background:url(http://dephub.go.id/image/design13//header-t01en.jpg) no-repeat 0 0;
}
div.header-id .header-left{
	height:147px;
	background:url(http://dephub.go.id/image/design13//header-t02.jpg) no-repeat 0 0;
}
div.header-id .header-right, div.header-en .header-right{
	height:147px; line-height:147px;
	background:url(http://dephub.go.id/image/design13//header-t03.jpg) no-repeat 0 0;
}
div.header-en .header-left{
	height:147px;
	background:url(http://dephub.go.id/image/design13//header-t02en.jpg) no-repeat 0 0;
}
div.header-id .banner, div.header-en .banner{
	text-align:center;
	padding-top:30px;
}

div.header-id img, div.header-en img{
	margin: 0 4px 4px 0;
	padding: 6px;
	border: 1px solid #800d01;
	background-color: #f7c500;
	vertical-align:middle;
}

/* Footer
-----------------------------------------------------------------------------------------------*/
.footer{
	padding:5px 0;
	background-color:#271602;
}
.footer-lb{
	height:9px;
}
.footer-b{
	margin:0 2px;
	height:9px;
}
.footer-rb{
	height:9px;
}
.footer a{
	color:#fff;
}

/* Menu
-----------------------------------------------------------------------------------------------*/
div.menu{
	padding:0;
	height:38px;
	background:url(http://dephub.go.id/image/design13//top-menu-bg.png) repeat -20px 57px;
}
div.menu .part-left{
	padding:0; margin:0;
	height:38px;
}
div.menu .part-right{
	padding:0; margin:0;
	height:38px;
}
div.menu ul {list-style:none;margin:0;padding:0;}
div.menu li.headlink {float:left;height:38px;margin:0;padding:0;text-align:center;}
div.menu li.headlink a {line-height:38px;display:block;padding:0 10px;height:100%;color:#fff;font-weight:bold;letter-spacing:0.09em;text-decoration:none;border-right:1px solid #d9b0b0;}
div.menu li.headlink a.home {border-left:none;}
div.menu li.headlink a {background:url(http://dephub.go.id/image/design13//top-menu-bg.png) repeat 0 0;}
div.menu li.headlink a:hover, li a:focus, li a:active {background-position:-20px 124px;color:#000;}
div.menu #top-menu a {background:url(http://dephub.go.id/image/design13//top-menu-bg.png) repeat -20px 57px;}
div.menu #top-menu a.selected, div.menu #top-menu a.selected:hover, div.menu #top-menu a.selected:focus, div.menu #top-menu a.selected:active {background-position:0px 0px;color:#000;}

/* Menu > Dropdown */
#top-menu ul { list-style: none; position: absolute; display: none; border: 1px solid #6f1212; z-index:1000; text-align:left; padding:0; margin: 0; margin-left:-1px; background:#630c0c;}
#top-menu li.headlink:hover ul { display: block; }
#top-menu li.headlink ul li { clear:both; height: 25px; padding:0; margin: 0; display: block; }
#top-menu li.headlink ul li a { border:none;background:none; padding: 0; margin: 0; display: block; height: 25px; line-height: 25px; width:100%; }
#top-menu li.headlink ul li a:hover { background-color: #3a0c0c; color:#fff; }
#top-menu ul li a:hover { text-decoration: none; }

/* Content
-----------------------------------------------------------------------------------------------*/
div.content{
	background:#fff;
	min-height:400px !important;
}
div.top{
	height:30px; line-height:30px;
	background:url(http://dephub.go.id/image/design13//submenu-bg.png) repeat-x 0 0;
}
.marquee-panel{
	
}
ul.marquee {
	display: block;
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
	position: relative;
	overflow: hidden;
	line-height:30px;
	height:30px;
}
ul.marquee li {
	font-family: Tahoma, Arial, Helvetica, Verdana;
	position: absolute;
	top: -999em;
	left: 0;
	display: block;
	white-space: nowrap;
	text-transform:uppercase;
	color: #000;
	letter-spacing:0.05em;
	line-height:30px;
	height:30px;
	font-size:90%;
}
.language-panel {
	color:#000;
}
.language-panel ul {list-style:none;margin:0;padding:0 5px;}
.language-panel li {float:right;height:33px;margin:0;padding:0 2px;text-align:center;}
.language-panel a, .language-panel a:active, .language-panel a:visited{
	color:#000;
	display:block;
	padding-left:30px;
	background:url(http://dephub.go.id/image/design13//refresh27.png) no-repeat 0 50%;
}

.box-lt{
	background: url(http://dephub.go.id/image/design13//box-lt.png) no-repeat 0 0;
}
.box-t{
	background: url(http://dephub.go.id/image/design13//box-t.png) repeat-x 0 0;
}
.box-rt{
	height:32px;
	background: url(http://dephub.go.id/image/design13//box-rt.png) no-repeat 100% 0;
}

.box-l{
	background: url(http://dephub.go.id/image/design13//box-l.png) repeat-y 0 0;
}
.box-m{
}
.box-m .post-briefcase {
}
.box-r{
	background: url(http://dephub.go.id/image/design13//box-r.png) repeat-y 100% 0;
}

.box-lb{
	background: url(http://dephub.go.id/image/design13//box-lb.png) no-repeat 0 0;
}
.box-b{
	background: url(http://dephub.go.id/image/design13//box-b.png) repeat-x 0 0;
}
.box-rb{
	height:2px;
	background: url(http://dephub.go.id/image/design13//box-rb.png) no-repeat 100% 0;
}

.box-empty{
	margin: 0px 1px;
	border:1px solid #aaaaaa;
}

.box-title{
	text-transform:uppercase;
	color:#fff;
	line-height:28px;
	padding: 0px 5px;
	font-size: 11px;
}
.box-title a{
	color:#fff;
	padding-right:11px;
	background:url(http://dephub.go.id/image/design13//arrow_dotted.gif) no-repeat 100% -0.4em;
}
.box-content{
	padding:5px;
}

.statusmessage{
	font-family: Tahoma, Arial, Helvetica;
	font-size: 11px;
	padding: 8px 8px;
	font-weight: normal;
	letter-spacing: .5px;
	margin: 0;
}
.success{
	color: #333;
	border: solid 1px #69A35E;
	background-color: #99CE9C;
}
.error{
	color: #333;
	border: solid 1px #E25D3D;
	background-color: #e58b76;
}
.warning{
	color: #333;
	border: solid 1px #FFD226;
	background-color: #ffeca3;
}
.information{
	color: #333;
	border: solid 1px #666699;
	background-color: #A3BEEF;
}
.information a{
	color: #666;
}

/* 4. LAYOUT ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/

.banner-top {
	margin: 0 4px 4px 0;
	padding: 4px;
	border: 1px solid #ddd;
	background-color: #f3f3f3;
}
.banner-top img {
	vertical-align: bottom;
}

.box-content ul {
	margin: 0 0 0 .4em;
	padding: 0 0 0 .8em;
}

.box-content ul li {
	margin: 0 0 .4em 0;
	padding: 0 0 0 0;
	list-style-type:square;
}

.post-breadcrumbs{
	padding: 2px 0 5px 18px;
	background: url(http://dephub.go.id/image/design13//page.png) no-repeat 0 50%;
}
.post-page{
	border:1px solid #aaaaaa;
	background: #fff;
	padding: 5px;
	margin-bottom: 2px;
}
.post-row{
	border-bottom: 1px solid #eeeeee;
}
.post-row .post-date, .post-row .post-author{
	color:#838282;
	font-size:10px;
	line-height:16px;
}
.post-row .post-title, .post-row .post-title a{
	font-size:11px;
	line-height:16px;
	font-weight:bold;
}
.post-category-title, .post-category-title a{
	color:#838282;
	font-size:11px;
	line-height:16px;
	text-decoration:none;
	text-transform:capitalize;
}
.post-category-title a:hover{
	text-decoration:underline;
}
.post-title{
	font-weight:bold;
	text-transform:uppercase;
}
.post-tag-date{
	font-style:italic;
	color:#5b0202;
	font-size:10px;
}
.post-briefcase{
	padding-top:10px;
}
.post-body{
	padding-top:10px;
}
.post-page ul {
	margin: 0 0 0 .8em;
	padding: 0 0 0 .8em;
}
.post-page ul li {
	margin: 0 0 .4em 0;
	padding: 0 0 0 0;
	list-style-type:square;
}
.post-page-title{
	margin:0; padding:3px;
	color:#000; font-weight:normal; text-transform:uppercase; font-size:.9em; letter-spacing:.1em;
	border-bottom: 1px solid #eeeeee;
}
.post-page-title a{
	font-size:11px; letter-spacing:.1em;
	padding-left:17px; font-weight:bold;
	background:url(http://dephub.go.id/image/design13//icon-collapsed.gif) no-repeat 3px 50%;
}
.post-page-title a.expanded{
	background:url(http://dephub.go.id/image/design13//icon-expanded.gif) no-repeat 3px 50%;
}
.post-page-title a.dotted{
	background:url(http://dephub.go.id/image/design13//icon-dotted.gif) no-repeat 3px 50%;
}
.dotted-bold{
	font-size:11px; letter-spacing:.1em;
	padding-left:17px; font-weight:bold;
	background:url(http://dephub.go.id/image/design13//icon-dotted.gif) no-repeat 3px 50%;
}
.post-page-title a.dotted:hover{
	text-decoration:none;
	cursor:normal;
}
.post-page-title a.noimg{
	padding-left:5px;
	background:transparent;
}
.row-paging{
	height:30px;
}

a.more{
	padding-right:11px;
	background:url(http://dephub.go.id/image/design13//arrow_dotted.gif) no-repeat 100% -0.4em;
}

.post-briefcase img {
	display: inline;
	margin: 0 2px 2px 0;
	padding: 1px;
	border: 1px solid #ddd;
	background-color: #f3f3f3;
}

.post-body img {
	padding: 4px;
	margin: 0 7px 2px 7px;
	border: 1px solid #ddd;
	background-color: #f3f3f3;
}
.post-body img[align ="left"] {
	display: inline;
	padding: 4px;
	margin: 0 7px 2px 0;
	float:left;
}
.post-body img[align ="right"] {
	display: inline;
	padding: 4px;
	margin: 0 0 2px 7px;
	float:right;
}

.photo-def {
	display: inline;
	margin: 0 3px 2px 0;
	padding: 4px;
	border: 1px solid #ddd;
	background-color: #f3f3f3;
}

/* Button
-----------------------------------------------------------------------------------------------*/
button {
	font:normal 12px Tahoma, Verdana, Arial;
	outline: none;
	border:none;
}
.ui-button {
	margin:0; padding: 0; text-decoration:none; cursor:pointer;
	background: url(http://dephub.go.id/image/design13//bg_button.gif);
	background-position: 0px -68px;
	color: #fff;font-weight: normal;
	outline: none;
}
.ui-button-text {
	outline: 0; margin:0; padding: 0 5px; text-decoration:none;  !important; cursor:pointer; text-align: center;
	height:22px;
}

/* Menu Static
-----------------------------------------------------------------------------------------------*/
div#menu-static {
	line-height:31px;
	border-left:1px solid #803931;
	border-right:1px solid #803931;
	margin:0 2px 1px 2px;
}
div#menu-static .menu-static {
}
div#menu-static .menu-static a, div#menu-static .menu-static a:hover {
	color:#fff;
	font-weight:bold;
	text-transform:uppercase;
	text-decoration:none;
	font-size:12px;
}
div#menu-static .menu-static a{
	background:url(http://dephub.go.id/image/design13//menu_out.png) 0 0;
	display:block;
}
div#menu-static .menu-static a:hover{
	background:url(http://dephub.go.id/image/design13//menu_hover.png) 0 0;
	display:block;
}

div#menu-static-icon {
	margin: 0px 1px;
	padding: 0px;
	border:1px solid #4883d8;
	background:#7aaffa url(http://dephub.go.id/image/design13//rss-bg.png) repeat-x 0 100%;
	color:#000;
}
div#menu-static-icon .menu-static{
	display:inline;
	float:left;
	padding:1px;
}

/* RSS
-----------------------------------------------------------------------------------------------*/
.rss{
	border:1px solid #8e1c00;
	background:#e8a557 url(http://dephub.go.id/image/design13//boxbig-bg.png) repeat-x 0 100%;
	margin:0 2px;
	padding:10px;
	color:#000;
}

/* Slider Rollover
-----------------------------------------------------------------------------------------------*/
.slideshow {
	margin-bottom:2px;
	height:200px;
	position:relative;
}
.slideshow-container{
	border:1px solid #8e1c00;
	height: 100%; overflow: hidden; position: absolute; top: 0; left: 0;
}
.slide {
	background: #e8a557 url(http://dephub.go.id/image/design13//boxbig-bg.png) repeat-x 0 100%;height:100%;
}
.slide .slide-content { padding:10px;overflow:auto;}
.slideshow #thumbNav { position: absolute; right: 5px; bottom:5px; z-index:100; }
.slideshow #thumbNav a { color: #000; font: 11px; display: inline-block; padding: 2px 10px; height: 18px; line-height:18px; margin: 0 1px 0 0; background: #f9f9f9 url(http://dephub.go.id/image/design13//slider-bg-nav.gif) repeat-x 0 100%; text-align: center; border:1px solid #8d8d8d; }
.slideshow #thumbNav a:hover { background-image: none; }
.slideshow #thumbNav a.cur { background: #a03636 url(http://dephub.go.id/image/design13//slider-bg-nav-act.gif) repeat-x 0 100%; border:1px solid #5b0202; color:#fff; }
.slideshow #start-stop { background: transparent url(http://dephub.go.id/image/design13//player-play.png) no-repeat 0 0; padding:0; height: 18px; width: 18px; position: absolute; right: 5px; bottom:8px;}
.slideshow #start-stop.playing { background: transparent url(http://dephub.go.id/image/design13//player-pause.png) no-repeat 0 0; }
.slideshow #start-stop:hover { }

/* Bar Poll Graphs
-----------------------------------------------------------------------------------------------*/
.poll-bar-title {
  line-height: 20px;
  font-weight: normal;
}
.poll-bar-value {
  background-color:#cc4400;
  height: 20px;
	display:block;
}

/* 5. LOGIN PANEL
-----------------------------------------------------------------------------------------------
===============================================================================================*/
#login_panel {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
	margin-left: auto;
	margin-right: auto;
}
#login_panel #log_panel {
	width: 100%;
	height: 50px;
	color: #999999;
	background: #16151d;
	overflow: hidden;
	position: relative;
	z-index: 3;
	display: none;
}
#log_panel .log-content {
	width:1000px;
	min-width:1000px;
	margin: 0 auto;
	padding: 5px 0;
	font-size: 10px;
	background:url(http://dephub.go.id/image/design13//tlogin-panel.png) no-repeat 0 0;
	min-height: 50px;
}
.log-tab {
	background: url(http://dephub.go.id/image/design13//login-tab_b.png) repeat-x 0 100%;
	height: 31px;
	position: relative;
	top: 0;
	z-index: 999;
}
.log-tab ul.btn-cp {
	display: block;
	position: relative;
	float: right;
	height: 31px;
	width: auto;
	font-weight: bold;
	line-height: 31px;
	margin: 0;
	padding: 0;
	color: white;
	font-size: 80%;
	text-align: center;
	right:150px;
}
.log-tab ul.btn-login {
	display: block;
	position: relative;
	float: right;
	height: 31px;
	width: auto;
	font-weight: bold;
	line-height: 31px;
	margin: 0;
	padding: 0;
	color: white;
	font-size: 80%;
	text-align: center;
	right:140px;
}
.log-tab .log-link-bottom {
	height: 20px;
	line-height: 20px !important;
	cursor: pointer;
	display: block;
	position: relative;
	top: 2px;
	text-decoration:none;
}
.log-tab ul.btn-login li.left, .log-tab ul.btn-cp li.left {
	background: url(http://dephub.go.id/image/design13//login-tab_l.png) no-repeat 0 100%;
	height: 31px;
	width: 33px;
	padding: 0;
	margin: 0;
	display: block;
	float: left;
}
.log-tab ul.btn-login li.right, .log-tab ul.btn-cp li.right {
	background: url(http://dephub.go.id/image/design13//login-tab_r.png) no-repeat 0 100%;
	height: 31px;
	width: 33px;
	padding: 0;
	margin: 0;
	display: block;
	float: left;
}
.log-tab ul.btn-login li, .log-tab ul.btn-cp li {
	text-align: left;
	padding: 0 6px;
	display: block;
	float: left;
	height: 31px;
	background: url(http://dephub.go.id/image/design13//login-tab_m.png) repeat-x 0 100%;
}
.log-tab ul.btn-login li a, .log-tab ul.btn-cp li a {
	color: #f8c500;
}
.log-tab ul.btn-login li a:hover, .log-tab ul.btn-cp li a:hover {
	color: white;
}
.log-tab .sep {color:#414141;}
.log-tab a.open, .log-tab a.close {
	height: 20px;
	line-height: 20px !important;
	padding-left: 25px !important;
	cursor: pointer;
	display: block;
	position: relative;
	top: 2px;
	text-decoration:none;
}
.log-tab a.open {background: url(http://dephub.go.id/image/design13//bt_open.png) no-repeat left 0;}
.log-tab a.close {background: url(http://dephub.go.id/image/design13//bt_close.png) no-repeat left 0;}
.log-tab a:hover.open {background: url(http://dephub.go.id/image/design13//bt_open.png) no-repeat left -19px;text-decoration:none;}
.log-tab a:hover.close {background: url(http://dephub.go.id/image/design13//bt_close.png) no-repeat left -19px;text-decoration:none;}
.log-form{
	float: right;
	padding-left: 10px;
}
.log-form div{
	display:inline;
	float:left;
}
.log-content label {
	clear: both;
	display: block;
	height:15px;
	line-height:15px;
}
.log-content input.textfield {
	border: 1px solid #1a1a1a;
	background: #414141;
	margin-right: 5px;
	margin-top: 4px;
	width: 200px;
	color: white;
	font-size: 12px;
	line-height: 16px;
	padding: 1px 3px 3px 3px;
}
.log-content input.textfield:focus {
	background: #545454;
}
.log-content a {
	text-decoration: none;
	color: #15ADFF;
	text-transform: capitalize;
}

.log-content a:hover {
	color: white;
}
.log-content .lost-pwd {
	display: block;
	float:left;
	clear: right;
	padding-top: 3px;
	font-size: 11px;
	text-decoration: none;
	height:24px;
	line-height:24px;
}
.log-content input.bt_white,
.log-content input.bt_blue {
	display: block;
	float: left;
	clear: left;
	font-size: 11px;
	height: 24px;
	text-align: center;
	cursor: pointer;
	border: none;
	font-weight: bold;
	margin-top: 5px;
}
.log-content input.bt_white {
	width: 74px;
	color: black;
	background: transparent url(http://dephub.go.id/image/design13//bt_white.png) no-repeat 0 0;
}
.log-content input.bt_blue {
	width: 94px;
	color: white;
	background: transparent url(http://dephub.go.id/image/design13//bt_blue.png) no-repeat 0 0;
}

/* 6. SEARCH PANEL
-----------------------------------------------------------------------------------------------
===============================================================================================*/
.adv-search-title{
	padding:0; margin:0;
	height: 22px;
	line-height: 22px;
	background:url(http://dephub.go.id/image/design13//mid-line.gif) repeat-x 0 50%;
}
.adv-search-title a{
	font-size:11px; letter-spacing:.1em;
	padding-left:25px; font-weight:bold;
	padding-right:3px;
	height: 22px;
	line-height: 22px;
	float:right;
	background:#fff url(http://dephub.go.id/image/design13//search.png) no-repeat 2px 50%;
}
.adv-search-form{
	padding-bottom:10px;
}

/*========================================*/
a.external{
	background: url("http://dephub.go.id/image/design13//external.png") center right no-repeat;
	padding: 0 13px 0 0;
}
a.external[href $=".ogg"], a.external[href $=".OGG"],
a.external[href $=".mid"], a.external[href $=".MID"],
a.external[href $=".midi"], a.external[href $=".MIDI"],
a.external[href $=".mp3"], a.external[href $=".MP3"],
a.external[href $=".wav"], a.external[href $=".WAV"],
a.external[href $=".wma"], a.external[href $=".WMA"],
.link-audio {
	background: url("http://dephub.go.id/image/design13//audio.png") center right no-repeat;
	padding: 0 13px 0 0;
}
a.external[href $=".ogm"], a.external[href $=".OGM"],
a.external[href $=".avi"], a.external[href $=".AVI"],
a.external[href $=".mpeg"], a.external[href $=".MPEG"],
a.external[href $=".mpg"], a.external[href $=".MPG"],
.link-video {
	background: url("http://dephub.go.id/image/design13//video.png") center right no-repeat;
	padding: 0 13px 0 0;
}
a.external[href $=".pdf"], a.external[href $=".PDF"],
a.external[href *=".pdf#"], a.external[href *=".PDF#"],
a.external[href *=".pdf?"], a.external[href *=".PDF?"],
.link-document {
	background: url("http://dephub.go.id/image/design13//document.png") center right no-repeat;
	padding: 0 12px 0 0;
}

/*+++++++++++++++++++++++++++++*/
.hope-rounded {
	width:100%;
	margin-top:3px;
	padding:3px 0px 3px 0px;
	font-family: Georgia, Trebuchet, sans-serif, "Times New Roman";
	font-size:12px;
	font-weight:normal;
	border: 1px solid #ddd;
	background-color: #f3f3f3;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.report-ico {
	background:url("http://dephub.go.id/image/design13//print19.gif") top left no-repeat;
	min-height:19px;
	padding: 0 0 0 19px;
}

/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; text-transform:uppercase; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}

/* content-fragment-management */
/*

<div class="content-fragment-management">
	<div class="content-fragment-management-header">
		<a class="internal-link delete-content-fragment">Delete</a>
		<a class="internal-link configure-content-fragment">Configure</a>
		Widget Title
	</div>
	<div class="content-fragment-management-content">
		...
		<div class="content-fragment-management-shade"></div>
	</div>
</div>

*/

.content-fragment-management
{
	display: block;
	margin: 5px 0 5px 0;
}

.content-fragment-management.locked
{
}

.content-fragment-management .content-fragment-management-content
{
	overflow: hidden;
	position: relative;
	height: 1%;  /* for IE6 */
	height: auto;
}

.content-fragment-management .content-fragment-management-content .content-fragment
{
	margin: 0 !important;
}

.content-fragment-management-shade
{
	background-image: url('http://dephub.go.id/commons/dximage/webskins/spacer.gif');
	position: absolute;
	top: 0;
	left: 0;
	width: 2000px;
	height: 20000px;
}

.content-fragment-management-header
{
	background: Transparent url('http://dephub.go.id/commons/dximage/webskins/content-fragment-header.gif') no-repeat left top;
	font-weight: bold;
	font-size: 12px !important;
	color: #333;
	cursor: move;
	font-family: Arial, Helvetica;
	margin: 0 26px 0 12px;
	padding: 0 0 0 6px;
	height:30px;
}

.content-fragment-management-header-inner
{
	background: Transparent url('http://dephub.go.id/commons/dximage/webskins/content-fragment-header.gif') no-repeat right top;
	padding: 8px 10px 8px 4px;
	height: 14px;
	overflow: hidden;
	margin-right: -6px;
	width:100%;
}

.content-fragment-management.locked .content-fragment-management-header
{
	cursor: auto;
	color: #999;
}

.content-fragment-management-header a.internal-link
{
	float: right;
	font-size: 12px;
	font-weight: normal;
}

.content-fragment-management .internal-link.configure-content-fragment
{
	width: 12px;
	height: 0;
	padding: 12px 0 0 0;
	overflow: hidden;
	margin: 0 4px;
	background-image: url('http://dephub.go.id/commons/dximage/webskins/configure-content-fragment.gif');
	background-position: left top;
	background-repeat: no-repeat;
}

.content-fragment-management .internal-link.toggle-content-fragment-header
{
	width: 12px;
	height: 0;
	padding: 12px 0 0 0;
	overflow: hidden;
	margin: 0 4px;
	background-image: url('http://dephub.go.id/commons/dximage/webskins/toggle-content-fragment-header.gif');
	background-position: left top;
	background-repeat: no-repeat;
}

.content-fragment-management .internal-link.delete-content-fragment
{
	width: 12px;
	height: 0;
	padding: 12px 0 0 0;
	overflow: hidden;
	margin: 0 4px;
	background-image: url('http://dephub.go.id/commons/dximage/webskins/delete-content-fragment.gif');
	background-position: left top;
	background-repeat: no-repeat;
}

.content-fragment-management-placeholder
{
	display: block;
	border: dashed 1px #333;
	margin: 5px;
	background-color: #ccc;
	height: 1em;
	padding: 7px 4px;
}

@charset "UTF-8";
/* SpryFormValidation.css - version 0.4 - Spry Pre-Release 1.5 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
.textfieldRequiredMsg, 
.textfieldInvalidFormatMsg, 
.textfieldMinValueMsg,
.textfieldMaxValueMsg,
.textfieldMinCharsMsg,
.textfieldMaxCharsMsg,
.textfieldValidMsg {
	display: none;
}
.textfieldRequiredState .textfieldRequiredMsg, 
.textfieldInvalidFormatState .textfieldInvalidFormatMsg, 
.textfieldMinValueState .textfieldMinValueMsg,
.textfieldMaxValueState .textfieldMaxValueMsg,
.textfieldMinCharsState .textfieldMinCharsMsg,
.textfieldMaxCharsState .textfieldMaxCharsMsg
{
	height:20px; width:16px; padding-left:0px; padding-top:2px; margin:0; float:left; display: inline; color: #cc6600;	border:none; vertical-align:middle;
}
.textfieldValidState input, input.textfieldValidState {
	background:#ffffff;
}
input.textfieldRequiredState, .textfieldRequiredState input, 
input.textfieldInvalidFormatState, .textfieldInvalidFormatState input, 
input.textfieldMinValueState, .textfieldMinValueState input, 
input.textfieldMaxValueState, .textfieldMaxValueState input, 
input.textfieldMinCharsState, .textfieldMinCharsState input, 
input.textfieldMaxCharsState, .textfieldMaxCharsState input {
	background:#ffcc00;
}
.textfieldFocusState input, input.textfieldFocusState {
	background:#f7ffe1;
}
.textfieldFlashText input, input.textfieldFlashText {
	color: #990000 !important;
}
.textfieldHintState input, input.textfieldHintState {
	color: #535d1f !important; font-weight:normal;
}

@charset "UTF-8";
/* SpryValidationCheckbox.css - version 0.4 - Spry Pre-Release 1.5 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
.checkboxRequiredMsg, .checkboxMinSelectionsMsg, .checkboxMaxSelectionsMsg{
	display: none;
}
.checkboxRequiredState .checkboxRequiredMsg,
.checkboxMinSelectionsState .checkboxMinSelectionsMsg,
.checkboxMaxSelectionsState .checkboxMaxSelectionsMsg {
	display: inline; color: #cc6600;	border:none; padding-left:0px; margin:0; font-style:italic;
}


@charset "UTF-8";
/* SpryValidationSelect.css - version 0.4 - Spry Pre-Release 1.5 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
.selectRequiredMsg, .selectInvalidMsg {
	display: none;
}
.selectRequiredState .selectRequiredMsg,
.selectInvalidState .selectInvalidMsg {
	height:20px; width:16px; padding-left:0px; padding-top:2px; margin:0; float:left; display: inline; color: #CC6600;	border:none; vertical-align:middle;
}
.selectValidState select, select.selectValidState {
	background-color: #ffffff;
}

select.selectRequiredState, .selectRequiredState select,
select.selectInvalidState, .selectInvalidState select {
	background-color: #ffcc00;
}
.selectFocusState select, select.selectFocusState {
	background-color: #f7ffe1;
}


