body{
    background: #000000;
    font-family: Inter, sans-serif !important;
    }
.menu-bar{
    /* border-radius: 0px 0px 10px 10px; */
    z-index: 2;
    display: block;
    position: relative;
    }
.menu-bar > header{
    background-color: #ffffff;
    z-index: 1;
    -webkit-box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .3), 0 2px 6px 2px rgba(60, 64, 67, .15);
    box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .3), 0 2px 6px 2px rgba(60, 64, 67, .15);
    }
.logo > img{
    max-height: 30px;
    }
.smart-ul-holder {
    position: fixed;
    margin: auto;
    width: 100%;
    bottom: 0%;
    opacity: 0;
    left: 0px;
    right: 0px;
    height: min-content;
    border-top: 1px solid #e2e2e2;
    z-index: 1;
    transition: bottom 0.3s ease, opacity 0.3s ease;
    }
body.smart-ul-active .smart-ul-holder {
    bottom: 0px;
    opacity: 1;
    }
.smart-ul {
    position: relative;
    margin: auto;
    padding: 0px;
    list-style-type: none;
    z-index: 1;
    /* background-color:#8d0f16; */
    background-color:#ffffff;
    margin-left: calc(-.5* var(--bs-gutter-x));
    margin-right: calc(-.5* var(--bs-gutter-x));
    text-align: center;
    display: flex;
    }
.smart-ul > li{
    position: relative;
    padding: 0px;
    display: inline-block;
    flex: 1 1 auto;
    }
.smart-ul > li > a{
    position: relative;
    /* color: #ffffff;
    color: #690e13; */
    color: #363636;
    font-size: 15px;
    margin: auto;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    width: 100%;
    background: transparent;
    display: block;
    font-size: 12px;
    padding: 30px 10px 10px 10px;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    transition: all 300ms ease;
    }
.smart-ul > li > a.dropdown-toggle::after{
    display: none;
    }
.smart-ul > li > a > .title{
    white-space: nowrap;
    }
.smart-ul > li > a:active,
.smart-ul > li.active > a{
    /* background: #690e13;
    color: #ffffff; */
    background: #690e13;
    color: #ffffff;
    }
.smart-ul > li:not(.active) > a:focus,
.smart-ul > li:not(.active) > a:hover{
    background: #f3f0f0;
    color: #370306;
    }
.smart-ul > li > a > .icon,
.smart-ul > li > a > span.title{
    z-index: 1;
    }
.smart-ul > li > a > .icon{
    position: absolute;
    margin: auto;
    height: 15px;
    width: 15px;
    left: 0px;
    right: 0px;
    top: 10px;
    bottom: initial;
    }
.smart-ul .dropdown-menu{
    padding: 0px;
    }
.smart-ul .dropdown-menu > li{
    padding: 0px;
    position: relative;
    }
.smart-ul .dropdown-menu > li > a{
    position: relative;
    background: transparent;
    display: block;
    font-size: 12px;
    padding: 10px 10px 10px 30px;
    text-decoration: none;
    font-weight: 500;
    font-size: 13px;
    color: #690e13;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    transition: all 300ms ease;
    }
.smart-ul .dropdown-menu > li > a:active,
.smart-ul .dropdown-menu > li > a:focus,
.smart-ul .dropdown-menu > li > a:hover,
.smart-ul .dropdown-menu > li.active > a,
.smart-ul .dropdown-menu > li > a.active{
    background: #690e13;
    color: #ffffff;
    }
.smart-ul .dropdown-menu > li > a > .icon{
    position: absolute;
    margin: auto;
    width: 20px;
    padding: 0px 5px;
    left: 0px;
    top: 0px;
    bottom: 0px;
    }
.smart-ul .dropdown-menu > li > a > span.title{
    
    }
.lds-ellipsis {
    display: inline-block;
    width: 80px;
    height: 7px;
    position: absolute;
    margin: auto;
    right: 0px;
    top: 5px;
    bottom: 0px;
    }
.lds-ellipsis div {
    position: absolute;
    top: 2px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #fff;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
    }
.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
    }
.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
    }
.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
    }
.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
    }
@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
        }
    100% {
        transform: scale(1);
        }
    }
@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
        }
    100% {
        transform: scale(0);
        }
    }
@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
        }
    100% {
        transform: translate(24px, 0);
        }
    }
.loading-request{
    position: absolute;
    margin: auto;
    bottom: 56px;
    background: #3b3b3b;
    left: 0px;
    right: 0px;
    width: min-content;
    height: min-content;
    font-weight: 500;
    border-radius: 5px;
    color: #ffffff;
    z-index: 10000;
    }
.loading-request > div{
    padding: 10px 81px 10px 20px;
    position: relative;
    }
.balance-ul{
    position: relative;
    margin: auto;
    padding: 0px;
    list-style-type: none;
    z-index: 1;
    margin-left: calc(-.5* var(--bs-gutter-x));
    margin-right: calc(-.5* var(--bs-gutter-x));
    text-align: center;
    display: flex;
    }
