@charset "utf-8";

html, body { height: 100% !important; }

.sub-page, #app { height: auto; }

body { background-position: center center; }

a:hover, button:hover { filter: brightness(1.3); }

.vhm-100 { min-height: 100vh; }

.option-menu-game { position: fixed; display: flex; flex-direction: column; visibility: hidden; opacity: 0; transition: visibility, opacity 0.3s linear; }

.option-menu-game.active { visibility: visible; opacity: 1; width: fit-content; }

.option-menu-opennewtab { height: 40px; border-radius: 2em; outline: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; font-size: 0.9em; display: flex; justify-content: space-between; align-items: center; padding: 0px 0.25em 0px 1em; background: rgb(100, 96, 96); color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.37) 3px 4px 8px 0px; }

.option-menu-opennewtab span { margin-right: 0.5em; }

.option-menu-opennewtab svg { height: 80%; }

#btn-direct { font-size: 3em; height: 4.5em; width: 100%; background-repeat: no-repeat; background-size: contain; background-color: transparent; background-position: center top; max-width: 20em; position: relative; padding: 0px !important; }

#btn-direct::before, #btn-direct::after { content: ""; width: 9em; height: 5em; pointer-events: none; position: absolute; background-repeat: no-repeat; background-size: contain; background-image: url("/g_assets/img/other/light-ray.png"); }

#btn-direct::before { top: 0px; left: 0px; animation: 2s linear 0s infinite normal none running blinker, 10s linear 0s infinite normal none running moveToRight; transform: translate(-50%, -50%); }

#btn-direct::after { right: 0px; bottom: 0px; animation: 2s linear 0s infinite normal none running blinker, 10s linear 0s infinite normal none running moveToLeft; transform: translate(-50%, -50%); }

.blinker { width: 400px; animation: 2s linear 0s infinite normal none running blinker; }

@keyframes blinker { 
  2% { opacity: 0.8; }
  3% { opacity: 1; }
  5% { opacity: 1; }
  12% { opacity: 1; }
  14% { opacity: 0.8; }
  16% { opacity: 1; }
  24% { opacity: 1; }
  25% { opacity: 0.7; }
  27% { opacity: 1; }
  83% { opacity: 1; }
  84% { opacity: 0.6; }
  85% { opacity: 1; }
  93% { opacity: 1; }
  94% { opacity: 0.7; }
  95% { opacity: 1; }
}

@keyframes moveToRight { 
  0% { left: 0px; filter: opacity(0) hue-rotate(207deg); }
  5% { filter: opacity(1) hue-rotate(207deg); }
  90% { filter: opacity(1) hue-rotate(207deg); }
  100% { left: 80%; filter: opacity(0) hue-rotate(207deg); }
}

@keyframes moveToLeft { 
  0% { right: 0px; filter: opacity(0) hue-rotate(207deg); }
  5% { filter: opacity(1) hue-rotate(207deg); }
  90% { filter: opacity(1) hue-rotate(207deg); }
  100% { right: 80%; filter: opacity(0) hue-rotate(207deg); }
}

.slide-enter-active, .slide-leave-active { transition: 0.75s ease-out; }

.slide-enter-to { position: absolute; right: 0px; }

.slide-enter-from { position: absolute; right: -100%; }

.slide-leave-to { position: absolute; left: -100%; }

.slide-leave-from { position: absolute; left: 0px; }

.scale-enter-active, .scale-leave-active { transition: 0.5s; }

.scale-enter-from, .scale-leave-to { opacity: 0; transform: scale(0.9); }

.scale-slide-enter-active { position: absolute; top: 0px; width: 100vw; transition: 0.85s; }

.scale-slide-leave-active { position: absolute; top: 0px; transition: 0.85s; }

.scale-slide-enter-from { left: 90%; transition: 0.85s; }

.scale-slide-enter-to { transition: 0.85s; left: 0%; }

.scale-slide-leave-from { transform: scale(1); }

.scale-slide-leave-to { transform: scale(0.8); }

.fade-enter-active, .fade-leave-active { position: absolute; width: 100%; transition: opacity 0.5s; }

.fade-enter, .fade-leave-to { opacity: 0; }

.fade-up-enter-active, .fade-up-leave-active { position: relative; top: 0px; width: 100%; transition: 0.5s; }

.fade-up-enter-active { position: absolute; transform: translateY(1em); }

.fade-up-enter-to { transform: translateY(0px); }

.fade-up-enter, .fade-up-leave-to { opacity: 0; }

.login-container-main { background-image: var(--bg_login_default); height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; }

.register-container-main { background-image: var(--bg_register_default); height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; }

.member-container-main { background-image: var(--bg_member_default_new) !important; height: 100% !important; background-position: center center !important; background-repeat: no-repeat !important; background-size: cover !important; }

#main-nav .navbar-nav .nav-item.btn-card::before { background-image: url("/g_assets/img/icon/mini_card.svg"); }

#main-nav .navbar-nav .nav-item.btn-trade::before { background-image: url("/g_assets/img/icon/mini_trade.svg"); }

