﻿body {
    font-family: Poppins;
}

    body[main-theme-layout="main-theme-layout-2"] .form-control::selection,
    body[main-theme-layout="main-theme-layout-3"] .form-control::selection,
    body[main-theme-layout="main-theme-layout-4"] .form-control::selection {
        background-color: rgba(255, 255, 255, 0.7);
        color: #303841;
    }

a:hover {
    color: #8d63da;
}

hr {
    border-color: #eeeeee;
}

input, select, textarea {
    font-size: 16px !important;
}
.btn {
    font-size: 16px !important;
    padding: 0.475rem 1.75rem;
}

.btn, .btn-sm, .btn-xs {
    border: 1px solid transparent;
}

    .btn.icon-only {
        padding: 0.45rem 0.85rem 0.375rem;
    }

.modal-footer .btn-sm {
    padding: 0.475rem 0.8rem !important;
}

.text-gray {
    color: #aaaaaa;
}

table {
    font-size: 13px;
}
table th, table .totals {
    font-weight: 600;
    font-size: 14px;
}
table.dataTable thead th, table.dataTable tfoot th {
    font-weight: 600;
}

footer {
    z-index: 8;
}

@media screen and (max-width: 575px) {
    footer {
        position: static;
    }
}


@media screen and (max-width: 767px) {
    table {
        font-size: 14px;
    }
}

.select2-container--default .select2-selection--multiple, 
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 1px solid #ced4da;
}

body[main-theme-layout="main-theme-layout-2"] .loader-wrapper,
body[main-theme-layout="main-theme-layout-3"] .loader-wrapper,
body[main-theme-layout="main-theme-layout-4"] .loader-wrapper {
    background-color: #303841;
}

body[main-theme-layout="main-theme-layout-2"] .loader-wrapper .loader,
body[main-theme-layout="main-theme-layout-3"] .loader-wrapper .loader,
body[main-theme-layout="main-theme-layout-4"] .loader-wrapper .loader {
    background-color: #303841 !important;
}

.input-group-text .icon-close::before {
    top: 2px !important;
}

.nowrap {
    white-space: nowrap;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

.icon-angle-down.arrow {
    position: absolute;
    top: 12px;
    right: 12px;
    pointer-events: none;
    z-index: 5;
}

.btn-xs {
    padding-bottom: 3px;
    padding-top: 3px;
}

    .btn-xs:focus, .btn-xs.focus, .btn-sm:focus, .btn-sm.focus {
        outline: 0 !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }

.btn-icon {
    font-size: 16px;
    padding: 6px 12px;
}

.icon-angle-down.w-btn {
    right: 52px;
}
.icon-angle-down.w-add {
    right: 57px;
}
.icon-angle-down.w-send {
    right: 97px;
}

.mtn-10 {
margin-top: -10px;
}

.mtn-20 {
    margin-top: -20px;
}

input, select, optgroup, textarea, .progress-bar {
    font-family: "Open Sans", sans-serif;
}

.error-wrapper {
    background: none !important;
    min-height: 0px !important;
}

.icon-lists div, .flag-icons div {
    font-family: Poppins;
}

.icon-hover-bottom .icon-popup > div,
.icon-hover-bottom .icon-popup .icon-class {
    font-family: Poppins;
}

.icon-hover-bottom .icon-title {
    font-family: Poppins;
}
.chat-box .chat-right-aside .chat .chat-msg-box .message-data-time {
    font-family: Poppins;
}

.navs-icon li a span {
    font-family: Poppins;
}

.icon-lists {
    font-family: Poppins;
}

/*
div.dataTables_wrapper {
    font-family: Poppins, 'Open Sans', sans-serif;
}
*/

.alert {
    border-radius: 0;
    margin-bottom: 1.3rem;
}

.theme-layout-container {
    margin-left: 0px;
    margin-bottom: -10px;
}

.main-theme-layout {
    margin-left: 10px;
    margin-right: 10px;
    display: inline-block;
    text-align: center;
    margin-bottom: 15px;
    background-color: #ab8ce4;
    opacity: 0.3;
    position: relative;
}

.main-theme-layout:first-child {
    margin-left: 0px;
}

.main-theme-layout:last-child {
    margin-right: 0px;
}

.main-theme-layout.active {
    opacity: 1;
}

.main-theme-layout.active:after {
    font-family: FontAwesome;
    content: '\f00c';
    position: absolute;
    bottom: 6px;
    left: 22px;
    font-size: 20px;
    color: #28a745;
}

.main-color.active:after {
    font-family: FontAwesome;
    content: '\f00c';
    position: absolute;
    top: 9px;
    left: 15px;
    font-size: 20px;
    color: #36404a;
}


.tap-top {
    width: 50px;
    height: 50px;
    position: fixed;
    bottom: 40px;
    right: 30px;
    z-index: 99;
    text-align: center;
    background: none;
    background-color: #36404a;
    border-radius: 0;
    font-size: 22px;
    cursor: pointer;
    line-height: 2.2;
    display: none;
    border: 1px solid #4b5469;
}

.tap-top:hover {
    background-color: #303841;
}

    .tap-top i {
        color: #ab8ce4;
    }


/* Main Menu in Header for Creating items */

.page-main-header .main-header-right .nav-right .dropdown-menu i {
    font-size: 18px !important;
}

body[main-theme-layout="main-theme-layout-4"] .page-main-header .main-header-right .nav-right .dropdown-menu {
    background-color: #303841;
    border: 1px solid #4b5469;
}

body[main-theme-layout="main-theme-layout-4"] .page-main-header .main-header-right .nav-right .dropdown-menu a {
    color: rgba(255, 255, 255, 0.7);
}

    body[main-theme-layout="main-theme-layout-4"] .page-main-header .main-header-right .nav-right .dropdown-menu a:hover,
    body[main-theme-layout="main-theme-layout-4"] .page-main-header .main-header-right .nav-right .dropdown-menu a:focus {
        background-color: #36404a;
    }

.page-main-header .main-header-right .nav-right .dropdown-divider {
    border-top: 1px solid #e9ecef;
}

body[main-theme-layout="main-theme-layout-4"] .page-main-header .main-header-right .nav-right .dropdown-divider {
    border-top: 1px solid #4b5469;
}

/* Main Menu End */



.dataTables_wrapper .dataTables_filter {
    float: left;
    text-align: left;
    margin-left: 0px;
}

.dataTables_wrapper .dataTables_length {
    float: right;
    text-align: right;
    margin-left: 15px;
    position: relative;
}

.dataTables_wrapper .dataTables_length .arrow {
    top: 14px;
    right: 74px;
}

@media screen and (max-width: 767px) {
    div.dataTables_wrapper div.dataTables_length,
    div.dataTables_wrapper div.dataTables_filter {
        text-align: center;
    }

    div.dataTables_wrapper div.dataTables_length {
        display: none;
    }
}

@media screen and (max-width: 575px) {
    div.dataTables_wrapper .dataTables_filter input[type="search"] {
        height: 40px;
    }
}







.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border: 1px solid #8d63da;
}

.badge {
    font-weight: 600;
    border-radius: 0;
}
.badge-pill {
    border-radius: 10rem;
}

.checkbox label {
    padding-left: 10px;
    margin-top: 0px;
}

.icon-fullscreen:hover {
    cursor: pointer;
}

