@import "font.css";
@import url(https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100..900&display=swap');

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

:root {
  --bs-body-color: #FAFAFA;
  --bs-secondary-color: #5F666B;
  --bs-primary-rgb: 101, 0, 231;
}

html,
body {
  font-family: "Barlow Semi Condensed", sans-serif;
  background-color: #09090B;
  font-size: 1vw;
}

::-webkit-scrollbar {
  width: .375rem;
}

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px transparent;
}

::-webkit-scrollbar-thumb {
  background: #2E353C;
  border-radius: .25rem;
}

::-webkit-scrollbar-thumb:hover {
  background: #5A5D63;
}

small,
.small {
  font-size: .625rem !important;
  letter-spacing: .1rem;
  line-height: 1;
  font-weight: 400;
}

i {
  line-height: 1;
}

.bg-video {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
  opacity: 0.25;
}

.bg-video__content {
  height: 100vh;
  width: 100vw;
  object-fit: cover;

}

.main-intro-wrap {
  position: relative;
  z-index: 15;
  margin-top: 4%;
}

.container-fluid {
  --bs-gutter-x: 2.5rem;
}

.navbar {
  --bs-navbar-padding-y: 0;
  margin-bottom: 1.5rem
}

.navbar-sub {
  --bs-navbar-padding-y: .71875rem !important;
  border-bottom: .0625rem solid rgba(180, 194, 202, 0.15);
}

