.ui.button {
  cursor: pointer;
  display: inline-block;
  min-height: 1em;
  outline: 0;
  border: none;
  vertical-align: baseline;
  background: #e0e1e2 none;
  color: rgba(0, 0, 0, 0.6);
  font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
  padding: 0.78571429em 1.5em 0.78571429em;
  text-transform: none;
  text-shadow: none;
  font-weight: 700;
  line-height: 1em;
  font-style: normal;
  text-align: center;
  text-decoration: none;
  border-radius: 0.28571429rem;
  box-shadow: 0 0 0 1px transparent inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease,
    box-shadow 0.1s ease, background 0.1s ease;
  will-change: "";
  -webkit-tap-highlight-color: transparent;
}
.ui.green.button,
.ui.green.buttons .button {
  background-color: #21ba45;
  color: #fff;
  text-shadow: none;
  background-image: none;
}
.ui.green.button:hover,
.ui.green.buttons .button:hover {
  background-color: #16ab39;
  color: #fff;
  text-shadow: none;
}
.ui.blue.button,
.ui.blue.buttons .button {
  background-color: #1f75cc;
  color: #fff;
  text-shadow: none;
  background-image: none;
}
.ui.blue.button:hover,
.ui.blue.buttons .button:hover {
  background-color: #0959ab;
  color: #fff;
  text-shadow: none;
}
.ui.blue.button[disabled],
.ui.blue.buttons .button[disabled] {
  background-color: #1f75cc;
  color: #eee;
  text-shadow: none;
  opacity: 0.7;
  pointer-events: none;
}
.ui.grey.button,
.ui.grey.buttons .button {
  background-color: #7a7a7a;
  color: #fff;
  text-shadow: none;
  background-image: none;
}
.ui.grey.button:hover,
.ui.grey.buttons .button:hover {
  background-color: #616161;
  color: #fff;
  text-shadow: none;
}
.ui.grey.button[disabled],
.ui.grey.buttons .button[disabled] {
  background-color: #7a7a7a;
  color: #eee;
  text-shadow: none;
  opacity: 0.7;
  pointer-events: none;
}
.ui.print.button,
.ui.print.buttons .button {
  background-color: #dbdbdb;
  color: #222222;
  text-shadow: none;
  background-image: none;
}
.ui.print.button:hover,
.ui.print.buttons .button:hover {
  background-color: #969696;
  color: #222222;
  text-shadow: none;
}
.ui.print.button[disabled],
.ui.print.buttons .button[disabled] {
  background-color: #dbdbdb;
  color: #999999;
  text-shadow: none;
  opacity: 0.7;
  pointer-events: none;
}

.ui.purple.button,
.ui.purple.buttons .button {
  background-color: #3500e2;
  color: #fff;
  text-shadow: none;
  background-image: none;
}
.ui.purple.button:hover,
.ui.purple.buttons .button:hover {
  background-color: #19006a;
  color: #fff;
  text-shadow: none;
}

.get-border-1 {
  border: 1px solid #eee;
}

.text-add {
  color: #16ab39;
}
.text-add:hover {
  color: #107e2a;
}

/* body{ */
  /*overflow-x: hidden;*/
  /*overflow-y: hidden;*/
  /* background: rgb(255,255,255);
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(0,112,245,1) 100%);  
} */
body::-webkit-scrollbar {
  width: 10px; /* Lebar scrollbar */
  height: 5px; /* Tinggi scrollbar */
}

body::-webkit-scrollbar-thumb {
  background-color: #adb1b8; /* Warna latar belakang thumb scrollbar */
  border-radius: 5px; /* Radius thumb scrollbar */
}

body::-webkit-scrollbar-thumb:hover {
  background-color: #555; /* Warna latar belakang thumb scrollbar saat dihover */
}

/*@media (min-width: 576px) {*/
/*@media (min-width: 992px) {*/
  @media (min-width: 1200px) {
    body{
      /*overflow-y: hidden;*/
    }
  }

  .tsm_font{
    font-family: 'bordeauxblackregular',sans-serif;
  }

  body.boxed-layout #wrapper {
    max-width: 100%;
    margin: 0 auto;
    -webkit-box-shadow: 0 0 35px 0 rgba(154,161,171,.15);
    box-shadow: 0 0 35px 0 rgba(154,161,171,.15);
  }

  body.boxed-layout .navbar-custom {
    max-width: 100%;
    margin: 0 auto;
  }

  table.fix {
    table-layout: fixed;
/*  width: 180px;*/
}