.datepicker--cell.-selected-:hover, .datepicker--cell.-selected-.-current- {
    background: #8d63da;
}

.dropdown-item.active, span.twitter-typeahead .active.tt-suggestion, span.twitter-typeahead .tt-suggestion.tt-cursor, .dropdown-item:active, span.twitter-typeahead .tt-suggestion:active {
    color: #16181b;
    background-color: #f8f9fa;
}


body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .dropdown-menu a:active,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .dropdown-menu a:active,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .dropdown-menu a:active,
body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .dropdown-menu a:focus,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .dropdown-menu a:focus,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .dropdown-menu a:focus {
    background-color: #36404a;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px solid;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.page-header h4 {
    margin-bottom: 0;
    white-space: nowrap;
}

@media only screen and (max-width: 575px) {
    .page-header h4 {
        font-size: 20px;
    }
}

.page-wrapper .page-main-header {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-bottom: 1px solid #eeeeee;
}

body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-main-header {
    border-bottom: 1px solid #4b5469;
}

body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-main-header .main-header-right .nav-right > ul {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.page-main-header .main-header-left .logo-wrapper img {
    margin-top: 0px;
}

.switch-sm .switch {
    margin-top: 6px;
}

@media screen and (max-width: 992px) {
    .page-main-header .switch-sm .switch {
        margin-top: 11px;
    }
}

@media screen and (max-width: 575px) {
    .page-main-header .main-header-left .logo-wrapper img {
        margin-left: -5px;
    }

    .page-main-header .switch-sm .switch {
        margin-top: 10px;
    }
}




.page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu {
    padding-top: 0px;
}

.page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu .sidebar-title {
    margin-top: 20px;
}

    .page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu > li > a i {
        font-size: 18px;
        display: inline-block;
    }

        .page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu > li > a i:first-child {
            width: 22px;
            text-align: center;
        }

    .page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu > li > a i {
        margin-top: 1px;
    }

    .page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu > li > a:hover {
        color: #ab8ce4 !important;
    }

    .page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu .sidebar-submenu > li > a:hover {
        color: #ab8ce4 !important;
    }

.page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu .sidebar-header {
    position: relative;
}

.page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu .sidebar-header span {
    position: absolute;
    top: 7px;
}

.page-main-header .main-header-right .nav-right ul li h6 i {
    font-size: 16px;
}

.nav-menus span.icon {
font-size: 18px !important;
}

.page-main-header .main-header-right {
    margin-top: -8px;
    padding: 0 25px;
}


@media only screen and (max-width: 991px) {
    .page-main-header .main-header-right {
        margin-top: -4px;
        padding: 0 20px;
    }

    .page-main-header .main-header-right .nav-right > ul > li {
        margin-left: 16px;
    }

    .page-wrapper .page-main-header .main-header-right .nav-right > ul {
        top: 2px;
        position: absolute;
        z-index: 6;
        -webkit-box-shadow: none;
        box-shadow: none;
        left: -20px;
        padding: 0px;
        -webkit-transform: none;
        transform: none;
        opacity: 100;
        visibility: visible;
    }

    .page-wrapper .page-main-header .main-header-right .mobile-sidebar {
        z-index: 7;
    }
    
    .nav-menus span.icon-user {
        margin-right: 0px !important;
    }
}

@media (max-width: 767px) {
    .page-wrapper .page-main-header .main-header-right .nav-right > ul {
        left: -16px;
    }

    .page-main-header .main-header-right .nav-right > ul > li {
        margin-left: 12px;
    }

    .page-main-header .main-header-right {
        padding: 0 16px;
    }
}

@media (max-width: 575px) {
    .page-wrapper .page-main-header .main-header-right .nav-right > ul {
        left: -12px;
    }

    .page-wrapper .page-main-header .main-header-right .nav-right > ul > li {
        padding: 14px 0;
    }
    .nav-menus span.icon {
        font-size: 20px !important;
    }
}



.search-form input {
    border-radius: 0;
}

.history-icon {
    font-size: 2.0em;
    margin-right: 12px;
}

.table-responsive {
    /*padding-right: 3px;
    padding-left: 3px;*/
    /*overflow-y: visible;
    overflow-x: visible;*/
}


/*
@media (max-width: 767px) {
    .table-responsive .dropdown-menu {
        position: static !important;
    }
    .dropdown-menu {
        transform: none !important;
    }
}

@media (min-width: 768px) {
    .table-responsive {
        overflow: visible;
    }
}

@media (max-width: 767px) {
    .table-responsive .dropdown-menu {
        position: relative;
    }
}*/



.clear-filters {
    position: absolute;
    top: -14px;
    right: 0px;
    z-index: 9;
}
/*@media (max-width: 991px) {
    .clear-filters {
        top: -14px;
    }
}*/
@media (max-width: 767px) {
    .clear-filters {
        top: -20px;
    }
}
@media (max-width: 575px) {
    .clear-filters {
        top: -9px;
    }
}



.modal-header h4.modal-title {
    line-height: 1.2;
    margin-bottom: -3px;
}

.modal-header h4.modal-title span {
    font-size: 1.1rem;
    position: absolute;
    top: 28px;
    margin-left: 8px;
}




.nav-item .nav-link {
    border-width: 1px !important;
    border-radius: 0;
    white-space: nowrap;
}

.page-wrapper .page-body-wrapper .page-body .card .border-tab.nav-tabs {
    border-bottom: 1px solid #eeeeee;
    margin-bottom: 20px;
}

.border-tab.nav-tabs .nav-item .nav-link:hover {
    border-bottom: 1px solid #ab8ce4;
}

div:not(#quickview-wrapper) div .border-tab.nav-tabs .nav-item .nav-link {
    padding: 8px 20px 7px 20px;
    position: relative;
    font-size: 18px;
    line-height: 1.8;
}

    .border-tab.nav-tabs .nav-item .nav-link .badge {
        font-family: 'Open Sans';
        padding: 0.35em 0.75em 0.45em;
        font-size: 80%;
        line-height: 18px;
        border-radius: 0;
        position: relative;
        top: -1px;
        margin-left: 8px;
    }

.border-tab.nav-primary .nav-item .nav-link:not(.active):hover {
    border-bottom: 1px solid transparent !important;
}

@media only screen and (max-width: 575px) {
    .border-tab.nav-primary .nav-item .nav-link {
        border: 1px solid transparent;
    }

    .border-tab.nav-primary .nav-item .nav-link:not(.active):hover {
        border: 1px solid transparent !important;
    }
    
    .border-tab.nav-primary .nav-item .nav-link.active, .border-tab.nav-primary .nav-item .nav-link.show, .border-tab.nav-primary .nav-item .nav-link:focus {
        border: 1px solid #ab8ce4;
    }

    div:not(#quickview-wrapper) div .border-tab.nav-tabs .nav-item .nav-link {
        line-height: 1.5;
    }
}



.modal-header, .modal-content {
    border-radius: 0;
}

.modal-header .close {
    padding: 0.4rem 0.8rem 1rem 1rem;
}

.close {
    font-weight: 600;
    text-shadow: none;
    opacity: .6;
}

.table th, .table td {
    /*padding: 0.75rem;*/
    vertical-align: middle;
}

table.table {
    font-family: 'Open Sans';
}
/*
table.dataTable {
    border-collapse: initial !important;
}*/

table.dataTable:not(.fixedHeader-locked):not(.fixedHeader-floating) {
    width: calc(100% - 1px) !important;
}

table.dataTable.cards:not(.fixedHeader-locked):not(.fixedHeader-floating) {
    width: 100% !important;
}

.table-bordered td, .table-bordered th {
    border-color: #dee2e6;
}

.dataTables_wrapper table.dataTable, table.table {
    border: 1px solid #dee2e6;
}

body[main-theme-layout="main-theme-layout-2"] table.table,
body[main-theme-layout="main-theme-layout-3"] table.table,
body[main-theme-layout="main-theme-layout-4"] table.table {
    border: 1px solid #4b5469;
}

table.dataTable thead .sorting::before, table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::before, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::before, table.dataTable thead .sorting_desc::after, table.dataTable thead .sorting_asc_disabled::before, table.dataTable thead .sorting_asc_disabled::after, table.dataTable thead .sorting_desc_disabled::before, table.dataTable thead .sorting_desc_disabled::after {
    top: 7px !important;
    bottom: auto !important;
    font-size: 1.2em;
}

table.dataTable thead .sorting::before, table.dataTable thead .sorting_asc::before, table.dataTable thead .sorting_desc::before, table.dataTable thead .sorting_asc_disabled::before, table.dataTable thead .sorting_desc_disabled::before {
    right: 0.7em;
}

table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::after, table.dataTable thead .sorting_asc_disabled::after, table.dataTable thead .sorting_desc_disabled::after {
    right: 0.3em;
}

.dataTables_wrapper table.dataTable thead th, .dataTables_wrapper table.dataTable thead td {
    border-bottom: none !important;
}

.page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody td {
    border-top: 1px solid #dee2e6 !important;
}

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody td,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody td,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody td {
    border-top: 1px solid #4b5469 !important;
}

.page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.no-data td {
    border-top: none !important;
}

tr.no-data .message {
    position: relative;
    margin-left: 5px;
    padding-left: 30px;
    font-size: 13px;
    font-weight: 600;
    font-style: italic;
}

    tr.no-data .message i {
        position: absolute;
        display: block;
        top: -10px;
        left: -12px;
    }



body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card .table-striped tbody tr:nth-of-type(odd):hover th, body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card .table-striped tbody tr:nth-of-type(odd):hover td,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card .table-striped tbody tr:nth-of-type(odd):hover th, body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card .table-striped tbody tr:nth-of-type(odd):hover td,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card .table-striped tbody tr:nth-of-type(odd):hover th, body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card .table-striped tbody tr:nth-of-type(odd):hover td {
    color: rgba(255, 255, 255, 0.7);
}

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr {
    background-color: #36404a;
}

/*  working on a selected row solutions that works the same for table and best for cards also 
.page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td {
    background-color: #e2e2e2 !important;
    border-top: 1px solid #cecece !important;
}

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td {
    background-color: #20252a !important;
    border-top: 1px solid #4b5469 !important;
}*/

.page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected {
    background-color: #dfdfdf !important;
}

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected {
    background-color: #20252a !important;
}

.page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td {
    background-color: transparent !important;
    border-color: #cecece !important;
}

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card table.dataTable.display tbody tr.selected td {
    border-color: #4b5469 !important;
}



table tr.totals td {
    background-color: #f2f2f2 !important;
    border-color: #cecece !important;
    font-weight: 600;
    text-align: right;
}

body[main-theme-layout="main-theme-layout-2"] table tr.totals td,
body[main-theme-layout="main-theme-layout-3"] table tr.totals td,
body[main-theme-layout="main-theme-layout-4"] table tr.totals td {
    background-color: #2d343b !important;
    border-color: #4b5469 !important;
}

.dataTables_wrapper .dataTables_filter input[type="search"], div.dataTables_wrapper div.dataTables_length select {
    height: 44px;
    border: 1px solid #ddd;
}



.dataTables_wrapper::after {
    height: 5px;
}

/*
.dataTables_wrapper button {
    padding: 0.30rem 0.75rem;
}
*/

.dataTable td [class^="fa-"]::before,
.dataTable td [class*=" fa-"]::before,
[class^="icon-"]::before,
[class*=" icon-"]::before {
    display: inline;
    position: relative;
    top: 1px;
}

.sidebar-menu [class^="icon-"]::before, .sidebar-menu [class*=" icon-"]::before {
    top: -1px;
}

.input-group-text [class^="icon-"]::before, .input-group-text [class*=" icon-"]::before {
    top: 0px;
}

.input-group-text .icon-close::before {
    top: 2px;
}
.page-wrapper .page-body-wrapper .page-sidebar .sidebar-menu .sidebar-submenu > li > a > i {
    top: 0px;
    position: relative;
}

.dataTable td.viewer {
    position: relative;
    background-clip: padding-box;
    width: 30px;
}

.table-responsive .dataTable td.viewer i {
    font-size: 1.3em;
    margin-left: 10px;
    margin-right: 10px;
}

.dataTable td.viewer .icon-bookmark {
    font-size: 0.9em;
    position: absolute;
    left: 1px;
    top: 2px;
}




.dataTables_wrapper .dataTables_paginate {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
}
.dataTables_wrapper table.dataTable {
    margin-bottom: 8px !important;
}

@media screen and (max-width: 767px) {
    .dataTables_wrapper .dataTables_paginate {
        margin-top: 20px !important;
    }
}
@media only screen and (max-width: 575px) {
    div.dataTables_wrapper div.dataTables_paginate .paginate_button {
        padding: 6px 12px !important;
    }
}




.dataTables_wrapper .dataTables_paginate {
    border-radius: 0;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: 0;
}

.dropdown-toggle::after {
    margin-left: 0.08em;
}

.dataTable tr.no-data {
    background-color: transparent !important;
}

.dataTable td i[class^="fa-"]::before,
.dataTable td i[class*=" fa-"]::before,
.dataTable td i[class^="icon-"]::before,
.dataTable td i[class*=" icon-"]::before {
    font-size: 1.3em;
}

.dataTable .new-item i {
    font-size: 1.5em;
}

.dropdown-menu i {
    font-size: 1.1em;
}

.table-action-menu .icon-arrow-circle-down {
    color: #ab8ce4;
}

.dataTable button {
    padding: 0.50rem 0.50rem;
    background-color: transparent;
    border: none;
    font-size: 1.5rem;
    border-radius: 0;
    cursor: pointer;
    outline: 0;
}

.dropdown-toggle {
    outline: none;
}

.dropdown-toggle::after {
    border: none;
}

.dropdown-menu, span.twitter-typeahead .tt-menu {
    border-radius: 0;
}

.GridViewImageCount span {
    font-size: 0.8em;
}




table.dataTable thead tr {
    border-bottom: 1px solid #ddd;
}

body[main-theme-layout="main-theme-layout-2"] table.dataTable thead tr,
body[main-theme-layout="main-theme-layout-3"] table.dataTable thead tr,
body[main-theme-layout="main-theme-layout-4"] table.dataTable thead tr {
    border-bottom: 1px solid #4b5469;
}

table.dataTable tfoot tr {
    border-top: 1px solid #ddd;
}

body[main-theme-layout="main-theme-layout-2"] table.dataTable tfoot tr,
body[main-theme-layout="main-theme-layout-3"] table.dataTable tfoot tr,
body[main-theme-layout="main-theme-layout-4"] table.dataTable tfoot tr {
    border-top: 1px solid #4b5469;
}


a:not([href]):not([tabindex]) {
    opacity: 0.6;
}


table.dataTable th a {
    color: #2a3142;
}

body[main-theme-layout="main-theme-layout-2"] table.dataTable th a,
body[main-theme-layout="main-theme-layout-3"] table.dataTable th a,
body[main-theme-layout="main-theme-layout-4"] table.dataTable th a {
    color: rgba(255, 255, 255, 0.7);
}







/*
@media only screen and (max-width: 575px) {
    div.dataTables_wrapper div.dataTables_paginate .paginate_button {
        padding: 8px 16px !important;
    }
}*/

    /*
table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.display tbody tr.odd > .sorting_1 {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-top: none !important;
}

body[main-theme-layout="main-theme-layout-2"] table.dataTable.display tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-2"] table.dataTable.display tbody tr.odd > .sorting_1,
body[main-theme-layout="main-theme-layout-3"] table.dataTable.display tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-3"] table.dataTable.display tbody tr.odd > .sorting_1,
body[main-theme-layout="main-theme-layout-4"] table.dataTable.display tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-4"] table.dataTable.display tbody tr.odd > .sorting_1 {
    border-left: 1px solid #4b5469;
    border-right: 1px solid #4b5469;
    border-top: none !important;
}

table.dataTable.display tbody tr.odd > .sorting_1 {
    background-color: #f6f6f6 !important;
}

table.dataTable.display tbody tr.even > .sorting_1 {
    background-color: #f6f6f6 !important;
}

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.display tbody tr.odd > .sorting_1,
body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.order-column.stripe tbody tr.odd > .sorting_1,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.display tbody tr.odd > .sorting_1,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.order-column.stripe tbody tr.odd > .sorting_1,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.display tbody tr.odd > .sorting_1,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
    background-color: #2e353d !important;
}

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.display tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.order-column.stripe tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.display tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.order-column.stripe tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.display tbody tr.even > .sorting_1,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .page-body .card .dataTables_wrapper table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
    background-color: #2e353d !important;
}
*/


    /* View/Edit Pages */

.card {
    border: 1px solid #eeeeee;
    border-radius: 0;
    margin-bottom: 20px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

    .card .card.last {
        margin-bottom: 0px;
    }

body[main-theme-layout="main-theme-layout-2"] .card,
body[main-theme-layout="main-theme-layout-3"] .card,
body[main-theme-layout="main-theme-layout-4"] .card {
    border: 1px solid #4b5469;
}


.card-body .card.full {
    margin: 0px -21px -21px -21px;
}

@media screen and (max-width: 575px) {

    .card.full {
        border-left: none !important;
        border-right: none !important;
    }
    
    .card-body .card.full {
        margin: -17px -15px;
    }
}


.card .card-header, .card .card-body {
    padding: 20px;
}

.card .card-header {
    border-top: 1px solid #eeeeee;
}

.card-header h5 {
    display: inline-block;
    margin-right: 15px;
}

.card-header .btn-lg {
    margin-left: 5px;
    border-radius: 0;
}

.invoice .media .btn-lg {
    margin-left: 5px;
    border-radius: 0;
}

.search-toolbar .btn-lg {
    margin-left: 5px;
    border-radius: 0;
}

body[main-theme-layout="main-theme-layout-2"] .card .card-header,
body[main-theme-layout="main-theme-layout-3"] .card .card-header,
body[main-theme-layout="main-theme-layout-4"] .card .card-header {
    border-top: 1px solid #4b5469;
}

/*
.card .card-body .card-header {
    margin-top: 0px;
}*/

.card .card-header.first {
    border-top: none !important;
}

.card-body.hr {
border-top: 1px solid #eeeeee;
}

body[main-theme-layout="main-theme-layout-2"] .card-body.hr,
body[main-theme-layout="main-theme-layout-3"] .card-body.hr,
body[main-theme-layout="main-theme-layout-4"] .card-body.hr {
    border-top: 1px solid #4b5469;
}

.card .card-body .form-btn a:not(:last-child) {
    margin-right: 5px;
}

/*
.card22 .card:first-child {
    border-top: none;
    border-bottom: none;
}

.card9999 .card:last-child.full {
    margin-bottom: -21px;
}

*/

/*
.card .card:first-child.full {
    margin-left: 0px;
    margin-right: 0px;
    border-left: none;
    border-right: none;
}*/












/*
@media screen and (max-width: 575px) {
    .card .card:first-child.full {
        margin-left: -5px;
        margin-right: -5px;
    }
}
*/




/*.card .card-head333er:not(.first) {
    margin-top: -10px;
}*/






    /*.card-header.first222 {
        margin-top: 0px;
    }

    .tab-pane .card-header.first222 {
        margin-top: -20px;
    }

    .card222 .card:first-child {
        margin-top: -24px;
    }*/

    /*.card .card:first-child.full {
        padding-left: 5px;
        padding-right: 5px;
    }

    .page-wrapper .page-body-wrapper .card .card.full {
        margin-bottom: 5px;
    }*/


/*
@media screen and (max-width: 991px) {
    .tab-pane .card-header.first222 {
        margin-top: -16px;
    }
}*/














.card .data {
    /*font-size: 0.9em;*/
    font-family: 'Open Sans';
    margin-top: -3px;
}

        .card .data.large {
            font-size: 1.2em;
            margin-top: -7px;
        }

        .card label {
            font-weight: 600;
            /*margin-bottom: 0.1rem;*/
        }

        .card .checkbox label, .card .radio label, .card label.switch {
            font-weight: 500;
        }

        .input-group-append.add .btn {
            margin-left: 5px;
            padding: 4px 9px 0px 9px;
            font-size: 20px !important;
            width: 40px;
        }

        .input-group-append.send .btn {
            margin-left: 5px;
            padding: 7px 9px 0px 9px;
            width: 80px;
        }

    .form-group {
    margin-bottom: 1.3rem;
    }

.border-tab.nav-tabs {
    margin-top: -12px;
    flex-wrap: wrap;
}

@media (max-width: 575px) {
    .border-tab.nav-tabs {
        margin-top: 0px;
    }
}

    .btn, .btn-sm, .form-control, .input-group-text, .checkbox label::before, select {
        border-radius: 0;
    }

.form-control {
    padding: 0.375rem 0.65rem;
}
/*
select.form-control {
    padding: 0.375rem 0.3rem;
}*/



/* Turning tabs into icon button tabs on mobile */

@media (max-width: 575px) {
    .border-tab.nav-tabs.icons-tabs {
        margin-right: -10px !important;
        margin-bottom: 15px !important;
    }

        .border-tab.nav-tabs.icons-tabs .nav-item {
            width: auto !important;
            margin-right: 10px !important;
            border: 1px solid #eeeeee !important;
            margin-bottom: 10px !important;
        }

    body[main-theme-layout="main-theme-layout-2"] .border-tab.nav-tabs.icons-tabs .nav-item,
    body[main-theme-layout="main-theme-layout-3"] .border-tab.nav-tabs.icons-tabs .nav-item,
    body[main-theme-layout="main-theme-layout-4"] .border-tab.nav-tabs.icons-tabs .nav-item {
        border: 1px solid #4b5469 !important;
    }

    .border-tab.nav-tabs.icons-tabs .nav-item .nav-link {
        padding: 9px 0px 0px 10px !important;
        font-size: 18px !important;
        width: 45px !important;
        height: 45px !important;
        line-height: 1.5 !important;
    }

        .border-tab.nav-tabs.icons-tabs .nav-item .nav-link .badge {
            position: absolute !important;
            top: -10px !important;
            right: -8px !important;
            padding: 0.35em 0.6em !important;
            font-size: 60% !important;
            line-height: 12px !important;
            border-radius: 0 !important;
            margin-left: 0px !important;
        }

    .dataTable, .table {
    font-size: 0.8em !important;
    }

        .dataTable th, .table th {
            font-size: 11px !important;
        }
}








    .btn-gray {
        background-color: #f5f5f5;
    }

    body[main-theme-layout="main-theme-layout-2"] .btn-gray,
    body[main-theme-layout="main-theme-layout-3"] .btn-gray,
    body[main-theme-layout="main-theme-layout-4"] .btn-gray {
        background-color: #434f5a;
    }

    .invalid-feedback:before {
        content: '\f06a';
        font-family: fontAwesome;
        position: absolute;
        left: 1px; /* Adjust as needed */
        top: -2px; /* Adjust as needed */
        font-size: 1.2em;
    }

    .invalid-feedback {
        margin-top: 0.35rem;
        font-size: 90%;
        position: relative;
        padding-left: 18px;
        text-align: left;
    }

    .was-validated .form-control:invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .custom-select.is-invalid {
        border-color: #dc3545 !important;
    }

    .input-group-text i {
        width: 16px;
    }

    body[main-theme-layout="main-theme-layout-2"] .input-group-text,
    body[main-theme-layout="main-theme-layout-3"] .input-group-text,
    body[main-theme-layout="main-theme-layout-4"] .input-group-text {
        background-color: #434f5a;
        border: 1px solid #4b5469;
        color: rgba(255, 255, 255, 0.7);
    }



    /* Select2 */

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin-top: 5px !important;
    margin-right: 5px !important;
    border-radius: 0 !important;
    padding: 1px 6px !important;
}

.select2-container {
    width: 100% !important;
}

.selection .select2-selection {
    border-radius: 0 !important;
}

.select2-selection--multiple {
    min-height: 38px !important;
}


/* Sorting Columns */

.ui-sortable .list-item {
    border: 1px solid #dee2e6;
    position: relative;
    margin-bottom: -1px;
    cursor: pointer;
}

body[main-theme-layout="main-theme-layout-2"] .ui-sortable .list-item,
body[main-theme-layout="main-theme-layout-3"] .ui-sortable .list-item,
body[main-theme-layout="main-theme-layout-4"] .ui-sortable .list-item {
    border: 1px solid #4b5469;
}

.ui-sortable .list-item .checkbox label {
    margin-top: 8px;
    margin-bottom: 8px;
    margin-left: 6px;
    text-decoration: line-through;
}

.ui-sortable .list-item.item-checked .checkbox label {
    text-decoration: none;
}

.ui-sortable .list-item .icon-move {
    display: block;
    position: absolute;
    top: 11px;
    right: 10px;
    font-size: 1.1em;
    cursor: pointer;
}

.sort-column-header {
    margin-bottom: 10px;
    border: 1px solid #dee2e6;
    margin: 0px;
    padding: 10px;
    margin-bottom: -1px;
}

body[main-theme-layout="main-theme-layout-2"] .sort-column-header,
body[main-theme-layout="main-theme-layout-3"] .sort-column-header,
body[main-theme-layout="main-theme-layout-4"] .sort-column-header {
    border: 1px solid #4b5469;
}

    .sort-column-header .btn {
        margin-top: -5px;
        margin-right: -5px;
        padding-bottom: 3px;
        padding-top: 2px;
    }




/* Invoice */

.invoice-subheader {
    margin-bottom: 10px;
}

.legal {
    font-size: 0.9em;
}

#project {
    margin-bottom: 20px;
}

