.content-wrapper {
  background: #e6e7ee!important;
}

.sidebar{
  background: #e6e7ee!important;
  border: 0 !important;
}

.nav-link
{
  padding-left: 15px!important;

  border: 0 !important;
}

.navbar
{
  background: #e6e7ee!important;
}
.sidebar .nav .nav-item .nav-link{
  background: #e6e7ee !important;
}

.sidebar .nav .nav-item .nav-link {
    padding: 12px 0 8px 0;
}

.sidebar .nav .nav-item {
    padding: 0 0.9rem !important;
}

.my_list
{
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;

}

.my_list:hover {
    box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff;
    background-color: #e6e7ee;
}

.btn:hover{
      box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
      background-color: #e6e7ee !important;
      /*
      border: .0625rem solid rgba(243,247,250,.05) !important;
      border-color: #d1d9e6 !important;
      */
      border: none !important;
      border-color: transparent !important;
}

.my_list.active {
    box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff;
    background-color: #e6e7ee;
    font-weight: bold;
}

.sidebar .nav .nav-item .nav-link i.menu-icon {
    color: #495057 !important;
}

.sidebar-icon-only .sidebar .nav .nav-item {
    padding-right: 10px !important;
    padding-left: 15px !important;
}

.sidebar-icon-only .sidebar .nav .nav-item .nav-link i.menu-icon {
    margin-left: -15px !important;
}

.navbar .navbar-menu-wrapper {
    background: #e6e7ee !important;
  }








  .my_background
  {
    background: #e6e7ee!important;
  }

  .floating_border
  {
    box-shadow: rgb(255 255 255 / 25%) 0px 50px 100px -20px, rgb(255 255 255) 0px 30px 60px -30px, inset 6px 6px 10px rgb(255 255 255), inset -6px -6px 10px rgb(208 209 213) !important;
  }

  .shadow_soft {
    box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  }

  .my_rounded
  {
    border-radius: 0.55rem !important;
  }

  .my_text_shadow
  {
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  }

  .btn_hover:hover{
    box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
    background-color: #e6e7ee !important;
  }
   .my_hover
   {
     box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
     background-color: #e6e7ee !important;
   }

   .my_border
   {
     /*
     border: .0625rem solid rgba(243,247,250,.05) !important;
     border-color: #d1d9e6 !important;
     */
     border: none !important;
     border-color: transparent !important;
   }

   .box_shadow_no_left
   {
     box-shadow: inset -3px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
     background-color: #e6e7ee !important;
   }

   .box_shadow_no_right
   {
     box-shadow: inset 3px 2px 5px #b8b9be, inset 3px -3px 7px #fff !important;
     background-color: #e6e7ee !important;
   }

  .msg_box_shadow
  {
    box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  }

  .table_header_background{
    background-color: #dfdfdf !important;
  }

  .my_button_icon
  {
    position: relative !important;
    top: 2px !important;
  }


  .my_rounded_start_border
   {
     border: .0625rem solid rgba(243, 247, 250, .05) !important;
     border-color: #d1d9e6 !important;
   }

   .my_rounded_end_border
   {
     border: .0625rem solid rgba(243, 247, 250, .05) !important;
     border-color: #d1d9e6 !important;
   }


.warning_text_shadow
{
  text-shadow: -1px -1px 1px #ffc770, 1px 1px 1px #c37801 !important;
}

.danger_text_shadow
{
  text-shadow: -1px -1px 1px #f575bb, 1px 1px 1px #c10c6e !important;
}

.primary_text_shadow
{
  text-shadow: -1px -1px 1px #6f7cff, 1px 1px 1px #091bcb !important;
}

.success_text_shadow
{
  text-shadow: -1px -1px 1px #5ef9f9, 1px 1px 1px #037c7d !important;
}



