.holder-style, .holder-style-container {
    display: block;
    padding: 9px 16px;
    color: #2e3133;
    background-color: rgb(253, 253, 253);
    box-shadow: 0 0 13px rgba(187, 187, 187, 0.8);
    -webkit-transition: all 0.15s ease;
    -moz-transition: all 0.15s ease;
    transition: all 0.15s ease;
    border-radius: 6px !important;
}
.holder-style.holder-active, .holder-style-container.holder-active {
    background-color: #522dcc;
    color: #ffffff;
    font-weight: bold !important;
}
.holder-style .holder-icon, .holder-style-container .holder-icon, 
.holder-style.holder-active .holder-icon, .holder-style-container.holder-active .holder-icon {
    margin-top: 11px !important;
    /*color: #ff701f;*/
}
.left-fixed {
    color: #522dcc;
    position: fixed;
    top: 0px;
    left: 20px !important;
    right: auto !important
}
.settings-icon-desktop
{
    color: #fff;
    position: fixed;
    top: 19px;
    right: 20px;
}
.settings-icon-desktop .fa {
      font-size: 2em;
}
.right-fixed {
    position: fixed;
    top: 16px;
    right: 65px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: normal !important;
}
.right-fixed > a {
  margin: 0px 0px 0px 18px;
}
body.utility-page #content .panel.desktop
{
    border-radius: 8px;
    box-shadow: 0 0 13px rgba(187, 187, 187, 0.8);
}
a.desktop_links {
  margin:0px !important; 
}
body.utility-page #content .panel.desktop {
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3);
    color: white;
    background: #2e1f5d;
}

/* Version 2 */



.sidebar-left-content {
    background-color: #292929;
    -webkit-box-shadow: -39px 7px 0 0 #292929 inset;
    box-shadow: -39px 7px 0 0 #292929 inset;
    height: 100%;
}    
#sidebar_left, 
.sidebar-menu > li > ul, 
ul.sub-nav li.active > a {
    background-color: #292929 !important;
}
.sidebar-menu > li > ul > li:first-child > a {
    padding-top: 0px;
}
.sidebar-menu > li > ul > li:last-child > a:not(.accordion-toggle.menu-open) {
    padding-bottom: 0px;
}
.sidebar-menu > li > ul > li.active > a {
    background: linear-gradient(to right, #8FC63E, #D3DD22) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.sidebar-menu > li.active > a > span {
    background: linear-gradient(to right, #8FC63E, #D3DD22) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.navbar-logo-wrapper.bgc-light, 
.navbar-logo-wrapper, 
.navbar-logo-wrapper.dark.bg-dark {
    background-color: #292929 !important;
}
span#sidebar_left_toggle {
    /*opacity: 0;*/
}
.navbar.bg-dark {
    background-color: transparent !important;
}
aside#sidebar_left {
    /*position: fixed;*/
}
.sidebar-menu > li:first-child {
    padding-top: 6px !important;
    padding-bottom: 5px !important;
}
.table-responsive thead > tr {
    background: #202020;
    color: white;
    font-weight: 200 !important;
}
#content .panel {
    padding: 10px 0px 20px;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);

}
thead > tr > th:first-child {
    border-radius: 0px 0px 0px 0px !important;
}
thead > tr > th:last-child {
    border-radius: 0px 0px 0px 0px !important;
}
.panel {
    
}
@media (min-width: 1100px) {
    #content {
        padding: 16px 20px 50px 20px;
    }
}

/* Page Title */
.base-section {
    padding: 5px 9px 11px 22px;
    overflow: auto;
    border-bottom: 1px solid #efefef;
}
#content .panel .panel-body {
    margin-top: 0px !important;
}
.base-section h3 {
    margin: 0px !important;
}
.base-section h3 i {
    /*display: none;*/
}
.listing-filters {
    padding: 0px 10px !important;
    margin: 12px 0px 12px !important;
    overflow: auto !important;
}
.listing-filters div {
    margin-bottom: 0px !important;
}

