@media (max-width: 375px) {

    .game-hover .game-provider img {
        width: 25px !important;
    }

    .game-hover .game-play {
        font-size: 12px !important;
    }

}

@media (max-width: 576px) {
    .header-level-bottom .progress {
        width: 55%;
    }

    .header-level-number {
        width: 45%; 
    }

    .game-name {
        font-size: 10px;
    }

    .game-hover .game-provider img {
        width: 35px;
    }

    .game-hover .game-play {
        font-size: 15px;
    }
}

@media (min-width: 320px) {
    /* slot game  */
    .game-wrapper .row .col {
        width: 33.33%;
    }
}

@media (min-width: 576px) {
    .container-fluid{
        max-width: 800px;
    }
}

@media (min-width: 768px) {
    /* welcome bonus */
    .welcome-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .welcome-bonus {
        margin-bottom: 0;
    }
    .welcome-bonus, .free-spin {
        width: calc(50% - 8px);
        flex: 0 0 auto;
    }

    /* modal */
    #modal-signin .modal-dialog {
        max-width: 480px;
    }

    /* referral */
    .referral-qr {
        width: 70%;
        margin: 0 auto;
    }

    /* news */
    .news-card-inner {
        display: flex;
        justify-content: center;
        border-radius: 20px;
    }
    .news-card-inner .news-content {
        margin-left: 25px;
        margin-top: 0px;
        width: 75%;
    }
    .news-card .img-wrapper {
        width: 250px;
        height: auto;
        border-radius: 15px;
    }
}

@media (min-width: 992px) {
    /* welcome bonus */
    .welcome-bonus-title {
        width: 50%;
    }
    
    /* slot game  */
    .game-wrapper .row .col {
        width: 20%;
    }
}

@media (min-width: 1200px) {
    body {
        font-size: 16px;
    }
    body.modal-open {
        overflow: inherit !important;
    }

    /* slot game  */
    .game-wrapper .row .col {
        width: 20%;
        padding: 0 12px;
    }
    .game-img {
        margin-top: -32px;
        border-radius: 20px;
    }
    .single-game{
        padding: 0 15px;
        border-radius: 20px;
    }
    .banner .swiper-pagination-outer {
        text-align: center;
        position: absolute;
        bottom: 10px;
        width: 100%;
        display: block;
    }
    .container-fluid{
        max-width: 100%;
    }
}