th.fix {
  background: white;
  position: sticky;
  top: 0; /* Don't forget this, required for the stickiness */
  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

td.details-control {
  background: url('../vendor/images/details_open.png') no-repeat center center;
  cursor: pointer;
}
tr.shown td.details-control {
  background: url('../vendor/images/details_close.png') no-repeat center center;
}

th.p-nol, td.p-nol {
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}

/* Autosuggest */
.autosuggest {
	background-color:#FFF9C4;
	border:1px solid #90CAF9;
	display:none;
	overflow:hidden;
	padding:0px;
	position:fixed; 
	z-index:99;
	margin-top: 5px;
	margin-left: 0px;
	text-align:left;
}

.autosuggest ul li ,
.autosuggest-up ul li {
	background-color:#FFF9C4;
	margin-left: -30px;
	border-bottom:1px solid #90CAF9;
	cursor:pointer;
	display:block;
	list-style:none;
	padding:2px;
	white-space:nowrap;
	z-index:99; 
}

.autosuggest ul li:hover ,
.autosuggest-up ul li:hover {
	background-color:#316AC5;
	color:#FFFFFF;
	z-index:10; 
}

.autosuggest-up {
	background-color:#BBDEFB;
	border:1px solid #90CAF9;
	display:none;
	overflow:hidden;
	padding:0px;
	position:fixed; 
	z-index:99;
	margin-top: 5px;
	margin-left: 0px;
	top:auto;
	bottom:130px;
	text-align:left;
}

.progress_bar{
	position: absolute; /* fixed or absolute */
	margin: auto;
	top: 30%;
	/*text-align: center;*/
	/*right: 50%;*/
	/*height:100px;*/
	z-index: 9999; /* Sit on top */  
	display: none;
}

input.f-nol{
  margin-top: 0px;
  padding-left: 4px;
  padding-right: 4px;
}


.fix{
	padding-left: 4px;
	padding-right: 4px;
}

select.fix{
	padding-left: 4px;
	padding-right: 4px;
}

select.fix2{
  padding: 2px;
}

.pac-container {
  z-index: 9999999999 !important;
}

.btm-5{
	margin-bottom: 5px;
}

.top-0{
	margin-top: 0px;
}

label.error{
	color: red;
	font-size: 11px;
}

.form_error{
  border: 1px solid red;
}

.box-primary{
  /*padding: 5px 5px 5px 5px;*/
  box-shadow: 3px 3px #7d7d7d;
  font-family: Tahoma;
  font-size: 12px;
  border: 1px solid rgba(113, 182, 249, 1);
  /*background-color: rgba(113, 182, 249, 0.25) !important;*/
  background-color: rgba(255, 255, 255, 0.7);
  color: #000000;


}

.badge-lighten-primary {
  border: 1px solid rgba(113, 182, 249, 0.2) !important;
  background-color: rgba(113, 182, 249, 0.25) !important;
  color: #71b6f9 !important; 
}

.badge-lighten-secondary {
  border: 1px solid rgba(108, 117, 125, 0.2) !important;
  background-color: rgba(108, 117, 125, 0.25) !important;
  color: #6c757d !important; 
}

.badge-lighten-success {
  border: 1px solid rgba(16, 196, 105, 0.2) !important;
  background-color: rgba(16, 196, 105, 0.25) !important;
  color: #10c469 !important; 
}

.badge-lighten-info {
  border: 1px solid rgba(53, 184, 224, 0.2) !important;
  background-color: rgba(53, 184, 224, 0.25) !important;
  color: #35b8e0 !important; 
}

.badge-lighten-warning {
  border: 1px solid rgba(249, 200, 81, 0.2) !important;
  background-color: rgba(249, 200, 81, 0.25) !important;
  color: #f9c851 !important; 
}

.badge-lighten-danger {
  border: 1px solid rgba(255, 91, 91, 0.2) !important;
  background-color: rgba(255, 91, 91, 0.25) !important;
  color: #ff5b5b !important; 
}

.badge-lighten-light {
  border: 1px solid rgba(241, 245, 247, 0.2) !important;
  background-color: rgba(241, 245, 247, 0.25) !important;
  color: #f1f5f7 !important; 
}

.badge-lighten-dark {
  border: 1px solid rgba(50, 58, 70, 0.2) !important;
  background-color: rgba(50, 58, 70, 0.25) !important;
  color: #323a46 !important; 
}

.badge-lighten-pink {
  border: 1px solid rgba(255, 138, 204, 0.2) !important;
  background-color: rgba(255, 138, 204, 0.25) !important;
  color: #ff8acc !important; 
}

.badge-lighten-purple {
  border: 1px solid rgba(91, 105, 188, 0.2) !important;
  background-color: rgba(91, 105, 188, 0.25) !important;
  color: #5b69bc !important; 
}

.badge-lighten-blue {
  border: 1px solid rgba(113, 182, 249, 0.2) !important;
  background-color: rgba(113, 182, 249, 0.25) !important;
  color: #71b6f9 !important; 
}

.lighten-primary {
  border: 1px solid rgba(113, 182, 249, 0.2) !important;
  background-color: rgba(113, 182, 249, 0.25) !important;
  color: #71b6f9 !important; 
}

.lighten-secondary {
  border: 1px solid rgba(108, 117, 125, 0.2) !important;
  background-color: rgba(108, 117, 125, 0.25) !important;
  color: #6c757d !important; 
}

.lighten-success {
  border: 1px solid rgba(16, 196, 105, 0.2) !important;
  background-color: rgba(16, 196, 105, 0.25) !important;
  color: #10c469 !important; 
}

.lighten-info {
  border: 1px solid rgba(53, 184, 224, 0.2) !important;
  background-color: rgba(53, 184, 224, 0.25) !important;
  color: #35b8e0 !important; 
}

.lighten-warning {
  border: 1px solid rgba(249, 200, 81, 0.2) !important;
  background-color: rgba(249, 200, 81, 0.25) !important;
  color: #f9c851 !important; 
}

.lighten-danger {
  border: 1px solid rgba(255, 91, 91, 0.2) !important;
  background-color: rgba(255, 91, 91, 0.25) !important;
  color: #ff5b5b !important; 
}

.lighten-light {
  border: 1px solid rgba(241, 245, 247, 0.2) !important;
  background-color: rgba(241, 245, 247, 0.25) !important;
  color: #f1f5f7 !important; 
}

.lighten-dark {
  border: 1px solid rgba(50, 58, 70, 0.2) !important;
  background-color: rgba(50, 58, 70, 0.25) !important;
  color: #323a46 !important; 
}

.lighten-pink {
  border: 1px solid rgba(255, 138, 204, 0.2) !important;
  background-color: rgba(255, 138, 204, 0.25) !important;
  color: #ff8acc !important; 
}

.lighten-purple {
  border: 1px solid rgba(91, 105, 188, 0.2) !important;
  background-color: rgba(91, 105, 188, 0.25) !important;
  color: #5b69bc !important; 
}

.lighten-blue {
  border: 1px solid rgba(113, 182, 249, 0.2) !important;
  background-color: rgba(113, 182, 249, 0.25) !important;
  color: #71b6f9 !important; 
}

.bg-lighten-success {
  border: 1px solid rgba(16, 196, 105, 0.2);
  background-color: rgba(16, 196, 105, 0.5); 
}

.bg-lighten-primary {
  border: 1px solid rgba(113, 182, 249, 0.2);
  background-color: rgba(113, 182, 249, 0.50);
}

.bg-lighten-secondary {
  border: 1px solid rgba(108, 117, 125, 0.2);
  background-color: rgba(108, 117, 125, 0.5);
}

.bg-lighten-warning {
  border: 1px solid rgba(249, 200, 81, 0.2);
  background-color: rgba(249, 200, 81, 0.5);
}

.bg-lighten-danger {
  border: 1px solid rgba(255, 91, 91, 0.2);
  background-color: rgba(255, 91, 91, 0.5);
}

.bg-lighten-pink {
  border: 1px solid rgba(255, 138, 204, 0.2);
  background-color: rgba(255, 138, 204, 0.5);
}

.bg-lighten-purple {
  border: 1px solid rgba(91, 105, 188, 0.2);
  background-color: rgba(91, 105, 188, 0.5);
}

.bg-lighten-info {
  border: 1px solid rgba(53, 184, 224, 0.2);
  background-color: rgba(53, 184, 224, 0.5);
}

.border-danger {
  border: 1px solid rgba(255, 91, 91, 0.5);
}

.row_hover {
  border: 1px solid rgba(113, 182, 249, 0.2);
  background-color: rgba(113, 182, 249, 0.25);
  color: #71b6f9; 
  cursor: pointer;
}

.row_select {
  border: 1px solid rgba(16, 196, 105, 0.2);
  background-color: rgba(16, 196, 105, 0.25);
  color: #10c469; 
  cursor: pointer;
}


hr.red {
  border-top: 1px solid rgba(255, 91, 91, 0.5);
}

.red {
  color: red;
}

.blue{
  color: blue;
}

.black{
  color: #000000;
}

.avatar{
 cursor: pointer;
}

.all_red{
 border: 1px solid red;
}

.btm_red{
  /*border-bottom: 1px solid rgba(113, 182, 249, 0.2) !important;*/
  border-bottom: 1px solid rgba(255, 0, 0, 0.5);
  padding-bottom: : 0px !important;
}

.top_red{
  border-top: 1px solid rgba(255, 0, 0, 0.5);
  padding-top: : 0px;
}

.top_red2{
  border-top: 2px solid rgba(255, 0, 0, 0.5);
  padding-top: : 0px;
}

.btm_blue{
 /*border-bottom: 1px solid rgba(113, 182, 249, 0.2) !important;*/
 border-bottom: 1px solid rgba(113, 182, 249, 0.5);
 padding-bottom: : 0px !important;
}

.border_blue{
  /*border-bottom: 1px solid rgba(113, 182, 249, 0.2) !important;*/
  border: 1px solid rgba(113, 182, 249, 0.5);
  /*padding-bottom: : 0px !important;*/
}

.btm_black{
  /*border-bottom: 1px solid rgba(113, 182, 249, 0.2) !important;*/
  border-bottom: 0.3px solid #333;
  padding-bottom: : 0px !important;
}

.btm_dot{
  /*border-bottom: 1px #000000;*/
  border-style: none none dotted none;
  border-width: 2px;
}

.light-blue{
  background-color: rgba(113, 182, 249, 0.30);
}

.light-warning{
  background-color: rgba(249, 200, 81, 0.30);
}

.light-success {
  background-color: rgba(16, 196, 105, 0.30);
}

.row-header,
.form-header{
  background-color:#1c74d0;
  color: #FFFFFF;
  font-weight: bold;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: center;
}

.row-header-red{
  background-color:red;
  color: #FFFFFF;
  font-weight: bold;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: center;
}

.row-header2,
.form-header2{
  background-color:#1c74d0;
  color: #FFFFFF;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: center;
}

.row-sub-header{
  border: 1px solid rgba(113, 182, 249, 0.5);
  background-color: rgba(113, 182, 249, 0.75);
  color: #FFFFFF;
  padding-top: 2px;
  padding-bottom: 2px;
  text-align: center;
}


.form-sub-header{
  background-color: rgba(0, 0, 204, 0.5);
  color: #FFFFFF;
  font-size: 11px;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: center;
}

.form-footer{
  background-color:#ece98b;
  color : #000000;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: center;
}

td.agree{
  vertical-align: top;
}

td {word-break: break-all;}


div.dataTables_wrapper {
  width: auto;
  margin: 0 auto;
  padding: 0;
}

th{
  text-transform: uppercase;
  text-align: center;
  border-right: 1px solid #ffffff;
}

.bt-fix{
  margin-top:  5px;
  cursor:pointer;
  /*font-size: 11px;*/
}

.btn-fix{
  cursor:pointer;
  margin-top:  5px;
  margin-right:  2px;
  font-size: 13px;
}

.btn-xs{
  height: 24px;
}

.btn-xxs{
  margin-top:  5px;
  width: 23px;
  height: 23px;
  padding: 3px;
  font-size: 11px;
}

.row{
 /*height: 30px;*/
}

.form-fix{
  padding: 2px 1px 2px 1px;
  height: 25px;
  margin: 1px;
  font-size: 12px; 
  font-family: Tahoma;
}

select.form-fix{
  padding: 2px 1px 2px 1px;
  height: 25px;
  margin: 1px;
  font-size: 12px; 
  font-family: Tahoma;
}


.form-fix2{
 padding-left: 2px; 
 padding-right: 2px;
}

.form-big{
  padding: 5px;
  /*height: 26px;*/
  /*margin: 3px;*/

  font-size: 30px;
  font-weight: bold;
  font-family: Tahoma;
}

.fix2{
  padding: 2px;
  height: 26px;
  margin: 2px;
}

.col-fix{
  padding: 2px 4px 0px 4px;
}

.col-fix0{
  padding-left: 0px;
  padding-right: 0px;
  text-align: center;
}

.row-fix{
  margin: 1px 0px -5px 0px;
  padding: 0px;
}

hr.red {
  border-top: 1px solid rgba(255, 91, 91, 0.5);
  margin: 5px;
}

li.nol{
 padding: 0px;"
}

.no_doc{
  color: blue; 
  font-weight: bold; 
  text-align:center;  
}

.border_red{
  border:  1px solid rgba(255, 91, 91, 0.75);
}

.btm_red{
  border-bottom:  1px solid rgba(255, 91, 91, 0.5);
}

.btm_blue{
  border-bottom:  1px solid rgba(113, 182, 249, 0.75);
}

.btm_blue2{
  border-bottom:  2px solid rgba(113, 182, 249, 0.75);
}

.border_blue{
  border:  1px solid rgba(113, 182, 249, 0.75);
}

.table {
  border-collapse: collapse;
}

.f12 {
  font-size: 12px; 
  font-family: Tahoma;
}

.f12_b {
  font-size: 12px; 
  font-family: Tahoma;
  font-weight: bold;
}

.f13_b {
  font-size: 13px; 
  font-family: Tahoma;
  font-weight: bold;
}

.f14_b {
  font-size: 14px; 
  font-family: Tahoma;
  font-weight: bold;
}

.f11 {
  font-size: 11px; 
  font-family: Tahoma;
}

.f10 {
  font-size: 10px; 
  font-family: Tahoma;
}

.f10_b {
  font-size: 10px; 
  font-family: Tahoma;
  font-weight: bold;
}

.f12_b {
  font-size: 12px; 
  font-family: Tahoma;
  font-weight: bold;
}

.f9 {
  font-size: 9px; 
  font-family: Tahoma;
}

.f8 {
  font-size: 8px; 
  font-family: Tahoma;
}

.f14_b {
  font-size: 14px; 
  font-family: Tahoma;
  font-weight: bold;
}

.f16 {
  font-size: 16px; 
  font-family: Tahoma;
}

.f16_b {
  font-size: 16px; 
  font-family: Tahoma;
  font-weight: bold;
}

.f18_b {
  font-size: 18px; 
  font-family: Tahoma;
  font-weight: bold;
}

.popup_bg_2nd {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 9999; /* Sit on top */
  padding-top: 80px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.popup_content_2nd{
  background-color: #BDBDBD;
  border:  1px solid #faebcc;

  padding:10px;
  max-width:400px;
  margin: auto;
  font-size:12px;
}

.r5{
  text-align: right; 
  padding-right: 5px;  
}

.r4{
  text-align: right; 
  padding-right: 5px;  
  padding-left: 5px;  
}

.l4{
  text-align: left; 
  padding-left: 5px;  
  padding-right: 5px;  
}

.box-shadow{
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.btm_white{
  border-bottom:  1px solid rgba(255, 255, 255, 0.75);
}

.rb_white{
  border-right:  1px solid rgba(255, 255, 255, 0.75);
  border-bottom:  1px solid rgba(255, 255, 255, 0.75);
}

.r_c_white{
  border-right: 1px solid rgba(255, 255, 255, 0.75);  
  text-align: center;
}

.r_l_white{
  border-right: 1px solid rgba(255, 255, 255, 0.75);  
  text-align: left;
  left: 5px;
}

.r_r_white{
  border-right: 1px solid rgba(255, 255, 255, 0.75);  
  text-align: right;
  padding-right: 5px;
}

.r_r_blue{
  border-right: 1px solid #90CAF9;  
  padding-right: 5px;
  text-align: right;
  vertical-align: top;
}

.r_r_black{
  border-right: 1px solid #000000;  
  padding-right: 5px;
  text-align: right;
  vertical-align: middle;
}

.r_c_blue{
  border-right: 1px solid #90CAF9;  
  text-align: center;
  vertical-align: middle;
}

.rb_c_blue{
  border-right: 1px solid #90CAF9;  
  border-bottom: 1px solid #90CAF9;  
  text-align: center;

  vertical-align: middle;
}

.trb_c_blue{
  border-top: 1px solid #90CAF9;  
  border-right: 1px solid #90CAF9;  
  border-bottom: 1px solid #90CAF9;  
  text-align: center;

  vertical-align: middle;
}

.r_c_black{
  border-right: 1px solid #000000;  
  text-align: center;
  vertical-align: middle;
}

.r_l_black{
  border-right: 1px solid #000000;  
  padding-left: 5px;
  text-align: left;
  vertical-align: middle;
}

.r_l_blue{
  border-right: 1px solid #90CAF9;  
  padding-left: 5px;
  text-align: left;
  vertical-align: top;
}

.r_blue{
  padding-left: 5px;
  border-right:1px solid #90CAF9;
}

.l_blue{
  border-left:1px solid #90CAF9;
}

.t_red{
/*  border-top: 1px solid rgba(255, 91, 91, 0.75);*/
  border-top: 1px solid #FF5B5B;
}

.tb_red{
  border-top: 1px solid rgba(255, 91, 91, 0.75);
  border-bottom: 1px solid rgba(255, 91, 91, 0.75);
}

.b_red{
  border-bottom: 1px solid rgba(255, 91, 91, 0.75);
}

.r_r_red{
  border-right: 1px solid rgba(255, 91, 91, 0.75);  
  padding-right: 5px;
  text-align: right;
}

.r_c_red{
  border-right: 1px solid rgba(255, 91, 91, 0.75);  
  padding-right: 5px;
  text-align: center;
}


.lt_l_black{
  border-left: 1px solid #000000;  
  border-top: 1px solid #000000;  
  padding-left: 5px;
  text-align: left;
}

.lt_c_black{
  border-left: 1px solid #000000;  
  border-top: 1px solid #000000;  
  padding-right: 5px;
  text-align: center;
}

.lt_r_black{
  border-left: 1px solid #000000;  
  border-top: 1px solid #000000;  
  padding-left: 5px;
  text-align: right;
}

.l_c_black{
  border-left: 1px solid #000000;  
  text-align: center;
}

.l_black{
  border-left: 1px solid #000000;  
}

.r_black{
  border-right: 1px solid #000000;  
}

.t_black{
  border-top: 1px solid #000000;  
}

.b_black{
  border-bottom: 1px solid #000000;  
}

.b_blue{
  border-bottom: 1px solid rgba(113, 182, 249, 0.8);  
}

.image_frame{
  position: absolute; /* fixed or absolute */
  bottom: 150px;
  display: none;
  right: 20px;
  /*margin-right: auto;*/
  /*width: 50%;*/
  z-index: 999;
}

.btn-sm{
  height: 24px !important;
  padding: 1px 4px 2px 4px !important;
  margin-top: 2px !important; 
}

.t_head{
  font-family: Tahoma;
  font-size: 12px;
  font-weight: bold;
  border:1px solid #90CAF9;
  border-collapse: collapse;  
  text-align: center;
  border-spacing: 0;
  padding: 5px 0 5px 0;
}

.auto-matches{
  color:blue;
  background-color: rgba(255, 247, 0, 0.75);
}

label{
  margin-top: 5px;
}
/*.ui-autocomplete { height: 200px; overflow-y: scroll; overflow-x: hidden;}*/


.table .thead-light-blue th {
/*  border: 1px solid rgba(113, 182, 249, 0.2) !important;
  background-color: rgba(113, 182, 249, 0.25) !important;
  color: #71b6f9 !important;*/

  vertical-align: middle;
  color: #000;
  background-color: rgba(113, 182, 249, 0.75);
  /*border-color: rgba(113, 182, 249, 0.75);*/
  border-color:#000;
}

.table-grid{
  table-layout: fixed;
  border-collapse: collapse;
  cellpadding: 0;
  cellspacing: 0;
  border-spacing: 0px;
  margin-left: 0;
  /*margin-right: auto;*/
}

.table-grid > tr > td {
  padding: 0;
  /*word-wrap:break-word;*/
  word-break: break-all;
}

.table-grid>thead>tr>th,
.table-grid>tbody>tr>th,
.table-grid>tfoot>tr>th,
.table-grid>thead>tr>td,
.table-grid>tbody>tr>td,
.table-grid>tfoot>tr>td {
  border: 1px solid rgba(113, 182, 249, 0.75);
  vertical-align: top;  
}

.table-grid .table-grid td
{
  border-top:0;
  border-right: 1px solid rgba(113, 182, 249, 0.75);
  border-bottom: 0;
  border-left: 0;
  vertical-align: top;
}

.table-grid .table-grid td:last-child,
.table-grid .table-grid th:last-child {
  border-right: 0;
}

.form_label{
  color: #000000;
  font-weight: bold;
  margin-top: 5px;
}

.help_card{
  position: fixed;
  top: 80px;
  left: 20px;
  z-index: 995;
  border: 2px solid blue;
  width: 210px;
  height: 500px;
  background-image: url('https://mfg-isys.tosamaabadi.com/erp/assets/images/kertas.png');
  /*opacity: 1;*/
  -webkit-box-shadow: 0 0 35px 0 rgba(154,161,171,.15);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  color:  black;
  display: none;
}

.help_card_body{
  z-index: 996;
  color:  black;
  opacity: 1;
  font-size: 12px;
  font-family: Tahoma;
}

.keep_scroll::-webkit-scrollbar {
  display: none;
}

.thin-scroll{
  scrollbar-width: thin;
}


.rack:hover{
  background-color: rgba(255, 91, 91, 0.25);
  color: #ff5b5b;
  cursor: pointer;
}

.center {
  display: flex;
  justify-content: center;
  align-items: center;
/*  height: 200px;
  border: 3px solid green;*/
}

.label-fix{
  margin-top: 5px;
}

.big-font{
 font-size: 8em;
 font-weight: bold;
 font-family: Tahoma;
}

.big-font-7{
 font-size: 7em;
 font-weight: bold;
 font-family: Tahoma;
}

.big-font-9{
 font-size: 9em;
 font-weight: bold;
 font-family: Tahoma;
}

.bg-plan{
  background-color: blue;
  color: yellow;
}

.bg-actual{
  border: 3px solid blue;
  color: blue;
}

.toast-top-center {
  top: 25px;
}

.brs-hvr {
  cursor: pointer;
}
.brs-hvr:hover {
  color: blue;
}

/* #scroll-to-bottom {
  position: fixed;
  bottom: 40px;
  right: 20px;
  z-index: 99;
  font-size: 14px;
  border: none;
  outline: none;
  background-color: purple;
  color: white;
  cursor: pointer;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 13px;
  padding-left: 13px;
  border-radius: 100%;
} */
#scroll-to-top-btn, #scroll-to-bottom-btn {
  display: none;
  position: fixed;
  z-index: 99;
  font-size: 16px;
  padding: 10px 15px;
  border: none;
  border-radius: 100%;
  background-color: rgb(61, 61, 61);
  color: white;
  cursor: pointer;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
}

#scroll-to-top-btn {
  bottom: 20px;
  right: 20px;
}

#scroll-to-bottom-btn {
  bottom: 20px;
  right: 20px;
}

