@font-face {
  font-family: "avenir";
  src: url("../fonts/AvertaStd-Regular.ttf");
  font-weight: 400;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: "avenir";
  src: url("../fonts/AvertaStd-Semibold.ttf");
  font-weight: 600;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: "avenir";
  src: url("../fonts/AvertaStd-Bold.ttf");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: "avenir";
  src: url("../fonts/AvertaStd-Black.ttf");
  font-weight: bolder;
  font-style: normal;
  font-display: swap; }
.container-wrapper {
  max-width: 985px;
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
  margin-right: auto;
  margin-left: auto; }

@media screen and (min-width: 1270px) and (max-width: 1365.98px) {
  .container-wrapper {
    max-width: 985px; } }
@media screen and (min-width: 992px) and (max-width: 1269.98px) {
  .container-wrapper {
    max-width: 960px; } }
@media screen and (min-width: 768px) and (max-width: 991.98px) {
  .container-wrapper {
    max-width: 720px; } }
@media screen and (max-width: 767.98px) {
  .container-wrapper {
    max-width: 540px; } }
@media screen and (max-width: 538.98px) {
  .container-wrapper {
    max-width: 540px; } }
.main-banner {
  height: 75vh;
  padding-bottom: 0; }
  .main-banner .banner-info {
    top: 10%; }
    .main-banner .banner-info h2 {
      font-size: 2rem;
      font-weight: 800; }
    .main-banner .banner-info h4 {
      margin-bottom: 0;
      font-size: 1.3rem; }
    .main-banner .banner-info img {
      width: 7rem; }

@media screen and (min-width: 1440px) and (max-width: 1919.98px) {
  .main-banner {
    height: 70vh;
    padding-bottom: 0; }
    .main-banner .banner-info {
      top: 11%; }
      .main-banner .banner-info h2 {
        font-size: 2.5rem; }
      .main-banner .banner-info h4 {
        font-size: 1.5rem; }
      .main-banner .banner-info img {
        width: 5rem; } }
@media screen and (min-width: 1270px) and (max-width: 1365.98px) {
  .main-banner {
    height: 60vh;
    padding-bottom: 0;
    width: 100vw;
    background-size: cover;
    background-position: center center;
    background-image: url(../images/hero/main-banner-1280.png); }
    .main-banner .banner-info {
      top: 10%; }
      .main-banner .banner-info h2 {
        font-size: 2.2rem; }
      .main-banner .banner-info h4 {
        font-size: 1.3rem; }
      .main-banner .banner-info img {
        width: 4rem; } }
@media screen and (min-width: 992px) and (max-width: 1269.98px) {
  .main-banner .banner-info {
    top: 10%; } }
@media screen and (min-width: 768px) and (max-width: 991.98px) {
  .main-banner {
    height: 40vh;
    padding-bottom: 0; }
    .main-banner .banner-info {
      top: 10%; }
      .main-banner .banner-info h2 {
        font-size: 1.6rem; }
      .main-banner .banner-info h4 {
        font-size: 1.1rem; }
      .main-banner .banner-info img {
        width: 4rem; } }
@media screen and (max-width: 767.98px) {
  .main-banner {
    height: 40vh;
    padding-bottom: 0; }
    .main-banner .banner-info {
      top: 10%; }
      .main-banner .banner-info h2 {
        font-size: 1.4rem; }
      .main-banner .banner-info h4 {
        font-size: 1.1rem; }
      .main-banner .banner-info img {
        width: 4rem; } }
@media screen and (max-width: 538.98px) {
  .main-banner {
    height: 35vh;
    padding-bottom: 0; }
    .main-banner .banner-info {
      top: 6%; }
      .main-banner .banner-info h2 {
        font-size: 1.3rem; }
      .main-banner .banner-info h4 {
        font-size: 0.9rem; }
      .main-banner .banner-info img {
        width: 3rem; } }
.intro {
  font-size: 1.2rem;
  padding: 2rem 1rem; }

@media screen and (max-width: 767.98px) {
  .intro {
    display: none; } }
