@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Barcode+39+Text&display=swap');
html, body{
  font-size: 100%;
  font-family: 'Poppins', sans-serif;
  scroll-behavior: smooth;
}
.text-barcode{
  font-family: 'Libre Barcode 39 Text';
  font-size: 120px;
}
a{
  text-decoration: none !important;
}
.container{
  max-width: 1250px;
}
.shadow-sm{
  box-shadow: 0 10px 15px rgb(0 0 0 / 5%) !important;
}
.btn{
  font-size: small !important;
  letter-spacing: 1px !important;
}

label{
  font-size: 12px !important;
}
::placeholder {
  opacity: 1;
  font-size: 12px !important;
  letter-spacing: 1px;
  font-weight: 300;
}
input[type=text],input[type=password],input[type=number],input[type=email],textarea,input[type=hidden],input[type=search] {
  font-size: 12px !important;
}
.form-control:focus {
  border-color: inherit;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.fa-2x{
  font-size: 1.80em !important;
}
.btn-group-xs > .btn, .btn-xs {
  padding: .25rem .4rem;
  font-size: .875rem;
  line-height: .5;
  border-radius: .2rem;
}.navbar{
  border-bottom: 3px solid #eee;
}
.navbar-dark .navbar-nav .nav-item {
  font-weight: 400 !important;
  font-size: 12px;
  color: #c5c5c5 !important;
  letter-spacing: 1px;
  padding-left: 5px !important;
  padding-right: 5px !important;
}
.navbar-dark .navbar-nav .nav-item:hover {
  color: #fff !important;
}
.navbar-dark .navbar-brand {
  font-weight: 700 !important;
  border-radius: 20px 0px;
  color: #000 !important;
}
.navbar-dark .navbar-brand:hover {
  background: #fbff07 !important;
}
.navbar-dark .navbar-nav .nav-item{
  border-right: 1px solid rgb(87, 87, 87);
}
button[aria-expanded="true"] > i.close {
  display: inline;
}

button[aria-expanded="true"] > i.muncul {
  display: none;
}

button[aria-expanded="false"] > i.close {
  display: none;
}
.card-tittle{
  font-weight: 500 !important;
}
table{
  font-size: 12px !important;
}
table thead>tr>th{
  font-weight: 600 !important;
}
.page-link{
  padding: 0.2rem 0.5rem !important;
  font-size: small !important;
}
.m-pr-0{
  padding-right: 0px !important;
}
.bg-total{
  background: linear-gradient(180deg, #c0dcfa 0%, #92c6fd 50%);
  color: #002d5e;
  border-radius: 5px;
  font-weight: 600;
  font-size: 20px;
}
.border-laporan{
  border: 1px solid rgba(226, 226, 226, 0.644);
  border-radius: 5px;
}
.border-laporan h4{
  font-weight: 600;
}
.bg-icon{
  background: linear-gradient(60deg,#343a40,#69727a,#7a838d);
  color: white;
  text-align: center;
  display: table-cell;
  padding: 0.50rem;
  border-radius: 0.428rem;
  width: 2.50rem;
  height: 2.50rem;
}
td.catatan{
  white-space: nowrap;
  max-width: 150px;
  padding: 0.5em 1em;
  overflow: hidden;
  text-overflow: ellipsis ;
}
/* mobile */
@media only screen and (max-width: 678px) {
  .m-pr-0{
    padding-right: 15px !important;
  }
  .m-pr-1{
    padding-right: 0.25rem !important;
  }
  .bg-icon{
    padding: 0.25rem;
    width: 1.75rem;
    height: 1.25rem;
  }
  .bg-icon i{
    font-size: 0.75em !important;
  }
  .border-laporan h4{
    font-size: 12px;
  }
}


@media print {
  body * {
    visibility: hidden;
  }
  #print, #print * {
    visibility: visible;
  }
  #print {
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 0px !important;
  }
  #print .print-none{
    display: none !important;
  }
  #print .print-show{
    display: block !important;
  }
  @page {
    size: a6 portrait !important;
    margin: 0;
  }
}
.ketikan
{
  width: 100%;
  white-space:nowrap;
  overflow:hidden;
  animation: ketik 3s steps(50, end);
}

@keyframes ketik{
  from { width: 0; }
}

@-webkit-keyframes ketik{
  from { width: 0; }
}