#sidebar-nav {
  width: 250px;
  overflow: auto;
  left: 0;
  position: fixed;
  top: 0px;
  z-index: 1030;
  border-right: 1px solid #ccc;
  background-color: #f4e718;
  color: black;
  height: 61px;
  border-bottom: 1px solid #ccc;
  text-transform: uppercase;
  font-size: 18px;
  padding: 15px;
  overflow: hidden;
  -webkit-transition: width 750ms;
  transition: width 750ms;
}

#sidebar-nav .fa-bars, #sidebar-nav i {
  position: absolute;
  right: 0px;
  top: 3px;
  font-size: 24px;
}

#sidebar {
  width: 250px;
  overflow: auto;
  left: 0;
  position: fixed;
  top: 60px;
  bottom: 0px;
  z-index: 30;
  border-right: 1px solid #ccc;
  background-color: #fff;
  color: #000;
  font-size: 13px;
  -webkit-transition: width 750ms;
  transition: width 750ms;
  will-change: width;
}

.sidebar-filter #page-wrapper, .sidebar-filter .navbar-default {
  padding-left: 250px;
  -webkit-transition: padding 750ms;
  transition: padding 750ms;
  will-change: padding;
}

/* Sidebar filter hide */
.sidebar-filter-hide .navbar-default {
  padding-left: 50px;
}

.sidebar-filter-hide #page-wrapper {
  padding-left: 0px !important;
}

.sidebar-filter-hide #sidebar-nav {
  width: 50px;
}

.sidebar-filter-hide #sidebar, .sidebar-filter-hide #sidebar-nav div {
  width: 0px;
}

.sidebar-filter .notify {
  position: absolute;
  right: 15px;
  top: 45px;
}

.sidebar-nav {
  top: 0;
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}

.sidebar-nav li {
  position: relative;
  display: block;
}

.sidebar-nav li div.sidebar-filter  {
  display: block;
  padding: 5px 15px 5px 15px;
}

.sidebar-nav li a .arrow {
  float: right;
  margin-top: 4px;
  -moz-transition: all 250ms linear;
  -webkit-transition: all 250ms linear;
  transition: all 250ms linear;
}

.sidebar-nav li a.collapsed .arrow {
  -ms-transform:rotate(-90deg);
  -moz-transform:rotate(-90deg);
  -webkit-transform:rotate(-90deg);
  transform:rotate(-90deg);
}

#sidebar ul.submenu {
  padding-left: 20px;
  padding-right: 20px;
}

#sidebar .checkbox label {
  padding-left: 0px;
}

#sidebar .checkbox label::before {
  width: 13px;
  height: 13px;
  top: 2px;
}

#sidebar .checkbox {
   margin-top: 1px;
  margin-bottom: 1px;
}

#sidebar .checkbox  {
  height: 20px;
  overflow: hidden;
}

#sidebar .checkbox label::after {
  margin-left: -22px;
  margin-top: 1px;
}

#sidebar .sidebar-icon {
  float: right;
  margin-right: 5px;
  margin-top: 4px;
  cursor: pointer;
}

#sidebar .open-full-filter {
  cursor: pointer;
}

/* Date rangepicker */
.daterangepicker .ranges li {
  color: #000;
}

.daterangepicker .ranges li.active {
    background-color: #1d1d1d;
    color: #fff;
    border: 1px solid #1d1d1d;
}
.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: #1d1d1d;
    border-color: transparent;
    color: #fff;
}
.daterangepicker td.available:hover, .daterangepicker th.available:hover {
    background-color: #ccc;
    border-color: transparent;
    color: inherit;
}
.daterangepicker td.in-range {
    background-color: #eee;
    border-color: transparent;
    color: #000;
    border-radius: 0;
}

.daterangepicker .applyBtn {
  background-color: #1d1d1d !important;
  border: 1px solid #1d1d1d !important;
}

.filter-date-clear {
  color: black;
  position: absolute;
  top: 5px;
  right: 5px;
  cursor: pointer;
}

.filter-search-date input {
     text-align: center;
}

.filter-search-date {
     padding-left: 10px !important;
     padding-right: 10px !important;
}

.checkbox input[type="checkbox"]:checked+label::after, .checkbox input[type="radio"]:checked+label::after {
  color: white;
  background-color: #f33155;
}

/* Modal */
#modal-filter .modal-body {
  overflow-y: auto;
  max-height: 650px;
}

#modal-filter .form-check input {
  margin-top: 3px !important;
}

#modal-filter .checkbox label.checkbox-modal::after {
  padding-left: 0px !important;
}

#modal-filter .sorting_disabled {
  text-align: center;
  padding-right: 10px;
}

#modal-filter .sorting_disabled .checkbox input {
  margin-left: 6px;
}

#modal-filter .sorting_disabled .checkbox label::after {
  padding-left: 0px;
}

/* Datatable */
.dataTables_wrapper .dataTables_filter label {
  width: 100% !important;
}

.dataTables_wrapper .dataTables_filter input[type="search"] {
  width: 100% !important;
  margin-left: 0 !important;
}

.dataTables_wrapper .dataTables_info {
  display: none !important;
}

@media (max-width: 768px) {
  .sidebar-filter #page-wrapper {
    padding-left: 0px;
  }

  .sidebar-filter .navbar-default {
    padding-left: 50px;
  }
}

@media (min-width: 768px) {
  #modal-filter .modal-dialog {
      width: 750px;
      max-width: 750px;
      margin: 30px auto;
  }
}