table img {
    object-fit: cover;
    object-position: top !important;
    border-radius: 8px;
}
.select2-container--focus, select:focus, textarea:focus, .btn:focus, input:focus {
    border: 2px solid transparent !important;
    background-image: linear-gradient(white, white), linear-gradient(to right, #8FC63E, #D3DD22) !important;
    background-origin: border-box !important;
    background-clip: padding-box, border-box !important;
}
.select2-container--focus, select:focus, textarea:focus, .btn:focus, input:focus {
    box-shadow: 0px 0px 15px -3px #d3dd224f !important;
    border: 1px solid #d3dd224f !important;
}
.header-dock {
    background: white;
    padding: 9px 14px 9px 0px;
    margin: 11px 0px;
    display: flex;
    flex-direction: row;
    align-items: center;
    position: fixed;
    left: 42% !important;
    border: 1px solid #e0e0e0;
    border-radius: 50px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.header-dock:hover {
    box-shadow: 0 0px 5px #CDDC39;
}

.header-dock .navbar-form {
    margin: 0px;
}
.navbar-btn.btn-group {
    margin: 0px;
}
.header-dock button.btn.dropdown-toggle {
    padding: 0px;
    background: none;
}
.header-dock i, #header_home_icon {
    font-size: 30px;
    color: orange;
}
/*.dock-icons a, .dock-icons i {   
    margin: 0px !important;
    padding: 0px !important;
    width: 46px !important;
    text-align: center;
    color: #292929 !important;
    font-size: 26px !important;
    display: block;
}*/
.dock-icons a, .dock-icons i {
    margin: 0px !important;
    padding: 0px !important;
    width: 50px !important;
    text-align: center;
    color: #292929 !important;
    /* font-size: 26px !important; */
     /*display: block;*/
}
.dock-icons a:hover, .dock-icons i:hover {
    background: linear-gradient(to right, #8FC63E, #D3DD22) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.calendar-year button.btn.btn-md.dropdown-toggle {
    background: linear-gradient(to right, #8FC63E, #D3DD22);
    padding: 0px 11px 0px 8px;
    font-size: 15px;
    color: white;
    border-radius: 100px;
    height: 33px !important;
    width: auto;
    line-height: 0px;
    border: 0px;
    text-transform: capitalize;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    font-weight: normal;
}
.calendar-year button.btn.btn-md.dropdown-toggle i.fa-light.fa-calendar.ml5, 
.calendar-year button.btn.btn-md.dropdown-toggle i.fa-light.fa-cog.ml5 {
    font-size: 20px;
    color: white;
    margin: 0px 7px 0px 0px;
}
.navbar.bg-dark .nav > li.open > a, .navbar.bg-dark .nav > li:hover > a, .navbar.bg-dark .nav > li:focus > a, .navbar.bg-dark .nav > li.active > a, .navbar.bg-dark .nav > li > a:hover, .navbar.bg-dark .nav > li > a:focus {
    color: #FFF;
    background-color: #2a2f4300;
}
.navbar.bg-dark .nav > li.dropdown.open .dropdown-menu, .navbar.bg-dark .nav > li.dropdown .open .dropdown-menu,
.bg-dark .dropdown-menu {
    border-top-color: #292929 !important;
    border-radius: 10px;
}
.bg-dark .list-group-item, .bg-dark .dropdown-menu {
    background-color: #292929;
    border: 0;
}
.navbar .dropdown-menu > li.dropdown-footer a:hover {
    background: linear-gradient(to right, #8FC63E, #D3DD22);
    color: #ffffff;
}
span.logged-in-user i {
    font-size: 44px;
    /*border-radius: 100%;*/
    background: linear-gradient(to right, #8FC63E, #D3DD22) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-align: center;
    margin: 17px 0px 0px;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #292929;
}
.base-section i.fa {
    font-size: 25px;
    color: #292929eb;
}
.base-section i.fa:hover {
    color: #b4d22f;
}
.base-section .btn-default {
    background: none;
    padding: 6px 8px 6px 0px;
}
.breadcrumb
{
    margin: 23px 24px 0px;
}
.breadcrumb-link h6 {
    color: #292929;
}
.breadcrumb > li h6 {
    font-size: 12px !important;
    text-transform: uppercase;
}
body.sb-l-m .sidebar-menu > li > a > span:nth-child(1) 
{
    width: 52px;
}
body.sb-l-m .sidebar-menu > li > a > .sidebar-title {
    left: 51px;
    width: 221px;
}
body.sb-l-m .sidebar-menu > li > a > .sidebar-title {
    background-color: #292929;
}
body.sb-l-m .sidebar-menu > li > a > .sidebar-title {
    background: #292929 !important;
    background-clip: unset !important;
    color: white !important;
    -webkit-text-fill-color: unset !important;
}
body.sb-l-m .sidebar-menu > li {
    padding: 0px !important;
}
input#fooFilter {
    background: url("data:image/svg+xml,%3Csvg width='24' height='24' fill='url(%23grad)' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3ClinearGradient id='grad' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0%25' stop-color='%238FC63E'/%3E%3Cstop offset='100%25' stop-color='%23D3DD22'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M10 2a8 8 0 105.29 14.29l4.71 4.7 1.42-1.41-4.7-4.71A8 8 0 0010 2zm0 2a6 6 0 110 12 6 6 0 010-12z' fill='url(%23grad)'/%3E%3C/svg%3E") no-repeat right 12px center;
    padding-right: 40px;
    background-size: 26px;
    border: 0px;
    width: 100%;
    float: right;
    margin: 0px !important;
    border-radius: 5px;
    background-color: #f3f3f3;
    height: 32px;
}
input#fooFilter:focus
{
    background: url("data:image/svg+xml,%3Csvg width='24' height='24' fill='url(%23grad)' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3ClinearGradient id='grad' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0%25' stop-color='%238FC63E'/%3E%3Cstop offset='100%25' stop-color='%23D3DD22'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M10 2a8 8 0 105.29 14.29l4.71 4.7 1.42-1.41-4.7-4.71A8 8 0 0010 2zm0 2a6 6 0 110 12 6 6 0 010-12z' fill='url(%23grad)'/%3E%3C/svg%3E") no-repeat right 12px center !important;
}

.calendar-year button.btn.btn-md.dropdown-toggle:focus {
    background: #292929 !important;
}
.header-user-detail span {
    color: #292929 !important;
}
span.header-user-name {
    text-transform: capitalize;
    font-size: 15px;
}
span.header-user-role {
    font-size: 13px;
    color: #575757 !important;
    text-align: right;
    text-transform: capitalize;
    font-weight: normal;
}
.user-section-header {
    display: flex !important;
    align-items: center;
    gap: 13px;
    margin-top: 9px;
}
span.hidden-xs.header-user-detail {
    display: flex;
    flex-direction: column;
    gap: 0px;
    line-height: 18px;
}

/* Input Styling */
span.label-text {
    position: relative;
    z-index: 2;
    left: 7px;
    top: 9px;
    font-weight: bold;
    background: white;
    padding: 0px 4px;
}
.allcp-form .gui-input, form select.form-control {
    position: relative;
    top: -3px;
    border: 1px solid #909090 !important;
}
label.field-icon {
    display: none;
}
div.allcp-form .panel input[required=required], div.allcp-form .panel select[required=required] {
    border-bottom: 2px solid #8dc540 !important;
}
.allcp-form .switch > input:checked + label {
    border-color: #97c93b !important;
    color: #97c93b !important;
}
.allcp-form .switch > input:checked + label:after {
    background: #97c93b !important;
    
}
.allcp-form .switch > label:after color: {;
    /*color: #909090 !important;*/
    /*border: 2px solid #909090 !important;*/
}
.allcp-form .switch > label {
    color: #656565 !important;
    border: 2px solid #656565  !important;
}
.allcp-form .switch > label:after {
    background: #656565 !important;
}
.allcp-form input[type="checkbox"] {
    top: 13px;
    position: relative;
}
.select2-container--default .select2-selection--single {
    background: white !important;
    border: 1px solid #909090 !important
}

input[type="checkbox"] {
    accent-color: #97c93b;
    width: 20px;
    height: 20px;
}

/* Input Styling */

/* Wizard */
.panel .wizard {
    margin: 0px !important;
    background: white !important;
}
.panel .wizard .steps li.current a, 
.panel .wizard .steps li.done a {
    background-color: #ffffff !important;
    color: black !important;
}
.panel .wizard .steps li.current a i,
.panel .wizard .steps li.done a i {
    background: linear-gradient(to right, #8FC63E, #D3DD22);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding: 12px 6px 14px 8px;
    position: relative;
    top: -1px;
}
.panel .wizard .steps li.disabled a {
    background-color: #ffffff !important;
}
.panel .wizard.steps-justified .steps li {
    display: inline-block;
    position: relative;
    float: none;
    width: auto;
}
.panel .wizard.steps-tabs .steps li a
{
    color: #bbbbbb;
    padding-top: 5px;
    font-size: 16px;
    margin: 0px 10px;
}
.panel .wizard.steps-bg.steps-tabs .steps {
    padding: 0;
    border-color: transparent;
    background: transparent;
}
.panel .steps.clearfix {
    border-bottom: 1px solid #e4e4e4 !important;
}
.wizard .actions li a
{
    padding: 11px 84px !important;
    background-color: #292929 !important;
    font-size: 18px !important;
}
/* Wizard */


#customizer {
    display: none !important;
}
body {
    color: #292929 !important
}
.btn-danger, .label-danger {
    background: #b43a3a;
    background: linear-gradient(90deg, rgba(180, 58, 58, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(255, 149, 0, 1) 100%);
}
.btn-success, .label-success {
    background: #D3DD22;
    background: linear-gradient(to right, #8FC63E, #D3DD22);
    
}
.btn-success:focus , .label-success:focus , .btn-success:active , .label-success:active {
    color: #9bca39;
    background-color: #202020;
    
}
.label-danger, .btn.btn-danger, .btn.btn-success, .label-success {
    border-radius: 100px;
}
input.btn.btn-bordered.btn-danger.btn-lg.pull-left {
    margin: 19px 10px 7px;
    border-radius: 47px;
    border: 0px;
    font-weight: bold;
    padding: 10px 42px;
}
.panel h3 i 
{
    background: linear-gradient(to right, #8FC63E, #D3DD22);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.allcp-form.theme-primary .gui-input:focus, .allcp-form.theme-primary .gui-textarea:focus, .allcp-form.theme-primary .select > select:focus, .allcp-form.theme-primary .select-multiple select:focus {
    border-color: #99ca3a;
}
.allcp-form.theme-primary .gui-input:focus, .allcp-form.theme-primary .select > select:focus, .allcp-form.theme-primary .select-multiple select:focus 
{
    outline-color: #99ca3a;
}
.listing-filters .pull-left .gui-input {
    margin-top: 4px !important;
    height: 38px;
    border: 1px solid lightgray !important;
}
.listing-filters .pull-left {
    margin-top: 0px !important;
    margin-left: 10px !important;
    margin-right: 0px !important;
}
.panel .base-section h3 small {
    display: block;
    color: #171717;
    margin: 0px;
    text-align: left;
    font-size: 15px !important;
    margin-top: 6px;
}
.custom_timepicker_style.done
 {
    color: #89bf2e !important;
    font-weight: 600 !important;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 2;
    color: #ffffff;
    background-color: #a4cd36;
    border-color: #9bca39;
    cursor: default;
}
.pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 13px 19px;
    line-height: 0.49;
    text-decoration: none;
    color: #000000;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    margin-left: -1px;
    border-radius: 100px;
    margin-left: 4px;
    font-size: 15px;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    color: #9bca39;
    background-color: #202020;
    border-color: #dddddd;
}
.allcp-form .btn-success:focus, .allcp-form .btn-success:active {
    color: #a1cc36 !important;
}
.dz-default.dz-message {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    
}
form#dropZone {
    border: 2px dashed gray;
    height: 200px;
}
div#bookForm {
    background: #ffffff;
    width: 97%;
    margin: auto;
}
div.allcp-form.theme-primary .ui-datepicker .ui-state-active,
div.allcp-form.theme-primary .ui-datepicker-today a, 
div.allcp-form.theme-primary .ui-datepicker-calendar a:hover, 
div.allcp-form.theme-primary .ui-datepicker-today a:hover, 
div.allcp-form.theme-primary .ui-datepicker .ui-state-highlight {
    background-color: #292929 !important;
    color: #a6ce35 !important;
}
.allcp-form .btn-danger, .allcp-form .btn-danger:hover, .allcp-form .btn-danger:focus, .allcp-form .btn-danger:active {
    background: linear-gradient(90deg, rgba(180, 58, 58, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(255, 149, 0, 1) 100%) !important;
}
body {
    background: #f4f7f9;
}
.sb-l-o #sidebar_left {
    border-radius: 0px 0px 32px 0px;
}

.panel.invoice-panel {
    padding: 20px 30px !important;
}
.panel.invoice-panel .panel 
{
    border: 0px !important;
}
.input-group-addon {
    background: #3b3b3b !important;
    color: #ffffff !important;
    border: 0px !important;
    padding: 0px !important;
    border-radius: 3px !important;
}
.input-group-addon:hover {
    background: #95c83c !important;
}
div input.custom_timepicker_style {
    font-weight: 600 !important;
    color: #95c83c !important;
}
.label-success span.label-text, 
.btn-success span.label-text, 
.label-danger span.label-text,
.btn-danger span.label-text
 {
    position: static;
    background: transparent;
    font-weight: 400;
}
.text-green {
    color: #a0cb22;
}
.allcp-form .panel-footer {
    padding: 0px !important;
    border: 0px !important;
}
.allcp-form.theme-primary .gui-input:focus, .allcp-form.theme-primary .gui-textarea:focus, .allcp-form.theme-primary .select > select:focus, .allcp-form.theme-primary .select-multiple select:focus {
    border-color: #a0cc37 !important;
}
.allcp-form.theme-primary .gui-input:focus, .allcp-form.theme-primary .select > select:focus, .allcp-form.theme-primary .select-multiple select:focus
{
    outline-color: #a0cc37 !important;
}
h4.bg-dark.p10 {
    background: #292929 !important;
    border-radius: 7px;
}

/*.fa:hover,
.fa-light:hover {
  color: #8FC63E;
  text-shadow: 0 0 8px #8FC63E, 0 0 15px #D3DD22;
  transform: scale(1.2);
  transition: all 0.3s ease;
}*/

.fa-light:hover{
  animation: wobble 0.5s ease;
  color: #8FC63E;
  text-shadow: 0 0 0px #8FC63E, 0 0 15px #D3DD22;
}

@keyframes wobble {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(5deg); }
  50% { transform: rotate(-5deg); }
  75% { transform: rotate(3deg); }
  100% { transform: rotate(0deg); }
}

/*.fa:hover, .fa-light:hover {
  background: linear-gradient(45deg, #8FC63E, #D3DD22, #ff00ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: rainbowGlow 2s infinite linear;
}

@keyframes rainbowGlow {
  0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(360deg); }
}
*/

.fa:hover {
  transform: scale(1.2) rotateX(15deg);
  transition: all 0.3s ease;
  color: #8FC63E;
}


/* Employee Profile */
.col-md-4.chart_data, 
.col-md-12.chart_data {
    border: 1px solid #d9d9d9;
    border-radius: 9px;
    background: #9494941f;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;

}

.col-md-4.chart_data i.fa, 
.col-md-12.chart_data i.fa
 {
    background: linear-gradient(to right, #8FC63E, #D3DD22);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 100px;
    position: absolute;
    right: -15px;
    rotate: -18deg;
    bottom: -21px;
}

.employee_profile_page .btn.btn-primary {
    background: linear-gradient(to right, #003f87, #00BCD4);
    border-radius: 31px;
    transition: background 0.5s ease;
}

.employee_profile_page .btn.btn-primary:hover {
    background: linear-gradient(to right, #00BCD4, #003f87);
}

.topbar-menu .service-box span:first-child {
    font-size: 29px;
    color: #97c93b;
}
.bg-dark {
    background-color: #292929 !important;
}
a.service-box.bg-dark {
    border-radius: 10px;
}
.modules {
    transition: box-shadow 0.4s ease;
}

.modules:hover {
    box-shadow: 0 0px 2px #74ce14, 0 0px 35px #CDDC39 !important;
}
.breadcrumb > li a {
 color: #292929 !important;   
}