/* ------------------------------------------------------------------------------------- */
/* Purpose: (X)HTML browsers      */
/* jangan di copy donk
*********************************************************************/
:link,:visited { text-decoration:none }

ul,ol { list-style:none }

h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }

ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p, blockquote, fieldset, input, em
{ margin:0; padding:0 }

a img,:link img,:visited img { border:none }
a:link, a:visited {outline: none;}
a:hover, a:active {outline: none;}



/* elemen tampilan
 * ------------------------------------------------------------------------------------- */
body {
	background: #A7B1BD url(../images/bg.jpg) top left repeat-x;
	text-align: justify;
}

p, div, li, div, h1, h2, h3, h4, td, input, select, textarea {
	font-family: "Trebuchet MS", "Bitstream Vera Sans","verdana", lucida, arial, helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
}

#content-left p {
	color: #000000;
}

#content-left a:link, #content-left  a:visited {
	color: #333333;
	text-decoration: none;
}
#content-left a:hover, #content-left  a:active {
	color: #333333;
	text-decoration: underline;
}

#content-right p {
	color: #000000;
}

#content-right a:link, #content-right  a:visited {
	color: #24166D;
	text-decoration: none;
}
#content-right a:hover, #content-right  a:active {
	color: #8F5444;
	text-decoration: none;
}

span {
	display: none;
}

/* elemen struktur tampilan
 * ------------------------------------------------------------------------------------- */
#wrapper {
	width: 780px;
	margin: 0 auto;
	background: url(../images/bg-wrapper.jpg) left top repeat-y;
	text-align: left;
}

/* Horizontal sprite nav
 * ------------------------------------------------------------------------------------- */

#menu {
	background: url(../images/menu3new.jpg) left top no-repeat;					
	width: 780px;			
                height: 61px;			
}

#menu span { display: none; }

#menu li, #menu a { 
	height: 61px;			
	display: block;
	}

#menu li {
	float: left;
	list-style: none;
	_display: inline;	/* fixes IE/Win double margin float bug (safe) */
	}

/* margin-left - value to "center"  nav, sing kanggo tok wae*/
/* Ukuran menu disesuaikan ukuran pada layout buttonnya */
#menu-01 { width: 46px; margin-left: 44px; }
#menu-02 { width: 63px; }
#menu-03 { width: 113px; }
#menu-04 { width: 123px; }
#menu-05 { width: 105px; }
#menu-06 { width: 109px; }
#menu-07 { width: 83px; }
#menu-08 { width: 51px; }

/* First value should = the starting X position of the buttin - Second value = image height */
#menu-01 a:hover {background: transparent url(../images/menu3new.jpg) -44px -61px no-repeat;}
#menu-02 a:hover {background: transparent url(../images/menu3new.jpg) -90px -61px no-repeat;}
#menu-03 a:hover {background: transparent url(../images/menu3new.jpg) -153px -61px no-repeat;}
#menu-04 a:hover {background: transparent url(../images/menu3new.jpg) -266px -61px no-repeat;}
#menu-05 a:hover {background: transparent url(../images/menu3new.jpg) -389px -61px no-repeat;}
#menu-06 a:hover {background: transparent url(../images/menu3new.jpg) -494px -61px no-repeat;}
#menu-07 a:hover {background: transparent url(../images/menu3new.jpg) -603px -61px no-repeat;}
#menu-08 a:hover {background: transparent url(../images/menu3new.jpg) -686px -61px no-repeat;}


/* Horizontal Sprite menu
 * ------------------------------------------------------------------------- */

#menu li ul {
	position:absolute;
	left:-9999px;
	padding-right:1px;			
	background-color:#87865C;	
	font-weight:bold;
	}

#menu li ul li { 
	height:20px; 					border:1px solid #575630;
	border-top:none;
	}	

#menu li ul li a {
	width:100%;
	height:20px;				
	line-height:20px;			
	}

#menu li ul li a span {
	display:block;
	padding-left:5px;
	}

/* Drop down link styles */
#menu a:link, #menu a:visited, #menu a:hover, #menu a:active {
	font-size:1.0em;
	color:#fff;
	text-decoration:none;
	}