.invoice .image-dark {
    display: block;
}

.invoice .image-light {
    display: none;
}

body[main-theme-layout="main-theme-layout-2"] .invoice .image-dark,
body[main-theme-layout="main-theme-layout-3"] .invoice .image-dark,
body[main-theme-layout="main-theme-layout-4"] .invoice .image-dark {
    display: none;
}

body[main-theme-layout="main-theme-layout-2"] .invoice .image-light,
body[main-theme-layout="main-theme-layout-3"] .invoice .image-light,
body[main-theme-layout="main-theme-layout-4"] .invoice .image-light {
    display: block;
}





/* Login */

.authentication-main .auth-innerleft .logo-login {
    height: 75px;
    width: auto;
}

.authentication-main .auth-innerleft .logo-author {
    height: 55px;
}

.authentication-main hr {
    margin-top: 0.9rem;
    margin-bottom: 0.9rem;
}

.authentication-main .poweredby {
    font-size: 11px;
    font-weight: 500;
    margin-bottom: 1px;
}

@media screen and (max-width: 767px) {
    .authentication-main .auth-innerleft, .authentication-main .auth-innerright {
        padding: 15px 15px;
    }
}

.reset-password-box {
    width: 100% !important;
}


/* Timesheet */

.ts-nav {
    position: absolute;
    top: 6px;
    right: 0px;
}

