body {/*background-color: #360c6de3;*/ /*background: linear-gradient(122deg, rgb(128 72 200) 20%, rgb(179 142 227) 45%);*/ /*background: linear-gradient(73deg,#b173e6,#815ad5);*/ position: relative; margin: 0; padding: 0 100px;}
body:after {content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-image: url('../images/login-bg5.webp') !important; background-size: cover; z-index: -1; opacity: 1;}

[data-layout=horizontal] .topbar .brand {background-color: #230649;}
[data-layout=horizontal] .topbar .brand .logo .logo-sm {height: 80px; padding: 7px 0;}
.navigation-menu>li a {line-height: 70px;}
.navbar-custom .topbar-nav {height: 78px;}
.dropdown-menu {margin-top: 22px !important;}
[data-layout=horizontal] .page-wrapper {padding-top: 92px;}
.nav.nav-tabs .nav-item.show, .nav.nav-tabs .nav-link {color: #fff;}

/*/NAV/*/
[data-layout=horizontal] .topbar {background-color: #230649; border-bottom: 1px solid #eceff5a8;}
.navbar-custom {background-color: transparent;}
.topbar .navigation-menu>li>a, .navigation-menu>li a .menu-icon, .navbar-custom .nav-link {color: #dee4ee;}

.watchlist-body {height: auto;}
.card {height: calc(100% - 16px);}

.card .card-header {background-color: #fff9e5; background-image: linear-gradient(73deg, #1d3d76, #eb8089);}
.card-title {font-size: 15px; color: #fff; padding: 4px 0;}
.toolbar button {color: #fff;}

.mobileDropDown {height: calc(100vh - 110px); width: 250px; overflow-y: auto;}
.mobileDropDown a {padding: 7px 15px;}
.mobile_dropdown {padding-bottom: 10px;}
.mobile_dropdown h6 {padding: 0 15px; margin-bottom: 5px; font-size: 12px; text-transform: uppercase; display: ;}
.mobile_dropdown h6 i {display: none;}
.mobile_dropdown div {padding-left: 10px;}
.brdbtm {border-bottom: 1px solid #ccc;}

/*/scrolar/*/
._scrollDx {overflow-y: auto;}
._scrollDx::-webkit-scrollbar{width: 6px; background-color: transparent;}
._scrollDx::-webkit-scrollbar,
._scrollDx::-webkit-scrollbar-thumb {overflow:visible;}
._scrollDx::-webkit-scrollbar-thumb {border-radius: 5px; background-color: transparent;}
/* MAGIC HAPPENS HERE */
._scrollDx:hover { -webkit-transition: all 0.5s;}
._scrollDx:hover::-webkit-scrollbar-thumb {background-color: #bbb; -webkit-transition: all 0.5s;}
._scrollDx:hover::-webkit-scrollbar {background-color: #ddd; -webkit-transition: all 0.5s;}


/*/Modal/*/
.modal-content {background-image: linear-gradient(73deg, #9940bb, #3634bb)}
.modal-content .modal-header {background-color: #fafbfb2b; border-bottom: 1px solid #eaf0f93c;}
.modal-content .modal-header .modal-title {color: #fff;}
.modal-header .btn-close {filter: invert(1);}

/*/Form/*/
.form-label {margin-bottom: 2px; color: #fff;}
.form-control, .form-control:disabled, .form-control[readonly] {background-color: #2d0b0b4a; color: #eee; border: 1px solid #e8ebf38c;}
.form-control:focus {background-color: #2d0b0b33; color: #fff;}
.form-control::placeholder {color: #333; display: none; font-size: 0;}

.btn-success {background-color: #230649; border: 1px solid #140238;}
.btn-success:hover {background-color: #0f0229; border: 1px solid #190345;}

.footer {border-top: 1px solid #eceff54f;}

table tr:nth-child(even) td {background-color: #f1f5fa;}
table tr:hover td {background-color: #e6edf8;}
.table tr:last-child th {white-space: nowrap;}

table.dataTable > tbody > tr:nth-child(even) td, .table-responsive .table thead th {background-color: #c17ced30;}
table.dataTable > tbody > tr:nth-child(odd) td {background-color: #4b3fc205;}
.table-responsive .table:not(caption)>*, .table-responsive .table thead th {
    border-color: #8073b0a6 !important;
}

div.dt-container .dt-paging .dt-paging-button {padding: 0.1em 0.7em 0.09em !important; font-size: 12px !important;}

.bgLogin {background-color: #021e45; border: none;}
.bgLogin .hr-dashed {opacity: 0.2;}

/*/FONT-SIZE/*/
.fs_10 {font-size: 10px !important;}
.fs_11 {font-size: 11px !important;}
.fs_12 {font-size: 12px !important;}
.fs_13 {font-size: 13px !important;}
.fs_14 {font-size: 14px !important;}
.fs_15 {font-size: 15px !important;}
.fs_16 {font-size: 16px !important;}
.fs_17 {font-size: 17px !important;}
.fs_18 {font-size: 18px !important;}
.fs_19 {font-size: 19px !important;}
.fs_20 {font-size: 20px !important;}
.fs_22 {font-size: 22px !important;}
.fs_24 {font-size: 24px !important;}
.fs_26 {font-size: 26px !important;}
.fs_28 {font-size: 28px !important;}
.fs_30 {font-size: 30px !important;}
.fs_32 {font-size: 32px !important;}
.fs_34 {font-size: 34px !important;}
.fs_36 {font-size: 36px !important;}
.fs_38 {font-size: 38px !important;}
.fs_40 {font-size: 40px !important;}

.fw_400 {font-weight: 400;}
.fw_500 {font-weight: 500;}
.fw_600 {font-weight: 600;}
.fw_700 {font-weight: 700;}
.fw_800 {font-weight: 800;}
.fw_900 {font-weight: 900;}

.clip_1 {-webkit-line-clamp: 1; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box;}
.clip_2 {-webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box;}
.clip_3 {-webkit-line-clamp: 3; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box;}
.clip_4 {-webkit-line-clamp: 4; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box;}
.clip_5 {-webkit-line-clamp: 5; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box;}
.clip_6 {-webkit-line-clamp: 6; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box;}
.clip_8 {-webkit-line-clamp: 8; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; display: -webkit-box;}

/*/Menu/*/
.navigation-menu li:nth-child(n+6) {display: none;}

/*........media-querries........*/
@media only screen and (max-width:991px) {
    body {padding: 0;}
    .noMobile {display: none;}
    #navigation {position: fixed; padding: 0; top: 53px; left: 0; width: 100%; height: calc(100vh - 52px); max-height: inherit; overflow-y: auto; background: linear-gradient(150deg, rgb(83 24 159) 20%, rgb(111 73 161) 45%);}
    .mobile_dropdown {padding-bottom: 0;}
    .mobile_dropdown h6 {color: #fff; margin: 0; padding: 15px 15px;}
    .mobile_dropdown h6 i {font-size: 10px; float: right; display: block; padding: 4px 0;}
    .mobile_dropdown div {display: none; background-color: #efe9df1c; padding: 0px 10px 12px;}

    .topbar .navigation-menu .nav-item .nav-link {padding: 12px 0 !important; border-bottom: 1px solid #eceff57a !important; line-height: 18px;}
    [data-layout=horizontal] .topbar .brand .logo .logo-sm {height: 48px;}
    .dropdown-menu.show {display: block; position: fixed !important; left: 0 !important; right: 0 !important; top: 52px !important; width: 100%; transform: inherit !important; height: calc(100vh - 52px); box-shadow: none !important; border: none; border-radius: 0; background-color: #e0deba; background: linear-gradient(150deg, rgb(83 24 159) 20%, rgb(111 73 161) 45%)}
    .dropdown-item {padding: 15px 15px !important; color: #fff;}
    .navbar-custom .topbar-nav {height: 52px;}
    .dropdown-menu {margin-top: 0 !important;}
}

@media only screen and (max-width:767px) {
    [data-layout=horizontal] .page-wrapper {padding-top: 62px;}
    div.dt-container div.dt-layout-row:not(.dt-layout-table) {display: flex !important;}
    .dt-layout-row {margin: 0 !important;}
}

@media only screen and (max-width:576px) {
    .page-wrapper .page-content-tab {padding: 0 !important;}
    .modal-dialog {max-width: inherit; width: 100%; height: 100vh; margin: 0;}
    .modal-content {height: 100%;}
}