.balance-ul > li{
    position: relative;
    padding: 0px;
    display: inline-block;
    flex: 1 1 auto;
    min-width: 50%;
    }
.balance-ul > li:not(:last-child):after{
    content: "";
    position: absolute;
    margin: auto;
    height: 90%;
    background-color: #c9acad;
    width: 1px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    }
.balance-ul > li > p.balance{
    position: relative;
    color: #363636;
    margin: auto;
    font-weight: 600;
    text-decoration: none;
    width: 100%;
    background: transparent;
    display: block;
    padding: 18px 10px;
    cursor: default;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    transition: all 300ms ease;
    }
.balance-ul > li > p.balance > span{
    display: block;
    margin: auto;
    text-align: left;
    position: relative;
    }
.balance-ul > li > p.balance > span > i{
    font-style: inherit;
    }
.balance-ul > li > p.balance > span.title,
.balance-ul > li > p.balance > span.current{
    text-align: center;
    }
.balance-ul > li > p.balance > span.title{
    white-space: nowrap;
    position: relative;
    font-weight: 500;
    color: #690e13;
    margin: auto;
    bottom: 0px;
    height: min-content;
    width: 100%;
    font-size: 16px;
    line-height: 16px;
    }
.balance-ul > li > p.balance > span.title > i{
    
    }
.balance-ul > li > p.balance > span.title > i:first-child{
    opacity: 0.8;
    }
.balance-ul > li > p.balance > span.title > i:last-child{
    opacity: 0.8;
    }
.balance-ul > li > p.balance:not(.cash) > span.title > i:last-child::before{
    content: "-";
    }
/* .balance-ul > li > p.balance > span.title > i:last-child::after{
    content: ")";
    } */
.balance-ul > li > p.balance > span.title > i:last-child::before,
.balance-ul > li > p.balance > span.title > i:last-child::after,
.balance-ul > li > p.balance > span.current > i:last-child::before,
.balance-ul > li > p.balance > span.current > i:last-child::after{
    color: #545454;
    }
.balance-ul > li > p.balance > span.current{
    white-space: nowrap;
    }
.balance-ul > li > p.balance > span.current > i:last-child,
.balance-ul > li > p.balance:not(.cash) > span.available > i:last-child{
    color: #7c7c7c;
    }
.balance-ul > li > p.balance:not(.cash) > span.available > i:first-child::after,
.balance-ul > li > p.balance:not(.cash) > span.current > i:first-child::after{
    content: "(";
    color: #7c7c7c;
    padding-left: 3px;
    }
.balance-ul > li > p.balance:not(.cash) > span.available > i:last-child::after,
.balance-ul > li > p.balance:not(.cash) > span.current > i:last-child::after{
    content: ")";
    }
.balance-ul > li > p.balance > span.tack > i:first-child::after{
    content: "Get:";
    }
.balance-ul > li > p.balance > span.tack > i:last-child::after{
    content: "Give:";
    }
.balance-ul > li > p.balance > span.available > i:first-child::before,
.balance-ul > li > p.balance > span.tack > i:last-child::after,
.balance-ul > li > p.balance > span.tack > i:first-child::after{
    font-size: 12px;
    padding-right: 5px;
    font-weight: 400;
    position: absolute;
    left: 0px;
    margin: auto;
    }
.balance-ul > li > p.balance > span.current > i{
    font-style: normal;
    line-height: normal;
    font-weight: 700;
    font-size: 11px;
    }
.balance-ul > li > p.balance > span.available > i,
.balance-ul > li > p.balance > span.tack > i{
    display: block;
    font-style: normal;
    line-height: normal;
    font-weight: 700;
    padding-left: 35px;
    text-align: right;
    font-size: 11px;
    }
.balance-ul > li > p.balance.cash > span.available > i:first-child::before,
.balance-ul > li > p.balance:not(.cash) > span.available::before{
    content: "Available:";
    font-size: 12px;
    padding-right: 5px;
    font-weight: 400;
    position: absolute;
    left: 0px;
    margin: auto;
    }
.balance-ul > li > p.balance:not(.cash) > span.available{
    white-space: nowrap;
    text-align: end;
    }
.balance-ul > li > p.balance:not(.cash) > span.available > i{
    display: inline-block;
    padding: 0px;
    }
.page-body{
    padding: 0px;
    position: relative;
    }
.page-body > .body-x{
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    transition: height 0.3s ease; /* Smooth animation for height changes */
    }
.page-body > .body-x:has(div.new-body) > div:nth-child(1){
    position: absolute;
    width: 100%;
    }
.tab-nav{
    background: #690e13;
    }
.tab-nav > ul > li > a{
    position: relative;
    color: #ffffff;
    padding: .8rem 1rem;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    }
.tab-nav > ul > li > a:hover,
.tab-nav > ul > li > a:focus,
.tab-nav > ul > li > a:active{
    color: #ffffff;
    }
.tab-nav > ul > li.active > a::after{
    content: " ";
    position: absolute;
    margin: auto;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: #ffffff;
    height: 2px;
    width: 90%;
    min-width: 30px;
    }
