/*
 * File CSS Utama - Versi Rapi dan Bersih
 * Reset CSS
*/
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}
* { margin: 0; padding: 0;}
body { 
  text-align: left; 
  font-family: Helvetica, Verdana, Arial, sans-serif; 
  font-size: 11pt;
  margin:0;
  padding:0;
  line-height: 1.5em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-image: none !important;
  background-color: #ffffff !important;
  font-weight: 400;
  overflow-x: hidden;
  overflow-y: auto;
}
img { border: 0; }
ul { list-style: none; margin: 0; padding: 0px; }
a, a:active, a:visited { text-decoration: none; background-color: inherit; color: #18507C; }
a:hover { text-decoration: none; background-color: inherit; color: #0C9FD5; }

/* Komponen Penting */
.pull-right{float:right!important;}
.innertube{margin: .5em;margin-top: 0;}
.innertubekiri{margin: 1em;margin-top: 0;margin-left:0;}
.innertubekanan{margin: 1em;margin-top: 0;margin-right:0;}
.small{font-size:.8em;font-weight:normal;}
.angka{text-align:right!important;margin-right:.5em;}
b{font-size: 110%;}
em{color: red;}

/* LayOut Tata Letak Dasar */
#maincontainer {
  width: 990px;
  margin: 0 auto;
  background: #ffffff;
}
#contentwrapper { float: left; width: 100%; }
#contentcolumn { margin-right: 300px; }
#rightcolumn { float: left; width: 300px; margin-left: -300px; }

#footer {
  font-size:.8em; clear: left; width: 100%; color: #FFF; text-align: center; padding: 4px 0; background:  #333333;
}
#footer a { color: #FFF000; }
#chart { height:400px; }

/* 
 * ==========================================
 * PERBAIKAN HEADER & NAVBAR (SUDUT RATA) 
 * ==========================================
*/
#header { float: left; width: 100%; }

/* 1. Kotak Header Biru */
#topsection {
  background: #1E3A8A !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
  height: 150px;
}
#topsection h1 { margin: 0; padding-top: 15px; }

/* Posisi Logo dan Judul */
#headleft { float: left; width: 350px; margin-left: -100%; }
#divlogo-img { float: left; width: 100px; padding: 3px; margin-left: -100%; text-align: center; }
#divlogo-img img { height: 100px; margin-top: 15px; }
#divlogo-txt { margin-left: 100px; color: #204C88; }

#siteTitle { padding: 0 0 0 10px; line-height: 1.5em; }
#siteTitle h1 { font-family: "Arial Black", Gadget, sans-serif; font-size: 21px; color: #FFFFFF !important; font-weight: bold; margin: 0; padding-top: 15px; }
#siteTitle h2 { font-family: "Arial Black", Gadget, sans-serif; font-size: 15px; color: #FFFFFF !important; font-weight: bold; margin-top: 0px; }
#siteTitle h3 { font-family: "comic sans", Gadget, sans-serif; font-size: 11px; color: #FDE047 !important; font-weight: bold; margin-top: 0px; }

/* Wadah Menu Sebelah Kanan */
#headercontent { margin-left: 350px; padding: 0 !important; }

/* 2. Navbar Atas (Profil, Pemerintahan, dll) */
#menu_vert, 
#menu_vert .navbar-inverse, 
nav.navbar.navbar-inverse {
  background-color: #eb6117 !important;
  background-image: none !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  top: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  height: 30px;
  display: block !important;
}
#menu_vert a { display: block; }
#menu_vert a.dropdown-toggle { padding-top: 5px; height: 30px; }

/* 3. Teks Berjalan (Scroller) */
#scroller {
  background-color: #382319 !important;
  background-image: none !important;
  border: none !important;
  margin: 0 !important;
  padding: 3px 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  height: 25px !important;
  display: block !important;
  float: none !important;
}
/* Paksa teks dalam scroller menjadi putih polos (hilangkan merah) */
#scroller, #scroller marquee, #scroller span, #scroller p, #scroller font, #scroller a { 
  color: #FFF000 !important; 
}

/* 4. Navbar Bawah (Beranda, Potensi, dll) */
#mainmenu, 
#mainmenu .navbar-inverse {
  background-color: #5696e0 !important;
  background-image: none !important;
  border: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
  height: 30px;
  float: left;
}


/* 
 * ==========================================
 * KOMPONEN HALAMAN (BOX, ARTIKEL, TOMBOL)
 * ==========================================
*/
table { border-spacing: 0; border-collapse: collapse; background-color: transparent; }
td, th { padding: 0; }