.deposit-card {
  background: #F3F5F6;
  padding: 28px 28px 32px; }
  .deposit-card h4 {
    color: #000000; }
  .deposit-card h5 {
    color: #000000; }
  .deposit-card .brand {
    height: 32px;
    width: auto; }
  .deposit-card .deposit-desc {
    position: static;
    top: 0;
    margin-top: 0;
    margin-bottom: 20px;
    background: white;
    color: #9ca3af;
    border-radius: 16px;
    min-height: 100px;
    font-size: 1rem;
    padding: 16px 20px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center; }
  .deposit-card .currency-name {
    color: black;
    font-size: 0.6rem; }

.deposit-header {
  display: none; }

.deposit-art-wrap {
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden; }
  .deposit-art-wrap img.art {
    width: 100%;
    height: auto; }

.flag-circle {
  border-radius: 50%;
  transition: box-shadow 0.3s ease;
  box-shadow: 0 0 0 0px #ddd; }
  .flag-circle:hover {
    box-shadow: 0 0 0 5px #2e43ff;
    transform: scale(1.1); }

@media screen and (min-width: 992px) and (max-width: 1269.98px) {
  .deposit-card .icons {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, 1fr);
    min-height: 148px; }

  .deposit-item:last-child .deposit-card .icons {
    display: flex;
    flex-wrap: wrap;
    column-gap: 1rem;
    row-gap: 20px;
    justify-content: center;
    min-height: 148px;
    align-items: center; }
    .deposit-item:last-child .deposit-card .icons .icon {
      flex: 0 0 calc(20% - 0.8rem); } }
@media screen and (min-width: 768px) and (max-width: 991.98px) {
  .deposit-item:last-child .deposit-card .icons {
    display: flex;
    flex-wrap: wrap;
    column-gap: 0.7rem;
    row-gap: 20px;
    justify-content: center;
    min-height: 148px;
    align-items: center;
    width: 100%; }
    .deposit-item:last-child .deposit-card .icons .icon {
      flex: 0 0 calc(20% - 0.8rem); } }
@media screen and (max-width: 767.98px) {
  .deposit-grid {
    padding-top: 0.7rem; }

  .deposit-list {
    display: none; }

  .deposit-header {
    display: flex;
    align-items: center;
    background-color: #0042D3;
    padding: 5px 16px;
    border-radius: 12px 12px 0 0;
    justify-content: center; }
    .deposit-header .deposit-container {
      display: flex;
      align-items: center;
      gap: 10px; }
      .deposit-header .deposit-container img {
        height: 2.5rem;
        width: auto; }
        .deposit-header .deposit-container img[src="index_files/images/logo/bk8-io-white.svg"] {
          height: 2.1rem; }
      .deposit-header .deposit-container h3 {
        color: #fff;
        margin: 0;
        font-size: 1rem;
        font-weight: 600; }

  .deposit-card {
    padding: 1rem; }
    .deposit-card .icons {
      display: grid;
      row-gap: 1rem;
      column-gap: 2rem;
      grid-template-columns: repeat(4, 1fr); }
    .deposit-card button {
      width: 55%;
      font-size: 0.9rem;
      margin-top: 1rem; }

  .deposit-item:last-child .deposit-card .icons {
    display: flex;
    gap: 1.5rem; }

  .flag-circle {
    width: 50px;
    height: 50px; } }
@media screen and (max-width: 538.98px) {
  .deposit-grid {
    grid-template-columns: 1fr;
    gap: 0.7rem; }

  .deposit-item {
    min-width: 0;
    width: 100%; }

  .deposit-card button {
    width: 60%;
    font-size: 0.9rem; }

  .deposit-art-wrap {
    min-height: 180px; } }
@media screen and (min-width: 768px) {
  .deposit-item {
    display: grid;
    grid-row: span 7;
    grid-template-rows: subgrid; }

  .deposit-card {
    display: grid;
    grid-row: span 7;
    grid-template-rows: subgrid;
    justify-items: center;
    gap: 0.5rem; }

  .deposit-list {
    display: contents; } }
.most-trusted h2 {
  font-family: "avenir";
  font-weight: 400; }
.most-trusted p {
  font-size: 1.2rem;
  width: 75%;
  margin: 0 auto; }

.trusted-card {
  flex: 0 0 clamp(300px, 30vw, 360px); }

@media screen and (min-width: 1270px) and (max-width: 1365.98px) {
  .trusted-card {
    flex: 0 0 clamp(320px, 28vw, 430px); } }
@media screen and (min-width: 768px) and (max-width: 991.98px) {
  .trusted-card {
    flex: 0 0 clamp(380px, 30vw, 460px); } }
.trusted-card-head {
  gap: 0.6rem; }

.trusted-card-logo-container {
  height: 4rem;
  display: flex;
  justify-content: center;
  align-items: center; }
  .trusted-card-logo-container .trusted-card-logo {
    margin: 0;
    height: 100%; }
    .trusted-card-logo-container .trusted-card-logo[src*="godaddy"] {
      height: 70%; }
    .trusted-card-logo-container .trusted-card-logo[src*="bmm"] {
      height: 50%; }

.bk8-trust-grid {
  height: initial;
  grid-template-columns: 40% 60%; }
  .bk8-trust-grid .bk8-trust-count {
    font-size: 2.7rem;
    font-family: "avenir";
    font-weight: bolder; }
  .bk8-trust-grid .bk8-trust-title {
    font-family: "avenir";
    font-weight: 400; }
  .bk8-trust-grid .bk8-trust-desc {
    font-size: 1.1rem; }

.tp-score {
  font-family: "avenir";
  font-weight: 400; }

.trusted-title {
  max-width: 300px;
  margin-bottom: 1rem;
  font-size: 2.5rem;
  line-height: 1.2;
  word-wrap: break-word;
  font-family: "avenir";
  font-weight: 400; }

@media screen and (max-width: 997.98px) {
  .bk8-trusted .trusted-left {
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important; }

  .tp-line {
    display: none !important; }

  .trusted-title {
    max-width: 220px;
    margin-bottom: 0 !important;
    font-size: 1.5rem;
    flex: 1;
    font-family: "avenir";
    font-weight: 700;
    padding-left: 0.9rem; }

  .trusted-nav {
    margin-top: 0 !important;
    flex-shrink: 0; }

  .trusted-nav .circleBtn {
    width: 40px;
    height: 40px; } }
@media screen and (max-width: 767.98px) {
  .most-trusted {
    padding-bottom: 1.5rem; } }
@media screen and (max-width: 538.98px) {
  .most-trusted h2 {
    font-size: 1.5rem; }
  .most-trusted p {
    font-size: 0.9rem;
    width: 80%;
    margin: 0 auto; } }
@media (max-width: 480px) {
  .trusted-nav .circleBtn {
    width: 35px;
    height: 35px; } }
.bk8-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr 1fr; }
  .bk8-stats-grid .bk8-stat:first-child {
    text-align: left; }
    .bk8-stats-grid .bk8-stat:first-child .bk8-stat-lbl {
      padding-left: 5%; }
  .bk8-stats-grid .bk8-stat:last-child {
    text-align: right; }
    .bk8-stats-grid .bk8-stat:last-child .bk8-stat-num {
      padding-right: 3%; }
  .bk8-stats-grid .bk8-stat .bk8-stat-num {
    font-size: 3rem; }
  .bk8-stats-grid .bk8-stat .bk8-stat-lbl {
    font-size: 1rem; }

@media screen and (max-width: 767.98px) {
  .bk8-stats-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2rem; }
    .bk8-stats-grid .bk8-stat {
      text-align: center; }
      .bk8-stats-grid .bk8-stat:first-child {
        grid-column: 1 / -1;
        text-align: center; }

  .bk8-stat.uptime {
    position: static;
    top: auto; } }