div:has(.page-404){
    height: 100%;
    position: relative;
    }
.page-404{
    margin: auto;
    position: absolute;
    height: min-content;
    top: 0px;
    bottom: 0px;
    text-align: center;
    font-weight: 500;
    color: #818181;
    }
.nav-search-bar{
    margin-top: 10px;
    }
.search-form{
    width: 100%;
    min-height: 50px;
    z-index: 1;
    display: block;
    padding-bottom: 10px;
    position: relative;
    }
.search-form > .search-holder{
    position: relative;
    margin: auto;
    border: 1px solid #690e13;
    border-radius: 8px;
    overflow: hidden;
    margin-left: 0px;
    position: absolute;
    width: 100%;
    background: #ffffff;
    z-index: 1;
    box-shadow: 0 0px 2px 0 rgba(60, 64, 67, 0), 0 0px 6px 2px rgba(60, 64, 67, 0);
    transition: box-shadow 0.2s;
    }
.search-form > .search-holder.active{
    box-shadow: 0 0px 2px 0 rgba(60, 64, 67, .3), 0 0px 6px 2px rgba(60, 64, 67, .15);
    }

.search-form > .search-holder > .search-head,
.search-form > .search-holder > .search-body{
    width: 100%;
    position: relative;
    margin: auto;
    }

.search-form > .search-holder > .search-body{
    border-top:1px solid #e2e2e2;
    transition: opacity 0.2s, height 0.2s;
    height: min-content;
    opacity: 1;
    }
.search-form > .search-holder > .search-body:empty{
    height: 0px;
    opacity: 0;
    display: none;
    }
.search-form > .search-holder > .search-head > input:focus,
.search-form > .search-holder > .search-head > input:active,
.search-form > .search-holder > .search-head > input{
    display: block;
    box-shadow: none;
    border: none;
    outline: none;
    background: transparent;
    height: 40px;
    margin: auto;
    outline: none;
    z-index: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    background-clip: padding-box;
    position: relative;
    transition: all 0.3s ease-in-out;
    padding-left: 55px;
    padding-right: 10px;
    width: calc(100% - 25px);
    margin-right: 25px;
    }
.search-form > .search-holder > .search-head .search-typed{
    position: absolute;
    margin: auto;
    right: 0px;
    top: 0px;
    bottom: 0px;
    height: min-content;
    padding-left: 55px;
    padding-right: 10px;
    color: #b7b7b7;
    width: 100%;
    width: calc(100% - 25px);
    margin-right: 25px;
    min-width: min-content;
    }
.search-form > .search-holder > .search-head .search-typed > span.typed{
    white-space: nowrap;
    }
.search-form > .search-holder > .search-head > .search-spinner{
    position: absolute;
    outline: none;
    border: none;
    box-shadow: none;
    margin: auto;
    right: 0px;
    top: 0px;
    bottom: 0px;
    padding: 10px;
    text-align: center;
    background: transparent;
    color: #bcbcbc;
    }
.search-form > .search-holder > .search-head:has(.search-spinner:empty) > input,
.search-form > .search-holder > .search-head:has(.search-spinner:empty) > input:active,
.search-form > .search-holder > .search-head:has(.search-spinner:empty) > input:focus,
.search-form > .search-holder > .search-head:has(.search-spinner:empty) .search-typed{
    width: 100%;
    margin-right: 0px;
    }
.search-form > .search-holder > .search-head::before{
    content: " ";
    position: absolute;
    width: 40px;
    height: 40px;
    margin: auto;
    left: 0px;
    top: 0px;
    background: white;
    z-index: 1;
    }
.search-form > .search-holder > .search-head > input:not(:placeholder-shown) {
    background: #ffffff;
    }
.search-form > .search-holder > .search-head > .search-icon{
    position: absolute;
    margin: auto;
    width: 20px;
    height: 20px;
    text-align: center;
    padding: 10px;
    left: 0px;
    top: 0px;
    color: #690e13;
    z-index: 1;
    border-right: 2px solid #f3f0f0;
    }
table tr:nth-child(odd) {
    background-color: #fcfbfb;
    }
.p-name{
    position: relative;
    color: #999999;
    display: block;
    width: min-content;
    }
.p-name > span{
    position: relative;
    }
.p-name > span:first-child{
    position: absolute;
    margin: auto;
    font-size: 30px;
    font-weight: 700;
    line-height: 30px;
    width: 30px;
    text-align: left;
    top: 0px;
    bottom: 0px;
    height: 30px;
    }
.p-name > span:last-child{
    display: block;
    font-size: 12px;
    padding-left: 30px;
    color: #c3b0b0;
    font-weight: 700;
    }
.p-name > span:last-child > i{
    display: block;
    line-height: 12px;
    font-style: inherit;
    }
.p-name > span.self{
    text-align: center;
    background: #f4eeee;
    padding: 2px;
    width: 35px;
    height: 35px;
    border-radius: 200px;
    font-size: 30px;
    position: relative;
    }
