/* Main body */ 
html, body{ 
 margin:7px; 
 padding:0px;
 text-align:left;
 font-family: Helvetica, Arial, san-serif;
 font-size:11px;
 color:#333333;
 word-spacing: normal;
 letter-spacing: 0;
 line-height: 1.3em;
 background-color:#FFFFFF;
 }
 
 #pagewidth{ 
 width:900px;
 background-color:#FFFFFF;
 }
 
/*menampilkan logo*/

#header{
 position:relative; 
 height:160px; 
  background:top left url(../images/header-cells.png) no-repeat #cccccc;
 width:100%;
}

/*menampilkan menu*/

.topmenu
{
widths:900px;
heights:30px;
background:#FFFFFF;
padding:6px;
position:left;
clear:right;
margin-bottom:5px;
margin-top:5px;
}

.topmenu .mainlevel-nav
{
padding:12px;
text-decoration:none;
border-right:2px dotted #ffffff;
font-family: Helvetica, Arial, San-serif;
font-weight:bold;
font-size:11px;
text-transform:uppercase;
color:#333333;
}

.topmenu .mainlevel-nav:hover
{
padding:12px;
text-decoration:none;
border-right:2px dotted #ffffff;
font-family: Helvetica, Arial, San-serif;
font-weight:bold;
font-size:11px;
text-transform:uppercase;
color:#fff;
background-color:#33CC00;
}

.topmenu .mainlevel-nav li
{
float:left;
 background:url(../images/arrow-top.png) no-repeat;
 margin: 5px; padding-left:10px;
 }

/*menampilkan search*/
.box-search
{
width:12px;
height:22px;
float:right;
padding-top:5px;
margin-bottom:5px;
}

.box-search .button
{
margin-left:5px;
width:40px;
height:22px;
border:none;
background:url(../images/icon-search.gif) no-repeat;
}
img a
{
padding:3px;
border:solid 1px color:#666666;
margin: 5px 5px 5px 5px;
}

/*menampilkan banner*/

.banner
{
height:65px;
padding:0;
margin-bottom:5px;
background-color:#cccccc;
}

/*menampilkan breadcrumbs*/

.breadcrumbs
{
width:100%;
height:auto;
float:left;
font-family: Helvetica, Arial, sans-serif;
font-weight:normal;
font-size:11px;
color:#333333;
padding-left:2px;
padding-bottom:2px;
padding-top:2px;
}
 
 
 /*Tittle*/

 .moduletable
 {
 margin-top:5px;
 padding-left: 5px;
 padding-top: 5px;
 padding-bottom:8px;
 font-family: Helvetica, Arial, san-serif;
 color:#ffffff;
 font-size:11px;
 text-align:left;
 font-weight:bold;
 text-transform:uppercase;
 background-color:#000000;
 }
 
 .moduletable h3
 {
 margin-top:5px;
 padding-left: 5px;
 padding-top: 5px;
 padding-bottom:8px;
 font-family: Helvetica, Arial, san-serif;
 color:#33cc00;
 font-size:11px;
 text-align:left;
 font-weight:bold;
 text-transform:uppercase;
 background-color:#000000;
 }
 
 .moduletable_menu
 {
 margin-top:5px;
 margin-bottom:5px;
 padding-left: 5px;
 padding-top: 5px;
 padding-bottom:6px;
 font-family: Helvetica, Arial, san-serif;
 color:#ffffff;
 font-size:11px;
 text-transform:uppercase;
 text-align:left;
 font-weight:bold;
 background-color:#000000;
 }
 
 .mainlevel
 {
 float: left;
 height:auto;
 list-style:url(../images/arrow.png) no-repeat;
 margin-top: 0px;
 margin-left: 5px;
 line-height:20px;
 font-family: Helvetica, Arial; san-serif;
 color:#ffffff;
 font-size:11px;
 font-weight:normal;
 padding 10px display:none;
 text-decoration:none;
 }
 
 .mainlevel:hover {
 float: left;
 height:auto;
 list-style:none;
 margin-top: 0px;
 margin-left: 5px;
 line-height:20px;
 font-family: Helvetica, Arial; san-serif;
 font-size:11px;
 color:#ffffff;
 font-weight:normal;
 padding 10px display: none;
 background-color:#33CC00;
 }
 
 .mainlevel a {
 font-family: Helvetica, Arial, san-serif;
 color:#ffffff;
 font-size:11px;
 font-weight:normal;
 text-decoration:none;
 }

 .mainlevel a:visited {
 float: left;
 height:auto;
 list-style:none;
 margin-top: 0px;
 margin-left: 5px;
 line-height:20px;
 font-family: Helvetica, Arial; san-serif;
 font-size:11px;
 color:#cccccc;
 font-weight:normal;
 padding 10px display: none;
 }
 
 .mainlevel li {
 float:left;
 background:url(../images/arrow.png) no-repeat;
 margin: 5px; padding-left:10px;
 }
 
 #leftcol{
 width:28%; 
 float:left; 
 position:relative; 
 background-color:#FFFFFF;
 }
 
