/* CSS Document */
body {
	margin: 0;
	padding: 0;
	font-family: Tahoma, Verdana, Arial, Helvetica;
	font-size: 13px;
	/*background:url(../themes/images/bg.gif) repeat-y center;*/
}
html, body{
	min-height: 100%;
	height:100%;
}
p {
	margin: 0;
	padding: 0;
	margin-bottom: 10px;
}
 {
	font-size: 1.4em;
}
h2 {
	font-size: 1.3em;
}
h3 {
	font-size: 1.2em;
}
h4, h5, h6 {
	font-size: 9px;
}
h1,h2,h3,h4,h5,h6{
	color:#fc0303;
	margin: 0 1px 0 2px;
	text-align: center;
}
/*h4{
	color:#000099;
}
h5{
	color:#000099;
}*/
img {
	border: none;
}
a:link {
	color: #3F4348;
	/*text-decoration: none;*/
}
a:hover {
	color: #2E92CF;
	text-decoration: none;
}
a:active {
	color: #0066CC;
	text-decoration: underline;
}
a:visited {
	color: #50555A; 
	/*text-decoration: none;*/
}
ul {
	list-style: ;
	margin: 0;
	padding: 0;
	}
#paneLogin{
	margin: 0;
	padding: 0;
	font-family: Tahoma, Verdana, Arial, Helvetica;
	font-weight:bold;
	font-size: 11px;

}
#wrapper{
	/*height: 100%;*/
	width: 1024px;
	vertical-align: top;

}

#tdheader {
  background: transparent url(images/penmaru_1.gif) no-repeat;
  center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width:100%;
  height:100px;
}



#header{
	background: transparent url(../themes/images/bgheader.gif) no-repeat;
	
}
#subheader1{
	background: transparent url(../themes/images/ver2_02.gif) no-repeat;
}
#subheader2{
	background: transparent url(../themes/images/bgRight.gif) no-repeat;
}
#header h1{
	height: 97px;
	width: 510px;
	padding: 0 auto;
	margin: 0 auto;
}
#side{
	/*background:url(../themes/images/panelfade.gif) top right repeat-y;*/
	padding: 5px 2px 2px 2px;
		background-color:#b8e5fc;
}
#content{
	padding: 5px 2px 2px 2px;
	background-color:#b8e5fc;
}
#content1{
	padding: 5px 2px 2px 2px;

}

#footer{
	width: 1000px;
	background: transparent url(../themes/images/bgfooter.gif) no-repeat;
	vertical-align:bottom;
}

#titlePanel{
	height: 23px;
	font-family: Tahoma, Verdana, Arial, Helvetica;
	font-weight:bold;
	font-size: 12px;
	color:#224424;	
}

#titleBold{	
	font-family: Tahoma, Verdana, Arial, Helvetica;
	font-weight:bold;
	font-size: 11px;
	color:#224424;	
}

#newsJudul{	
	font-family: Tahoma, Verdana, Arial, Helvetica;
	font-weight:bold;
	font-size: 14px;
	color:#224424;	
}
#newsId{	
	font-family: Tahoma, Verdana, Arial, Helvetica;
	font-size: 9px;
	color:#FF9933;	
}
#newsShoot{	
	font-family: Tahoma, Verdana, Arial, Helvetica;
	font-size: 11px;
	color:#000000;	
}
#newsLink{	
	font-family: Tahoma, Verdana, Arial, Helvetica;
	text-align:right;
	font-size: 11px;
	color:#000000;	
}
#toprightpane{	
	background: transparent url(../themes/images/welcome.gif) repeat-x;
	vertical-align:bottom;
}
.tab-sub-pane {
   height: 15px;
   margin: 0px;
   padding: 0px;
}

a.tab-sub-menu {
    text-decoration:none;
    font-size:10px;
    color: #000000;
}

a.tab-sub-menu:link {
    font-size: 10px;
}

a.tab-sub-menu:visited {
    font-size: 10px;
}