@media (min-width: 1200px) {
    .content-member .login-wrapper{
        margin: 0px auto 50px auto;
    }

    /* app download */
    .app-download, .download-bar {
        display: none;
    }

    /* header */
    .header {
        border-bottom: 1px solid #FFFFFF1a;
    }
    .header-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 80px;
        padding: 0 12px;
        margin: 0 auto;
    }
    .header-top { 
        justify-content: flex-start;
        border-bottom: 0;
        padding: 0;
        margin: 0;
        height: inherit;
    }
    .header-top .logo {
        text-align: center;
        width: 170px;
        margin: 0 auto;
    }
    .header-top .icon-nav,
    .header-top .icon-chatbox {
        display: none;
    }
    .chatbox-desktop {
        display: block;
        margin-left: 12px;
    }
    .chatbox-desktop .icon-chatbox {
        display: flex;
        cursor: pointer;
    }
    .language {
        display: block;
        cursor: pointer;
        margin-left: 64px;
    }
    .language .btn-language {
        border: 0;
        background-color: transparent;
        text-transform: uppercase;
        color: #FFFFFF;
        font-family: "Exo", sans-serif;
        width: 120px;
        height: 48px;
        position: relative;
        left: -10px;
    }
    .language .dropdown-toggle {
        display: flex;
        align-items: center;
    }
    .language .icon-wrapper {
        border-radius: 60px;
    }
    .language .icon-inner {
        border-radius: 60px;
    }    
    .language .dropdown-toggle::after {
        margin-left: 0;
        position: absolute;
        right: 16px;
        font-size: 12px;
        font-weight: 900;
        font-family: 'Font Awesome 5 Free';
        content: '\f0d7';
        border: 0;
        color: #ffffff;
        transition: all 0.3s;
    }
    .language .dropdown-toggle.show::after {
        transform: rotate(180deg);
    }
    .language .dropdown-menu {
        background: transparent linear-gradient(180deg, #201F2D 0%, #39324D 100%) 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 6px #0000008C;
        border: 1px solid #FFFFFF1A;
        border-radius: 10px;
        min-width: 120px;
    }
    .language .dropdown-menu .dropdown-item {
        color: #FFFFFF;
        text-transform: uppercase;
        text-align: center;
    }
    .language .dropdown-item:focus, 
    .language .dropdown-item:hover {
        background-color: transparent;
        color: #FBB62C;
    }
    .header-bottom {
        height: inherit;
    }
    .btn-signin,
    .btn-signup {
        width: 120px;
        font-size: 14px;
        height: 48px;
    }

    /* content */
    .content-center {
        padding: 20px 0 0;
    }
    .content-center .container-fluid {
        display: flex;
        flex-direction: row;
    }
    .content-left {
        width: 14%;
    }
    .content-center .content-right {
        position: sticky;
        top: 110px;
        right: calc(0% + 12px);
    }
    .content-middle {
        width: calc(70% - 80px);
        margin: 0 40px;
    }
    .content-right {
        width: 16%;
    }
    .content-right {
        display: block;
    }
    .banner-wrapper {
        display: flex;
        flex-direction: column;
    }   

    /* banner */
    .banner {
        order: 2;
        margin: 15px 0 0;
        border-radius: 25px;
    }
    .banner-mobile {
        display: none;
    }
    .banner-desktop {
        display: block;
    }
    .banner-desktop .swiper-banner, .banner-desktop img {
        border-radius: 25px;
    }
    .banner-desktop img {
        border: 1px solid #FFFFFF1A;
    }

    /* announcement */
    .announcement-content {
        height: 25px;
        padding: 0 12px 0 3px;
        font-size: 14px;
    }
    .announcement-left {
        font-weight: 600;
        padding: 2px 10px;
        width: 20px;
        height: 20px;
    }
    .announcement-right {
        padding-left: 10px;
        width: calc(100% - 43px);
    }

    /* mobile dropdown */
    .mobile-dropdown {
        display: none;
    }

    /* search */
    .search {
        background-color: transparent !important;
        padding: 0;
        margin-bottom: 15px;
        max-width: 280px;
    }
    .search .input-group {
        border-radius: 30px;
    }
    .search .input-group .input-group-text.btn-search {
        display: flex;
    }

    /* category */
    .category-wrapper {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        z-index: 1;
        flex-wrap: wrap;
    }
    .category {
        display: block;
        margin-bottom: 15px;
        flex-grow: 1;
        width: 100%;
    }
    .category ul > li > a .icon-menu .icon-text {
        font-size: 14px;
    }

    /* slot-menu */
    .slot-menu-wrapper {
        padding: 0;
        position: relative;
    }
    .slot-menu {
        margin-top: 28px;
        border: 1px solid #FFFFFF1A;
        border-radius: 30px;
        background-color: #1E1C2D;
        padding: 10px;
    }
    .slot-menu .swiper-slide {
        padding: 3px 0;
        flex-direction: column;
        background-color: transparent !important;
    }
    .slot-menu .swiper-slide.active {
        border-radius: 25px;
        filter: none;
    }
    .slot-menu .swiper-slide:hover {
        background: transparent linear-gradient(180deg, #278BFB 0%, #1069CC 100%) 0% 0% no-repeat padding-box;
        filter: none;
        border-radius: 25px;
    }
    .slot-menu-pic {
        margin-bottom: 6px;
    }
    .slot-menu-pic img {
        height: 43px;
    }
    .slot-menu-name {
        display: block;
        font-size: 12px;
    }
    .slot-menu .swiper-button-prev, .slot-menu .swiper-button-next {
        display: flex;
        z-index: 2;
    }
    .slot-menu .swiper-button-prev::after {
        font-size: 13px;
        line-height: 1;
        position: absolute;
        left: -32px;
        transition: all 0.3s;
        font-weight: 900;
        font-family: 'Font Awesome 5 Free';
        z-index: 1;
        content: '\f053';
    }
    .slot-menu .swiper-button-next::after {
        font-size: 13px;
        line-height: 1;
        position: absolute;
        right: -32px;
        transition: all 0.3s;
        font-weight: 900;
        font-family: 'Font Awesome 5 Free';
        z-index: 1;
        content: '\f054';
    }
    .slot-menu .swiper-button-next::after, .slot-menu .swiper-button-prev::after {
        font-size: 24px;
        color: #FFFFFF4D;
    }

    /* slot game  */
    .game-wrapper {
        margin: 0 -12px -16px;
    }

    /* live transaction */
    .transaction-wrapper {
        margin: 0;
    }
    .transaction-title {
        padding: 12px 20px;
        font-size: 18px;
    }
    .transaction-bottom {
        margin: 6px 0;
    }
    .transaction-bottom-left {
        width: 40%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .transaction-bottom-right {
        flex-direction: column;
        align-items: flex-end;
        width: 60%;
    }
    .transaction-time {
        margin-bottom: 2px;
    }
    .transaction-amount {
        width: 100%;
        text-align: right;
    }
    .welcome-wrapper {
        display: block;
    }
    .welcome-bonus {
        background: url(../images/promo.png), linear-gradient(to right,  #263b8b 0%,#298acf 100%);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: bottom right;
        border-radius: 20px;
        margin-bottom: 20px;
    }
    .welcome-bonus-title {
        width: 70%;
    }
    .free-spin {
        background: url(../images/free-spin.png), linear-gradient(to right,  #FF00C4 0%,#9A00FF 100%);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: bottom center;
        border-radius: 20px;
        width: 100%;
    }
    .free-spin-title {
        padding: 8px 16px;
    }
    .welcome-bonus, .free-spin {
        width: 100%;
    }
        
    /* menu */
    .menu-wrapper {
        border-radius: 20px;
        display: block;
        border: 1px solid #FFFFFF1A;
        position: inherit;
        width: 100%;
    }
    .menu-title {
        padding: 12px 20px;
        font-size: 18px;
    }
    .menu-group ul li {
        padding: 12px 16px;
    }
    .menu-group ul li a .icon-menu .icon-pic img {
        height: 30px;
    }
    .menu-group ul li a .icon-menu .icon-text {
        font-size: 16px;
        color: #A6B6C9;
    }
    .menu-group ul li a:hover .icon-menu .icon-text,
    .menu-group ul li a.active .icon-menu .icon-text {
        color: #FFFFFF;
    }
    /* menu */
    .contact ul li a img {
        height: 32px;
    }
    .side-link {
        display: none;
    }

    /* footer */
    footer {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .footer-title {
        font-size: 25px;
    }
    .social-logo {
        padding: 24px 0 32px;
    }
    .social-logo > ul > li {
        margin: 0 4px;
    }
    .social-logo > ul > li > a img {
        height: inherit;
    }
    .seo-inner {
        max-height: 280px;
        padding: 28px 32px;
    }
    .seo-inner::before {
        max-height: 100px;
        height: 100px;
    }
    .seo-title {
        font-size: 25px;
    }
    .seo-content {
        padding: 0 8px;
    }
    .lic-logo {
        padding: 32px 0;
    }
    .lic-logo > ul > li {
        margin-bottom: 0;
    }
    .lic-logo > ul > li img {
        height: inherit;
    }
    .footer-link {
        display: block;
        border-radius: 10px;
        background-color: #1F1C2E;
    }
    .footer-link > ul {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .footer-link > ul > li > a {
        color: #849EBC;
        display: inline-block;
        padding: 14px 32px;
    }
    .footer-link > ul > li > a:hover {
        color: #FFFFFF;
    }
    .copyright {
        font-size: 14px;
        border-radius: 0;
        background-color: transparent;
        padding: 16px 16px;
        margin-bottom: 0;
        border: 0;
    }

    /* button */
    .btn-main {
        height: 50px;
    }

    /* login */
    .login-form {
        padding: 16px 36px;
    }
    .login-form-title {
        font-size: 20px;
    }
    .input-group {
        height: 50px;
    }
    .no-account {
        font-size: 14px;
    }
    .btn-small-signup {
        padding: 6px 16px;
    }

    /* logged-in header */
    .header-deposit {
        min-width: 220px;
        margin-right: 12px;
    }
    .header-deposit, .header-profile {
        width: initial;
    }
    .header-profile {
        margin-left: 12px;
    }
    .header-profile-level {
        display: none;
    }
    .header-profile .dropdown-menu {
        top: 70px !important;
        right: -12px !important;
        left: initial !important;
        width: 280px;
    }
    .header-profile-desktop {
        background: transparent linear-gradient(180deg, #201F2D 0%, #39324D 100%) 0% 0% no-repeat padding-box;
        box-shadow: 0px 0px 6px #0000008C;
        border: 1px solid #FFFFFF1A;
        border-radius: 20px 20px 0px 0px;
        padding: 12px 20px 16px;
        display: block;
    }
    .header-profile-desktop .header-profile {
        margin-left: 0;
        width: 100%;
        justify-content: center;
    }
    .header-profile-desktop .header-profile .header-profile-icon {
        width: 55px;
        margin-right: 12px;
        cursor: inherit;
    }
    .header-profile-desktop .header-profile .header-profile-icon img {
        height: 55px;
    }
    .header-profile-desktop .header-profile-level {
        display: block;
        width: calc(100% - 67px);
    }
    .header-profile-desktop .header-profile-level .header-level-top {
        font-size: 14px;
    }
    .header-profile-desktop .header-profile-level .header-level-bottom .progress {
        width: 60%;
    }
    .header-level-number {
        width: 40%;
    }
    .header-profile .dropdown-menu .row {
        padding: 8px 20px;
    }
    .header-profile .dropdown-menu .row .col a .icon-menu {
        flex-direction: row;
    }
    .header-profile .dropdown-menu .row .col a .icon-menu .icon-pic {
        width: 20px;
        text-align: center;
        margin-right: 10px;
    }
    .header-profile .dropdown-menu .row .col a .icon-text {
        font-size: 14px;
    }
    .header-profile .dropdown-menu .row .col a:hover .icon-menu {
        color: #8AC1FF;
    }
    .header-profile .dropdown-menu .row-cols-3>* {
        width: 100%;
    }
    .header-profile .dropdown-menu .row .col {
        padding: 6px 0;
    }
    .header-profile-desktop .header-profile .dropdown-toggle::after {
        display: none;
    }
    .inbox-desktop {
        display: block;
        cursor: pointer;
        position: relative;
    }
    .inbox-desktop:hover .icon-inbox,
    .chatbox-desktop:hover .icon-chatbox {
        background: transparent linear-gradient(180deg, #278BFB 0%, #0655AE 100%) 0% 0% no-repeat padding-box;
    }
    .mail-number {
        width: 17px;
        height: 17px;
        border-radius: 50%;
        background-color: #FB3721;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: -8px;
        right: -4px;
        font-size: 10px;
    }
    .header-btn-level {
        background: transparent linear-gradient(180deg, #32B2DE 0%, #134081 100%) 0% 0% no-repeat padding-box;
        box-shadow: 0px 3px 6px #00000029;
        border: 1px solid #FFFFFF1A;
        border-radius: 30px;
        font-size: 12px;
        font-weight: 700;
        color: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        bottom: -6px;
        left: -14px;
        padding: 2px 10px;
    }
    .header-deposit-balance span {
        font-size: 10px;
    }
    .header-deposit-balance {
        font-size: 19px;
    }

    /* inbox */
    .title-page {
        font-size: 22px;
        margin-bottom: 20px;
    }
    .title-page img {
        height: 35px;
    }
    .inbox-wrapper {
        padding: 0;
    }
    .inbox-top {
        padding: 14px 20px;
        border-radius: 20px;
    }
    .inbox-top-text {
        font-size: 16px;
    }
    .inbox-balance-amount {
        font-size: 29px;
    }
    .inbox-top-balance .icon-plus {
        width: 29px;
        height: 29px;
        font-size: 18px;
    }
    .bonus-category {
        padding: 24px 0 0;
    }
    .bonus-category-title {
        text-align: left;
        font-size: 16px;
        margin-bottom: 48px;
    }
    .bonus-category-wrapper {
        padding: 0;
    }
    .bonus-category-wrapper .row {
        margin: 0 -10px;
    }
    .bonus-category-wrapper .row .col {
        width: 20%;
        padding:  0 10px;
        margin-bottom: 28px;
    }
    .bonus-category-single {
        border-radius: 20px;
    }
    .bonus-category-pic {
        margin-top: -48px;
    }
    .bonus-category-pic img {
        height: 65px;
    }
    .bonus-category-name {
        font-size: 14px;
    }
    .bonus-category-value {
        font-size: 20px;
    }
    .bonus-transaction {
        margin-bottom: 24px;
    }
    .bonus-transaction-head {
        padding: 16px 32px;
        text-align: left;
    }
    .bonus-transaction-body {
        padding: 24px 32px;
    }
    .bonus-transaction-note {
        font-size: 16px;
    }
    .bonus-transaction-mobile {
        display: none;
    }
    .bonus-transaction-desktop {
        display: block;
    }

    /* vip */
    .vip-wrapper {
        padding: 0 16px 32px;
        margin: 0 auto;
    }
    .vip-head { 
        display: flex;
        flex-direction: row;
    }
    .vip-top {
        width: 70%;
        margin-bottom: 0;
        margin-right: 24px;
        border-radius: 20px;
    }
    .vip-top-left {
        width: 160px;
        padding: 16px 32px 32px;
    }
    .vip-top-right {
        width: calc(100% - 160px);
        padding-right: 40px;
    }
    .vip-left-level img {
        height: 95px;
    }
    .vip-level-text {
        margin-top: 0;
    }
    .vip-detail {
        width: 30%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        border-radius: 20px;
        padding: 16px 32px;
    }
    .vip-detail-row {
        margin-bottom: 16px;
    }
    .vip-level {
        padding: 72px 0 16px;
    }

    /* referral */
    .referral-wrapper {
        padding: 0;
    }
    .referral-qr {
        flex-direction: row;
        justify-content: space-between;
        padding: 0 16px 32px;
        width: 65%;
    }
    .referral-qr-code {
        padding: 16px;
        border-radius: 20px;
    }
    .referral-qr-code > img {
        height: 117px;
    }
    .referral-share-text {
        font-size: 16px;
        text-align: left;
    }
    .referral-qr-share {
        width: calc(100% - 149px);
        padding-left: 32px;
        padding-right: 0;
    }
    .referral-share-link {
        padding: 10px;
    }
    .referral-link {
        padding: 13px 16px;
        border-radius: 10px;
        font-size: 16px;
        width: calc(100% - 190px);
    }
    .referral-btn {
        margin-left: 10px;
    }
    .btn-referral {
        width: 180px;
        font-size: 16px;
        padding: 13px 16px;
        border-radius: 10px;
    }
    .btn-referral:hover {
        background: transparent linear-gradient(0deg, #54A4FF 0%, #2589F8 7%, #116BCF 94%, #0D4C92 100%) 0% 0% no-repeat padding-box;
    }
    .referral-detail {
        padding: 24px 0;
        display: flex;
        flex-direction: row;
        margin: 0 -12px;
    }
    .referral-detail-single {
        flex: 1 0 0%;
        margin: 0 12px 0;
    }
    .referral-detail-top {
        font-size: 18px;
        padding: 10px 16px;
    }
    .statistic-single-top {
        font-size: 14px;
    }
    .btn-referral-detail {
        min-width: 170px;
    }
    .table-referral tr > th {
        font-size: 14px;
    }
    .table-referral tr > td {
        font-size: 14px;
    }

    /* news */
    .news-wrapper {
        padding: 0;
    }
    .news-card {
        margin-bottom: 24px;
    }

    /* review  */
    .review-wrapper {
        padding: 0;
    }
    .title-page {
        font-size: 22px;
    }
    .data-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 16px;
    }
    .level-status-wrapper {
        display: flex;
    }
    .level-status {
        margin-right: 20px;
    }
    .level-desc-row {
        margin-bottom: 20px;
        font-size: 16px;
    }
    .level-desc {
        margin-top: 0;
    }
    .chart2-wrapper {
        width: 500px !important;
        margin-right: 15px;
    }
    .ranking-wrapper {
        padding-right: 30px;
        width: 50%;
    }

    /* livestream */
    .live-wrapper {
        margin-bottom: -2px;
    }
    .live {
        width: 560px;
        height: 315px;
    }
    .live iframe {
        border-radius: 25px;
    }

    /* text logo */
    .logo-font .logo-text {
        font-size: 36px;
        justify-content: center;
    }

    /* promotion */ 
    .promotion-wrapper .category {
        margin: 0 0 28px;
        display: inline-flex;
    }
    .single-promotion {
        border-bottom: 0;
        margin: 0 0 24px;
    }
    .promotion-top {
        display: flex;
        align-items: center;
        border-radius: 20px;
        border-bottom: 1px solid #FFFFFF1A;
        position: relative;
    }
    .promotion-img-div {
        border-radius: 20px 0 0 20px;
    }
    .promotion-text-div {
        padding: 0 32px;
    }
    .promotion-link-div {
        display: flex;
        align-self: flex-end;
        position: absolute;
        right: 0;
    }
    .btn-info {
        border-radius: 20px 0px;
    }
    .promotion-head h2 {
        font-size: 32px;
    }
    .promotion-head p {
        font-size: 16px;
    }
    .promotion-col-div h3 {
        font-size: 16px;
    }
    .promotion-col-div p {
        font-size: 28px;
    }
    .btn-info {
        padding: 8px 16px;
        min-width: 135px;
    }
    .btn-info::after {
        font-size: 16px;
    }
    .promotion-more {
        padding: 0 32px;
    }
    .promotion-more-head {
        margin: 32px 0;
    }
    .promotion-more-head h2 {
        font-size: 26px;
    }
    .promotion-more-head p {
        font-size: 16px;
    }
    .table-main {
        font-size: 16px;
    }
    .table-main tr th, .table-main tr td {
        padding: 10px 16px;
    }

    /* content page */
    .content-page {
        margin: 0 0 22px;
    }
    .menu-page {
        margin-bottom: 24px;
    }
    .menu-page ul {
        overflow-x: inherit;
        padding: 16px 12px;
        display: inline-flex;
    }
    .menu-page ul li {
        margin: 0 16px;
    }
    .menu-page ul li a {
        font-size: 14px;
        padding: 10px 20px;
    }
    .menu-page ul li a.active,
    .menu-page ul li a:hover {
        background: transparent linear-gradient(180deg, #278BFB 0%, #0655AE 100%) 0% 0% no-repeat padding-box;
        color: #FFFFFF;
    }
    .content-info {
        padding: 32px 40px;
        font-size: 16px;
    }
    .info-title {
        font-size: 28px;
    }
    .table-info .table-responsive .table tr th, .table-info .table-responsive .table tr td {
        padding: 12px 20px;
    }

    /* member pages */
    .content-player {
        padding: 32px 40px;
        font-size: 14px;
    }
    .menu-member {
        margin-bottom: 20px;
    }
    .menu-member ul {
        overflow-x: inherit;
        padding: 10px;
    }
    .menu-member ul li {
        flex: 1 0 0%;
    }
    .menu-member ul li a {
        font-size: 14px;
        padding: 10px 20px;
        display: block;
        text-align: center;
        font-weight: 700;
    }
    .menu-member ul li a.active,
    .menu-member ul li a:hover {
        background: transparent linear-gradient(180deg, #278BFB 0%, #0655AE 100%) 0% 0% no-repeat padding-box;
        color: #FFFFFF;
    }
    .statement-mobile {
        display: none;
    }
    .statement-desktop {
        display: block;
    }
    .table-statement .table-statement-row:first-child {
        margin-top: -8px;
    }
    .menu-deposit-type ul {
        overflow-x: inherit;
    }
    .menu-deposit-type ul li {
        flex: 1 0 0%;
    }
    .menu-deposit-type ul li a {
        font-size: 14px;
        padding: 10px 20px;
        display: block;
        text-align: center;
        font-weight: 700;
    }
    .content-page.short {
        max-width: 776px;
        margin: 0 auto;
    }

    /* profile */
    .profile-top {
        flex-direction: row;
        margin-bottom: 28px;
    }
    .profile-top-left {
        background-color: #00000050;
        border-radius: 20px;
        padding: 20px;
        width: 160px;
        margin-right: 20px;
        margin-bottom: 0;
    }
    .profile-top-right {
        padding: 16px 28px;
        width: calc(100% - 180px);
    }
    .profile-top-text {
        font-size: 16px;
    }
    .btn-member-wrapper {
        margin: 8px 0;
    }
    .btn-member-wrapper .btn-deposit {
        display: inline-flex;
    }
    .btn-member-wrapper .btn-deposit .currency {
        font-size: 29px;
    }
    .btn-member-wrapper .btn-deposit .member-balance {
        font-size: 29px;
        margin: 0 16px;
        max-width: calc(100% - 122px);
    }
    .btn-member-wrapper .btn-deposit .icon-plus {
        width: 32px;
        height: 32px;
    }
    .profile-right-level .profile-level-wrapper .level-name {
        font-size: 16px;
    }
    .profile-right-more {
        font-size: 16px;
    }
    .profile-balance-bottom {
        margin-bottom: 28px;
    }
    .profile-balance-bottom .row {
        margin: 0 -12px;
    }
    .profile-balance-bottom .row .col {
        padding: 0 12px;
    }
    .profile-balance-bottom .row .col .profile-balance-single .profile-balance-title {
        font-size: 19px;
        padding: 8px 16px;
    }
    .profile-balance-bottom .row .col .profile-balance-single .profile-balance-value {
        font-size: 24px;
        padding: 12px 16px;
    }
    .form-label {
        font-size: 16px;
    }
    .content-player .btn-end {
        max-width: 400px;
        margin: 32px auto 0;
    }
    .content-player .btn-end .btn-main {
        font-size: 16px;
    }

    /* banking detail */
    .bank-wrapper .menu-deposit-type ul li a {
        padding: 10px 20px;
    }
    .form-select {
        background-color: #161226 !important;
        border-radius: 10px !important;
        padding: 12px;
    }
    .bank-bottom {
        font-size: 16px;
    }

    /* deposit */
    .menu-member.deposit-page {
        max-width: 620px;
        margin: 0 auto 20px;
    }
    .menu-member.deposit-page ul {
        padding: 8px 10px;
    }
    .menu-member.deposit-page ul li a {
        font-size: 16px;
    }
    .deposit-wrapper > .menu-deposit-type ul li a.active,
    .deposit-wrapper > .menu-deposit-type ul li a:hover {
        background: transparent linear-gradient(180deg, #278BFB 0%, #1069CC 100%) 0% 0% no-repeat padding-box;
    }
    .deposit-wrapper  >.menu-deposit-type ul li a .icon-menu .icon-pic img {
        height: 40px;
    }
    .deposit-wrapper > .menu-deposit-type ul li a .icon-menu .icon-text {
        font-size: 14px;
    }
    .payment-channel h5 {
        font-size: 16px;
    }
    .payment-channel .menu-deposit-type ul li {
        width: calc(25% - 10px);
    }
    .deposit-note {
        font-size: 14px;
        margin-bottom: 20px;
    }
    .accordion-deposit .accordion-header .accordion-button {
        padding: 16px;
        font-size: 16px;
    }
    .accordion-deposit .accordion-item,
    .accordion-deposit .accordion-item .accordion-collapse.collapse.show .accordion-body {
        font-size: 16px;
    }
    .accordion-deposit .form-check .form-check-input {
        width: 16px;
        height: 16px;
    }
}
@media (min-width: 1400px) {
    .category-wrapper {
        justify-content: space-between;
        z-index: 1;
        flex-wrap: nowrap;
    }
    .category {
        width:auto;
    }
    .search{
        margin-left: 20px;
    }
}
@media (min-width: 1824px) {
    .container-fluid {
        width: 94%;
        margin: 0 auto;
    }

    /* header */
    .header-top .logo,
    .header-top .logo-font {
        width: 220px;
    }
    .header-top .logo img {
        height: 64px;
    }

    /* category */
    .category ul > li > a {
        padding: 0 16px;
    }

    /* menu */
    .contact ul li a img {
        height: 40px;
    }

    /* slot game */
    .game-wrapper .row .col {
        width: 16.66%;
    }

}