#scroll-to-top-btn:hover, #scroll-to-bottom-btn:hover {
  box-shadow: 0px 0px 10px 8px rgba(0, 0, 0, 0.25);
}

.bg-blue-1 {
  background-color: #007bff !important;
}

.btn-primary-1 {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.btn-primary-1:hover {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
}

.data_content, #data_content, .tableFixHead {
  max-height: 65vh;
  overflow-y: auto;
  overflow-x: hidden;
}
.tableFixHead::-webkit-scrollbar,
.data_content::-webkit-scrollbar,
#data_content::-webkit-scrollbar {
  width: 5px; /* Lebar scrollbar */
  height: 10px; /* Tinggi scrollbar */
}

.tableFixHead::-webkit-scrollbar-thumb,
.data_content::-webkit-scrollbar-thumb,
#data_content::-webkit-scrollbar-thumb {
  background-color: #888; /* Warna latar belakang thumb scrollbar */
  border-radius: 5px; /* Radius thumb scrollbar */
}

.tableFixHead::-webkit-scrollbar-thumb:hover,
.data_content::-webkit-scrollbar-thumb:hover,
#data_content::-webkit-scrollbar-thumb:hover {
  background-color: #555; /* Warna latar belakang thumb scrollbar saat dihover */
}

.border-end {
  border-right: 0.1rem solid #D9D9D9;
}
.border-1 {
  border: 0.1rem solid #D9D9D9;
}

