:root {
    --brand-color: #8BC34A;
    --primaryColor: #053861 !important;
    --hoverColor: #4286bd !important;
    --whiteColor: #fff !important;
    --greyColor:#eee !important;
    --yellowColor: #ffc107 !important;
    --blackColor:#000 !important;
    --leftAlign:left;
    /* --boxShadow:rgba(0, 0, 0, 0.08) 0px 4px 12px; */
    --displayBlock:block;
    --displayFlex:flex;
    --diplayNone:none;
    --spaceBteween:space-between;
    --center:center;
}

.bg-body-secondary {
    background: radial-gradient(circle at 76% 26%,
            #e9f0f5 0,
            #f2f0f4 57%,
            #f5f5f5 100%);
}

.sidebar-menu>li>a:hover,
.sidebar-menu>li.active>a {
    background: var(--brand-color) !important;
}

.sidebar-menu > li > a:hover, .sidebar-menu > li.active > a {
    background: var(--brand-color) !important;
}
.os-viewport {
    background-color: var(--primaryColor);
    color: var(--whiteColor);
}
.os-viewport a {
    color: var(--whiteColor);
}

.sidebar-menu > li > a:hover, .sidebar-menu > li.active > a{
    background-color: var(--hoverColor) !important;
}
.sidebar-brand{
    background-color: var(--primaryColor);

}
.sidebar-brand span{
    color: var(--whiteColor) !important;
}
.rounded-circle{
    border: none !important;
}
.app-header{
    background-color: var(--primaryColor);
}
.app-header a{
       color: var(--whiteColor) !important;
}
.app-header div.dropdown-menu span{
    color: black !important;
}
.app-header div.dropdown-menu{
    background-color: var(--whiteColor) !important;
}
.app-header a.dropdown-footer{
    background-color: var(--hoverColor) !important;
}
.app-sidebar{
    background-color: var(--primaryColor) !important;
}
.sidebar-expand-lg.layout-fixed .app-sidebar, .sidebar-expand-lg.layout-fixed-complete .app-sidebar{
    background-color: var(--primaryColor) !important;
}
.icon_section{
    background-color: var(--primaryColor);
    padding: 20px 30px;
    border-radius: 0px 0px 10px 10px;
}
.icon_section svg{
    color: var(--whiteColor);
    font-size: 40px;

}
.nav-item p, .nav-item svg{
    color: var(--whiteColor);
}
.nav-treeview li a p{
    color: var(--whiteColor);
}

.dropdown-menu{
    background-color: var(--primaryColor);
}
.dropdown-menu li>a:hover{
    background-color: var(--hoverColor);
}
.sidebar-menu svg, .sidebar-menu i{
    color: var(--whiteColor);
}
.sidebar-wrapper .nav-treeview>.nav-item>.nav-link:hover{
    background-color: var(--hoverColor) !important;
}
.sidebar-brand{
    border-bottom: none !important;
}
.sidebar-wrapper{
    background-color: var(--primaryColor);
}
.app-content .card .card-body .col-lg-4 .small-box  .inner{
   background-color: var(--greyColor);
}
.app-content .cardbody .row .info-box .text-bg-primary{
    background-color: var(--yellowColor) !important;
}
.dropdown .dropdown-menu a:hover, .dropdown .dropdown-header{
    background-color: var(--hoverColor) !important;
    color: var(--whiteColor) !important;
}
/* remove blue circle */
.app-main .document-search #w1 .text-bg-info{
    display: none !important;
}
.datepicker-days .table-condensed{
    border: none !important;
}
.datepicker-days .table-condensed thead{
   
    color: var(--whiteColor) !important;
}
.datepicker table tr td, .datepicker table tr th{
    color: var(--whiteColor) !important;
   
}
.datepicker .datepicker-switch:hover, .datepicker .prev:hover, .datepicker .next:hover, .datepicker tfoot tr th:hover{
    background-color: var(--hoverColor) !important;
}
.datepicker table tr td.day:hover, .datepicker table tr td.focused{
    background-color: var(--hoverColor) !important;
}

/* #revenue-card{
    display: none !important;
} */

#collapse0, #collapse1, #collapse2{
    margin: 20px 0px!important;
    box-shadow:var(--boxShadow) !important;
    padding: 20px 10px !important;
}

[id^="w"][id$="-container"]{
    /* margin-top: 20px !important; */
    box-shadow: var(--boxShadow) !important;
    /* padding: 20px 10px !important; */
}



[id^="w"][id$="-container"] table tr th{
    text-align: left !important;
    padding: 10px !important;
    border-bottom: 1px solid var(--greyColor) !important;
}

[id^="w"][id$="-container"] tr > th {
    text-align: left !important;
    padding: 10px !important;
    border-bottom: 1px solid var(--greyColor) !important;
}
[id^="collapse"] table tr td {
    text-align: left !important;
    padding: 10px !important;
    border-bottom: 1px solid var(--greyColor) !important;
}



.col-md-6 form#w6{
    padding: 50px 25px !important;
    box-shadow: var(--boxShadow) !important;
    margin-top: 20px !important;
    border-right: 1px solid var(--yellowColor);
    border-top-right-radius: 30px !important;
}
.col-md-6 #w6 button[type="submit"]{
    background-color: var(--whiteColor) !important;
    color: var(--blackColor) !important;
    float: right !important;
    
    
}
.col-md-6 #w6 button[type="submit"]:hover{
    background-color: var(--yellowColor) !important;
    color: var(--blackColor) !important;
    transition: 1s;
    
    
    
}
#w19-container a,
#w29-container a,
#w15-container a,
#w18-container a
{
    display: var(--displayFlex);
    justify-content: center !important;
    text-align:center !important;
    padding: 5px 1px !important;
    margin-top: 3px !important;
    
}
ul#w24 {
    display: flex;
    justify-content: space--between;
    padding: 15px;
    margin-top: 25px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

ul#w24 li {
    list-style: none;
    margin: 0 15px;
    padding: 10px 25px;
    /* background-color: var(--whiteColor); */
    border-radius: 15px;
    cursor: pointer;
    /* transition: background-color 0.3s, transform 0.3s; */
    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
}

ul#w24 li:hover {
    transform: scale(1.05);
    /* color: var(--whiteColor) !important; */
}
ul#w24 li.active {
    /* background-color: var(--primaryColor); */
    color: var(--whiteColor) !important;
}
/* #w0 a{} */