html, body { font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 1.428; }
body { background: whitesmoke; }
.navbar { padding-top: 0; padding-bottom: 0; background-color: #1b6d85;
  border-radius: 0; border: none; border-bottom: 4px solid #ddd; }
.navbar-brand { line-height: 50px; padding: 0; margin-right: 12px; color: black; font-size: 18px }
.navbar-brand:hover { color: black }
.nav-link { line-height: 50px; padding: 0; width: 100%; text-align: center; font-size: 14px } /*padding=tinggi menu*/
.navbar-nav > li > a { margin: 0 8px; color: #E6E9ED; } /*lebar & warna menu utama*/
.navbar-nav > li > a:hover { color: orange; }
.navbar .dropdown.show a { background-color: #ddd; color: #000; }
.largemenu { position: static !important; }
.megamenu { width: 100%; padding: 14px 36px 18px; border-radius: 0; border: none;
  margin-top: 4px !important; border-bottom: 2px solid maroon; background: white; }
.megamenu ul { padding: 0; margin: 0; }
.megamenu .dropdown-header { padding: 3px 12px; color: #117a8b; font-size: 14px; font-weight: bold } /*12px*/
.megamenu ul > li { list-style: none; font-size: 14px }
.megamenu ul > li > a { display: block; padding: 3px 12px; background: transparent !important; } /*12px*/
.megamenu ul > hr { margin: 8px 0 8px 12px; } /*12px*/
.megamenu ul > li > a:hover { text-decoration: none;
  color: #E6E9ED !important; background: #117a8b !important; }
.panel1 { position: fixed; left: 0; top: 54px; bottom: 0; width: 50px; padding-top: 10px;
  background: #1b6d85; line-height: 38px; font-size: 18px; text-align: center; }
.panel1 a, .panel1 button { padding: 6px; color: #E6E9ED; 
  line-height: 16px; background: none; border: none; outline: 0 } /*utk button*/
.panel2 { position: fixed; top: 54px; left: 50px; right: 0; line-height: 44px; 
  padding: 0 17px; box-shadow: 0 4px 2px -2px gray; z-index: 999; background: whitesmoke }
.panel2 a, .panel2 button { padding: 0; color: #1b6d85; margin-right: 12px; 
  line-height: 24px; background: none; border: none; outline: 0 }
.toolbtn { padding: 0; color: #1b6d85; background: none; border: none; outline: 0 }
.panel1 a:hover, .panel1 button:hover, .panel2 button:hover,
.panel2 a:hover, .toolbtn:hover { color: orange; text-decoration: none; cursor: pointer; }
.panel3 { position: absolute; top: 98px; right: 0; bottom: 0; left: 50px;
  padding: 20px 17px 0; overflow-y: auto }
table td, table th { padding-top: 0 !important; padding-bottom: 0 !important }
table.table { width: 100% !important; line-height: 26px; border-top: hidden; } /*tinggi baris*/
.table tfoot > tr > th { border-bottom: hidden; }
table { cursor:default; -moz-user-select: none; } /*disable text select*/
.table-striped>tbody>tr:nth-child(odd) { background-color: white; }
.dataTable > thead > tr > th[class*="sort"]:before { display: none }
.dataTable > thead > tr > th[class*="sort"]:after { display: none }
.dataTable > thead > tr > th { padding-right: 10px !important; }
.dataTable tbody tr.selected { color: #fff; background-color: #117a8b; }
.dataTables_info { line-height: 6px; } /*jarak info dg tabel*/
.dataTables_paginate a { line-height: 16px!important; background: #ddd!important; 
  box-shadow: none!important; border-color: #ddd!important }
td input:not([type="checkbox"]), .thfoot { 
  background: none; border: none; max-height: 20px !important; width: 100% }
td .select2-selection { background: none !important; border: none !important; max-height: 20px !important; 
  margin-top: -2px; margin-left: -8px; width: calc(100% + 12px) !important; }
td .select2-selection__placeholder { color: transparent !important; }
.select2-selection__arrow b { display:none !important }
.select2-selection__clear { color: grey !important; }

.col-form-label { padding-bottom: 0 }
.form-control, .input-group, .no-group { margin-bottom: 4px; }
label > input { margin-bottom: 13px }
.form-control:focus, .btn:focus, .select2-container--focus .select2-selection:focus { box-shadow: none; }
.judul { color: #1b6d85; text-transform: uppercase; margin: 4px 0 0; font-size: 16px }
.subjudul { font-size: 13px; color: #73879C; margin: 4px 0 0; } 
.garis { border-bottom: 1px solid #E6E9ED; margin: 8px 0; }
.footer { border-top: 1px solid #E6E9ED; padding: 10px 0 4px; color: #73879C; }
.tengah { text-align: center; }
.kanan { text-align: right; }
th input { font-weight: bold }
.tblfoot { margin-top: -6px; border-bottom: 3px solid #ddd }

@media (max-width: 768px) {
  .navbar-nav { border-top: 1px solid white; }
  .navbar-nav > li:first-child { margin-top: 6px; }
  .nav-link { line-height: 38px; text-align: left; margin-left: 0!important; padding-left: 16px!important; }
  .megamenu { padding: 10px 24px; margin-top: 0 !important; max-height: 300px; overflow-y: auto; }
  .megamenu ul { margin-bottom: 30px; }
  .megamenu ul:last-child { margin-bottom: 10px; }
  .panel2 { line-height: normal; padding: 12px 17px; }
  .panel3 { top: 126px; }
  .dinamis tr { display: table; width:100%; }
  .dinamis td { display: table-row; }
}