.py-01 {
  padding-top: 0.1rem;
  padding-bottom: 0.1rem;
}

.radius-10 {
  border-radius: 10px;
  overflow: hidden;
}

.text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.clear{
  background-color: transparent;
}

.f12_card {
  color: #000000;
  font-size:  12px;
  font-weight: bold;
  text-align: left;
}

.f14_card {
  color: #000000;
  font-size:  14px;
  font-weight: bold;
  text-align: left;
}

.name_card {
  text-align: left; 
  font-weight: bold; 
  color: #000000;
  display: inline-block;
  font-size: 30px;
  letter-spacing: 2px;
  transform: scale(1, 2.5);
  -webkit-transform: scale(1, 2.5);
  -moz-transform: scale(1, 2.5);
  -o-transform: scale(1, 2.5);
  transform-origin: 0% 60%;
}

.post_card{
  text-align: left;
  letter-spacing: 2px;
  display: inline-block;
  font-size: 25px;
  transform: scaleY(0.5);
  transform-origin: 0 0;
  margin-bottom: -50%;  
}

.f16_card {
  color: #000000;
  font-size:  16px;
  font-weight: bold;
  text-align: left;
}

.f18_card {
  color: #000000;
  font-size:  18px;
  font-weight: bold;
  text-align: left;
}

