@charset "utf-8";

/* CSS Document */


/*****************************************************************
reset css
******************************************************************/

* {
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul {
    margin: 0;
    padding: 0;
}

ul {
    list-style: none;
}

a {
    text-decoration: none !important;
}

body {
    width: 100%;
    padding: 0;
    margin: 0;
    font-family: 'Roboto', sans-serif;
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    padding-right: 10px;
}


/* Track */

::-webkit-scrollbar-track {
    border-radius: 1px;
    background-color: #eee;
}


/* Handle */

::-webkit-scrollbar-thumb {
    border-radius: 1px;
    background-color: #FAB95B;
}


/****************
     table
***************/


/** table_trade **/

.table_trade .dataTables_scrollBody {
    scrollbar-color: #e7e5ed #f5f5f6;
    scrollbar-width: thin;
}

.table_trade .dataTables_scrollBody::-webkit-scrollbar-track {
    background-color: #f5f5f6;
}

.table_trade .dataTables_scrollBody::-webkit-scrollbar {
    width: 4px;
    background-color: #e7e5ed;
}

.table_trade .dataTables_scrollBody::-webkit-scrollbar-thumb {
    background-color: #e7e5ed;
}

.table_trade .table-responsive {
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
}

.table_trade table {
    width: 100%;
}

.table_trade table th {
    padding: 0.2rem 0.4rem;
    text-align: left;
    font-size: 0.8rem;
    color: #262424;
    text-transform: capitalize;
    white-space: nowrap;
    font-weight: 600;
    background: #f7f4fd;
}

.dark_mode .table_trade table th {
    color: #96a1bf;
}

.table_trade table tbody td {
    padding: 0.1rem 0.4rem;
    text-align: left;
    font-size: 0.8rem;
    color: rgba(0, 0, 0, 0.9);
    text-transform: capitalize;
    white-space: nowrap;
    -webkit-box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, 0.1);
    -moz-box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, 0.1);
    box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, 0.1);
}

.table_trade table tbody td a {
    display: inline-block;
    color: #F5564E;
    margin-right: 4px;
}

.table_trade table tbody td img {
    display: inline-block;
}

div.dataTables_wrapper {
    width: 100%;
    margin: 0 auto;
}

.table_trade table.dataTable {
    margin: 0 !important;
}

.table_trade .dataTables_scrollHead {
    background: #f7f4fd;
}

.table_trade div.dataTables_wrapper div.dataTables_length label,
.table_trade div.dataTables_wrapper div.dataTables_filter label {
    margin: 0;
    vertical-align: text-top;
    font-size: 0.9rem;
    text-transform: capitalize;
    color: #826db2;
}

.table_trade div.dataTables_wrapper div.dataTables_info,
.table_trade div.dataTables_wrapper div.dataTables_paginate ul.pagination li {
    font-size: 0.9rem;
    text-transform: capitalize;
    color: #826db2;
}

.table_trade .page-item.active .page-link {
    background-color: #b9aadb;
    border-color: #9c8dbe;
}

.table_trade .page-link {
    color: rgba(0, 0, 0, 0.5);
}

.table_trade .page-link:hover {
    color: #826db2;
}

