body {background: url(images/bodybg.gif) repeat-x;}
.wrapper {margin: 0 auto; width: 900;padding: 0 3; background: #FFFFFF}
/* HEADER */
.header {margin: 0 auto; width: 900; height: 208px; display: block; padding: 0 3}
.headertitle {margin: 0; width:900; height: 200;}
.sitename {margin-left:20px; padding:0; display: block; width: 185; height:47; float: left;}
.siteaddress {padding: 12 0 0 3; }
.siteaddress p {font: 11px verdana,tahoma,arial; color: #AB0512; display: block; width: 910; margin: 0;}
/* BODY CONTENT */
.search {float: left;background: url(images/search.jpg); width: 219; height: 33; margin-top: 19}

/* MENU NAVIGASI */
.navbar {float: left; margin-top: 20; padding: 0 3; background: url(images/nav_bg.jpg) no-repeat; height: 33; width: 670;
	font: bold 11px verdana,tahoma,arial; text-transform: uppercase;}
.navbar ul {margin:0; padding:0; list-style-type:none; padding-left: 5;}
.navbar li {list-style: none; float: left}
.navbar li a {display: block; padding: 4px 0px; margin: 0 5; color: #fff; text-decoration: none; border-bottom: 1px #FFFFFF dotted}
.navbar li a:hover {display: block; padding: 4px 0px; color: #AB0512; text-decoration: none; border-bottom: 1px #AB0512 dotted}

.navbar ul li ul {display: none; width: auto; /* Width to help Opera out */}
.navbar ul li:hover ul {display: block; position: absolute; margin: 0; padding: 0;}
.navbar ul li:hover li {float: none; color:#CCCCCC;}
.navbar ul li:hover li a {background-color: #F3F3F3; padding: 3 20;
	text-transform: capitalize; border-bottom: 1px solid #B2B2B2; border-left:1px solid #B2B2B2; 
	border-right: 1px solid #B2B2B2; color: #356D8E;}
.navbar ul li:hover li a:hover {color: #AB0512}
.navbar ul li li a:hover {background-color: #ECE9ED;}
.navbar ul li:hover ul, .navbar li:hover ul {display: block; position: absolute; margin: 0; padding: 0; color: #356D8E }
.navbar ul li:hover li, .navbar li:hover li {float: none; }

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

.welcome {width: 220px; float: left;}
.welcome h1 {color: #256C81; font: bold 24px "trebuchet ms",verdana,tahoma,arial; padding: 0 3}
.welcome p {font: 14px "trebuchet ms",verdana,tahoma,arial; padding: 0 3; color: #C03C3C;}

.modultitle {
	float: left; background: url(images/modultitle.jpg) no-repeat; font: bold 12px verdana,tahoma,arial; 
	color: #FFFFFF; text-align: center; width: 220; height: 30; padding-top: 6; margin: 5 0 0 0; text-transform: capitalize}
.modultop {background: url(images/modul_border_top.gif) no-repeat; width: 219; height: 5; float: left}

.modul {float: left; width: 219; background: url(images/modul_bg.gif) repeat-y;padding: 10 3; margin:0; font: 11px verdana,tahoma,arial; color: #356D8E}
.modul ul {float: left; padding:2 0; margin: 0 20;}
.modul ul li {list-style: url(images/plus.gif); padding: 2 0}
.modul ul li a {color: #C03C3C; text-decoration: none; border-bottom: 1px dotted #C03C3C;}
.modul ul li a:hover {color: #356D8E; text-decoration: none; border-bottom: 1px dotted #356D8E;}
.modul input,textarea {border: 1px inset #F2F2F2; background:#F5F5F5; font: 11px verdana,tahoma,arial; padding; 3; margin-bottom: 2; color:#356D8E}
.modul input.tombol {font: 11px verdana,tahoma,arial; border: 1px outset #CCCCCC; padding: 3; width: 100}
.modul input.tombol:hover {background: #69B7E0; color: #FFFFFF}
.modulbottom {background: url(images/modul_border_bottom.gif) no-repeat; width: 219; height: 5; float: left}

.bigbanner {display: block; height: 220; width: 680; margin:0; background: transparent; padding:0}

#imageContainer { height:220; }  
#imageContainer img { display:none; position:absolute; top:0px; left:0px; height:220px; width:680px; opacity: -0.01; } 

.main {margin: 0 3; padding: 0; font: 11px verdana,tahoma,arial; background: #FFFFFF;}
.main h1 {font: bold 24 "trebuchet ms",verdana,tahoma,arial; color:#C03C3C; padding: 0 5; text-transform: capitalize}
.main h2 {font: bold 16 "trebuchet ms",verdana,tahoma,arial; color:#356D8E; padding: 0 5; text-transform: capitalize}
.main h3 {font-size: 14; font-weight: bold; color: #0D7CA2}
.main p {font: 11px verdana,tahoma,arial;padding: 0 5; text-align: justify}
.main a {color: #C03C3C; text-decoration: none; border-bottom: 1px dotted #C03C3C}
.main a:hover {color: #356D8E; text-decoration: none; border-bottom: 1px dotted #356D8E}
.main fieldset {border: 1px solid #F8F8F8}
.main legend {font: bold 12px verdana,tahoma,arial; text-transform: uppercase; padding: 0 5}
.main label {float: left; font: 11px verdana,tahoma,arial; width: 100px; padding: 3}
.main textarea.field, input.field {width: 250px;font: 11px verdana,tahoma,arial; color: #000000; background: #FFFFFF; border: 1px inset #CCCCCC; padding: 3}
.main input.tombol {font: 11px verdana,tahoma,arial; border: 1px outset #CCCCCC; padding: 3; width: 100}
.main input.tombol:hover {background: #69B7E0; color: #FFFFFF} 
.main hr {border-top: none; border-bottom: 1px solid #DBF0FD; border-left: none; border-right: none }
.main ul {list-style: url(images/plus-white.gif);padding:0 10}
.main ul li {margin:0; color: #356D8E; text-align: justify}
.innertable table {border-collapse: collapse}
.innertable td,th {border: 1px #cccccc solid; padding: 3; clear: both; }

.modul label {float: left; width: 60px}

.main table {font: 11px verdana,tahoma; background: #FFFFFF;}
.main th {background: #35A6AC; color: #FFFFFF; font: bold 11px verdana,tahoma,arial; padding: 5}

.errormsg {display: block; background: #DE3329; color: #FFFFFF; font: bold 11px verdana,tahoma,arial; padding: 3}
.okemsg {display: block; background: #37D533; color: #FFFFFF; font: bold 11px verdana,tahoma,arial; padding: 3}

.pagetitle {padding: 0; width: 670; background: #F3F6F4; margin: 0;}
.pagetitle h1 {padding-top: 10; color: #C03C3C;}
.pagetitle p {padding: 0 10; font-size: 14px; text-align: justify}
.pagetitlelefttop {float:left; padding:0;margin:0;}
.pagetitlerighttop {float:right; padding:0;margin:0;}
.pagetitleleftbottom {float:left; padding:0;margin:0;}
.pagetitleleftbottom {float:right; padding:0;margin:0;}

.shoutbox {background: transparent; text-align: justify; width: 200 }

.infonuptk {width: 220; height: 50; }
.infonuptk a {width: 220; height: 50; display: block;background: url(images/infonuptk.gif) no-repeat; border-bottom: none}
.infonuptk a:hover {background: url(images/infonuptk_hover.gif) no-repeat; border-bottom: none}

.infopks {width: 230; height: 50; }
.infopks a {width: 230; height: 50; display: block;background: url(images/pks.gif) no-repeat; border-bottom: none}
.infopks a:hover {background: url(images/pks_hover.gif) no-repeat; border-bottom: none}

.footer { height: 80; border-top: 15px solid #F4F4F4; background:#FBFBFB; margin: 0; padding: 0}
.footer p {font: 11px "trebuchet ms"; padding-top: 0; text-align: center;}