body
{
	margin: 0px;
	 background: url("body-bg.png");
	color: #494949;
	font-family: Arial, Verdana, Helvetica;
	font-size: 14px;

}
 a:link
{
text-decoration:none
}
a:visited {
text-decoration:none
}
 

a:link.Tombol,a:visited.Tombol
{
display:inline;width:120px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:10px;font-weight:bold;color:#000;
background: #D9D9FF no-repeat left;
text-align:center;text-decoration:none;
padding:6px;
border:1px dotted #39C;
}
a:hover.Tombol,a:active.Tombol
{
background-color:#FFDFBF;border:1px solid #39C;
}

a:link.TombolExport ,a:visited.TombolExport
{
display:inline;width:120px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:10px;font-weight:bold;color:#000;
background:url(xls.gif) #D9D9FF no-repeat left;
text-align:center;text-decoration:none;
padding:4px;padding-left:20px;
border:1px dotted #39C;
}
a:hover.TombolExport,a:active.TombolExport
{
background-color:#FFDFBF;border:1px solid #39C;
}

a:link.TombolGrafik ,a:visited.TombolGrafik
{
display:inline;width:120px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:10px;font-weight:bold;color:#000;
background:url(grafik.png) #D9D9FF no-repeat left;
text-align:center;text-decoration:none;
padding:4px;padding-left:20px;
border:1px dotted #39C;
}
a:hover.TombolGrafik,a:active.TombolGrafik
{
background-color:#FFDFBF;border:1px solid #39C;
}
/* Header */
.header
{
	width: 100%;
	height: 61px;
	font-size: 20px;
	font-family: Verdana, Arial, Helvetica;
	color: #FFFFFF;
	font-weight: bold;
	background-image: url(pojok.gif);
	background-repeat: no-repeat;
	background-color: #08399D;
	background-position: right;
}

.headerLogo
{
	background-color: #3583BD;
	width: 240px;
	height: 61px;
}

.headerBottom
{
  background: url("backgrou.gif");
  height: 35px;
	width: 100%;
	font-size: 10px;
	color: #FFFFFF;
}


.headerLinks
{
	font-size: 12px;
	color: #FFFFFF;
	font-family: Arial, Verdana, Helvetica;
	text-decoration: none;
	font-weight: bold;
}

.headerLinks:hover
{
	color: #FFFFD4;
}



/* Left Navigation */
.leftNav
{
  width: 120px; 
	/* border-top: 2px solid #DDDDDD; */
	border-right: 1px dashed #DDDDDD; 
	font-family: Verdana;
}


.leftNavWidth
{
  width: 165px;
  background-color: #90bade;
}


.productsHeader
{
  border: 1px solid #D3DEF7; 
	background-color: #EEF2FC; 
	font-family: Arial, Verdana, Helvetica; 
	font-size: 11px; 
	font-weight: bold; 
	color: #055F92; 
	padding: 5px;
}


.productsNav
{
  border-bottom: 1px solid #D3DEF7; 
	padding: 4px; 
	padding-left: 15px;
}


.aboutHeader
{
  border: 1px solid #FFE8B3;  
	background-color: #FFF3D7; 
	font-family: Arial, Verdana, Helvetica; 
	font-size: 11px; 
	font-weight: bold; 
	color: #055F92; 
	padding: 5px;
}


.aboutNav
{
  border-bottom: 1px solid #FFE8B3; 
	padding: 4px; 
	padding-left: 15px;
}


.siteToolsHeader
{
  border: 1px solid #C6E9A3; 
	background-color: #E8F6DA; 
	font-family: Arial, Verdana, Helvetica; 
	font-size: 11px; 
	font-weight: bold; 
	color: #055F92; 
	padding: 5px;
}


/*  Links */
a 
{
	color: #055F92;
}

a:hover
{
	color: #EE0000; 
}


.navLink
{
	font-family: Verdana, Arial, Helvetica; 
	font-size: 11px; 
	text-decoration: none; 
}