.navbar-sub h1 {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 0;
  text-transform: uppercase;
  background: linear-gradient(90deg, rgba(78, 137, 231, 1) 0%, rgba(200, 69, 212, 1) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.navbar-sub .navbar-brand {
  width: 3.5rem;
  height: 3.5rem;
  background: url(../images/favicon.svg?1552) no-repeat 0 0;
  background-size: contain;
}

.navbar-sub .navbar-brand::after {
  content: "Back to Trade";
  display: block;
  color: rgba(200, 69, 212, 0.7);
  margin-left: 4.2rem;
}


.navbar-brand {
  width: 11rem;
  height: 3.5rem;
  background: url(../images/img_logo.svg?1552) no-repeat 0 0;
  background-size: contain;
}

.title-main {
  font-size: 7.5rem;
  line-height: 1;
  font-weight: 800;
  word-spacing: -0.5rem;
  color: rgba(255, 255, 255, .8);
  text-align: center;
}

.title-sub {
  font-size: 2rem;
  line-height: 1;
  font-weight: 300;
  word-spacing: -0.25rem;
  text-align: center;
  background: linear-gradient(90deg, rgba(78, 137, 231, 1) 0%, rgba(200, 69, 212, 1) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.message-info {
  font-size: 1.25rem;
  line-height: 1.5rem;
  font-weight: 300;
  text-align: center;
  color: rgba(255, 255, 255, .7);
}

footer {
  border-top: .0625rem solid rgba(255, 255, 255, .25);
  padding: 2rem;
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1030;
}

.about-polycat {
  color: rgba(255, 255, 255, .5);
  white-space: nowrap;
}

.about-polycat p:first-child {
  font-size: 1.125rem;
  font-weight: 500;
}

.about-polycat img {
  height: 2.5rem;
}

.about-polycat p:last-child {
  font-size: .875rem;
  font-weight: 300;
}

.btn-close {
  width: 1rem;
  height: 1rem;
  background: var(--bs-btn-close-bg) center/1rem auto no-repeat;
}

.btn-main {
  color: #fafafa;
  font-size: 2.625rem;
  font-weight: 700;
  line-height: 1;
  background-image: linear-gradient(90deg, rgba(78, 137, 231, 1) 0%, rgba(200, 69, 212, 1) 100%);
  box-shadow: 0 .25rem 3rem .25rem rgba(0, 0, 0, 0.15);
  border-radius: 1rem;
  padding: 1rem 2.5rem;
  width: 28rem;
  margin-left: auto;
  margin-right: auto;
  border: none;
}

.btn-main:hover,
.btn-main:focus {
  color: #fff !important;
  background: linear-gradient(90deg, rgba(174, 39, 191, 1) 0%, rgba(46, 99, 218, 1) 100%);
}

.btn-main .sub-explain {
  font-size: 1.3125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, .7);
}

.en {
  font-family: "Barlow Semi Condensed", sans-serif;
}

.kr {
  font-family: "Pretendard", sans-serif;
}

.cn {
  font-family: "Noto Sans SC", serif;
}

p {
  margin-bottom: 0;
}

.custom-tooltip {
  --bs-tooltip-bg: #1A1B22;
  backdrop-filter: blur(1rem);
  color: #EAECEF;

}

.tooltip-inner {
  text-align: left;
  white-space: pre-wrap;
  max-width: 23rem;
  padding: 1rem;
}

.nav-center {
  border: .0625rem solid #9263DC;
  font-weight: 700;
  line-height: 1;
  height: 5rem;
  color: #C845D4;
  text-transform: uppercase;
  width: 16.25rem;
  padding: 1rem .5rem;
  border-radius: 0 0 2.5rem 2.5rem;
}

.balance-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.balance-wrap .btn-icon {
  width: 2.5rem;
  height: 2.5rem;
}

.balance-info {
  display: flex;
  flex-direction: column;
  text-align: center;
  width: calc(100% - 8rem);
  font-size: 2rem;
  line-height: 1;
}

a {
  color: #725499;
}

a:hover,
a:focus,
a:active {
  color: #B786F7;
}

.btn-nav-left,
.btn-nav-center,
.btn-nav-right {
  display: block;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  border: none;
  transition: 0.3s ease-in-out;
  transition-property: background, color;
  border-radius: 0 0 2.5rem 2.5rem;
}

.btn-gradient {
  position: relative;
  display: block;
  border-radius: 1.625rem;
  box-sizing: border-box;
  background-clip: padding-box;
  overflow: hidden;
  z-index: 1;

  &::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border: .125rem solid transparent;
    background-image: linear-gradient(#09090B, #0e0e30), linear-gradient(90deg, rgba(78, 137, 231, 1) 0%, rgba(200, 69, 212, 1) 100%);
    border-radius: 0 0 1.5rem 1.5rem;
    background-clip: padding-box, border-box;
    background-repeat: repeat-x;
    background-size: calc(100% + .125rem * 2) calc(100% + .125rem * 2);
    background-position: center;
    z-index: -1;
    transition: border-color 0.2s;
  }

  &::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 70vmax;
    height: 70vmax;
    background-image: linear-gradient(90deg, rgba(78, 137, 231, 1) 0%, rgba(200, 69, 212, 1) 100%);
    transform-origin: center;
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.4s ease-in-out;
    z-index: -1;
  }

  &:hover {
    color: #09090B;

    &::after {
      transform: translate(-50%, -50%) scale(1);
    }
  }
}

.btn-nav-left,
.btn-nav-right {
  min-width: 12rem;
  padding: 1rem;
  font-size: 1.3125rem;
  border-radius: 0 0 1.5rem 1.5rem;
  color: #4E89E7;
}

.btn-nav-center {
  width: 16.25rem;
  height: 5rem;
  font-size: 1.3125rem;
  line-height: 1.5rem;
  border-radius: 0 0 1.5rem 1.5rem;
  color: #C845D4;
}

.gradient-text {
  background-image: linear-gradient(90deg, rgba(78, 137, 231, 1) 0%, rgba(200, 69, 212, 1) 100%);
  -webkit-background-clip: text;
  color: transparent;
}

.btn-info {
  --bs-btn-color: #fff;
  --bs-btn-bg: #C845D4;
  --bs-btn-border-color: #C845D4;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #4E89E7;
  --bs-btn-hover-border-color: #4E89E7;
  --bs-btn-focus-shadow-rgb: 78, 137, 231;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #4E89E7;
  --bs-btn-active-border-color: #4E89E7;
}

.btn-secondary {
  --bs-btn-color: rgba(0, 0, 0, 0.65);
  --bs-btn-bg: #E1B76A;
  --bs-btn-border-color: #E1B76A;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #F9D28A;
  --bs-btn-hover-border-color: #F9D28A;
  --bs-btn-focus-shadow-rgb: 225, 183, 106;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #F9D28A;
  --bs-btn-active-border-color: #F9D28A;
  --bs-btn-disabled-color: rgba(0, 0, 0, 0.15);
  --bs-btn-disabled-bg: #E1B76A;
  --bs-btn-disabled-border-color: #E1B76A;
}

.btn-icon {
  position: relative;
  width: 3.5rem;
  height: 3.5rem;
  padding: 0;
  font-size: 1.5rem;
  line-height: 1;
  border-radius: 1.875rem;
  border: .0625rem solid #3B2B50;
  transition: transform 0.2s ease-in-out;
}

.btn-icon:hover,
.btn-icon:focus,
.btn-icon:active {
  background: #221A2E !important;
  color: #B786F7 !important;
  border: .0625rem solid #B786F7;
  box-shadow: 0 0 .5rem 0 rgba(183, 134, 247, 0.85);
}

.btn-icon:active {
  transform: scale(0.95);
}

.has-news {
  position: absolute;
  top: .5rem;
  right: .5rem;
  width: .75rem;
  height: .75rem;
  background-color: #E52525;
  border-radius: 50%;
}

@keyframes growShrink {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}

@keyframes growShrinkPause {
  0%,
  10%,
  30%,
  50%,
  60%,
  70%,
  80%,
  90%,
  100% {
    transform: scale(1);
  }

  20%,
  40% {
    transform: scale(1.1);
  }
}

.grow-shrink {
  animation: growShrink 1s infinite;
}

.bull-pool-up-wrap,
.bear-pool-down-wrap {
  display: flex;
  flex-direction: column;
  width: 18.5rem;
  background-color: #1A1B22;
  border-radius: 1.125rem;
  position: relative;
  overflow: hidden;
}

.bull-pool-up-wrap {
  border: .125rem solid #1DDB88;
}

.bear-pool-down-wrap {
  border: .125rem solid #E52525;
}

@keyframes blink {
  0% {
    border: .2rem solid rgba(255, 219, 59, 1);
  }
  50% {
    border: .2rem solid rgba(255, 219, 59, .5);
  }
  100% {
    border: .2rem solid rgba(255, 219, 59, 1);
  }
}
.blink-border {
  animation: blink 1s infinite;
}
.confetti {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height:100%;
  z-index: 1400;
}
.confetti iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.confetti h1 {
  margin-top: 18rem;
  font-size: 1.5rem;
  line-height: 1.3;
  font-weight: 700;
  color: #FFDB3B;
  text-align: center;
  text-shadow: #000 .0625rem 0.0625rem 1rem;
  z-index: 1500;
}

.bull-pool-up-wrap .bg-bull-pool {
  background: url(../images/bg-bull-pool.svg?1552) no-repeat;
  background-size: cover;
  background-position: center;
  color: #2D3443;
  height: 8.125rem;
}

.bear-pool-down-wrap .bg-bear-pool {
  background: url(../images/bg-bear-pool.svg?1552) no-repeat;
  background-size: cover;
  background-position: center;
  color: #2D3443;
  height: 8.125rem;
}

.bull-pool-up-wrap h1,
.bear-pool-down-wrap h1 {
  font-size: 2.75rem;
  line-height: 1;
  margin-bottom: 0.25rem;
  font-weight: 700;
}

.bull-pool-up-wrap h3,
.bear-pool-down-wrap h3 {
  font-size: 2rem;
  line-height: 1;
  font-weight: 700;
  margin-bottom: 0.25rem;
}

.bull-pool-up-wrap small,
.bear-pool-down-wrap small {
  font-weight: 500;
}

.gap-3 {
  gap: 1.25rem !important;
}

.btn-bull-up,
.btn-bear-down {
  color: #FAFAFA;
  line-height: 1;
  padding: 0 !important;
  border-radius: .875rem;
  margin: .5rem .25rem;
  border: none;
  transition: all 0.1s;
}

.btn-bull-up h1,
.btn-bull-up h6,
.btn-bear-down h1,
.btn-bear-down h6 {
  margin-bottom: 0;
  color: #2D3443;
}

.btn-bull-up i,
.btn-bear-down i {
  font-size: 4rem;
}

.btn-bull-up {
  background-color: #1DDB88;
  box-shadow: 0 .3125rem 0 0 rgba(26, 197, 122, .5);
  -webkit-box-shadow: 0 .3125rem 0 0 rgba(26, 197, 122, .5);
  -moz-box-shadow: 0 .3125rem 0 0 rgba(26, 197, 122, .5);
}

.btn-bear-down {
  background-color: #E81622;
  box-shadow: 0 .3125rem 0 0 rgba(168, 34, 36, .5);
  -webkit-box-shadow: 0 .3125rem 0 0 rgba(168, 34, 36, .5);
  -moz-box-shadow: 0 .3125rem 0 0 rgba(168, 34, 36, .5);
}

.btn-bull-up:hover,
.btn-bull-up:focus {
  background-color: #1AC57A !important;
  color: #FFF !important;
}

.btn-bull-up:disabled {
  background-color: rgba(26, 197, 122, .35);
  color: rgba(250, 250, 250, .35);
  box-shadow: 0 .3125rem 0 0 rgba(26, 197, 122, .25);
}

.btn-bear-down:hover,
.btn-bear-down:focus {
  background-color: #CE2121 !important;
  color: #FFF !important;
}

.btn-bear-down:disabled {
  background-color: rgba(168, 34, 36, .35);
  color: rgba(250, 250, 250, .35);
  box-shadow: 0 .3125rem 0 0 rgba(168, 34, 36, .25);
}

.btn-bull-up:active,
.btn-bear-down:active {
  transform: translateY(.3125rem);
  box-shadow: none !important;
}

.btn-bear-down {
  background-color: #E52525;
}

.text-bull-up {
  color: #1DDB88;
}

.text-bear-down {
  color: #E52525;
}

.text-draw {
  color: #FFDB3B;
}

.player-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  padding: .75rem .5rem;
  overflow-y: scroll;
  height: calc(100vh - 22.5rem);
  align-content: flex-start !important;
}

.avatar-wrap {
  position: relative;
  min-width: 4rem;
  text-align: center;
  perspective: 300;
  transform-style: preserve-3d;
}

.avatar-new {
  animation: spinner 1s linear infinite;
}

@keyframes spinner {
  0% {
    transform: rotate3d(0, 1, 0, 0deg);
  }

  100% {
    transform: rotate3d(0, 1, 0, 360deg);
  }
}

.avatar-wrap .img-avatar-bull {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #EAECEF;
  border: solid .1875rem #1DDB88;
  margin-bottom: .25rem;
}

.avatar-wrap .img-avatar-bear {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #EAECEF;
  border: solid .1875rem #E52525;
  margin-bottom: .25rem;
}

.avatar-wrap .img-avatar-gold {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #EAECEF;
  border: solid .1875rem #ff9f05;
  margin-bottom: .25rem;
}

.avatar-wrap h5 {
  line-height: 1;
}

.avatar-wrap h5 img {
  width: 1.25rem;
  height: 1.25rem;
  margin-left: .25rem;
}

.country-wrap {
  position: absolute;
  top: 0;
  right: 0;
  width: 1.5rem;
  height: 1.5rem;
}

.country-wrap img {
  width: 100%;
  height: auto;
}

.notice-wrap {
  width: 100%;
}

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

  100% {
    transform: translateX(-100%);
  }
}

