@charset "utf-8";
/* CSS Document */

/* project: kkmk-kaj template

   author: KKMK KAJ */
body {
    margin:0;
    padding:0;
    background:#AFDAEB url(../images/bg_body.jpg) left top repeat-x;
	font: normal 12px Verdana, Arial, sans-serif;
	line-height: 1.7em;
}

table, tr, td{
	font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size : 11px;
	color : navy;


}


.tblborder{
 	border-top: 1px solid #6B6B6B;
	border-right: 1px solid #6B6B6B;
	border-bottom: 1px solid #6B6B6B;
	border-left: 1px solid #6B6B6B;
}

div, h1, h2, h3, form, span, ul, li {
    margin:0;
    padding:0;
}

/* Page Wrapper*/
#container {
	width:980px;
	margin:0 auto;
	background:#f2f2f2;
        position:relative;

}
#container p {
        margin-top:0;
}

/*Menu*/
.nav {
	margin:5px 0 15px 0;
	padding:0;
	height: 32px;
	background: url(../images/bg_footer.jpg) repeat-x left top;
        position:relative;
}
.slider {
	margin:0;
	padding: 0;
}

/* Menu Credits Dynamic Drive CSS Library */
#menu {
	width:800px;
	margin:0 auto;
    font: bold 13px Arial;
	background:url(../images/bg_menu.jpg) left bottom repeat-x;
	height:40px;
	padding:0;
}
#menu li{
	display: inline;
}
#menu li a{
	float: left;
	color: white;
	padding: 12px 12px;
	text-decoration: none;
}
#menu li a:hover, #menu li .onpage{
	color: black;
}