#menu li:Hover ul, #menu li.sfHover ul	{ left: auto; }

/* Hover styles - drop down items */
#menu-08 ul a:hover, #menu-02 ul a:hover, #menu-08 ul a:hover, #menu-05 ul a:hover, { 
	background-image:none;
	background-color:#000;
	color:#333333;
	text-decoration:none;
	}

/* drop down menu - allows pada item setiap garisnya*/
#menu-01 ul, #menu-01 li { width:140px; }		
#menu-02 ul, #menu-02 li { width:137px; }
#menu-08 ul, #menu-08 li { width:53px; }
#menu-05 ul, #menu-05 li { width:50px; }


/* VERTICAL nav
 * ------------------------------------------------------------------------------------- */
#nav {
	position: relative;				
	width: 552px;		
	height: 326px;		
	}

#nav li span { display: none; }

#nav li { 
	margin: 0; 
	padding: 0; 
	list-style: none; 
	position: absolute;
}

#nav li, #nav a { 
	height: 33px;			
	display: block;
	}

/* Fix IE5.01Win  - Hide IE Mac \*/
* html #nav li { height:1% }
/* End */

/* ukuran button */
#nav-01 { top: 70px; }
#nav-02 { top: 103px; }
#nav-03 { top: 136px; }
#nav-04 { top: 169px; }
#nav-05 { top: 202px; }

/* ukuran #nav */
#nav-01, #nav-02, #nav-03, #nav-04, #nav-05 { left: 0px; width: 552px; }

/* perubahan values "top" * tidak usah dipakai klo menggunakan CMS/
#nav-01 a:hover { background: transparent url(../images/procedures.jpg) -552px -70px no-repeat; }
#nav-02 a:hover { background: transparent url(../images/procedures.jpg) -552px -103px no-repeat; }
#nav-03 a:hover { background: transparent url(../images/procedures.jpg) -552px -136px no-repeat; }
#nav-04 a:hover { background: transparent url(../images/procedures.jpg) -552px -169px no-repeat; }
#nav-05 a:hover { background: transparent url(../images/procedures.jpg) -552px -202px no-repeat; }


/* logo
 * ------------------------------------------------------------------------------------- */

#header	{ 
	position:relative; 
	width: 780px;
	height: 118px;
	background:  url(../images/header.jpg) left top no-repeat;
}
	
	#header a {
		position: absolute;
		width: 216px;
		height: 31px;
		top: 69px;
		left: 541px;
	}

/* image replace
 * ------------------------------------------------------------------------------------- */
#active-x {height:182px;}
.index {
	background: url(../images/flash/bkgrnd01.jpg) left top no-repeat; padding-left:18px;
	height: 182px;
	width: 780px;
}
/* content
 * ------------------------------------------------------------------------------------- */
#banner {
	width: 780px;
	height: 184px;
}

#content-container {
	width: 780px;
       text-align:justify;
}

#content-left {
	width: 552px;
	float: left;
}

	#content-left p {
		margin: 0px 30px 14px 64px;
	}
	#content-left table {
	border-collapse: collapse;
	margin: 0px 30px 14px 64px;	
   }
.th strong {
	color: #fff;
}
.th {
	background: #93BC0C url(../nav.jpg) repeat-x;
	height: 29px;
	padding-left: 12px;
	padding-right: 12px;
	color: #FFF;
	text-align: left;
	border-left: 1px solid #B6D59A;
	border-bottom: solid 2px #FFF;
}
.tr {
	height: 30px;
}
.td {
	padding-left: 11px;
	padding-right: 11px;
	border-left: 1px solid #E8E8E8;
	border-bottom: 1px solid #DFDFDF;
}
.td.first,th.first {
	border-left: 0px;
}
.tr.row-a {
	background: #F8F8F8;
}
.tr.row-b {
	background: #EFEFEF;		
}
	
	#content-left h1 {
		margin: 0px 30px 14px 64px;
		font-size: 15px;
		color: #000;
	}
	#content-left h2 {
		margin: 0px 30px 14px 64px;
		font-size: 13px;
		color: #000;
	}
	#content-left h3 {
		margin: 0px 30px 14px 64px;
		color: #000;
	}
	#content-left h4 {
		margin: 0px 30px 14px 64px;
	}
	
	#content-left ul {
		margin: 10px 0px 10px 0px;
	}
	#content-left li {
		margin: 0px 30px 5px 84px;
		list-style-image: url(../images/bullet.jpg);
	}
	
	#content-left li.procedures {
		margin: 0;
	}
	
	#content-left li ul li{
		margin: 0px 30px 5px 20px;
		list-style-image: url(../images/bullet.jpg);
	}
	
