.login-page,
.register-page {
    background: #f2edf3;
}

.login-box .login-logo img.brand-image {
    height: 100px;
    width: auto;
}
.active_bar {
    background-color: #6ba5b3;
}
.sidebar-mini.layout-fixed.layout-footer-fixed .brand-link .brand-image {
    margin: 0;
}

.alert.alert-dismissable ul.list-group li.list-group-item {
    background-color: transparent;
}

.alert.alert-dismissable a.close {
    text-decoration: none;
}

.hide {
    display: none;
}

.datatable-filter .select2.select2-container {
    display: inline-block !important;
}

.form-control,
.form-control-sm {
    background: #ffffff 0 0 no-repeat padding-box;
    border: 1px solid #ebedf2;
    border-radius: 1px;
    font-size: 0.875rem !important;
    padding: 0.5rem 0.5rem !important;
    height: calc(2.5rem + 2px) !important;
}

.input-group-text {
    border: 1px solid #ebedf2;
    border-radius: 1px;
}

.datatable-filter .filter-user-role {
    width: 150px;
    display: inline-block !important;
}

.select2-container--bootstrap4 .select2-selection {
    font-size: 0.875rem !important;
}

.select2-container--bootstrap4 .select2-selection--single {
    height: calc(1.5em + 0.75rem + -1px) !important;
    border: 1px solid #15151833;
    border-radius: 2px;
}

.nav-sidebar .nav-header:not(:first-of-type) {
    padding: 1rem 1rem 0.5rem !important;
}

div.dataTables_wrapper div.dataTables_filter input,
select.select2bs4 {
    width: 170px;
}