#memberPopup .modal-content img { width: 100%; height: auto; object-fit: contain; }

@media only screen and (min-device-height: 481px) and (max-device-height: 650px) {
  .deposit-container > .mt-3.text-center { margin-top: 0px !important; }
  .text-danger.px-2.lh-1.py-1.text-center { line-height: 1; }
  .deposit-container .bank-deposit-item .bank-item-container { padding-top: 2px !important; padding-bottom: 2px !important; }
  .bank-detail > .member_primary_text_color { line-height: 0.9 !important; }
  .deposit-container .bank-deposit-item .bank-info .bank-icon img { height: 30px !important; width: 30px !important; }
  .btn-copy-bank > [data-bankcode] { margin: 0px !important; }
  .register-container.sub-page.sub-footer.vhm-100 { overflow-y: scroll !important; }
  #block-register {overflow-y: scroll;padding-top: 0em;padding-bottom: 0em !important;}
}

.flag-group-translate { height: 3.5em; }

.flag-group-translate-wrapper { display: flex; justify-content: center; align-items: center; box-sizing: border-box; }

.btn-flag-translate { height: 2.4em; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 3em; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; position: relative; width: 2.4em !important; padding: 0px !important; }

.btn-flag-translate > img { object-fit: contain; width: 100%; height: auto; }

.btn-flag-current { position: relative; z-index: 10; display: flex; }

.btn-flag-all { display: flex; width: fit-content; justify-content: center; opacity: 0.4; z-index: 5; }

.btn-flag-all.in-modal { opacity: 1; }

.btn-flag-all > .btn-flag-translate { position: relative; margin-left: -20px; }

.btn-flag-all.in-modal > .btn-flag-translate { margin-left: 2px; }

.btn-flag-all > .btn-flag-translate:nth-child(1) { z-index: 90; }

.btn-flag-all > .btn-flag-translate:nth-child(2) { z-index: 89; }

.btn-flag-all > .btn-flag-translate:nth-child(3) { z-index: 87; }

.btn-flag-all > .btn-flag-translate:nth-child(4) { z-index: 86; }

.btn-flag-all > .btn-flag-translate:nth-child(5) { z-index: 85; }

.btn-flag-all > .btn-flag-translate:nth-child(6) { z-index: 84; }

#modalChangeLang .modal-content { background: rgb(78, 78, 78); max-width: 20em; }

#modalChangeLang .modal-header { background: rgb(33, 33, 33); }

#modalChangeLang .modal-dialog { display: flex; justify-content: center; }

.change-lang-ui { position: fixed; right: 0.75em; top: 0.5em; z-index: 2000; }

@media only screen and (max-width: 600px) {
}

.custom-swal-title-promptpay-withdraw { font-size: 1.4em !important; }

.custom-swal-image-promptpay-withdraw { width: 150px; height: 70px; object-fit: contain; margin: -1.5em auto 0.2em !important; }

.custom-swal-outer-withdraw-promptpay { }

.custom-swal-modal-withdraw-promptpay.swal2-show.swal2-modal.swal2-popup { border-top-left-radius: 1em; border-top-right-radius: 1em; padding: 0px !important; background: rgb(255, 255, 255) !important; }

.custom-swal-header-withdraw-promptpay { height: 0px !important; overflow: hidden !important; }

.custom-swal-content-withdraw-promptpay { padding: 0px !important; }

.header-top-modal-withdraw-promptpay { display: flex; background: rgb(17, 53, 102); justify-content: center; align-items: center; padding: 1em 0px; border-top-left-radius: 0.4em; border-top-right-radius: 0.4em; margin-top: -1px; }

.pp-ic-modal-withdraw-promptpay { height: 80px; object-fit: contain; }

.top-title-modal-withdraw-promptpay { color: rgb(255, 255, 255); display: flex; flex-direction: column; justify-content: center; align-items: center; line-height: 1; }

.custom-swal-title-withdraw-promptpay { }

.custom-swal-body-withdraw-promptpay { background: rgb(255, 255, 255); border-top-left-radius: 0.6em; border-top-right-radius: 0.6em; }

.custom-swal-btn-confirm-withdraw-promptpay { flex: 1 1 0%; }

.custom-swal-btn-cancel-withdraw-promptpay { flex: 1 1 0%; background-color: rgb(85, 85, 85) !important; }

.custom-title-modal-withdraw-promptpay { color: rgb(28, 28, 28); font-size: 1.25em; padding-top: 1em; }

.custom-subtitle-modal-withdraw-promptpay { }

.custom-input-modal-withdraw-promptpay { padding: 0px 1em; height: 40px; box-shadow: rgba(0, 0, 0, 0.15) 1px 3px 3px 0px inset; width: 95% !important; color: rgb(28, 28, 28) !important; margin-top: 0.65em !important; }

.swal2-validation-message { width: 100%; margin: 0px auto !important; }

.deposit-bank-user-info { max-width: 360px; }

.deposit-bank-user-info .acount-number { width: 100%; overflow-wrap: break-word; }