.f20_card {
  color: #000000;
  font-size: 20px;
  font-weight: bold;
  text-align: left;
}

.f24_card {
  color: #000000;
  font-size: 24px;
  font-weight: bold;
  text-align: left;
}

.f32_card {
  color: #000000;
  font-size: 32px;
  font-weight: bold;
  text-align: left;
}

.id_card{
  /*  54 mm x 85.6 mm */
  /*  72pt = 25.4 mm */
  background-size: cover; 
  max-width: 306pt;
  max-height: 486pt;
  background-repeat: no-repeat;
  top:0; 
  left: 0;
}

.visi_card {
  text-align: center; 
  font-weight: bold; 
  color: #000000;
  display: inline-block;
  font-size: 10px;
  letter-spacing: 2px;
  transform: scale(1, 2.5);
  -webkit-transform: scale(1, 2.5);
  -moz-transform: scale(1, 2.5);
  -o-transform: scale(1, 2.5);
  transform-origin: 0% 60%;
  text-decoration: underline;
}

#sidebar-menu>ul>li>ul {
  padding-left: 3vh !important;
}

/* .table-fixed {
  width: 100%;
  background-color: #f3f3f3;
}

.table-fixed thead {
  display: block;
}

.table-fixed tbody {
  height: 200px;
  overflow-y: auto;
  width: 100%;
  display: block;
} */