.p-name.type-buy > span:last-child > i:first-child{
    color: #0d6efd;
    }
.p-name.type-sell > span:last-child > i:first-child{
    color: #198754;
    }
.table>:not(:first-child){
    border-top: 1px solid #707070;
    }
.p-title{

    }
.p-title > .title{
    margin-bottom: 0px;
    white-space: nowrap;
    }
.p-title > ul{
    margin: auto;
    padding: 0px;
    display: block;
    list-style-type: none;
    white-space: nowrap;
    }
.p-title > ul > li{
    display: inline-block;
    margin: auto;
    position: relative;
    padding: 0px 5px;
    }
.p-title > ul > li:first-child{
    padding-left: 0px;
    }
.p-title > ul > li:last-child{
    padding-right: 0px;
    }
.p-title.ud-d > ul > li{
    display: block;
    padding: 0px;
    }
.p-title > ul > li > p{
    margin-bottom: 0px;
    font-size: 12px;
    color: #999999;
    white-space: nowrap;
    }
.p-title > ul > li > p > .info-icon{
    padding-right: 3px;
    }
.p-title > ul > li > p > span{
    font-weight: 500;
    }
.p-details > span:last-child{
    color: #212529;
    padding-left: 5px;
    }
.add-entity{
    position: absolute;
    margin: auto;
    right: 15px;
    bottom: 15px;
    }
.add-entity > a{
    background-color: #690e13;
    border-color: #690e13;
    border-radius: 25px;
    padding: 10px 25px;
    font-size: 13px;
    font-weight: 500;
    -webkit-box-shadow: 0 0px 2px 0 rgba(60, 64, 67, .3), 0 0px 6px 2px rgba(60, 64, 67, .15);
    box-shadow: 0 0px 2px 0 rgba(60, 64, 67, .3), 0 0px 6px 2px rgba(60, 64, 67, .15);
    }
.add-entity > a:hover,
.add-entity > a:focus,
.add-entity > a:active{
    background-color: #941118;
    border-color: #941118;
    -webkit-box-shadow: 0 0px 2px 0 rgba(60, 64, 67, .3), 0 0px 6px 2px rgba(60, 64, 67, .15);
    box-shadow: 0 0px 2px 0 rgba(60, 64, 67, .3), 0 0px 6px 2px rgba(60, 64, 67, .15);
    }
.lcl-btn{
    background-color: #690e13;
    border-color: #690e13;
    color: #ffffff;
    }
.lcl-btn:hover,
.lcl-btn:focus,
.lcl-btn:active{
    background-color: #941118;
    border-color: #941118;
    box-shadow: 0 0 0 .25rem rgb(148 17 24 / 25%);
    color: #ffffff;
    }
.click-n-go{
    cursor: pointer;
    }
.v-center{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    }
.one-line-title{
    white-space: nowrap;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    }
.one-line-title:empty,
.hide-extra-lines:empty{
    display: none;
    }
.line-show{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: inherit!important;
    }
.line-show.line-0{
    display: none;
    }
.line-show.line-1{
    display: -webkit-box;
    -webkit-line-clamp: 1; /* Number of lines to show */
    }
.line-show.line-2{
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Number of lines to show */
    }
.line-show.line-3{
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Number of lines to show */
    }
.line-show.line-4{
    display: -webkit-box;
    -webkit-line-clamp: 4; /* Number of lines to show */
    }
.line-show.line-5{
    display: -webkit-box;
    -webkit-line-clamp: 5; /* Number of lines to show */
    }
.line-show.line-6{
    display: -webkit-box;
    -webkit-line-clamp: 6; /* Number of lines to show */
    }
.line-show.line-7{
    display: -webkit-box;
    -webkit-line-clamp: 7; /* Number of lines to show */
    }
.line-show.line-8{
    display: -webkit-box;
    -webkit-line-clamp: 8; /* Number of lines to show */
    }
.line-show.line-9{
    display: -webkit-box;
    -webkit-line-clamp: 9; /* Number of lines to show */
    }
.line-show.line-10{
    display: -webkit-box;
    -webkit-line-clamp: 10; /* Number of lines to show */
    }
@media (min-width: 992px) {
    .line-show.line-md-0{
        display: none;
        }
    .line-show.line-md-1{
        display: -webkit-box;
        -webkit-line-clamp: 1; /* Number of lines to show */
        }
    .line-show.line-md-2{
        display: -webkit-box;
        -webkit-line-clamp: 2; /* Number of lines to show */
        }
    .line-show.line-md-3{
        display: -webkit-box;
        -webkit-line-clamp: 3; /* Number of lines to show */
        }
    .line-show.line-md-4{
        display: -webkit-box;
        -webkit-line-clamp: 4; /* Number of lines to show */
        }
    .line-show.line-md-5{
        display: -webkit-box;
        -webkit-line-clamp: 5; /* Number of lines to show */
        }
    .line-show.line-md-6{
        display: -webkit-box;
        -webkit-line-clamp: 6; /* Number of lines to show */
        }
    .line-show.line-md-7{
        display: -webkit-box;
        -webkit-line-clamp: 7; /* Number of lines to show */
        }
    .line-show.line-md-8{
        display: -webkit-box;
        -webkit-line-clamp: 8; /* Number of lines to show */
        }
    .line-show.line-md-9{
        display: -webkit-box;
        -webkit-line-clamp: 9; /* Number of lines to show */
        }
    .line-show.line-md-10{
        display: -webkit-box;
        -webkit-line-clamp: 10; /* Number of lines to show */
        }
    }