#maincol{background-color: #FFFFFF;  
 float: right; 
 display:inline; 
 position: relative; 
 width:70%; 
 padding:5px;
 border-left:dotted 1px #ffffff;
 }
 
 .sections
 {
 height:auto;
 list-style:none;
 margin-top: 0;
 margin-left: 10px;
 padding: 0px;
 float: left;
 }
 
 .sections a {
 font-family: Helvetica, Arial, san-serif;
 color:#333333;
 font-size:10px;
 font-weight:bold;
 display:block;
 }
 
 .section li {
 background:url(../images/arrow.png) no-repeat;
 margin: 0px;
 padding-left:10px;
 }
 
  /* Contents */
 
 .componentheading {
 font-family:Arial, Helvetica, sans-serif;
 color:#333333;
 font-size:10px;
 font-weight:normal;
 display:block;
 }
 
 .contentheading {
 font-family: Myriad Pro, Helvetica, san-serif;
 color:#333333;
 font-size:20px;
 font-weight:normal;
 line-height:1.3em;
 }
 
 .small {
 font-family: Helvetica, Arial, san-serif;
 color:#333333;
 font-size:9px;
 }
 
 .createdate {
 font-family: Helvetica, Arial, san-serif;
 color:#333333;
 font-size:9px;
 }
 
 .modifydate {
 font-family: Helvetica, Arial, san-serif;
 color:#333333;
 font-size:9px;
 }
 
 .contentpaneopen img
 {
 padding:3px;
 background-color:none;
 margin-bottom:5px;
 margin-left:none;
 margin-top:none;
 margin-right:5px;
 }
 
 .readon {
 font-family: Helvetica, Arial, san-serif;
 color:#333333;
 font-size:9px;
 text-decoration:none;
 padding:3px;
 background-color:none;
 border:none
 }

 .readon:hover {
 font-family: Helvetica, Arial, san-serif;
 color:#ffffff;
 font-size:9px;
 text-decoration:none;
 padding:3px;
 background-color:#33CC00;
 }

.article_separator {
border-bottom:1px solid #ccc;
clear:both;
display:block;
height:10px;
margin-bottom:10px;
}
 
 .blog_more {
 font-family: Helvetica, Arial, san-serif;
 color:#ffffff;
 font-size:9px;
 padding:5px;
 background-color:#999999;
 border:dotted 1px #ffffff;
 }
 
 .pagenav {
 font-family: Helvetica, Arial, san-serif;
 color:#333333;
 font-size:9px;
 padding:5px;
 }
 
 .pagenav:hover {
 font-family: Helvetica, Arial, san-serif;
 color:#333333;
 font-size:9px;
 padding:5px;
 background-color:#33CC00;
 }
 
 a {
 font-family: Helvetica, Arial, sans-serif;
 color:#333333;
 font-size:11px;
 font-weight:normal;
 text-decoration:underline;
 }
 
 a:visited
 {
 font-family: Helvetica, Arial, San-serif;
 color:#666666;
 font-size:11px;
 font-weight:normal;
 text-decoration:none;
 }
 
 a:hover {
 font-family: Helvetica, Arial, san-serif;
 color:#33cc00;
 font-size:11px;
 font-weight:normal;
 }
 
 
#footer{
 height:20px; 
  background-color:#FFFFFF; 
 clear:both;
 } 
 

 
 /* *** Float containers fix:
 http://www.csscreator.com/attributes/containedfloat.php *** */ 
.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 */  


 
 /*printer styles*/ 
 @media print{ 
/*hide the left column when printing*/ 
#leftcol{display:none;} 

/*hide the right column when printing*/ 
#rightcol{display:none;} 
#twocols, #maincol{width:100%; float:none;}
}