#welcome {
	width: 552px;
	padding-bottom: 10px;
	background: url(../images/index/welcome.jpg) left top no-repeat;
}
	#welcome p {
		margin: 0px 30px 14px 64px;
	}
	#welcome .toppadding {
		padding-top: 83px;
	}

#dr {
	width: 280px;
	float: left;
}
	#dr p {
		margin: 13px 10px 9px 64px;
	}

#featured {
	width: 272px;
	float: left;
}
	#featured p {
		margin: 13px 38px 9px 28px;
	}
	#featured h1 {
                                      margin: 0px 38px 9px 28px;
		font-size: 14px;
		color: #794B7C;
}
	#featured img.bna {
		margin: 0 auto;
		padding-left: 20px;
	}

#content-right {
	width: 228px;
	float: left;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	text-align:left;
	color:#000000;
}
	#content-right p {
		margin: 10px 0px 10px 0px;
	}
	#content-right form {
		margin: 5px 0px 40px 27px;
	}
	#content-right img {
		margin-right: 0px;
	}
	
       #content-right h1 {
		margin: 10px 0px 10px 0px;
		font-size: 14px;
		color: #24166D;
	}
		
	#content-right ul {
		margin: 10px 0px 10px 0px;
	}
	#content-right li {
		margin: 0px 50px 5px 27px;
              list-style-image: url(../images/icon.gif);
	}
	
	#content-right li ul li{
		margin: 0px 50px 5px 27px;
             list-style-image: url(../images/icon.gif);
	}
#bna-left {
	width: 276px;
	float: left;
}

	#bna-left img {
		margin: 0px 0px 10px 60px;
	}

#bna-right {
	width: 266px;
	float: left;
}
	#bna-right img {
		margin: 0px 0px 10px 10px;
	}

#procedures-div {
	width: 552px;
	float: left;
}

	#img-girl {
		width: 282px;
		height: 263px;
		float: left;
		background: url(../images/index/img-girl.jpg);
	}

/* footer
 * ------------------------------------------------------------------------------------- */
#page-footer {
	background: url(../images/page-footer.jpg) left top no-repeat;
	width: 780px;
	height: 125px;
	clear: both;
}

#footer {
	width: 780px;
	margin: 0px auto;
	padding: 14px;
	text-align: center;
}

	#footer p {
		margin: 10px 0px 10px 0px;
		color: #FFFFFF;
	}

#footer ul {margin: 0 20px 10px 10px; line-height:25px;}

#footer li { /* floating footer .. border height w/ line-height */
	padding:0 5px 0 7px;
	display: inline;
	border-left: 1px solid #fff;
	}

	#footer li.first { border: none; }
	
	#footer a:link, #footer a:visited {
		color: #FFFFFF;
		text-decoration: underline;
	}
	#footer a:hover, #footer a:active {
		color: #D9E3E8;
		text-decoration: underline;
	}

/* contact
 * ------------------------------------------------------------------------------------- */
 
input {
	padding:2px;
	border:1px solid #eee;
	font: normal 1em Verdana, sans-serif;
	color:#777;

}
textarea {
	width:350px;
	padding:2px;
	font: normal 1em Verdana, sans-serif;
	border:1px solid #eee;
	height:100px;
	display:block;
	color:#777;
}

.quickcontact {
	width: 150px;
}

.qc-submit {
	width: 63px;
	height: 20px;
	margin-left: 87px;
	margin-top: 5px;
	border: none;
}

/* main contact
 * ------------------------------------------------------------------------------------- */

#contact-main input, #contact-main textarea, #contact-main select {
	font-family: "verdana", lucida, arial, helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	border: 1px solid #A3BFE0;
	background-color: #333333;
	margin: 0 0 5px 0;
	clear: both;
	vertical-align: middle;
}

