.top {font-size:24px;padding:2px 5px;background:#274164;border-bottom:1px solid #aaa;height:48px;color:#fff;}
.menu {
    display: inline-block;
    padding: 0px 5px;
    color: #fff;margin-top:8px;
    font-size: 20px;
    cursor: pointer;
    border: 1px solid #bbb;
}
.menu:hover {
    color: orange;
    border: 1px solid red;
    background: red;
}
.overlay {
  height:0px;
  position: fixed;
  z-index: 1;
  top: 48px;
  left: 0;right:0;
  background-color: #eee;opacity:1;
  overflow-x: hidden;
  transition: 0.5s;
}
.overlay-content {
  position: relative;
  width: 100%;text-align:left;
}
.overlay a {
  text-decoration: none;
  font-size: 14px;text-align:center;
  color: #333;
  display: inline-block;
  transition: 0.6s;
  border:1px solid #dcdcdc;
  margin:2px;height:130px;
  width:calc(20% - 10px);
  padding:10px 0 10px 0;
}
@media only screen and (max-width: 760px){
.overlay a {width:calc(33% - 10px);height:100px;font-size:0.8em;}    
}    
.overlay .fa {display:block;font-size:50px;}
.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;background:#274164;
}
.overlay a:hover .fa {color:#f1f1f1;}
.overlay .closebtn {
  position: absolute;
  top: 0px;
  right: 15px;
  font-size: 16px;
}
.overlay .closebtn1 {
  position: absolute;
  top: 0px;
  left: 5px;
  font-size: 24px;
}
#display, #konten {position:fixed;left:0;right:0;top:48px;bottom:0; overflow-y:auto;background:#fff;opacity:0.95;}
#display {opacity:0.85;}
#konten {display:none;}
.atas-1 {padding:5px 10px;border-bottom:1px solid #ccc;margin-bottom:10px;}
#myHeader {font-size:20px;color:#444;margin-left:10px;}

table, table th, table td {border:1px solid #eee;padding:5px 10px;}
.sinergi th, .sinergi td {border:1px solid #444;padding:1px 10px;}
#menunya {padding:0;margin:0;}
.dropdown-menu .mpr {padding-top:7px;padding-bottom:7px;}
.container {width:90%;margin:0 auto;}
.fa, .fa-solid {cursor:pointer;}
.modal-header {position:sticky;top:-5px;z-index:2;}
#myBody .fa-solid {cursor:pointer;margin-right:5px;}
.merah {background:#fff;color:#000;font-weight:bold;}
#myBody td .fa-solid {cursor:pointer;color:blue;margin-right:5px;}
#menunya .myBtn {margin-right:1px;}
.myBtn {border:1px solid #000;}
.dropdown-menu li a {padding:8px 8px;border-bottom:1px dashed #eee;}
select {border:1px solid #eee;}
.BGR {position:sticky;z-index:1;top:0px;padding-bottom:10px;padding-top:0;padding:0;text-align:center;}
.BGR .myBtn .akhir{border:0;border-right:0;}
.dataTables_info {display:none;}
#myBody td .fa {font-size:16px;cursor:pointer;color:#5bc0de;margin:2px 5px;}
#printable { display: none; }
#elli, #ahmad {animation:animatezoom 0.6s}
@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}

@media only screen and (max-width: 760px){
.container {width:100%;margin:0 auto;}    
#myBody table, #elfa table {width:100%;}
#myBody table, #myBody table thead, #myBody table tbody, #myBody table th, #myBody table td,#myBody table tr,#elfa table, #elfa table thead, #elfa table tbody, #elfa table th, #elfa table td,#elfa table tr { display: block; }
#myBody table thead tr, #elfa table thead tr{position: absolute;	top: -9999px;left: -9999px;}
#myBody table tr, #elfa table tr { border: 1px solid #ccc; }
#myBody table td, #elfa table td {border: none;	border-bottom: 1px solid #eee;position: relative;padding: 20px 2px 2px 10px;font-size:12px;}
#myBody table td:before, #elfa table td:before { position: absolute;top: 6px;left: 6px;text-align:left;white-space: nowrap;font-size:12px;font-weight:bold;}   
#myBody table td, #elfa table td {text-align:left;}	    
}

@media print {#non-printable, .dropdown, .btn, button { display: none; }
  #printable { display: block; }
 table, table th, table td {border:1px solid #eee;padding:1px 3px;text-align:left;vertical-align:top;}
        table th {text-align:center;}
    }