/* .table-fixed tr {
  display: flex;
}

.table-fixed td, .table-fixed th {
  flex: 3;
} */

/* .table-fixed thead th {
  background-color: #f39c12;
  border-color: #e67e22;
} */

.tableFixHead {
  overflow-y: auto; /* make the table scrollable if height is more than 200 px  */
  max-height: 73.5vh !important; /* gives an initial height of 200px to the table */
}
.tableFixHead thead tr:first-child th {
  position: sticky;
  top: -1px;
  z-index: 2; /* Pastikan baris pertama muncul di atas baris kedua */
}

.tableFixHead thead tr:nth-child(2) th {
  position: sticky;
  top: 27.4px; /* Sesuaikan sesuai dengan tinggi baris pertama */
  background-color: #eee; /* Warna latar belakang baris kedua */
  z-index: 1; /* Pastikan baris kedua berada di bawah baris pertama */
}


.tableFixHead tfoot td {
  position: sticky; /* make the table heads sticky */
  bottom: 0px; /* table head will be placed from the top of the table and sticks to it */
}
.tableFixHead table {
  border-collapse: collapse; /* make the table borders collapse to each other */
  width: 100%;
}
.tableFixHead th,
.tableFixHead td {
  padding: 8px 16px;
  border: 1px solid #ccc;
}
.tableFixHead th {
  background: #eee;
}