#Header {
	width:100%;
	padding:3px 0 3px 0;
	margin:0 auto;
	min-height:200px;
	background:#336699;
}
#Header .sshow {
	width:auto;
	padding:0;
	margin:0;
}
#Header .codess {
	color:#336699;
}
/*Content*/
#MainContent{
    width:57%;
    float:left;
    padding:6px;
    color:#000;
}
.MainSection {
	padding: 5px 0;
}
.MainSection .content {
    padding: 5px 0;
    text-align: justify;
}
.MainSection .more {
	margin: 5px 0 0 0;
        padding: 3px 0;
	border:1px solid #336699;
	border-left:none;
	border-right:none;
	text-align:right;
}
.MainSection h3 {
    font-family:Georgia;
    font-size:1.5em;
    font-weight:normal;
    color:#557F2A;
    padding: 3px 3px 7px 55px;
    background: url(../images/headline.gif) left top no-repeat;
    min-height:48px;
}
.MainSection a {
    padding: 0 0 3px 0;
    text-decoration:none;
    color:#336699;
}
.MainSection a:hover {
}
.MainSection .date {
	padding:3px 3px;
	/*background:#336699;*/
	color:#FFFFFF;
    background: url(bg_menu.gif) left bottom repeat-x;
}
/*Detail Content*/
#DetailContent{
    width:76%;
    float:left;
    padding:0;
    color:#000;
    margin-left: 8px;
    margin-bottom: 8px;
}
.DetailSection {
	padding: 0;
}
.DetailSection .photo-main {
	border:10px solid #fff;
}
.DetailSection .photo-thumb {
	list-style:none;
}
.DetailSection .photo-thumb li {
	display:inline;
	padding:5px;
}
.DetailSection .content {
    padding: 5px 0;
}
.DetailSection .content-img {
    padding: 0 10px 5px 0;
	float:left;
}
.DetailSection .more {
	margin: 5px 0 0 0;
    padding: 3px 0;
	border:1px solid #336699;
	border-left:none;
	border-right:none;
	text-align:right;
}
.DetailSection h3 {
    font-family:Georgia;
    font-size:1.5em;
    font-weight:normal;
    color:#557F2A;
    padding: 3px 3px 7px 55px;
    background: url(../images/headline.gif) left top no-repeat;
	min-height:48px;
}
.DetailSection li {
	list-style:none;
}
.DetailSection h3.new-member {
    background: url(../images/registration.gif) left top no-repeat;
}
.DetailSection h3.berita-photo {
    background: url(../images/cameraline.gif) left top no-repeat;
}
.DetailSection h3.kontak {
    background: url(../images/kontak.gif) left top no-repeat;
}
.DetailSection a {
    padding: 0 0 3px 0;
    text-decoration:none;
    color:#336699;
}
.DetailSection a:hover {
}
.DetailSection .date {
	padding:3px 3px;
	/*background:#336699;*/
	color:#FFFFFF;
        background: url(bg_menu.gif) left bottom repeat-x;
}
/*Tabs*/
/* Style for Usual tabs */
#HeadTabs {
  color:#111;
  width:auto;
  border:5px solid #f2f2f2;  
}
#HeadTabs li { 
list-style:none;
float:left;
}
#HeadTabs ul a {
  display:block;
  padding:6px 10px;
  text-decoration:none!important;
  font:12px Arial;
  color:#FFF;
  background:#66A3FF;
}
#HeadTabs ul a:hover {
  color:#FFF;
  background:#336699;
}
#HeadTabs ul a.selected {
  margin-bottom:0;
  color:#FFF;
  background:#336699;
  cursor:default;
}
#ContentTabs {
clear:left;
padding:8px;
background:#336699;
color:#fff;
}
#ContentTabs form, .Form {
	padding:0;
	margin:0;
}
#ContentTabs ul {
list-style:none;
}
#ContentTabs .Form li {
    padding:0 0 5px 0;
}
#ContentTabs .List li {
    padding:0 0 6px 0;
	border-bottom:1px solid #fff;
	display:block;
}
#ContentTabs .List li a {
	color:#fff;
}
#ContentTabs .List li a:hover {
	background:#fff;
	color:#336699;
	display:block;
}
/*Tabs*/
/*Left Detail*/
#DetailLeftContent{
    width:20%;
    float:left;
	padding:10px 0 0 5px;
}
/*Left Detail*/
#LeftContent{
    width:20%;
    float:left;
	padding:10px 0 0 5px;
}
.LeftSection {
    padding: 3px 3px 20px 0;
    margin-bottom:3px;
}
.LeftSection .content {
    padding: 5px 0;
}
.LeftSection .more {
	margin: 5px 0 0 0;
    padding: 3px 0;
	border:1px solid #336699;
	border-left:none;
	border-right:none;
	text-align:right;
}
.LeftSection .more-less {
	margin: 5px 0 0 0;
    padding: 3px 0;
	border:1px solid #336699;
	border-left:none;
	border-right:none;
	border-top:none;
	text-align:right;
}
/*LeftSideIcon*/
.search {
    background: url(../images/search_48.gif) left -5px no-repeat;
}
.member {
    background: url(../images/user_48.gif) left -5px no-repeat;
}
.motivasi {
    background: url(../images/lightbulb_48.gif) left -5px no-repeat;
}
.polling {
    background: url(../images/polling_48.gif) left -5px no-repeat;
}
.berita {
    background: url(../images/newspaper_48.gif) left -5px no-repeat;
}
.LeftSection a {
    padding: 0 0 3px 0;
    text-decoration:none;
    color:#336699;
}
.LeftSection a:hover {
}
.LeftSection h3 {
    font-family:Georgia;
    font-size:1.3em;
    font-weight:normal;
    color:#557F2A;
    padding: 0 0 5px 20px;
	border-bottom:5px solid #336699;
    border-bottom-color: blue;
    border-bottom-style: groove;
}
.LeftForm {
    list-style:none;
}
.LeftForm li {
    padding:0 0 5px 0;
}
.LeftList {
    list-style:none;
}
.LeftList li {
    padding:0 0 6px 0;
	border-bottom:1px solid #336699;
}