.box {
  position: relative; border-radius: 3px; background: #ffffff;
  border-top: 3px solid #d2d6de; margin-bottom: 20px; width: 100%;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
.box.box-primary { border-top-color: #3c8dbc; }
.box.box-info { border-top-color: #00c0ef; }
.box.box-danger { border-top-color: #dd4b39; }
.box.box-warning { border-top-color: #f39c12; }
.box.box-success { border-top-color: #00a65a; }
.box.box-default { border-top-color: #d2d6de; }
.box.collapsed-box .box-body, .box.collapsed-box .box-footer { display: none; }
.box .nav-stacked > li { border-bottom: 1px solid #f4f4f4; margin: 0; }
.box .nav-stacked > li:last-of-type { border-bottom: none; }
.box.height-control .box-body { max-height: 300px; overflow: auto; }
.box .border-right { border-right: 1px solid #f4f4f4; }
.box .border-left { border-left: 1px solid #f4f4f4; }
.box.box-solid { border-top: 0px; }
.box.box-solid > .box-header .btn.btn-default { background: transparent; }
.box.box-solid > .box-header .btn:hover, .box.box-solid > .box-header a:hover { background: rgba(0, 0, 0, 0.1) !important; }
.box.box-solid.box-default { border: 1px solid #d2d6de; }
.box.box-solid.box-default > .box-header { color: #444444; background: #d2d6de; }
.box.box-solid.box-default > .box-header a, .box.box-solid.box-default > .box-header .btn { color: #444444; }
.box.box-solid.box-primary { border: 1px solid #3c8dbc; }
.box.box-solid.box-primary > .box-header { color: #ffffff; background: #3c8dbc; }
.box.box-solid.box-primary > .box-header a, .box.box-solid.box-primary > .box-header .btn { color: #ffffff; }
.box.box-solid.box-info { border: 1px solid #00c0ef; }
.box.box-solid.box-info > .box-header { color: #ffffff; background: #00c0ef; }
.box.box-solid.box-danger { border: 1px solid #dd4b39; }
.box.box-solid.box-danger > .box-header { color: #ffffff; background: #dd4b39; }
.box.box-solid.box-warning { border: 1px solid #f39c12; }
.box.box-solid.box-warning > .box-header { color: #ffffff; background: #f39c12; }
.box.box-solid.box-success { border: 1px solid #00a65a; }
.box.box-solid.box-success > .box-header { color: #ffffff; background: #00a65a; }
.box-header { color: #444; display: block; padding: 10px; position: relative; }
.box-header:before, .box-header:after { content: " "; display: table; }
.box-header:after { clear: both; }
.box-header.with-border { border-bottom: 1px solid #f4f4f4; }
.box-header > .fa, .box-header > .glyphicon, .box-header > .ion, .box-header .box-title { display: inline-block; font-size: 18px; margin: 0; line-height: 1; margin-right: 5px; }
.box-body { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; padding: 10px; }

/* Artikel */
.artikel-list { list-style: none; margin: 0; padding: 0; }
.artikel-list > .item { border-radius: 3px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); padding: 10px 0; background: #fff; }
.artikel-list > .item:after { content: " "; display: table; clear: both; }
.artikel-list .artikel-img { float: left; }
.artikel-list .artikel-img img { width: 240px; }
.artikel-list .artikel-info { margin-left: 260px; }
.artikel-list .artikel-title { font-weight: 600; }
.artikel-list .artikel-description { display: block; color: #999; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.artikel {margin-top: 1em;padding:.8em 1em 1px 1em;background-color:#ffffff;}
.artikel .judul {font-size:1.25em;color:#337ab7;line-height:1em;margin-bottom:.5em;}
.artikel .kecil {font-size:.8em;color:#040404;font-style:italic;font-weight:400;margin-bottom:.5em;}
.artikel .teks {font-size:1em; margin-right:.5em;}
.artikel .sampul {margin: 1em 0; display:block;width:100%;}
.artikel .sampul img {margin-left: auto; margin-right: auto;}
.artikel .teks img {margin-right: 7px; margin-bottom: 5px; float: left;width:260px;background:#ccc;border:solid 1px #aaa;padding:.5em;}
.gb {border-bottom:solid 2px #eee;}

/* Pagination */
.pagination { display: inline-block; padding-left: 0; margin: 20px 0; border-radius: 4px; }
.pagination > li { display: inline; }
.pagination > li > a, .pagination > li > span { position: relative; float: left; padding: 6px 12px; margin-left: -1px; line-height: 1.42857143; color: #337ab7; text-decoration: none; background-color: #fff; border: 1px solid #ddd; }
.pagination > .active > a, .pagination > .active > span { z-index: 2; color: #fff; cursor: default; background-color: #337ab7; border-color: #337ab7; }

/* Table */
.table { border-collapse: collapse !important; width: 100%; max-width: 100%; margin-bottom: 20px; }
.table td, .table th { background-color: #fff !important; padding: 8px; line-height: 1.42857143; vertical-align: top; border-top: 1px solid #ddd; }
.table-bordered th, .table-bordered td { border: 1px solid #ddd !important; }

/* Buttons */
.btn { display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: normal; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; border: 1px solid transparent; border-radius: 4px; }
.btn-primary { color: #fff; background-color: #337ab7; border-color: #2e6da4; }
.btn-success { color: #fff; background-color: #5cb85c; border-color: #4cae4c; }
.btn-block { display: block; width: 100%; margin-top: 5px; }

/* Responsif */
@media (max-width: 940px){ 
  #maincontainer { width: 100%; }
  #contentwrapper { float: none; }
  #rightcolumn { float: none; width: 100%; margin-left: 0; }
  #contentcolumn { margin-right: 0; }
}

/* 1. Mengubah latar belakang kotak submenu menjadi oranye */
.dropdown-menu,
#menu_vert .dropdown-menu, 
#mainmenu .dropdown-menu {
    background-color: #eb6117 !important;
    border: 1px solid #c24f10 !important; /* Garis tepi oranye gelap agar lebih tegas */
    border-radius: 0 !important; /* Kotak bersudut tegas */
    padding: 0 !important;
    box-shadow: 0px 4px 6px rgba(0,0,0,0.3) !important; /* Sedikit bayangan agar melayang elegan */
}

/* 2. Mengubah warna teks submenu menjadi putih */
.dropdown-menu > li > a,
#menu_vert .dropdown-menu > li > a,
#mainmenu .dropdown-menu > li > a {
    color: #ffffff !important;
    padding: 10px 15px !important; /* Memberi ruang agar tulisan tidak berdempetan */
    border-bottom: 1px solid #d95813 !important; /* Garis pembatas tipis antar menu */
}

/* 3. Menghilangkan garis pembatas di menu paling bawah */
.dropdown-menu > li:last-child > a {
    border-bottom: none !important;
}

/* 4. Mengubah warna saat kursor diarahkan (hover) ke submenu */
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
#menu_vert .dropdown-menu > li > a:hover,
#mainmenu .dropdown-menu > li > a:hover {
    background-color: #c24f10 !important; /* Oranye gelap saat disorot mouse */
    color: #ffffff !important;
}

/* Menargetkan semua jenis kotak submenu di navbar bawah */
#mainmenu .dropdown-menu,
#mainmenu ul li ul,
#mainmenu ul.dropdown-menu {
    background-color: #eb6117 !important;
    background-image: none !important;
    border: 1px solid #c24f10 !important;
    padding: 0 !important;
}

/* Memastikan warna latar belakang dan teks di dalam daftarnya juga ikut berubah */
#mainmenu .dropdown-menu > li,
#mainmenu ul li ul > li,
#mainmenu .dropdown-menu > li > a,
#mainmenu ul li ul > li > a {
    background-color: #eb6117 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #d95813 !important;
}

/* Menghilangkan garis bawah pada menu terakhir */
#mainmenu .dropdown-menu > li:last-child > a,
#mainmenu ul li ul > li:last-child > a {
    border-bottom: none !important;
}

/* Warna saat disorot kursor (hover) */
#mainmenu .dropdown-menu > li > a:hover,
#mainmenu ul li ul > li > a:hover,
#mainmenu .dropdown-menu > li:hover > a,
#mainmenu ul li ul > li:hover > a {
    background-color: #c24f10 !important; /* Oranye gelap */
    color: #ffffff !important;
}

/* --- MENGHILANGKAN OPASITAS / TRANSPARANSI PADA SUBMENU BAWAH --- */
#mainmenu .dropdown-menu,
#mainmenu ul li ul,
#mainmenu ul.dropdown-menu {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
    box-shadow: none !important;
}

#mainmenu .dropdown-menu > li > a,
#mainmenu ul li ul > li > a {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

/* --- MENEBALKAN JUDUL ARTIKEL --- */
.box-title,
.judul,
.judul a {
    font-weight: bold !important;
}