a.tab-sub-menu:hover {
    font-size: 10px;
  color: #425E0C;
}

a.tab-sub-menu:active {
    font-size: 10px;
  color: #ebebeb;
}

a.tab-sub-menu-active {
    font-size: 10px;
    color: white;
}

a.tab-sub-menu-active:link {
    font-size: 10px;
}

a.tab-sub-menu-active:visited {
    font-size: 10px;
}

a.tab-sub-menu-active:hover {
    color: #425E0C;
    font-size: 10px;
}

a.tab-sub-menu-active:active {
  color: #ebebeb;
}

/* NAVIGATION =========================================== */
#nav {
	font-size: 1.2em;
	margin:0;
	float: left;
	width: 1000px; /* fix for opera (contact drops) */
	height:24px;
}
#nav ul {
	margin:0;
	padding:0;
	list-style:none;
	}

#nav li {
	display:inline;
	margin:0 0px 0 0;
	padding:0;
	}

#nav a {
	/*font-family: Tahoma, Verdana, Arial, Helvetica;*/
	font-family: Trebuchet MS;
	text-align:right;
	font-weight:bold;
	font-size: 16px;
	color:#ffffff;
	float:left;		
	margin:0;
	padding:0 0 0 5px;
	text-decoration:none;	

}

#nav a span, #nav #current span {
	float:left;
	display:block;	
	padding:3px 9px 5px 9px;

	}

/* hide from Mac IE5 \*/
#nav a span {float:none;}
/* end hack */


#nav #current a {
	background-position:0 -48px;
	}

#nav #current a span, #nav #current span {
	background-position:100% -48px;
	color:#0093dd;
	font-weight:bold;
	}
#nav a:hover {
	background-position:0% -24px;
	color: #fff500;
	font-weight:bold;
}
#nav a:active {
	background-position:0% -24px;
	color: #0093dd;
	font-weight:bold;
}
#nav a:hover span {
	color: black;
	background-position:100% -24px;
}
#nav #current a:hover {
	background-position:0% -48px;
}
#nav #current a:hover span {
	color: #fff;
	background-position:100% -48px;
}

/*
side menu */

#menu {
	position:relative;
	width: 200px;
	float:left;
	padding: 0;
	font-weight: bold;
	font-family: 'lucida grande',tahoma,sans-serif;
	text-align:left;
}

#menu li a {
	height: 24px;
  	voice-family: "\"}\""; 
  	voice-family: inherit;
  	height: 18px;
	text-decoration: none;
	}	
	
#menu li a:link, #menu li a:visited {
	color: #000099;
	display: block;
	background:  transparent url(../themes/images/menu.gif) 0 -26px;
	padding: 8px 0 0 20px;
	}
	
#menu li a:hover {
	color: #FF6600;
	background: transparent url(../themes/images/menu.gif);
	padding: 8px 0 0 20px;
}

/**/
form#two {
	font-size:1.0em; 
	padding:10px; 
	margin:0 auto; 
	display:block;
	/*width: 700px;*/
}
form#two label {
	width:150px; 
	text-align:right; 
	padding-right:10px; 
	color:#000; 
	margin-bottom:0.5em; 
	font-size:1em; 
	line-height:1.5em; 
	font-style:normal;
	display:block;
	float:left;
}
form#two label.desc {
	text-align:left; 
	color:#000; 
	margin-bottom:0.8em;	
	display:block;
	margin-left:160px;
	position:absolute;
}
form#two input {
	padding:0; 
	margin-bottom:0.8em;
	clear:right;
	background-color: #F0F0F0;
	border-style: solid;
	border-width: 1px;
	border-color: gray;
	vertical-align:middle;
}
form#two image {
	padding:0; 
	margin-bottom:0.5em;
	clear:right;
	border: 0;
}

