@charset "UTF-8";
* { padding:0px; margin:0px; } 
body { background:#FFFFFF; font-family:arial; color:#333333; font-size:14px; line-height:27px; }
table { color:#333333; font-family:arial; font-size:14px; line-height:27px; }
a:link, a:visited { color:#333333; text-decoration:none; }
a:hover { color:#88AA00; text-decoration:none; }

input { background:#F8F8F8 url(bgform.png) repeat-x ; border:1px solid #DDDDDD;; padding:5px; color:#444444; font-family:arial; font-size:14px; } 
select {  background:#F8F8F8 url(bgform.png) repeat-x; border:1px solid #DDDDDD;; padding:5px; color:#444444; font-family:arial; font-size:14px; }
textarea {  background:#F8F8F8 url(bgform.png) repeat-x; border:1px solid #DDDDDD;; padding:5px; color:#444444; font-family:arial; font-size:14px; }
 
h1 { font-size:28px; font-weight:normal; line-height:36px; }
h2 { font-size:28px; font-weight:bold; line-height:54px;  }
h3 { font-size:20px; font-weight:normal; line-height:36px;  }
h4 { font-size:16px; font-weight:normal; line-height:27px; }
h5 { font-size:12px; font-weight:normal; line-height:27px; }
h6 { font-size:10px; font-weight:normal; line-height:27px; }

#container {  }
#head { width:100%; border-top:1px solid #FFFFFF;  background:#FFFFFF url(bghead2.png) center top repeat-x; padding-bottom:20px; }
.head { width:96%; max-width:1100px; display:table;  }
.headleft { float:left; display:table; padding:20px 0px; width:50%; text-align:left;   }
.headright { float:right; display:table;  padding-top:20px; width:50%; text-align:right;  }
@media only screen and (max-width:480px) {
	.headleft { display:table; padding-top:20px; width:100%; text-align:left; }
	.headright { display:table;  padding:0px 0px; width:100%; text-align:right; }
}
#menu {  width:100%; border-bottom:5px solid #88AA00; }
.menu { width:96%; max-width:1100px; display:table; text-align:left; color:#FFFFFF;  background:#88AA00 url(bgmenu.png) top center repeat-x; -moz-border-radius:20px 20px 0px 0px; border-radius:20px 20px 0px 0px; -webkit-border-radius:20px 20px 0px 0px; z-index:1080;   }
.menu2 { width:96%; max-width:1100px; display:table; text-align:left; color:#FFFFFF;  display:none; }
@media only screen and (max-width:768px) {
	.menu { width:96%; max-width:1100px; display:table; text-align:left; color:#FFFFFF; }
	.menu2 { width:96%; max-width:1100px; display:table; text-align:left; color:#FFFFFF;   }
}
#top { width:100%; background:url(waves.gif) top; padding:10px 0px 10px 0px;  }
.top { width:100%; max-width:1100px; display:table; z-index:1040;  }
@media only screen and (max-width:480px) {
	#top { width:100%; background:#FFFFFF url(bghead2.png) center top repeat-x; display:none;  }
	.top { width:100%; display:table; z-index:1040; display:none; }
}
#main { width:100%;  }
.main { width:96%; max-width:1100px; display:table; padding:15px 0px; }
.main a:link, .main a:visited{ color:#444444; text-decoration:none; }
.main a:hover{ color:#88AA00; text-decoration:none; }
.main li { margin-left:15px; list-style:square; }
.mainbar { width:70%; display:table; float:left; text-align:left; padding-right:1.5%; }
.sidebar { width:28.5%; display:table; float:right; text-align:left; }
@media only screen and (max-width:800px) {
	.mainbar { width:100%; padding:0%; }
	.sidebar { width:100%; margin-top:10px; max-width:400px;  }
}
.mainbar2 { width:70%; display:table; float:right; text-align:left; padding-left:1.5%; }
.sidebar2 { width:28.5%; display:table; float:left; text-align:left; }
@media only screen and (max-width:800px) {
	.mainbar2 { width:100%; }
	.sidebar2 { width:100%; margin-top:10px; max-width:400px; }
}
.halfbar { width:54%; display:table; float:left; margin-left:23%; text-align:left; }
.leftbar { width:22%; display:table; float:left; margin-left:-77%; text-align:left;  }
.rightbar { width:22%; display:table; float:right; text-align:left; }
@media only screen and (max-width:800px) {
	.halfbar { width:100%; margin-left:0%; }
	.leftbar { width:100%; max-width:400px; margin-left:0%; }
	.rightbar { width:100%; max-width:400px; float:left; }
}
.halfbar2 { width:54%; display:table; float:left; text-align:left; padding-right:1% }
.leftbar2 { width:22%; display:table; float:left; text-align:left;  }
.rightbar2 { width:22%; display:table; float:right; text-align:left; }
@media only screen and (max-width:800px) {
	.halfbar2 { width:100%; margin-left:0%; }
	.leftbar2{ width:100%; max-width:400px; }
	.rightbar2 { width:100%; max-width:400px; float:left; }
}
.halfbar3 { width:54%; display:table; float:right; text-align:left; }
.leftbar3 { width:22%; display:table; float:left; text-align:left;  }
.rightbar3 { width:22%; display:table; float:left; text-align:left;  padding-left:1% }
@media only screen and (max-width:800px) {
	.halfbar3 { width:100%; margin-left:0%; float:left;  }
	.leftbar3{ width:100%; max-width:400px; }
	.rightbar3 { width:100%; max-width:400px; padding-left:0%;  }
}
.mainbarfull { width:100%; display:table; text-align:left; }
#bottom { width:100%; background:#88AA00 url(bgbottom.png);  }
.bottom { width:96%; max-width:1100px; display:table; }
.bottom_isi{ width:23%; float:left; display:table; padding:0% 0% 0% 1%; }
@media only screen and (max-width:800px) {
	.bottom_isi{ width:46%; padding:1%; }
}
@media only screen and (max-width:480px) {
	.bottom_isi{ width:98%; padding:1%; }
}
#foot { width:100%; background:#88AA00 url(bgbottom.png); }
.foot { width:96%; max-width:1100px; display:table; color:#FFFFFF; border-top:1px solid #779900; font-size:13px; line-height:18px; padding:20px 0px;  text-align:left; }
.foot a:link, .foot a:visited {  text-decoration:none; color:#FFFFFF;  }
.foot a:hover { text-decoration:none; color:#FFFF00; }

.panel { padding:8px; margin-bottom:15px; background:#F0F0F0 url(bgpanel.png) top repeat-x; border:1px solid #DDDDDD; -moz-border-radius:25px; border-radius:25px ; -webkit-border-radius:25px;  }
.panel_judul { text-align:left; background:#88AA22 url(bgform.png) center bottom repeat-x;   padding:5px 12px; -moz-border-radius:20px; border-radius:20px ; -webkit-border-radius:20px; }
.panel_judul span { color:#FFFFFF; font-size:17px; font-weight:normal;}
.panel_isi { text-align:left; color:#333333; padding:8px 0px; border-top:none;  display:table; width:100%; }
.panel_isi a:link, .panel_isi a:visited{ text-decoration:none; color:#333333;}
.panel_isi a:hover{ color:#88AA00;	text-decoration:none;  }
.panel ul {  }
.panel li { line-height:27px; list-style:square; margin-left:15px; }
.panel_list { display:table; width:100%; padding:5px 0px; border-bottom:1px dotted #F0F0F0; line-height:27px; }
.home { padding:10px 0px; margin-bottom:15px; border-bottom:1px dotted #E4E4E4;  }
.home_judul { text-align:left; }
.home_judul span { color:#444444; font-size:28px; font-weight:normal;}
.home_isi { text-align:left; color:#444444; border-top:none;  display:table; width:100%; }
.home_isi a:link, .home_isi a:visited{ text-decoration:none; color:#444444;}
.home_isi a:hover{ color:#88AA00;	text-decoration:none;  }
.home ul {  }
.home li { line-height:27px; list-style:square; margin-left:15px; }
.home_list { display:table; width:100%; padding:5px 0px; border-bottom:1px dotted #F0F0F0; }
.panelbottom { color:#FFFFFF;; }
.panelbottom_judul { text-align:left;  }
.panelbottom_judul span { color:#FFFFFF;; font-size:17px; font-family:arial; font-weight:normal; text-align:left; text-transform:capitalize; }
.panelbottom_isi { padding:5px 0px; text-align:left; color:#FFFFFF;;}
.panelbottom_isi a:link, .panelbottom_isi a:visited{  text-decoration:none; color:#FFFFFF;; }
.panelbottom_isi a:hover{ color:#FFFF00; text-decoration:none; }
.panelbottom_isi ul {  }
.panelbottom_isi li { line-height:27px; list-style:square; margin-left:15px; }

.komentar{ border-bottom:1px dotted #EAEAEA; display:table; width:100%;}
.button{ background:#88AA00; border:1px solid #668800; color:#FFFFFF; font-weight:bold; padding:5px; cursor:pointer;}
.button2{ background:#CC0000; color:#FFFFFF; padding:8px 8px; cursor:pointer;}

.gambarkecilsekali { width:80px; margin:5px 10px 0px 0px;  border:3px solid #FFFFFF;  }
.gambarkecil { width:50%; max-width:220px; margin:5px 15px 0px 0px; border:5px solid #FFFFFF;  -moz-box-shadow:0 2px 5px #E4E4E4;-webkit-box-shadow:0 2px 5px #E4E4E4;box-shadow:0 2px 5px #E4E4E4; /* border-radius:50%; -moz-border-radius:50%;  -webkit-border-radius:50%; */ }
.gambarbesar { width:50%; max-width:400px; margin:5px 15px 0px 0px;  border:8px solid #FFFFFF;  -moz-box-shadow:0 2px 5px #E4E4E4;-webkit-box-shadow:0 2px 5px #E4E4E4;box-shadow:0 2px 5px #E4E4E4;}
.gambarsedang { width:50%;  margin:8px 0px 4px 0px; }
@media only screen and (max-width:480px) {
	.gambarbesar { width:96%; border:0px solid #FFFFFF; margin:5px 0px;  border:5px solid #FFFFFF;  -moz-box-shadow:0 2px 5px #E4E4E4;-webkit-box-shadow:0 2px 5px #E4E4E4;box-shadow:0 2px 5px #E4E4E4; }
	.gambarsedang { width:96%; border:0px solid #FFFFFF; margin:5px 0px;  border:5px solid #FFFFFF;  -moz-box-shadow:0 2px 5px #E4E4E4;-webkit-box-shadow:0 2px 5px #E4E4E4;box-shadow:0 2px 5px #E4E4E4;}
}
.gambarmember { width:40%; max-width:160px; margin:8px 15px 0px 0px; border:1px solid #EAEAEA;  padding:1%; }
.gambargaleri { width:94%; border:1px solid #EAEAEA; padding:3%; -moz-box-shadow:0 2px 5px #E4E4E4;-webkit-box-shadow:0 2px 5px #E4E4E4;box-shadow:0 2px 5px #E4E4E4;  }

#tabellist { text-align:center; color:#444444; border-top:1px solid #E4E4E4; border-left:1px solid #E4E4E4; }
#tabellist tr:hover{ background:#F0F0F0; color:#444444; }
#tabellist th{ padding:5px 5px; border-bottom:1px solid #E4E4E4; border-right:1px solid #E4E4E4; background:#EAEAEA; text-transform:capitalize; font-size:14px; text-align:center;}
#tabellist td{ padding:5px 5px; border-bottom:1px solid #E4E4E4; border-right:1px solid #E4E4E4; vertical-align:top; text-align:center; }
#tabellist a:link, #tabelview a:visited { text-decoration:none; color:#444444; }
#tabellist a:hover { text-decoration:none; color:#000000; background:none; }
#tabelview { text-align:center; color:#444444; }
#tabelview tr:hover{ vertical-align:top }
#tabelview td{ padding:5px 0px; border-bottom:1px solid #E4E4E4; vertical-align:top; text-align:left; text-transform:capitalize; }
#tabelview a:link, a:visited { text-decoration:none; color:#444444; }
#tabelview a:hover { text-decoration:none; color:#000000; }

.nav { width:100%; max-width:1100px; float:left; background:#88AA00 url(bgmenu.png) top center repeat-x; -moz-border-radius:20px; border-radius:20px ; -webkit-border-radius:20px; }
.nav div {  }
.nav a { text-decoration: none; }
.nav li { list-style:none; text-align:left; font-weight:normal; font-weight:bold; font-size:17px; }
.nav { display:table; position:relative; cursor:default; z-index:1002; }
.nav > li { display:block; float:left;  }
.nav > li > a { position:relative; display:block; z-index:1003; padding:8px 16px; color:#FFFFFF; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; -ms-transition: all .3s ease;transition: all .3s ease; }
.nav > li:hover > a { color:#FFFF00; background:#668800; }
.nav > li > div {  position:absolute; display:block; margin-top:0px; padding:0px 16px; font-weight:normal; background:#668800; visibility:hidden; overflow:hidden; -webkit-transition: all .3s ease .15s;	-moz-transition: all .3s ease .15s;	-o-transition: all .3s ease .15s;-ms-transition: all .3s ease .15s;transition: all .3s ease .15s; }
.nav > li:hover > div { color:#FFFFFF; background:#668800;  padding:6px 16px; visibility:visible; overflow:visible; }
.nav .nav-column { width:200px;  text-align:left; color:#FFFFFF; text-transform:capitalize; }
.nav .nav-column a { display:block; color:#FFFFFF; }
.nav .nav-column a:hover { color:#FFFF00; }

.mnav { float:left; width:100%; background:#88AA00 url(bgmenu.png) top center repeat-x; padding:0px 0px; margin-top:25px;   }
.mnav div {  }
.mnav a { text-decoration: none; }
.mnav li { list-style:none; text-align:center; text-align:left; font-weight:bold; font-size:16px; color: #333333;   }
.mnav { display:table; position:relative; cursor:default; z-index:1002; }
.mnav > li { display:block; float:left;  }
.mnav > li > a {	position:relative; display:block; z-index:1003; padding:0px 10px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; -ms-transition: all .3s ease;transition: all .3s ease; }
.mnav > li:hover > a { background: #88AA00; color:#FFFF00;  }
.mnav > li > div {  position:absolute; color:#FFFFFF; display:block; left:0; padding:0px 0px; visibility:hidden; overflow:hidden; -webkit-transition: all .3s ease .15s;	-moz-transition: all .3s ease .15s;	-o-transition: all .3s ease .15s;-ms-transition: all .3s ease .15s;transition: all .3s ease .15s; }
.mnav > li:hover > div { color:#FFFF00; background:#88AA00; visibility:visible; overflow:visible; }
.mnav .mnav-column { width:250px;  text-align:left; color:#FFFFFF; font-size:14px; text-transform:capitalize; }
.mnav .mnav-column a { display:block; color:#FFFFFF; padding:2px 10px; }
.mnav .mnav-column a:hover { color:#FFFF00; background:#668800; }

.artkolom{ float:left; width:32%; height:230px; display:table; text-align:left; }
.artkolomtanggal{ font-size:11px; background:#FFFFFF; float:right; margin:-40px 0 0 0; z-index:1001; padding:0px 5px; position:relative; opacity:0.8; }
.artgambar{ float:left; width:46.5%; height:300px; padding-left:2%; border:1px solid #EAEAEA; }
.artgambarspasi{ margin-top:220px; }
.artgambarjudul{ color:#333333; background:#CCCCCC; line-height:20px; padding:5px; font-size:15px; font-weight:bold; opacity:0.8; }
.artgambarjudul a:link, .artgambarjudul a:visited {  text-decoration:none;  }
.artkategori{ width:49%; display:table; margin:5px 0% ; }
.artkategorilist { display:table; width:100%; padding:5px 0px; border-bottom:1px dotted #F0F0F0;}
@media only screen and (max-width:480px) {
	.artkolom{ float:left; width:48%; height:auto; display:table; text-align:left; }
	.artkolomtanggal{ font-size:11px; background:#FFFFFF; float:right; margin:-40px 0 0 0; z-index:1001; padding:0px 5px; position:relative; opacity:0.8; display:none; }
	.artgambar{ float:left; width:98%; height:200px; padding-left:2%; border:1px solid #EAEAEA; }
	.artgambarspasi{ margin-top:120px; }
	.artgambarjudul{ color:#333333; background:#CCCCCC; line-height:20px; padding:5px; font-size:15px; font-weight:bold; opacity:0.8; }
	.artgambarjudul a:link, .artgambarjudul a:visited {  text-decoration:none;  }
	.artkategori{ width:98%; display:table; margin:5px 0% ; }
	.artkategorilist { display:table; width:100%; padding:5px 0px; border-bottom:1px dotted #F0F0F0;}	
}
.artgambarside{ width:95%; height:150px; padding:5% 0% 5% 5%; margin-bottom:10px;}
.artgambarsidespasi{ margin-top:100px; }
.artgambarsidejudul{ color:#333333; background:#CCCCCC; line-height:20px; padding:4px; font-size:15px; font-weight:bold; opacity:0.8; }

/* tambahan */
#psbban { width:100%;display:table; background-size:100%; }
.psbban { width:96%; max-width:1100px; display:table; color:#FFFFFF;padding:150px 0px 100px 0px; }
.psbban_judul { font-size:42px; }
.psbban_isi { padding:40px 0px; width:60%; }
.psbban_button { background:#FFFFFF; padding:10px 20px; font-weight:bold; font-size:24px; }
@media only screen and (max-width:480px) {
#psbban { background-size:200%; }
.psbban { color:#FFFFFF;padding:40px 0px 30px 0px; }
.psbban_judul { font-size:32px; }
.psbban_isi { padding:10px 0px; width:100%; }
.psbban_button { padding:5px 10px; font-size:18px; }
}

p { text-align:left; }
.toggle, [id^=drop] { display: none; }
nav {  margin:0; padding:0; color:#FFFFFF; z-index:9999999; }
nav a:link, nav a:visited { color:#FFFFFF; text-decoration:none;  }
nav:after { content:""; display:table; clear:both; }
nav ul {float:left; padding:0; margin:0; list-style:none; position:relative; }
nav ul li { margin:0px; display:inline-block; float:left;  }
nav a { display:block; padding:0px 15px;  font-size:15px; line-height:40px; text-decoration:none; color:#FFFFFF; }
nav ul li ul li:hover { background:#88AA00 ; color:#FFFFFF; line-height:30px;  }
nav a:hover { background:#88AA00 ; color:#FFFFFF; }
nav ul ul { display:none; position:absolute; top:40px; }
nav ul li:hover > ul { display:inherit; }
nav ul ul li { width:250px; float:none;position:relative; display:list-item; z-index:99999999;  background:#88AA00 url(bgmenu.png) top center repeat-x; }
nav ul ul ul li { position:relative; top:-40px; left:200px;z-index:99999999; }
li > a:after { content:''; }
li > a:only-child:after { content:''; }
@media all and (max-width :768px) {
	nav { margin:0; }
	.toggle + a, .menu3 { display:none; }
	.toggle { display:block; padding:0 15px; color:#FFFFFF; font-size:15px; line-height:40px; text-decoration:none; border:none; }
	.toggle:hover { background:#88AA00 ; }
	[id^=drop]:checked + ul { display:block; }
	nav ul li { display:block; width:100%; }
	nav ul ul .toggle, nav ul ul a { padding:0 40px; }
	nav ul ul ul a { padding:0 60px; }
	nav a:hover, nav ul ul ul a { background:#88AA00 color:#FFFF00;; }
	nav ul li ul li .toggle, nav ul ul a {  }
	nav ul ul { float:none; position:static; color:#FFFFFF; }
	nav ul ul li:hover > ul,
	nav ul li:hover > ul { display:none; }
	nav ul ul li { display:block; width:100%; }
	nav ul ul ul li { position:static; } 
}
@media all and (max-width :330px) {
	nav ul li { display:block; width:94%; }
}

#view { display:table; width:100%; border-bottom:1px solid #EAEAEA; padding:5px 0px; }
.view_label { float:left; width:18%; text-transform:capitalize; vertical-align:top; text-align:left;  }
.view_dot { float:left; width:2%; vertical-align:top; text-align:left; }
.view_content { float:left; width:80%; vertical-align:top; text-align:left; }
@media only screen and (max-width:768px) {
	.view_label { width:23%; }
	.view_dot { display:3%; }
	.view_content { width:74%; }
}
@media only screen and (max-width:480px) {
	.view_label { float:none; width:100%; font-weight:bold; }
	.view_dot { float:none; display:none; }
	.view_content { float:none; width:100%; }
	.button_add { background:#CCCCCC; color:#FFFFFF;	font-weight:bold; padding:2px 4px; cursor:pointer; border:1px solid #AAAAAA; }
}