.ts-nav a {
    padding: 12px 16px 11px;
    margin-right: 6px;
}

@media screen and (max-width: 575px) {
        .ts-nav a {
            padding: 6px 12px;
        }
}

.form-control.xs-width {
    min-width: 60px;
}

.form-control.sm-width {
    min-width: 90px;
}

.form-control.md-width {
    min-width: 120px;
}

.form-control.lg-width {
    min-width: 150px;
}

.form-control.xl-width {
    min-width: 180px;
}


.progress {
    border-radius: 0;
    height: 1.25rem;
}

.table .totals .progress {
    background-color: #ffffff;
}

body[main-theme-layout="main-theme-layout-2"] .progress,
body[main-theme-layout="main-theme-layout-3"] .progress,
body[main-theme-layout="main-theme-layout-4"] .progress {
    background-color: rgba(255, 255, 255, 0.7) !important;
}


table td.spinner {
    min-width: 162px;
}

table .input-group.bootstrap-touchspin {
    width: auto;
}

table .bootstrap-touchspin .btn {
    padding: 0.375rem 0.75rem;
}




.datepicker {
    z-index: 1;
}

.ui-datepicker {
    z-index: 1050 !important;
    display: none;
    position: relative;
    width: 20em;
    margin-top: 8px;
    background: #fff;
    -webkit-box-shadow: 0 4px 14px rgba(174, 197, 231, 0.5);
    -moz-box-shadow: 0 4px 14px rgba(174, 197, 231, 0.5);
    box-shadow: 0 4px 14px rgba(174, 197, 231, 0.5);
    -webkit-border-radius: 0;
    border-radius: 0;
    border: 1px solid #DDD;
    text-align: center;
    color: #4a4a4a;
}

    .ui-datepicker a {
        color: #4a4a4a;
        text-align: center
    }

    .ui-datepicker .ui-state-disabled span {
        color: #DBDBDB
    }

    .ui-datepicker .ui-datepicker-header {
        position: relative;
        background: #F5F5F5;
        border-bottom: 1px solid #E5E5E5;
        line-height: 27px;
        font-size: 15px;
        padding: 10px
    }

    .ui-datepicker .ui-datepicker-next, .ui-datepicker .ui-datepicker-prev {
        width: 32px;
        height: 32px;
        display: block;
        font-size: 16px;
        position: absolute;
        text-decoration: none;
        cursor: pointer;
        color: #fff !important;
        background-color: #ab8ce4;
        top: 7px;
        line-height: 2.1;
    }

    .ui-datepicker .ui-datepicker-prev {
        left: 7px;
        padding-right: 1px;
    }

    .ui-datepicker .ui-icon-circle-triangle-w,
    .ui-datepicker .ui-icon-circle-triangle-e {
        text-indent: -9999px;
        position: absolute;
    }

        .ui-datepicker .ui-icon-circle-triangle-w:after {
            text-indent: 0;
            font-family: 'themify';
            content: "\e64a";
            position: absolute;
            top: 2px;
            left: -7px;
            font-size: 14px;
        }

        .ui-datepicker .ui-icon-circle-triangle-e:after {
            text-indent: 0;
            font-family: 'themify';
            content: "\e649";
            position: absolute;
            top: 2px;
            left: -7px;
            font-size: 14px;
        }