@media screen and (max-width: 538.98px) {
  .bk8-stats {
    padding: 2rem 0; } }
@media screen and (max-width: 820px) {
  .bk8-trust-left {
    text-align: center; }

  .bk8-trust-desc {
    max-width: initial; }

  .bk8-trust-cta {
    justify-content: center; } }
@media screen and (max-width: 997.98px) {
  .bk8-marquee {
    display: none; }

  .bk8-trust-grid {
    grid-template-columns: auto !important;
    gap: 0px !important;
    height: auto !important; }
    .bk8-trust-grid .bk8-trust-title {
      font-size: 2rem; }

  .bk8-trust-count {
    font-size: 2.5rem; }

  .bk8-trust {
    padding-top: 2rem;
    padding-bottom: 2rem; }

  .bk8-trust-left {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center; }

  .bk8-trust-desc {
    font-size: 16px !important;
    text-align: center;
    max-width: unset; }

  .bk8-review-mobile {
    display: flex;
    flex-direction: column; }

  .bk8-review-footer .bk8-review-avatar {
    width: 4rem;
    height: 4rem; }
  .bk8-review-footer .bk8-review-name {
    font-weight: 600; }

  #bk8TrustCarousel .carousel-indicators [data-bs-target] {
    box-sizing: content-box;
    flex: 0 1 auto;
    width: 7px;
    height: 7px;
    padding: 0;
    margin-right: 3px;
    margin-left: 3px;
    cursor: pointer;
    background-clip: padding-box;
    border: 0;
    transition: opacity .6s ease;
    background-color: #D2D2D7;
    opacity: 100%;
    margin-top: 1rem;
    margin-bottom: 1rem; }
    #bk8TrustCarousel .carousel-indicators [data-bs-target].active {
      background-color: #ff8a00;
      width: 30px; }

  .bk8-review-mobile .bk8-review-text {
    flex: 1;
    font-size: 1.1rem;
    font-style: italic;
    align-items: center;
    display: flex; }

  .bk8-trust-dots {
    position: static !important;
    display: flex !important;
    justify-content: center;
    margin-top: 12px;
    margin-bottom: 0; }

  .bk8-trust-cta.mobile {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center;
    gap: 14px;
    margin-top: 20px; }

  .bk8-trust-cta.mobile button {
    flex: 1;
    max-width: 180px;
    width: auto !important; } }
