:root {
    --hbg-global-text-color: #000;
    --hbg-global-rise-color: #0094ff;
    --hbg-global-fall-color: #e94359;
    --hbg-header-height: 64px;
    --hbg-header-item-height: 64px
}

@media screen and (max-width:743px) {
    :root {
        --hbg-header-height: 44px;
        --hbg-header-item-height: 44px
    }
}

:root .global-common-header--mobile {
    --hbg-header-height: 44px;
    --hbg-header-item-height: 44px
}

:root .global-common-header--stacking {
    --hbg-header-height: 128px
}

.global-common-header,
.hbg-drawer {
    --hbg-header-main-bgcolor: #161616;
    --hbg-header-main-txtcolor: #e6e6e6;
    --hbg-header-primary-color: #0094ff;
    --hbg-header-main-hover-bgcolor: #313132;
    --hbg-header-dropdown-bgcolor: #1e1e1f;
    --hbg-header-three-bgcolor: #1e1e1f;
    --hbg-header-three-color: #f0f1f4;
    --hbg-header-three-item-hovercolor: #313132;
    --hbg-header-three-hovercolor: #0094ff;
    --hbg-header-secondary-txtcolor: #8c8c93;
    --hbg-header-tertiary-txtcolor: #b2b8c7;
    --hbg-header-split-color: hsla(0, 0%, 100%, .06);
    --hbg-header-scrollbar-bgcolor: hsla(0, 0%, 100%, .07);
    --hbg-header-button-color: #8c8c93;
    --hbg-header-button-hovercolor: #313132;
    --hbg-header-user-txt-color: #d7ddeb
}

.global-common-header--light,
.hbg-drawer--light {
    --hbg-header-main-bgcolor: #fff;
    --hbg-header-main-txtcolor: #000;
    --hbg-header-primary-color: #0173e5;
    --hbg-header-main-hover-bgcolor: #f5f5f5;
    --hbg-header-dropdown-bgcolor: #fff;
    --hbg-header-secondary-txtcolor: #565656;
    --hbg-header-tertiary-txtcolor: #575759;
    --hbg-header-three-bgcolor: #fff;
    --hbg-header-three-color: #000;
    --hbg-header-three-item-hovercolor: #f5f5f5;
    --hbg-header-three-hovercolor: #0173e5;
    --hbg-header-split-color: rgba(0, 0, 0, .06);
    --hbg-header-scrollbar-bgcolor: rgba(0, 0, 0, .07);
    --hbg-header-button-color: #565656;
    --hbg-header-button-hovercolor: #f5f5f5;
    --hbg-header-user-txt-color: #000
}

.mini-toastr {
    position: fixed;
    top: 90px;
    right: 15px;
    z-index: 99999999;
    display: flex;
    flex-direction: column;
    color: #263241
}

.mini-toastr.rb {
    top: unset;
    bottom: 36px
}

@keyframes slideInto {
    0% {
        transform: translateX(100%)
    }

    to {
        transform: translateX(0)
    }
}

@keyframes enSlideInto {
    0% {
        transform: translateX(-100%)
    }

    to {
        transform: translateX(0)
    }
}

.mini-toastr__notification {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-width: 220px;
    max-width: 400px;
    margin-bottom: 10px;
    padding: 21px 16px;
    font-size: 14px;
    white-space: pre-wrap;
    text-align: left;
    word-break: break-all;
    background: #fff;
    border-left: 4px solid;
    border-radius: 3px;
    box-shadow: 0 4px 16px rgba(69, 97, 137, .2);
    cursor: pointer
}

html.mobile .mini-toastr__notification {
    padding: 42px 32px;
    font-size: 28px
}

.mini-toastr__notification.devices-toast {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 24px 24px 24px 52px;
    color: #4b5565;
    font-size: 14px;
    line-height: 20px
}

.mini-toastr__notification.devices-toast .mini-toastr-notification__icon {
    position: absolute;
    top: 24px;
    left: 20px;
    margin: 0;
    color: #0173e5
}

.mini-toastr__notification.devices-toast .mini-toastr-notification__title {
    color: #1c242c;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px
}

.mini-toastr__notification.devices-toast .mini-toastr-notification__message {
    display: flex;
    flex-direction: column;
    margin-top: 8px;
    color: #4b5565
}

.mini-toastr__notification.devices-toast a {
    margin-top: 16px;
    font-weight: 500;
    line-height: 14px
}

.mini-toastr-in {
    animation: slideInto .5s
}

.mini-toastr-out {
    transform: translateX(120%);
    transition: .8s ease-out
}

.mini-toastr-notification__icon {
    display: inline-block;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-right: 12px;
    font-size: 20px;
    line-height: 20px
}

html.mobile .mini-toastr-notification__icon {
    width: 30px;
    height: 30px;
    font-size: 30px;
    line-height: 30px
}

.-error {
    border-left-color: #fa5252
}

.-success {
    border-left-color: #12b886
}

.-info {
    border-left-color: #0173e5
}

.fed-icon__arrow {
    position: relative;
    width: 20px;
    height: 20px;
    display: inline-block
}

.fed-icon__arrow:after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 8px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-arrow-right.97a43c7f.svg) no-repeat;
    transform: translate(-50%, -50%);
    content: ""
}

.fed-icon__arrow--white:after {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-arrow-right-white.e34a0d5a.svg)
}

.fed-icon__arrow--right {
    position: relative;
    width: 20px;
    height: 20px;
    display: inline-block
}

.fed-icon__arrow--right:after {
    position: absolute;
    top: 50%;
    left: 100%;
    width: 5px;
    height: 8px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-arrow-right.97a43c7f.svg) no-repeat;
    transform: translate(-100%, -50%);
    content: ""
}

.fed-icon__arrow--right--white:after {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-arrow-right-white.e34a0d5a.svg)
}

.global-common-header--dark .fed-icon__arrow--right:after,
.global-common-header--dark .fed-icon__arrow:after,
.hbg-drawer--dark .fed-icon__arrow--right:after,
.hbg-drawer--dark .fed-icon__arrow:after {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-arrow-right--dark.9f779064.svg)
}

i.coin-icon_box {
    display: inline-block;
    overflow: hidden;
    font-size: 0;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: contain;
    border-radius: 50%
}

i.coin-icon_box .coin_icon {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    opacity: 0
}

*,
:after,
:before {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    outline: none
}

.tile {
    display: block;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 1;
    align-items: stretch;
    min-height: -moz-min-content;
    min-height: min-content
}

.fed-ly-columns {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%
}

.fed-ly-columns>* {
    margin-bottom: 2px
}

.fed-ly-columns>:last-child {
    margin-bottom: 0
}

.fed-ly-columns.is-right {
    align-items: flex-end
}

.fed-ly-columns.is-right .hbg-finance-cell-item__label {
    font-weight: 500
}

.fed-text-align.is-right {
    text-align: right
}

.loading-container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%
}

.loading-container .img-container {
    width: 32px;
    height: 32px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/loading.179d9a66.svg) no-repeat 50%;
    background-size: 32px 32px
}

.coin_box {
    display: inline-block;
    display: flex;
    align-items: center;
    justify-items: center;
    overflow: hidden;
    font-size: 0;
    background-size: contain;
    border-radius: 50%
}

.coin_box .coin_icon {
    width: 100%;
    height: 100%;
    vertical-align: middle;
    border-radius: 50%;
    opacity: 0
}

.animated {
    animation-duration: .4s;
    animation-fill-mode: both
}

.animated.infinite {
    animation-iteration-count: infinite
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.fadeIn {
    animation-name: fadeIn
}

@keyframes fadeInDown {
    0% {
        transform: translate3d(0, -100%, 0);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes noani {
    0% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

@keyframes logo {
    0% {
        background: hsla(0, 0%, 100%, .4);
        transform: skewX(25deg) translate(-20px)
    }

    to {
        background: #fff;
        transform: skewX(25deg) translate(100px)
    }
}

@keyframes fadeInDropdown {
    0% {
        transform: translate3d(0, -48px, 0);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes fadeOutDropdown {
    0% {
        transform: translateZ(0);
        opacity: 1
    }

    to {
        transform: translate3d(0, -48px, 0);
        opacity: 0
    }
}

.fadeInDown {
    animation-name: fadeInDown
}

@keyframes fadeInRight {
    0% {
        transform: translate3d(-10px, 0, 0);
        opacity: 0
    }

    to {
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes widthIn {
    0% {
        width: 0
    }

    to {
        width: 100%
    }
}

.vue-recycle-scroller {
    position: relative
}

.vue-recycle-scroller.direction-vertical:not(.page-mode) {
    overflow-y: auto
}

.vue-recycle-scroller.direction-horizontal:not(.page-mode) {
    overflow-x: auto
}

.vue-recycle-scroller.direction-horizontal {
    display: flex
}

.vue-recycle-scroller__slot {
    flex: auto 0 0;
    -webkit-box-flex: 1
}

.vue-recycle-scroller__item-wrapper {
    position: relative;
    flex: 1;
    box-sizing: border-box;
    overflow: hidden;
    -webkit-box-flex: 1
}

.vue-recycle-scroller.ready .vue-recycle-scroller__item-view {
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform
}

.vue-recycle-scroller.direction-vertical .vue-recycle-scroller__item-wrapper {
    width: 100%
}

.vue-recycle-scroller.direction-horizontal .vue-recycle-scroller__item-wrapper {
    height: 100%
}

.vue-recycle-scroller.ready.direction-vertical .vue-recycle-scroller__item-view {
    width: 100%
}

.vue-recycle-scroller.ready.direction-horizontal .vue-recycle-scroller__item-view {
    height: 100%
}

.resize-observer {
    background-color: transparent;
    border: none;
    opacity: 0
}

.resize-observer,
.resize-observer object {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none
}

.global-common-header,
.hbg-drawer {
    --fed-btn-triangle-border-color: hsla(0, 0%, 100%, .15);
    --fed-btn-block-bgcolor: #1e1e1f;
    --fed-btn-block-bgcolor-hover: #313132;
    --fed-btn-block-txt-color: #d7ddeb;
    --fed-btn-block-hovercolor: #8c8c93;
    --fed-btn-default-color: #0094ff;
    --fed-btn-default-bgcolor: rgba(1, 115, 229, .1);
    --fed-btn-primary-color: #fff;
    --fed-btn-primary-bgcolor: #0094ff
}

.global-common-header--light,
.hbg-drawer--light {
    --fed-btn-triangle-border-color: rgba(0, 0, 0, .15);
    --fed-btn-block-bgcolor: #fff;
    --fed-btn-block-bgcolor-hover: #f0f0f0;
    --fed-btn-block-txt-color: #000;
    --fed-btn-block-hovercolor: #8a8a8e;
    --fed-btn-default-color: #0173e5;
    --fed-btn-default-bgcolor: rgba(1, 115, 229, .1);
    --fed-btn-primary-color: #fff;
    --fed-btn-primary-bgcolor: #007cd6
}

.fed-btn-triangle {
    position: relative;
    height: 18px;
    padding: 0 11px 0 2px;
    display: inline-block;
    overflow: visible;
    color: var(--hbg-header-main-txtcolor);
    font-size: 12px;
    line-height: 16px;
    border-top: 1px solid var(--fed-btn-triangle-border-color);
    border-bottom: 1px solid var(--fed-btn-triangle-border-color)
}

.fed-btn-triangle:before {
    top: -1px;
    transform: rotate(42deg);
    transform-origin: 0 0
}

.fed-btn-triangle:after,
.fed-btn-triangle:before {
    position: absolute;
    left: 0;
    height: 12px;
    border-left: 1px solid var(--fed-btn-triangle-border-color);
    content: ""
}

.fed-btn-triangle:after {
    bottom: -1px;
    transform: rotate(-42deg);
    transform-origin: 0 100%
}

.fed-btn-block {
    height: 48px;
    color: var(--fed-btn-block-txt-color);
    background: var(--fed-btn-block-bgcolor);
    line-height: 48px;
    text-align: center;
    cursor: pointer
}

.fed-btn-block:hover {
    color: var(--fed-btn-block-hovercolor);
    background: var(--fed-btn-block-bgcolor-hover)
}

.fed-btn {
    height: 30px;
    padding: 0 16px;
    display: inline-block;
    border-radius: 4px;
    color: var(--fed-btn-default-color);
    line-height: 30px;
    white-space: nowrap;
    text-align: center;
    text-decoration: none;
    background: var(--fed-btn-default-bgcolor);
    cursor: pointer
}

.fed-btn--primary,
.fed-btn--primary:hover {
    color: var(--fed-btn-primary-color);
    background: var(--fed-btn-primary-bgcolor)
}

.fed-btn--block {
    display: block
}

.global-common-header,
.hbg-drawer {
    --hbg-cell-subtitle-color: rgba(240, 241, 244, .5)
}

.global-common-header--light,
.hbg-drawer--light {
    --hbg-cell-subtitle-color: rgba(0, 0, 0, .5)
}

.hbg-cell {
    height: 44px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.hbg-cell__title {
    display: flex;
    flex: 1;
    justify-items: center;
    font-size: 14px
}

.hbg-cell__title p {
    margin: 0
}

.hbg-cell__kyc {
    line-height: 18px
}

.hbg-cell__kyc p {
    max-width: 185px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.hbg-cell__kyc i {
    width: 20px;
    height: 14px;
    margin: 3px 0 0 8px;
    display: block;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/duomini-logo.7144dc15.svg)
}

.hbg-cell__kyc span {
    height: 20px;
    margin-left: 8px;
    padding: 0 4px;
    display: block;
    font-size: 12px;
    line-height: 18px;
    border-radius: 2px
}

.hbg-cell__kyc_c0 {
    color: #00a171;
    border: 1px solid #00a171
}

.hbg-cell__kyc_c1 {
    color: #fe8731;
    border: 1px solid #fe8731
}

.hbg-cell__kyc_c2 {
    color: #edbf60;
    border: 1px solid #edbf60
}

.hbg-cell__icon {
    width: 24px;
    height: 24px;
    margin-right: 4px
}

.hbg-cell__content {
    color: var(--hbg-cell-subtitle-color);
    font-size: 14px
}

.hbg-cell.is-link {
    cursor: pointer
}

.hbg-cell.is-link:hover {
    background: var(--hbg-header-main-hover-bgcolor)
}

.hbg-cell.is-link:hover,
a.hbg-cell {
    color: var(--hbg-header-main-txtcolor)
}

a.hbg-cell {
    text-decoration: none;
    cursor: pointer
}

a.hbg-cell:hover {
    color: var(--hbg-header-main-txtcolor)
}

.hbg-cell-group {
    background: var(--hbg-header-main-bgcolor)
}

.fed-nft-avatar {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.fed-nft-avatar__lottie {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%
}

.fed-nft-avatar--mask {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 90%;
    height: 90%;
    transform: translate(-50%, -50%);
    -webkit-mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nft-mask.4841cdbb.png);
    mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nft-mask.4841cdbb.png);
    -webkit-mask-mode: match-source;
    mask-mode: match-source;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    -webkit-mask-position: center center;
    mask-position: center center
}

.fed-nft-avatar--mask>img {
    width: 100% !important;
    height: 100% !important
}

.fed-nft-avatar-mask {
    position: absolute;
    top: 50%;
    left: 50%;
    overflow: hidden;
    transform: translate(-50%, -50%) rotate(120deg)
}

.fed-nft-avatar-mask__box2,
.fed-nft-avatar-mask__box3 {
    width: 100%;
    height: 100%;
    overflow: hidden;
    transform: rotate(-60deg)
}

.global-common-header,
.hbg-drawer {
    --dropdown-content-subtitle-color: #5e5e61;
    --dropdown-active-bg-color: #313132;
    --dropdown-txt-color: #e6e6e6
}

.global-common-header--light,
.hbg-drawer--light {
    --dropdown-content-subtitle-color: #8a8a8e;
    --dropdown-active-bg-color: #f5f5f5;
    --dropdown-txt-color: #000
}

.global-common-header--light .hb-dropdown--open .toggle .toggle__triangle,
.hbg-drawer--light .hb-dropdown--open .toggle .toggle__triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow-active_light.142e8a85.svg);
    transform: rotate(180deg)
}

.hb-dropdown-wrap {
    position: relative;
    display: inline-block
}

.hb-dropdown-wrap .hb-dropdown__content {
    position: absolute;
    z-index: 9999;
    display: none;
    overflow: hidden;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, .06)
}

.hb-dropdown-wrap .hb-dropdown__content.show {
    display: block
}

.hb-dropdown-wrap .hb-dropdown__trigger {
    display: flex;
    align-items: center;
    height: 100%
}

.hb-dropdown-wrap .toggle {
    display: flex;
    align-items: center;
    padding: 0 12px
}

.hb-dropdown-wrap .toggle .toggle__triangle {
    width: 14px;
    height: 14px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow.1b8ea0d9.svg) no-repeat;
    transition: transform .2s ease-in-out
}

.hb-dropdown-wrap .toggle .toggle__triangle--expend {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow-active.47f5b369.svg);
    transform: rotate(180deg)
}

.trade-financing-dropdown .hb-dropdown__content,
.trade-financing-dropdown .hb-dropdown__content .hbg-seting {
    overflow: inherit !important
}

.hbg_small_search_dropdown .hb-dropdown__content {
    right: -80px !important
}

.hb-menu-dropdown .toggle {
    color: var(--hbg-header-main-txtcolor);
    cursor: pointer
}

.hb-menu-dropdown .toggle__title {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 14px
}

.hb-menu-dropdown .toggle__title .hbg-title-tag1 {
    position: absolute;
    top: -10px;
    left: 100%;
    transform: translateX(-12px)
}

.hb-menu-dropdown .toggle__icon {
    width: 20px;
    height: 20px;
    margin-right: 4px
}

.hb-menu-dropdown__body {
    height: 100%;
    padding: 12px 4px;
    color: var(--hbg-header-main-txtcolor);
    font-size: 14px;
    background: var(--hbg-header-dropdown-bgcolor);
    border-radius: 0 0 8px 8px
}

.hb-menu-dropdown__body--single {
    min-width: 288px;
    max-width: 400px;
    height: 100%
}

.hb-menu-dropdown__body--multi {
    display: flex;
    min-width: 200px;
    height: 100%;
    max-height: 500px
}

.hb-menu-dropdown__body--multi>div {
    flex: 1;
    flex-shrink: 0
}

.hb-menu-dropdown__body--default {
    padding: 0
}

.hb-menu-dropdown__body>div {
    height: 100%;
    overflow: auto
}

.hb-menu-dropdown__body__items {
    flex: 1;
    overflow: auto
}

.hb-menu-dropdown__body__items::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.hb-menu-dropdown__body__items::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hb-menu-dropdown__body__item {
    display: flex;
    align-items: center;
    height: 52px;
    padding: 16px 24px;
    overflow: hidden;
    color: var(--dropdown-txt-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer
}

.hb-menu-dropdown__body__item.active,
.hb-menu-dropdown__body__item:active,
.hb-menu-dropdown__body__item:hover {
    background: var(--dropdown-active-bg-color)
}

.hb-menu-dropdown__body__item.active {
    padding-right: 40px;
    font-weight: 500;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/checked.060529a4.svg);
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-size: 14px 14px
}

.hb-menu-dropdown__body__item--multi {
    display: flex;
    flex-direction: column;
    min-width: 200px
}

.hb-menu-dropdown__body__item--single {
    height: 100%;
    overflow: auto
}

.hb-menu-dropdown__body__item--single::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.hb-menu-dropdown__body__item--single::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hb-menu-dropdown__body__item__icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-right: 8px
}

.hb-menu-dropdown__body__item__txt {
    position: relative;
    flex: 1;
    overflow: hidden;
    line-height: 18px;
    white-space: normal;
    text-overflow: ellipsis
}

.hb-menu-dropdown__body__item__sub {
    padding: 16px 0 4px 24px;
    color: var(--dropdown-content-subtitle-color);
    line-height: 1.4;
    text-align: left
}

.hb-dropdown--open .toggle {
    position: relative;
    color: var(--hbg-header-main-txtcolor);
    background: var(--hbg-header-dropdown-bgcolor)
}

.hb-dropdown--open .toggle:after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: none;
    width: 100%;
    height: 2px;
    background: #0094ff;
    animation-name: widthIn;
    animation-duration: .3s;
    animation-fill-mode: both;
    content: ""
}

.hb-dropdown--open .toggle .toggle__triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow-active.47f5b369.svg);
    transform: rotate(180deg)
}