.flowing-notice {
  white-space: nowrap;
  font-size: .875rem;
  line-height: 2rem;
  color: #B4C2CA;
  animation: flowText 52s linear infinite;
}

.flowing-notice span {
  margin-right: 2rem;
}

.stats {
  z-index: 1000;
}

.stats-up {
  text-align: left;
}

.stats-down {
  text-align: right;
}

.investment-wrap,
.potential-wrap {
  color: #EAECEF;
  padding: 0;
  margin: 0;
}

.investment-wrap small,
.potential-wrap small,
.payout small {
  font-size: .75rem;
  line-height: 1;
  font-weight: 400;
  color: #B4C2CA;
  display: block;
  white-space: nowrap;
}

.investment-wrap h3,
.potential-wrap h1 {
  font-weight: 700;
  line-height: 1;
}

.potential-wrap h1 {
  font-size: 2rem;
  margin-bottom: 0;
}

.potential-wrap h1 img,
.investment-wrap h3 img {
  vertical-align: baseline;
  width: 1.3125rem;
  height: 1.3125rem;
}

.payout {
  display: flex;
  flex-direction: column;
  text-align: center;
  margin-top: 2rem;
  margin-left: 2rem;
  margin-right: 2rem;
}

.payout-up,
.payout-down {
  display: flex;
  font-size: 2.625rem;
  line-height: 1;
  font-weight: 700;
  align-items: baseline;
}

.payout-up {
  color: #1DDB88;
}

.payout-down {
  color: #E52525;
  justify-content: end;
}

.payout-up span,
.payout-down span {
  font-size: 1.3125rem;
}