.navLink:hover
{
	font-family: Verdana, Arial, Helvetica;  
	font-size: 11px; 
  text-decoration: underline;   
}


.navLinkSmall
{
	font-family: Verdana, Arial, Helvetica; 
	font-size: 9px; 
}


.navLinkSmall:hover
{
	font-family: Verdana, Arial, Helvetica; 
	font-size: 9px; 
}


.regLink
{
  font-family: Verdana; 
	font-size: 11px;
	text-decoration: none;
}


.regLink:hover
{
  font-family: Verdana; 
	font-size: 12px;
	text-decoration: underline;
}

.largeLink
{
	font-family: Arial, Verdana, Helvetica; 
	font-size: 16px; 
	font-weight: bold;
}


.largeLink:hover
{
	font-family: Arial, Verdana, Helvetica; 
	font-size: 16px; 
  font-weight: bold;
}



/* Website Fonts */
.siteText
{
  font-family: Verdana; 
	font-size: 12px;
	line-height: 130%; 
	color: #494949;
}


.siteTextSmall
{
  font-family: Verdana, Arial, Helvetica; 
	font-size: 9px;
	line-height: 130%; 
	color: #494949;
}

.largeTitles
{
  font-family: Arial, Verdana, Helvetica; 
	font-size: 20px; 
	font-weight: bold;
}

.boldText
{ 
  font-size: 11px; 
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica; 
	text-decoration: none;
}

.siteTitles
{ 
  font-family: Arial, Verdana, Helvetica;
  font-size: 12px; 
	font-weight: bold;
}

.siteTitlesBlue
{ 
  font-family: Arial, Verdana, Helvetica;
  font-size: 12px;
	font-weight: bold;
	color: #004EAF; 
}


/* Footer */
.footer
{
	width: 100%;
	background-color: #F7F7F7;
}

.footerTop
{
  background: url("footerTo.gif");
  height: 4px;
}



/* Homepage */

.mainProduct
{ 
	/* border-top: 2px solid #DDDDDD; */ 
	font-family: Arial, Verdana, Helvetica; 
	font-size: 12px; 
	padding: 0px 0px 15px 15px;
	background: url('back.gif');
}