form#two select {
	border:1px solid #e1e1e1;
	margin-bottom:0.8em;
}
form#two textarea {
	border:1px solid #e1e1e1; 
	padding:5px; 
	margin:-8px 0 0 0; 
	overflow:auto;
}
form#two option {
	background:#fff; 
	color: #000;
}

form#two optgroup {
	background:#fff; 
	color:#666; 
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
form#two optgroup option {
	background:#fff; color:#990033;
}
form#two #button1, #button1{
   cursor:pointer;
   font-size:0.8em;
   width: 90px;
   height: 21px;
   border: 0;
   background-image: url('../images/btn1.gif');
   
}
form#two #button1:hover, #button1:hover{
	cursor: pointer;
    font-weight:bold;
   	font-size:0.8em;
   	width: 90px;
   	height: 21px;
   	border: 0;
   	background-image: url('../images/btn2.gif');
	
}
.desc{
	margin-bottom: 1px;
	margin-left: 2px;
	vertical-align:top;
}

#cal{
	padding-bottom: 10px;
	border: 0;
}

#aba > table {width:100%;}
#aba {	
	width: 740px;
	overflow: scroll;
}
#aba table > tbody	{
	overflow:auto;
	overflow-x: hidden;
	padding-right: 1em;
}
#aba table {
	background-color: #FFFFFF;
	border: none;
	color: #003366;
	font-family: 'lucida grande',tahoma,sans-serif;
	font-size: 11px;
	text-align: left;
	empty-cells: show;
	border: solid 1px #66FF00;
}

#aba a:link, #aba a:visited, #aba a:active {
	background-color: transparent;
	color: #0096BD;
	text-decoration: none;
}

#aba a:hover {
	background: transparent;
	color: #000000;
	text-decoration: underline;
}

#aba caption {
	background-color: transparent;
	color: #67BD2A;
	font-family: Georgia, serif;
	font-size: 24px;
	padding-bottom: 12px;
	padding-left: 8px;
	text-align: left;
}
#nn{
	margin: 0;
	padding: 5px 2px 5px 5px;
	background-color: #D6F2C3;
	border-bottom: 1px solid #B3DE94;
}
#aba td, #aba th {
	margin: 0;
	padding: 0;
	background-color: #D6F2C3;
	border-bottom: 1px solid #B3DE94;
	
}

#aba tbody td, #aba tbody th {
	background-color: #D6F2C3;
	border-bottom: 2px solid #B3DE94;
	padding: 5px 2px 5px 5px; 
}

#aba tbody tr.odd th, #aba tbody tr.odd td {
	background-color: #C8EDAE;
	border-bottom: 2px solid #67BD2A;
}

#aba tbody tr:hover td, #aba tbody tr:hover th {
	background-color: #BAE899;
}

#aba td, #aba th {
	vertical-align: middle;
}

#aba tfoot td, #aba tfoot th {
	font-weight: bold;
	padding: 4px 8px 6px 9px;
}

#aba thead th {
	font-size: 11px;
	font-weight: bold;
	line-height: 19px;
	text-align:center;
	padding: 0 8px 1px 8px;
	white-space: nowrap;
	background-color: #D6F2C3;
	border-bottom: 2px solid #B3DE94;
}
#aba caption {
	font-size: 11px;
	font-weight: bold;
	line-height: 19px;
	padding-bottom: 0px;
	background: #D6F2C3 ;
	color:#333333;
	border: solid 2px #B3DE94;
}

#ab2 {
	padding: 0;
	margin: 0;
}


#ab2 caption {
	padding: 0 0 5px 0;
	font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	text-align: right;
}


#ab2 th {
	font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #4f6b72;
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	border-top: 1px solid #C1DAD7;
	letter-spacing: 2px;
	text-align: left;
	padding: 6px 6px 6px 12px;
	background: #CAE8EA url(../themes/images/bg_header.jpg) no-repeat;
}

#ab2 th.nobg {
	border-top: 0;
	border-left: 0;
	border-right: 1px solid #C1DAD7;
	background: none;
}