#loopVideo {
  display: block; }

@media (max-width: 576px) {
  .game-parts {
    display: flex;
    flex-wrap: nowrap;
    align-items: center; }

  .game-parts img {
    width: calc((100vw - 100px) / 5);
    max-width: 120px;
    min-width: 70px;
    height: auto;
    flex-shrink: 1; }

  .game-parts.partone {
    position: relative;
    left: calc(20px - (100vw - 664px) / 10); }

  .game-parts.parttwo {
    position: relative;
    left: calc(-20px + (100vw - 664px) / 10); }

  .game-grid {
    gap: calc(15px - (100vw - 450px) / 30);
    padding: 0 calc(30px - (100vw - 450px) / 15); } }
#sponsorCarousel .carousel-indicators [data-bs-target] {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 7px;
  height: 7px;
  padding: 0;
  margin-right: 3px;
  margin-left: 3px;
  cursor: pointer;
  background-clip: padding-box;
  border: 0;
  transition: opacity .6s ease;
  background-color: white;
  opacity: 100%; }
  #sponsorCarousel .carousel-indicators [data-bs-target].active {
    background-color: #ff8a00;
    width: 30px; }

@media screen and (max-width: 767.98px) {
  .sponsor {
    padding-top: 2rem; } }
.stay-ahead-info h2 {
  font-family: "avenir";
  font-weight: 400; }

.game-grid {
  margin-top: 2rem; }

@media screen and (min-width: 992px) and (max-width: 1269.98px) {
  .game-grid {
    margin-top: 1rem; } }
@media screen and (max-width: 991.98px) {
  .game-grid {
    margin-top: 0; } }
.bk8-footer-logo {
  width: 6rem; }

.bk8-sponsors-grid {
  grid-template-columns: 10% 25% 12% 1fr;
  gap: 1rem; }

.bk8-sponsor-block-items {
  gap: 0; }
  .bk8-sponsor-block-items.partner {
    justify-content: center; }

.bk8-sponsor-block-label {
  font-weight: 600;
  font-size: 0.75rem; }
  .bk8-sponsor-block-label[data-i18n="official-partner"] {
    text-align: center; }

.bk8-sponsor-item img {
  height: 40px;
  width: auto;
  max-width: 100%;
  object-fit: contain; }

.bk8-sponsor-block:last-child .bk8-sponsor-block-items {
  flex-wrap: nowrap; }
.bk8-sponsor-block:last-child .bk8-sponsor-item {
  min-width: 0;
  flex: 1; }
  .bk8-sponsor-block:last-child .bk8-sponsor-item img {
    width: 100%; }
.bk8-sponsor-block:nth-child(2) .bk8-sponsor-block-label {
  padding-left: 0.7rem; }

.bk8-footer-meta-title {
  font-family: "avenir";
  font-weight: 600;
  color: #697882; }

@media screen and (min-width: 1270px) and (max-width: 1365.98px) {
  .bk8-sponsors-grid {
    grid-template-columns: 10% 28% 12% 1fr; }

  .bk8-sponsor-block:nth-child(2) .bk8-sponsor-block-items {
    flex-wrap: nowrap; } }
@media screen and (min-width: 768px) and (max-width: 991.98px) {
  .bk8-sponsors-grid {
    width: 1270px;
    zoom: calc(700px / 1270px);
    justify-items: unset; } }
@media screen and (min-width: 992px) and (max-width: 1199.98px) {
  .bk8-sponsors-grid {
    width: 1270px;
    zoom: calc(936px / 1270px); } }
@media screen and (min-width: 1200px) and (max-width: 1269.98px) {
  .bk8-sponsors-grid {
    width: 1270px;
    zoom: calc(1116px / 1270px); } }
@media screen and (max-width: 767.98px) {
  .bk8-sponsors-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 22px !important;
    text-align: center; }

  .bk8-sponsor-block:nth-child(1) {
    order: 1;
    justify-self: end; }

  .bk8-sponsor-block:nth-child(3) {
    order: 2;
    justify-self: start; }

  .bk8-sponsor-block:nth-child(2) {
    order: 3;
    grid-column: 1 / -1; }

  .bk8-sponsor-block:nth-child(4) {
    order: 4;
    grid-column: 1 / -1; }

  .bk8-sponsor-block-items {
    justify-content: center !important;
    gap: 14px !important; }

  .bk8-footer-top {
    gap: 18px !important;
    text-align: center;
    align-items: center !important;
    flex-direction: column; }

  .bk8-footer-meta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    width: 100%; }

  .bk8-footer-meta-logos {
    justify-content: center !important;
    gap: 12px !important; }

  .bk8-footer-brand .bk8-footer-copy {
    display: none !important; }

  .bk8-footer-copy.mobile {
    display: block !important;
    text-align: center;
    margin: 20px 0 0; } }