tr.type-buy{
    background-color: #dceafe!important;
    }
tr.type-sell{
    background-color: #dfeae5!important;
    }
.lc-tabs{
    position: relative;
    }
.lc-tabs > ul{
    position: relative;
    }
.lc-tabs > ul > li{

    }
.lc-tabs > ul > li > a,
.lc-tabs > ul > li > button{
    background: transparent !important;
    color: #690e13 !important;
    position: relative;
    }
.lc-tabs > ul::after,
.lc-tabs > ul > li > a::after,
.lc-tabs > ul > li > button::after{
    content: " ";
    background-color: transparent;
    width: 80%;
    height: 2px;
    position: absolute;
    margin: auto;
    bottom: 0px;
    left: 0px;
    right: 0px;
    transition: background-color .15s ease-in-out;
    }
.lc-tabs > ul::after{
    background-color: #995b5f;
    width: 100%;
    height: 1px;
    }
.lc-tabs > ul > li > a::after,
.lc-tabs > ul > li > button::after{
    z-index: 1;
    max-width: 60px;
    min-width: 80px;
    }
.lc-tabs > ul > li > a:hover:after,
.lc-tabs > ul > li > a:focus:after,
.lc-tabs > ul > li > button:hover:after,
.lc-tabs > ul > li > button:focus:after{
    background-color: #e0e0e0;
    }
.lc-tabs > ul > li > a:active::after,
.lc-tabs > ul > li > a.active::after,
.lc-tabs > ul > li > button:active::after,
.lc-tabs > ul > li > button.active::after{
    background-color: #690e13;
    }
.lc-tabs > ul > li > a > .info-icon,
.lc-tabs > ul > li > button > .info-icon{

    }
.lc-tabs > ul > li > a > span,
.lc-tabs > ul > li > button > span{

    }
.lc-tabs > div{

    }
.lc-tabs > div > .tab-pane{

    }
.img-logo > img{
    margin: auto;
    height: 135px;
    padding: 10px;
    }
.card {
    margin-bottom: var(--bs-gutter-x);
    }
.card-body .card-settings{
    color: transparent;
    transition: color .15s ease-in-out;
    }
.card-body:hover .card-settings{
    color: #cccccc;
    }
.card-body .card-settings:hover,
.card-body .card-settings:focus,
.card-body .card-settings:active{
    color: #9f9f9f;
    }
.card-title {
    font-size: 18px;
    margin-bottom: 8px;
    color: #3a3f4f;
    }
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    margin-top: 0;
    margin-bottom: .5rem;
    font-weight: 600;
    line-height: 1.5; 
    }

.h1,h1 {
    font-size: calc(1.35rem + 1.2vw)
    }

@media (min-width: 1200px) {
    .h1,h1 {
        font-size:2.25rem
        }
    }

.h2,h2 {
    font-size: calc(1.275rem + .3vw)
    }

@media (min-width: 1200px) {
    .h2,h2 {
        font-size:1.5rem
        }
    }

.h3,h3 {
    font-size: calc(1.25625rem + .075vw)
    }

@media (min-width: 1200px) {
    .h3,h3 {
        font-size:1.3125rem
        }
    }

.h4,h4 {
    font-size: 1.125rem
    }

.h5,h5 {
    font-size: 1rem
    }

.h6,h6 {
    font-size: .875rem
    }

p {
    margin-top: 0;
    margin-bottom: 1rem
    }
.fs-1 {
    font-size: .625rem!important
    }
    
.fs-2 {
    font-size: .75rem!important
    }
    
.fs-3 {
    font-size: .875rem!important
    }
    
.fs-4 {
    font-size: 1rem!important
    }
    
.fs-5 {
    font-size: 1.125rem!important
    }
    
.fs-6 {
    font-size: 1.25rem!important
    }
    
.fs-7 {
    font-size: calc(1.275rem + .3vw)!important
    }
    
.fs-8 {
    font-size: calc(1.3125rem + .75vw)!important
    }
    
.fs-9 {
    font-size: calc(1.35rem + 1.2vw)!important
    }
    
.fs-10 {
    font-size: calc(1.375rem + 1.5vw)!important
    }
    
.fs-11 {
    font-size: .8125rem!important
    }
    
.fs-12 {
    font-size: .9375rem!important
    }
    
.fs-13 {
    font-size: calc(1.425rem + 2.1vw)!important
    }
    
.fs-14 {
    font-size: calc(1.46875rem + 2.625vw)!important
    }
    
