*::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
body::-webkit-scrollbar-track {
  background: #ecf0f5;
}
*::-webkit-scrollbar-thumb {
  background: #2a3446;
  border-radius: 6px;
}

/* ========================================================= */
/* ADMINLTE */
/* ========================================================= */
.main-sidebar{
  padding-top: 70px;
  box-shadow: 1px 5px 20px 0 #3f4d67;
}
.main-header{max-height: none;}
.main-header .logo{
  height: 70px;
}
.main-header .sidebar-toggle{
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
}
.main-sidebar .user-panel>.info{
  position: relative;
  left: 0;
}
.skin-black .wrapper{
  background-color: #ecf0f5;
}
.skin-black .main-header .navbar{
  background-color: transparent;
}
.skin-black .main-header{
  box-shadow: none;
}
.skin-black .main-header .logo,
.skin-black .main-header .logo:hover,
.skin-black .main-sidebar, .skin-black .left-side,
.skin-black .sidebar-menu>li.header{
  background-color: #3f4d67;
}
.skin-black .sidebar-menu>li:hover>a{
  background-color: #3f4d67;
  color: #1dc4e9;
}
.skin-black .sidebar-menu>li.active:hover>a{
  color: #FFF;
}
.skin-black .sidebar-menu>li.active>a, 
.skin-black .sidebar-menu>li.menu-open>a{
  background-color: #333f54;
  border-left-color: #1dc4e9;
}
.skin-black .main-header .navbar .nav>li>a:hover,
.skin-black .main-header .navbar .sidebar-toggle:hover{
  background-color: transparent;
}
.skin-black .sidebar-menu .treeview-menu>li>a{
  padding: 12px 5px 12px 15px;
}
.small-box>.inner{
  position: relative;
  z-index: 9;
}
.small-box .icon{
  top: 0;
  bottom: 0;
  right: 0;
  opacity: 0.7;
}

.flat-right,
.flat-left{
  position: fixed;
  bottom: 70px;
  right: 15px;
  padding: 1rem 1.3rem;
  box-shadow: 0px 5px 10px rgba(0,0,0,16%);
}
.flat-left{
  left: 15px;
  right: auto;
}
.content form{
  min-height: 81.8vh;
  padding-bottom: 3.5rem;
}
.box-alerts{
  position: fixed;
  bottom: 0;
  left: 25px;
  right: 25px;
  z-index: 999;
}
.btn:not(:disabled):hover,
.btn:not(:disabled):active,
.btn:not(:disabled).hover{
  border-color: transparent;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #0386c3;
  border-color: #037eb6;
}
.btn-primary {
  color: #fff;
  background-color: #04a9f5;
  border-color: #04a9f5;
}
.btn-primary:not(:disabled):hover {
  color: #fff;
  background-color: #038fcf;
  border-color: #0386c3;
}

.custom-select, .form-control {
  background: #f4f7fa;
  padding: 10px 20px;
  font-size: 14px;
  height: calc(2em + .75rem + 2px);
  border-radius: .25rem;
}
.form-control:focus{
  background: #f4f7fa;
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}

.sign-page{
  min-height: 100vh;
}
.sign-page .auth-content{
  width: 750px;
}
.sign-page .card{
  box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);
}
.sign-page .card .theme-bg {
  background: linear-gradient(-135deg, #1de9b6 0%, #1dc4e9 100%);
}
.shadow-1 {
  -webkit-box-shadow: 0 10px 18px 0 rgba(69, 90, 100, 0.08);
  box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);
}
.shadow-2 {
  -webkit-box-shadow: 0 10px 18px 0 rgba(62, 57, 107, 0.2);
  box-shadow: 0 10px 18px 0 rgba(62, 57, 107, 0.2);
}

.box-header{
  padding: 20px 25px;
  border-bottom: 1px solid #f1f1f1;
}
.box-header>.box-tools{
  right: 1.5rem;
  top: 1rem;
}
.box-primary .box-header:before{background-color: #04a9f5;}
.box-info .box-header:before{background-color: #00c0ef;}
.box-primary .box-header:before{background-color: #04a9f5;}
.box-primary .box-header:before{background-color: #04a9f5;}
.box-header:before{
  content: '';
  background-color: #d4d4d4;
  position: absolute;
  display: block;
  left: 0;
  top: 35%;
  bottom: 35%;
  width: 4px;
}

.table td{
  vertical-align: middle;
}

.page-item.active .page-link{
  border-color: #04a9f5;
  background-color: #04a9f5;
}

/* ========================================================= */
/* DROPZONE */
/* ========================================================= */
.dropzone{
  border: 2px dashed #0087F7 !important;
}
.dropzone .dz-preview .dz-image img{width: 100%; height: 100%; object-fit: cover;}
  