.ui-datepicker .ui-datepicker-next {
    right: 7px;
    padding-left: 1px;
}

    .ui-datepicker .ui-datepicker-title {
        margin: 0 2.3em;
        line-height: 1.6em;
        text-align: center;
        color: #ab8ce4;
        font-weight: 600;
        font-size: 1.1em;
    }

        .ui-datepicker .ui-datepicker-title select {
            font-size: 1em;
            margin: 1px 0;
            padding: 1px 5px;
            background-color: #EEE;
            border-color: #CCC
        }

            .ui-datepicker .ui-datepicker-title select option {
                background: #FFF
            }

    .ui-datepicker select.ui-datepicker-month-year {
        width: 100%
    }

    .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
        width: 44%;
        border: solid 1px #ddd;
        margin-top: -7px;
        margin-bottom: -3px;
        margin-left: 4px;
        color: #4d4d4d;
    }

.ui-datepicker-title:after {
    text-indent: -30px;
    font-family: 'themify';
    content: "\e64b";
    position: absolute;
    font-size: 14px;
    color: #4d4d4d;
    pointer-events: none;
}

    .ui-datepicker table {
        width: 100%;
        font-size: 1em;
        margin: 0 0 5px;
        border-collapse: collapse
    }

    .ui-datepicker th {
        padding: .5em .3em;
        text-align: center;
        font-weight: 700;
        border: 0
    }

    .ui-datepicker td {
        border: 0;
        padding: 2px 5px
    }

        .ui-datepicker td a, .ui-datepicker td span {
            color: #555;
            padding: .35em .25em;
            display: block;
            text-align: center;
            text-decoration: none;
            border-radius: 0;
        }

            .ui-datepicker td a:hover, .ui-datepicker td span:hover {
                background-color: #ab8ce4 !important;
                color: #fff !important;
            }

    .ui-datepicker .ui-state-disabled span:hover {
        background: 0 0
    }