.Button
{
  	font-family: Verdana; 
	font-size: 10px; 
	text-align:right;
	padding-right: 4px;
	background-color: #D4D4FF;
	height:22px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 105px;
	cursor:url("daVinciHand.cur");
}
.ButtonGrafik
{
  background: url("grafik.png") no-repeat; 
  background-position: left center; 
  padding-left:10px;
	font-family: Verdana; 
	font-size: 10px; 
	text-align:right;
	padding-right: 4px;
	background-color: #E1E4F7;
	height:25px;
	border: 1px solid #DBDCFD;
	width: 105px;
	margin:0px;
	cursor:url("daVinciHand.cur");
}
.ButtonExport
{
  background: url("xls.gif") no-repeat; 
  background-position: left center; 
  padding-left:10px;
	font-family: Verdana; 
	font-size: 10px; 
	text-align:right;
	padding-right: 4px;
	background-color: #E1E4F7;
	height:25px;
	border: 1px solid #DBDCFD;
	width: 105px;
	margin:0px;
	cursor:url("daVinciHand.cur");
}
.ButtonSearch
{
  background: url("search.gif") no-repeat; 
  background-position: left center; 
	font-family: Verdana; 
	font-weight: bold;
	font-size: 11px;
	text-align:right;
	padding-right: 4px;
	background-color: #D4D4FF;
	height:25px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 100px;
	
}
.ButtonDenda
{
  background: url("dollar.gif") no-repeat; 
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	text-align:right;
	padding-right: 4px;
	background-color: #D4D4FF;
	height:18px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 55px;
	cursor:url("daVinciHand.cur");
}
.ButtonSimpan
{
  background: url("simpan.gif") no-repeat; 
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	text-align:right;
	padding-right: 4px;
	background-color: #D4D4FF;
	height:25px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 75px;
	cursor:url("daVinciHand.cur");
}
.ButtonNext
{
  background: url("nex.gif") no-repeat; 
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	/*background-color: #7FAAFF;*/
	height:20px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 20px;
	cursor:url("daVinciHand.cur");
}
.ButtonPrev
{
  background: url("pre.gif") no-repeat; 
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	/*background-color: #7FAAFF;*/
	height:20px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 20px;
	cursor:url("daVinciHand.cur");
}
.ButtonNextEnd
{
  background: url("nex-end.gif") no-repeat; 
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	/*background-color: #7FAAFF;*/
	height:20px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 20px;
	cursor:url("daVinciHand.cur");
}
.ButtonPrevFirst
{
  background: url("pre-first.gif") no-repeat; 
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	/*background-color: #7FAAFF;*/
	height:20px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 20px;
	cursor:url("daVinciHand.cur");
}
.Tombol
{
  background: url("arrow_do.gif") no-repeat ;
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	height:18px;
	background-color: #D4D4FF;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: auto;
	padding-left : 10px;
	cursor:url("daVinciHand.cur");

}
.btnHapus
{
  background: url("delete.gif") no-repeat ;
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	height:18px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 20px;
	cursor:url("daVinciHand.cur");
	
}
.btnEdit
{
  background: url("edit.gif") no-repeat ;
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	height:18px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 20px;
	cursor:url("daVinciHand.cur");
	
}
.btnEntri
{
  background: url("add.gif") no-repeat ;
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	height:20px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: auto;
	padding-left : 10px;
	cursor:url("daVinciHand.cur");

}
.Tanggal
{
  background: url("cal.gif") no-repeat ;
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	height:18px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 20px;
	
}
/* sirkulasi */

.btnBalik
{
  background: url("kembali.gif") no-repeat ;
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	height:18px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 16px;
	cursor:url("daVinciHand.cur");
	
}
.btnPerpanjang
{
  background: url("perpanjang.gif") no-repeat ;
  background-position: left center; 
	font-family: Verdana; 
	font-size: 10px; 
	height:18px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-color: #E1E1E1;
	border-right-color: #E1E1E1;
	border-bottom-color: #E1E1E1;
	border-left-color: #E1E1E1;
	width: 16px;
	cursor:url("daVinciHand.cur");
	
}

/* Global */
.onepxhr
{
  border-top: 1px solid #DDDDDD; 
	margin-bottom: 25px;
}


.twopxhr
{
  border-top: 2px solid #DDDDDD; 
	margin-bottom: 15px;
}


.mainWidth
{
  width: 100%;
}



/* Code */
.code
{
  background-color: #FFFFEE; 
	font-family: courier new, helvetica; 
	font-size: 11px; 
	padding: 5px; 
	width: 300px; 
	border: 1px solid #444444; 
	margin-left: 20px;
}

/* form */
.btnform
		{
	font-family: tahoma, verdana;
	font-size: 8px;
	background-color: #A6C2FF;
	height:auto;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #0099FF;
	border-right-color: #0099FF;
	border-bottom-color: #0099FF;
	border-left-color: #0099FF;
	width: auto;
	}

/* Menu.js */

#dropmenudiv{
position:absolute;
z-index: 4;
font: normal 11px arial;
line-height:20px;
}

#dropmenudiv a{
width: 110px;
height: 24px;
display: block;
text-indent: 3px;
border-bottom: 1px dashed #FFFFFF;
padding: 1px 0;
text-decoration: none;
color: #FFFFFF;
text-indent: 3px;
padding: 2px 0px 0px 0px;
background-color: #055F92;
}

#dropmenudiv a:hover{ /*hover background color*/
background-color: #BBBBFF;
color: #000000;
}  

/* untuk link button */
#hlink {
	padding: 13px 0 5px 0;
	
}

