.bg-bluewhite {
   background: #59a9ff85;
}
.bg-redwhite {
   background: #fdc0b99c;
}
.bg-yellowhite {
   background: #ffff0030;
}
.bg-pinkwhite {
   background: pink;
}
.btn-group-xm>.btn, .btn-xm,
.btn-group-xs>.btn, .btn-xs {
   /* padding: 0.25rem .5rem;  */
   font-size: .65rem;
   line-height: 1.5;
   border-radius: .2rem;
   padding: .2rem .5rem;
}
.dataTables_wrapper {
   font-size: 8.5pt;
}
.table-sm td, .table-sm th {
    padding: .23rem .3rem;
}
table.dataTable.table-sm>thead>tr>th {
   padding: .3rem !important;
   text-align: center !important;
   /* padding-right: 20px; */
}
.table thead th {
   vertical-align: middle;
}
.btn-outline-warning:hover, .btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, .show>.btn-outline-warning.dropdown-toggle {
   color: #ffffff;
}
/* ol.parentheses {
counter-reset: list;
padding-left: 10px;
display: inline-block;
margin-bottom: 0;
}
ol.parentheses > li {
list-style: none;
}
ol.parentheses > li:before {
content: counter(list, lower-roman) ") ";
counter-increment: list;
} */
.td-top td {
   vertical-align: middle;
}
.truncate {
  max-width:60px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.maxwid-10 {
   max-width: 10%;
}
.maxwid-5 {
   max-width: 5%;
}
.maxwid-7 {
   max-width: 7%;
}
ol.parentheses {
   counter-reset: list;
   list-style: none;
   padding-left: 28px;
   margin-top: 7px;
   margin-bottom: 7px;
   display: inline-block;
}
ol.parentheses li {
   /* margin: 0 0 0.5rem 0; */
   counter-increment: list;
   position: relative;
}
ol.parentheses li::before {
   content: counter(list, lower-roman) ") ";
   position: absolute;
   --size: 18px;
   left: calc(-1 * var(--size) - 10px);
   line-height: var(--size);
   width: var(--size);
   height: var(--size);
   top: 0;
}
.td-format p {
   margin:0;
}
.modal-xlg{
   max-width:1200px;
}

.cursor-pointer {
   cursor: pointer;
}
#loading {
   /* display: none; */
   position: fixed;
   top: 0;
   left: 0;
   z-index: 10000;
   width: 100%;
   height: 100%;
   /* width: 100vw;
   height: 100vh; */
   background-color: rgba(0, 0, 0, 0.52);
   background-image: url("../img/gif/loading-pelangi.gif"),url("../img/gif/bgloader.png");
   background-size: 93px,105px;
   background-repeat: no-repeat,no-repeat;
   background-position: center,center;
   /* background-color: rgba(192, 192, 192, 0.5); */
   /* background-image: url("http://i.stack.imgur.com/MnyxU.gif"); */
   /* background-repeat: no-repeat;
   background-position: center; */
}
#loading_page {
   display: none;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 1000;
   width: 100%;
   height: 100vh;
   /* width: 100vw;
   height: 100vh; */
   /* background-color: rgba(0, 0, 0, 0.52); */
   background-image: url("../img/gif/loading12.gif");
   background-repeat: no-repeat;
   background-position: center;
}
.spinner-3 {
   border: 6px solid #f3f3f3;
   border-radius: 50%;
   border-top: 6px solid gray;
   width: 30px;
   height: 30px;
   -webkit-animation: spin 1s linear infinite; /* Safari */
   animation: spin 1s linear infinite;
}
.spinner-5 {
   border: 16px solid #f3f3f3;
   border-radius: 50%;
   border-top: 16px solid #3498db;
   width: 120px;
   height: 120px;
   -webkit-animation: spin 2s linear infinite; /* Safari */
   animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
   0% { -webkit-transform: rotate(0deg); }
   100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
   0% { transform: rotate(0deg); }
   100% { transform: rotate(360deg); }
}