.waiting {
  width: 11.25rem;
  height: 11.25rem;
  border-radius: 5.625rem;
  background-color: #1A1B22;
  border: .3125rem solid #09090B;
  display: flex;
  text-align: center;
  justify-content: center !important;
}

.waiting h4 {
  text-align: center;
  color: #FFDB3B;
  margin-bottom: 0;
}

.graph-area {
  display: block;
  position: relative;
  width: 100%;
  height: calc(100vh - 20rem) !important;
  border-radius: 1.125rem;
  overflow: hidden;
  margin-top: -3.625rem;
}

.chart-source-rep {
  position: absolute;
  top: 1rem;
  left: 1rem;
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .875rem;
  color: #F3BA2F;
  font-weight: 300;
  z-index: 1000;
}

.chart-source-rep img {
  width: 5rem;
  height: 1rem;
}

.phrase-title-animation {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  top: 30%;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 1.125rem;
  color: #FAFAFA;
  opacity: .75;
  font-size: 4.5rem;
  line-height: 1.2;
  font-weight: 700;
  text-align: center;
  text-shadow: -.125rem 0 #09090B, 0 .125rem #09090B, .125rem 0 #09090B, 0 -.125rem #09090B;
  animation: growShrink 1s infinite;
}

.mui-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: .5rem;
  gap: 1.5rem !important;
}

.btn-mui-list-item {
  background: rgba(26, 27, 34, 0.7);
  border: .0625rem solid #FFDB3B;
  border-radius: 1.875rem;
  font-size: 1.3125rem;
  line-height: 1;
  font-weight: 700;
  color: #FFDB3B;
  width: 100%;
  padding: .625rem 0;
}

.btn-mui-list-item:hover,
.btn-mui-list-item:focus,
.btn-mui-list-item:active,
.btn-mui-list-item.active {
  background-color: #FFDB3B !important;
  color: #1A1B22 !important;
}

.history-wrap {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  width: calc(100% - 2rem);
}

.box-target-total-pay {
  width: calc(100% - 14rem);
}

.jackpot {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 11rem;
}

.top-wrap {
  background-color: #B72B07;
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
  height: 1.3125rem;
}

.bottom-wrap {
  border-left: .125rem solid #B72B07;
  border-right: .125rem solid #B72B07;
  border-bottom: .125rem solid #B72B07;
  color: #EDD762;
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: .5rem;
  display: flex;
  justify-content: center;
  align-items: baseline;
  padding: .5rem .375rem;
  background: repeating-linear-gradient(45deg,
      #002917,
      #002917 .5rem,
      #014024 .5rem,
      #014024 1rem)
}

.bottom-wrap span {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
}

.bottom-wrap h4 {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 0;
}

.jackpot .jackpot-img {
  background: url(../images/img-jackpot.svg?esee) no-repeat;
  background-size: cover;
  width: 8.25rem;
  height: 1.5rem;
  position: absolute;
  top: -.125rem;
  left: calc(50% - 4.125rem);
  animation: growShrinkPause 3.4s infinite;
}

.check-target,
.check-target-item,
.check-target-item-volum {
  display: flex;
}

.check-target-item {
  border-left: .0625rem solid rgba(255, 255, 255, .3);
  width: 100%;
  justify-content: space-between;
  align-items: end;
  padding: 0 1rem;
  gap: 1.25rem !important;
}

.check-target-item-title {
  color: rgba(250, 250, 250, .5);
  font-size: .75rem;
  font-weight: 500;
  line-height: .875rem;
  white-space: nowrap;
}

.check-target-item-volum {
  color: #EAECEF;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1;
  align-items: end;
  white-space: nowrap;
}

.check-target-item-volum span {
  font-size: .75rem;
  font-weight: 500;
  line-height: 1;
  margin-left: .125rem;
}

.total-pay {
  display: flex;
  justify-content: end;
  gap: 1rem !important;
  align-items: center;
  margin-top: .5rem;
}

.btn-pay-result-item {
  position: relative;
  width: calc(100% / 7);
  font-size: 1.25rem;
  line-height: 1;
  background: rgba(12, 15, 25, 0.6);
  border: 0.0625rem solid rgba(255, 219, 59, 0.6);
  ;
  border-radius: 1.25rem;
  padding: .5rem;
}

.btn-pay-result-item:hover,
.btn-pay-result-item:focus {
  border: 0.0625rem solid rgba(255, 219, 59, 0.9);
}

.btn-pay-result-item .tooltiptext {
  visibility: hidden;
  width: 6.5rem;
  background-color: rgba(9, 9, 11, 0.85);
  color: #fff;
  text-align: center;
  border-radius: .5rem;
  padding: .25rem;
  position: absolute;
  z-index: 1;
  bottom: 120%;
  left: -.625rem;
  white-space: nowrap;
}

.btn-pay-result-item .tooltiptext hr {
  border-top: .0625rem solid #fafafa;
  border-style: dashed;
  margin: 0;
}

.btn-pay-result-item .tooltiptext small {
  opacity: .5;
  letter-spacing: .0625rem;
}

.btn-pay-result-item .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%;
  /* At the bottom of the tooltip */
  left: 50%;
  margin-left: -.3125rem;
  border-width: .3125rem;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

.btn-pay-result-item:hover .tooltiptext {
  visibility: visible;
}

.price-box-start,
.price-box-live {
  display: flex;
  flex-direction: column;
  width: 10.625rem;
  position: absolute;
  z-index: 900;
}

.price-box-start {
  left: .5rem;
}

.price-box-live {
  right: .5rem;
}

.price-box-start-title,
.price-box-live-title {
  background-color: #EAECEF;
  border: .0625rem solid #FFDB3B;
  color: #1A1B22;
  font-size: 1rem;
  line-height: 1;
  font-weight: 700;
  border-top-left-radius: .875rem;
  border-top-right-radius: .875rem;
  padding: .5rem .75rem;
}

.price-box-live-title {
  display: flex;
  justify-content: space-between;
}

.price-box-start-value,
.price-box-live-value {
  background-color: #1A1B22;
  border: .0625rem solid #FFDB3B;
  color: #1DDB88;
  text-align: center;
  font-size: 1.5rem;
  line-height: 1;
  font-weight: 700;
  border-bottom-left-radius: .875rem;
  border-bottom-right-radius: .875rem;
  padding: .5rem .75rem;
}

#timer-text {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  fill: #FFDB3B;
  text-anchor: middle;
  dominant-baseline: middle;
}