#hlink a {
	padding: 4px 6px 4px 6px;
	text-decoration: none;
	color: #FFFFFF;
	background: #808080 ;
	margin: 0 0 3px 1px;
	border-bottom: 2px solid #BCBCBC;
}

#hlink a:hover {
	background: #2A7FFF ;
	color: #FFFFFF;
	border-bottom: 2px solid #2F4A6C;
}

/* left navigasi */
#button {
	width: 130px;
	padding: 0 0 0 0;
	font-family: 'Trebuchet MS', 'Lucida Grande',
	  Verdana, Lucida, Geneva, Helvetica, 
	  Arial, sans-serif;
	background-color: #90bade;
	color: #333;
	}
#button ul {
		list-style: none;
		margin: 0;
		padding: 0;
		border: none;
		
		}
		
	#button li {
		border-bottom: 1px solid #90bade;
		margin: 0;
	
		}
#button li a {
		display: block;
		padding: 5px 5px 5px 0.5em;
		border-left: 10px solid #1958b7;
		border-right: 10px solid #508fc4;
		background-color: #2175bc;
		color: #fff;
		text-decoration: none;
		width: 130px;
		}

	html>body #button li a{
		width: 130px;
		}

	#button li a:hover {
		border-left: 10px solid #1c64d1;
		border-right: 10px solid #5ba3e0;
		background-color: #2586d7;
		color: #fff;
		}

/* Higlight Input */
.textInput,textarea{  /* General style for my inputs when they're not highlighted */
  font-family: Verdana; 
  font-size: 10px; 
  line-height: 130%; 
  color: #494949;
  background-color:#FFFFFF;
  
}

.inputHighlighted{  /* Highlighting style */
  background-color:#E0E0FF;
  color:#2D2D2D;
  font-family: Verdana; 
	font-size: 14px; 

	font-weight: bold;
	border:solid 1px;	
} 
/* Paging */

    #pagin a
    {
    font-family:Tahoma;
    font-size:11px; 
    display:block;
    float:left;
    cursor:pointer;
    color:#00c;
    text-decoration:none;
    display:inline-block;
    border:1px solid #ccc;
    padding:.3em .7em;
    margin:0 .38em 0 0;
    text-align:center
    }
    #pagin a:hover
    {
    background:rgb(224,255,224);
    border:1px solid #83bc46
    }
    #pagin a.sel
    {
    color:#333;
    font-weight:normal;
    background:#f0f7e8;
    cursor: default;
    border:1px solid #83bc46
    }

	
/* table */


.pretty-table
{
  padding: 0;
  margin: 0;
  border-collapse: collapse;
  border: 1px solid #333;
  font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  color: #000;
  background: #FFF url("widget-table-bg.jpg") top left repeat-x;
}

.pretty-table caption
{
  caption-side: bottom;
  font-size: 0.9em;
  font-style: italic;
  text-align: right;
  padding: 0.5em 0;
}

.pretty-table th, .pretty-table td
{
  border: 1px dotted #666;
  padding: 10px;
  text-align: left;
  color: #632a39;
}

.pretty-table th[scope=col]
{
  color: #000;
  background-color: #8fadcc;
  text-transform: uppercase;
  font-size: 0.9em;
  border-bottom: 2px solid #333;
  border-right: 2px solid #333;
}

.pretty-table th+th[scope=col]
{
  color: #fff;
  background-color: #7d98b3;
  border-right: 1px dotted #666;
}

.pretty-table th[scope=row]
{
  background-color: #FFF;
  border-right: 2px solid #333;
}

.pretty-table tr.alt th, .pretty-table tr.alt td
{
  color: #2a4763;
}

.pretty-table tr:hover th[scope=row], .pretty-table tr:hover td
{
  background-color: #E1E1E1;
  color: #000;
  font-weight:bold;
}


fieldset {
border: 2px solid #E0F2F7;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}

input:focus,textarea:focus {
      background: #FFFF99; border: 2px solid #CCCCCC;
	  border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
}