html, body{
    height: 100%;
}
body{
    overflow: hidden;
}

/* Bootstrap */
.form-control-sm {
    height: calc(1.5em + .5rem + 2px) !important;
}
.table tbody tr td {
    color: #000000;
}
.modal .modal-footer {
    justify-content: flex-end !important;
}
.modal .modal-footer button.btn{
    padding: 8px;
}
.modal-header{
    padding: .5rem 1rem;
 }
.offcanvas-header {
    padding: .5rem 1rem;
}




/* Bootstrap */


/* Login */

body.account-page {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-image: url(../img/exactlly-login-bg.jpg);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
}
.login-wrapper .login-content {
    width: 500px;
    height: inherit;
}
.login-wrapper {
    width: 100%;
    overflow: hidden;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.login-wrapper .login-content .login-logo {
    margin-bottom: 15px;
    max-width: 180px;
    margin: 0 auto;
}
.login-wrapper .login-content .login-userheading {
    margin: 0 0 10px;
    text-align: center;
}
.login-wrapper .login-content .login-userheading h3 {
    margin: 5px 0 0;
}
.login-wrapper .login-content .login-userset {
    width: 100%;
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 15px;
    background-color: #fff;
    position: relative;
}
.login-wrapper .login-content .signinform {
    margin-bottom: 0;
}
.login-wrapper .login-content .signinform.login_copy{
    position: absolute;
    bottom: -40px;
    width: 100%;
    left: 0;
}
.login-wrapper .login-content .signinform.login_copy h4 a{
    font-weight: normal;
    text-decoration: underline;
}

.login-wrapper .login-content .form-login .btn-login {
    padding: 8px 12px;
    margin-top: 0;
}
.login-wrapper .login-content .signinform.login_copy h4 a:hover, .login-wrapper .login-content .signinform.login_copy h4 a:focus{
    color: #0490e2;
}
.mini-sidebar .header-left a#toggle_btn, .mini-sidebar .header-left a#toggle_btn > svg{
    /* color: #1b2850;
    stroke: #1b2850; */
}


/* Login */




.main-wrapper, .page-wrapper, .page-wrapper .content,  .page-wrapper .content > .row, .page-wrapper .content > .row > .col-12, .page-wrapper .content > .row > .col-12 .main-card-area{
    height: 100%;
}
.page-wrapper .content {
    padding: 10px 10px 0 10px;
}
.page-wrapper .content > .row > .col-12 .main-card-area{
    display: flex;
    flex-direction: column;
}
.page-wrapper .content > .row > .col-12 .main-card-area .page-header{
    margin-bottom: 15px;
    padding: 0 15px;
}
.page-wrapper .content > .row > .col-12 .main-card-area .page-header .page-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body{
    flex: 1;
    background-color: #fff;
    border-radius: 15px;
    overflow-y: auto;
    padding: 15px;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-footer{
    padding: 5px;
    text-align: center;
    background-color: #fff;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-btn-area{
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
    margin: 0 15px;
    border-top: 1px solid #ccc;
    padding-top: 5px;
}

.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .comp-section .nav-tabs.nav-tabs-solid{
    gap: 1rem;
    background-color: transparent;
}

.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .comp-section .nav-tabs.nav-tabs-solid .nav-link:focus, .nav-tabs .nav-link {
    border-color: #e9ecef #e9ecef #dee2e6;
}

.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .comp-section .nav-tabs.nav-tabs-solid .nav-item, .page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .comp-section .nav-tabs.nav-tabs-solid .nav-link {
    max-width: 200px;
    border-radius: 6px;
}
.dash-widget .dash-widgetcontent h5 {
    font-size: 14px;
}
.dash-widget{
    cursor: pointer;
}

.dash-widget .dash-widgetimg span{
    background: rgb(90 90 90 / 12%)
}
.dash-widget.dash1 .dash-widgetimg span {
    background: rgb(90 90 90 / 12%)
}

.dash-widget.dash2 .dash-widgetimg span {
    background: rgb(90 90 90 / 12%)
}

.dash-widget.dash3 .dash-widgetimg span {
    background: rgb(90 90 90 / 12%)
}

.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div .dash-widget{
    border:1px solid #c7c7c7;
    -webkit-transition: all .2s ease;
    -ms-transition: all .2s ease;
    transition: all .2s ease;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(n):hover .dash-widget{
    border:1px solid #4396d8;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(2n):hover .dash-widget {
    border:1px solid #5fb962;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(3n):hover .dash-widget {
    border:1px solid #ea5b50;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(4n):hover .dash-widget {
    border:1px solid #f7a021;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(5n):hover .dash-widget {
    border:1px solid #42d0c3;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(6n):hover .dash-widget {
    border:1px solid #c863ca;
}


.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(n):hover .dash-widget .dash-widgetcontent h5{
    color:#4396d8;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(2n):hover .dash-widget .dash-widgetcontent h5 {
    color:#5fb962;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(3n):hover .dash-widget .dash-widgetcontent h5 {
    color:#ea5b50;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(4n):hover .dash-widget .dash-widgetcontent h5 {
    color:#f7a021;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(5n):hover .dash-widget .dash-widgetcontent h5 {
    color:#42d0c3;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(6n):hover .dash-widget .dash-widgetcontent h5 {
    color:#c863ca;
}

.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(n):hover .dash-widget .dash-widgetimg span{
    background-color:#4395d862;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(2n):hover .dash-widget .dash-widgetimg span{
    background-color:#5fb9625d;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(3n):hover .dash-widget .dash-widgetimg span{
    background-color:#ea5a505d;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(4n):hover .dash-widget .dash-widgetimg span{
    background-color:#f7a22152;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(5n):hover .dash-widget .dash-widgetimg span{
    background-color:#42d0c44f;
}
.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .tab-content.dashboard-card-area .tab-pane > div > div:nth-child(6n):hover .dash-widget .dash-widgetimg span{
    background-color:#c863ca56;
}



/* fix col head */
    table.fix_col_head {
        white-space: nowrap;
    }
    table.fix_col_head td, table.fix_col_head th {

    }
    table.fix_col_head thead th {
        position: sticky;
        top: 0;
        z-index: 1;
        /* width: 27px; */
        background: white;
    }

    table.fix_col_head td {
        background: #fff;
        padding: 4px 5px;
        text-align: center;
    }

    table.fix_col_head tbody th {
        position: relative;
    }

    table.fix_col_head thead th:first-child {
        position: sticky;
        left: 0;
        z-index: 2;
    }

    table.fix_col_head thead th:nth-child(2) {
        position: sticky;
        left: 27px;
        z-index: 2;
    }

    table.fix_col_head tbody th {
        position: sticky;
        left: 0;
        background: white;
        z-index: 1;
    }

    table.fix_col_head tbody th:nth-child(2) {
        position: sticky;
        left: 27px;
        background: white;
        z-index: 1;
    }


/* fix col head */






/* ui-grid */

.page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .ui-grid.ui-grid-100, .page-wrapper .content > .row > .col-12 .main-card-area .main-card-body .ui-grid.ui-grid-100 .ui-grid-contents-wrapper{
    height: 100%;
    height: calc(100% - 5px);
}



/* ui-grid */







