#contact-main-wrapper {
	width: 490px;
	margin-left: 0px;
}

input.button, #contact-main label input.button	{ 
	width: 63px;
	height: 20px;
	left: 110%;
	border: none;
	margin: 10px 0px 0px 0px;
}

input.button-digital {
	margin: 0px 0px 20px 0px;
}

input submit a:hover {
	text-decoration: underline; 
}

#contact #quickcontact-wrapper { 
	display: none; 
}

#contact-main { 
	margin-top: 25px;	
}
	
	#contact-main br { 
		clear: both; 
	} 
	
	#contact-main p, #contact-main h1 {
		text-align: left;
		margin: 10px 0 10px 0;
	}
	
	#contact-main p.clear-textarea	{ 
		margin-top:80px; 
	}
	
	#contact-main p.clear-textarea2 { 
		margin-top: 2px; 
	}

	#contact-main .radio { 
		width: 14px; 
		background: transparent; 
		border: none; 
	}
	
	#contact-main label input, #contact-main label select {
		position: absolute; 
		left: 110%; 
		width: 150px;
	}
	
	#contact-main label {
		position: relative; 
		width: 250px; 
		display: block; 
		margin: 0 10px; 
		text-align: right; 
		height: 20px;
	}
	
	#contact-main label textarea {
		position: absolute; 
		left: 110%; 
		top: 0px; 
		width: 160px; 
		height: 100px;
	}
	
	#contact-main label.print {
		margin-top: 40px;
	}
		
	#contact-main label input.small-box {
		clear: none;
		float: left;
		width: 30px;
		margin-right: 10px;
	}
	
	#contact-main .checkbox {
		width: 14px; 
		background: transparent; 
		border: none;
		float: inherit;
	}
	.table-text {
		text-align: right;
	}

/* misc layout
 * ------------------------------------------------------------------------------------- */

.top {
	display: block;
	text-align: right;
	font-size: 11px;
}

img.img-left {
	float: left;
	margin: 0px 10px 10px 0px;
}

img.img-right {
	float: right;
	margin: 0px 30px 10px 10px;
}

div.clear {
	clear: both;
}

.bna {
	margin: 0px 0px 5px 5px;
}

/* start - table */
.table {
	border-collapse: collapse;
	margin: 0px 30px 14px 64px;	
}
.th strong {
	color: #fff;
}
.th {
	background: #2C126D  repeat-x;
	height: 29px;
	padding-left: 12px;
	padding-right: 12px;
	color: #FFF;
	text-align: left;
	border-left: 1px solid #B6D59A;
	border-bottom: solid 2px #FFF;
}
.tr {
	height: 30px;
}
.td {
	padding-left: 11px;
	padding-right: 11px;
	border-left: 1px solid #E8E8E8;
	border-bottom: 1px solid #DFDFDF;
}
.td.first,th.first {
	border-left: 0px;
}
.tr.row-a {
	background: #F8F8F8;
}
.tr.row-b {
	background: #EFEFEF;		
}

/* images */
img {
	background: #FAFAFA;
   border: 1px solid #FFFFFF;
	padding: 2px;
}
img.float-right {
  	margin: 3px 0px 5px 5px;  
}
img.float-left {
  	margin: 3px 5px 5px 0px;
}

code {
  	margin: 5px 0;
  	padding: 10px;
  	text-align: left;
  	display: block;
  	overflow: auto;  
  	font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace ;
  	/* white-space: pre; */
  	background: url(post.jpg);
	border: 1px solid #E0DBC9;  
}
acronym {
  cursor: help;
  border-bottom: 1px solid #777;
}
blockquote {
	margin: 10px;
 	padding: 0 0 0 25px;  
   background: url(post.jpg);
	border: 1px solid #E0DBC9;
	font: bold 1.3em/1.5em 'Trebuchet MS', Tahoma, Sans-serif;
	color: #A89A6A;
}

fieldset {
	border: 1px solid #E4DF94;
	padding: 2px 2px;
	margin: 0 20px 1px 50px;
	color: #000;
}
input { padding: 1px; }