.table_trade table.dataTable thead .sorting::after,
.table_trade table.dataTable thead .sorting_asc::after,
.table_trade table.dataTable thead .sorting_desc::after,
.table_trade table.dataTable thead .sorting_asc_disabled::after,
.table_trade table.dataTable thead .sorting_desc_disabled::after {
    content: "\f0d8";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

.table_trade table.dataTable thead .sorting::before,
.table_trade table.dataTable thead .sorting_asc::before,
.table_trade table.dataTable thead .sorting_desc::before,
.table_trade table.dataTable thead .sorting_asc_disabled::before,
.table_trade table.dataTable thead .sorting_desc_disabled::before {
    content: "\f0d7";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

.table_trade table.dataTable thead .sorting::before,
.table_trade table.dataTable thead .sorting::after,
.table_trade table.dataTable thead .sorting_asc::before,
.table_trade table.dataTable thead .sorting_asc::after,
.table_trade table.dataTable thead .sorting_desc::before,
.table_trade table.dataTable thead .sorting_desc::after,
.table_trade table.dataTable thead .sorting_asc_disabled::before,
.table_trade table.dataTable thead .sorting_asc_disabled::after,
.table_trade table.dataTable thead .sorting_desc_disabled::before,
.table_trade table.dataTable thead .sorting_desc_disabled::after {
    font-size: 0.5rem;
}

.table_links {
    display: inline-block;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(145, 130, 179, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(145, 130, 179, 1);
    box-shadow: inset 0px 0px 0px 1px rgba(145, 130, 179, 1);
    font-size: 0.9rem;
    border-radius: 0.2rem;
    color: #9182B3;
    padding: 0.2rem 0.6rem;
}

.table_links:hover,
.table_links:focus {
    background: #9182B3;
    color: #ffffff;
}


/****************
     button
***************/

.btn {
    text-shadow: none;
    border: none;
    /* min-width: 10.625rem; */
    border-radius: 0.25rem;
    text-transform: capitalize;
    font-size: 1rem;
    padding: .813rem .75rem;
    position: relative;
}


/** btn-primary **/

.btn-primary {
    background: #f20127;
    z-index: 1;
}

.btn-primary:after {
    content: "";
    position: absolute;
    background: rgb(242, 1, 39);
    background: -moz-linear-gradient(-45deg, rgba(242, 1, 39, 0.5) 0%, rgba(242, 1, 39, 0.5) 10%, rgba(240, 59, 88, 0.5) 10%, rgba(240, 59, 88, 0.5) 22%, rgba(189, 25, 51, 0.5) 22%, rgba(189, 25, 51, 0.5) 60%, rgba(242, 1, 39, 0.5) 60%, rgba(242, 1, 39, 0.5) 88%, rgba(233, 61, 88, 0.5) 88%, rgba(233, 61, 88, 0.5) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(242, 1, 39, 0.5) 0%, rgba(242, 1, 39, 0.5) 10%, rgba(240, 59, 88, 0.5) 10%, rgba(240, 59, 88, 0.5) 22%, rgba(189, 25, 51, 0.5) 22%, rgba(189, 25, 51, 0.5) 60%, rgba(242, 1, 39, 0.5) 60%, rgba(242, 1, 39, 0.5) 88%, rgba(233, 61, 88, 0.5) 88%, rgba(233, 61, 88, 0.5) 100%);
    background: linear-gradient(-45deg, rgba(242, 1, 39, 0.5) 0%, rgba(242, 1, 39, 0.5) 10%, rgba(240, 59, 88, 0.5) 10%, rgba(240, 59, 88, 0.5) 22%, rgba(189, 25, 51, 0.5) 22%, rgba(189, 25, 51, 0.5) 60%, rgba(242, 1, 39, 0.5) 60%, rgba(242, 1, 39, 0.5) 88%, rgba(233, 61, 88, 0.5) 88%, rgba(233, 61, 88, 0.5) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f20127', endColorstr='#e93d58', GradientType=1);
    width: 100%;
    height: 100%;
    top: 0.4rem;
    left: 0.4rem;
    border-radius: 0.25rem;
    z-index: -1;
    transition: all .2s ease-in-out !important;
    -webkit-transition: all .2s ease-in-out !important;
    -moz-transition: all .2s ease-in-out !important;
    -o-transition: all .2s ease-in-out !important;
}


/** btn-secondary **/

.btn-secondary {
    background: #604a92;
    z-index: 1;
}

.btn-secondary:after {
    content: "";
    position: absolute;
    background: rgb(96, 74, 146);
    background: -moz-linear-gradient(-45deg, rgba(96, 74, 146, 0.5) 0%, rgba(96, 74, 146, 0.5) 10%, rgba(123, 95, 187, 0.5) 10%, rgba(123, 95, 187, 0.5) 22%, rgba(64, 37, 125, 0.5) 22%, rgba(64, 37, 125, 0.5) 60%, rgba(97, 55, 194, 0.5) 60%, rgba(97, 55, 194, 0.5) 88%, rgba(146, 110, 229, 0.5) 88%, rgba(146, 110, 229, 0.5) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(96, 74, 146, 0.5) 0%, rgba(96, 74, 146, 0.5) 10%, rgba(123, 95, 187, 0.5) 10%, rgba(123, 95, 187, 0.5) 22%, rgba(64, 37, 125, 0.5) 22%, rgba(64, 37, 125, 0.5) 60%, rgba(97, 55, 194, 0.5) 60%, rgba(97, 55, 194, 0.5) 88%, rgba(146, 110, 229, 0.5) 88%, rgba(146, 110, 229, 0.5) 100%);
    background: linear-gradient(-45deg, rgba(96, 74, 146, 0.5) 0%, rgba(96, 74, 146, 0.5) 10%, rgba(123, 95, 187, 0.5) 10%, rgba(123, 95, 187, 0.5) 22%, rgba(64, 37, 125, 0.5) 22%, rgba(64, 37, 125, 0.5) 60%, rgba(97, 55, 194, 0.5) 60%, rgba(97, 55, 194, 0.5) 88%, rgba(146, 110, 229, 0.5) 88%, rgba(146, 110, 229, 0.5) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#604a92', endColorstr='#926ee5', GradientType=1);
    width: 100%;
    height: 100%;
    top: 0.4rem;
    left: 0.4rem;
    border-radius: 0.25rem;
    z-index: -1;
    transition: all .2s ease-in-out !important;
    -webkit-transition: all .2s ease-in-out !important;
    -moz-transition: all .2s ease-in-out !important;
    -o-transition: all .2s ease-in-out !important;
}

.btn-primary:hover:after,
.btn-primary:focus:after,
.btn-secondary:hover:after,
.btn-secondary:focus:after {
    top: 0rem;
    left: 0rem;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-secondary:hover,
.btn-secondary:focus {
    background: none;
}

.text-red {
    color: #F5564E !important;
}

.text-green {
    color: #66A81A !important;
}

.text-grey {
    color: #a1a1a1 !important;
}

.text-blue {
    color: #2168c4 !important;
}


/****************
::-webkit-input-placeholder {
  color: #ffffff; opacity:1;
}
::-moz-placeholder {
  color: #ffffff; opacity:1;
}
:-ms-input-placeholder {
  color: #ffffff; opacity:1;
}
:-moz-placeholder {
  color: #ffffff; opacity:1;
}
***************/


/******************************************************
exchange - basic
******************************************************/


/** header **/

header {
    display: block;
    position: absolute;
    z-index: 1;
    width: 100%;
}


/** header_menu **/

.header_menu {
    display: block;
}

.header_menu .navbar {
    padding: 0;
}

.header_menu .navbar-brand {
    padding: 0;
    margin: 0;
}

.header_menu .navbar-expand-md .navbar-nav .nav-item {
    padding: 0 1.3rem;
}

.header_menu .navbar-expand-md .navbar-nav .nav-link {
    padding: 0;
    font-size: 0.8rem;
    text-transform: uppercase;
    color: #ffffff;
}

.header_menu .navbar-nav .nav-link:focus,
.header_menu .navbar-nav .nav-link:hover {
    color: #f20127;
}

.header_menu .navbar-expand-md .navbar-nav {
    position: relative;
}

.header_menu .navbar-expand-md .navbar-nav:after {
    content: "";
    position: absolute;
    border-right: 1px solid #5c4f79;
    width: 1px;
    height: 22px;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
}

.header_menu .dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border: none;
    content: "\f078";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.55rem;
}

.header_menu .dropdown-menu {
    min-width: 100%;
    padding: 0;
    margin: .125rem 0 0;
    font-size: 0.8rem;
    text-align: center;
    background-color: #181129;
    border: none;
    border-radius: 0;
}

.header_menu .dropdown-item {
    color: #ffffff;
    padding: .25rem 0.8rem;
}

.header_menu .dropdown-item:focus,
.header_menu .dropdown-item:hover {
    color: #ffffff;
    background-color: #7664a1;
}


/* header_right */

.header_right {
    display: block;
    text-align: right;
    padding: 15px 0;
}

.header_right span {
    display: inline-block;
}

.custom-select-language {
    height: calc(0.8em + .75rem + 2px);
    padding: 0 1.75rem 0 0;
    font-size: 0.8rem;
    color: #5c4f79;
    background: url(../img/select_arrow.svg) no-repeat 90% center / 10px;
    border: none;
    border-radius: 0;
    text-transform: uppercase;
}

.header_soc {
    display: inline-block;
}

.header_soc li {
    display: inline-block;
    padding: 0 0.70rem;
}

.header_soc li a {
    display: inline-block;
    font-size: 0.8rem;
    color: #5c4f79;
}

.header_soc li a:hover,
.header_soc li a:focus {
    color: #f20127;
}


/** exchange_banner **/

.exchange_banner {
    display: block;
    background: #181129;
    position: relative;
    background: url(../img/spiral_bg_1.svg) no-repeat center fixed, #181129;
    background-size: cover, cover;
    padding: 8.5rem 0 2.5rem;
    overflow: hidden;
    position: relative;
}

.exchange_banner:after {
    content: "";
    position: absolute;
    height: 0.5rem;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    background: rgb(72, 41, 142);
    background: -moz-linear-gradient(left, rgba(72, 41, 142, 1) 0%, rgba(242, 1, 39, 1) 100%);
    background: -webkit-linear-gradient(left, rgba(72, 41, 142, 1) 0%, rgba(242, 1, 39, 1) 100%);
    background: linear-gradient(to right, rgba(72, 41, 142, 1) 0%, rgba(242, 1, 39, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#48298e', endColorstr='#f20127', GradientType=1);
}


/** exchange_banner_left **/

.exchange_banner_left {
    display: block;
}

.exchange_banner_left h4 {
    display: block;
    font-size: 2rem;
    color: #786a96;
    text-transform: capitalize;
    font-weight: 600;
}

.exchange_banner_left ul {
    display: inline-block;
    padding-left: 0.8rem;
}

.exchange_banner_left ul li {
    display: inline-block;
}

.exchange_banner_left ul li a {
    display: inline-block;
    font-size: 0.8rem;
    color: #ffffff;
    padding: 0.4rem 1.2rem;
    border-radius: 0.2rem;
}

.exchange_banner_left ul .active a {
    background: #F6CD60;
    color: #282F44;
}


/** exchange_banner_right **/

.exchange_banner_right {
    display: block;
}

.news_carousel {
    display: block;
}

.news_block {
    display: block;
    font-size: 0.8rem;
    color: #ffffff;
}

.news_block span {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 450px;
    vertical-align: middle;
}

.news_block small {
    display: inline-block;
    vertical-align: middle;
    font-size: 0.8rem;
}


/** main_body **/

.main_body {
    display: block;
    overflow: hidden;
    position: relative;
    /* padding: 3rem 0; */
}

.light_mode,
.dark_mode {
    margin-top: 80px;
}

.trade_advance {
    margin-top: 0;
}

.currency_details {
    width: 100%;
}


/** currency_select **/

.currency_select .btn {
    padding: 0;
    border-radius: 0 !important;
    min-width: auto;
    font-size: 1.4rem;
    font-weight: 500;
}

.currency_select .btn-light {
    background: none !important;
    color: #1A3263;
}

.dark_mode .currency_select .btn-light {
    background: none !important;
    color: #eff4ff;
}

.currency_select .btn-light:not(:disabled):not(.disabled).active,
.currency_select .btn-light:not(:disabled):not(.disabled):active,
.currency_select.show>.btn-light.dropdown-toggle {
    color: #1A3263 !important;
}

.currency_select.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: auto;
}

.currency_select .btn-light:not(:disabled):not(.disabled).active,
.currency_select .btn-light:not(:disabled):not(.disabled):active,
.currency_select .show>.btn-light.dropdown-toggle {
    border: none !important;
}

.currency_select.bootstrap-select>select.mobile-device:focus+.dropdown-toggle,
.currency_select.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
}

.currency_select .btn-light.focus,
.currency_select .btn-light:focus {
    box-shadow: none !important;
}

.currency_select .dropdown-menu {
    padding: 0;
    border: none;
    border-radius: 0;
    font-size: 0;
    -webkit-box-shadow: 0px 0px 0px 1px rgba(139, 122, 174, 1);
    -moz-box-shadow: 0px 0px 0px 1px rgba(139, 122, 174, 1);
    box-shadow: 0px 0px 0px 1px rgba(139, 122, 174, 1);
}

.currency_select .dropdown-menu li {
    padding: 0;
    width: 100%;
    font-size: 0.7rem;
}

.bootstrap-select .dropdown-menu li a.opt {
    padding-left: 0;
}

.currency_select .dropdown-item {
    padding: .25rem 1.0rem !important;
}

.currency_select .dropdown-item:focus,
.currency_select .dropdown-item:hover {
    background-color: #e6ddf8;
}

.currency_select .dropdown-item.active,
.currency_select .dropdown-item:active {
    background-color: #DCE2EF;
}

.currency_select .dropdown-header {
    background: #f7f4fe;
}

.currency_select .dropdown-divider {
    display: none;
}

.currency_select .dropdown-header span {
    font-size: 0.55rem !important;
    padding: 0.4rem;
    letter-spacing: 0.1rem;
    display: inline-block;
    color: #8b7aae;
}


/** currency_status **/

.currency_status {
    display: block;
    padding: 0 0.4rem;
}

.currency_status li {
    display: inline-block;
    padding: 0 1rem;
}

.currency_status li h5 {
    display: block;
    font-size: 14px;
    text-transform: capitalize;
    line-height: 1.5rem;
    color: #604d86;
}

.currency_status li h5 span {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    color: #000000;
}

.currency_status li h5 span small {
    font-size: 1.1rem;
}


/** dark_light_toggle **/

.dark_light_toggle {
    display: inline-block;
    border: 0;
    box-shadow: none;
    position: relative;
    height: 1.8rem;
    width: 1.8rem;
    border-radius: 50%;
}

.dark_light_toggle:before {
    position: absolute;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 1rem;
    line-height: 1.8rem;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}


/** block **/

.block {
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(240, 235, 252, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(240, 235, 252, 1);
    box-shadow: inset 0px 0px 0px 1px rgba(240, 235, 252, 1);
}

.block_head {
    display: flex;
    background: #DCE2EF;
    padding: 0.5rem 0.7rem 0.4rem 0.7rem;
}

.block_head h5 {
    display: inline-block;
    font-size: 1rem;
    font-weight: 500;
    text-transform: capitalize;
    color: #262424;
}

.dark_mode .block_head h5 {
    color: #96a1bf;
}

.price_stats {
    display: block;
    background: #DCE2EF;
}

.price_stats h4 {
    display: block;
    text-align: center;
    padding: 0.3rem 0;
    color: #262424;
    font-size: 1.2rem;
}

.price_stats small {
    font-weight: bold;
    color: #262424;
}


/** block_tab **/

.block_tab {
    background: #f1f1f1;
    padding: 0.3rem;
}

.block_tab .nav {
    background: none;
    padding: 0;
    margin: 0;
    border: none;
}

.block_tab nav-tabs {
    border: none;
}

.block_tab .nav-tabs .nav-item {
    margin: 0;
    padding: 0 0.1rem 0 0;
    display: inline-block;
}

.block_tab .nav-tabs .nav-link {
    margin: 0;
    border: none;
    border-radius: 0;
    background: none;
    font-size: 0.8rem;
    color: #4b3c6b;
    padding: .2rem .4rem;
    text-transform: uppercase;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204, 191, 226, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(204, 191, 226, 1);
    box-shadow: inset 0px 0px 0px 1px rgba(204, 191, 226, 1);
}

.block_tab .nav-tabs .active {
    -webkit-box-shadow: inset 0px 0px 0px 1px #F5564E;
    -moz-box-shadow: inset 0px 0px 0px 1px #F5564E;
    box-shadow: inset 0px 0px 0px 1px #F5564E;
    background: #ede7f8;
    color: #F5564E;
}


/** select_exchange **/

.select_exchange {
    font-size: 0.8rem;
    border-radius: 0;
    border-color: #ccbfe2;
    height: calc(1.2em + .75rem + 2px);
    padding: .375rem 1.75rem .375rem .5rem;
}

.table_trade .select_exchange {
    line-height: 1;
}

.select_decimal {
    width: 100px;
}

.select_exchange:focus,
.input_exchange .form-control:focus {
    border-color: #a4b2d1;
    outline: 0;
    box-shadow: none;
}


/** block_top **/

.block_top {
    background: #f1f1f1;
    padding: 0.3rem;
}

.radio_list_exchange {
    display: block;
}

.radio_list_exchange li {
    display: inline-block;
    padding: 0 0.2rem;
}


/** input_exchange **/

.input_exchange_pair {
    width: 100%;
}

.input_exchange .form-control {
    font-size: 0.8rem;
    height: calc(1.2em + .75rem + 2px);
    font-size: 0.8rem;
    border-radius: 0;
    border-color: #ced9f1;
}

.input_exchange>.input-group-append:last-child>.btn:not(:last-child):not(.dropdown-toggle),
.input_exchange>.input-group-append:last-child>.input-group-text:not(:last-child),
.input_exchange>.input-group-append:not(:last-child)>.btn,
.input_exchange>.input-group-append:not(:last-child)>.input-group-text,
.input_exchange>.input-group-prepend>.btn,
.input_exchange>.input-group-prepend>.input-group-text {
    border-radius: 0;
}

.input_exchange .input-group-text {
    font-size: 0.8rem;
    padding: .375rem .5rem;
    border-color: #ccbfe2;
    background-color: #DCE2EF;
    color: #282F44;
}


/** radio_exchange **/

.radio_exchange .custom-control-label {
    font-size: 0.8rem;
}

.radio_exchange .custom-control {
    line-height: 1.5rem;
    padding-left: 1.2rem;
}

.radio_exchange .custom-control-label::before {
    width: 0.8rem;
    height: 0.8rem;
    left: -1.2rem;
}

.radio_exchange .custom-control-label::after {
    top: .25rem;
    left: -1.24rem;
    width: 0.9rem;
    height: 0.9rem;
}

.dark_mode .radio_exchange .custom-control-label::after {
    width: 0.9rem;
    height: 0.9rem;
    left: -1.2rem;
    border-color: #0d1017;
    background-color: #171b27;
}

.radio_exchange .custom-control-input:checked~.custom-control-label::before {
    border-color: #8a5fa9;
    background-color: #ac86c7;
}

.radio_exchange .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 .2rem rgba(138, 95, 165, .25);
}


/** trade_candle_chart **/

.trade_candle_chart {
    display: block;
}

.trade_candle_chart iframe {
    height: 100% !important;
}

.trade_candle_dark,
.trade_candle_light {
    width: 100%;
}

.trade_candle_light #tradingview_df685,
.trade_candle_dark #tradingview_3d8bd {
    height: 385px;
}

.trade_candle_dark .chart-page .chart-container {
    background: #141723 !important;
}

.trade_candle_chart .trade_candle_dark {
    display: none !important;
}

.trade_candle_chart .trade_candle_light {
    display: block !important;
}

.trade_candle_chart_2 .trade_candle_dark {
    display: block !important;
}

.trade_candle_chart_2 .trade_candle_light {
    display: none !important;
}

#widget-container {
    border-radius: 0 !important;
}


/** buy_sell_block **/

.buy_sell_tab {
    background: #DCE2EF;
}

.buy_sell_tab .nav {
    background: none;
    padding: 0;
    margin: 0;
    border: none;
}

.buy_sell_tab nav-tabs {
    border: none;
}

.buy_sell_tab .nav-tabs .nav-item {
    margin: 0;
    padding: 0 0.1rem 0 0;
    display: inline-block;
}

.buy_sell_tab .nav-tabs .nav-link {
    margin: 0;
    border: none;
    border-radius: 0;
    background: none;
    font-size: 0.8rem;
    font-weight: bold;
    color: #4b3c6b;
    padding: .4rem .5rem;
    text-transform: uppercase;
}

.buy_sell_tab .nav-tabs .active {
    background: #ffffff;
    color: #282F44;
}


/** buy_sell_block **/

.buy_sell_block {
    background: #F7F4FD;
}

.buy_sell_block_inner {
    display: block;
    min-height: 288px;
    padding: 0.5rem;
}

.buy_sell_block_inner h4 {
    font-size: 0.8rem;
    font-weight: bold;
    color: #212529;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
}

.input_exchange label {
    font-size: 0.8rem;
    margin-bottom: 0.2rem;
}

.input_exchange_buy_sell label {
    min-width: 60px;
}

.input_exchange_buy_sell .form-control {
    padding: .375rem .25rem;
}


/** buy_sell_percent **/

.buy_sell_percent {
    display: block;
}

.buy_sell_percent li {
    display: inline-block;
    padding: 0 2px;
    width: 100%;
}

.buy_sell_percent li a {
    width: 100%;
    display: inline-block;
    font-size: 0.8rem;
    color: #212529;
    text-align: center;
    padding: 0.15rem 0;
    background: #ffffff;
    -webkit-box-shadow: 0px 0px 0px 1px #ced9f1;
    -moz-box-shadow: 0px 0px 0px 1px rgba(204, 191, 226, 1);
    box-shadow: 0px 0px 0px 1px #ced9f1;
}

.buy_sell_percent li a:hover,
.buy_sell_percent li a:focus {
    background: #DCE2EF;
    color: #212529;
}

.btn-buy,
.btn-sell {
    display: block;
    border-radius: 0;
    border: none;
    box-shadow: none;
    font-size: 1rem;
    color: #ffffff;
    padding: 0.2rem 0.4rem;
}

.btn-buy {
    background: #66A81A;
}

.btn-sell {
    background: #F5564E;
}

.btn-buy:hover,
.btn-buy:focus,
.btn-sell:hover,
.btn-sell:focus {
    opacity: 0.6;
}

.buy_sell_block .col-md-6 {
    -webkit-box-shadow: inset -1px 0px 0px 0px rgba(237, 231, 248, 1);
    -moz-box-shadow: inset -1px 0px 0px 0px rgba(237, 231, 248, 1);
    box-shadow: inset -1px 0px 0px 0px rgba(237, 231, 248, 1);
}

.buy_sell_block .col-md-6:last-child {
    box-shadow: none;
}

.total_fee {
    display: block;
    padding: 0.1rem 0;
}

.dark_mode .total_fee {
    color: rgba(255, 255, 255, 0.5);
}

.total_fee span {
    display: flex;
    font-size: 0.8rem;
    font-weight: 600;
}

.total_fee span small {
    display: inline-block;
    margin-left: auto;
    font-size: 0.8rem;
    color: #000000;
    font-weight: normal;
    width: 8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
}


/** select_open_order **/

.select_open_order {
    width: 100px;
    padding: 0;
    margin: 0;
    height: auto;
}


/** check_list_exchange **/

.check_list_exchange {
    display: block;
}

.check_list_exchange li {
    display: inline-block;
    padding: 0 0.2rem;
}


/** checkbox_exchange **/

.checkbox_exchange .custom-control-label {
    font-size: 0.8rem;
}

.checkbox_exchange .custom-control {
    line-height: 1.5rem;
    padding-left: 1.2rem;
}

.checkbox_exchange .custom-control-label::before {
    width: 0.8rem;
    height: 0.8rem;
    left: -1.2rem;
    border-radius: 0;
}

.checkbox_exchange .custom-control-label::after {
    top: .2rem;
    left: -1.24rem;
    width: 0.9rem;
    height: 0.9rem;
}

.checkbox_exchange .custom-control-input:checked~.custom-control-label::before {
    border-color: #8a5fa9;
    background-color: #ac86c7;
}

.checkbox_exchange .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 .2rem rgba(138, 95, 165, .25);
}


/*************************************************************************
dark light mode
**************************************************************************/


/** dark_mode **/

.dark_mode {
    background: #171b27;
}

.dark_mode::before {
    background: url(../img/spiral_bg_2.svg) no-repeat center;
}

.dark_mode .dark_light_toggle {
    background-color: #3c4561;
    color: #fff;
}

.dark_mode .dark_light_toggle:before {
    content: "\f185";
}

.dark_mode .currency_select .dropdown-menu {
    background: #0F091D;
    -webkit-box-shadow: 0px 0px 0px 1px rgba(29, 20, 52, 1);
    -moz-box-shadow: 0px 0px 0px 1px rgba(29, 20, 52, 1);
    box-shadow: 0px 0px 0px 1px rgba(29, 20, 52, 1);
}

.dark_mode .currency_select .dropdown-header {
    background: #1d1434;
}

.dark_mode .currency_select .dropdown-item {
    color: #8b7aae;
}

.dark_mode .currency_select .dropdown-item.active,
.dark_mode .currency_select .dropdown-item:focus,
.dark_mode .currency_select .dropdown-item:hover {
    background-color: #422e6a;
}

.dark_mode .currency_status li h5 {
    color: #96a1bf;
}

.dark_mode .currency_status li h5 span {
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .block_head {
    background: #282F44;
}

.dark_mode .block_tab {
    background: rgb(49, 57, 82);
}

.dark_mode .block_tab .nav-tabs .nav-link {
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204, 191, 226, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(204, 191, 226, 1);
    box-shadow: inset 0px 0px 0px 1px rgb(37, 18, 70);
}

.dark_mode .block_tab .nav-tabs .active {
    background: #1d1131;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(242, 1, 39, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(242, 1, 39, 1);
    box-shadow: inset 0px 0px 0px 1px rgb(242, 1, 39, 1);
}

.trade_advance .block_tab .nav-tabs .active {
    background: #1d1131;
    -webkit-box-shadow: inset 0px 0px 0px 1px #d0daf3;
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(242, 1, 39, 1);
    box-shadow: inset 0px 0px 0px 1px #d0daf3;
}

.dark_mode .table_trade table th,
.dark_mode .table_trade .dataTables_scrollHead {
    background: #3c4561;
}

.dark_mode .table_trade table tbody td {
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .block {
    -webkit-box-shadow: inset 0px 0px 0px 1px rgb(41, 29, 72);
    -moz-box-shadow: inset 0px 0px 0px 1px rgb(41, 29, 72);
    box-shadow: inset 0px 0px 0px 1px rgb(41, 29, 72);
}

.dark_mode .block_top {
    background: #3c4561;
}

.dark_mode .price_stats {
    background: #282F44;
}

.dark_mode .price_stats small {
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .block_tab .nav-tabs .nav-link {
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .block_tab .nav-tabs .active {
    color: #f20127;
}

.trade_advance .block_tab .nav-tabs .active {
    color: #d0daf3;
}

.dark_mode .input_exchange .form-control {
    border-color: #3c4561;
    background: rgb(35, 41, 58);
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .input_exchange .input-group-text {
    border-color: #3c4561;
    background-color: rgb(35, 41, 58);
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .select_exchange {
    border-color: rgb(35, 41, 58);
    background-color: rgb(35, 41, 58);
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .custom-control-label {
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .table_trade .dataTables_scrollBody {
    scrollbar-color: #282F44;
}

.dark_mode .table_trade .dataTables_scrollBody::-webkit-scrollbar-track {
    background-color: #282F44;
}

.dark_mode .table_trade .dataTables_scrollBody::-webkit-scrollbar {
    width: 4px;
    background-color: #282F44;
}

.dark_mode .table_trade .dataTables_scrollBody::-webkit-scrollbar-thumb {
    background-color: #FAB95B;
}

.dark_mode .buy_sell_tab {
    background: #282F44;
}

.dark_mode .buy_sell_tab .nav-tabs .nav-link {
    color: #96a1bf;
}

.dark_mode .buy_sell_block {
    background: #1e2331;
}

.dark_mode .buy_sell_tab .nav-tabs .active {
    background: #1e2331;
    color: #cbcfdc;
}

.dark_mode .input_exchange label {
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .total_fee span small {
    color: rgba(255, 255, 255, 0.5);
}

.dark_mode .buy_sell_percent li a {
    color: rgba(255, 255, 255, 0.5);
    background: rgb(35, 41, 58);
    -webkit-box-shadow: 0px 0px 0px 1px rgba(52, 37, 81, 1);
    -moz-box-shadow: 0px 0px 0px 1px rgba(52, 37, 81, 1);
    box-shadow: 0px 0px 0px 1px #3c4561;
}

.dark_mode .buy_sell_percent li a:hover,
.dark_mode .buy_sell_percent li a:focus {
    background: #1b112d;
    color: #f20127;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(242, 1, 37, 1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(242, 1, 37, 1);
    box-shadow: inset 0px 0px 0px 1px rgba(242, 1, 37, 1);
}

.dark_mode .trade_candle_chart .trade_candle_dark {
    display: block !important;
}

.dark_mode .trade_candle_chart .trade_candle_light {
    display: none !important;
}

.dark_mode .buy_sell_block .col-md-6 {
    -webkit-box-shadow: inset -1px 0px 0px 0px rgba(46, 34, 68, 1);
    -moz-box-shadow: inset -1px 0px 0px 0px rgba(46, 34, 68, 1);
    box-shadow: inset -1px 0px 0px 0px rgba(46, 34, 68, 1);
}

.dark_mode .buy_sell_block .col-md-6:last-child {
    box-shadow: none;
}


/** light_mode **/

.light_mode {
    background: #ffffff;
}

.light_mode .dark_light_toggle {
    background-color: #DCE2EF;
    color: #212529;
}

.light_mode .dark_light_toggle:before {
    content: "\f186";
}


/*************************************************************************
footer
**************************************************************************/

footer {
    display: block;
    background: #181129;
    padding: 2rem 0 1rem;
    position: relative;
    overflow: hidden;
}

footer:before {
    content: "";
    position: absolute;
    background: url(../img/circles.svg) no-repeat center;
    width: 20rem;
    height: 20rem;
    left: -7rem;
    bottom: -5rem;
}

footer::after {
    content: "";
    position: absolute;
    background: url(../img/circles.svg) no-repeat center;
    width: 45rem;
    height: 45rem;
    right: -20rem;
    bottom: -15rem;
    z-index: 0;
}

.footer_logo {
    display: block;
    margin-bottom: 1.875rem;
    position: relative;
    z-index: 1;
}

.footer_logo a {
    display: inline-block;
}

.footer_logo a img {
    display: inline-block;
}

.footer_top_right {
    display: block;
    text-align: right;
    margin-bottom: 1.875rem;
    position: relative;
    z-index: 1;
}

.footer_subscribe label {
    margin: 0;
    font-size: 1rem;
    color: #9183b1;
    font-weight: bold;
}


/** input-group-subscribe **/

.input-group-subscribe {
    width: 460px;
    background: #0f091d;
    border-radius: 6rem;
    padding: 0.469rem 0.625rem;
}

.input-group-subscribe .btn {
    min-width: auto;
    width: 3.438rem;
    height: 3.438rem;
    line-height: 3.438;
    padding: 0;
    border-radius: 50% !important;
}

.input-group-subscribe .btn:after {
    border-radius: 50%;
}

.input-group-subscribe .form-control {
    color: #77669f !important;
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none !important;
    padding: 0 0.8rem;
    line-height: normal;
    height: auto;
    font-size: 1rem;
}


/** footer_middle **/

.footer_middle {
    display: block;
    margin-bottom: 2.2rem;
    position: relative;
    z-index: 1;
}

.footer_title {
    display: block;
    font-size: 1rem;
    color: #9183b1;
    margin-bottom: 0.7rem;
    font-weight: bold;
}

.footer_middle p {
    display: block;
    color: #584c75;
    font-size: 0.875rem;
    font-family: 'Open Sans', sans-serif;
    line-height: 1.875rem;
}

.footer_contact {
    display: block;
}

.footer_contact li {
    display: block;
    font-size: 0.875rem;
    color: #584c75;
    line-height: 1.875rem;
}

.footer_contact li i {
    color: #9183b1;
    margin-right: 0.838rem;
}

.q_links {
    display: block;
    font-size: 0;
}

.q_links li {
    display: inline-block;
    width: 50%;
}

.q_links li a {
    font-size: 0.875rem;
    color: #584c75;
    line-height: 1.875rem;
    transition: all .2s ease-in-out !important;
    -webkit-transition: all .2s ease-in-out !important;
    -moz-transition: all .2s ease-in-out !important;
    -o-transition: all .2s ease-in-out !important;
}

.q_links li a:focus,
.q_links li a:hover {
    color: #9183b1;
}

.q_links li a:before {
    content: "\f054";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.625rem;
    padding-right: 0.625rem;
}

.footer_bottom {
    -webkit-box-shadow: 0px -1px 0px 0px rgba(88, 76, 117, 1);
    -moz-box-shadow: 0px -1px 0px 0px rgba(88, 76, 117, 1);
    box-shadow: 0px -1px 0px 0px rgba(88, 76, 117, 1);
    padding-top: 1rem;
    position: relative;
    z-index: 1;
}

.footer_bottom h6 {
    display: block;
    font-size: 0.875rem;
    text-transform: capitalize;
    color: #584c75;
}

.footer_bottom ul {
    display: block;
    text-align: right;
}

.footer_bottom ul li {
    display: inline-block;
    padding: 0 0.8rem;
    position: relative;
}

.footer_bottom ul li:before {
    content: "";
    position: absolute;
    border-left: 1px solid #584c75;
    width: 1px;
    height: 13px;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.footer_bottom ul li:first-child:before {
    display: none;
}

.footer_bottom ul li a {
    display: inline-block;
    font-size: 0.875rem;
    text-transform: capitalize;
    color: #584c75;
    transition: all .2s ease-in-out !important;
    -webkit-transition: all .2s ease-in-out !important;
    -moz-transition: all .2s ease-in-out !important;
    -o-transition: all .2s ease-in-out !important;
}

.footer_bottom ul li a:focus,
.footer_bottom ul li a:hover {
    color: #9183b1;
}


/******************************************************
exchange - advance
******************************************************/


/** header **/

.trade_advance header {
    display: block;
    position: inherit;
    z-index: auto;
    background: #282F44;
    padding: 0.3rem;
}

.trade_advance .main_body {
    padding: 0;
}

.trade_advance .main_body::after {
    display: none;
}

.trade_advance .exchange_banner_left ul li a {
    font-size: 0.75rem;
    padding: 0.4rem 0.5rem;
}

.trade_advance .currency_status li {
    padding: 0 0.85rem;
}

.trade_advance .currency_status li h5 {
    font-size: 0.8rem;
    line-height: 1.2rem;
}

.trade_advance .currency_status li h5 span,
.trade_advance .currency_status li h5 span small {
    font-size: 0.9rem;
}

.trade_advance .currency_select .btn {
    font-size: 1.1rem;
}

.trade_top_links {
    display: block;
    padding: 0 0.5rem;
}

.trade_top_links li {
    display: inline-block;
    padding: 0 0.5rem;
}

.trade_top_links li a {
    display: inline-block;
    color: #584c75;
    font-size: 0.75rem;
}

.trade_advance .trade_top_links li a {
    color: #96a1bf;
}

.trade_top_links li a i {
    font-size: 0.7rem;
}

.trade_top_links li a:hover,
.trade_top_links li a:focus {
    color: #f20127;
}


/** trade main_body **/

.trade_advance .main_body {
    display: block;
    height: calc(100vh - 55px);
}

.trade_advance .buy_sell_block_inner {
    height: 288px;
    padding: 0;
}

.trade_advance .buy_sell_block_inner h4 {
    margin-bottom: 0.4rem;
}

.trade_advance .price_stats h4 {
    color: #262424;
    font-size: 1.1rem;
    padding: 0.05rem 0;
}

.block_left_bottom {
    height: calc(100vh - 453px);
    overflow: hidden;
}

.block_right_top_left {
    height: calc(100vh - 384px);
    overflow: hidden;
}

.block_right_top_right {
    height: calc(100vh - 384px);
    overflow: hidden;
}

.buy_sell_order_advance {
    height: calc(100vh - 423px);
}

#buy_sell_order .table_trade {
    height: 50%;
    overflow: hidden;
}

.select_scroll {
    min-width: 130px;
    width: auto !important;
}

.currency_select .btn-light {
    background: none !important;
    color: #1A3263;
}

.dark_mode .buy_sell_block_inner h4 {
    color: #96a1bf;
}

.dark_mode .table_trade table th {
    color: #7d869c;
}

.trade_advance .currency_select .btn-light:not(:disabled):not(.disabled).active,
.trade_advance .currency_select .btn-light:not(:disabled):not(.disabled):active,
.trade_advance .currency_select.show>.btn-light.dropdown-toggle {
    color: #d0daf3 !important;
}

.trade_advance .currency_select .dropdown-menu {
    background: #313952;
    -webkit-box-shadow: 0px 0px 0px 1px #313952;
    -moz-box-shadow: 0px 0px 0px 1px #313952;
    box-shadow: 0px 0px 0px 1px #313952;
}

.trade_advance .currency_select .dropdown-item.active,
.trade_advance .currency_select .dropdown-item:focus,
.trade_advance .currency_select .dropdown-item:hover {
    background-color: #3c4561;
}

.trade_advance .currency_select .dropdown-item {
    color: #c0c7ec;
}

.trade_advance .buy_sell_percent li a:hover,
.trade_advance .buy_sell_percent li a:focus {
    background: #3c4561;
    color: #7d869c;
    -webkit-box-shadow: inset 0px 0px 0px 1px #3c4561;
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(242, 1, 37, 1);
    box-shadow: inset 0px 0px 0px 1px #3c4561;
}

/* Absolute Center Spinner */
.loading {
  position: fixed;
  z-index: 999;
  height: 2em;
  width: 2em;
  overflow: visible;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* Transparent Overlay */
.loading:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.3);
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.loading:not(:required):after {
  content: '';
  display: block;
  font-size: 10px;
  width: 1em;
  height: 1em;
  margin-top: -0.5em;
  -webkit-animation: spinner 1500ms infinite linear;
  -moz-animation: spinner 1500ms infinite linear;
  -ms-animation: spinner 1500ms infinite linear;
  -o-animation: spinner 1500ms infinite linear;
  animation: spinner 1500ms infinite linear;
  border-radius: 0.5em;
  -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
  box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
}