.hb-dropdown--open .hb-menu-dropdown__body {
    animation-name: fadeInDropdown;
    animation-duration: .3s;
    animation-timing-function: cubic-bezier(.16, 0, .18, 1);
    animation-fill-mode: both
}

.hb-dropdown--hide .toggle {
    position: relative;
    background: var(--hbg-header-dropdown-bgcolor)
}

.hb-dropdown--hide .toggle:after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: none;
    width: 100%;
    height: 2px;
    background: #0094ff;
    animation-name: widthIn;
    animation-duration: .3s;
    animation-fill-mode: both;
    content: ""
}

.hb-dropdown--hide .toggle .toggle__triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow-active.47f5b369.svg);
    transform: rotate(180deg)
}

.hb-dropdown--hide .hb-menu-dropdown__body {
    animation-name: fadeInDropdown;
    animation-duration: .3s
}

.hb-dropdown--hide .toggle {
    color: var(--hbg-header-main-txtcolor);
    background: var(--hbg-header-main-bgcolor)
}

.hb-dropdown--hide .toggle .toggle__triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow.1b8ea0d9.svg);
    transform: rotate(0)
}

.hb-dropdown--hide .hb-dropdown__content {
    overflow: hidden !important;
    pointer-events: none
}

.hb-dropdown--hide .hb-menu-dropdown__body {
    animation-name: fadeOutDropdown;
    animation-duration: .27s;
    animation-timing-function: cubic-bezier(.16, 0, .18, 1);
    animation-fill-mode: both;
    pointer-events: none
}

.header-nav__right .hb-dropdown__content {
    box-shadow: var(--hbg-dropdown-shadow)
}

.global-common-header {
    --hbg-dropdown-shadow: 0 8px 32px 0 rgba(0, 0, 0, .4)
}

.global-common-header--light {
    --hbg-dropdown-shadow: 0 10px 10px 0 rgba(0, 0, 0, .1)
}

.hbg-dropdown-v2 {
    position: relative
}

.hbg-dropdown-v2 :first-child {
    z-index: 3
}

.hbg-dropdown-v2 :nth-child(2) {
    z-index: 2
}

.hbg-dropdown-v2__trigger {
    height: 100%;
    padding: 0 12px;
    color: var(--hbg-header-main-txtcolor);
    background: var(--hbg-header-main-bgcolor);
    cursor: pointer
}

.hbg-dropdown-v2__trigger,
.hbg-dropdown-v2__trigger-title {
    display: flex;
    align-items: center
}

.hbg-dropdown-v2__trigger-title em {
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px;
    white-space: nowrap
}

.hbg-dropdown-v2__trigger-float-img {
    max-height: 64px;
    vertical-align: bottom
}

.hbg-dropdown-v2__trigger-triangle {
    width: 14px;
    height: 14px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow.1b8ea0d9.svg) no-repeat 50%;
    transition: transform .2s linear
}

.hbg-dropdown-v2__trigger-triangle--expend {
    transform: rotate(180deg)
}

.hbg-dropdown-v2__content {
    display: none;
    overflow: inherit !important;
    border-radius: 0 0 8px 8px;
    box-shadow: var(--hbg-dropdown-shadow)
}

.hbg-dropdown-v2__body {
    padding: 12px 4px;
    background: var(--hbg-header-dropdown-bgcolor);
    border-radius: 0 0 8px 8px
}

.hbg-dropdown-v2__body-item {
    display: flex;
    align-items: center;
    height: 80px;
    padding: 16px 24px 16px 0;
    cursor: pointer
}

.hbg-dropdown-v2__body-item-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    box-sizing: content-box;
    width: 70px;
    padding-left: 10px
}

.hbg-dropdown-v2__body-item-icon-img {
    width: 30px;
    height: 30px
}

.hbg-dropdown-v2__body-item-icon-placeholder {
    width: 30px;
    height: 30px;
    background-color: rgba(0, 0, 0, .3);
    border-radius: 50%
}

.hbg-dropdown-v2__body-item-content {
    flex: 1
}

.hbg-dropdown-v2__body-item-title {
    margin-bottom: 4px;
    color: var(--hbg-header-main-txtcolor);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px
}

.hbg-dropdown-v2__body-item-title-sub-float {
    position: relative;
    display: inline
}

.hbg-dropdown-v2__body-item-title-sub-float-img {
    position: absolute;
    bottom: 0;
    left: 10px;
    height: 34px
}

.hbg-dropdown-v2__body-item-subtitle {
    display: -webkit-box;
    overflow: hidden;
    color: var(--hbg-header-main-txtcolor);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px;
    text-overflow: ellipsis;
    opacity: .5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.hbg-dropdown-v2__body-item-three-right-icon {
    opacity: .5
}

.hbg-dropdown-v2__body-item:hover .hbg-dropdown-v2__body-item-three-right-icon {
    opacity: 1
}

.hbg-dropdown-v2__body-item:hover .hbg-dropdown-v2__body-item-three-nav-wrap {
    display: block
}

.hbg-dropdown-v2__body-item-three-nav-wrap {
    position: absolute;
    top: 0;
    left: 340px;
    z-index: 5;
    display: none;
    width: 344px;
    padding: 0 0 0 4px;
    color: var(--hbg-header-three-color);
    background: transparent;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, .06);
    cursor: auto
}

.hbg-dropdown-v2__body-item-three-nav-wrap>div {
    position: relative;
    height: 100%;
    padding: 12px 4px;
    background: var(--hbg-header-three-bgcolor);
    border-radius: 0 0 8px 8px
}

.hbg-dropdown-v2__body-item-three-nav-wrap-item {
    display: flex;
    align-items: center;
    height: 44px;
    padding-left: 24px;
    font-size: 14px;
    line-height: 44px;
    cursor: pointer
}

.hbg-dropdown-v2__body-item-three-nav-wrap-item span {
    display: inline-block;
    width: 100%;
    line-height: 16px;
    white-space: normal;
    overflow-wrap: break-word
}

.hbg-dropdown-v2__body-item-three-nav-wrap-item:hover {
    color: var(--hbg-header-three-hovercolor);
    font-weight: 500;
    background: var(--hbg-header-three-item-hovercolor)
}

.hbg-dropdown-v2__body-item:hover {
    background: var(--hbg-header-main-hover-bgcolor)
}

.hbg-dropdown-v2__body-item:hover .hbg-dropdown-v2__body-item-title {
    font-weight: 500
}

.hbg-dropdown-v2__body-muti {
    display: flex;
    flex-direction: row
}

.hbg-dropdown-v2__body-muti .hbg-dropdown-v2__body-group {
    flex: 1;
    flex-shrink: 0
}

.hbg-dropdown-v2__body-muti .hbg-dropdown-v2__body-group:hover {
    z-index: 10
}

.hbg-dropdown-v2--open .hbg-dropdown-v2__trigger {
    position: relative;
    background: var(--hbg-header-dropdown-bgcolor)
}

.hbg-dropdown-v2--open .hbg-dropdown-v2__trigger-triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow-active.47f5b369.svg);
    transform: rotate(180deg)
}

.hbg-dropdown-v2--open .hbg-dropdown-v2__content {
    display: block
}

.hbg-dropdown-v2--open .hbg-dropdown-v2__body {
    animation-name: fadeInDropdown;
    animation-duration: .3s;
    animation-timing-function: cubic-bezier(.16, 0, .18, 1);
    animation-fill-mode: forwards
}

.hbg-dropdown-v2--hide .hbg-dropdown-v2__trigger {
    color: var(--hbg-header-main-txtcolor);
    background: var(--hbg-header-main-bgcolor)
}

.hbg-dropdown-v2--hide .hbg-dropdown-v2__trigger-triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow.1b8ea0d9.svg);
    transform: rotate(0)
}

.hbg-dropdown-v2--hide .hbg-dropdown-v2__content {
    overflow: hidden !important;
    box-shadow: none !important;
    pointer-events: none
}

.hbg-dropdown-v2--hide .hbg-dropdown-v2__body {
    box-shadow: none !important;
    animation-name: fadeOutDropdown !important;
    animation-duration: .27s;
    animation-timing-function: cubic-bezier(.16, 0, .18, 1);
    animation-fill-mode: both;
    pointer-events: none
}

.global-common-header--light .hbg-dropdown-v2__trigger-triangle {
    width: 14px;
    height: 14px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow_light.7fac95d2.svg) no-repeat 50%
}

.global-common-header--light .hbg-dropdown-v2--open .hbg-dropdown-v2__trigger-triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow-active_light.142e8a85.svg);
    transform: rotate(180deg)
}

.global-common-header--light .hbg-dropdown-v2--hide .hbg-dropdown-v2__trigger-triangle {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-dropdown-arrow_light.7fac95d2.svg)
}

.hbg-nav-menu-v2 {
    height: 64px;
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

.hbg-nav-menu-v2__item {
    height: 100%
}

.hbg-nav-menu-v2__item .hbg-dropdown-v2__content {
    width: 344px
}

.hbg-nav-menu-v2__item .hbg-dropdown-v2__content-muti {
    width: 658px
}

.hbg-nav-menu-v2__item .hbg-dropdown-v2__content-categroy {
    width: auto
}

.hbg-nav-menu-v2__item .hbg-dropdown-v2__body-categroy {
    width: auto;
    display: flex;
    flex-direction: row
}

.hbg-nav-menu-v2__item .hbg-dropdown-v2__body-categroy .hbg-dropdown-v2__body-group {
    width: 325px
}

.hbg-nav-menu-v2__item .hbg-dropdown-v2__body-categroy .hbg-dropdown-v2__body-group .categroy-name {
    height: 43px;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    padding: 12px 24px
}

.hbg-nav-menu-v2__activebar {
    position: absolute;
    z-index: 100;
    top: 0;
    width: 0;
    height: 0;
    overflow: hidden;
    border-top: 2px solid #0173e5;
    pointer-events: none
}

.hbg-nav-menu-v2__activebar--ani {
    transition: all .3s cubic-bezier(.16, 0, .18, 1)
}

.hbg-nav-menu-v2__hover .hb-dropdown--hide .hb-menu-dropdown__body,
.hbg-nav-menu-v2__hover .hbg-dropdown-v2--hide .hbg-dropdown-v2__body {
    animation-name: noani;
    animation-duration: 1ms;
    animation-timing-function: ease;
    animation-fill-mode: both
}

.hbg-nav-menu-v2__disable-ani .hbg-dropdown-v2--open .hbg-dropdown-v2__body {
    animation: none
}

.hbg-nav-menu-v2__disable-ani .hbg-dropdown-v2--hide .hbg-dropdown-v2__body {
    animation-name: noani;
    animation-duration: 1ms;
    animation-timing-function: ease;
    animation-fill-mode: both
}

.hbg-nav-menu-v2__disable-ani .hb-dropdown--open .hb-menu-dropdown__body {
    animation: none
}

.hbg-nav-menu-v2__disable-ani .hb-dropdown--hide .hb-menu-dropdown__body {
    animation-name: noani;
    animation-duration: 1ms;
    animation-timing-function: ease;
    animation-fill-mode: both;
    pointer-events: none
}

.global-common-header,
.hbg-drawer {
    --hbg-header-search-bgcolor: #1e1e1f;
    --hbg-search-input-bgcolor: #313132;
    --hbg-search-input-color: #8c8c93;
    --hbg-search-active-input-color: #e6e6e6;
    --hbg-item-hover-color: #313132;
    --hbg-search-txt-color: #e6e6e6;
    --hbg-search-tag-color: #8c8c93;
    --hbg-scrollbar-color: #5e5e61;
    --hbg-search-shadow: none;
    --hbg-next-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/next.397a2b48.svg);
    --hbg-next-hover-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/next_hover.8334dfbb.svg);
    --hbg-prev-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prev.e4426570.svg);
    --hbg-prev-hover-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prev_hover.f9edd247.svg)
}

.global-common-header--light,
.hbg-drawer--light {
    --hbg-header-search-bgcolor: #fff;
    --hbg-search-input-bgcolor: #f5f5f5;
    --hbg-search-input-color: #565656;
    --hbg-search-active-input-color: #000;
    --hbg-item-hover-color: #f5f5f5;
    --hbg-search-txt-color: #000;
    --hbg-search-tag-color: #565656;
    --hbg-scrollbar-color: #ddd;
    --hbg-search-shadow: 0 4px 16px 0 rgba(0, 0, 0, .1);
    --hbg-next-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/next_light.ca8a879f.svg);
    --hbg-next-hover-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/next_light_hover.01be8620.svg);
    --hbg-prev-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prev_light.78c21eaa.svg);
    --hbg-prev-hover-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prev_light_hover.1b267dcc.svg)
}

.common-item {
    display: flex;
    gap: 8px;
    align-items: center;
    height: 60px;
    padding: 0 16px;
    cursor: pointer
}

.common-item:hover {
    background: var(--hbg-item-hover-color)
}

.common-scrollbar::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.common-scrollbar::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hbg-user-avatar__border {
    border-color: var(--hbg-header-primary-color)
}

.flex-layout {
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden
}

.common-input .search__icon {
    position: absolute;
    top: 50%;
    left: 6px;
    width: 28px;
    height: 28px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/search.d707f541.svg);
    transform: translateY(-50%);
    cursor: pointer
}

.common-input .search__input {
    display: flex;
    width: 100%;
    height: 100%
}