#ab2 td {
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	/*background: #fff;*/
	padding: 6px 6px 6px 12px;
	color: #4f6b72;
}


#ab2 td.alt {
	background: #F5FAFA;
	color: #797268;
}

#ab2 th.spec {
	border-left: 1px solid #C1DAD7;
	border-top: 0;
	background: #fff url(../themes/images/bullet1.gif) no-repeat;
	font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

#ab2 th.specalt {
	border-left: 1px solid #C1DAD7;
	border-top: 0;
	background: #f5fafa url(../themes/images/bullet2.gif) no-repeat;
	font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #797268;
}
#tableku th {
	font: bold 20px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #fc0303;
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	border-top: 1px solid #C1DAD7;
	letter-spacing: 2px;
	text-align: center;
	padding: 6px 6px 6px 12px;
	
}
#tableku td {	
	font:  14px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	border-bottom: 1px solid #C1DAD7;
	
	padding: 6px 6px 6px 12px;
	color: #4f6b72;
}
.box {
	padding:0 12px 0 0;
	background:#fff url(../themes/images/borders.gif) 100% 0 repeat-y;
}
.bi {
	padding:0 0 0 12px;
	background:transparent url(../themes/images/borders.gif) 0 0 repeat-y;
}
.bt {
	height:17px;
	margin:0 -12px;
	background:url(../themes/images/box.gif) 100% 0 no-repeat;
}
.bt div {
	width:18px;
	height:17px;
	background:url(../themes/images/box.gif) 0 0 no-repeat;
}
.bb {
	height:17px;
	margin:0 -12px;
	background:url(../themes/images/box.gif) 100% 100% no-repeat;
}
.bb div {
	width:18px;
	height:17px;
	background:url(../themes/images/box.gif) 0 100% no-repeat;
}
.box  {
	margin:0;
	padding:0.3em 10px;
	background:#efece6;
	font:bold 1.2em/1 Arial, Helvetica, sans-serif;
}
.box p, .box ul {
	margin:0;
	padding:4px 10px;
	background:#fff;
}
.box li {
	margin:0 0 0 2em;
	padding:0;
}

.bddash {
	border: 1px dashed #000000;
}
.fdash {
	background-color: #FFFFFF;
	border: 1px solid #CAE8EA;
}
.btflat {
	color: #0000FF;
	background-color: #DDDDDD;
	border: 1px dashed #666666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: bold;
}


.no-display{display:none}

.divhidden {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 0.4s ease, max-height 0.4s ease;
}

.divshow {
  opacity: 1;
  max-height: 500px; /* atau sesuaikan tinggi maksimal kontennya */
}


.alert {
  width:70%;
  padding: 6px 8px;
  margin-bottom: 10px;
  border-radius: 5px;
  font-family: sans-serif;
  font-size: 14px;
}

.alert.success {
  background-color: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}

.alert.warning {
  background-color: #fff3cd;
  color: #856404;
  border: 1px solid #ffeeba;
}

.alert.error {
  background-color: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}


        .btn-blue {
            display: inline-block;
            padding: 12px 24px;
            background-color: #6eb6ff;  /* Warna biru muda */
            color: white;
            text-align: center;
            text-decoration: none;
            font-family: 'Segoe UI', sans-serif;
            font-size: 16px;
            font-weight: 600;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            box-shadow: 0 4px 6px rgba(0, 98, 255, 0.2);
            transition: all 0.3s ease;
        }

        .btn-icon {
            width: 20px;
            height: 20px;
            vertical-align: middle;
            margin-right: 8px;
        }

        .btn-blue:hover {
            background-color: #4da8ff;  /* Warna lebih gelap saat hover */
            transform: translateY(-2px);
            box-shadow: 0 6px 8px rgba(0, 98, 255, 0.3);
        }

        .btn-blue:active {
            transform: translateY(0);
            box-shadow: 0 2px 4px rgba(0, 98, 255, 0.2);
        }