#timer-sub-text {
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1;
  fill: #FFDB3B;
  text-anchor: middle;
  dominant-baseline: middle;
  text-transform: uppercase;
}

.progress-circle {
  transition: stroke-dashoffset 1s linear;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
}

.gap-main-wrap {
  gap: 1rem;
}

.offcanvas {
  --bs-offcanvas-width: 20rem;
}

.text-bg-dark {
  color: #EAECEF;
  background-color: #1A1B22;
}

.dropdown-menu {
  width: 100%;
  --bs-dropdown-min-width: 8rem;
  --bs-dropdown-bg: #1B212F;
  --bs-dropdown-border-color: #292F36;
  --bs-dropdown-link-hover-bg: #672FA8;
  --bs-dropdown-link-active-bg: #672FA8;
  overflow: hidden;
}

.dropdown-item {
  display: flex;
  padding: 1rem;
  line-height: 1;
  color: #CCC;
  gap: .625rem !important;
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item:active {
  color: #FAFAFA;
}

.dropdown-item img {
  width: 1rem;
  height: 1rem;
}

.accordion {
  --bs-accordion-bg: #1B212F;
}

.accordion-body {
  color: #EAECEF;
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.5;
  padding: 1.5rem;
}

.accordion-button {
  color: #8247E5;
  font-size: 1.25rem;
  ;
  font-weight: 700;
}

.accordion-button:not(.collapsed) {
  color: #F4624A;
  background-color: #242A3B !important;
  box-shadow: none;
}

.accordion-button:focus {
  box-shadow: none;
}

.accordion-item:first-child {
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
}

.accordion-item:last-child {
  border-bottom-left-radius: .5rem;
  border-bottom-right-radius: .5rem;
}

.accordion-item {
  overflow: hidden;
  border: .0625rem solid #292F36;
  background-color: #1A1B22;
}

.btn-lang {
  width: 100%;
  text-align: center;
  background-color: #292F36;
  border-color: #2d343d;
  min-width: 8rem;
  display: flex;
  padding: .5rem 1rem;
  line-height: 1;
  color: #CCC;
  gap: .625rem !important;
}

.btn-dark {
  --bs-btn-border-color: #1A1B22;
  --bs-btn-hover-bg: #292F36;
  --bs-btn-active-bg: #292F36;
  --bs-btn-active-border-color: #1A1B22;
}

.dropdown-toggle::after {
  border: none;
  font-family: "bootstrap-icons";
  content: '\F282';
  border: none;
  width: .625rem;
  margin-left: auto !important;
  vertical-align: middle;
  position: absolute;
  right: 1.25rem;
}

.sideMenu-list dt {
  font-size: 1.25rem;
  font-weight: 500;
  text-transform: uppercase;
  color: #725499;
  padding: .5rem 1rem;
  margin-bottom: 0;
  border-bottom: .0625rem dashed #3B2B50;
  text-transform: uppercase;
  margin-top: 1rem;
}

.sideMenu-list dd {
  font-size: 1rem;
  font-weight: 400;
  color: #EAECEF;
  padding: 1rem;
  text-transform: uppercase;
  margin-bottom: 0;
}

.sideMenu-list dd:hover {
  background-color: rgba(0, 0, 0, 0.1);
  color: #FFF;
}

.sideMenu-list dd img {
  margin-right: 1rem;
  filter: invert(29%) sepia(91%) saturate(2497%) hue-rotate(249deg) brightness(93%) contrast(93%);
}

.sideMenu-list dd:hover img {
  filter: invert(59%) sepia(45%) saturate(1979%) hue-rotate(218deg) brightness(100%) contrast(94%);
}

.form-check-input:focus {
  border-color: #B786F7;
  box-shadow: 0 0 0 0.25rem rgba(114, 84, 153, 0.35);
}

.form-check-input:checked {
  background-color: #B786F7;
  border-color: #B786F7;
}

.my-avatar {
  vertical-align: middle;
  width: 3.125rem;
  height: 3.125rem;
  border-radius: 50%;
  background-color: #EAECEF;
  border: .125rem solid #ff9f05;
}

.my-avatar-sm {
  vertical-align: middle;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
}

.user-info-wrap {
  display: flex;
  flex-direction: column;
  border: .0625rem dashed #3B2B50;
  padding: .5rem;
  border-radius: 1.5rem;
}
.user-info-wrap .tier-img {
  height: 1.625rem;
}

.user-id {
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 1rem;
  padding: .125rem .5rem;
  display: flex;
  justify-content: space-between;
}
.user-id span {
  font-size: .75rem;
  color: #EAECEF;
  font-weight: 500;
}

.btn span {
  width: calc(100% - 1.75rem);
  display: inline-block;
  white-space: nowrap;
}

.btn-avatar {
  padding: 0;
  border: none;
  position: relative;
}

.add-picture {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 2rem;
  line-height: 1;
  opacity: 0;
  padding: .5625rem;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 50%;
}

.btn-avatar:hover .add-picture {
  opacity: 1;
  color: #FAFAFA;
}

.status-online {
  display: inline-block;
  width: .625rem;
  height: .625rem;
  background-color: #1DDB88;
  border-radius: 50% !important;
  margin-right: .25rem;
}

.table-dark {
  --bs-table-color: #FAFAFA;
  --bs-table-bg: transparent;
  --bs-table-border-color: #1A1B22;
  --bs-table-active-bg: #1A1B22;
  --bs-table-hover-bg: #1A1B22;
  text-transform: uppercase;
  white-space: nowrap;
}

.table-dark thead th {
  color: #9D85BE;
  font-weight: 500;
}

.table-dark thead th,
.table-dark tbody td {
  font-size: .9375rem;
}

.dashbord-wrap {
  width: 80%;
  margin: 5rem auto;
}

.dashboard-card {
  width: 100%;
  background-color: #1A1B22;
  border: .0625rem solid transparent;
  border-radius: 1rem;
  padding: 2rem 1rem;
  text-align: center;
}

.dashboard-card:hover {
  background-color: rgba(200, 69, 212, .1);
  border: .0625rem solid rgba(200, 69, 212, 1);
}

.dashboard-card .row .col-sm-6:first-child {
  border-right: .0625rem solid #292F36;
}

.dashboard-card h1,
.dashboard-card h3 {
  color: #FFDB3B;
  margin-bottom: 0;
  font-weight: 700;
}

.dashboard-card p {
  font-weight: 500;
  color: #FAFAFA;
}

.dashboard-card small {
  color: #EAECEF;
  text-transform: uppercase;
}

.contact-form-wrap {
  background-color: rgba(26, 27, 34, 0.5);
  border-radius: 1.25rem;
  padding: 1.5rem 2rem;
}

.contact-form-wrap .form-label {
  color: #EAECEF;
}
.form-label {
  font-size: .875rem;
  color: #9D85BE;
}
.form-control {
  color: #FAFAFA;
  background-color: #1A1B22;
  border: .0625rem solid #292F36;
}

.form-control:focus {
  color: #FAFAFA;
  background-color: #292F36;
  border-color: #F9D28A;
  box-shadow: none !important;
}
.form-control:read-only {
  border: .0625rem solid rgba(41, 47, 54, 0.5);
  background-color: rgba(18, 19, 23, 0.5);
}

.pagination {
  --bs-pagination-color: #8247E5;
  --bs-pagination-bg: transparent;
  --bs-pagination-border-color: #312641;
  --bs-pagination-hover-color: #fff;
  --bs-pagination-hover-bg: #22293D;
  --bs-pagination-hover-border-color: #8247E5;
  --bs-pagination-focus-color: #8247E5;
  --bs-pagination-focus-bg: #9D85BE;
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: #8247E5;
  --bs-pagination-active-border-color: #8247E5;
  --bs-pagination-disabled-color: #9D85BE;
  --bs-pagination-disabled-bg: #312641;
  --bs-pagination-disabled-border-color: #312641;
}

.jackpot-status-wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  text-transform: uppercase;
}