.ui-datepicker .ui-state-active, .ui-datepicker .ui-state-highlight, .ui-datepicker-today a, .ui-datepicker-today a:hover {
    font-weight: 600;
    color: #fff;
    background-color: #CCC !important
}

.ui-datepicker .ui-state-active {
    background-color: #ab8ce4 !important
}

.ui-datepicker-buttonpane {
    border-top: 1px solid #DDD;
    padding: 10px;
    background: #f8f8f8
}

    .ui-datepicker-buttonpane button {
        padding: 5px 12px;
        margin-right: 10px;
        font-size: 13px;
        position: relative;
        line-height: normal;
        display: inline-block;
        -webkit-user-drag: none;
        text-shadow: 0 1px rgba(255,255,255,.2);
        vertical-align: middle;
        background: #FFF;
        text-align: center;
        overflow: visible;
        cursor: pointer;
        color: #333;
        border: 1px solid #ddd;
        -webkit-border-radius: 0;
        border-radius: 0;
    }

        .ui-datepicker-buttonpane button:hover {
            color: #243140;
            background: #f2f2f2
        }

        .ui-datepicker-buttonpane button:active {
            color: #1d2938;
            background: #f0f0f0;
            border-color: #CCC
        }

.ui-monthpicker .ui-datepicker-header {
    margin-bottom: 3px
}

.ui-datepicker-inline {
    width: 100%
}

.ui-datepicker-inline, .ui-datetimepicker-inline, .ui-timepicker-inline {
    box-shadow: none;
    margin: 0 auto
}

.hasMonthpicker .ui-datepicker td {
    width: 25%;
    padding: 10px 8px
}

.cal-widget .ui-datepicker {
    width: 100%;
    margin-top: 0
}

    .cal-widget .ui-datepicker:before {
        display: none
    }

.ui-datepicker.ui-datepicker-multi {
    width: auto
}

.ui-datepicker-multi .ui-datepicker-group {
    float: left
}

    .ui-datepicker-multi .ui-datepicker-group table {
        width: 95%;
        margin: 0 auto .4em
    }

.ui-datepicker-multi-2 .ui-datepicker-group {
    width: 50%
}

.ui-datepicker-multi-3 .ui-datepicker-group {
    width: 33.333%
}

.ui-datepicker-multi-4 .ui-datepicker-group {
    width: 25%
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
    border-left-width: 0
}

.ui-datepicker-multi .ui-datepicker-buttonpane {
    clear: left
}

.ui-datepicker-row-break {
    clear: both;
    width: 100%;
    font-size: 0
}

.ui-timepicker-div .ui-widget-header {
    position: relative;
    background: #F5F5F5;
    line-height: 27px;
    font-size: 15px;
    padding: 10px;
    border-bottom: 1px solid #E5E5E5
}

.ui-timepicker-div dl {
    text-align: left;
    padding: 15px 10px;
    margin: 0
}

    .ui-timepicker-div dl dt {
        float: left;
        clear: left;
        padding: 0 0 0 5px
    }

    .ui-timepicker-div dl dd {
        margin: 0 10px 20px 40%
    }

    .ui-timepicker-div dl .ui_tpicker_hour, .ui-timepicker-div dl .ui_tpicker_millisec, .ui-timepicker-div dl .ui_tpicker_minute, .ui-timepicker-div dl .ui_tpicker_second {
        background: #E5E5E5;
        position: relative;
        top: 6px
    }

.ui-timepicker-div td {
    font-size: 90%
}

.ui-tpicker-grid-label {
    background: 0 0;
    border: none;
    margin: 0;
    padding: 0
}

.ui-timepicker-rtl {
    direction: rtl
}

    .ui-timepicker-rtl dl {
        text-align: right;
        padding: 0 5px 0 0
    }

        .ui-timepicker-rtl dl dt {
            float: right;
            clear: right
        }

        .ui-timepicker-rtl dl dd {
            margin: 0 40% 10px 10px
        }








/* Notifications */