.material-icons {
    font-family: "Material Icons";
    font-weight: normal;
    font-style: normal;
    font-size: 24px; /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;

    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;

    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;

    /* Support for IE. */
    font-feature-settings: "liga";
    vertical-align: text-top;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
    min-height: 140px !important;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header i {
    margin-top: 10px;
    font-size: 50px;
}

.dtb-actions {
    min-width: 100px;
    float: left;
}

body {
    font-family: "Montserrat", sans-serif !important;
    font-size: 0.875rem !important;
}

.card-title,
label:not(.form-check-label):not(.custom-file-label) {
    font-weight: 500 !important;
}

label,
label:not(.form-check-label):not(.custom-file-label) {
    /*font-size: .875rem !important;*/
    font-weight: 400 !important;
}

.list-none {
    list-style: none !important;
}

/*.form-control {
    height: calc(1.8125rem + 2px);
}*/

.btn,
.btn.focus,
.btn:focus {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important;
}

.input-group-sm > .custom-select,
.input-group-sm > .form-control:not(textarea),
.select2-container--bootstrap4 .select2-selection--single {
    height: calc(2.5rem + 2px) !important;
}

.select2-container--bootstrap4
    .select2-selection--single
    .select2-selection__rendered {
    line-height: calc(2.25rem + 2px) !important;
}

.custom-select {
    box-shadow: none;
}

.loader-wrapper {
    margin: 0;
    padding: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 99999;
}

.loader-wrapper .loader {
    position: absolute;
    top: calc(50% - 85px);
    left: calc(50% - 125px);
    text-align: center;
    width: 300px;
    height: auto;
}

.loader-wrapper .loader .box {
    border: none;
    margin: 0;
    padding: 25px 0;
}

.box {
    position: relative;
    border-radius: 3px;
    background: #ffffff;
    border-top: 3px solid #d2d6de;
    margin-bottom: 20px;
    width: 100%;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px;
}

.loader-wrapper .loader span {
    width: 100%;
    text-align: center;
    font-size: 16px;
    color: #000;
    display: block;
}

.loader-wrapper .loader img {
    margin-bottom: 15px;
}

.btn > i.material-icons {
    font-size: 1rem;
    line-height: 1;
}

.btn-xs {
    padding: 2px 3px;
}

.btn-xs > i.material-icons {
    font-size: 13px !important;
    line-height: 1;
    vertical-align: sub;
}

/* gradient buttons */
.btn-gradient-primary {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#da8cff),
        to(#9a55ff)
    );
    background: linear-gradient(to right, #da8cff, #9a55ff);

    /*background: -webkit-gradient(linear, left top, right top, from(#68b6e2), to(#2195d8));*/
    /*background: linear-gradient(to right, #68b6e2, #2195d8);*/
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-primary:not([disabled]):not(.disabled):active,
.btn-gradient-primary:not([disabled]):not(.disabled).active,
.show > .btn-gradient-primary.dropdown-toggle {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#da8cff),
        to(#9a55ff)
    );
    background: linear-gradient(to right, #da8cff, #9a55ff);
}

.btn-gradient-primary:hover {
    opacity: 0.8;
}

.btn-gradient-primary:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-primary:not(.btn-gradient-light):hover,
.btn-gradient-primary:not(.btn-gradient-light):focus,
.btn-gradient-primary:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-secondary {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#e7ebf0),
        to(#868e96)
    );
    background: linear-gradient(to right, #e7ebf0, #868e96);
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-secondary:not([disabled]):not(.disabled):active,
.btn-gradient-secondary:not([disabled]):not(.disabled).active,
.show > .btn-gradient-secondary.dropdown-toggle {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#e7ebf0),
        to(#868e96)
    );
    background: linear-gradient(to right, #e7ebf0, #868e96);
}

.btn-gradient-secondary:hover {
    opacity: 0.8;
}

.btn-gradient-secondary:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-secondary:not(.btn-gradient-light):hover,
.btn-gradient-secondary:not(.btn-gradient-light):focus,
.btn-gradient-secondary:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-success {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#84d9d2),
        to(#07cdae)
    );
    background: linear-gradient(to right, #84d9d2, #07cdae);
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-success:not([disabled]):not(.disabled):active,
.btn-gradient-success:not([disabled]):not(.disabled).active,
.show > .btn-gradient-success.dropdown-toggle {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#84d9d2),
        to(#07cdae)
    );
    background: linear-gradient(to right, #84d9d2, #07cdae);
}

.btn-gradient-success:hover {
    opacity: 0.8;
}

.btn-gradient-success:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-success:not(.btn-gradient-light):hover,
.btn-gradient-success:not(.btn-gradient-light):focus,
.btn-gradient-success:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-info {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#5ab3e6),
        color-stop(99%, #047edf)
    );
    background: linear-gradient(to right, #5ab3e6, #047edf 99%);
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-info:not([disabled]):not(.disabled):active,
.btn-gradient-info:not([disabled]):not(.disabled).active,
.show > .btn-gradient-info.dropdown-toggle {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#5ab3e6),
        color-stop(99%, #047edf)
    );
    background: linear-gradient(to right, #5ab3e6, #047edf 99%);
}

.btn-gradient-info:hover {
    opacity: 0.8;
}

.btn-gradient-info:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-info:not(.btn-gradient-light):hover,
.btn-gradient-info:not(.btn-gradient-light):focus,
.btn-gradient-info:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-warning {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#f6e384),
        to(#ffd500)
    );
    background: linear-gradient(to right, #f6e384, #ffd500);
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-warning:not([disabled]):not(.disabled):active,
.btn-gradient-warning:not([disabled]):not(.disabled).active,
.show > .btn-gradient-warning.dropdown-toggle {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#f6e384),
        to(#ffd500)
    );
    background: linear-gradient(to right, #f6e384, #ffd500);
}

.btn-gradient-warning:hover {
    opacity: 0.8;
}

.btn-gradient-warning:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-warning:not(.btn-gradient-light):hover,
.btn-gradient-warning:not(.btn-gradient-light):focus,
.btn-gradient-warning:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-danger {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#ffbf96),
        to(#fe7096)
    );
    background: linear-gradient(to right, #ffbf96, #fe7096);
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-danger:not([disabled]):not(.disabled):active,
.btn-gradient-danger:not([disabled]):not(.disabled).active,
.show > .btn-gradient-danger.dropdown-toggle {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#ffbf96),
        to(#fe7096)
    );
    background: linear-gradient(to right, #ffbf96, #fe7096);
}

.btn-gradient-danger:hover {
    opacity: 0.8;
}

.btn-gradient-danger:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-danger:not(.btn-gradient-light):hover,
.btn-gradient-danger:not(.btn-gradient-light):focus,
.btn-gradient-danger:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-light {
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#f4f4f4),
        to(#e4e4e9)
    );
    background: linear-gradient(to bottom, #f4f4f4, #e4e4e9);
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-light:not([disabled]):not(.disabled):active,
.btn-gradient-light:not([disabled]):not(.disabled).active,
.show > .btn-gradient-light.dropdown-toggle {
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#f4f4f4),
        to(#e4e4e9)
    );
    background: linear-gradient(to bottom, #f4f4f4, #e4e4e9);
}

.btn-gradient-light:hover {
    opacity: 0.8;
}

.btn-gradient-light:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-light:not(.btn-gradient-light):hover,
.btn-gradient-light:not(.btn-gradient-light):focus,
.btn-gradient-light:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-dark {
    background: linear-gradient(89deg, #5e7188, #3e4b5b);
    border: 0;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.btn-gradient-dark:not([disabled]):not(.disabled):active,
.btn-gradient-dark:not([disabled]):not(.disabled).active,
.show > .btn-gradient-dark.dropdown-toggle {
    background: linear-gradient(89deg, #5e7188, #3e4b5b);
}

.btn-gradient-dark:hover {
    opacity: 0.8;
}

.btn-gradient-dark:not(.btn-gradient-light) {
    color: #ffffff;
}

.btn-gradient-dark:not(.btn-gradient-light):hover,
.btn-gradient-dark:not(.btn-gradient-light):focus,
.btn-gradient-dark:not(.btn-gradient-light):active {
    color: #ffffff;
}

.btn-gradient-primary i,
.btn-gradient-secondary i,
.btn-gradient-success i,
.btn-gradient-warning i,
.btn-gradient-info i,
.btn-gradient-danger i {
    color: #000 !important;
}

.action-btn {
    padding: 0.1rem 0.4rem !important;
}

.not-round {
    border-radius: 0;
}

.login-box,
.register-box {
    width: 380px;
}

.login-box-msg,
.register-box-msg {
    padding: 0;
    text-align: left;
    margin-bottom: 20px;
}

a:hover {
    color: #0056b3;
    text-decoration: none;
}

a {
    color: #0981e0;
    text-decoration: none;
}

.login-page .btn {
    height: 50px;
    line-height: 1.5;
    border-radius: 0;
}

.login-page .page-title {
    text-align: center;
}

.content-wrapper {
    background: #f2edf3;
}

.main-header,
[class*="sidebar-light"] .brand-link {
    /*border-bottom: none;*/
}

body {
    color: #343a40;
}

.nav-sidebar > .nav-item .nav-icon {
    font-size: 1rem;
}

/*color: #bba8bff5;*/

/* gradient buttons */
.btn {
    border-radius: 0.25rem !important;
}
.bg-gradient-primary {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#da8cff),
        to(#9a55ff)
    ) !important;
    background: linear-gradient(to right, #da8cff, #9a55ff) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #343a40 !important;
}

.bg-gradient-secondary {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#e7ebf0),
        to(#868e96)
    ) !important;
    background: linear-gradient(to right, #e7ebf0, #868e96) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #ffffff;
}

.bg-gradient-success {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#84d9d2),
        to(#07cdae)
    ) !important;
    background: linear-gradient(to right, #84d9d2, #07cdae) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #343a40 !important;
}

.bg-gradient-info {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#5ab3e6),
        color-stop(99%, #047edf)
    ) !important;
    background: linear-gradient(to right, #5ab3e6, #047edf 99%) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #ffffff !important;
}

.bg-gradient-warning {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#f6e384),
        to(#ffd500)
    ) !important;
    background: linear-gradient(to right, #f6e384, #ffd500) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #343a40 !important;
}

.bg-gradient-danger {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#ffbf96),
        to(#fe7096)
    ) !important;
    background: linear-gradient(to right, #ffbf96, #fe7096) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #343a40 !important;
}

.bg-gradient-light {
    background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(#f4f4f4),
        to(#e4e4e9)
    ) !important;
    background: linear-gradient(to bottom, #f4f4f4, #e4e4e9) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #343a40 !important;
}

.bg-gradient-dark {
    background: linear-gradient(89deg, #5e7188, #3e4b5b) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #ffffff !important;
}

.content-header,
.content-wrapper > .content,
.navbar,
.brand-link {
    padding: 15px 15px;
}
.content-header,
.content-wrapper > .content {
    padding-bottom: 0;
}
.brand-link {
    padding: 20px 15px;
}
.page-title .page-title-icon {
    display: inline-block;
    padding: 1px 5px;
    border-radius: 4px;
    text-align: center;
    -webkit-box-shadow: 0px 3px 8.3px 0.7px rgba(163, 93, 255, 0.35);
    box-shadow: 0px 3px 8.3px 0.7px rgba(163, 93, 255, 0.35);
}

.card.card-img-holder .card-img-absolute {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
}

.card-primary.card-outline {
    border-top: 3px solid #047edf;
}

.layout-fixed .wrapper .sidebar {
    margin-top: 5px;
}

.small-box > .small-box-footer {
    margin-top: 45px;
}

.small-box-footer i.material-icons {
    font-size: 18px;
}

.card-info:not(.card-outline) > .card-header {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#5ab3e6),
        color-stop(99%, #047edf)
    ) !important;
    background: linear-gradient(to right, #5ab3e6, #047edf 99%) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #ffffff !important;
}

.card-info.card-outline {
    border-top: 3px solid #047edf;
}
.material-icons:hover {
    transform: scale(1.3) rotate(8deg) !important;
}

.card-danger:not(.card-outline) > .card-header {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#ffbf96),
        to(#fe7096)
    ) !important;
    background: linear-gradient(to right, #ffbf96, #fe7096) !important;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    color: #ffffff !important;
}

.card-danger.card-outline {
    border-top: 3px solid #fe7096;
}

.page-item.active .page-link {
    border-color: #5ab3e6;
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(#5ab3e6),
        color-stop(99%, #047edf)
    ) !important;
    background: linear-gradient(to right, #5ab3e6, #047edf 99%) !important;
}

.font-color-white,
.font-color-white i {
    color: white !important;
}

.btn-back {
    background-color: #6ba5b3;
}

.background {
    background-color: #374d6c !important;
}

.navbar-nav > .user-menu > .dropdown-menu {
    width: 300px;
}
.box-class1 {
    background: #3d5577;
    color: white;
    font-weight: 600;
    border-radius: 15px;
}

.box-class2 {
    background: #58d5da;
    color: white;
    font-weight: 600;
    border-radius: 15px;
}

.box-class3 {
    background: #f56b57;
    color: white;
    font-weight: 600;
    border-radius: 15px;
}

.box-class4 {
    background: #6ba5b3;
    color: white;
    font-weight: 600;
    border-radius: 15px;
}
.card-secondary {
    box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2),
        0px 20px 31px 3px rgba(0, 0, 0, 0.14),
        0px 8px 38px 7px rgba(0, 0, 0, 0.12) !important;
}

.btn {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition-duration: 0.6s;
    transition-duration: 5s;
    -webkit-transition-property: box-shadow;
    transition-property: box-shadow;
}
/*.btn:hover, .btn:focus, .btn:active {*/
/*    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);*/
/*    -webkit-transform: scale(1.1);*/
/*    transform: scale(1.1);*/
/*    transition-duration: 5s;*/
/*}*/