.fst-italic {
    font-style: italic!important
    }
    
.fst-normal {
    font-style: normal!important
    }
    
.fw-lighter {
    font-weight: 300!important
    }
    
.fw-light {
    font-weight: 300!important
    }
    
.fw-normal {
    font-weight: 400!important
    }
    
.fw-medium {
    font-weight: 500!important
    }
    
.fw-semibold {
    font-weight: 600!important
    }
    
.fw-bold {
    font-weight: 600!important
    }
    
.fw-bolder {
    font-weight: 700!important
    }
.ui-sortable{
    list-style-type: none;
    padding: 0%;
    }
.ui-sortable > li{
    position: relative;
    }
svg.ui-sortable-handle{
    z-index: 1;
    cursor: move;
    position: absolute;
    color: transparent;
    margin: auto;
    top: 3px;
    left: 0px;
    right: 0px;
    /* height: 16px; */
    padding: 0px 10px;
    -webkit-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
    }
.modal-body svg.ui-sortable-handle{
    right: initial;
    bottom: 0px;
    top: 0px;
    }
tr:has(svg.ui-sortable-handle){
    position: relative;
    }
tr:has(svg.ui-sortable-handle) > td:nth-child(2){
    padding-left: 30px;
    }
*:hover > svg.ui-sortable-handle{
    color: #c4c4c4;
    }
svg.ui-sortable-handle:active,
svg.ui-sortable-handle:focus,
svg.ui-sortable-handle:hover{
    color: #afafaf;
    }
.card-not-live,
.card-not-use{
    position: relative;
    }
.card-not-live::before,
.card-not-use::before{
    position: absolute;
    margin: auto;
    width: 0px;
    height: 0px;
    top: 0px;
    left: 0px;
    background: #ffffff;
    }
.card-not-live > *:not(svg),
.card-not-use > *:not(svg){
    background: #f3f3f3;
    }
.card-not-use .name-block{
    opacity: 0.5;
    }
.h-candle{
    background: #e3e3e3;
    }
.h-candle > div{
    margin: auto;
    max-width: 100%;
    position: relative;
    }

.h-candle > div::before,
.h-candle > div::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border: 6px solid transparent; /* Size of the arrow */
    }

.h-candle > div::before {
    border-bottom-color: #8f8f8f; /* Down arrow color */
    top: 100%; /* Position arrow vertically */
    left: 0px; /* Position arrow horizontally */
    transform: translate(-50%, -50%) rotate(0deg); /* Adjust rotation if needed */
    }

.h-candle > div::after {
    border-top-color: #8f8f8f; /* Up arrow color */
    top: 100%; /* Position arrow vertically */
    left: 100%; /* Position arrow horizontally */
    transform: translate(-50%, -50%) rotate(180deg); /* Adjust rotation if needed */
    }
.draggable-tv{
    width: 200px;
    background-color: #000000;
    border: 1px solid #ccc;
    position: fixed;
    margin: auto;
    display: none;
    /* z-index: 100; */
    }
body:not(.tv-small-window) .draggable-tv{
    border: none;
    }