.common-input .search__input input {
    width: 100%;
    height: 100%;
    padding: 2px 0 2px 40px;
    color: var(--hbg-search-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    background: var(--hbg-search-input-bgcolor);
    border: none;
    border-radius: 4px;
    outline: none
}

.common-input .search__input input::-webkit-input-placeholder {
    color: var(--hbg-search-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal
}

.common-input .search__input input::-moz-placeholder {
    color: var(--hbg-search-input-color)
}

.common-input .search__input input:-ms-input-placeholder {
    color: var(--hbg-search-input-color)
}

.common-input .search__input input:focus {
    color: var(--hbg-search-active-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    border: 1px solid #0173e5
}

.common-input .clear__icon {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 20px;
    height: 20px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/clear.b04dc076.svg);
    transform: translateY(-50%);
    cursor: pointer
}

.loading-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px
}

.hbg_small-search-wrapper,
.header__search-wrapper {
    background: var(--hbg-header-search-bgcolor)
}

.hbg_small-search-wrapper .search__box,
.header__search-wrapper .search__box {
    z-index: 1
}

.hbg_small-search-wrapper .search__box .search__hot-container,
.header__search-wrapper .search__box .search__hot-container {
    width: 360px;
    border-radius: 0 0 8px 8px
}

.hbg_small-search-wrapper .search__box .search__hot-container .hot-tab-list,
.header__search-wrapper .search__box .search__hot-container .hot-tab-list {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 9px 20px
}

.hbg_small-search-wrapper .search__box .search__hot-container .hot-tab-list .tab-item,
.header__search-wrapper .search__box .search__hot-container .hot-tab-list .tab-item {
    color: var(--hbg-search-input-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    text-transform: capitalize;
    cursor: pointer
}

.hbg_small-search-wrapper .search__box .search__hot-container .hot-tab-list .active-tab-item,
.header__search-wrapper .search__box .search__hot-container .hot-tab-list .active-tab-item {
    color: var(--hbg-search-active-input-color);
    font-size: 16px
}

.hbg_small-search-wrapper .search__box .search__hot-container .search-container,
.header__search-wrapper .search__box .search__hot-container .search-container {
    max-height: 480px;
    overflow-y: auto;
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden
}

.hbg_small-search-wrapper .search__box .search__hot-container .search-container::-webkit-scrollbar,
.header__search-wrapper .search__box .search__hot-container .search-container::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.hbg_small-search-wrapper .search__box .search__hot-container .search-container::-webkit-scrollbar-thumb,
.header__search-wrapper .search__box .search__hot-container .search-container::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hbg_small-search-wrapper .search__box .earn-list,
.hbg_small-search-wrapper .search__box .fun-list,
.hbg_small-search-wrapper .search__box .hot-list,
.hbg_small-search-wrapper .search__box .news-list,
.hbg_small-search-wrapper .search__box .notice-list,
.hbg_small-search-wrapper .search__box .poloniex-list,
.hbg_small-search-wrapper .search__box .spot-list,
.hbg_small-search-wrapper .search__box .swap-list,
.hbg_small-search-wrapper .search__box .user-list,
.header__search-wrapper .search__box .earn-list,
.header__search-wrapper .search__box .fun-list,
.header__search-wrapper .search__box .hot-list,
.header__search-wrapper .search__box .news-list,
.header__search-wrapper .search__box .notice-list,
.header__search-wrapper .search__box .poloniex-list,
.header__search-wrapper .search__box .spot-list,
.header__search-wrapper .search__box .swap-list,
.header__search-wrapper .search__box .user-list {
    padding: 0 4px
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item,
.hbg_small-search-wrapper .search__box .earn-list .hot-item,
.hbg_small-search-wrapper .search__box .earn-list .poloniex-item,
.hbg_small-search-wrapper .search__box .earn-list .spot-item,
.hbg_small-search-wrapper .search__box .earn-list .swap-item,
.hbg_small-search-wrapper .search__box .hot-list .earn-item,
.hbg_small-search-wrapper .search__box .hot-list .hot-item,
.hbg_small-search-wrapper .search__box .hot-list .poloniex-item,
.hbg_small-search-wrapper .search__box .hot-list .spot-item,
.hbg_small-search-wrapper .search__box .hot-list .swap-item,
.hbg_small-search-wrapper .search__box .poloniex-list .earn-item,
.hbg_small-search-wrapper .search__box .poloniex-list .hot-item,
.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item,
.hbg_small-search-wrapper .search__box .spot-list .earn-item,
.hbg_small-search-wrapper .search__box .spot-list .hot-item,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item,
.hbg_small-search-wrapper .search__box .spot-list .spot-item,
.hbg_small-search-wrapper .search__box .spot-list .swap-item,
.hbg_small-search-wrapper .search__box .swap-list .earn-item,
.hbg_small-search-wrapper .search__box .swap-list .hot-item,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item,
.hbg_small-search-wrapper .search__box .swap-list .spot-item,
.hbg_small-search-wrapper .search__box .swap-list .swap-item,
.header__search-wrapper .search__box .earn-list .earn-item,
.header__search-wrapper .search__box .earn-list .hot-item,
.header__search-wrapper .search__box .earn-list .poloniex-item,
.header__search-wrapper .search__box .earn-list .spot-item,
.header__search-wrapper .search__box .earn-list .swap-item,
.header__search-wrapper .search__box .hot-list .earn-item,
.header__search-wrapper .search__box .hot-list .hot-item,
.header__search-wrapper .search__box .hot-list .poloniex-item,
.header__search-wrapper .search__box .hot-list .spot-item,
.header__search-wrapper .search__box .hot-list .swap-item,
.header__search-wrapper .search__box .poloniex-list .earn-item,
.header__search-wrapper .search__box .poloniex-list .hot-item,
.header__search-wrapper .search__box .poloniex-list .poloniex-item,
.header__search-wrapper .search__box .poloniex-list .spot-item,
.header__search-wrapper .search__box .poloniex-list .swap-item,
.header__search-wrapper .search__box .spot-list .earn-item,
.header__search-wrapper .search__box .spot-list .hot-item,
.header__search-wrapper .search__box .spot-list .poloniex-item,
.header__search-wrapper .search__box .spot-list .spot-item,
.header__search-wrapper .search__box .spot-list .swap-item,
.header__search-wrapper .search__box .swap-list .earn-item,
.header__search-wrapper .search__box .swap-list .hot-item,
.header__search-wrapper .search__box .swap-list .poloniex-item,
.header__search-wrapper .search__box .swap-list .spot-item,
.header__search-wrapper .search__box .swap-list .swap-item {
    display: flex;
    gap: 8px;
    align-items: center;
    height: 60px;
    padding: 0 16px;
    cursor: pointer
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item:hover,
.hbg_small-search-wrapper .search__box .earn-list .hot-item:hover,
.hbg_small-search-wrapper .search__box .earn-list .poloniex-item:hover,
.hbg_small-search-wrapper .search__box .earn-list .spot-item:hover,
.hbg_small-search-wrapper .search__box .earn-list .swap-item:hover,
.hbg_small-search-wrapper .search__box .hot-list .earn-item:hover,
.hbg_small-search-wrapper .search__box .hot-list .hot-item:hover,
.hbg_small-search-wrapper .search__box .hot-list .poloniex-item:hover,
.hbg_small-search-wrapper .search__box .hot-list .spot-item:hover,
.hbg_small-search-wrapper .search__box .hot-list .swap-item:hover,
.hbg_small-search-wrapper .search__box .poloniex-list .earn-item:hover,
.hbg_small-search-wrapper .search__box .poloniex-list .hot-item:hover,
.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item:hover,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item:hover,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item:hover,
.hbg_small-search-wrapper .search__box .spot-list .earn-item:hover,
.hbg_small-search-wrapper .search__box .spot-list .hot-item:hover,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item:hover,
.hbg_small-search-wrapper .search__box .spot-list .spot-item:hover,
.hbg_small-search-wrapper .search__box .spot-list .swap-item:hover,
.hbg_small-search-wrapper .search__box .swap-list .earn-item:hover,
.hbg_small-search-wrapper .search__box .swap-list .hot-item:hover,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item:hover,
.hbg_small-search-wrapper .search__box .swap-list .spot-item:hover,
.hbg_small-search-wrapper .search__box .swap-list .swap-item:hover,
.header__search-wrapper .search__box .earn-list .earn-item:hover,
.header__search-wrapper .search__box .earn-list .hot-item:hover,
.header__search-wrapper .search__box .earn-list .poloniex-item:hover,
.header__search-wrapper .search__box .earn-list .spot-item:hover,
.header__search-wrapper .search__box .earn-list .swap-item:hover,
.header__search-wrapper .search__box .hot-list .earn-item:hover,
.header__search-wrapper .search__box .hot-list .hot-item:hover,
.header__search-wrapper .search__box .hot-list .poloniex-item:hover,
.header__search-wrapper .search__box .hot-list .spot-item:hover,
.header__search-wrapper .search__box .hot-list .swap-item:hover,
.header__search-wrapper .search__box .poloniex-list .earn-item:hover,
.header__search-wrapper .search__box .poloniex-list .hot-item:hover,
.header__search-wrapper .search__box .poloniex-list .poloniex-item:hover,
.header__search-wrapper .search__box .poloniex-list .spot-item:hover,
.header__search-wrapper .search__box .poloniex-list .swap-item:hover,
.header__search-wrapper .search__box .spot-list .earn-item:hover,
.header__search-wrapper .search__box .spot-list .hot-item:hover,
.header__search-wrapper .search__box .spot-list .poloniex-item:hover,
.header__search-wrapper .search__box .spot-list .spot-item:hover,
.header__search-wrapper .search__box .spot-list .swap-item:hover,
.header__search-wrapper .search__box .swap-list .earn-item:hover,
.header__search-wrapper .search__box .swap-list .hot-item:hover,
.header__search-wrapper .search__box .swap-list .poloniex-item:hover,
.header__search-wrapper .search__box .swap-list .spot-item:hover,
.header__search-wrapper .search__box .swap-list .swap-item:hover {
    background: var(--hbg-item-hover-color)
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .icon-symbol,
.hbg_small-search-wrapper .search__box .earn-list .hot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .earn-list .poloniex-item .icon-symbol,
.hbg_small-search-wrapper .search__box .earn-list .spot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .earn-list .swap-item .icon-symbol,
.hbg_small-search-wrapper .search__box .hot-list .earn-item .icon-symbol,
.hbg_small-search-wrapper .search__box .hot-list .hot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .hot-list .poloniex-item .icon-symbol,
.hbg_small-search-wrapper .search__box .hot-list .spot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .hot-list .swap-item .icon-symbol,
.hbg_small-search-wrapper .search__box .poloniex-list .earn-item .icon-symbol,
.hbg_small-search-wrapper .search__box .poloniex-list .hot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .icon-symbol,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .icon-symbol,
.hbg_small-search-wrapper .search__box .spot-list .earn-item .icon-symbol,
.hbg_small-search-wrapper .search__box .spot-list .hot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .icon-symbol,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .icon-symbol,
.hbg_small-search-wrapper .search__box .swap-list .earn-item .icon-symbol,
.hbg_small-search-wrapper .search__box .swap-list .hot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .icon-symbol,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .icon-symbol,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .icon-symbol,
.header__search-wrapper .search__box .earn-list .earn-item .icon-symbol,
.header__search-wrapper .search__box .earn-list .hot-item .icon-symbol,
.header__search-wrapper .search__box .earn-list .poloniex-item .icon-symbol,
.header__search-wrapper .search__box .earn-list .spot-item .icon-symbol,
.header__search-wrapper .search__box .earn-list .swap-item .icon-symbol,
.header__search-wrapper .search__box .hot-list .earn-item .icon-symbol,
.header__search-wrapper .search__box .hot-list .hot-item .icon-symbol,
.header__search-wrapper .search__box .hot-list .poloniex-item .icon-symbol,
.header__search-wrapper .search__box .hot-list .spot-item .icon-symbol,
.header__search-wrapper .search__box .hot-list .swap-item .icon-symbol,
.header__search-wrapper .search__box .poloniex-list .earn-item .icon-symbol,
.header__search-wrapper .search__box .poloniex-list .hot-item .icon-symbol,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .icon-symbol,
.header__search-wrapper .search__box .poloniex-list .spot-item .icon-symbol,
.header__search-wrapper .search__box .poloniex-list .swap-item .icon-symbol,
.header__search-wrapper .search__box .spot-list .earn-item .icon-symbol,
.header__search-wrapper .search__box .spot-list .hot-item .icon-symbol,
.header__search-wrapper .search__box .spot-list .poloniex-item .icon-symbol,
.header__search-wrapper .search__box .spot-list .spot-item .icon-symbol,
.header__search-wrapper .search__box .spot-list .swap-item .icon-symbol,
.header__search-wrapper .search__box .swap-list .earn-item .icon-symbol,
.header__search-wrapper .search__box .swap-list .hot-item .icon-symbol,
.header__search-wrapper .search__box .swap-list .poloniex-item .icon-symbol,
.header__search-wrapper .search__box .swap-list .spot-item .icon-symbol,
.header__search-wrapper .search__box .swap-list .swap-item .icon-symbol {
    display: flex;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 50%
}

.hbg_small-search-wrapper .search__box .fun-list .fun-item,
.header__search-wrapper .search__box .fun-list .fun-item {
    gap: 8px;
    align-items: center;
    height: 60px;
    padding: 0 16px;
    cursor: pointer;
    display: flex;
    gap: 16px
}

.hbg_small-search-wrapper .search__box .fun-list .fun-item:hover,
.header__search-wrapper .search__box .fun-list .fun-item:hover {
    background: var(--hbg-item-hover-color)
}

.hbg_small-search-wrapper .search__box .fun-list .fun-item .icon-img,
.header__search-wrapper .search__box .fun-list .fun-item .icon-img {
    width: 30px;
    height: 30px;
    border-radius: 50%
}

.hbg_small-search-wrapper .search__box .fun-list .fun-item .fun-name,
.header__search-wrapper .search__box .fun-list .fun-item .fun-name {
    color: var(--hbg-search-txt-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px
}

.hbg_small-search-wrapper .search__box .news-list .item,
.hbg_small-search-wrapper .search__box .notice-list .item,
.header__search-wrapper .search__box .news-list .item,
.header__search-wrapper .search__box .notice-list .item {
    gap: 8px;
    align-items: center;
    height: 60px;
    padding: 0 16px;
    cursor: pointer;
    flex-direction: column;
    gap: 2px;
    justify-content: center
}

.hbg_small-search-wrapper .search__box .news-list .item:hover,
.hbg_small-search-wrapper .search__box .notice-list .item:hover,
.header__search-wrapper .search__box .news-list .item:hover,
.header__search-wrapper .search__box .notice-list .item:hover {
    background: var(--hbg-item-hover-color)
}

.hbg_small-search-wrapper .search__box .news-list .item .name,
.hbg_small-search-wrapper .search__box .notice-list .item .name,
.header__search-wrapper .search__box .news-list .item .name,
.header__search-wrapper .search__box .notice-list .item .name {
    width: 100%;
    overflow: hidden;
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    white-space: nowrap;
    text-transform: capitalize;
    text-overflow: ellipsis
}

.hbg_small-search-wrapper .search__box .news-list .item .time,
.hbg_small-search-wrapper .search__box .notice-list .item .time,
.header__search-wrapper .search__box .news-list .item .time,
.header__search-wrapper .search__box .notice-list .item .time {
    color: var(--hbg-search-tag-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.hbg_small-search-wrapper .search__box .news-list .item,
.hbg_small-search-wrapper .search__box .notice-list .item,
.header__search-wrapper .search__box .news-list .item,
.header__search-wrapper .search__box .notice-list .item {
    display: flex;
    align-items: flex-start
}

.hbg_small-search-wrapper .search__box .user-list .user-item,
.header__search-wrapper .search__box .user-list .user-item {
    gap: 8px;
    align-items: center;
    height: 60px;
    padding: 0 16px;
    cursor: pointer;
    display: flex;
    gap: 12px
}

.hbg_small-search-wrapper .search__box .user-list .user-item:hover,
.header__search-wrapper .search__box .user-list .user-item:hover {
    background: var(--hbg-item-hover-color)
}

.hbg_small-search-wrapper .search__box .user-list .user-item .icon-user-img,
.header__search-wrapper .search__box .user-list .user-item .icon-user-img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%
}

.hbg_small-search-wrapper .search__box .user-list .user-item .content,
.header__search-wrapper .search__box .user-list .user-item .content {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between
}

.hbg_small-search-wrapper .search__box .user-list .user-item .content .user-desc .name,
.header__search-wrapper .search__box .user-list .user-item .content .user-desc .name {
    margin-bottom: 2px;
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: normal
}

.hbg_small-search-wrapper .search__box .user-list .user-item .content .user-desc .fans,
.header__search-wrapper .search__box .user-list .user-item .content .user-desc .fans {
    color: var(--hbg-search-tag-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.hbg_small-search-wrapper .search__box .user-list .user-item .content .action .button,
.header__search-wrapper .search__box .user-list .user-item .content .action .button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    height: 28px;
    padding: 0 8px;
    background: #adadb4;
    border-radius: 4px
}

.hbg_small-search-wrapper .search__box .user-list .user-item .content .action .button span,
.header__search-wrapper .search__box .user-list .user-item .content .action .button span {
    color: #fff;
    font-weight: 500;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.hbg_small-search-wrapper .search__box .user-list .user-item .content .action .blue-button,
.header__search-wrapper .search__box .user-list .user-item .content .action .blue-button {
    background: #0173e5
}

.hbg_small-search-wrapper .search__box .hot-list .hot-item .num,
.header__search-wrapper .search__box .hot-list .hot-item .num {
    width: 17px;
    color: var(--hbg-search-tag-color);
    font-weight: 700;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    text-align: center;
    text-transform: capitalize
}

.hbg_small-search-wrapper .search__box .hot-list .hot-item:first-child .num,
.header__search-wrapper .search__box .hot-list .hot-item:first-child .num {
    color: #fa6e6e
}

.hbg_small-search-wrapper .search__box .hot-list .hot-item:nth-child(2) .num,
.header__search-wrapper .search__box .hot-list .hot-item:nth-child(2) .num {
    color: #ff8336
}

.hbg_small-search-wrapper .search__box .hot-list .hot-item:nth-child(3) .num,
.header__search-wrapper .search__box .hot-list .hot-item:nth-child(3) .num {
    color: #fa0
}

.hbg_small-search-wrapper .search__box .hot-list .hot-topic .content,
.header__search-wrapper .search__box .hot-list .hot-topic .content {
    overflow: hidden;
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    white-space: nowrap;
    text-transform: capitalize;
    text-overflow: ellipsis
}

.hbg_small-search-wrapper .search__box .hot-list .hot-topic .hot-img,
.header__search-wrapper .search__box .hot-list .hot-topic .hot-img {
    width: 14px;
    height: 14px
}

.hbg_small-search-wrapper .search__box .hot-list .hot-finance .content,
.header__search-wrapper .search__box .hot-list .hot-finance .content {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between
}

.hbg_small-search-wrapper .search__box .hot-list .hot-finance .content .info,
.header__search-wrapper .search__box .hot-list .hot-finance .content .info {
    display: flex;
    gap: 8px;
    align-items: flex-end
}

.hbg_small-search-wrapper .search__box .hot-list .hot-finance .content .info .name,
.header__search-wrapper .search__box .hot-list .hot-finance .content .info .name {
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    text-transform: capitalize
}

.hbg_small-search-wrapper .search__box .hot-list .hot-finance .content .info .tag,
.header__search-wrapper .search__box .hot-list .hot-finance .content .info .tag {
    color: var(--hbg-search-tag-color);
    font-weight: 500;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.hbg_small-search-wrapper .search__box .hot-list .hot-finance .content .rate,
.header__search-wrapper .search__box .hot-list .hot-finance .content .rate {
    color: #00a171;
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    text-transform: capitalize
}

.hbg_small-search-wrapper .search__box .poloniex-list,
.hbg_small-search-wrapper .search__box .spot-list,
.hbg_small-search-wrapper .search__box .swap-list,
.header__search-wrapper .search__box .poloniex-list,
.header__search-wrapper .search__box .spot-list,
.header__search-wrapper .search__box .swap-list {
    min-height: 60px
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item,
.hbg_small-search-wrapper .search__box .spot-list .spot-item,
.hbg_small-search-wrapper .search__box .spot-list .swap-item,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item,
.hbg_small-search-wrapper .search__box .swap-list .spot-item,
.hbg_small-search-wrapper .search__box .swap-list .swap-item,
.header__search-wrapper .search__box .poloniex-list .poloniex-item,
.header__search-wrapper .search__box .poloniex-list .spot-item,
.header__search-wrapper .search__box .poloniex-list .swap-item,
.header__search-wrapper .search__box .spot-list .poloniex-item,
.header__search-wrapper .search__box .spot-list .spot-item,
.header__search-wrapper .search__box .spot-list .swap-item,
.header__search-wrapper .search__box .swap-list .poloniex-item,
.header__search-wrapper .search__box .swap-list .spot-item,
.header__search-wrapper .search__box .swap-list .swap-item {
    display: flex;
    gap: 12px
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content,
.header__search-wrapper .search__box .poloniex-list .spot-item .content,
.header__search-wrapper .search__box .poloniex-list .swap-item .content,
.header__search-wrapper .search__box .spot-list .poloniex-item .content,
.header__search-wrapper .search__box .spot-list .spot-item .content,
.header__search-wrapper .search__box .spot-list .swap-item .content,
.header__search-wrapper .search__box .swap-list .poloniex-item .content,
.header__search-wrapper .search__box .swap-list .spot-item .content,
.header__search-wrapper .search__box .swap-list .swap-item .content {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .info,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .info,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .info,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .info,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .info,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .info,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .info,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .info,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .info,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .info,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .info,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .info,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .info,
.header__search-wrapper .search__box .spot-list .spot-item .content .info,
.header__search-wrapper .search__box .spot-list .swap-item .content .info,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .info,
.header__search-wrapper .search__box .swap-list .spot-item .content .info,
.header__search-wrapper .search__box .swap-list .swap-item .content .info {
    display: flex;
    align-items: center
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .info .symbol-info,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .info .symbol-info,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .info .symbol-info,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .info .symbol-info,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .info .symbol-info,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .info .symbol-info,
.header__search-wrapper .search__box .spot-list .spot-item .content .info .symbol-info,
.header__search-wrapper .search__box .spot-list .swap-item .content .info .symbol-info,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .info .symbol-info,
.header__search-wrapper .search__box .swap-list .spot-item .content .info .symbol-info,
.header__search-wrapper .search__box .swap-list .swap-item .content .info .symbol-info {
    display: flex;
    align-items: flex-end
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .info .symbol-info .symbol,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .spot-list .spot-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .spot-list .swap-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .swap-list .spot-item .content .info .symbol-info .symbol,
.header__search-wrapper .search__box .swap-list .swap-item .content .info .symbol-info .symbol {
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    letter-spacing: .14px
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .info .symbol-info .currency,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .spot-list .spot-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .spot-list .swap-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .swap-list .spot-item .content .info .symbol-info .currency,
.header__search-wrapper .search__box .swap-list .swap-item .content .info .symbol-info .currency {
    margin-left: 2px;
    color: var(--hbg-search-tag-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: normal;
    letter-spacing: .12px
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .info .ratio,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .info .ratio,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .info .ratio,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .info .ratio,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .info .ratio,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .info .ratio,
.header__search-wrapper .search__box .spot-list .spot-item .content .info .ratio,
.header__search-wrapper .search__box .spot-list .swap-item .content .info .ratio,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .info .ratio,
.header__search-wrapper .search__box .swap-list .spot-item .content .info .ratio,
.header__search-wrapper .search__box .swap-list .swap-item .content .info .ratio {
    margin-left: 4px;
    padding: 0 4px;
    color: #fff;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px;
    background: #007bff;
    border-radius: 2px
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .price-box,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .price-box,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .price-box,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .price-box,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .price-box,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .price-box,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .price-box,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .price-box,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .price-box,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .price-box,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .price-box,
.header__search-wrapper .search__box .spot-list .spot-item .content .price-box,
.header__search-wrapper .search__box .spot-list .swap-item .content .price-box,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .price-box,
.header__search-wrapper .search__box .swap-list .spot-item .content .price-box,
.header__search-wrapper .search__box .swap-list .swap-item .content .price-box {
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .price-box .price,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .price-box .price,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .price,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .price-box .price,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .price-box .price,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .price-box .price,
.header__search-wrapper .search__box .spot-list .spot-item .content .price-box .price,
.header__search-wrapper .search__box .spot-list .swap-item .content .price-box .price,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .price-box .price,
.header__search-wrapper .search__box .swap-list .spot-item .content .price-box .price,
.header__search-wrapper .search__box .swap-list .swap-item .content .price-box .price {
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    letter-spacing: .14px
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .price-box .rate,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .price-box .rate,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .rate,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .price-box .rate,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .price-box .rate,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .price-box .rate,
.header__search-wrapper .search__box .spot-list .spot-item .content .price-box .rate,
.header__search-wrapper .search__box .spot-list .swap-item .content .price-box .rate,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .price-box .rate,
.header__search-wrapper .search__box .swap-list .spot-item .content .price-box .rate,
.header__search-wrapper .search__box .swap-list .swap-item .content .price-box .rate {
    color: var(--hbg-search-txt-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .price-box .up,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .price-box .up,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .up,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .price-box .up,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .price-box .up,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .price-box .up,
.header__search-wrapper .search__box .spot-list .spot-item .content .price-box .up,
.header__search-wrapper .search__box .spot-list .swap-item .content .price-box .up,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .price-box .up,
.header__search-wrapper .search__box .swap-list .spot-item .content .price-box .up,
.header__search-wrapper .search__box .swap-list .swap-item .content .price-box .up {
    color: #00a171
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .content .price-box .down,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .price-box .down,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .content .price-box .down,
.header__search-wrapper .search__box .poloniex-list .spot-item .content .price-box .down,
.header__search-wrapper .search__box .poloniex-list .swap-item .content .price-box .down,
.header__search-wrapper .search__box .spot-list .poloniex-item .content .price-box .down,
.header__search-wrapper .search__box .spot-list .spot-item .content .price-box .down,
.header__search-wrapper .search__box .spot-list .swap-item .content .price-box .down,
.header__search-wrapper .search__box .swap-list .poloniex-item .content .price-box .down,
.header__search-wrapper .search__box .swap-list .spot-item .content .price-box .down,
.header__search-wrapper .search__box .swap-list .swap-item .content .price-box .down {
    color: #e94359
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .action,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .action,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .action,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .action,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .action,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .action,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .action,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .action,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .action,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .action,
.header__search-wrapper .search__box .poloniex-list .spot-item .action,
.header__search-wrapper .search__box .poloniex-list .swap-item .action,
.header__search-wrapper .search__box .spot-list .poloniex-item .action,
.header__search-wrapper .search__box .spot-list .spot-item .action,
.header__search-wrapper .search__box .spot-list .swap-item .action,
.header__search-wrapper .search__box .swap-list .poloniex-item .action,
.header__search-wrapper .search__box .swap-list .spot-item .action,
.header__search-wrapper .search__box .swap-list .swap-item .action {
    width: 20px;
    height: 20px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/fav.8c108418.svg)
}

.hbg_small-search-wrapper .search__box .poloniex-list .poloniex-item .action-active,
.hbg_small-search-wrapper .search__box .poloniex-list .spot-item .action-active,
.hbg_small-search-wrapper .search__box .poloniex-list .swap-item .action-active,
.hbg_small-search-wrapper .search__box .spot-list .poloniex-item .action-active,
.hbg_small-search-wrapper .search__box .spot-list .spot-item .action-active,
.hbg_small-search-wrapper .search__box .spot-list .swap-item .action-active,
.hbg_small-search-wrapper .search__box .swap-list .poloniex-item .action-active,
.hbg_small-search-wrapper .search__box .swap-list .spot-item .action-active,
.hbg_small-search-wrapper .search__box .swap-list .swap-item .action-active,
.header__search-wrapper .search__box .poloniex-list .poloniex-item .action-active,
.header__search-wrapper .search__box .poloniex-list .spot-item .action-active,
.header__search-wrapper .search__box .poloniex-list .swap-item .action-active,
.header__search-wrapper .search__box .spot-list .poloniex-item .action-active,
.header__search-wrapper .search__box .spot-list .spot-item .action-active,
.header__search-wrapper .search__box .spot-list .swap-item .action-active,
.header__search-wrapper .search__box .swap-list .poloniex-item .action-active,
.header__search-wrapper .search__box .swap-list .spot-item .action-active,
.header__search-wrapper .search__box .swap-list .swap-item .action-active {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/fav_active.9f1a3cd9.svg)
}

.hbg_small-search-wrapper .search__box .swap-list .swap-item,
.header__search-wrapper .search__box .swap-list .swap-item {
    display: flex;
    gap: 8px
}

.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .info .symbol,
.header__search-wrapper .search__box .swap-list .swap-item .content .info .symbol {
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    letter-spacing: 0;
    text-transform: uppercase
}

.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .info .currency,
.header__search-wrapper .search__box .swap-list .swap-item .content .info .currency {
    margin-left: 2px;
    color: var(--hbg-search-tag-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px;
    letter-spacing: 0
}

.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .price-box,
.header__search-wrapper .search__box .swap-list .swap-item .content .price-box {
    margin-right: 4px
}

.hbg_small-search-wrapper .search__box .swap-list .swap-item .content .price-box .price,
.header__search-wrapper .search__box .swap-list .swap-item .content .price-box .price {
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    letter-spacing: 0
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content,
.header__search-wrapper .search__box .earn-list .earn-item .content {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .info,
.header__search-wrapper .search__box .earn-list .earn-item .content .info {
    display: flex;
    flex-direction: column
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .info .symbol,
.header__search-wrapper .search__box .earn-list .earn-item .content .info .symbol {
    color: var(--hbg-search-txt-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px;
    text-transform: uppercase
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .info .type,
.header__search-wrapper .search__box .earn-list .earn-item .content .info .type {
    display: flex;
    align-items: center;
    color: #0173e5;
    font-weight: 400;
    font-size: 10px;
    font-style: normal;
    line-height: 12px
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .info .type img,
.header__search-wrapper .search__box .earn-list .earn-item .content .info .type img {
    display: block;
    flex: 1;
    width: 100%;
    height: 16px;
    margin-left: 4px
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .rate,
.header__search-wrapper .search__box .earn-list .earn-item .content .rate {
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .rate .value,
.header__search-wrapper .search__box .earn-list .earn-item .content .rate .value {
    color: #00a171;
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 18px
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .rate .value em,
.header__search-wrapper .search__box .earn-list .earn-item .content .rate .value em {
    font-style: normal
}

.hbg_small-search-wrapper .search__box .earn-list .earn-item .content .rate .txt,
.header__search-wrapper .search__box .earn-list .earn-item .content .rate .txt {
    color: var(--hbg-search-tag-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.hbg_small-search-wrapper .search__box .live-list,
.header__search-wrapper .search__box .live-list {
    display: grid;
    grid-auto-flow: row;
    grid-gap: 12px 6px;
    grid-template-columns: repeat(2, 157px);
    padding: 12px 20px
}

.hbg_small-search-wrapper .search__box .live-list .live-item,
.header__search-wrapper .search__box .live-list .live-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    height: 130px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container,
.header__search-wrapper .search__box .live-list .live-item .live-container {
    position: relative;
    width: 100%;
    height: 88px;
    border-radius: 8px;
    cursor: pointer
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container img,
.header__search-wrapper .search__box .live-list .live-item .live-container img {
    width: 100%;
    height: 100%;
    border-radius: 8px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 63px;
    height: 16px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .tag-container,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .tag-container {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    border-bottom-left-radius: 8px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .tag-container .tag,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .tag-container .tag {
    display: inline-block;
    width: 9px;
    height: 9px;
    margin-left: 6px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .tag-container .txt,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .tag-container .txt {
    padding-left: 1.4px;
    color: #fff;
    font-weight: 400;
    font-size: 8.6px;
    font-style: normal;
    line-height: normal;
    text-transform: capitalize;
    transform: scale(.8)
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .unstart,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .unstart {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/blue.be87dcd3.svg) no-repeat 50%;
    background-size: 63px 16px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .unstart .tag,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .unstart .tag {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/time.5e124578.svg) no-repeat 50%;
    background-size: 9px 10px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/orange.be4b2697.svg) no-repeat 50%;
    background-size: 63px 16px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live .tag,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live .tag {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/live.8c5f3b99.svg) no-repeat 50%;
    background-size: 7px 7px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live-end,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live-end {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/green.78c54872.svg) no-repeat 50%;
    background-size: 63px 16px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live-end .tag,
.header__search-wrapper .search__box .live-list .live-item .live-container .tag-wrapper .live-end .tag {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/play.af1a89f2.svg) no-repeat 50%;
    background-size: 9px 9px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .title,
.header__search-wrapper .search__box .live-list .live-item .live-content .title {
    width: 100%;
    overflow: hidden;
    color: var(--hbg-search-txt-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px;
    white-space: nowrap;
    text-transform: capitalize;
    text-overflow: ellipsis
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc {
    display: flex;
    justify-content: space-between;
    height: 12px;
    margin-top: 6px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc .speaker .nick-img,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc .speaker .nick-img {
    width: 20px;
    height: 20px;
    border-radius: 50%
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc .speaker .nick-img img,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc .speaker .nick-img img {
    width: 100%;
    height: 100%
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc .speaker .nick-name,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc .speaker .nick-name {
    color: var(--hbg-search-tag-color);
    font-weight: 400;
    font-size: 10px;
    font-style: normal;
    line-height: 12px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc .action,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc .action {
    display: flex;
    align-items: center;
    cursor: pointer
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc .action span,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc .action span {
    color: #0173e5;
    font-weight: 500;
    font-size: 11px;
    font-style: normal;
    line-height: 12px
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc .action .action-arrow,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc .action .action-arrow {
    width: 6px;
    height: 9px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/action-arrow.590471a8.svg)
}

.hbg_small-search-wrapper .search__box .live-list .live-item .live-content .desc .disable-action,
.header__search-wrapper .search__box .live-list .live-item .live-content .desc .disable-action {
    background: #8c8c93;
    pointer-events: none
}

.hbg_small-search-wrapper .search__box .search__prompt-container,
.header__search-wrapper .search__box .search__prompt-container {
    width: 360px;
    border-radius: 0 0 8px 8px
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list,
.header__search-wrapper .search__box .search__prompt-container .prompt-list {
    width: 100%;
    max-height: 480px;
    overflow-y: auto
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list::-webkit-scrollbar,
.header__search-wrapper .search__box .search__prompt-container .prompt-list::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list::-webkit-scrollbar-thumb,
.header__search-wrapper .search__box .search__prompt-container .prompt-list::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item,
.header__search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item {
    display: flex;
    gap: 8px;
    align-items: center;
    height: 60px;
    padding: 0 16px;
    cursor: pointer;
    height: 40px;
    padding: 10px 20px
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item:hover,
.header__search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item:hover {
    background: var(--hbg-item-hover-color)
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item:last-child:hover,
.header__search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item:last-child:hover {
    border-radius: 0 0 8px 8px
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item .prompt-icon,
.header__search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item .prompt-icon {
    width: 20px;
    height: 20px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prompt_search.dea0109f.svg)
}

.hbg_small-search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item .prompt-content,
.header__search-wrapper .search__box .search__prompt-container .prompt-list .prompt-item .prompt-content {
    color: var(--hbg-search-txt-color);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 20px
}

.hbg_small-search-wrapper .search__box .search__prompt-container .no-content,
.header__search-wrapper .search__box .search__prompt-container .no-content {
    padding: 20px 0
}

.hbg_small-search-wrapper .search__box .search__result-container,
.header__search-wrapper .search__box .search__result-container {
    width: 360px;
    padding-bottom: 16px;
    border-radius: 0 0 8px 8px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container,
.header__search-wrapper .search__box .search__result-container .nav-container {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    padding: 0 20px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .nav_list-container,
.header__search-wrapper .search__box .search__result-container .nav-container .nav_list-container {
    overflow-x: auto;
    scrollbar-width: none;
    scroll-behavior: smooth
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .nav_list-container ::-webkit-scrollbar,
.header__search-wrapper .search__box .search__result-container .nav-container .nav_list-container ::-webkit-scrollbar {
    display: none
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list,
.header__search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list {
    display: flex;
    gap: 20px;
    align-items: center
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list .nav-item,
.header__search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list .nav-item {
    display: flex;
    justify-content: center;
    color: var(--hbg-search-tag-color);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 20px;
    white-space: nowrap;
    text-align: center;
    cursor: pointer
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list .nav-item:hover,
.header__search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list .nav-item:hover {
    color: var(--hbg-search-txt-color)
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list .active-nav-item,
.header__search-wrapper .search__box .search__result-container .nav-container .nav_list-container .nav-list .active-nav-item {
    color: var(--hbg-search-txt-color);
    font-size: 16px;
    line-height: 22px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .next-container,
.hbg_small-search-wrapper .search__box .search__result-container .nav-container .pre-container,
.header__search-wrapper .search__box .search__result-container .nav-container .next-container,
.header__search-wrapper .search__box .search__result-container .nav-container .pre-container {
    position: absolute;
    top: 50%;
    display: flex;
    align-items: center;
    width: 24px;
    height: 100%;
    transform: translateY(-50%);
    cursor: pointer
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .next-container .icon-img,
.hbg_small-search-wrapper .search__box .search__result-container .nav-container .pre-container .icon-img,
.header__search-wrapper .search__box .search__result-container .nav-container .next-container .icon-img,
.header__search-wrapper .search__box .search__result-container .nav-container .pre-container .icon-img {
    width: 24px;
    height: 40px;
    background: var(--hbg-next-img) no-repeat center;
    background-size: 24px 40px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .next-container:hover .icon-img,
.hbg_small-search-wrapper .search__box .search__result-container .nav-container .pre-container:hover .icon-img,
.header__search-wrapper .search__box .search__result-container .nav-container .next-container:hover .icon-img,
.header__search-wrapper .search__box .search__result-container .nav-container .pre-container:hover .icon-img {
    background: var(--hbg-next-hover-img) no-repeat center;
    background-size: 24px 40px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .pre-container,
.header__search-wrapper .search__box .search__result-container .nav-container .pre-container {
    left: 0;
    justify-content: flex-end;
    padding-right: 4px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .pre-container .icon-img,
.header__search-wrapper .search__box .search__result-container .nav-container .pre-container .icon-img {
    background: var(--hbg-prev-img) no-repeat center;
    background-size: 24px 40px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .pre-container:hover .icon-img,
.header__search-wrapper .search__box .search__result-container .nav-container .pre-container:hover .icon-img {
    background: var(--hbg-prev-hover-img) no-repeat center;
    background-size: 24px 40px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav-container .next-container,
.header__search-wrapper .search__box .search__result-container .nav-container .next-container {
    right: 0;
    padding-left: 4px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav_padding-left,
.header__search-wrapper .search__box .search__result-container .nav_padding-left {
    padding-left: 28px
}

.hbg_small-search-wrapper .search__box .search__result-container .nav_padding-right,
.header__search-wrapper .search__box .search__result-container .nav_padding-right {
    padding-right: 28px
}

.hbg_small-search-wrapper .search__box .search__result-container .search__list-container,
.header__search-wrapper .search__box .search__result-container .search__list-container {
    max-height: 480px;
    overflow-y: auto
}

.hbg_small-search-wrapper .search__box .search__result-container .search__list-container::-webkit-scrollbar,
.header__search-wrapper .search__box .search__result-container .search__list-container::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.hbg_small-search-wrapper .search__box .search__result-container .search__list-container::-webkit-scrollbar-thumb,
.header__search-wrapper .search__box .search__result-container .search__list-container::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hbg_small-search-wrapper .search__box .search__result-container .search__list-container .search-list .search-item .search-header,
.header__search-wrapper .search__box .search__result-container .search__list-container .search-list .search-item .search-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    height: 32px;
    padding: 0 20px;
    cursor: pointer
}

.hbg_small-search-wrapper .search__box .search__result-container .search__list-container .search-list .search-item .search-header .name,
.header__search-wrapper .search__box .search__result-container .search__list-container .search-list .search-item .search-header .name {
    color: var(--hbg-search-tag-color);
    font-weight: 500;
    font-size: 12px;
    font-style: normal;
    line-height: 20px
}

.hbg_small-search-wrapper .search__box .search__result-container .search__list-container .search-list .search-item .search-header .arrow-img,
.header__search-wrapper .search__box .search__result-container .search__list-container .search-list .search-item .search-header .arrow-img {
    width: 8px;
    height: 20px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/arrow.44435c0f.svg) no-repeat 50%;
    background-size: 8px 20px
}

.hbg_small-search-wrapper .no-content,
.header__search-wrapper .no-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 0
}

.hbg_small-search-wrapper .no-content .no-img,
.header__search-wrapper .no-content .no-img {
    width: 76px;
    height: 76px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/no-content.92c5d7a0.svg)
}

.hbg_small-search-wrapper .no-content span,
.header__search-wrapper .no-content span {
    margin-top: 12px;
    color: #4c4c4e;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.header__search-wrapper {
    display: flex;
    align-items: center;
    width: 200px;
    height: 32px;
    border-radius: 4px
}

.header__search-wrapper .header__search-container {
    position: relative;
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
    height: 100%
}

.header__search-wrapper .header__search-container .header__search-input-container {
    flex: 1;
    height: 100%
}

.header__search-wrapper .header__search-container .header__search-input-container .search__icon {
    position: absolute;
    top: 50%;
    left: 6px;
    width: 28px;
    height: 28px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/search.d707f541.svg);
    transform: translateY(-50%);
    cursor: pointer
}

.header__search-wrapper .header__search-container .header__search-input-container .search__input {
    display: flex;
    width: 100%;
    height: 100%
}

.header__search-wrapper .header__search-container .header__search-input-container .search__input input {
    width: 100%;
    height: 100%;
    padding: 2px 0 2px 40px;
    color: var(--hbg-search-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    background: var(--hbg-search-input-bgcolor);
    border: none;
    border-radius: 4px;
    outline: none
}

.header__search-wrapper .header__search-container .header__search-input-container .search__input input::-webkit-input-placeholder {
    color: var(--hbg-search-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal
}

.header__search-wrapper .header__search-container .header__search-input-container .search__input input::-moz-placeholder {
    color: var(--hbg-search-input-color)
}

.header__search-wrapper .header__search-container .header__search-input-container .search__input input:-ms-input-placeholder {
    color: var(--hbg-search-input-color)
}

.header__search-wrapper .header__search-container .header__search-input-container .search__input input:focus {
    color: var(--hbg-search-active-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    border: 1px solid #0173e5
}

.header__search-wrapper .header__search-container .header__search-input-container .clear__icon {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 20px;
    height: 20px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/clear.b04dc076.svg);
    transform: translateY(-50%);
    cursor: pointer
}

.header__search-wrapper .header__search-container .search__box {
    position: absolute;
    top: 48px;
    border-radius: 0 0 8px 8px;
    box-shadow: var(--hbg-search-shadow)
}

.header__search-wrapper .header__search-container .search__box .search__hot-container,
.header__search-wrapper .header__search-container .search__box .search__prompt-container,
.header__search-wrapper .header__search-container .search__box .search__result-container {
    padding: 16px 0;
    background: var(--hbg-header-search-bgcolor)
}

.hbg_small-search-wrapper .search-input-wrapper {
    display: flex;
    gap: 16px;
    width: 100%;
    padding: 8px 16px
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container {
    position: relative;
    width: 100%;
    height: 40px
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .search__icon {
    position: absolute;
    top: 50%;
    left: 6px;
    width: 28px;
    height: 28px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/search.d707f541.svg);
    transform: translateY(-50%);
    cursor: pointer
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .search__input {
    display: flex;
    width: 100%;
    height: 100%
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .search__input input {
    width: 100%;
    height: 100%;
    padding: 2px 0 2px 40px;
    color: var(--hbg-search-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    background: var(--hbg-search-input-bgcolor);
    border: none;
    border-radius: 4px;
    outline: none
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .search__input input::-webkit-input-placeholder {
    color: var(--hbg-search-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .search__input input::-moz-placeholder {
    color: var(--hbg-search-input-color)
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .search__input input:-ms-input-placeholder {
    color: var(--hbg-search-input-color)
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .search__input input:focus {
    color: var(--hbg-search-active-input-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    border: 1px solid #0173e5
}

.hbg_small-search-wrapper .search-input-wrapper .search-input-container .clear__icon {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 20px;
    height: 20px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/clear.b04dc076.svg);
    transform: translateY(-50%);
    cursor: pointer
}

.hbg_small-search-wrapper .search__txt {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 60px;
    color: var(--hbg-search-txt-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    cursor: pointer
}

@media screen and (max-width:1024px) {
    .hbg_drawer__search {
        height: 100%
    }

    .hbg_drawer__search .hbg-drawer__content {
        height: 100%;
        overflow: hidden;
        border: 0
    }

    .hbg_small-search-wrapper {
        width: 100%;
        height: 100%
    }

    .hbg_small-search-wrapper .hbg-search-container {
        width: 100%;
        height: 100%;
        display: flex;
        flex: 1;
        flex-direction: column;
        overflow: hidden
    }

    .hbg_small-search-wrapper .hbg-search-container .search-input-wrapper {
        width: auto
    }

    .hbg_small-search-wrapper .hbg-search-container .search-input-wrapper .search-input-container .search__input {
        display: flex;
        align-items: center
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box {
        height: 100%;
        display: flex;
        flex: 1;
        flex-direction: column;
        overflow: hidden
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container {
        width: 100%;
        display: flex;
        flex: 1;
        flex-direction: column;
        overflow: hidden
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container .search__list-container .live-list,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container .live-list {
        display: grid;
        justify-content: space-around
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container .search-container,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container .search__list-container,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search-container,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container {
        height: 100%;
        max-height: none;
        overflow-y: auto
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container .search-container::-webkit-scrollbar,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container .search__list-container::-webkit-scrollbar,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search-container::-webkit-scrollbar,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container::-webkit-scrollbar {
        width: 5px;
        background: transparent;
        border-radius: 0
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container .search-container::-webkit-scrollbar-thumb,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__hot-container .search__list-container::-webkit-scrollbar-thumb,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search-container::-webkit-scrollbar-thumb,
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container::-webkit-scrollbar-thumb {
        width: 5px;
        background-color: var(--hbg-header-scrollbar-bgcolor);
        border-radius: 0
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__prompt-container {
        width: 100%;
        padding-bottom: 16px;
        display: flex;
        flex: 1;
        flex-direction: column;
        overflow: hidden
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__prompt-container .prompt-list {
        height: 100%;
        max-height: none
    }
}

@media screen and (min-width:745px) and (max-width:1024px) {
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container {
        max-height: none
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container .live-list {
        display: grid;
        grid-template-columns: repeat(4, 157px)
    }
}

@media screen and (min-width:540px) and (max-width:744px) {
    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container {
        max-height: none
    }

    .hbg_small-search-wrapper .hbg-search-container .search__box .search__result-container .search__list-container .live-list {
        display: grid;
        grid-template-columns: repeat(3, 157px)
    }
}

.spot-content,
.swap-content {
    display: contents
}

@media screen and (min-width:1024px) {

    html[lang=en-IN] .search__hot-container .hot-tab-list,
    html[lang=en-in] .search__hot-container .hot-tab-list,
    html[lang=en] .search__hot-container .hot-tab-list,
    html[lang=es-ES] .search__hot-container .hot-tab-list,
    html[lang=es-LA] .search__hot-container .hot-tab-list,
    html[lang=es-es] .search__hot-container .hot-tab-list,
    html[lang=es-la] .search__hot-container .hot-tab-list,
    html[lang=es] .search__hot-container .hot-tab-list,
    html[lang=fr-FR] .search__hot-container .hot-tab-list,
    html[lang=fr-fr] .search__hot-container .hot-tab-list,
    html[lang=fr] .search__hot-container .hot-tab-list,
    html[lang=id-ID] .search__hot-container .hot-tab-list,
    html[lang=id-id] .search__hot-container .hot-tab-list,
    html[lang=id] .search__hot-container .hot-tab-list,
    html[lang=it-IT] .search__hot-container .hot-tab-list,
    html[lang=it-it] .search__hot-container .hot-tab-list,
    html[lang=it] .search__hot-container .hot-tab-list,
    html[lang=pt-PT] .search__hot-container .hot-tab-list,
    html[lang=pt-pt] .search__hot-container .hot-tab-list,
    html[lang=pt] .search__hot-container .hot-tab-list,
    html[lang=ru-RU] .search__hot-container .hot-tab-list,
    html[lang=ru-ru] .search__hot-container .hot-tab-list,
    html[lang=ru] .search__hot-container .hot-tab-list,
    html[lang=tr-TR] .search__hot-container .hot-tab-list,
    html[lang=tr-tr] .search__hot-container .hot-tab-list,
    html[lang=tr] .search__hot-container .hot-tab-list,
    html[lang=uk-UA] .search__hot-container .hot-tab-list,
    html[lang=uk-ua] .search__hot-container .hot-tab-list,
    html[lang=uk] .search__hot-container .hot-tab-list,
    html[lang=vi-VI] .search__hot-container .hot-tab-list,
    html[lang=vi-vi] .search__hot-container .hot-tab-list,
    html[lang=vi] .search__hot-container .hot-tab-list {
        height: auto !important
    }

    html[lang=en-IN] .search__hot-container .hot-tab-list .tab-item,
    html[lang=en-in] .search__hot-container .hot-tab-list .tab-item,
    html[lang=en] .search__hot-container .hot-tab-list .tab-item,
    html[lang=es-ES] .search__hot-container .hot-tab-list .tab-item,
    html[lang=es-LA] .search__hot-container .hot-tab-list .tab-item,
    html[lang=es-es] .search__hot-container .hot-tab-list .tab-item,
    html[lang=es-la] .search__hot-container .hot-tab-list .tab-item,
    html[lang=es] .search__hot-container .hot-tab-list .tab-item,
    html[lang=fr-FR] .search__hot-container .hot-tab-list .tab-item,
    html[lang=fr-fr] .search__hot-container .hot-tab-list .tab-item,
    html[lang=fr] .search__hot-container .hot-tab-list .tab-item,
    html[lang=id-ID] .search__hot-container .hot-tab-list .tab-item,
    html[lang=id-id] .search__hot-container .hot-tab-list .tab-item,
    html[lang=id] .search__hot-container .hot-tab-list .tab-item,
    html[lang=it-IT] .search__hot-container .hot-tab-list .tab-item,
    html[lang=it-it] .search__hot-container .hot-tab-list .tab-item,
    html[lang=it] .search__hot-container .hot-tab-list .tab-item,
    html[lang=pt-PT] .search__hot-container .hot-tab-list .tab-item,
    html[lang=pt-pt] .search__hot-container .hot-tab-list .tab-item,
    html[lang=pt] .search__hot-container .hot-tab-list .tab-item,
    html[lang=ru-RU] .search__hot-container .hot-tab-list .tab-item,
    html[lang=ru-ru] .search__hot-container .hot-tab-list .tab-item,
    html[lang=ru] .search__hot-container .hot-tab-list .tab-item,
    html[lang=tr-TR] .search__hot-container .hot-tab-list .tab-item,
    html[lang=tr-tr] .search__hot-container .hot-tab-list .tab-item,
    html[lang=tr] .search__hot-container .hot-tab-list .tab-item,
    html[lang=uk-UA] .search__hot-container .hot-tab-list .tab-item,
    html[lang=uk-ua] .search__hot-container .hot-tab-list .tab-item,
    html[lang=uk] .search__hot-container .hot-tab-list .tab-item,
    html[lang=vi-VI] .search__hot-container .hot-tab-list .tab-item,
    html[lang=vi-vi] .search__hot-container .hot-tab-list .tab-item,
    html[lang=vi] .search__hot-container .hot-tab-list .tab-item {
        font-size: 14px !important;
        line-height: 14px !important
    }

    html.en-in .search__hot-container .hot-tab-list,
    html.es-es .search__hot-container .hot-tab-list,
    html.es-la .search__hot-container .hot-tab-list,
    html.fr-fr .search__hot-container .hot-tab-list,
    html.id-id .search__hot-container .hot-tab-list,
    html.it-it .search__hot-container .hot-tab-list,
    html.pt-pt .search__hot-container .hot-tab-list,
    html.ru-ru .search__hot-container .hot-tab-list,
    html.tr-tr .search__hot-container .hot-tab-list,
    html.uk-ua .search__hot-container .hot-tab-list,
    html.vi-vi .search__hot-container .hot-tab-list {
        height: auto !important
    }

    html.en-in .search__hot-container .hot-tab-list .tab-item,
    html.es-es .search__hot-container .hot-tab-list .tab-item,
    html.es-la .search__hot-container .hot-tab-list .tab-item,
    html.fr-fr .search__hot-container .hot-tab-list .tab-item,
    html.id-id .search__hot-container .hot-tab-list .tab-item,
    html.it-it .search__hot-container .hot-tab-list .tab-item,
    html.pt-pt .search__hot-container .hot-tab-list .tab-item,
    html.ru-ru .search__hot-container .hot-tab-list .tab-item,
    html.tr-tr .search__hot-container .hot-tab-list .tab-item,
    html.uk-ua .search__hot-container .hot-tab-list .tab-item,
    html.vi-vi .search__hot-container .hot-tab-list .tab-item {
        font-size: 14px !important;
        line-height: 14px !important
    }
}

.spot-scroller,
.swap-scroller {
    display: flex;
    flex: 1;
    flex-direction: column
}

.spot-scroller .recycle-scroller,
.swap-scroller .recycle-scroller {
    flex: 1
}

.ReactVirtualized__List::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.ReactVirtualized__List::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.model-dark {
    --hbg-model-switch-bgcolor: #1e1e1f;
    --hbg-switch-txtcolor: #e6e6e6;
    --hbg-switch-header-bordercolor: hsla(0, 0%, 100%, .06);
    --hbg-switch-operatecolor: #e6e6e6;
    --hbg-content-bghovercolor: #282829;
    --hbg-switch-search-bgcolor: #313132;
    --hbg-switch-search-txtcolor: #e6e6e6;
    --hbg-no-data-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/no_data.697fb2c2.svg);
    --hbg-tab-active-color: #fff
}

.model-light {
    --hbg-model-switch-bgcolor: #fff;
    --hbg-switch-txtcolor: #000;
    --hbg-switch-header-bordercolor: #ebebeb;
    --hbg-switch-operatecolor: #0173e5;
    --hbg-content-bghovercolor: #fafafa;
    --hbg-switch-search-bgcolor: #f5f5f5;
    --hbg-switch-search-txtcolor: #000;
    --hbg-no-data-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/no_data_light.ca62a060.svg);
    --hbg-tab-active-color: #000
}

.vm--container .vm--overlay {
    background: rgba(0, 0, 0, .8) !important
}

.model-switch-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden
}

.model-switch-user {
    background: var(--hbg-model-switch-bgcolor) !important;
    border-radius: 8px !important
}

.model-switch-user .switch-user-container {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden
}

.model-switch-user .switch-user-container .switch-loading {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, .1)
}

.model-switch-user .switch-user-container .switch-user-header {
    display: flex;
    gap: 24px;
    justify-content: space-between;
    height: 72px;
    padding: 22px 24px
}

.model-switch-user .switch-user-container .switch-user-header .switch-user_title {
    color: var(--hbg-switch-txtcolor);
    font-weight: 500;
    font-size: 20px;
    font-style: normal;
    line-height: 28px
}

.model-switch-user .switch-user-container .switch-user-header .switch-user_close {
    width: 24px;
    height: 24px;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-header .switch-user_close img {
    width: 100%;
    height: 100%
}

.model-switch-user .switch-user-container .switch-user-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden
}

.model-switch-user .switch-user-container .switch-user-body .main-user {
    width: 100%
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_header {
    display: flex;
    align-items: center;
    height: 30px;
    padding: 0 24px 8px
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_header .main-user_title {
    color: var(--hbg-switch-txtcolor);
    font-weight: 500;
    font-size: 16px;
    font-style: normal;
    line-height: 22px
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 14px 24px;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content:hover {
    background: var(--hbg-content-bghovercolor);
    border-radius: 8px
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user_avatar {
    position: relative
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user_avatar .user_img {
    width: 42px;
    height: 42px;
    padding: 1px;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 50%
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user_avatar .user_img img {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user_avatar i {
    position: absolute;
    right: 0;
    bottom: 1px;
    z-index: 2;
    display: block;
    width: 8px;
    height: 8px
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user_avatar .user_avatar_big {
    width: 20px;
    height: 20px
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user_avatar .user_avatar__live {
    background: var(--hbg-user-info-live);
    background-size: 100% 100%
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user_avatar .user_avatar__v {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-v.ff55ff12.svg) no-repeat;
    background-size: 100% 100%
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user-info-container {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user-info-container .user_info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    justify-content: center;
    max-width: 460px;
    white-space: normal;
    word-wrap: break-word
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user-info-container .user_info .user_name {
    min-height: 22px;
    color: var(--hbg-switch-txtcolor);
    font-weight: 500;
    font-size: 16px;
    font-style: normal;
    line-height: 22px
}

.model-switch-user .switch-user-container .switch-user-body .main-user .main-user_content .user-info-container .user_info .user_uid {
    min-height: 14px;
    color: #8a8a8e;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 14px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user {
    margin-top: 8px;
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header {
    position: relative;
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: space-between;
    height: 44px;
    padding: 0 24px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header:after {
    position: absolute;
    right: 24px;
    bottom: 0;
    left: 24px;
    height: 1px;
    background: var(--hbg-switch-header-bordercolor);
    content: ""
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header .sub-user_tab {
    display: flex;
    gap: 24px;
    align-items: center;
    height: 100%
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header .sub-user_tab .sub-user_title {
    color: var(--hbg-switch-txtcolor);
    font-weight: 500;
    font-size: 16px;
    font-style: normal;
    line-height: 22px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header .user-tab_box .sub-user_title {
    color: #8a8a8e;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header .user-tab_box .tab-active {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    color: var(--hbg-tab-active-color)
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header .user-tab_box .tab-active:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 16px;
    height: 2px;
    background: #0173e5;
    transform: translateX(-50%);
    content: ""
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_header .sub-user_operate {
    color: #0173e5;
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content {
    width: 100%;
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container {
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: 24px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .loading-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-search {
    padding: 12px 24px 8px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-search .search__input {
    width: 100%;
    height: 40px;
    padding: 10px 24px;
    background: var(--hbg-switch-search-bgcolor);
    border-radius: 12px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-search .search__input input {
    width: 100%;
    height: 100%;
    padding: 0;
    color: var(--hbg-switch-search-txtcolor);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    background: var(--hbg-switch-search-bgcolor);
    border: none;
    outline: none
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-search .search__input input::-webkit-input-placeholder {
    color: #8a8a8e;
    font-weight: 400;
    font-size: 14px;
    font-style: normal
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-search .search__input input::-moz-placeholder {
    color: #8a8a8e
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-search .search__input input:-ms-input-placeholder {
    color: #8a8a8e
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .u-wrapper {
    display: contents
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list {
    padding-top: 8px;
    overflow-y: auto
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list::-webkit-scrollbar {
    width: 4px;
    background: transparent;
    border-radius: 0
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list::-webkit-scrollbar-thumb {
    width: 4px;
    background-color: var(--hbg-model-switch-bgcolor);
    border-radius: 0
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 14px 24px;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item:hover {
    background: var(--hbg-content-bghovercolor);
    border-radius: 8px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item .u-img {
    width: 40px;
    height: 40px;
    padding: 1px;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 50%
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item .u-img img {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item .u_content {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item .u_content .u_info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    justify-content: center;
    max-width: 460px;
    white-space: normal;
    word-wrap: break-word
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item .u_content .u_info .u_name {
    min-height: 20px;
    color: var(--hbg-switch-txtcolor);
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
    line-height: 20px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .sub-user_item .u_content .u_info .u_uid {
    min-height: 14px;
    color: #8a8a8e;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 14px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .sub-user_list .u-manage {
    cursor: default
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .u-check-img {
    width: 20px;
    height: 20px;
    border-radius: 50%
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .u-check-img img {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .u-clear {
    padding: 6px 0;
    color: #e94359;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    padding-top: 80px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container .no-data {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container .no-data .no-data_img {
    width: 76px;
    height: 76px;
    background: var(--hbg-no-data-img) no-repeat center;
    background-size: 76px 76px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container .no-data .no-data_img img {
    width: 100%;
    height: 100%
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container .no-data .no-data_txt {
    color: var(--hbg-switch-txtcolor);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container .no-data_button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    padding: 0 12px;
    background: #0173e5;
    border-radius: 4px;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container .no-data_button span {
    color: #fff;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 16px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .user-list-container .no-data-container .no-data_button:hover {
    background: #0069d9
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .u-user-list {
    display: flex;
    justify-content: space-between
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .u-user-list .add-button-container {
    display: flex;
    justify-content: flex-end;
    padding: 20px 24px 0 24px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .u-user-list .add-button-container .add-button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 16px;
    background: #0173e5;
    border-radius: 4px;
    cursor: pointer
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .u-user-list .add-button-container .add-button span {
    color: #fff;
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px
}

.model-switch-user .switch-user-container .switch-user-body .sub-user .sub-user_content .u-user-list .add-button-container .add-button:hover {
    background: #0069d9
}

.model-switch-user .switch-user-container .switch-user-body .u-disabled {
    cursor: not-allowed;
    pointer-events: none
}

.del-user-dialog {
    min-height: 180px;
    background: #fff;
    border-radius: 8px
}

.del-user-dialog .d-user-dialog-container {
    padding: 0 24px
}

.del-user-dialog .d-user-dialog-container .del-user-header {
    display: flex;
    justify-content: space-between;
    padding: 22px 0
}

.del-user-dialog .d-user-dialog-container .del-user-header .del-user_title {
    color: #000;
    font-weight: 500;
    font-size: 20px;
    font-style: normal;
    line-height: 28px
}

.del-user-dialog .d-user-dialog-container .del-user-header .del-user_close {
    width: 24px;
    height: 24px;
    cursor: pointer
}

.del-user-dialog .d-user-dialog-container .del-user-header .del-user_close img {
    width: 100%;
    height: 100%
}

.del-user-dialog .d-user-dialog-container .del-user-body {
    color: #000;
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px
}

.del-user-dialog .d-user-dialog-container .del-user-footer .del-button-container {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: flex-end;
    padding: 20px 0 24px 0
}

.del-user-dialog .d-user-dialog-container .del-user-footer .del-button-container .button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 88px;
    height: 44px;
    padding: 0 16px;
    background: #fff;
    border: 0;
    cursor: pointer
}

.del-user-dialog .d-user-dialog-container .del-user-footer .del-button-container .cancel-button {
    color: #000;
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px
}

.del-user-dialog .d-user-dialog-container .del-user-footer .del-button-container .cancel-button:hover {
    background-color: #fafafa
}

.del-user-dialog .d-user-dialog-container .del-user-footer .del-button-container .confirm-button {
    color: #fff;
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px;
    background: #0173e5;
    border-radius: 4px
}

.del-user-dialog .d-user-dialog-container .del-user-footer .del-button-container .confirm-button:hover {
    background-color: #0069d9
}

.HBDrawer.HBDrawer--open .HBDrawer__overlay {
    display: block;
    opacity: 1
}

.HBDrawer.HBDrawer--open .HBDrawer__container {
    transform: translateZ(0) !important;
    visibility: visible
}

.HBDrawer.HBDrawer--open .hbg-user-info__detail .hbg-user-info__content .username_switch {
    width: auto
}

.HBDrawer .HBDrawer__overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
    display: none;
    width: 100%;
    height: 100vh;
    transition: opacity .2s ease-in 0s
}

.HBDrawer .HBDrawer__container {
    position: fixed;
    display: flex;
    flex-direction: column;
    width: 100% !important;
    max-height: 80vh;
    overflow: auto;
    color: var(--hbg-header-main-txtcolor);
    background: var(--hbg-header-main-bgcolor);
    border-radius: 0 0 8px 8px;
    visibility: hidden;
    transition: all .3s
}

.HBDrawer .HBDrawer__header {
    position: relative;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    justify-content: space-between;
    height: var(--hbg-header-height);
    padding: 0 16px;
    background: #0e1015
}

.HBDrawer .HBDrawer__close {
    width: 16px;
    height: 16px;
    cursor: pointer
}

.HBDrawer .hbg-user-dropdown__short {
    display: block
}

.hgb-popup-parent--hidden {
    overflow: hidden
}

.hbg-drawer {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 100vh;
    margin: 0;
    color: var(--hbg-header-main-txtcolor);
    font-size: 12px;
    line-height: 14px;
    background: var(--hbg-header-main-bgcolor);
    border-radius: 0 0 8px 8px;
    transition: all .3s
}

@media screen and (max-width:1027px) {
    .hbg-drawer {
        width: 100%;
        max-height: 80vh
    }
}

.hbg-drawer__title {
    position: relative;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    height: 44px;
    padding: 0 16px
}

@media screen and (min-width:745px) and (max-width:1024px) {
    .hbg-drawer__title {
        height: 64px;
        background: var(--hbg-header-main-bgcolor)
    }
}

.hbg-drawer__icon-back,
.hbg-drawer__title-close {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-back-white.e51b4993.svg) no-repeat 50%;
    background-size: 20px 20px;
    cursor: pointer
}

.hbg-drawer--light .hbg-drawer__icon-back,
.hbg-drawer--light .hbg-drawer__title-close {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-back.d53eca98.svg)
}

.hbg-drawer__title-close {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-close.ca788eee.svg)
}

@media screen and (max-width:1027px) {
    .hbg-drawer__title-close {
        background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-close-white.a7871cbe.svg)
    }
}

.hbg-drawer__title-logo,
.hbg-drawer__title-logo-img {
    width: 55px;
    height: 16px
}

@media screen and (min-width:1028px) {
    .hbg-drawer__title-logo {
        display: none
    }
}

.hbg-drawer__title-close {
    position: absolute;
    top: 10px;
    right: 16px;
    width: 24px;
    height: 24px
}

.hbg-drawer__content {
    padding: 0 0;
    overflow: auto;
    border-top: 1px solid var(--hbg-header-split-color);
    border-radius: 0 0 8px 8px
}

.hbg-drawer__overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, .5);
    transition: opacity .2s ease-in 0s
}

.hbg-drawer .hbg-user-info__detail .hbg-user-info__content .username_switch {
    width: auto
}

.v-modal-enter {
    animation: v-modal-in .2s ease
}

.v-modal-leave {
    animation: v-modal-out .2s ease forwards
}

@keyframes v-modal-in {
    0% {
        opacity: 0
    }
}

@keyframes v-modal-out {
    to {
        opacity: 0
    }
}

.draw-fade-enter-active {
    animation: draw-fade-in .3s
}

.draw-fade-leave-active {
    animation: draw-fade-out .3s
}

@keyframes draw-fade-in {
    0% {
        transform: translate3d(100%, 0, 0)
    }

    to {
        transform: translateZ(0)
    }
}

@keyframes draw-fade-out {
    0% {
        transform: translateZ(0);
        opacity: 1
    }

    to {
        transform: translate3d(100%, 0, 0);
        opacity: 0
    }
}

@keyframes draw-fade-in__top-bottom {
    0% {
        transform: translate3d(0, -100%, 0)
    }

    to {
        transform: translateZ(0)
    }
}

@keyframes draw-fade-out__top-bottom {
    0% {
        transform: translateZ(0);
        opacity: 1
    }

    to {
        transform: translate3d(0, -100%, 0);
        opacity: 0
    }
}

.draw-fade__top-bottom-enter-active {
    animation: draw-fade-in__top-bottom .3s
}

.draw-fade__top-bottom-leave-active {
    animation: draw-fade-out__top-bottom .3s
}

.hbg-drawer .hbg-currencys,
.hbg-drawer .hbg-languages {
    width: 100%
}

.hbg-drawer .hbg-currencys .hb-menu-dropdown__body__item__sub,
.hbg-drawer .hbg-languages .hb-menu-dropdown__body__item__sub {
    display: none
}

.hbg-drawer .hbg-currencys .hb-menu-dropdown__body__items,
.hbg-drawer .hbg-languages .hb-menu-dropdown__body__items {
    max-height: none
}

.hbg-drawer .hbg-user-dropdown__short {
    display: block
}

.hbg-download {
    width: 288px;
    padding: 24px;
    display: flex;
    box-sizing: content-box
}

.hbg-download__img {
    width: 110px;
    height: 110px;
    margin-right: 12px;
    padding: 4px;
    background: #fff;
    box-sizing: border-box;
    border: .5px solid #e9eaed
}

.hbg-download__img svg {
    width: 102px;
    height: 102px
}

.hbg-download__title {
    margin-bottom: 9px;
    color: var(--hbg-header-main-txtcolor);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.hbg-download__content {
    padding: 4px 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.hbg-download .fed-btn--primary {
    color: #0094ff;
    background: rgba(1, 115, 229, .1);
    border: 0
}

.global-common-header,
.hbg-drawer--dark {
    --hbg-user-info-bgcolor: hsla(0, 0%, 100%, .1);
    --hbg-user-info-live: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-live-dark.9fff186a.svg) no-repeat;
    --hbg-header-user-txtcolor: #e6e6e6;
    --hbg-header-switch-txtcolor: #8c8c93;
    --hbg-header-switch-hovercolor: #e6e6e6;
    --switch-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/switch.800b84a1.svg);
    --switch-hover-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/switch_hover.7e603d60.svg);
    --user-line-height: 26px;
    --switch-bordercolor: #333
}

.global-common-header .hbg-user-info__uid,
.hbg-drawer--dark .hbg-user-info__uid {
    color: #8c8c93
}

.global-common-header .hbg-user-info__uid-copy,
.hbg-drawer--dark .hbg-user-info__uid-copy {
    width: 12px;
    height: 12px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-copy.398a8cf7.svg) no-repeat 50%;
    background-size: 12px 12px
}

.global-common-header--light,
.hbg-drawer--light {
    --hbg-user-info-bgcolor: rgba(0, 0, 0, .1);
    --hbg-user-info-live: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-live-light.8658ed6f.svg) no-repeat;
    --hbg-header-user-txtcolor: #000;
    --hbg-header-switch-txtcolor: #565656;
    --hbg-header-switch-hovercolor: #000;
    --switch-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/switch_light.b2e7d04f.svg);
    --switch-hover-img: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/switch_hover_light.c935601b.svg);
    --user-line-height: 22px;
    --switch-bordercolor: #ddd
}

.global-common-header--light .hbg-user-info__uid,
.hbg-drawer--light .hbg-user-info__uid {
    padding: 2px 4px;
    color: #000;
    background: #fafafa;
    border-radius: 100px
}

.global-common-header--light .hbg-user-info__uid-copy,
.hbg-drawer--light .hbg-user-info__uid-copy {
    width: 14px;
    height: 14px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-copy--light.3b063df1.svg) no-repeat 50%;
    background-size: 14px 14px
}

.hbg-user-info {
    display: flex;
    gap: 8px;
    align-items: center
}

.hbg-user-info__avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    cursor: pointer;
    transition: width .3s
}

.hbg-user-info__avatar img {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

.hbg-user-info__detail {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 4px;
    overflow: hidden
}

.hbg-user-info__content {
    display: flex;
    gap: 18px;
    align-items: flex-end;
    justify-content: space-between
}

.hbg-user-info__switch {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
    height: 22px;
    padding: 0 8px;
    border: 1px solid var(--switch-bordercolor);
    border-radius: 40px;
    cursor: pointer
}

.hbg-user-info__switch:hover span {
    color: var(--hbg-header-switch-hovercolor)
}

.hbg-user-info__switch:hover .switch-img {
    background: var(--switch-hover-img) no-repeat center center;
    background-size: 12px 12px
}

.hbg-user-info__switch span {
    display: inline-block;
    color: var(--hbg-header-switch-txtcolor);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: normal;
    white-space: nowrap
}

.hbg-user-info__switch .switch-img {
    width: 12px;
    height: 12px;
    background: var(--switch-img) no-repeat center center;
    background-size: 12px 12px
}

.hbg-user-info__username {
    color: var(--hbg-header-user-txtcolor);
    font-weight: 700;
    font-size: 20px;
    font-style: normal;
    line-height: var(--user-line-height);
    cursor: pointer
}

.hbg-user-info .username_switch {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.hbg-user-info__uid {
    display: inline-flex;
    gap: 2px;
    align-items: center;
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 14px
}

.hbg-user-info .icon-copy-w {
    display: flex;
    align-items: center;
    height: 100%
}

.hbg-user-info__uid-copy {
    display: inline-block;
    cursor: pointer
}

.hbg-user-info__uid-copy--success {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-copied.c0fefbb4.svg)
}

.hbg-user-info__medals>img {
    width: 24px;
    height: 24px
}

.hbg-user-avatar {
    position: relative;
    overflow: hidden;
    cursor: pointer
}

.hbg-user-avatar__img {
    width: 100%;
    height: 100%
}

.hbg-user-avatar__is-not-nft {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50%
}

.hbg-user-avatar__border {
    border: 1px solid transparent;
    border-radius: 50%
}

.hbg-user-avatar__border,
.hbg-user-avatar__border-general {
    width: 100%;
    height: 100%;
    padding: 1px;
    overflow: hidden
}

.hbg-user-avatar i {
    position: absolute;
    right: 0;
    bottom: 1px;
    z-index: 2;
    display: block;
    width: 8px;
    height: 8px
}

.hbg-user-avatar__big {
    width: 20px !important;
    height: 20px !important
}

.hbg-user-avatar__live {
    background: var(--hbg-user-info-live);
    background-size: 100% 100%
}

.hbg-user-avatar__v {
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-v.ff55ff12.svg) no-repeat;
    background-size: 100% 100%
}

.hbg-user-dropdown {
    padding: 0
}

.hbg-user-dropdown__user {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    padding: 24px 28px;
    box-shadow: inset 0 -1px 0 var(--hbg-header-split-color);
    cursor: default
}

.hbg-user-dropdown .hbg-cell-group {
    transition: border-bottom .3s
}

.hbg-user-dropdown .hbg-fee__border {
    margin-top: 12px;
    transition: margin-bottom .3s
}

.hbg-user-dropdown__short {
    display: none
}

.hb-dropdown-wrap .hbg-user-dropdown {
    height: 100%;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto
}

.hb-dropdown-wrap .hbg-user-dropdown::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.hb-dropdown-wrap .hbg-user-dropdown::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hb-dropdown-wrap .hbg-user-dropdown .hbg-cell {
    height: 52px
}

.hb-dropdown-wrap .hbg-user-dropdown .hbg-cell .hbg-cell__title {
    color: var(--hbg-header-user-txt-color);
    font-weight: 400;
    font-size: 14px;
    font-style: normal;
    line-height: 20px
}

.hb-dropdown-wrap .hbg-user-dropdown .hbg-cell .hbg-cell-user_key p {
    position: relative
}

.hb-dropdown-wrap .hbg-user-dropdown .hbg-cell .hbg-cell-user_key p:before {
    position: absolute;
    top: 0;
    right: -8px;
    width: 6px;
    height: 6px;
    background: #e94359;
    border-radius: 50%;
    content: ""
}

.hb-dropdown-wrap .hbg-user-dropdown .hbg-cell-group {
    background-color: transparent;
    border-bottom: 1px solid var(--hbg-header-split-color)
}

.hb-dropdown-wrap .hbg-user-dropdown .hbg-cell-group a.hbg-cell {
    color: var(--hbg-header-main-txtcolor)
}

.hb-dropdown-wrap .hbg-user-dropdown .hbg-cell-group .hbg-cell.is-link:hover {
    background: var(--hbg-header-main-hover-bgcolor)
}

.global-common-header {
    --pl-btn: #313132;
    --pl-btn-text: #292929;
    --pl-btn-hover: #0173e5;
    --icon-eye: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-eye-open.d100983a.svg);
    --icon-eye-close: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-eye-close.388d31ce.svg);
    --icon-pl: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-profit-and-loss.21819e94.svg);
    --hbg-finance-tips-text: hsla(38, 73%, 97%, .6);
    --icon-finance-tips: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-finance-tips.cf7471d0.svg);
    --pl-text: #e6e6e6;
    --otc-bg: #313132;
    --otc-bg-hover: #0173e5;
    --audit-color: #e6e6e6;
    --pl-btn-text-border: #0173e5;
    --otc-top-border: #292929
}

.global-common-header--light {
    --pl-btn: #f5f5f5;
    --pl-btn-text: #ebebeb;
    --pl-btn-hover: #0173e5;
    --icon-eye: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-eye-open--light.b2110e8c.svg);
    --icon-eye-close: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-eye-close--light.dfa5900d.svg);
    --icon-pl: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-profit-and-loss--light.43f285ba.svg);
    --hbg-finance-tips-text: #000;
    --pl-text: #000;
    --otc-bg: #f5f5f5;
    --otc-bg-hover: #0173e5;
    --audit-color: #000;
    --pl-btn-text-border: #0173e5;
    --otc-top-border: #ebebeb
}

.hbg-finance-tips {
    padding: 10px 10px 5px
}

.hbg-finance-tips_val {
    display: flex;
    margin: 0;
    padding: 11px 16px;
    color: var(--hbg-finance-tips-text);
    font-size: 12px;
    line-height: 18px;
    white-space: normal;
    background: rgba(224, 147, 0, .05);
    border: 1px solid rgba(224, 147, 0, .3);
    border-radius: 2px
}

.hbg-finance-tips_val i {
    display: block;
    flex: 0 0 12px;
    width: 12px;
    height: 12px;
    margin: 3px 8px 0 0;
    background-image: var(--icon-finance-tips)
}

.hbg-finance-tips_val-box p {
    margin: 0
}

.hbg-finance-tips:hover {
    cursor: default
}

.hbg-finance-v2 {
    padding: 16px 24px
}

.hbg-finance-v2__title-bar {
    display: flex;
    align-items: center;
    margin-bottom: 8px
}

.hbg-finance-v2__title-bar .fed-icon__arrow--right {
    margin-left: auto
}

.hbg-finance-v2__title {
    margin-right: 8px;
    font-size: 14px;
    line-height: 20px;
    line-height: 16px;
    color: #8c8c93
}

.hbg-finance-v2__eye {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: var(--icon-eye) no-repeat 0 0;
    background-size: 14px 14px;
    cursor: pointer
}

.hbg-finance-v2__eye--close {
    background-image: var(--icon-eye-close)
}

.hbg-finance-v2__assets-title {
    margin-bottom: 2px;
    color: var(--hbg-header-main-txtcolor);
    font-size: 12px;
    line-height: 16px;
    font-style: normal;
    font-weight: 400
}

.hbg-finance-v2__assets-val {
    margin-bottom: 6.5px;
    overflow: hidden;
    color: var(--hbg-header-main-txtcolor);
    font-weight: 700;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 30px;
    text-overflow: ellipsis
}

.hbg-finance-v2__assets-pl {
    display: flex;
    align-items: center
}

.hbg-finance-v2__assets-pl-title {
    margin-right: 8px;
    color: var(--hbg-header-secondary-txtcolor);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px
}

.hbg-finance-v2__assets-pl-val {
    margin-right: 4px;
    overflow: hidden;
    color: var(--hbg-header-tertiary-txtcolor);
    font-weight: 700;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px;
    text-overflow: ellipsis
}

.hbg-finance-v2__assets-pl-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 4px;
    background: var(--icon-pl) no-repeat center center;
    background-size: 12px 12px
}

.hbg-finance-v2__assets-pl-btn {
    display: flex;
    align-items: center;
    height: 25px;
    margin-left: auto;
    padding: 6px 16px;
    color: var(--pl-btn-text);
    font-size: 12px;
    line-height: 13px
}

.hbg-finance-v2__assets-pl-btn span {
    color: var(--pl-text);
    font-weight: 400;
    font-size: 12px;
    font-style: normal;
    line-height: 13px
}

.hbg-finance-v2__assets-pl-btn:hover {
    cursor: pointer
}

.hbg-finance-v2:hover {
    background: var(--hbg-header-main-hover-bgcolor)
}

.hbg-finance-v2__otc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 24px
}

.hbg-finance-v2__otc span {
    display: block;
    border-radius: 8px;
    background: var(--otc-bg);
    flex: 1;
    font-size: 12px;
    font-weight: 500;
    height: 32px;
    line-height: 32px;
    text-align: center;
    color: var(--otc-color)
}

.hbg-finance-v2__otc span:nth-child(2) {
    margin: 0 8px
}

.hbg-finance-v2__otc span:hover {
    cursor: pointer;
    background: var(--otc-bg-hover);
    color: #fff
}

.hbg-finance-v2__audit {
    padding: 0 24px
}

.hbg-finance-v2__audit .hbg-finance-v2__audit-content {
    border-top: 1px solid var(--otc-top-border);
    padding: 16px 0;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.hbg-finance-v2__audit .hbg-finance-v2__audit-content p {
    font-size: 14px;
    line-height: 20px;
    color: var(--audit-color)
}

.hbg-finance-v2__audit:hover {
    cursor: pointer;
    background: var(--hbg-header-main-hover-bgcolor)
}

.hbg-finance-v2__audit:hover p {
    font-weight: 500
}

.hbg-finance-dropdown {
    height: 100%;
    max-height: none !important;
    padding: 4px;
    overflow: auto
}

.hbg-finance-dropdown::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.hbg-finance-dropdown::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: var(--hbg-header-scrollbar-bgcolor);
    border-radius: 0
}

.hbg-finance-cell-item {
    justify-content: space-between;
    height: 52px;
    padding: 16px 24px;
    cursor: pointer
}

.hbg-finance-cell-item,
.hbg-finance-cell-item__title {
    display: flex;
    align-items: center
}

.hbg-finance-cell-item__title .hbg-finance-cell-item__label {
    color: var(--hbg-header-main-txtcolor);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px
}

.hbg-finance-cell-item__title .hbg-finance-cell-item__val {
    color: var(--hbg-header-secondary-txtcolor);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    padding-left: 8px
}

.hbg-finance-cell-item__title .finance-balance-newtips-wrapper {
    display: inline-block;
    position: relative
}

.hbg-finance-cell-item__title .finance-balance-newtips-wrapper .finance-balance-newtips {
    margin-left: 4px;
    width: 32px;
    height: 14px;
    font-size: 10px;
    line-height: 14px;
    font-weight: 400;
    color: #007fff;
    text-align: center;
    background-color: rgba(0, 127, 255, .1);
    border-radius: 4px;
    display: inline-block
}

.hbg-finance-cell-item__title .finance-balance-newtips-wrapper .newtip-box {
    display: none
}

.hbg-finance-cell-item__title .finance-balance-newtips-wrapper:hover .newtip-box {
    display: block;
    position: absolute;
    bottom: 26px;
    left: 50%;
    background-color: #4d4d4d;
    color: #fff;
    padding: 12px 12px;
    border-radius: 8px;
    transform: translateX(-40%);
    width: 246px;
    white-space: normal;
    word-wrap: break-word;
    text-align: center
}

.hbg-finance-cell-item__title .finance-balance-newtips-wrapper:hover .newtip-box:before {
    content: "";
    position: absolute;
    bottom: -6px;
    left: 38%;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #4d4d4d transparent transparent transparent
}

.hbg-finance-cell-item__value {
    flex: 1;
    margin-left: 12px;
    overflow: hidden;
    text-align: right
}

.hbg-finance-cell-item__value .hbg-finance-cell-item__label {
    width: 100%;
    overflow: hidden;
    color: var(--hbg-header-main-txtcolor);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap;
    text-overflow: ellipsis
}

.hbg-finance-cell-item__value .hbg-finance-cell-item__val {
    color: var(--hbg-header-main-txtcolor)
}

.hbg-finance-cell-item__value .hbg-finance-cell-item__val.is-rise {
    color: #00a171
}

.hbg-finance-cell-item__value .hbg-finance-cell-item__val.is-fall {
    color: #e94359
}

.hbg-finance-cell-item:hover {
    background: var(--hbg-header-main-hover-bgcolor)
}

.hbg-finance-cell-item:hover .hbg-finance-cell-item__title .hbg-finance-cell-item__label {
    font-weight: 700
}

.fed-collapes-item {
    position: relative
}

.fed-collapes-item:after {
    position: absolute;
    right: 16px;
    bottom: 0;
    left: 16px;
    display: none;
    content: ""
}

.fed-collapes-item:last-child:after {
    display: none
}

.fed-collapes-item__title {
    height: 48px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    color: var(--hbg-header-main-txtcolor);
    font-size: 14px;
    line-height: 16px;
    background: var(--hbg-header-main-bgcolor);
    cursor: pointer
}

.fed-collapes-item__title .fed-icon__arrow {
    transform: rotate(-90deg);
    transition: all .3s
}

.fed-collapes-item__title[aria-expanded=false] .fed-icon__arrow {
    transform: rotate(90deg)
}

.fed-collapes-item__title[aria-expanded=true] {
    color: var(--hbg-header-primary-color);
    font-weight: 700
}

.fed-collapes-item__title[aria-expanded=true] .fed-icon__arrow:after {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-arrow-right-active.4bf593ae.svg)
}

.fed-collapes-item__title-text {
    flex: 1
}

.fed-collapes-item__content {
    position: relative
}

.fed-collapes-item__content .hbg-cell-group {
    background: var(--hbg-header-main-bgcolor)
}

.fed-collapes-item__content .hbg-cell {
    padding: 0 40px
}

.fed-collapes-item__content .hbg-cell:after {
    display: none
}

.fed-collapes-item__content .hbg-cell:active,
.fed-collapes-item__content .hbg-cell:hover {
    background: var(--hbg-header-main-hover-bgcolor)
}

.fed-collapes-item__content .hbg-cell__title {
    color: var(--hbg-header-main-txtcolor);
    font-size: 14px;
    line-height: 16px
}

.fed-collapes-item__content:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: none;
    border-bottom: 1px solid hsla(0, 0%, 100%, .06);
    content: ""
}

.fed-collapes-item__content-wrapper {
    position: relative;
    overflow: hidden;
    transition: height .3s
}

.fed-collapes-item__content-wrapper:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border-bottom: 1px solid var(--hbg-header-split-color);
    content: ""
}

.hbg-panel-function .fed-collapes>.hbg-cell {
    padding: 0 16px
}

.hbg-panel-function .fed-collapes,
.hbg-panel-function .login-panel {
    border-bottom: 1px solid var(--hbg-header-split-color)
}

.hbg-login {
    padding: 24px 16px
}

.hbg-login__title {
    margin-bottom: 4px;
    color: var(--hbg-header-main-txtcolor);
    font-weight: 400;
    font-size: 16px;
    line-height: 19px
}

.hbg-login__subtitle {
    color: var(--fed-btn-block-color);
    font-weight: 400;
    font-size: 12px;
    line-height: 14px
}

@media screen and (min-width:376px) {
    .hbg-login {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between
    }

    .hbg-login__btns {
        display: flex;
        margin-left: 12px
    }

    .hbg-login__btns .fed-btn {
        min-width: 80px;
        white-space: nowrap;
        text-align: center
    }

    .hbg-login__btns .fed-btn:first-child {
        margin-right: 8px
    }
}

@media screen and (max-width:375px) {
    .hbg-login {
        display: flex;
        flex-direction: column
    }

    .hbg-login__btns {
        margin-top: 24px;
        display: flex
    }

    .hbg-login__btns .fed-btn {
        flex: 1
    }

    .hbg-login__btns .fed-btn:first-child {
        margin-right: 8px
    }
}

.hbg-more-btn {
    position: relative;
    width: 16px;
    height: 13px;
    cursor: pointer
}

.hbg-more-btn>div {
    position: absolute;
    left: 0;
    width: 16px;
    height: 3px;
    background-color: var(--hbg-header-main-txtcolor);
    transform: scaleY(.5);
    transform-origin: 0 50%;
    transition: all .3s
}

.hbg-more-btn__line0 {
    top: 0
}

.hbg-more-btn__line1 {
    top: 5px
}

.hbg-more-btn__line2 {
    bottom: 0
}

.hbg-more-btn__close>div {
    width: 17px;
    background-color: #0094ff
}

.hbg-more-btn__close .hbg-more-btn__line0 {
    top: -.9px;
    left: -.9px;
    transform: rotate(45deg) scaleY(.5)
}

.hbg-more-btn__close .hbg-more-btn__line1 {
    width: 0;
    opacity: 0
}

.hbg-more-btn__close .hbg-more-btn__line2 {
    bottom: -.9px;
    left: -.9px;
    transform: rotate(-45deg) scaleY(.5)
}

.hbg-user-info__prime--level[data-level="0"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime0.08b78357.svg)
}

.hbg-user-info__prime--level[data-level="1"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime1.a945c553.svg)
}

.hbg-user-info__prime--level[data-level="2"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime2.a945c553.svg)
}

.hbg-user-info__prime--level[data-level="3"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime3.a945c553.svg)
}

.hbg-user-info__prime--level[data-level="4"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime4.9994e10b.svg)
}

.hbg-user-info__prime--level[data-level="5"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime5.9994e10b.svg)
}

.hbg-user-info__prime--level[data-level="6"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime6.9994e10b.svg)
}

.hbg-user-info__prime--level[data-level="7"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime7.77aa690a.svg)
}

.hbg-user-info__prime--level[data-level="8"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime8.77aa690a.svg)
}

.hbg-user-info__prime--level[data-level="9"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime9.77aa690a.svg)
}

.hbg-user-info__prime--level[data-level="10"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime10.4bf587f9.svg)
}

.hbg-user-info__prime--level[data-level="11"] {
    --level: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/prime11.4bf587f9.svg)
}

.global-common-header,
.hbg-drawer--dark {
    --kyc-bg: #282829;
    --kyc-color: #d7deeb
}

.global-common-header .hbg-user-info__prime--level[data-level="0"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="0"] {
    --experience-color: #737e96;
    --experience-bg: #172736
}

.global-common-header .hbg-user-info__prime--level[data-level="1"],
.global-common-header .hbg-user-info__prime--level[data-level="2"],
.global-common-header .hbg-user-info__prime--level[data-level="3"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="1"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="2"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="3"] {
    --experience-color: #12b298;
    --experience-bg: #192925
}

.global-common-header .hbg-user-info__prime--level[data-level="4"],
.global-common-header .hbg-user-info__prime--level[data-level="5"],
.global-common-header .hbg-user-info__prime--level[data-level="6"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="4"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="5"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="6"] {
    --experience-color: #c68258;
    --experience-bg: #2f2323
}

.global-common-header .hbg-user-info__prime--level[data-level="7"],
.global-common-header .hbg-user-info__prime--level[data-level="8"],
.global-common-header .hbg-user-info__prime--level[data-level="9"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="7"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="8"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="9"] {
    --experience-color: #f28301;
    --experience-bg: #2a2419
}

.global-common-header .hbg-user-info__prime--level[data-level="10"],
.global-common-header .hbg-user-info__prime--level[data-level="11"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="10"],
.hbg-drawer--dark .hbg-user-info__prime--level[data-level="11"] {
    --experience-color: #d7deeb;
    --experience-bg: #2c2b1b
}

.global-common-header--light,
.hbg-drawer--light {
    --kyc-bg: #f5f5f5;
    --kyc-color: #000
}

.global-common-header--light .hbg-user-info__prime--level[data-level="0"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="0"] {
    --experience-bg: #eef5fd
}

.global-common-header--light .hbg-user-info__prime--level[data-level="1"],
.global-common-header--light .hbg-user-info__prime--level[data-level="2"],
.global-common-header--light .hbg-user-info__prime--level[data-level="3"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="1"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="2"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="3"] {
    --experience-bg: #e7fdfa
}

.global-common-header--light .hbg-user-info__prime--level[data-level="4"],
.global-common-header--light .hbg-user-info__prime--level[data-level="5"],
.global-common-header--light .hbg-user-info__prime--level[data-level="6"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="4"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="5"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="6"] {
    --experience-bg: #fcede4
}

.global-common-header--light .hbg-user-info__prime--level[data-level="7"],
.global-common-header--light .hbg-user-info__prime--level[data-level="8"],
.global-common-header--light .hbg-user-info__prime--level[data-level="9"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="7"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="8"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="9"] {
    --experience-bg: #fff4e4
}

.global-common-header--light .hbg-user-info__prime--level[data-level="10"],
.global-common-header--light .hbg-user-info__prime--level[data-level="11"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="10"],
.hbg-drawer--light .hbg-user-info__prime--level[data-level="11"] {
    --experience-bg: #f0edf3
}

.hbg-user-info__prime {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-between
}

.hbg-user-info__prime--dmc,
.hbg-user-info__prime--level,
.hbg-user-info__prime-kyc {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 6px 8px 6px 4px;
    font-weight: 500;
    font-size: 12px;
    border-radius: 4px
}

.hbg-user-info__prime--dmc span,
.hbg-user-info__prime--level span,
.hbg-user-info__prime-kyc span {
    padding-left: 8px
}

.hbg-user-info__prime--dmc:hover,
.hbg-user-info__prime--level:hover,
.hbg-user-info__prime-kyc:hover {
    cursor: pointer
}

.hbg-user-info__prime--level {
    color: var(--experience-color);
    background: var(--experience-bg)
}

.hbg-user-info__prime--level i {
    display: block;
    width: 14px;
    height: 14px;
    background: var(--level)
}

.hbg-user-info__prime--dmc,
.hbg-user-info__prime-kyc {
    color: var(--kyc-color);
    background: var(--kyc-bg)
}

.hbg-user-info__prime--dmc i {
    display: block;
    width: 14px;
    height: 14px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/dmc.892bb23b.svg) no-repeat
}

.hbg-user-info__prime--dmc p {
    width: 14px;
    height: 14px;
    overflow: hidden
}

.hbg-user-info__prime--dmc p img {
    display: block;
    width: 100%;
    height: 100%
}

.hbg-user-info__prime-kyc-level {
    display: flex;
    align-items: center;
    justify-content: center
}

.hbg-user-info__prime-kyc-level p {
    width: 14px;
    height: 14px;
    overflow: hidden
}

.hbg-user-info__prime-kyc-level p img {
    display: block;
    width: 100%;
    height: 100%
}

.hbg-user-info__prime .nokyc {
    color: #fe8731;
    background: rgba(254, 135, 49, .07)
}

p {
    margin: 0;
    padding: 0
}

.hbg-seting {
    width: 400px;
    padding: 30px 24px 32px
}

.hbg-seting__bg {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

.hbg-seting__bg span {
    display: block;
    font-size: 14px;
    line-height: 20px
}

.hbg-seting__bg .switch {
    width: 38px;
    height: 20px;
    border: none
}

.hbg-seting__bg .switch .knobs,
.hbg-seting__bg .switch .layer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.hbg-seting__bg .switch .button {
    position: relative;
    top: 0;
    width: 38px;
    height: 20px;
    margin: 0 auto;
    overflow: hidden
}

.hbg-seting__bg .switch .button.r,
.hbg-seting__bg .switch .button.r .layer {
    border-radius: 100px
}

.hbg-seting__bg .switch .checkbox {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    cursor: pointer;
    opacity: 0
}

.hbg-seting__bg .switch .knobs {
    z-index: 2
}

.hbg-seting__bg .switch .layer {
    z-index: 1;
    width: 100%;
    background-color: #383e4a;
    transition: all .3s ease
}

.hbg-seting__bg .switch .layer--light {
    background-color: #adadb4
}

.hbg-seting__bg .switch .button .knobs:before {
    position: absolute;
    top: 3px;
    left: 4px;
    width: 14px;
    height: 14px;
    color: #fff;
    background-color: #fff;
    border-radius: 50%;
    transition: all .3s cubic-bezier(.18, .89, .35, 1.15);
    content: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/light.ca01d8a9.svg)
}

.hbg-seting__bg .switch .button .checkbox:checked+.knobs:before {
    left: 21px;
    background-color: #fff;
    content: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/dark.832a3201.svg)
}

.hbg-seting__bg .switch .button .knobs,
.hbg-seting__bg .switch .button .knobs:before,
.hbg-seting__bg .switch .button .layer {
    transition: all .3s ease
}

.hbg-seting__bg--switch .switch-text {
    position: relative;
    z-index: 0;
    padding-bottom: 2px
}

.hbg-seting__bg--switch .switch-text .tips {
    position: absolute;
    bottom: 25px;
    left: 50%;
    z-index: 1;
    display: none;
    width: 280px;
    padding: 16px 12px;
    color: #565656;
    font-size: 12px;
    line-height: 16px;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .06), 0 0 6px 0 rgba(0, 0, 0, .04);
    transform: translateX(-50%)
}

.hbg-seting__bg--switch .switch-text .tips:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 10px;
    height: 6px;
    transform: translateX(-50%);
    content: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/tips-arrow.f155144e.svg)
}

.hbg-seting__bg--switch .switch-text:hover .tips {
    display: block
}

.hbg-seting__box {
    margin-top: 25px
}

.hbg-seting__box .line {
    width: 100%;
    height: 1px;
    background: #333
}

.hbg-seting__box .line--light {
    background: #ddd
}

.hbg-seting__box .set-title {
    display: block;
    padding-top: 28px;
    color: var(--dropdown-content-subtitle-color);
    font-size: 14px;
    line-height: 20px
}

.hbg-seting__box .title--light {
    color: #8a8a8e
}

.hbg-seting__box .set-color {
    padding-top: 20px
}

.hbg-seting__box .set-color__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 20px
}

.hbg-seting__box .set-color__item:first-child {
    padding-top: 0
}

.hbg-seting__box .set-color__item span {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 14px;
    line-height: 20px
}

.hbg-seting__box .set-color__item span i {
    position: relative;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 4px;
    background: #00a171;
    border-radius: 2px
}

.hbg-seting__box .set-color__item span i:after {
    position: absolute;
    top: 3px;
    left: 2px;
    display: block;
    width: 12px;
    height: 9px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/set--color.69ad26f8.svg);
    content: ""
}

.hbg-seting__box .set-color__item p {
    display: block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    border: 1px solid #383e4a;
    border-radius: 8px;
    cursor: pointer
}

.hbg-seting__box .set-color .set-red i {
    background: #e94359
}

.hbg-seting__box .set-color--light span {
    color: #000
}

.hbg-seting__box .set-color--light p {
    border: 1px solid #adadb4
}

.hbg-seting__box .set-color--light p.active {
    border: 5px solid #0173e5;
    cursor: default
}

.hbg-seting__box .set-color--dark p.active {
    border: 5px solid #0094ff;
    cursor: default
}

.hbg-seting__box .set-type {
    display: flex;
    justify-content: space-between;
    padding-top: 28px
}

.hbg-seting__box .set-type div {
    cursor: pointer
}

.hbg-seting__box .set-type div p {
    display: flex;
    align-items: center;
    padding-bottom: 8px;
    line-height: 20px
}

.hbg-seting__box .set-type div p i {
    display: block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    border: 1px solid #383e4a;
    border-radius: 8px
}

.hbg-seting__box .set-type div img {
    display: block;
    width: 166px;
    height: auto
}

.hbg-seting__box .set-type--light div p i {
    border: 1px solid #adadb4
}

.hbg-seting__box .set-type--dark .active,
.hbg-seting__box .set-type--light .active {
    border: 5px solid #0094ff;
    cursor: default
}

.hbg-seting__box .hbg-seting__bg {
    padding-top: 28px
}

.hbg-seting__box .hbg-seting__bg .switch-text {
    border-bottom: 1px dashed #383e4a;
    cursor: pointer
}

.hbg-seting__box .hbg-seting__bg .button .checkbox:checked+.knobs:before,
.hbg-seting__box .hbg-seting__bg .button .knobs:before {
    content: ""
}

.hbg-seting__box .hbg-seting__bg .button .layer--checked {
    background: #0094ff
}

.hbg-seting__box--light .line {
    background: #e6eaee
}

.hbg-seting__box--light .hbg-seting__bg .switch-text {
    border-bottom: 1px dashed #8a8a8e
}

.global-common-header-icon .icon,
.global-common-header-icon__msg {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 24px 24px
}

.global-common-header-icon__msg {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-msg.9e5cf196.svg)
}

.global-common-header-icon__download {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-download.316ff87b.svg)
}

.global-common-header-icon__download,
.global-common-header-icon__lang {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 24px 24px
}

.global-common-header-icon__lang {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-lang.8bcd1c09.svg)
}

.global-common-header-icon__search {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nav_search.9e857894.svg)
}

.global-common-header-icon__hamburg,
.global-common-header-icon__search {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 24px 24px
}

.global-common-header-icon__hamburg {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-hamburg.23cddbf8.svg)
}

.global-common-header-icon__seting {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 24px 24px;
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-seting.973280ca.svg)
}

.global-common-header--light .global-common-header-icon__msg {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-msg--light.a081e5dc.svg)
}

.global-common-header--light .global-common-header-icon__download {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-download--light.cb27ed6c.svg)
}

.global-common-header--light .global-common-header-icon__lang {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-lang--light.e1f623c6.svg)
}

.global-common-header--light .global-common-header-icon__search {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nav_search_light.c2d00d83.svg)
}

.global-common-header--light .global-common-header-icon__hamburg {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-hamburg--light.0775a305.svg)
}

.global-common-header--light .global-common-header-icon__seting {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-seting--light.2baa99d3.svg)
}

.global-common-header--light .hb-dropdown--open .header__user__body__item .global-common-header-icon__msg {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-msg--light.a081e5dc.svg) !important
}

.global-common-header--light .hb-dropdown--open .header__user__body__item .global-common-header-icon__download {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-download--light.cb27ed6c.svg) !important
}

.global-common-header--light .hb-dropdown--open .header__user__body__item .global-common-header-icon__lang {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-lang--light.e1f623c6.svg) !important
}

.global-common-header--light .hb-dropdown--open .header__user__body__item .global-common-header-icon__search {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nav_search_light.c2d00d83.svg) !important
}

.global-common-header--light .hb-dropdown--open .header__user__body__item .global-common-header-icon__hamburg {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-hamburg--light.0775a305.svg) !important
}

.global-common-header--light .hb-dropdown--open .header__user__body__item .global-common-header-icon__seting {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-seting--light.2baa99d3.svg) !important
}

.global-common-header {
    height: var(--hbg-header-height);
    color: var(--hbg-header-main-txtcolor)
}

.global-common-header .header-wrap {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--hbg-header-height);
    padding: 0 24px;
    background-color: var(--hbg-header-main-bgcolor)
}

.global-common-header .header-wrap:after {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    border-top: 1px solid var(--hbg-header-split-color);
    content: "";
    pointer-events: none
}

.global-common-header .header-body {
    position: relative;
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex: 1 1 auto;
    justify-content: space-between;
    transition: all .3s ease 0s
}

.global-common-header .header-nav {
    position: relative;
    height: var(--hbg-header-item-height);
    display: flex;
    align-items: center
}

.global-common-header .header-nav .header-nav-brand {
    position: relative;
    height: 32px;
    margin-right: 24px;
    display: flex;
    align-items: flex-start;
    overflow: hidden;
    cursor: pointer
}

.global-common-header .header-nav .header-nav-brand img {
    width: 68px;
    height: 28px;
    cursor: pointer
}

.global-common-header .header-nav .header-nav-brand i {
    position: absolute;
    top: 0;
    left: 0;
    width: 68px;
    height: 26px;
    display: none;
    -webkit-mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/logo.5d4cd338.svg);
    mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/logo.5d4cd338.svg);
    -webkit-mask-mode: match-source;
    mask-mode: match-source;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 68px 26px;
    mask-size: 68px 26px;
    -webkit-mask-position: center center;
    mask-position: center center
}

.global-common-header .header-nav .header-nav-brand i:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 26px;
    background: hsla(0, 0%, 100%, .3);
    animation-name: logo;
    animation-duration: .8s;
    animation-timing-function: cubic-bezier(.16, 0, .18, 1);
    animation-fill-mode: both;
    content: ""
}

.global-common-header .header-nav .header-nav-brand:hover i {
    display: block
}

.global-common-header .header-nav .header-nav-logocn i {
    -webkit-mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/logocn.67b64001.svg);
    mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/logocn.67b64001.svg)
}

.global-common-header .header-nav .header-nav-logohk i {
    -webkit-mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/logohk.8e9f1734.svg);
    mask-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/logohk.8e9f1734.svg)
}

.global-common-header .header-nav .header-nav-menu {
    height: 100%
}

.global-common-header .header-user,
.global-common-header .header-user__not-logined {
    display: flex;
    align-items: center
}

.global-common-header .header-user__not-logined-item {
    margin-right: 4px;
    display: flex;
    align-items: center
}

.global-common-header .header-user__navmenu {
    position: relative;
    display: flex;
    align-items: center
}

.global-common-header .header-nav__right {
    height: 64px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 11;
    background-color: var(--hbg-header-main-bgcolor);
    display: flex;
    gap: 4px;
    align-items: center
}

.global-common-header .header__user {
    display: flex;
    align-items: center;
    color: var(--hbg-header-main-txtcolor)
}

.global-common-header .header__user__hamburg {
    height: 100%;
    padding: 0 0 0 12px;
    display: none
}

.global-common-header .header__user__hamburg .global-common-header-icon__hamburg {
    cursor: pointer
}

.global-common-header .header__user__avatar__item {
    height: var(--hbg-header-item-height)
}

.global-common-header .header__user__avatar__item .hb-dropdown__content {
    top: 100%
}

.global-common-header .header__user__body {
    display: flex;
    flex-direction: row;
    align-items: center;
    -webkit-box-align: center
}

.global-common-header .header__user__body__my {
    width: auto;
    margin-right: 0;
    display: flex;
    flex-direction: row;
    align-items: center
}

.global-common-header .header__user__body__my>.header__user__avatar {
    display: none
}

.global-common-header .header__user__body__extra {
    width: auto;
    margin-right: 0;
    position: relative;
    display: flex;
    flex-direction: row
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry i {
    display: inline-block;
    cursor: pointer
}

.global-common-header .header__user__body__extra .primeicon-default i {
    width: 24px;
    height: 24px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon10.a2a1220e.svg) no-repeat 50%/24px auto
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="0"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/0.f2fe26a5.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="1"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/1.3085b3a3.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="2"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/2.96a050ef.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="3"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/3.54b80ab0.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="4"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/4.f4610ca5.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="5"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/5.cab68d7d.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="6"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/6.5315ebeb.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="7"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/7.00084c8d.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="8"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/8.0e3db065.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="9"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/9.ac0d2b47.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="10"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/10.939c26b7.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .header__user__body__item--prime-entry[data-level="11"] i {
    height: 20px;
    width: 39px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/11.eabf3f56.svg) no-repeat 50%/contain
}

.global-common-header .header__user__body__extra .hbg_search_item:hover {
    background: var(--hbg-header-dropdown-bgcolor)
}

.global-common-header .header__user__body__item {
    width: auto;
    height: var(--hbg-header-item-height);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    white-space: nowrap;
    text-decoration: none !important;
    background-clip: border-box !important;
    cursor: pointer;
    -webkit-box-align: center;
    -webkit-box-pack: center
}

.global-common-header .header__user__body__item .header__user__avatar {
    padding: 0 12px
}

.global-common-header .header__user__body__item .toggle {
    height: 100%
}

.global-common-header .header__user__body__item.hb-menu-dropdown {
    position: relative
}

.global-common-header .header__user__avatar {
    height: 100%;
    padding: 0 12px;
    display: flex;
    align-items: center;
    cursor: pointer
}

.global-common-header .header__user__avatar img {
    display: block
}

.global-common-header .header__user .hbg-user_key {
    position: relative
}

.global-common-header .header__user .hbg-user_key:before {
    position: absolute;
    top: 20px;
    right: 6px;
    width: 6px;
    height: 6px;
    background: #e94359;
    border-radius: 50%;
    content: ""
}

.global-common-header .header__menu {
    height: 100%;
    display: flex;
    align-items: center
}

.global-common-header .header__menu .header__menu__item {
    height: 100%;
    margin-right: 24px;
    color: var(--hbg-header-main-txtcolor);
    font-size: 14px
}

.global-common-header .header__menu .header__menu__item .toggle {
    height: 100%
}

.global-common-header .header__menu .header__menu__item:last-child {
    margin-right: 0
}

@media (max-width:743px) {
    .global-common-header .hbg-nav-menu-v2 {
        display: none
    }
}

.global-common-header .hbg-currencys .hb-menu-dropdown__body__item,
.global-common-header .hbg-languages .hb-menu-dropdown__body__item {
    height: 52px
}

@media screen and (max-width:744px) {

    .global-common-header .hbg-currencys .hb-menu-dropdown__body__item:hover:not(.active),
    .global-common-header .hbg-languages .hb-menu-dropdown__body__item:hover:not(.active) {
        font-weight: 500
    }
}

.global-common-header .header-user__item-btn {
    position: relative;
    padding: 8px 16px;
    display: inline-block;
    color: var(--hbg-header-button-color);
    font-size: 14px;
    line-height: 16px;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    cursor: pointer
}

.global-common-header .header-user__item-btn span {
    position: relative;
    z-index: 2
}

.global-common-header .header-user__item-btn:hover:after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    content: "";
    pointer-events: none
}

.global-common-header .header-user__item-btn:hover {
    color: var(--hbg-header-main-txtcolor);
    border-radius: 4px
}

.global-common-header .header-user__item-btn:hover:after {
    display: block;
    background-color: var(--hbg-header-button-hovercolor)
}

.global-common-header .header-user__item-btn--primary:hover {
    color: var(--hbg-header-main-txtcolor)
}

.global-common-header .header-user__item-btn--primary:hover:after {
    display: block;
    background-color: hsla(0, 0%, 100%, .1)
}

.global-common-header .header-user__item-btn--primary {
    padding: 8px 16px;
    display: inline-block;
    color: #fff;
    white-space: nowrap;
    background-color: #0173e5;
    border-radius: 4px;
    cursor: pointer
}

.global-common-header .hb-dropdown--open .header__user__avatar {
    position: relative;
    background: var(--hbg-header-dropdown-bgcolor)
}

.global-common-header .hb-dropdown--open .header__user__avatar:after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 2px;
    display: none;
    background: #0094ff;
    animation-name: widthIn;
    animation-duration: .3s;
    animation-fill-mode: both;
    content: ""
}

.global-common-header .hb-dropdown--open .header__user__body__item .global-common-header-icon__msg {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-msg-active.e41569cf.svg)
}

.global-common-header .hb-dropdown--open .header__user__body__item .global-common-header-icon__download {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-download-active.692811fc.svg)
}

.global-common-header .hb-dropdown--open .header__user__body__item .global-common-header-icon__lang {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-lang-active.64391381.svg)
}

.global-common-header .hb-dropdown--open .header__user__body__item .global-common-header-icon__search {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nav_search_active.44fa2f6c.svg)
}

.global-common-header .hb-dropdown--open .hbg-user-avatar__border {
    border-color: var(--hbg-header-primary-color)
}

.global-common-header .header__user__body__my .header__user__body__item:hover {
    color: var(--hbg-header-primary-color)
}

.global-common-header .header-body--mobile .header-nav .header-nav-brand {
    height: 20px
}

.global-common-header .header-body--mobile .header-nav .header-nav-brand img {
    width: 68px;
    height: 20px
}

.global-common-header .header-body--mobile .header-nav .header-nav-brand i {
    width: 68px;
    height: 20px;
    display: none;
    -webkit-mask-size: 68px 20px;
    mask-size: 68px 20px
}

.global-common-header .header-body--mobile .hbg-nav-menu-v2 {
    position: absolute;
    clip: rect(0, 0, 0, 0)
}

.global-common-header .header-body--mobile .header__user__body__my>.header__user__avatar {
    padding: 0 12px;
    display: flex
}

.global-common-header .header-body--mobile .header__user__body__my>.header__user__avatar--open .hbg-user-avatar__border {
    border-color: var(--hbg-header-primary-color)
}

.global-common-header .header-body--mobile .header__user__body__my .hbg-user_key:before {
    position: absolute;
    top: 0
}

.global-common-header .header-body--mobile .hbg_small_search_dropdown {
    height: 100%;
    padding: 4px 12px;
    display: flex;
    align-items: center;
    cursor: pointer
}

.global-common-header .header-body--mobile .hbg_small_search_dropdown:hover {
    background: var(--hbg-header-dropdown-bgcolor)
}

.global-common-header .header-body--mobile .hbg_small_search_dropdown .icon__search--active {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nav_search_active.44fa2f6c.svg)
}

.global-common-header .header-body--mobile .header-user__not-logined .small_logined,
.global-common-header .header-body--mobile .header__user__body__item {
    display: none
}

.global-common-header .header-body--mobile .hbg_search_item {
    display: flex
}

.global-common-header .header-body--mobile .header__user__hamburg {
    display: flex;
    align-items: center
}

@media screen and (max-width:1024px) {
    .global-common-header .header-nav .header-nav-brand {
        height: 20px
    }

    .global-common-header .header-nav .header-nav-brand img {
        width: 68px;
        height: 20px
    }

    .global-common-header .header-nav .header-nav-brand i {
        width: 68px;
        height: 20px;
        display: none;
        -webkit-mask-size: 68px 20px;
        mask-size: 68px 20px
    }

    .global-common-header .hbg-nav-menu-v2 {
        position: absolute;
        clip: rect(0, 0, 0, 0)
    }

    .global-common-header .header__user__body__my>.header__user__avatar {
        padding: 0 12px;
        display: flex
    }

    .global-common-header .header__user__body__my>.header__user__avatar--open .hbg-user-avatar__border {
        border-color: var(--hbg-header-primary-color)
    }

    .global-common-header .header__user__body__my .hbg-user_key:before {
        position: absolute;
        top: 0
    }

    .global-common-header .hbg_small_search_dropdown {
        height: 100%;
        padding: 4px 12px;
        display: flex;
        align-items: center;
        cursor: pointer
    }

    .global-common-header .hbg_small_search_dropdown:hover {
        background: var(--hbg-header-dropdown-bgcolor)
    }

    .global-common-header .hbg_small_search_dropdown .icon__search--active {
        background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/nav_search_active.44fa2f6c.svg)
    }

    .global-common-header .header-user__not-logined .small_logined,
    .global-common-header .header__user__body__item {
        display: none
    }

    .global-common-header .hbg_search_item {
        display: flex
    }

    .global-common-header .header__user__hamburg {
        display: flex;
        align-items: center
    }

    .global-common-header .header-user__not-logined .small_logined {
        display: flex
    }

    .global-common-header .header__user__body__extra .header__user__body__item--prime-entry {
        display: none
    }

    .global-common-header .hbg-nav-menu-v2 {
        position: relative;
        clip: auto
    }
}

.global-common-header--stacking,
.global-common-header--stacking .header-wrap {
    height: 128px
}

.global-common-header--stacking .hbg-nav-menu-v2 {
    position: absolute;
    top: 64px;
    left: 0
}

.global-common-header--mobile,
.global-common-header--mobile .header-wrap {
    height: 44px
}

@media screen and (max-width:770px) {
    .global-common-header .header-nav__right {
        height: 44px
    }
}

@media screen and (max-width:743px) {
    .global-common-header .header-nav .header-nav-brand {
        height: 20px
    }

    .global-common-header .header-nav .header-nav-brand img {
        width: 68px;
        height: 20px
    }
}

.global-common-header .header__user__body__extra .header__user__body__item {
    padding: 0 12px
}

.global-common-header .header__user__body__extra .hb-dropdown--open .header__user__body__item {
    position: relative;
    background: var(--hbg-header-dropdown-bgcolor)
}

.global-common-header .header__user__body__extra .hb-dropdown--open .header__user__body__item:after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 2px;
    display: none;
    background: #0094ff;
    animation-name: widthIn;
    animation-duration: .3s;
    animation-fill-mode: both;
    content: ""
}

.global-common-header .header__user__body__extra .hb-dropdown--hide .header__user__body__item {
    color: var(--hbg-header-main-txtcolor);
    background: var(--hbg-header-main-bgcolor)
}

.hbg-header-dropdown-btn:hover {
    background-color: var(--hbg-header-dropdown-bgcolor)
}

.fed-hbg-footer {
    overflow: hidden;
    color: #e6e6e6;
    font-size: 12px;
    background-color: #1e1e1f
}

.fed-hbg-footer .footer-nav-brand {
    display: inline-block;
    cursor: pointer
}

.fed-hbg-footer a {
    cursor: pointer
}

.fed-hbg-footer * {
    background-color: transparent
}

.fed-hbg-footer .fed-collapes-item:after {
    border-bottom-color: rgba(233, 234, 237, .1)
}

.fed-hbg-footer .fed-collapes-item__content .hbg-cell-group {
    background-color: transparent
}

.fed-hbg-footer .fed-collapes-item__content:after {
    border-bottom-color: rgba(233, 234, 237, .1)
}

.fed-hbg-footer a.hbg-cell {
    color: #e6e6e6
}

.fed-hbg-footer a.hbg-cell .hbg-cell__title {
    color: #e6e6e6;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px
}

.fed-hbg-footer a.hbg-cell:hover {
    color: #0173e5;
    background-color: none
}

.fed-hbg-footer a.hbg-cell:hover .hbg-cell__title {
    color: #0173e5
}

.fed-hbg-footer .fed-collapes-item__title {
    color: #e6e6e6;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px
}

.fed-hbg-footer .fed-collapes-item__title[aria-expanded=true] {
    color: #0173e5
}

.fed-hbg-footer__dropdown {
    display: block;
    margin-top: 18px
}

.fed-hbg-footer__dropdown .toggle {
    height: 28px;
    padding: 0 8px;
    display: flex;
    border: 1px solid #4c4c4e
}

.fed-hbg-footer__dropdown .toggle.active {
    color: #f0f1f4
}

.fed-hbg-footer__dropdown .toggle .toggle__title {
    display: inline-block;
    flex: 1;
    overflow: hidden;
    color: #e6e6e6;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    white-space: nowrap;
    text-overflow: ellipsis
}

.fed-hbg-footer__social .channel {
    position: relative;
    width: 24px;
    height: 24px;
    display: inline-block;
    cursor: pointer
}

.fed-hbg-footer__social .channel:hover {
    background: #0173e5;
    border-radius: 12px
}

.fed-hbg-footer__social .channel:hover .qcode {
    transform: translateY(-32px);
    visibility: visible;
    opacity: 1
}

.fed-hbg-footer__social .channel .qcode {
    position: absolute;
    bottom: 0;
    left: -75px;
    z-index: 10;
    width: 180px;
    padding: 16px 0;
    color: #000;
    font-weight: 700;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .06), 0 0 6px 0 rgba(0, 0, 0, .04);
    transform: translateY(-22px);
    visibility: hidden;
    cursor: auto;
    opacity: 0;
    transition: all .1s
}

.fed-hbg-footer__social .channel .qcodeimg {
    width: 122px;
    height: 122px;
    margin: 8px auto 16px;
    border: 1px solid #ddd
}

.fed-hbg-footer__social .channel .qcodeimg img {
    width: 110px;
    height: 110px;
    margin-top: 6px
}

.fed-hbg-footer__social .channel .customer {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8a8a8e;
    font-weight: 400
}

.fed-hbg-footer__social .channel .customer .copy {
    width: 14px;
    height: 14px;
    margin: 0 0 0 5px;
    padding: 0
}

.fed-hbg-footer__social .channel .customer .copy .copy-icon {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-ftcopy.71e68f21.svg) no-repeat 50%;
    background-size: 14px 14px;
    cursor: pointer
}

.fed-hbg-footer__social .channel .customer .copy .copy-icon--success,
.fed-hbg-footer__social .channel .customer .copy .copy-icon:hover {
    background-image: url(https://hbg-fed-static-prd.hbfile.net/unionjs/img/icon-ftcopy1.5da4f2c7.svg)
}

.fed-hbg-footer__social .svg-icon,
.fed-hbg-footer__social-icon {
    width: 24px;
    height: 24px;
    vertical-align: top
}

.fed-hbg-footer__social .svg-icon {
    fill: #fff;
    stroke: #fff
}

.fed-hbg-footer__copyright {
    font-size: 12px;
    line-height: 14px
}

.fed-hbg-footer__logo {
    width: 47px;
    height: 18px;
    vertical-align: top
}

.fed-hbg-footer__main {
    display: flex;
    flex-direction: column
}

.fed-hbg-footer__main .fed-hbg-footer-links {
    order: 2
}

.fed-hbg-footer__main .fed-hbg-footer__sider {
    order: 1
}

.fed-hbg-footer .hb-dropdown__content {
    overflow: hidden;
    box-shadow: 0 10px 10px rgba(0, 0, 0, .06)
}

.fed-hbg-footer .hb-menu-dropdown__body {
    color: #f0f1f4;
    background: #313132
}

.fed-hbg-footer .hb-menu-dropdown__body .hb-menu-dropdown__body__item {
    height: auto;
    padding: 12px 20px;
    color: #e6e6e6
}

.fed-hbg-footer__group {
    font-size: 12px;
    line-height: 14px
}

.fed-hbg-footer__group a {
    color: #f0f1f4;
    text-decoration: none
}

.fed-hbg-footer__group a:hover {
    color: #0173e5
}

.fed-hbg-footer .fed-collapes-item__content-wrapper:after {
    display: none
}

.fed-hbg-footer__bar-wrapper {
    box-shadow: 0 -1px 0 rgba(233, 234, 237, .1)
}

.fed-hbg-footer__language {
    display: none
}

.fed-hbg-footer__language .fed-hbg-footer__lang-btn {
    display: flex;
    align-items: center
}

.fed-hbg-footer .hb-menu-dropdown__body__item--single {
    max-height: 200px;
    max-height: 320px;
    overflow: auto
}

.fed-hbg-footer .hb-menu-dropdown__body__item--single::-webkit-scrollbar {
    width: 5px;
    background: transparent;
    border-radius: 0
}

.fed-hbg-footer .hb-menu-dropdown__body__item--single::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: rgba(204, 210, 218, .3);
    border-radius: 0
}

@media screen and (max-width:1023px) {
    .fed-hbg-footer__dropdown {
        display: none
    }

    .fed-hbg-footer__sider {
        padding: 16px 17px;
        align-items: center;
        justify-content: space-between
    }

    .fed-hbg-footer__group,
    .fed-hbg-footer__sider {
        display: flex;
        flex-direction: row
    }

    .fed-hbg-footer__group a {
        margin-left: 16px
    }

    .fed-hbg-footer__bar .fed-hbg-footer__social {
        padding: 16px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }

    .fed-hbg-footer__bar .fed-hbg-footer__social .channel {
        width: 24px;
        height: 24px;
        border-radius: 14px
    }

    .fed-hbg-footer__bar .fed-hbg-footer__social .svg-icon,
    .fed-hbg-footer__bar .fed-hbg-footer__social-icon {
        width: 24px;
        height: 24px
    }

    .fed-hbg-footer__bar .fed-hbg-footer__copyright {
        color: #8a8a8e;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 14px
    }

    .fed-hbg-footer__language {
        height: 40px;
        padding: 0 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        box-shadow: inset 0 -.5px 0 rgba(233, 234, 237, .1), inset 0 .5px 0 rgba(233, 234, 237, .1)
    }

    .fed-hbg-footer__language .fed-hbg-footer__lang-copyright {
        color: hsla(0, 0%, 90%, .6);
        font-size: 10px
    }

    .fed-hbg-footer .fed-collapes-item__title {
        height: 40px
    }

    .fed-hbg-footer .hbg-cell__title {
        font-size: 12px
    }

    .fed-hbg-footer .hbg-cell {
        height: 36px
    }
}

@media screen and (min-width:745px) and (max-width:1024px) {
    .fed-hbg-footer .fed-hbg-footer__lang-copyright {
        display: none
    }

    .fed-hbg-footer__bar {
        padding: 18px 32px;
        display: flex;
        justify-content: space-between
    }

    .fed-hbg-footer__bar .fed-hbg-footer__social {
        padding: 0;
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        justify-content: center
    }

    .fed-hbg-footer__language {
        display: flex;
        justify-content: flex-end
    }
}

@media screen and (max-width:744px) {
    .fed-hbg-footer__bar .fed-hbg-footer__social {
        display: flex;
        justify-content: space-between
    }

    .fed-hbg-footer__bar .fed-hbg-footer__social .channel {
        margin: 0
    }

    .fed-hbg-footer .fed-hbg-footer__copyright {
        display: none
    }
}

@media screen and (min-width:1024px) {
    .fed-hbg-footer__logo {
        width: 62px;
        height: 24px;
        vertical-align: top
    }

    .fed-hbg-footer__sider {
        width: 123px
    }

    .fed-hbg-footer__group {
        margin-top: 12px;
        display: flex;
        flex-direction: column
    }

    .fed-hbg-footer__group a {
        margin-bottom: 12px;
        color: #f0f1f4;
        text-decoration: none
    }

    .fed-hbg-footer__main {
        max-width: 1260px;
        margin: 0 auto;
        padding: 40px 30px;
        display: flex;
        flex-direction: row
    }

    .fed-hbg-footer__main .fed-collapes {
        display: flex
    }

    .fed-hbg-footer__main .fed-collapes .fed-collapes-item {
        margin-right: 20px;
        flex: 1
    }

    .fed-hbg-footer__main .fed-collapes-item:after {
        display: none
    }

    .fed-hbg-footer__main .fed-collapes-item__title {
        padding: 0;
        cursor: default
    }

    .fed-hbg-footer__main .fed-collapes-item__content:after,
    .fed-hbg-footer__main .fed-collapes-item__title .fed-icon__arrow {
        display: none
    }

    .fed-hbg-footer__main .fed-collapes-item__content-wrapper {
        display: block !important;
        height: auto !important
    }

    .fed-hbg-footer__main .hbg-cell {
        height: auto;
        margin-bottom: 12px;
        padding: 0
    }

    .fed-hbg-footer__main .fed-hbg-footer-links {
        flex: 1;
        order: 1
    }

    .fed-hbg-footer__main .fed-hbg-footer__sider {
        order: 2
    }

    .fed-hbg-footer__bar {
        max-width: 1260px;
        margin: 0 auto;
        padding: 18px 30px;
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .fed-hbg-footer__social {
        display: flex;
        gap: 12px
    }
}