.tableFixHead thead.bg-dark th {
  background: #2e2e2e;
}

.tableFixHead thead.bg-dark-blue th,
.tableFixHead thead tr:nth-child(2) th {
  background: #003063;
}

.tableFixHead tfoot.bg-primary td {
  background-color: #6575ff;
}

.tableFixHead tfoot.bg-white td {
  background-color: #fff;
}

.tableFixHead tfoot.bg-eee td {
  background-color: #eee;
}

.bg-dark-blue {
  background-color: #003063;
}

input.bg-eee, 
textarea.bg-eee {
  background-color: #eee !important;
}

.fs-5 {
  font-size: medium !important;
}

.select-row.active {
  background: #eee;
}

.select-row:hover {
  background: #eee;
  cursor: pointer;
}

.btn-primary-dark {
  color: #fff;
  background-color: #0069d9;
  border-color: #0069d9;
}

.btn-primary-dark:hover {
  color: #fff;
  background-color: #004792;
  border-color: #0062cc;
}

.btn-primary-dark:focus, .btn-primary-dark.focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.btn-primary-dark.disabled, .btn-primary-dark:disabled {
  color: #fff;
  background-color: #0069d9;
  border-color: #0069d9;
}

.btn-primary-dark:not(:disabled):not(.disabled):active, .btn-primary-dark:not(:disabled):not(.disabled).active,
.show > .btn-primary-dark.dropdown-toggle {
  color: #fff;
  background-color: #0062cc;
  border-color: #005cbf;
}

.btn-primary-dark:not(:disabled):not(.disabled):active:focus, .btn-primary-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary-dark.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.text-middle {
  align-items: center;
  vertical-align: middle;
}

#ui-datepicker-div {
  z-index: 9999 !important;
}

.bg-eee {
  background-color: #eee !important;
}

.opacity-30 {
  opacity: 30% !important;
}

.row_bold{
  font-weight: bold;
}

.custom-table {
  border-collapse: collapse;
  width: 100%;
}

.custom-table th, .custom-table td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}

.custom-table th {
  background-color: #f2f2f2;
}

.custom-table tr:nth-child(even) {
  background-color: #f2f2f2;
}

.bg-grey {
  background-color: #eee !important;
}

.fw-bold {
  font-weight: bold !important;
}