.jackpot-status-user {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.jackpot-status-user .my-avatar {
  width: 4rem;
  height: 4rem;
  border: .125rem solid #F4624A;
}

.jackpot-status-ranking {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.ranking-item-rank {
  display: flex;
  gap: .25rem;
}

.ranking-item-rank img {
  width: 2rem;
  height: 2rem;
}

.ranking-item-progress {
  display: flex;
  border: .125rem solid #2E3643;
  width: 100%;
  height: .5rem;
  border-radius: .25rem;
  overflow: hidden;
}

.jacpot-status-tickets,
.jackpot-status-prizes,
.jackpot-status-ending {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  font-size: 2rem;
  font-weight: 700;
}

.jackpot-status-prizes div,
.list-item-prize h1 {
  color: #FFDB3B;
}

.jackpot-status-ending,
.list-item-prize {
  text-align: right;
}

.jackpot-status-ending i {
  opacity: .5;
}

.progress-level {
  width: 20%;
  height: 100%;
}

.progress-level.fill {
  background-color: #89D900;
}

.tpp5-jackpot-list {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}

.jackpot-list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: .125rem solid #2E3643;
  background-color: #1A1B22;
  padding: 0 1rem;
  border-radius: 1rem;
  ;
  text-transform: uppercase;
}

.list-item-rank {
  width: 7.5rem;
  height: 5rem;
}

.list-item-rank img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.list-item-condition {
  display: flex;
  flex-direction: column;
  gap: .25rem;
}

.list-item-condition span {
  font-size: 1.25rem;
  color: rgba(250, 250, 250, .5);
}

.bg-jackpot-weekly {
  background: url(../images/bg-jackpot-weekly.png?1552) no-repeat;
  background-size: contain;
}

.bg-jackpot-monthly {
  background: url(../images/bg-jackpot-monthly.png?1552) no-repeat;
  background-size: contain;
}

@media (max-width: 62rem) {
  html {
    font-size: 1.5vw;
  }

  .item:nth-child(1) {
    order: 2;
  }

  .item:nth-child(2) {
    order: 1;
  }

  .item:nth-child(3) {
    order: 3;
  }

  .navbar {
    padding-left: 1rem;
    padding-right: 1rem;
    margin-bottom: .5rem;
  }

  .navbar-brand,
  .navbar-sub .navbar-brand {
    width: 2.5rem;
    height: 2.5rem;
    background: url(../images/favicon.svg?1552) no-repeat 0 0;
    background-size: 2.5rem 2.5rem;
    padding-top: 1.5rem !important;
    margin-right: 0;
  }

  .navbar-sub {
    --bs-navbar-padding-y: .875rem !important;
  }

  .navbar-sub h1 {
    font-size: 1rem;
  }

  .navbar-brand img {
    width: 13rem;
    height: 4.125rem;
    margin-bottom: 1.5rem;
  }

  .chart-wrap {
    width: 100%;
    height: calc(100% - 13.125rem);
  }

  .gap-main-wrap {
    flex-wrap: wrap !important;
  }

  .bull-pool-up-wrap,
  .bear-pool-down-wrap {
    width: calc(50% - .625rem) !important;
    height: 12.5rem;
  }

  .bull-pool-up-wrap .bg-bull-pool {
    height: 3.75rem;
    background-position: top center;
  }

  .bear-pool-down-wrap .bg-bear-pool {
    height: 3.75rem;
    background-position: top center;
  }

  .bull-pool-up-wrap i,
  .bear-pool-down-wrap i {
    font-size: .875rem;
  }

  .btn-bull-up i,
  .btn-bear-down i {
    font-size: 4rem;
  }

  .waiting {
    width: 10rem;
    height: 10rem;
  }

  .waiting h4 {
    font-size: 1.125rem;
  }

  .main-intro-wrap {
    margin-top: 8%;
  }

  .graph-area {
    height: calc(100vh - 31.5rem) !important;
    margin-top: -3rem;
    border-radius: 0;
  }

  .table-dark thead th,
  .table-dark tbody td {
    font-size: 1rem;
  }

}

@media (max-width: 36rem) {
  html {
    font-size: 3.4vw;
  }

  .main-intro-wrap {
    margin-top: 12%;
  }

  .item:nth-child(1) {
    margin-left: .5rem;
  }

  .item:nth-child(3) {
    margin-right: .5rem;
  }

  .title-main {
    font-size: 4rem;
  }

  .title-sub {
    font-size: 1.5rem;
  }

  .message-info {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .container-fluid {
    --bs-gutter-x: 0;
  }

  .about-polycat img {
    height: 1.875rem;
  }

  .nav-center,
  .btn-nav-center {
    width: 40vw !important;
    max-height: 4.375rem;
    padding: .875rem .375rem;
    font-size: 1rem;
    border-radius: 0 0 1.3125rem 1.3125rem;
  }

  .balance-info {
    width: calc(100% - 4.5rem);
  }

  .btn-main {
    width: 100%;
    font-size: 2rem;
  }

  .btn-icon {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1rem;
  }

  .has-news {
    top: .25rem;
    right: .25rem;
    width: .5rem;
    height: .5rem;
  }

  .notice-wrap {
    padding: 0 1rem;
  }

  .potential-wrap h1 img,
  .investment-wrap h3 img {
    vertical-align: baseline;
    width: 1rem;
    height: 1rem;
  }

  .bull-pool-up-wrap,
  .bear-pool-down-wrap {
    width: calc(50% - 1.125rem) !important;
    height: 9.5rem;
  }

  .bull-pool-up-wrap h1,
  .bear-pool-down-wrap h1 {
    font-size: 1.75rem;
  }

  .bull-pool-up-wrap h3,
  .bear-pool-down-wrap h3 {
    font-size: 1.3125rem;
  }

  .bull-pool-up-wrap h4,
  .bear-pool-down-wrap h4 {
    font-size: 1rem;
  }

  .bull-pool-up-wrap span,
  .bear-pool-down-wrap span {
    font-size: .75rem;
  }

  .btn-bull-up i,
  .btn-bear-down i {
    font-size: 3rem;
  }

  .btn-bull-up h6,
  .btn-bear-down h6 {
    font-size: .75rem;
  }

  .flowing-notice {
    font-size: .875rem;
  }

  .potential-wrap {
    display: none;
  }

  .stats-up {
    flex-direction: column;
  }

  .stats-down {
    flex-direction: column-reverse;
    justify-content: start;
  }

  .potential-wrap h1 {
    font-size: 1.5rem;
  }

  .payout {
    margin-top: .125rem;
    margin-left: 0;
    margin-right: 0;
  }

  .stats {
    padding: 0 1rem;
  }

  .mui-list {
    padding: 0 .5rem;
    gap: .625rem !important;
    margin-top: .25rem;
  }

  .check-target-item:nth-child(1),
  .check-target-item:nth-child(3) {
    display: none;
  }

  .check-target-item-title {
    font-size: .625rem;
    line-height: 1;
  }

  .check-target-item-volum {
    font-size: 1.3125rem;
  }

  .check-target-item-volum span {
    font-size: .75rem;
  }

  .payout-up,
  .payout-down {
    display: flex;
    font-size: 2rem;
  }

  .payout-up span,
  .payout-down span {
    font-size: 1rem;
  }

  .payout-down {
    justify-content: end;
  }

  .waiting {
    width: 7rem;
    height: 7rem;
    margin-top: .75rem;
  }

  .waiting h4 {
    font-size: 1rem;
  }

  .graph-area {
    height: calc(100vh - 25.5rem) !important;
    margin-top: -2.125rem;
    border-radius: 0;
  }

  .btn-mui-list-item {
    font-size: 1rem;
    padding: .375rem 0;
  }

  .total-pay {
    gap: .625rem !important;
  }

  .btn-pay-result-item {
    font-size: 1rem;
    padding: .25rem .5rem;
  }

  .phrase-title {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .price-box-start,
  .price-box-live {
    width: 7.75rem;
  }

  .price-box-start-title,
  .price-box-live-title {
    font-size: .75rem;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
    padding: .25rem .5rem;
  }

  .price-box-start-value,
  .price-box-live-value {
    font-size: 1rem;
    border-bottom-left-radius: .5rem;
    border-bottom-right-radius: .5rem;
    padding: .25rem .5rem;
  }

  .jackpot {
    width: 8rem;
  }

  .top-wrap {
    font-size: 1.125rem;
  }

  .bottom-wrap span {
    font-size: .75rem;
  }

  .bottom-wrap h4 {
    font-size: 1.375rem;
  }

  .box-target-total-pay {
    width: calc(100% - 10rem);
  }

  .check-target-item {
    padding: 0 .5rem;
  }

  .dashbord-wrap {
    width: 96%;
    margin: .5rem auto;
  }

  .dashboard-card .row .col-sm-6:first-child {
    border-right: .0625rem solid transparent;
  }

  footer {
    padding: 3rem 0;
    position: relative !important;
  }

  .jackpot {
    width: 7rem;
  }

  .top-wrap {
    height: 1rem;
  }

  .jackpot .jackpot-img {
    width: 5.5rem;
    height: 1rem;
    top: -0.125rem;
    left: calc(50% - 2.75rem);
  }

  .phrase-title-animation {
    font-size: 2.5rem;
  }

  .avatar-wrap {
    min-width: 1rem;
  }

  .avatar-wrap .img-avatar-bull,
  .avatar-wrap .img-avatar-bear,
  .avatar-wrap .img-avatar-gold {
    width: .875rem;
    height: .875rem;
    margin-bottom: .125rem;
    border-width: .0625rem;
  }

  .avatar-wrap h5 {
    display: none;
  }

  .country-wrap {
    width: .5rem;
    height: .5rem;
  }

  .player-wrap {
    gap: .125rem;
    padding: .75rem;
  }

  .btn-pay-result-item .tooltiptext {
    width: 5rem;
    padding: .25rem 0;
    left: -1.5rem;
  }

  .btn-pay-result-item .tooltiptext h5 {
    font-size: 1rem;
  }

  .table-dark thead th,
  .table-dark tbody td {
    font-size: .75rem;
  }

  .btn-pay-result-item .tooltiptext button {
    font-size: .625rem;
  }

  .btn-pay-result-item .tooltiptext small {
    letter-spacing: 0;
  }

}

.history-table-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    color: #fff;
    z-index: 10;
    overflow-y: auto;
    pointer-events: auto;
    border-radius: 12px;
    padding: 24px 8px 16px 8px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.history-table-container {
    background: rgba(32,32,32,0.65);
    border-radius: 12px;
    padding: 16px;
    width: 100%;
    margin: 0;
    margin-top: 64px;
}

.history-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.history-table th, .history-table td {
    background: transparent !important;
    color: #fff !important;
    border: none !important;
    padding: 0;
}

.history-table-col {
    vertical-align: middle;
    min-width: 18px;
    max-width: 24px;
    padding: 4px 1px;
    text-align: center;
}

.history-icon-wrap {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    margin: 0 auto;
    text-align: center;
}

.history-icon {
    display: inline-block;
    font-size: 1.7rem;
    line-height: 1;
}

.bi-circle-fill {
    font-size: 2.1rem;
}

.history-icon-big-wrap {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    margin: 0 auto;
    text-align: center;
}

.history-icon-big {
    font-size: 2.7rem;
    line-height: 1;
}

.history-icon-big-num {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.7rem;
    font-weight: bold;
    color: inherit;
    text-shadow:
        0 0 2px #000,
        0 0 2px #000,
        0 0 2px #000;
    border: 2px solid currentColor;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.15);
    box-sizing: border-box;
    pointer-events: none;
    user-select: none;
}

@media (max-width: 900px) {
    .history-table-container {
        padding: 4px 1px;
        margin-top: 32px;
    }
    .history-table th, .history-table td {
        padding: 3px 0;
    }

    .history-table-col {
        min-width: 10px;
        max-width: 14px;
        height: 18px;
        padding: 3px 0.5px;
    }
    .history-icon-wrap {
        width: 22px;
        height: 22px;
    }
    .history-icon {
        font-size: 1.2rem;
    }
    .history-icon-big-wrap {
        width: 28px;
        height: 28px;
    }
    .history-icon-big {
        font-size: 1.7rem;
    }
    .history-icon-big-num {
        font-size: 1.2rem;
    }
}

@media (max-width: 600px) {
    .history-table-container {
        padding: 2px 0;
        margin-top: 16px;
    }
    .history-table-col {
        min-width: 6px;
        max-width: 8px;
        height: 18px;
        padding: 2px 0.2px;
    }
    
    .history-icon-wrap {
        width: 18px;
        height: 18px;
    }
    .history-icon {
        font-size: 1.1rem;
    }
    .history-icon-big-wrap {
        width: 22px;
        height: 22px;
    }
    .history-icon-big {
        font-size: 1.3rem;
    }
    .history-icon-big-num {
        font-size: 1.0rem;
    }
}

.text-bull-up > i,
.text-bull-up.bi,
.history-icon.text-bull-up,
.history-icon-big-wrap.text-bull-up,
.history-icon-big.text-bull-up,
.history-icon-big-num.text-bull-up {
    color: #2ecc40 !important;
    fill: #2ecc40 !important;
    -webkit-text-fill-color: #2ecc40 !important;
    border-color: #2ecc40 !important;
}
.text-bear-down > i,
.text-bear-down.bi,
.history-icon.text-bear-down,
.history-icon-big-wrap.text-bear-down,
.history-icon-big.text-bear-down,
.history-icon-big-num.text-bear-down {
    color: #ff4136 !important;
    fill: #ff4136 !important;
    -webkit-text-fill-color: #ff4136 !important;
    border-color: #ff4136 !important;
}
.text-draw > i,
.text-draw.bi,
.history-icon.text-draw,
.history-icon-big-wrap.text-draw,
.history-icon-big.text-draw,
.history-icon-big-num.text-draw {
    color: #F3BA2F !important;
    fill: #F3BA2F !important;
    -webkit-text-fill-color: #F3BA2F !important;
    border-color: #F3BA2F !important;
}