ul.notification-dropdown.onhover-show-div li .notification-icon {
    border-radius: 0;
}

ul.notification-dropdown.onhover-show-div li .notification-icon::before {
    top: -1px;
}




/* ckeditor custom look */

body[main-theme-layout="main-theme-layout-2"] .cke,
body[main-theme-layout="main-theme-layout-3"] .cke,
body[main-theme-layout="main-theme-layout-4"] .cke {
    border: 1px solid #4b5469 !important;
}

.cke_source {
    font-family: Poppins !important;
    font-size: 16px !important;
}

body[main-theme-layout="main-theme-layout-2"] .cke_source,
body[main-theme-layout="main-theme-layout-3"] .cke_source,
body[main-theme-layout="main-theme-layout-4"] .cke_source {
    color: rgba(255, 255, 255, 0.7) !important;
    background-color: #303841 !important;
}

body[main-theme-layout="main-theme-layout-2"] .cke_top,
body[main-theme-layout="main-theme-layout-3"] .cke_top,
body[main-theme-layout="main-theme-layout-4"] .cke_top {
    border-bottom: 1px solid #4b5469 !important;
    background-color: #ccc !important;
}

body[main-theme-layout="main-theme-layout-2"] .cke_bottom,
body[main-theme-layout="main-theme-layout-3"] .cke_bottom,
body[main-theme-layout="main-theme-layout-4"] .cke_bottom {
    border-top: 1px solid #4b5469 !important;
    background-color: #434f5a !important;
    padding-bottom: 5px;
    padding-top: 10px;
}

body[main-theme-layout="main-theme-layout-2"] a.cke_path_item,
body[main-theme-layout="main-theme-layout-3"] a.cke_path_item,
body[main-theme-layout="main-theme-layout-4"] a.cke_path_item,
body[main-theme-layout="main-theme-layout-2"] span.cke_path_empty,
body[main-theme-layout="main-theme-layout-3"] span.cke_path_empty,
body[main-theme-layout="main-theme-layout-4"] span.cke_path_empty {
    color: rgba(255, 255, 255, 0.7) !important;
}

    body[main-theme-layout="main-theme-layout-2"] a.cke_path_item:hover,
    body[main-theme-layout="main-theme-layout-3"] a.cke_path_item:hover,
    body[main-theme-layout="main-theme-layout-4"] a.cke_path_item:hover {
        background-color: #303841 !important;
    }




/* User Settings */

.main-color {
    display: block;
    width: 50px;
    height: 50px;
    border: 1px solid #4b5469;
    margin-left: 10px;
    margin-right: 10px;
    display: inline-block;
    text-align: center;
    margin-bottom: 15px;
    position: relative;
    background-color: #ab8ce4;
}

.main-color:first-child {
    margin-left: 0px;
}

.main-color-default {
    background-color: #55b3f3;
}

.main-color-lightblue {
    background-color: #00B9E4;
}

.main-color-blue {
    background-color: #5698e4;
}

.main-color-darkblue {
    background-color: #3d8ae3;
}

.main-color-teal {
    background-color: #3CB6CE;
}



/* Dashboard */

.gly-rotate-90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    display: inline-block !important;
}

.gly-rotate-90:before {
    top: -3px !important;
    left: 1px !important;
}




/* Dispatch */

.scheduler {
    display: flex;
    background-color: #fafafa;
    position: relative;
}

body[main-theme-layout="main-theme-layout-2"] .scheduler,
body[main-theme-layout="main-theme-layout-3"] .scheduler,
body[main-theme-layout="main-theme-layout-4"] .scheduler {
    background-color: #303841;
}

.scheduler .task-panel {
    float: left;
    border: 1px solid #e2e2e2;
    height: 450px;
    font-size: 0.9em;
}

    .scheduler .task-panel.left-side {
        width: 180px;
        border-right: none !important;
        padding: 7px 4px 4px 4px;
        position: absolute;
        left: 0px;
    }

    .scheduler .task-panel.right-side {
        width: 100%;
        overflow: auto;
        padding: 9px 4px 4px 4px;
        white-space: nowrap;
        margin-left: 180px;
    }

body[main-theme-layout="main-theme-layout-2"] .scheduler .task-panel,
body[main-theme-layout="main-theme-layout-3"] .scheduler .task-panel,
body[main-theme-layout="main-theme-layout-4"] .scheduler .task-panel {
    border: 1px solid #4b5469;
}

.scheduler .connectedSortable {
    border: 1px solid #dddddd;
    width: 150px;
    min-height: 243px;
    list-style-type: none;
    margin: 0;
    padding: 5px 0 0 0;
    float: left;
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    margin-bottom: 5px;
    background-color: #ffffff;
}

.scheduler #unassigned {
    min-width: 171px;
    width: 100%;
    height: 412px;
    overflow-y: auto;
    /*margin-bottom: 4px;*/
}

body[main-theme-layout="main-theme-layout-2"] .scheduler .connectedSortable,
body[main-theme-layout="main-theme-layout-3"] .scheduler .connectedSortable,
body[main-theme-layout="main-theme-layout-4"] .scheduler .connectedSortable {
    border: 1px solid #4b5469;
    background-color: #36404a;
}

.scheduler li {
    margin: 0 5px 5px 5px !important;
    padding: 6px;
    font-size: 0.9em;
    /*font-family: Open Sans;*/
    white-space: normal;
    cursor: pointer;
    list-style: none;
}

.scheduler li i {
    font-size: 1.3em;
}

.alert-empty {
    background-color: #eeeeee;
    border-color: rgba(228, 228, 228, 0.9);
}

body[main-theme-layout="main-theme-layout-2"] .alert-empty,
body[main-theme-layout="main-theme-layout-3"] .alert-empty,
body[main-theme-layout="main-theme-layout-4"] .alert-empty {
    background-color: #434f5a;
    border-color: rgba(67, 79, 90, 0.9);
}

.alert-success .font-success, .alert-success .font-primary,
.alert-danger .font-success, .alert-danger .font-primary,
.alert-primary .font-success, .alert-primary .font-primary {
    color: #ffffff !important;
}

.scheduler .alert-danger .desc {
    text-decoration: line-through;
}

.scheduler #unassigned .alert {
    background-color: #fafafa;
    border-color: rgba(238, 238, 238, 0.9);
}

body[main-theme-layout="main-theme-layout-2"] .scheduler #unassigned .alert,
body[main-theme-layout="main-theme-layout-3"] .scheduler #unassigned .alert,
body[main-theme-layout="main-theme-layout-4"] .scheduler #unassigned .alert {
    background-color: transparent;
    border-color: rgba(75, 84, 105, 0.9);
}

.scheduler .task-panel.right-side .ui-draggable-helper {
    background-color: transparent !important;
}



.scheduler .alert .icon-info-alt {
    position: absolute;
    top: 1px;
    right: 2px;
    opacity: 0;
    font-size: 13px;
    cursor: auto;
}

.scheduler .alert:hover .icon-info-alt {
    opacity: 1;
    transition: opacity 0.3s ease-in;
    -moz-transition: opacity 0.3s ease-in;
    -webkit-transition: opacity 0.3s ease-in;
}

.qtip {
    min-width: 220px;
    max-width: 380px !important;
}

.qtip-default {
    background-color: #303841 !important;
    color: #ffffff !important;
    padding: 4px 0;
    border: 1px solid #4b5469 !important;
}