@media screen and (max-width: 538.98px) {
  .overflow-container {
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; }
    .overflow-container::-webkit-scrollbar {
      display: none; }

  .overflow-container .bk8-sponsor-block-items {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content;
    gap: 12px !important; }

  .overflow-container .bk8-sponsor-item {
    flex: 0 0 68px !important;
    width: 68px !important; }

  .overflow-container .bk8-sponsor-item img {
    width: 52px !important;
    height: 52px !important;
    display: block !important;
    margin: 0 auto !important; } }
.seo-content {
  position: relative;
  background: #F3F5F6;
  padding: 2rem;
  border-radius: 1rem; }
  .seo-content h2 {
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
    color: #697882; }
  .seo-content h3 {
    font-size: 0.7rem;
    font-weight: 700;
    margin-top: 1.25rem;
    margin-bottom: 0.5rem;
    color: #697882; }
  .seo-content p,
  .seo-content li {
    font-size: 0.7rem;
    color: #697882;
    line-height: 1.5;
    margin-bottom: 0.4rem; }
  .seo-content ul {
    padding-left: 1.2rem;
    margin-bottom: 0.5rem; }

.seo-body {
  position: relative;
  max-height: 90px;
  overflow: hidden; }
  .seo-body.seo-expanded {
    max-height: none; }

.seo-fade {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 70px;
  background: linear-gradient(to bottom, transparent, #F3F5F6);
  pointer-events: none; }

.seo-toggle-btn {
  display: block;
  margin: -18px auto 0;
  padding: 8px 28px;
  background: #9ca3af;
  color: #fff;
  border: none;
  border-radius: 999px;
  font-size: 0.85rem;
  cursor: pointer;
  position: relative;
  z-index: 2; }
  .seo-toggle-btn:hover {
    background: #6b7280; }

@media screen and (max-width: 767.98px) {
  .seo-content {
    text-align: center; }

  .seo-body {
    max-height: 80px; } }
@font-face {
  font-family: 'SukhumvitSet';
  src: url("../fonts/SukhumvitSet-Light.ttf");
  font-weight: 300;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'SukhumvitSet';
  src: url("../fonts/SukhumvitSet-Medium.ttf");
  font-weight: 400;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'SukhumvitSet';
  src: url("../fonts/SukhumvitSet-SemiBold.ttf");
  font-weight: 600;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'SukhumvitSet';
  src: url("../fonts/SukhumvitSet-Bold.ttf");
  font-weight: 700;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'SukhumvitSet';
  src: url("../fonts/SukhumvitSet-Text.ttf");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
html[lang="th"] {
  line-height: 1.5;
  letter-spacing: normal; }
  html[lang="th"] body,
  html[lang="th"] button,
  html[lang="th"] input,
  html[lang="th"] select,
  html[lang="th"] textarea,
  html[lang="th"] h1,
  html[lang="th"] h2,
  html[lang="th"] h3,
  html[lang="th"] h4,
  html[lang="th"] h5,
  html[lang="th"] h6,
  html[lang="th"] p,
  html[lang="th"] span,
  html[lang="th"] div,
  html[lang="th"] a,
  html[lang="th"] li,
  html[lang="th"] label {
    font-family: "SukhumvitSet", "nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
  html[lang="th"] .btn,
  html[lang="th"] .nav-link,
  html[lang="th"] .heading {
    font-family: "SukhumvitSet", "nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
  html[lang="th"] .bk8-sponsors-grid {
    grid-template-columns: 10% 28% 15% 1fr; }

html[lang="tk"] .deposit-card button,
html[lang="vn"] .deposit-card button {
  font-size: 1.1rem; }

@media screen and (max-width: 767.98px) {
  html[lang="tk"] .deposit-card button,
  html[lang="th"] .deposit-card button,
  html[lang="ph"] .deposit-card button,
  html[lang="kh"] .deposit-card button,
  html[lang="vn"] .deposit-card button {
    width: 75%;
    font-size: 0.8rem;
    white-space: nowrap; } }