#RightContent{
    width:20%;
    float:right;
	padding:10px 5px 0 0;	
}
.RightSection {
    padding: 3px 0 20px 3px;
    margin-bottom:3px;
}
.RightSection .content {
    padding: 5px 0;
}
.RightSection .more {
	margin: 5px 0 0 0;
    padding: 3px 0;
	border:1px solid #336699;
	border-left:none;
	border-right:none;
	text-align:right;
}
.RightSection .more:hover {
	margin: 5px 0 0 0;
    padding: 3px 0;
	border:1px solid #336699;
	border-left:none;
	border-right:none;
	text-align:right;
}
/*RightSideIcon*/
.camera {
    background: url(../images/camera_48.gif) left -5px no-repeat;
}
.book {
    background: url(../images/book_48.gif) left -5px no-repeat;
}
.mail {
    background: url(../images/mail_48.gif) left -5px no-repeat;
}
.RightSection a {
    padding: 0 0 3px 0;
    text-decoration:none;
    color:#336699;
}
.RightSection a:hover {
}
.RightSection h3 {
    font-family:Georgia;
    font-size:1.3em;
    font-weight:normal;
    color:#557F2A;
    padding: 0 0 5px 20px;
	border-bottom:5px solid #336699;
    border-bottom-color: blue;
    border-bottom-style: groove;
}
.RightSection h4 {
    font-size:1.1em;
    color:#336699;
    padding:0;
    margin-bottom:0;
    margin-top:5px;
}
.RightSection ul {
    list-style:none;
}
.RightSection li {
    padding:0 0 3px 0;
}
.RightSection .photo {
    border:3px solid #fff;
}
#Footer {
	clear:both;
	text-align:center;
	padding:5px 0;
	background:#336699 url(../images/bg_footer.jpg) top;
	color:#FFFFFF;
}
#Footer a {
    text-decoration:none;
    color:#fff;
}
#Footer a:hover {
}
#Footer .content {
    padding: 5px 0;
	line-height:25px;
}
#Footer .menu {
	word-spacing:10px;
}
#Footer .copyright {
	font-size:10px;
}

.chromestyle{
	padding: 7px 0px 6px 0px;
	text-align:left;
	font: Bold 11px Arial, Helvetica, sans-serif;
	border: 1px #45974F solid;
	text-transform: uppercase;

}

.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;

}


.chromestyle ul{
        padding: 0;
        margin: 0;
        text-align: left; 
        list-style-type: none;
}

.chromestyle li{
        padding: 0;
        margin: 0;
        list-style-type: none;	

}

.chromestyle ul li{
	display: inline;
	padding: 0;
	margin: 0;
	list-style-type: none;

}

.chromestyle ul li a{
	COLOR: #FFFFFF;
	TEXT-DECORATION: none;
	border-right:2px #45974F solid;
	padding: 7px 11px 7px 11px;
		list-style-type: none;


}

.chromestyle ul li a:visited{
	COLOR: #FFFFFF;
	TEXT-DECORATION: none;
	border-right:2px #45974F solid;
	padding: 7px 11px 7px 11px;
		list-style-type: none;

}

.chromestyle ul li a:hover{
	COLOR: #FFFFFF;
	border-right:2px #45974F solid;
	TEXT-DECOR-DECORATION: none;
	padding: 7px 11px 7px 11px;
	list-style-type: none;
	background: #ECE9D8 url(../images/bg_navhover.gif) repeat-x center top;
}

.chromestyle ul li a[rel]:after{ /*HTML to indicate drop down link*/

/*content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}


/* ######### Style for Drop Down Menu ######### */

.dropmenudiv{
	position:absolute;
	top: 40px; /*THEME CHANGE HERE*/
	border-bottom-width: 0;
	font:normal 11px Verdana;
	line-height:14px;
	z-index:100;
	visibility: hidden;
	padding: 0;
	float: left;
	width: 600px;
	left: 0px;
        margin:-5px 0 0 -145px;
        vertical-align: top;
}


.dropmenudiv a{
	text-indent: 3px; /*THEME CHANGE HERE*/
	text-decoration: none;
	color: #000000;
	margin: 1px 2px 0 0;
	font-weight: bold;
	padding: 10px 10px 5px 10px;
	font-size: 9px;
	border-left: 1px solid #ccc;
}

 .dropmenudiv a{ /*IE only hack*/
width: 100%;
}

.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
color: #DE3120;

}
ul.menu .sub {background:#d1d1d1 url(images/arrow.gif) 136px 8px no-repeat}
ul.menu .topline {border-top:1px solid #aaa}