.tasktip {
    display: none;
}


.tip-wrapper {
    color: #f5f5f5;
    font-size: 12px;
    line-height: 12px;
    width: auto !important;
    font-family: 'Open Sans';
}

    .tip-wrapper h3 {
        font-size: 16px;
        font-weight: 600;
        padding-bottom: 8px;
        border-bottom: 1px solid #f5f5f5;
        color: #f5f5f5;
        margin: 0px;
        margin-bottom: 4px;
        padding-left: 6px;
    }

        .tip-wrapper h3 i {
            padding-right: 8px;
        }

    .tip-wrapper .view {
        font-size: 1.2em !important;
        display: block;
        position: absolute;
        top: 6px;
        right: 10px;
    }

.tip-body {
    padding: 5px 5px 5px 5px !important;
}

    .tip-body .form-group {
        margin-bottom: 1rem;
    }

        .tip-body .form-group.last {
            margin-bottom: 0;
        }

    .tip-body label {
        font-weight: 600;
        margin-bottom: 0.3rem;
    }

    .tip-body .data {
        font-size: 0.9em;
    }





.dropzone {
    border-color: #ab8ce4 !important;
}

    .dropzone i {
        color: #ab8ce4 !important;
    }





/* File Upload */

body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .custom-select,
body[main-theme-layout="main-theme-layout-2"] .page-wrapper .page-body-wrapper .custom-file-label,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .custom-select,
body[main-theme-layout="main-theme-layout-3"] .page-wrapper .page-body-wrapper .custom-file-label,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .custom-select,
body[main-theme-layout="main-theme-layout-4"] .page-wrapper .page-body-wrapper .custom-file-label {
    border-color: #4b5469;
}

.custom-file-label {
    border-radius: 0;
    font-weight: 400 !important;
}

    .custom-file-label::after {
        border-radius: 0;
        font-weight: 500 !important;
        background-color: #6da4e3;
        border-left: none;
        color: #f5f5f5;
    }

.custom-file-input {
    cursor: pointer;
}


/* Documents */

.ItemBox {
    float: left;
    text-align: center;
    width: 140px;
    min-height: 120px;
    padding: 5px;
    margin: 10px;
    position: relative;
}

.DocumentItem, .DocumentItem:hover {
    text-decoration: none;
}

    .DocumentItem div, .DocumentItem:hover div {
        font-size: 0.85em;
        font-weight: 600;
        margin-top: 6px;
        line-height: 1.1em;
    }

    .DocumentItem div {
        color: #333333 !important;
    }

body[main-theme-layout="main-theme-layout-2"] .DocumentItem div,
body[main-theme-layout="main-theme-layout-3"] .DocumentItem div,
body[main-theme-layout="main-theme-layout-4"] .DocumentItem div {
    color: rgba(255, 255, 255, 0.7) !important;
}

.DocumentItem div.desc, .DocumentItem:hover div.desc {
    font-size: 0.7em;
    margin-top: 3px;
}

/*
.ItemBox .FolderOptions {
    position: absolute;
    top: -8px;
    right: 20px;
    font-size: 1.2em;
}
*/




/* Accordian */

.default-according .card .card-header {
    padding: 0.5rem 0.75rem;
}

.default-according .accord-btn {
    width: 100%;
    text-align: left;
    padding-left: 1rem;
    padding-right: 1rem;
}

.default-according .collapse:not(.show) {
    border-bottom: none;
}

.default-according.style-1 div[aria-expanded="false"]::before {
    content: "\f107";
    font-family: FontAwesome;
    right: 20px;
    position: absolute;
}

.default-according.style-1 div[aria-expanded="true"]::before {
    content: "\f106";
    font-family: FontAwesome;
    right: 20px;
    position: absolute;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.checkbox-list {
    margin-left: 5px;
    margin-top: 5px;
}

.checkbox-list label {
    min-width: 150px;
    padding-right: 25px;
}





/* Fix the switch check mark location for switches */

.icon-state .switch {
    width: 62px;
    height: 36px;
}

.icon-state .switch-state::before {
    left: 3px;
    /*bottom: 4px !important;*/
    height: 28px;
    width: 28px;
}

.icon-state .switch-state::after {
    /*top: 10px;*/
    /*left: 9px;*/
}

.icon-state input:checked + .switch-state::after {
    left: 37px;
}



.switch-outline .switch-state {
    border: 1px solid #ced4da !important;
}

body[main-theme-layout="main-theme-layout-2"] .switch-outline .switch-state,
body[main-theme-layout="main-theme-layout-3"] .switch-outline .switch-state,
body[main-theme-layout="main-theme-layout-4"] .switch-outline .switch-state {
    background-color: #303841 !important;
    border: 1px solid #4b5469 !important;
}



body[main-theme-layout="main-theme-layout-2"] .switch-outline .switch input:checked + .switch-state.bg-primary,
body[main-theme-layout="main-theme-layout-2"] .switch-outline .switch input:checked + .switch-state.bg-success,
body[main-theme-layout="main-theme-layout-3"] .switch-outline .switch input:checked + .switch-state.bg-primary,
body[main-theme-layout="main-theme-layout-3"] .switch-outline .switch input:checked + .switch-state.bg-success,
body[main-theme-layout="main-theme-layout-4"] .switch-outline .switch input:checked + .switch-state.bg-primary,
body[main-theme-layout="main-theme-layout-4"] .switch-outline .switch input:checked + .switch-state.bg-success {
    background-color: #303841 !important;
}








/* drag and drop rows */

.dragselect {
    background-color: #f2f2f2 !important;
    border-color: #cecece !important;
}

body[main-theme-layout="main-theme-layout-2"] .dragselect,
body[main-theme-layout="main-theme-layout-3"] .dragselect,
body[main-theme-layout="main-theme-layout-4"] .dragselect {
    background-color: #2d343b !important;
    border-color: #4b5469 !important;
}

.ui-sortable-helper {
    display: table;
}






/* view buttons on documents screen */

.nav-view {
    text-align: left;
    margin-right: 20px;
    z-index: 1;
    margin-bottom: 20px;
}

    .nav-view .nav-link {
        font-size: 22px !important;
        padding: 4px 0px 2px 10px;
        border: 1px solid #dddddd;
        color: rgba(51, 51, 51, 0.3) !important;
        background-color: #fafafa !important;
        margin-right: 6px;
    }

body[main-theme-layout="main-theme-layout-2"] .nav-view .nav-link,
body[main-theme-layout="main-theme-layout-3"] .nav-view .nav-link,
body[main-theme-layout="main-theme-layout-4"] .nav-view .nav-link {
    border: 1px solid #4b5469;
    color: rgba(255, 255, 255, 0.3) !important;
    background-color: #303841 !important;
}

.nav-view .nav-link.active {
    color: rgba(51, 51, 51, 0.7) !important;
    background-color: #f5f5f5 !important;
}

body[main-theme-layout="main-theme-layout-2"] .nav-view .nav-link.active,
body[main-theme-layout="main-theme-layout-3"] .nav-view .nav-link.active,
body[main-theme-layout="main-theme-layout-4"] .nav-view .nav-link.active {
    color: rgba(255, 255, 255, 0.7) !important;
    background-color: #434f5a !important;
}