.status_enabled
{
  padding: .1rem .4rem .1rem .4rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  background-color: #a2f7d0 !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

.status_on_bin
{
  padding: .1rem .4rem .1rem .4rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  background-color: #f9a9b8 !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}


.status_disabled
{
  padding: .1rem .4rem .1rem .4rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  background-color: #ffc772 !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}


.mdi-menu::before {
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  background: #e6e7ee!important;
  border-radius: 5px;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}



td:focus-visible
{
  outline: none !important;
}

.table{
  --bs-table-bg: #e6e7ee !important;
  margin-bottom: 0 !important;
  border-bottom: 1px solid #e6e7ee !important;
}


.navbar .navbar-menu-wrapper .navbar-toggler {
    color: #495057 !important;
}

.navbar .navbar-menu-wrapper .navbar-toggler {
  color: #141227 !important;
  background-color: #e6e7ee !important;
  box-shadow: none !important;
}


.navbar .navbar-menu-wrapper .navbar-toggler i:before {
  background-color: #e6e7ee !important;
  border-radius: 10px !important;
  border-color: #d1d9e6!important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

.navbar .navbar-menu-wrapper .navbar-nav .nav-item {
    border-left: none !important;
}






/*
// modal
*/
.modal-backdrop {
  /*background-color: transparent !important;*/
  background-color: #e6e7ee !important;
  opacity: 70%;
}

.modal-content {
  border-radius: 15px !important;
  border: 0 !important;
  background-color: #e6e7ee !important;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: rgb(255 255 255 / 25%) 0px 50px 100px -20px, rgb(255 255 255) 0px 30px 60px -30px, inset 6px 6px 10px rgb(255 255 255), inset -6px -6px 10px rgb(208 209 213);
  padding: .5rem;
}

.modal-header .modal_close {
  color:red;
  font-size: 1rem !important;
  font-weight: bold !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff !important;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

.modal-header .modal_close:hover {
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
}

/*
// modal
*/






.form-group {
    margin-bottom: 1rem !important;
}

button:focus:not(:focus-visible) {
    /* outline: 0; */
    box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff !important;

}

button:hover > .my_button_icon{
  /*color: #0d6efd !important;*/
}

button:active > .my_button_icon{
  /*color: #0d6efd !important;*/
}

button:focus > .my_button_icon{
  /*color: #0d6efd !important;*/
}

.btn.active.focus, .fc button.active.focus, .ajax-upload-dragdrop .active.focus.ajax-file-upload, .btn.active:focus, .fc button.active:focus, .ajax-upload-dragdrop .active.ajax-file-upload:focus, .btn.focus, .fc button.focus, .ajax-upload-dragdrop .focus.ajax-file-upload, .btn:active.focus, .fc button:active.focus, .ajax-upload-dragdrop .ajax-file-upload:active.focus, .btn:active:focus, .fc button:active:focus, .ajax-upload-dragdrop .ajax-file-upload:active:focus, .btn:focus, .fc button:focus, .ajax-upload-dragdrop .ajax-file-upload:focus, button, button:active, button:checked, button:focus, button:hover, button:visited {
    /* outline: 0; */
    /* outline-offset: 0; */
}
.btn, .fc button, .ajax-upload-dragdrop .ajax-file-upload, .btn-group.open .dropdown-toggle, .fc .open.fc-button-group .dropdown-toggle, .btn:active, .fc button:active, .ajax-upload-dragdrop .ajax-file-upload:active, .btn:focus, .fc button:focus, .ajax-upload-dragdrop .ajax-file-upload:focus, .btn:hover, .fc button:hover, .ajax-upload-dragdrop .ajax-file-upload:hover, .btn:visited, .fc button:visited, .ajax-upload-dragdrop .ajax-file-upload:visited, a, a:active, a:checked, a:focus, a:hover, a:visited, body, button, button:active, button:hover, button:visited, div, input, input:active, input:focus, input:hover, input:visited, select, select:active, select:focus, select:visited, textarea, textarea:active, textarea:focus, textarea:hover, textarea:visited {
    /* -webkit-box-shadow: none; */
    /* box-shadow: none; */
}
.btn:focus, .fc button:focus, .ajax-upload-dragdrop .ajax-file-upload:focus, .btn.focus, .fc button.focus, .ajax-upload-dragdrop .focus.ajax-file-upload {
    /* outline: 0; */
    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}



/* prev and next button*/
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.prev, .datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.next, .datepicker.datepicker-inline .datepicker-days table.table-condensed thead tr th.prev, .datepicker.datepicker-inline .datepicker-days table.table-condensed thead tr th.next {
    border-radius: 5px !important;
    padding-top: 4px !important;
    top: 10px !important;
    background: transparent !important;
    box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
    /*
    border: .0625rem solid rgba(243,247,250,.05) !important;
    border-color: #d1d9e6 !important;
    */
    border: none !important;
    border-color: transparent !important;
}

/*margin top*/
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed, .datepicker.datepicker-inline .datepicker-days table.table-condensed {
    margin-top: 25px !important;
}

/*Body*/
.datepicker.datepicker-dropdown, .datepicker.datepicker-inline {
    padding: 0 10px !important;
    width: 20% !important;
    max-width: 300px !important;
    min-width: 260px !important;
    border-radius: 10px !important;
    background-color: #e6e7ee;
    box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
    /*
    border: .0625rem solid rgba(243,247,250,.05) !important;
    border-color: #d1d9e6 !important;
    */
    border: none !important;
    border-color: transparent !important;
}


/* Month*/
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.datepicker-switch, .datepicker.datepicker-inline .datepicker-days table.table-condensed thead tr th.datepicker-switch {
    color: #434a54;
    padding-bottom: 1rem;
    font-size: 1rem;
    position: absolute;
    left: 33px;
    text-align: left;
    top: 5px !important;
    font-weight: 500;
}


.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day:hover, .datepicker.datepicker-inline .datepicker-days table.table-condensed tbody td.day:hover {
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  color: #000;
  background-color: #e6e7ee !important;
  border-radius: 5px !important;
}


.datepicker.datepicker-dropdown .datepicker-days, .datepicker.datepicker-dropdown .datepicker-months, .datepicker.datepicker-dropdown .datepicker-years, .datepicker.datepicker-dropdown .datepicker-decades, .datepicker.datepicker-dropdown .datepicker-centuries, .datepicker.datepicker-inline .datepicker-days, .datepicker.datepicker-inline .datepicker-months, .datepicker.datepicker-inline .datepicker-years, .datepicker.datepicker-inline .datepicker-decades, .datepicker.datepicker-inline .datepicker-centuries {
    padding: .8rem .7rem;
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
}


.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.today, .datepicker.datepicker-inline .datepicker-days table.table-condensed tbody td.day.today {
    color: #000;
    background: transparent;
    position: relative;
    z-index: 1;
    text-shadow: none !important;
}
.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.active, .datepicker.datepicker-inline .datepicker-days table.table-condensed tbody td.day.active {
    color: #000000;
    background: transparent;
    position: relative;
    z-index: 1;
    text-shadow: none !important;
}

.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.prev:hover, .datepicker.datepicker-inline .datepicker-days table.table-condensed thead tr th.prev:hover{
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
}


.datepicker.datepicker-dropdown .datepicker-days table.table-condensed thead tr th.next:hover, .datepicker.datepicker-inline .datepicker-days table.table-condensed thead tr th.next:hover{
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
}


.manage_button
{
  color: #04c;
  margin-top: -6px;
  margin-left: 15px;
  position: absolute;
  padding: 4px;
  font-size: .9rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

.manage_button:hover
{
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
}


.form-control, .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--single .select2-search__field, .typeahead, .tt-query, .tt-hint {
    font-size: 1rem !important;
}














/*
  #####################################################
  #####################################################
  #####################################################
*/

/*
  DATATABLE SEARCH BOX
*/
div.dataTables_wrapper div.dataTables_filter label{
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
}
div.dataTables_wrapper div.dataTables_filter input {
    border-radius: 10px;
    background: #e6e7ee !important;
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
    box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
    padding-top: .3rem !important;
    padding-bottom: .3rem !important;

    /*
    border: .0625rem solid rgba(243,247,250,.05) !important;
    border-color: #d1d9e6 !important;
    */
    border: none !important;
    border-color: transparent !important;
}
/*
  DATATABLE SEARCH BOX
*/



/*
  DATATABLE DATA LENGTH
*/
div.dataTables_wrapper div.dataTables_length label {
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  margin-top: 6px !important;
}

div.dataTables_wrapper div.dataTables_length select {
  background-color: #e6e7ee;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}
/*
  DATATABLE DATA LENGTH
*/


/*
  DATATABLE DATA INFO
*/
div.dataTables_wrapper div.dataTables_info {
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
}
/*
  DATATABLE DATA INFO
*/


/*
  DATATABLE PAGINATION
*/
div.dataTables_wrapper div.dataTables_paginate ul.pagination {
    margin: 8px 8px !important;

}

.page-item.disabled .page-link {
    color: #212529 !important;
    margin-left: 3px !important;
    margin-right: 3px !important;
    background-color: #e6e7ee !important;
    box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
    /*
    border: .0625rem solid rgba(243,247,250,.05) !important;
    border-color: #d1d9e6 !important;
    */
    border: none !important;
    border-color: transparent !important;
}

.page-item.active .page-link {
    color: #212529 !important;
    font-weight: bold !important;
    margin-left: 3px !important;
    margin-right: 3px !important;
    background-color: #e6e7ee !important;
    box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
    /*
    border: .0625rem solid rgba(243,247,250,.05) !important;
    border-color: #d1d9e6 !important;
    */
    border: none !important;
    border-color: transparent !important;
}

.page-item:last-child .page-link {
  margin-left: 3px !important;
  margin-right: 3px !important;
    color: #212529 !important;
    background: #e6e7ee!important;
    box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
    /*
    border: .0625rem solid rgba(243,247,250,.05) !important;
    border-color: #d1d9e6 !important;
    */
    border: none !important;
    border-color: transparent !important;
}

.page-item:last-child .page-link:hover {
    color: #212529 !important;
    background: #e6e7ee!important;
    box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
    text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
    /*
    border: .0625rem solid rgba(243,247,250,.05) !important;
    border-color: #d1d9e6 !important;
    */
    border: none !important;
    border-color: transparent !important;
}


.page-item:first-child .page-link {
  margin-left: 3px !important;
  margin-right: 3px !important;
  color: #212529 !important;
  background: #e6e7ee!important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

.page-item:first-child .page-link:hover {
  color: #212529 !important;
  background: #e6e7ee!important;
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

a.page-link {
  margin-left: 3px !important;
  margin-right: 3px !important;
  color: #212529 !important;
  background: #e6e7ee!important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff !important;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

a.page-link:hover {
  margin-left: 3px !important;
  margin-right: 3px !important;
  color: #212529 !important;
  background: #e6e7ee!important;
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

/*
  DATATABLE PAGINATION
*/

/*
  #####################################################
  #####################################################
  #####################################################
*/







a:focus,
select:focus,
textarea:focus,
input:focus {
  font-weight: bold !important;
}






/* scrollbar custom */
/* width */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  /*background: transparent;*/

  background-color: #e6e7ee;
  border-radius: 10px;
  border-left: 4px solid #e6e7ee;
  border-right: 4px solid #e6e7ee;
  border-top: 4px solid #e6e7ee;
  border-bottom: 4px solid #e6e7ee;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background-color: #46c35f;
  border-radius: 10px;
  background-clip: content-box;

  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;


}
















.category_list {
    cursor: pointer;
  }
  .category_list:focus { outline: 0; }

  .category_list:before, .category_list:after {
    position: absolute;
    content: '';
    display: block;
    width: 140%;
    height: 100%;
    left: -20%;
    z-index: -1000;
    transition: all ease-in-out 0.5s;
    background-repeat: no-repeat;
  }
  .category_list:before {
    display: none;
    top: -75%;
    background-image: radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, transparent 20%, #05d977 20%, transparent 30%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, transparent 10%, #05d977 15%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%);
    background-size: 10% 10%, 20% 20%, 15% 15%, 20% 20%, 18% 18%, 10% 10%, 15% 15%,
     10% 10%, 18% 18%;
  }
   .category_list:after {
    display: none;
    bottom: -75%;
    background-image: radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, transparent 10%, #05d977 15%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%),
     radial-gradient(circle, #05d977 20%, transparent 20%);
    background-size: 15% 15%, 20% 20%, 18% 18%, 20% 20%, 15% 15%, 10% 10%, 20% 20%;
  }

  .category_list:active {
    transform: scale(0.9);
  }

  .category_list.animate:before {
    display: block;
    animation: topBubbles ease-in-out 0.75s forwards;
  }

  .category_list.animate:after {
    display: block;
    animation: bottomBubbles ease-in-out 0.75s forwards;
  }
   @keyframes
  topBubbles {  0% {
   background-position: 5% 90%, 10% 90%, 10% 90%, 15% 90%, 25% 90%, 25% 90%, 40% 90%,
   55% 90%, 70% 90%;
  }
   50% {
   background-position: 0% 80%, 0% 20%, 10% 40%, 20% 0%, 30% 30%, 22% 50%, 50% 50%,
   65% 20%, 90% 30%;
  }
   100% {
   background-position: 0% 70%, 0% 10%, 10% 30%, 20% -10%, 30% 20%, 22% 40%, 50% 40%,
    65% 10%, 90% 20%;
   background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
  }
  @keyframes
  bottomBubbles {  0% {
   background-position: 10% -10%, 30% 10%, 55% -10%, 70% -10%, 85% -10%, 70% -10%, 70% 0%;
  }
   50% {
   background-position: 0% 80%, 20% 80%, 45% 60%, 60% 100%, 75% 70%, 95% 60%, 105% 0%;
  }
   100% {
   background-position: 0% 90%, 20% 90%, 45% 70%, 60% 110%, 75% 80%, 95% 70%, 110% 10%;
   background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
  }



  .category_list:hover{
      box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff!important;
      background-color: #e6e7ee!important;
    }





.clear_input_on_dropdown{
  color: #000;
  margin-top: -8px;
  margin-left: 93px;
  position: absolute;
  padding: 4px;
  font-size: .9rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}


.clear_input_on_dropdown:hover
{
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  color: red;
}



.clear_update_input_on_dropdown{
  color: #000;
  margin-top: -8px;
  margin-left: 15px;
  position: absolute;
  padding: 4px;
  font-size: .9rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

.clear_update_input_on_dropdown:hover
{
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  color: red;
}


.manage_plus_btn:hover
{
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  color: green;
}

.manage_plus_btn
{
  color: #000;
  margin-top: -8px;
  margin-left: 55px;
  position: absolute;
  padding: 5px 6px 3px 6px;
  font-size: .9rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}

.manage_minus_btn:hover
{
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #fff !important;
  color: red;
}
.manage_minus_btn
{
  color: #000;
  margin-top: -8px;
  margin-left: 15px;
  position: absolute;
  padding: 5px 6px 3px 6px;
  font-size: .9rem;
  border-radius: 5px;
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #fff;
  /*
  border: .0625rem solid rgba(243,247,250,.05) !important;
  border-color: #d1d9e6 !important;
  */
  border: none !important;
  border-color: transparent !important;
}




table.dataTable td.dataTables_empty, table.dataTable th.dataTables_empty
{
  text-shadow: -1px -1px 1px #ffffff, 1px 1px 1px #c7c8cd !important;
}