body:not(.tv-small-window) .draggable-tv,
body.tv-small-window-resizeing .draggable-tv{
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
.action-icons{
    position: absolute;
    margin: auto;
    top: 0px;
    right: 0px;
    padding: 0px;
    list-style-type: none;
    /* background: #000000; */
    color: #ffffff;
    text-align: center;
    opacity: 0;
    cursor: pointer;
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
.draggable-tv:hover > .action-icons{
    opacity: 0.3;
    }
.draggable-tv > .action-icons:hover{
    opacity: 1!important;
    }
.draggable-tv:hover > .action-icons > li{
    display: block;
    }
.draggable-tv:hover > .action-icons > li:not(:last-child){
    border-bottom: 1px solid #868686;
    }
.draggable-tv > .action-icons > li > svg{
    opacity: 0.5;
    padding: 8px 10px;
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
.draggable-tv:hover > .action-icons > li > svg.close-tv{
    background: #ff0000;
    
    }
.draggable-tv:hover > .action-icons > li > svg.logout-tv{
    background: #7d7d7d;
    }
.draggable-tv:hover > .action-icons > li > svg.logout-tv:hover,
.draggable-tv:hover > .action-icons > li > svg.close-tv:hover{
    opacity: 1;
    }

/* body.tv-small-window .draggable-tv:hover > .action-icons > li > svg{
    opacity: 1!important;
    background: #000000;
    /* //background: #ff0000; * /
    } */
 
 
body:not(.tv-small-window) .draggable-tv{
    width: 100%!important;
    height: 100%!important;
    left: 0px!important;
    top: 0px!important;
    z-index: 100;
    }
body .draggable-tv > img{
    width: 100%!important;
    height: 100%!important;
    }
body.dashboard .nav-bts{
    position: relative;
    margin: auto;
    padding: 0px;
    border: none;
    list-style-type: none;
    }
body.dashboard .nav-bts > li{
    position: relative;
    margin: auto;
    padding: 0px;
    display: inline-block;
    overflow: hidden;
    }
body.dashboard .nav-bts > li > a{
    color: #6c757d;
    font-weight: 600;
    text-decoration: none;
    padding: 25px 20px;
    display: block;
    }
body.dashboard .nav-bts > li > a:not(.active):hover{
    color: #6169d0;
    }
body.dashboard .nav-bts::after,
body.dashboard .nav-bts > li > a::after{
    content: " ";
    height: 2px;
    position: absolute;
    width: 0%;
    margin: auto;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: transparent;
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
body.dashboard .nav-bts::after{
    background: #eaedef;
    width: 100%;
    }
body.dashboard .nav-bts > li > a.active:not(.nav-link):after{
    min-width: 20px;
    }
body.dashboard .nav-bts > li > a.active::after{
    max-width: 100%;
    width: 80%;
    width: calc(100% - 60px);
    z-index: 1;
    background: #727cf5;
    }
/* body.dashboard td > .del-tag{
    position: relative;
    border-radius: 0.25rem
    } */
body.dashboard .tbl-dt{
    margin-top: 20px;
    }
body.dashboard .tbl-dt > tbody{
    padding-top: 20px;
}

body.dashboard .tbl-dt > thead > tr{
    border: 1px solid #e5e5e5;
    }
body.dashboard .tbl-dt > tbody > tr{
    /*  */
    position: relative;
    }

body.dashboard .tbl-dt > tbody > tr > td{
    padding-top: 60px;
    border-top: 1px solid #b3b1b1;
    border-bottom: 1px solid #e5e5e5;
    }
body.dashboard .tbl-dt > tbody > tr > td:first-child{
    border-left: 1px solid #b3b1b1;
    }
body.dashboard .tbl-dt > tbody > tr > td:last-child{
    border-right: 1px solid #b3b1b1;
    border-right: 0.5px solid #b3b1b1;
    }
body.dashboard .tbl-dt > tbody > tr > td::before{
    content: " ";
    background: whitesmoke;
    position: absolute;
    margin: auto;
    top: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 50px;
    /* border-radius: 0.25rem 0.25rem 0rem 0rem; */
    border-top: 1px solid #b3b1b1;
    border-right: 1px solid #b3b1b1;
    border-bottom: 1px solid #e5e5e5;
    }
body.dashboard .tbl-dt > tbody > tr:last-child > td{
    border-bottom: 1px solid #b3b1b1;
    }

body.dashboard .tab-frm > input{
    margin-top: -55px;
    font-weight: 500;
    min-width: 200px;
    border: 1px solid #e5e5e5;
    color: #6c757d;
    padding: 7px 5px;
    outline: none;
    }
body.dashboard .add-libtn{
    float: right;
    }
body.dashboard .add-libtn > a{
    position: relative;
    padding: 5px 15px!important;
    margin: 20px 5px;
    color: #313a46;
    background-color: #eef2f7;
    border-color: #eef2f7;
    border-radius: 0.25rem;
    -webkit-box-shadow: 0 2px 6px 0 rgb(238 242 247 / 50%);
    box-shadow: 0 2px 6px 0 rgb(238 242 247 / 50%);
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
body.dashboard .add-libtn > a:active,
body.dashboard .add-libtn > a:hover {
    color: #000!important;
    background-color: #f9fafb;
    border-color: #f9fafb;
    }
.form-instruments{
    background-color: #ffffff;
    border-bottom: 1px solid #e5e5e5;
    }
.form-instruments:last-child{
    border-bottom: none;
    }
.card-active{
    background: #e7f5ee;
    }
.cities-ul{
    padding: 0px;
    margin: auto;
    list-style-type: none;
    display: block;
    }
.cities-ul > li{

    }
body.dashboard .mtgd-r{
    margin: auto;
    }
body.dashboard .nav-bts{
    position: relative;
    margin: auto;
    padding: 0px;
    border: none;
    list-style-type: none;
    }
body.dashboard .nav-bts > li{
    position: relative;
    margin: auto;
    padding: 0px;
    display: inline-block;
    overflow: hidden;
    }
body.dashboard .nav-bts > li > a{
    color: #6c757d;
    font-weight: 600;
    text-decoration: none;
    padding: 15px 20px;
    display: block;
    }
body.dashboard .nav-bts > li > a:not(.active):hover{
    color: #6169d0;
    }
body.dashboard .nav-bts::after,
body.dashboard .nav-bts > li > a::after{
    content: " ";
    height: 2px;
    position: absolute;
    width: 0%;
    margin: auto;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: transparent;
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
body.dashboard .nav-bts::after{
    background: #eaedef;
    width: 100%;
    }
body.dashboard .nav-bts > li > a.active::after{
    max-width: 100%;
    width: 80%;
    width: calc(100% - 60px);
    z-index: 1;
    background: #727cf5;
    }
body.dashboard .nav-bts-x::after{
    display: none;
    }
body.dashboard .nav-bts-x > li > a::after,
body.dashboard .nav-bts-x > li > a.active::after{
    width: 2px;
    height: 60%;
    right: auto;
    top: 0px;
    }
body.dashboard .nav-bts-x > li > a.active{
    color: #6169d0;
    }
body.dashboard .nav-bts-x{
    border-bottom: 1px solid #ededed;
    margin-top: 0px;
    }
body.dashboard .tab-content-x{
    border: 1px solid #ededed;
    border-top: none;
    }
body.dashboard .nav-bts-x > li{
    border-bottom: 1px solid #ededed;
    display: block;
    }
body.dashboard .nav-bts-x > li:last-child{
    border-bottom: none;
    }
body.dashboard .nav-bts-x > li > a > svg{
    text-align: center;
    min-width: 40px;
    }
body.dashboard .nav-bts-x > li > a{
    padding: 13px 20px 13px 5px!important;
    }
body.dashboard .mtgd-r{
    margin: auto;
    }
body.dashboard .mtgd-r{
    margin: auto;
    }
body.dashboard .tab-content-x {
    border: 1px solid #ededed;
    }
body.dashboard .card > .card-body .tbx{
    margin-bottom: 15px;
    }
body.dashboard .tbx.sul-title{
    margin-left: -12px;
    margin-right: -12px;
    background: whitesmoke;
    border-bottom: 1px solid #e5e5e5;
    }
body.dashboard .card > .card-body .tbx > .title{
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: .02em;
    font-size: 1rem;
    margin-top: 0;
    font-weight: 700;
    color: #6c757d;
    }
body.dashboard .tbx.sul-title > .title{
    text-align: left;
    padding: 20px 15px;
    text-transform: initial!important;
    margin-bottom: 0px!important;
    }
body.dashboard .tbx.sul-title > .title > svg{
    padding-right: 10px;
    }
body.dashboard .tbl-nav ul.nav-act{
    position: relative;
    margin: auto;
    padding: 0px;
    list-style-type: none;
    }
body.dashboard .tbl-nav ul.nav-act > li{
    position: relative;
    display: inline-block;
    }
.modal-body:has(.only-pop){
    padding: 0px;
    }
.modal-backdrop{
    background-color: transparent;
    }
.modal{
    background-color: #0000008c;
    }

.tv-rate{
    position: absolute;
    margin: auto;
    bottom: 0px;
    width: 100%;
    list-style-type: none;
    padding: 40px 0px 10px 0px;
    /* background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 20%, rgba(0, 0, 0, 0.8) 60%, rgba(0, 0, 0, 0.8) 100%); */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 50%, rgba(0, 0, 0, 0.8) 100%);
    opacity: 0;
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
body:not(.tv-small-window) .draggable-tv > .tv-rate{
    opacity: 1;
    }
/* .tv-rate::before{
    content: " ";
    } */
.tv-rate > li{
    position: relative;
    padding-top: 0px;
    margin-top: -10px;
    }
.tv-rate > li > .card{
    background-color: #333333!important; 
    border: none;
    color: #ffffff;
    -webkit-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    transition: all 200ms linear;
    }
.tv-rate > li.card-not-live > .card > *:not(svg),
.tv-rate > li.card-not-use > .card > *:not(svg){
    opacity: 0.5;
    }
.tv-rate > li > .card .card-title{
    color: #ffffff;
    }
.tv-rate > li > .card .text-muted {
    color: #dddddd !important;
    }
.tv-logo{
    max-height: 66px;
    overflow: hidden;
    text-align: center;
    }
.tv-logo > img{
    max-width: 150px;
    height: initial !important;
    }
p.time-date-count{
    color: #ffffff;
    position: relative;
    font-family: 'Montserrat', sans-serif;
    padding-left: 10px;
    }
p.time-date-count > span{
    display: block;    
    }
p.time-date-count > .time{
    font-size: 45px;
    line-height: 35px;
    text-align: center;
    }
p.time-date-count > .time > i{
    font-style: initial;
    width: min-content;
    display: inline-block;
    position: relative;
    text-align: left;
    padding-right: 14px;
    }
/* p.time-date-count > .time > i:nth-child(2){
    width: 60px;
    } */
p.time-date-count > .time > i:last-child{
    padding-right: 0px;
    }
p.time-date-count > .time > i:first-child:after{
    content: ":";
    position: absolute;
    margin: auto;
    bottom: 4px;
    right: 2px;
    }

p.time-date-count > .date{
    font-size: 25px;
    line-height: 30px;
    text-align: center;
    padding-top: 5px;
    }
/* p.time-count{
    text-align: center;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Montserrat', sans-serif;
    }
p.time-count > span{
    font-size: 50px;
    line-height: 40px;
    display: inline-block;
    width: 130px;
    max-width: 100%;
    margin-right: 10px;
    position: relative;
    background: #787878;
    padding-top: 15px;
    color: #ffffff;
    } */
.modal-dialog{
    height: min-content;
    margin: auto;
    bottom: 0px;
    top: 0px;
    display: block;
    position: absolute;
    right: 0px;
    left: 0px;
    }