.nopad {padding:0px}

.w-10 { width:10% }
.w-20 { width:20% }
.w-30 { width:30% }
.w-40 { width:40% }
.w-50 { width:50% }
.w-60 { width:60% }
.w-70 { width:70% }
.w-80 { width:80% }
.w-90 { width:90% }
.w-100 { width:100% }

.w80 { width:80px; }

.left { text-align:left }
.right { text-align:right }
.center { text-align:center }

.text-bold { font-weight:bold }

.navbartop { background:#292d31; color:#ffffff; height:18px; display:flex; align-items:center; position:fixed; left:0; right:0; top:0; z-index:1001; font-size:12px; font-weight:bold; padding:0 calc(1.5rem / 2) 0 0; justify-content:end }
    .navbartop .countdown-timer {  }

.navbar-custom { top:18px }

.content-page { margin-top:88px }

.alang-wrapper { font-size:0px; padding:0px 10px }
.alang { display:inline-block; padding:5px 2px}
     .alang img { max-width:34px; }

label.error { display:block; margin-top:5px; font-size:12px; color:#ff0000 }
input.error { border-color:#ff0000 }
.input-group label.error { position:absolute; right: 12px; margin-top:0px; line-height:38px; }
.form-floating > label.error { transform:none!important; text-align:right; right:0px }

.preloader { 
     display: -webkit-flex;display: -ms-flexbox;display: flex;background-color: rgba(0,0,0,0.9);height: 0;width: 100%;transition: height .2s linear;position: fixed; left: 0;top: 0;z-index: 9999;
}

.form-control { font-size:12px; /*height:38px;*/ }
.form-group select.form-control { 
     background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%);
     background-position: calc(100% - 14px) calc(14px + 2px), calc(100% - 9px) calc(14px + 2px), 100% 0;
     background-size: 5px 5px, 5px 5px, 1px 1.5em; background-repeat:no-repeat;
}

.form-control:focus { border-color:#999999 }
.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) { background-color:#eeeeee; color:#222222 }
.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label { color:#d10000 }
.form-control[disabled] { background-color:#aaaaaa!important }
.form-floating input[type=file] { line-height:1.625 }
.form-floating input[type=file]::file-selector-button { display:none }

.form-floating-sm > .form-control {
    height: 36px;
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
}

.form-floating-sm > label {
    font-size: 0.75rem;
    padding: 0.4rem 0.75rem;
}

.form-floating-sm > .form-control:focus ~ label,
.form-floating-sm > .form-control:not(:placeholder-shown) ~ label {
    transform: scale(.85) translateY(-0.2rem) translateX(0.15rem);
}

.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) {

}

#divDataTable, #divList, .dataTable { font-size:12px }
.dataTables_length, .dataTables_info { display: inline-block; }
.dataTables_filter, .dataTables_paginate  { display: inline-block; float: right; }
.dataTables_scroll { margin-bottom:10px }
.divListCheckBox { border: 1px solid #ced4da; min-height: 200px; overflow-y: scroll; }
.divListCheckBox ul { padding: 5px 10px;}
.divListCheckBox ul li { list-style: none;}
.divListCheckBox ul input { margin-right: 2px; }

.table td, .table th { padding:8px }
table.dataTable tr:hover { color:#ffffff; background-color:rgba(52, 58, 64, 0.9) !important; --bs-table-accent-bg:none }

.card-tools { display:none }
.card-header .card-title { margin-bottom:0px }
.card-header h3 { font-size:1rem }

.content-header h1 { display:none }
.content-header .breadcrumb { justify-content:end; margin-bottom:0 }

.form-group { padding-bottom:12px }

table.dataTable tr.odd { background-color:#f3f3f3 }
table.dataTable .form-control { border:0px; font-size:10px; font-weight:bold; height:auto; appearance:auto; -webkit-appearance:auto; padding:6px 10px }

#tblDataTable_wrapper, .dataTables_wrapper.dt-bootstrap5 { overflow:auto }

.nav.nav-tabs { white-space:nowrap; overflow-x:auto; flex-wrap:unset }
.nav.nav-tabs.nav-bordered .nav-item { margin-bottom:0px }
.nav.nav-tabs .nav-link { margin-bottom:0px }
.nav-bordered a.active { border-bottom-width:3px!important }

.dropify-wrapper .dropify-message span.file-icon { font-size:14px; line-height:22px }
.dropify-font-upload::before, .dropify-wrapper .dropify-message span.file-icon::before  { font-size:50px; }

.cblist { min-height:145px; }
    .cblist.nomh { min-height:auto }
    .cblist .cblist-con { max-height:110px; overflow-y:auto }
    .cblist.s2 .cblist-con { max-height:180px }
    .cblist.role { min-height:auto}
    .cblist.role .cblist-con { max-height:none }

.form-floating-note { font-size:11px; color:#ff0000; padding:4px }

.iframe-tutorial { border:0; height:calc(90vh - 2rem); width:100%; overflow:auto }

@media (max-width: 767.98px){
     .dataTables_paginate ul { display:flex }
     li.paginate_button { display:block }
     li.paginate_button.next, li.paginate_button.previous { font-size: 12px }

     .dataTables_length, .dataTables_info { display:block }
     .dataTables_filter, .dataTables_paginate { float:none; width:100% }
}

