@media only screen and (min-width: 2120px) {
  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .player-information-header {
    padding-right: 0 !important;
  }
}

@media only screen and (min-width: 1921px) {
  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content
    .casino_search-widget
    .new-skin-modal-container,
  #modernSkin .casino_search-widget .new-skin-modal-container {
    max-width: 1776px !important;
    margin-left: calc((((100% - 264px) - 1776px) / 2) + 264px) !important;
  }

  #app_footer .footer-container,
  #modernSkin.main-wrapper .layout-wrapper .scroll-wrap,
  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content
    .template-list-page,
  #provider-game-list-page-casino-group,
  #game-providers-page,
  #provider-game-list-page,
  .promo-page,
  .general-page-template {
    margin: 0 auto;
    max-width: 1776px;
  }

  #modernSkin.main-wrapper .layout-wrapper .content-wrapper #app_header {
    max-width: calc(((100% - 2040px) / 2) + 2040px);
  }

  #app_left_navigation.menu-nav.shrink ~ .content-wrapper #app_header {
    margin: 0;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content
    .body-wrapper {
    min-height: calc(100vh - 648px);
  }
}

@media only screen and (max-width: 1600px) {
  #modernSkin #app_header .hamburger-menu-button-container {
    padding-right: 0 !important;
  }

  .scroll-wrap .hero-links .hero-item {
    height: 220px;
  }

  .scroll-wrap .hero-links .hero-item a button,
  .scroll-wrap .ads .join-links .join-item a button,
  .promo-page .promo-items-grid .promo-item .promo-details a button {
    padding: 0 15px !important;
  }

  #modal-user-profile {
    z-index: 9999;
  }

  .nav-tab-system-horizontal .nav-tabs {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding-right: 42px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .grp-date-range {
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
    padding-right: 7.5px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .grp-status {
    -ms-flex: 0 0 40%;
    flex: 0 0 40%;
    max-width: 40%;
    padding-left: 7.5px;
  }

  .nav-tab-system-horizontal .row {
    height: 100%;
  }

  .nav-tab-system-horizontal .nav-tabs .nav-item {
    padding: 20px 0;
  }

  .nav-tab-system-horizontal .nav-tabs .nav-item a {
    padding: 20px 0;
  }

  .promo-page .promo-items-grid .promo-item .promo-details {
    top: 25%;
  }

  .promo-page .promo-items-grid .promo-item .promo-details h4 {
    font-size: 20px;
  }

  .category-page-content .vip-cards-section .vip-card {
    flex: 1 0 calc(25% - 30px);
    max-width: calc(25% - 30px);
  }

  .category-page-content .vip-cards-section .vip-card img.vector-bg {
    top: 50px;
  }

  .tournament-list-wrapper {
    & .tournament-list-container {
      & .tournament-list-column {
        flex: 0 0 100%;
      }
    }
  }

  .tournament-view-modal,
  .tournament-result-modal {
    z-index: 9999;

    .modal-dialog-centered {
      min-height: fit-content;
    }
  }

  .referral-page {
    .section-hero {
      margin-bottom: 0;

      .left-box {
        padding: 0 120px !important;
      }

      .right-box {
        margin-left: -120px;
        flex: 0 0 40%;
      }
    }

    .two-col:nth-child(2) {
      display: grid !important;
      grid-template-columns: repeat(1, 1fr);
      gap: 160px;
      padding: 80px 60px;
      margin: 0 0 40px 0;
    }

    .two-col {
      .left-col,
      .right-col {
        img {
          top: -88px !important;
          right: -8px !important;
          width: 50% !important;
        }
      }
    }
  }

  #modernSkin
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field {
    width: 230px !important;
  }
}

@media only screen and (max-width: 1400px) {
  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content
    #app_footer {
    padding: 30px 0 50px !important;
  }

  #app_footer .footer-container .top-footer {
    flex-direction: column;
  }

  #app_footer .footer-container .site-details {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 30px;
  }

  #app_footer .footer-container .quick-links {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  #app_footer .footer-container .subfooter {
    padding: 48px 0 0;
  }

  #modernSkin
    .content-wrapper
    .home-page-content
    .gamestage-wrapper-new-skin
    .game-info-wrapper
    .game-info-container
    .primary-details-wrapper
    .details-container {
    padding: 0 0 0 15px !important;
  }

  .category-page-content .vip-cards-section .vip-card {
    flex: 1 0 calc(25% - 30px);
    max-width: calc(25% - 30px);
  }

  .category-page-content .vip-cards-section .vip-card ul li h2 {
    font-size: 24px;
  }

  #modernSkin
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field {
    width: 230px !important;
  }

  .tab-content-main-content > .tab-pane.active {
    padding: 0 24px;
  }

  .nav-tab-system-vertical ul li {
    padding: 0 16px;
  }

  .promo-page {
    & .promo-article-banner {
      & .promo-article-hero {
        height: 300px;
      }
    }
  }

  .category-page-content.aboutus-page {
    & .card-box-section {
      &.grid3 {
        grid-template-columns: repeat(1, 1fr);
        grid-auto-rows: auto;
      }
    }
  }

  .left-align .casino_search-widget {
    display: none;
  }
}

@media only screen and (max-width: 1200px) {
  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container
    #brand-logo,
  #modernSkin.main-wrapper .layout-wrapper .header-section a.site-header-logo {
    max-width: 168px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    min-width: auto;
    padding: 0 12px 0 20px !important;
    flex: auto;
  }

  .player-information-header .right-align .menuw ul li a {
    padding: 0 8px !important;
  }

  .right-align .non-logged-in,
  .right-align .logged-in {
    display: none;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .close-left-nav {
    background: transparent !important;
    height: 24px;
    width: 24px;
    left: 20px !important;
    top: 22px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .close-left-nav:before {
    content: "";
    position: absolute;
    background-image: url(https://alpha-static.gpfront.com/DOSLJN/assets/logo/uni88-desktop-logo.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    width: 140px;
    height: 27px;
    left: calc(100% + 38px);
    top: -3px;
  }

  #modernSkin #app_left_navigation.menu-nav .close-left-nav i::before {
    content: "";
    background-image: url(https://alpha-static.gpfront.com/DOSLJN/assets/icons/hamburgerMenu.svg);
    background-size: contain;
    background-position: center;
    display: inline-block;
    height: 24px;
    width: 24px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content
    .scroll-wrapper.provider-list-page
    .game-providers
    .provider-list-item
    .provider-name {
    font-size: 10px !important;
  }

  .section-system-table {
    overflow-y: auto;
    padding-bottom: 10px;
  }

  .section-system-table .table-system {
    width: 100vw;
  }

  #casino-lobby-component .hero-container {
    height: 260px;
  }

  .game-lobby-renderer.tiles,
  .scroll-wrapper.provider-list-page .game-providers,
  .loader-container.tiles div {
    gap: 24px 16px !important;
  }

  .game-lobby-renderer.horizontal,
  #modernSkin .content-wrapper .home-page-content .game-provider-list {
    grid-auto-columns: calc(calc(100% - 112px) / 8) !important;
    gap: 0 16px !important;
  }

  .category-page-content {
    padding-top: 16px;
  }

  .promo-page .promoTabContent.active {
    gap: 16px;
  }

  .category-page-content .vip-cards-section {
    gap: 32px;
  }

  .category-page-content .vip-cards-section .vip-card {
    flex: 1 0 calc(33.3333% - 22px);
    max-width: calc(33.3333% - 22px);
  }

  .category-page-content .vip-cards-section .vip-card img.vector-bg {
    top: 20px;
  }

  #modernSkin.main-wrapper .layout-wrapper .header-section a.site-header-logo {
    width: fit-content;
    display: flex;
  }

  #app_left_navigation.menu-nav.shrink
    ~ .content-wrapper
    #app_header.main-header-container
    .player-information-header {
    padding-left: 24px !important;
  }

  #app_left_navigation.menu-nav.shrink
    ~ .content-wrapper
    #app_header.main-header-container
    .logo-container {
    margin-left: 0;
    padding: 0 !important;
    justify-content: start !important;
  }

  .nm-widget.notification-w {
    margin-left: 0 !important;
  }

  .nm-widget.bonus-badge-w button,
  .nm-widget.wallet-button-w button {
    padding: 0 8px !important;
  }

  #modernSkin
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field {
    width: 185px !important;
  }

  #modernSkin
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field
    button {
    font-size: 12px !important;
  }

  #modal-user-profile .modal-body .modal-wrapper .sidenav-system {
    flex: 1 1 210px;
    max-width: 210px;
  }

  #modal-user-profile .content-wrapper-system {
    flex: 0 0 calc(100% - 210px);
  }

  .nav-tab-system-vertical ul li {
    height: 48px;
  }

  .nav-tab-system-vertical ul li a {
    font-size: 14px;
  }

  .nav-tab-system-vertical ul li a i,
  .nm-widget.login-w .dropdown-user-profile > a > i {
    min-width: 24px;
    max-width: 24px;
    font-size: 20px;
    margin-right: 8px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .grp-balance
    .btn-balance-wrapper
    button
    i,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .grp-balance
    .btn-bonus-balance-wrapper
    button
    i {
    font-size: 20px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .btn-system-primary.btn-wallet-balance,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .btn-system-secondary.btn-bonus-balance {
    font-size: 14px !important;
    padding: 0 8px !important;
  }

  .tournament-view-modal,
  .tournament-result-modal {
    .modal-dialog-centered {
      margin-top: 70px;
    }
  }

  .tournament-view-wrapper {
    & .container-fluid {
      & .tournament-view-modern-wrapper {
        & .data-panel,
        & .leaderboard-panel {
          & .tournament-timer-detail-panel {
            & .tournament-prize-pool {
              & > div {
                width: 50%;
              }
            }
          }

          & .tournament-view-details {
            width: 50%;
          }

          & .tournament-previous-container {
            & .tournament-previous-panel {
              width: 50%;
            }
          }
        }
      }
    }
  }

  #modernSkin .content-wrapper {
    margin-left: 0;
  }

  .nm-widget.bonus-badge-w .badge-count-wrapper {
    right: -68px;
  }

  #modernSkin.main-wrapper .layout-wrapper .header-section a.regulations,
  #modernSkin.main-wrapper .layout-wrapper .header-section a.vip,
  #modernSkin.main-wrapper .layout-wrapper .header-section a.komp {
    padding: 0 8px !important;
  }

  .profile-bonus-currency:before,
  .profile-wallet-currency:before {
    font-size: 14px;
  }
}

@media only screen and (max-width: 1024px) {
  .profile-bonus-balance:before,
  .profile-wallet-balance:before {
    left: -7px;
  }
}

@media only screen and (max-width: 991px) {
  .scroll-wrap .main-hero .hero-item .hero-details h1 {
    font-size: 60px;
  }
  .profile-bonus-balance:before,
  .profile-wallet-balance:before {
    left: -8px;
  }

  .scroll-wrap .ads .join-links {
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 20px;
  }

  .scroll-wrap .ads .join-links .join-item {
    height: 300px;
    background-position: top;
  }

  .scroll-wrap .ads .join-table {
    grid-column: span 1;
  }

  #app_footer .footer-container .provider-container {
    flex-wrap: wrap;
    gap: 20px 0;
  }

  #app_footer .footer-container .provider-container .provider-item {
    width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .game-lobby-renderer.horizontal,
  #modernSkin .content-wrapper .home-page-content .game-provider-list,
  .loader-container.horizontal div {
    grid-auto-columns: calc(calc(100% - 80px) / 6) !important;
    gap: 0 16px !important;
  }

  .game-provider-wrapper .game-provider-list .game-provider-list-item span {
    font-size: 10px;
    line-height: normal;
    display: block;
  }

  .scroll-wrapper.provider-list-page .game-providers {
    grid-template-columns: repeat(6, 1fr) !important;
  }

  #modal-user-profile .modal-body .modal-wrapper .sidenav-system .grp-balance {
    padding: 15px 10px !important;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .sidenav-system
    .grp-balance
    .col-6 {
    padding: 0 0 2px 0;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .sidenav-system
    .grp-balance
    .col-6
    .btn-wallet-balance,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .sidenav-system
    .grp-balance
    .col-6
    .btn-bonus-balance {
    padding: 0 8px !important;
    text-align: center !important;
    font-size: 12px !important;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .sidenav-system
    .grp-balance
    .col-6
    .btn-wallet-balance
    i,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .sidenav-system
    .grp-balance
    .col-6
    .btn-bonus-balance
    i {
    margin-right: 5px;
  }

  #modal-user-profile .modal-body .modal-wrapper .sidenav-system {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }

  #modal-user-profile .content-wrapper-system {
    -ms-flex: 0 0 80%;
    flex: 0 0 80%;
    max-width: 80%;
  }

  .section-system-filter .col-md-5,
  .section-system-filter .col-md-7 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .report.casino-bet .wrapper-search,
  .report.sport-bet .wrapper-search {
    margin-left: 0;
    margin-top: 8px;
    padding-right: 7.5px;
  }

  .report.casino-bet .container-search,
  .report.sport-bet .container-search {
    margin-right: 0;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .grp-date-range,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .grp-status {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  #modal-user-profile .modal-body .modal-wrapper .tab-content-wrapper input,
  #modal-user-profile .modal-body .modal-wrapper .tab-content-wrapper .no-data {
    font-size: 14px;
    padding: 15px;
  }

  #modal-user-profile .modal-body .modal-wrapper .tab-content-wrapper .no-data {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .promo-page .promo-items-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .promo-page .promo-article-banner {
    padding-left: 30px;
  }

  .promo-page .promo-article-banner h6 {
    width: 50%;
  }

  .promo-page .promo-article-banner img {
    object-position: 85% center;
    filter: opacity(0.5);
  }

  .section-system-table .table-system {
    width: 130vw;
  }

  .referrals-tab .section-system-filter .referrals-tab-filters {
    gap: 15px !important;
  }

  .referrals-tab
    .section-system-filter
    .referrals-tab-filters
    .date-range-wrapper,
  .referrals-tab
    .section-system-filter
    .referrals-tab-filters
    .referrals-tab-search,
  .user-referral-commission-history-report
    .user-referral-filters
    .user-referral-search,
  .user-referral-commission-history-monthly .user-referral-filters .dropdown,
  .month-year-picker-datepicker {
    width: 50% !important;
  }

  .referrals-tab
    .section-system-filter
    .referrals-tab-filters
    .referrals-tab-search
    .referrals-tab-search-input,
  .user-referral-commission-history-report
    .user-referral-filters
    .user-referral-search
    .user-referral-search-input {
    width: 100% !important;
  }

  .user-referral-commission-history-monthly .user-referral-filters,
  .user-referral-commission-history-report .user-referral-filters {
    column-gap: 15px !important;
  }

  .month-year-picker-datepicker
    .month-year-picker-input-wrapper
    .month-year-picker-input {
    padding-left: 30px !important;
  }

  #app_footer .footer-container .quick-links {
    flex-wrap: wrap;
    gap: 32px 16px;
  }

  #app_footer .footer-container .quick-links .menu-column {
    flex: 0 0 50%;
    max-width: calc(50% - 8px);
  }

  #app_footer .footer-container .footer-logo {
    width: 160px;
  }

  .scroll-wrap .hero-links .hero-item {
    height: 140px;
  }

  .scroll-wrap .hero-links .hero-item .hero-links-details {
    padding: 8px 12px 24px;
  }

  .scroll-wrap .hero-links .hero-item .hero-links-details img {
    width: 48px;
    height: 32px;
  }

  .scroll-wrap .hero-links .hero-item a {
    padding-right: 16px;
    padding-bottom: 16px;
  }

  .scroll-wrap .hero-links .hero-item h3 {
    font-size: 20px;
  }

  .bottom-logos > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  .bottom-logos .bottom-logo-wrapper {
    flex: 1 1 20%;
    max-width: 25%;
    height: 70px;
  }

  .gamestage-wrapper-new-skin .game-info-wrapper .game-info-container {
    padding: 24px !important;
  }

  #modernSkin.main-wrapper .layout-wrapper .content-wrapper .home-page-content {
    padding: 20px 32px 0 !important;
  }

  .promo-page .promoTabLinks {
    padding: 0 16px !important;
  }

  .promo-page .promoTabContent.active {
    grid-template-columns: repeat(2, 1fr);
  }

  .category-page-content .vip-cards-section .vip-card img.badge-icon {
    width: 110px;
    height: 110px;
    margin-bottom: 8px;
  }

  .category-page-content .vip-cards-section .vip-card img.vector-bg {
    top: 40px;
  }

  .category-page-content .vip-cards-section .vip-card ul {
    margin-top: 32px;
  }

  .category-page-content .vip-cards-section .vip-card h3 {
    font-size: 20px;
  }

  .category-page-content .card-box-section {
    grid-template-columns: repeat(1, 1fr);
    grid-auto-rows: auto;
  }

  .category-page-content .section-box .tab button {
    padding: 8px 12px !important;
    font-size: 12px !important;
  }

  #modernSkin #app_header #brand-logo.desktop-logo {
    display: none;
  }

  #modernSkin #app_header #brand-logo.mobile-logo {
    display: inline !important;
  }

  body.logged-in #modernSkin #app_header #brand-logo.mobile-logo {
    width: auto !important;
    height: 40px !important;
  }

  body.logged-in
    #app_left_navigation.menu-nav.shrink
    ~ .content-wrapper
    #app_header.main-header-container
    .logo-container {
    min-width: auto;
    width: 135px;
  }

  body.logged-in
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    flex: 1 0 135px;
    max-width: fit-content;
    padding-left: 0px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .player-information-header {
    padding-left: 0 !important;
  }

  .nm-widget.bonus-badge-w button,
  .nm-widget.wallet-button-w button {
    font-size: 12px !important;
  }

  .nm-widget.notification-w {
    display: none;
  }

  #modal-user-profile .modal-body .modal-wrapper .sidenav-system .grp-account {
    padding: 16px 16px 0 !important;
    font-size: 14px;
  }

  .tab-content.tab-content-player-account-window {
    padding-top: 16px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .header
    p {
    font-size: 16px;
  }

  #modal-user-profile .modal-body .modal-wrapper .tab-content-wrapper .header {
    padding: 0 0 16px 0;
  }

  .section-system-main,
  .section-system-main-lg {
    padding: 12px 16px;
  }

  #modal-user-profile .modal-body:before {
    width: 130px;
    height: 25px;
    left: 12px;
  }

  .game-lobby-filter menu {
    transform: translateX(38%) !important;
  }

  .category-page-content .card-box-section .section-box .card-box-details p {
    padding: 0;
  }

  .tournament-view-wrapper {
    & .container-fluid {
      & .tournament-view-modern-wrapper {
        & .data-panel,
        & .leaderboard-panel {
          & .tournament-previous-container,
          & .tournament-view-games {
            & .tournament-previous-panel {
              width: 100%;
            }

            & .tournament-view-games-article {
              & .tournament-view-games-article-thumbnails {
                margin-bottom: 24px;
                display: grid;
                grid-template-columns: repeat(6, 1fr);
                gap: 16px;

                &.sports {
                  grid-template-columns: repeat(3, 1fr);
                }
              }
            }
          }
        }
      }
    }
  }

  .promo-page {
    & .promo-article-banner {
      & .promo-article-hero {
        height: 190px;
      }
    }
  }

  .category-page-content.vip-page {
    & .section-box:not(.card-box) {
      & p {
        max-width: 100%;
      }
    }
  }

  .category-page-content-header img.logo-header {
    height: 50px;
  }

  .category-page-content.sportsrules-page {
    & .category-page-content-header {
      & .sportsrules-header {
        & .sportsrules-logo {
          height: 45px !important;
          width: 45px !important;
        }

        & h1 {
          font-size: 32px !important;
        }
      }
    }

    & .info-accordion-wrapper {
      & .accordion {
        height: 64px;
      }
    }
  }

  .shrink {
    .referral-page {
      .section-hero {
        flex-direction: column;

        .left-box {
        }

        .right-box {
          margin: auto !important;
        }
      }

      .card-box-section {
        grid-template-columns: repeat(1, 1fr) !important;
      }

      .htu {
        .left-box,
        .right-box {
          padding: 0 8px !important;
          width: 100% !important;
        }
      }

      .two-col:nth-child(8) {
        flex-direction: column;

        margin: auto;

        .w-50 {
          width: 100% !important;
        }
      }

      #referral-promo-details {
        .w-50 {
          img {
            position: absolute;
            right: 10px;
            height: auto;
            width: 50%;
            bottom: 2px;
          }
        }
      }
    }
  }

  .scroll-wrap .hero-links {
    gap: 16px;
    /*remove line 1223 from current responsive css*/
    flex-wrap: wrap;
  }

  .scroll-wrap .hero-links .hero-item {
    flex: 48%;
  }

  #modal-user-profile .modal-dialog .modal-body img.user-profile-modal-logo {
    width: 140px;
    height: 32px;
    top: 16px;
    left: 8px;
  }

  body
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    flex: 1 0 74px !important;
    min-width: 74px;
    padding: 0 12px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container
    #brand-logo {
    max-width: 50px;
  }

  .nm-widget.bonus-badge-w .badge-count-wrapper {
    right: -50px;
  }

  #available_bonuses #available-bonuses-page .available-bonus-item,
  #active_bonuses #active-bonuses-page .active-bonus-item {
    margin-bottom: 24px !important;
  }

  .profile-bonus-currency:before,
  .profile-wallet-currency:before {
    font-size: 12px;
  }

  .profile-wallet-balance,
  .profile-bonus-balance {
    margin-left: -12px;
  }

  .wallet-button-currency:before,
  .bonus-badge-currency:before {
    font-size: 12px;
  }

  *[lang="ko"] .wallet-button-balance:before,
  *[lang="ko"] .bonus-badge-balance:before,
  *[lang="ko"] .profile-wallet-balance:before,
  *[lang="ko"] .profile-bonus-balance:before {
    left: -4px;
  }

  *[lang="ko"] .profile-wallet-balance,
  *[lang="ko"] .profile-bonus-balance,
  *[lang="ko"] .wallet-button-balance,
  *[lang="ko"] .bonus-badge-balance {
    margin-left: -8px;
  }

  #deposit #deposit-page .live-chat-buttons-deposit a:nth-of-type(1) {
    top: -372px;
    right: -32px;
  }

  #collapse-bank .card-body .form-group .dropdown-toggle {
    min-width: 100%;
  }

  .section-system-main.referrals-tab-link {
    margin-bottom: 20px !important;
  }
}

@media only screen and (max-width: 768px) {
  .nm-widget.login-w .desktop {
    display: inline-block !important;
  }

  .nm-widget.login-w .mobile {
    display: none !important;
  }

  #modal-user-profile .modal-body .modal-wrapper .wallet-action-container {
    display: flex;
    gap: 0 20px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .wallet-action-container
    .btn-system-primary {
    min-width: calc(50% - 10px);
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .wallet-action-container
    .btn-system-secondary {
    min-width: calc(50% - 10px);
    margin-right: 0;
  }

  .section-system-mobile {
    margin: 0 15px;
  }

  .tab-content.tab-content-player-account-window {
    padding-bottom: 100px;
  }

  #modal-user-profile .modal-body .modal-wrapper .mobile-header {
    background: var(--bg-side-nav);
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item {
    background: linear-gradient(
      168deg,
      #223a1f 1.62%,
      #0b170c 95.72%
    ) !important;
    mix-blend-mode: plus-lighter;
    border-radius: var(--border-radius-10) !important;
    padding: 15px;
    margin: 12px 0;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item:hover {
    border-color: var(--color-primary);
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item
    .transaction-header {
    color: var(--color-white);
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item
    .transaction-header
    .grp-main-info,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item
    .transaction-header
    .grp-sub-info {
    padding: 0;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item
    .transaction-header
    .grp-foot-info {
    padding: 10px 0 0;
    border-color: var(--bg-separator);
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item
    .transaction-header
    .grp-main-info
    .transaction-amt,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-content
    ul
    li
    span:nth-child(2),
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-item
    .transaction-header
    .grp-foot-info
    .foot-value {
    color: var(--color-secondary);
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-content.show {
    visibility: visible;
    color: var(--color-white);
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-content
    ul
    li {
    padding: 10px 0 0;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .transaction-history-mobile
    .transaction-content
    ul
    li.last-sub-item {
    border-color: var(--bg-separator);
  }

  .daterangepicker {
    width: fit-content;
  }

  .daterangepicker.show-ranges.ltr .drp-calendar.left {
    padding: 8px;
  }

  .daterangepicker .drp-buttons {
    display: flex !important;
    justify-content: space-between;
  }

  .daterangepicker .drp-buttons .btn {
    margin-left: 0 !important;
  }

  .nav-tab-system-horizontal.tab-header {
    display: flex;
  }

  .tournament-view-wrapper {
    margin-left: 0;
    margin-right: 0;
  }

  #modernSkin
    .dropdown-menu.dropdown-user-profile
    .dropdown-item:first-child:after {
    left: calc(50% - 24px);
    transform: translateX(-50%);
  }
}

@media only screen and (max-width: 767px) {
  #modernSkin #app_header {
    background: transparent;
  }

  .profile-bonus-balance:before,
  .profile-wallet-balance:before {
    left: -6px !important;
  }

  *[lang="en"] .wallet-button-balance:before,
  *[lang="en"] .bonus-badge-balance:before {
    left: -6px;
  }

  *[lang="en"] .profile-bonus-balance:before,
  *[lang="en"] .profile-wallet-balance:before {
    left: -2px !important;
  }

  *[lang="ko"] .wallet-button-balance:before,
  *[lang="ko"] .bonus-badge-balance:before,
  *[lang="ko"] .profile-wallet-balance:before,
  *[lang="ko"] .profile-bonus-balance:before {
    left: -8px;
  }

  .profile-bonus-balance:before,
  .profile-wallet-balance:before {
    left: -8px;
  }

  #modernSkin.main-wrapper .layout-wrapper .header-section a.site-header-logo {
    width: 150px;
  }

  #modernSkin.main-wrapper .layout-wrapper .content-wrapper:before {
    content: "";
    position: fixed;
    width: 100%;
    height: 65px;
    top: 0;
    left: 0;
    background: #223a1f;
    z-index: 2;
    pointer-events: none;
  }

  body.logged-in
    #modernSkin.main-wrapper
    .layout-wrapper
    .header-section
    a.site-header-logo {
    width: fit-content;
  }

  #modernSkin #app_header #brand-logo.mobile-logo {
    height: auto !important;
    width: 100% !important;
  }

  body.logged-in #modernSkin #app_header #brand-logo.mobile-logo {
    height: 50px !important;
    width: auto !important;
  }

  .nm-widget.notification-w .notification-bell {
    height: 40px;
    width: 40px;
  }

  .nm-widget.login-w .login,
  .nm-widget.register-w .btn-join {
    padding: 0 10px !important;
    font-size: 14px !important;
  }

  #modernSkin.main-wrapper .layout-wrapper #app_left_navigation.shrink {
    width: 280px !important;
    z-index: 99997;
  }

  .modal-backdrop.show {
    z-index: 99998;
  }

  #modal-user-profile {
    z-index: 99999;
  }

  #app_left_navigation.shrink section .product-menu {
    background: var(--bg-side-nav-header-section) !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .side-menu {
    padding: 26px 20px 20px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .side-menu
    ul
    .nav-item
    a,
  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a:hover {
    padding: 0 0 0 42px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a#showIntercomChat {
    background-color: var(--bg-side-nav-header-section) !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a:hover {
    background: var(--bg-side-nav-header-active) !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a:hover
    span {
    position: relative;
    margin-left: 0;
    padding: 0;
    padding-left: 8px;
    left: auto;
    height: auto;
    background: transparent !important;
    color: var(--color-side-nav-active);
  }

  #app_left_navigation.menu-nav.shrink .header-section {
    padding: 22px 20px 4px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .side-menu
    ul
    .nav-item
    a
    i {
    margin: 0 0 0 -35px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    .menu-container
    .nav-item
    a
    span {
    color: var(--color-text);
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    .menu-container
    .nav-item
    a.active
    span {
    color: var(--color-side-nav-active);
  }

  #app_left_navigation.shrink .nm-widget.language-w .language-public .language {
    width: 100%;
    border-radius: var(--border-radius-20);
    display: flex;
    align-items: center;
    padding: 0 12px;
    height: 44px;
    justify-content: start;
    margin-left: 0;
    gap: 8px;
    font-size: 16px !important;
    color: #fff !important;
  }

  #app_left_navigation.shrink
    .nm-widget.language-w
    .language-public
    .language
    img,
  #app_left_navigation.shrink
    .nm-widget.language-w
    .language-public
    .language-option
    > a
    > img {
    max-height: 32px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    .sticky-bottom {
    padding: 20px;
    position: absolute;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a#showIntercomChat,
  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a#showIntercomChat:hover {
    background-color: var(--bg-side-nav-header-section) !important;
    padding: 0 0 0 60px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a#showIntercomChat
    i {
    margin: 0 0 0 -39px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a#showIntercomChat
    i::after {
    top: -7.5px;
    left: -7.5px;
    height: 35px;
    width: 35px;
  }

  #app_left_navigation.shrink section .side-menu .sticky-bottom .social-links {
    flex-direction: row;
    margin-top: 30px !important;
  }

  #app_left_navigation.shrink
    .nm-widget.language-w
    .language-public
    .language-option
    > a {
    font-size: 14px !important;
    min-width: 200px;
    padding: 10px 20px !important;
    justify-content: start;
    align-items: center;
  }

  #app_left_navigation.shrink
    .nm-widget.language-w
    .language-public
    .language-option
    > a
    > img {
    margin-right: 8px;
  }

  #modernSkin #app_mobile_navigation {
    background: var(--bg-side-nav);
    z-index: 1000;
  }

  #modernSkin #app_mobile_navigation .mobile-menu ul li#menu {
    flex-direction: column;
    position: relative;
  }

  #modernSkin
    #app_mobile_navigation
    .mobile-menu
    ul
    li
    .hamburger-menu-button-container {
    padding: 0 !important;
    min-width: 45px;
    height: 44px;
    z-index: 2;
    position: relative;
  }

  #modernSkin #app_mobile_navigation #menu #toggle-sidenav {
    width: 100%;
    display: flex;
    height: 100%;
    justify-content: center;
  }

  #modernSkin #app_mobile_navigation #menu #toggle-sidenav img {
    display: none;
  }

  #modernSkin #app_mobile_navigation #menu #toggle-sidenav:before {
    content: "";
    background-image: url(https://alpha-static.gpfront.com/DOSLJN/assets/icons/hamburgerMenu.svg);
    background-size: contain;
    background-position: center;
    display: inline-block;
    height: 20px;
    width: 20px;
  }

  #modernSkin #app_mobile_navigation #menu span {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 16px;
    color: var(--color-text);
    bottom: 2px;
    width: max-content;
  }

  #modernSkin
    #app_mobile_navigation
    .mobile-menu
    ul
    li
    a[data-link-router-push] {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--color-text);
    font-size: 16px;
  }

  #modernSkin
    #app_mobile_navigation
    .mobile-menu
    ul
    li
    a[data-link-router-push]
    img {
    max-width: 24px;
  }

  #modernSkin.main-wrapper .layout-wrapper .content-wrapper .home-page-content {
    padding: 20px 16px 0 !important;
    margin-top: 65px;
    height: fit-content !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper.isOnSportsPage
    .home-page-content {
    padding: 0 !important;
  }

  .scroll-wrap .main-hero {
    margin-bottom: 16px;
  }

  .scroll-wrap .hero-links {
    gap: 0 16px;
  }

  .scroll-wrap .hero-links .hero-item {
    height: 124px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content
    #app_footer {
    padding: 30px 0 100px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper.isOnSportsPage
    .home-page-content
    #app_footer
    .footer-container {
    padding: 0 20px;
  }

  #app_footer .footer-container .site-details p {
    max-width: 100%;
  }

  #app_footer .footer-container .quick-links {
    flex-wrap: wrap;
    gap: 30px 0;
  }

  .game-lobby-renderer.horizontal,
  #modernSkin .content-wrapper .home-page-content .game-provider-list,
  .loader-container.horizontal div {
    grid-auto-columns: calc(calc(100% - 48px) / 4) !important;
  }

  .scroll-wrapper.provider-list-page .game-providers {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  #modernSkin
    .layout-wrapper
    .content-wrapper
    .home-page-content
    .gamestage-wrapper-new-skin
    .game-info-wrapper
    .game-info-container
    .primary-details-wrapper
    .thumbnail-container
    .details-meta {
    font-family: var(--font-family);
  }

  .gamestage-wrapper-new-skin .game-info-wrapper .game-info-container {
    padding: 20px !important;
  }

  #modal-user-profile .modal-body .modal-wrapper .mobile-header .btn-back {
    color: var(--color-secondary);
  }

  #modal-user-profile .modal-body .modal-wrapper .mobile-header .header {
    font-size: 16px;
    color: var(--color-white);
  }

  #modal-user-profile .modal-body .modal-wrapper .grp-balance {
    gap: 10px 0;
  }

  #modal-user-profile .modal-body .modal-wrapper .grp-balance .btn-balance {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 0 15px;
    align-items: center;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .grp-balance
    .btn-balance:hover {
    background: var(--button-primary-bg);
  }

  #modal-user-profile .modal-body .modal-wrapper .btn-system-secondary {
    background: var(--button-secondary-bg) !important;
  }

  #modal-user-profile .content-wrapper-system {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .nav-tab-system-horizontal .nav-tabs {
    padding-right: 0;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper.history-tab
    .transaction-subtab-container
    button {
    padding: 0 !important;
  }

  .promo-page .promo-items-grid {
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 20px 0;
  }

  .promo-page .promo-items-grid .promo-item .promo-details {
    top: 30%;
  }

  .report.casino-bet .container-search,
  .report.sport-bet .container-search {
    margin-right: 0;
  }

  .template-body-wrapper {
    flex-direction: column;
  }

  .article-menu-wrapper {
    display: none;
  }

  .article-mobile-menu-dropdown {
    display: inline-block !important;
  }

  .article-mobile-menu-dropdown .dropdown-toggle {
    margin-bottom: 20px;
    background: var(--button-secondary-bg);
    box-shadow: var(--button-secondary-box-shadow);
    padding: 0 15px !important;
    border: 0;
    height: 40px;
    min-width: 150px;
    border-radius: var(--border-radius-10);
    text-align: left;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px !important;
  }

  #modernSkin .article-mobile-menu-dropdown .dropdown-menu {
    background-color: var(--bg-side-nav-header-section) !important;
    min-width: 200px;
  }

  #modernSkin .article-mobile-menu-dropdown .dropdown-menu a {
    background-color: transparent;
  }

  #modernSkin .article-mobile-menu-dropdown .dropdown-menu a.active {
    color: var(--color-secondary) !important;
  }

  .promo-page .promo-article-banner {
    padding: 0 20px;
  }

  .promo-page .promo-article-banner h6 {
    width: 100%;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content.shrink
    .casino_search-widget
    .new-skin-modal-container {
    transform: none !important;
  }

  .section-system-footer {
    margin-right: 0;
  }

  #modernSkin
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field {
    width: 48px !important;
  }

  #modernSkin
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field
    i {
    right: 8px;
  }

  #modernSkin
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field
    button {
    font-size: 0 !important;
  }

  .category-page-content-header h2 {
    font-size: 24px;
  }

  .category-page-content-header img {
    width: 32px;
    height: 32px;
  }

  .category-page-content .section-box {
    margin: 32px 0 24px;
  }

  .category-page-content .section-box h4 {
    font-size: 20px;
  }

  .category-page-content .vip-cards-section {
    gap: 32px;
  }

  .category-page-content .vip-cards-section .vip-card {
    flex: 1 0 calc(50% - 16px);
    max-width: calc(50% - 16px);
  }

  .category-page-content .vip-cards-section .vip-card ul {
    z-index: 1;
  }

  #modernSkin .casino_search-widget .new-skin-modal-container {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    padding: 24px 16px !important;
  }

  .main-wrapper .layout-wrapper .header-section,
  .main-wrapper .layout-wrapper .header-section:before {
    width: 100% !important;
    left: 0;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    flex: 1 0 174px !important;
    min-width: 174px;
    padding: 0 12px !important;
  }

  body.logged-in
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container,
  body
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    flex: 1 0 74px !important;
    min-width: 74px;
    padding: 0 12px !important;
  }

  .tournament-list-wrapper {
    & .tournament-list-container {
      & .tournament-list-column {
        & .tournament-list-item {
          & .tournament-item-detail-panel {
            flex-direction: column;
            padding: 24px;

            & .tournament-panel-data {
              order: 2;
              width: 100%;
            }

            & .tournament-panel-leaderboard {
              order: 1;
              width: 100%;
            }
          }
        }
      }
    }
  }

  .tournament-view-wrapper {
    & .container-fluid {
      & .tournament-view-modern-wrapper {
        & .banner-title-panel {
          height: 350px;
          padding: 0 16px;

          & .tournament-name {
            font-size: 24px;
            text-align: center;
          }
        }

        & .data-panel,
        & .leaderboard-panel {
          & .tournament-timer-detail-panel {
            & .tournament-prize-pool {
              & > div {
                width: 100%;
              }
            }
          }

          & .tournament-view-details {
            width: 100%;
          }

          & .tournament-view-games {
            & .tournament-view-games-article {
              & .tournament-view-games-article-thumbnails {
                grid-template-columns: repeat(4, 1fr);
                gap: 16px;

                &.sports {
                  grid-template-columns: repeat(2, 1fr);
                }
              }
            }
          }
        }
      }
    }
  }

  .promo-page {
    & .promo-article-banner {
      margin-bottom: 16px;

      & .promo-article-hero {
        height: 164px;
      }
    }
  }

  .category-page-content.sportsrules-page {
    & .category-page-content-header {
      flex-direction: column;
      gap: 24px;
    }
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    .menu-container
    .scroll-section
    .accordion-container
    button
    span,
  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    .menu-container
    .scroll-section
    .accordion-container
    button
    img {
    display: block;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    .menu-container
    .accordion-container
    button:hover
    span {
    left: auto;
    margin-left: 8px;
    padding-right: 0;
    padding-left: 0;
    position: static;
    width: auto;
    background: none !important;
    border-radius: 0;
    height: auto !important;
    padding-top: 0 !important;
    display: block !important;
    align-items: normal;
  }

  #modernSkin #app_mobile_navigation .mobile-menu ul li#menu img {
    height: 24px;
    width: 24px;
  }

  #modernSkin #app_mobile_navigation .mobile-menu ul#mobile-menu-items {
    padding: 0 32px 0 15px;
  }

  .mobile-menu #mobile-menu-items li .menu:before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%) scale(1);
    top: -25px;
    width: 88px;
    height: 20px;
    transition: all 0.3s ease;
    background: var(
      --BG-Gradient,
      linear-gradient(180deg, #39ad4a 1.62%, rgb(0, 54, 3) 95.72%)
    ) !important;
    clip-path: polygon(50% 20%, 0% 100%, 100% 100%);
  }

  .mobile-menu #mobile-menu-items li .menu {
    position: absolute;
    height: 100%;
    width: 90px;
  }

  .mobile-menu #mobile-menu-items .menu-toggler {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0;
    cursor: pointer;
  }

  #modernSkin #app_mobile_navigation .mobile-menu #menu .menu ul li {
    position: absolute !important;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: fit-content !important;
    height: auto;
    opacity: 0;
    transition: 0.2s ease-in-out;
    text-wrap: nowrap;
  }

  #modernSkin #app_mobile_navigation .mobile-menu ul li {
    font-size: 14px;
  }

  #modernSkin #app_mobile_navigation .mobile-menu ul li {
    list-style-type: none;
    color: rgba(180, 180, 180, 0.87);
    font-size: 20px;
    display: flex;
    align-items: center;
  }

  .form-register .form-group .mobile-area-code {
    top: 36px;
  }

  .modal .modal-dialog .modal-content {
    padding: 32px 24px !important;
  }

  .mobile-menu #mobile-menu-items li .menu.active:after {
    transform: scale3d(15.5, 6.5, 1);
    transition-timing-function: cubic-bezier(0.68, 1.55, 0.265, 1);
    opacity: 1;
  }

  .mobile-menu #mobile-menu-items li .menu:after {
    display: block;
    content: " ";
    width: 3.5em;
    height: 3.5em;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 20px;
    z-index: -2;
    background: var(--bg-side-nav);
    transition: all 0.3s ease;
    opacity: 0;
  }

  .mobile-menu #mobile-menu-items li .menu.active:before {
    opacity: 0;
  }

  .mobile-menu #mobile-menu-items .menu-toggler:checked ~ ul .menu-item {
    opacity: 1 !important;
    left: 50% !important;
  }

  .mobile-menu
    #mobile-menu-items
    .menu-toggler:checked
    ~ ul
    .menu-item:nth-child(1) {
    transform: rotate(0deg) translate(calc(-168px - 50%), -60px);
  }

  .mobile-menu
    #mobile-menu-items
    .menu-toggler:checked
    ~ ul
    .menu-item:nth-child(2) {
    transform: rotate(0) translate(-50%, -88px);
  }

  .mobile-menu
    #mobile-menu-items
    .menu-toggler:checked
    ~ ul
    .menu-item:last-child {
    transform: rotate(0) translate(calc(168px - 50%), -80px);
  }

  #modernSkin #app_mobile_navigation .mobile-menu #menu ul li a {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-self: center;
    filter: drop-shadow(0px 0px 6px #000);
    gap: 4px;
  }

  #modernSkin #app_mobile_navigation .mobile-menu ul li {
    font-size: 14px;
  }

  .mobile-menu #mobile-menu-items .menu .menu-item a::before {
    content: "";
    width: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    height: 24px;
  }

  .mobile-menu #mobile-menu-items .menu .menu-item a.menu-item-bt1:before {
    background-image: url(https://alpha-static.gpfront.com/DOSLJN/assets/icons/side-nav/BT1Sports.svg);
  }

  .mobile-menu #mobile-menu-items .menu .menu-item a.menu-item-digitain:before {
    background-image: url(https://alpha-static.gpfront.com/DOSLJN/assets/icons/side-nav/DigitainSports.svg);
  }

  .mobile-menu
    #mobile-menu-items
    .menu
    .menu-item
    a.menu-item-digitain-esports:before {
    background-image: url(https://sgp1.digitaloceanspaces.com/alpha-static/DOSLJN/assets/icons/side-nav/digitain-esports.svg);
  }

  .mobile-menu
    #mobile-menu-items
    .menu
    .menu-item
    a.menu-item-pinnacle-esports:before {
    background-image: url(https://alpha-static.gpfront.com/DOSLJN/assets/icons/side-nav/PinnacleESports.svg);
  }

  .mobile-menu #mobile-menu-items .menu .menu-item a.menu-item-pinnacle:before {
    background-image: url(https://alpha-static.gpfront.com/DOSLJN/assets/icons/side-nav/PinnacleSports.svg);
  }

  #page_content_modern .sports-wrap {
    width: calc(100% + 32px);
    left: -16px;
    top: -20px;
  }

  .referral-page {
    .section-hero {
      flex-direction: column;

      .right-box {
        margin-left: 0px !important;
      }
    }

    .two-col:nth-child(2) {
      padding-top: 200px;

      .left-col,
      .right-col {
        .details-container,
        .button-container {
          width: 100% !important;
        }

        img {
          top: -185px !important;
          right: 50% !important;
          transform: translateX(50%);
        }
      }
    }

    .two-col:nth-child(3) {
      img {
        display: none;
      }

      .commission-paid-wrapper {
        flex: 100%;
      }
    }

    .card-box-section {
      grid-template-columns: repeat(1, 1fr) !important;
    }

    .htu {
      .left-box,
      .right-box {
        padding: 0 8px !important;
        width: 100% !important;
      }
    }

    .two-col:nth-child(8) {
      flex-direction: column;
      margin: auto;

      .w-50 {
        width: 100% !important;
      }
    }

    #referral-promo-details {
      .left-section {
        width: 100% !important;
      }

      .w-50 {
        display: none;
      }
    }
  }

  .sports-wrap .btisw iframe {
    min-height: calc(100dvh - 125px) !important;
  }

  header .subheader-menu,
  .player-information-header .right-align .menuw,
  .player-information-header .left-align .casino_search-widget,
  .player-information-header .right-align #language-w {
    display: none !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav.shrink {
    display: flex !important;
    background: var(--bg-body);
  }

  .main-wrapper .layout-wrapper .header-section {
    padding: 0 8px;
  }

  #before-provider-game-list-casino-group
    .w-providers-container
    .w-providers-list-display
    .w-providers-list-expand
    button {
    padding: 0 8px !important;
  }

  .w-providers-container
    .w-providers-list-display.expandable
    .w-providers-list-expand {
    display: flex !important;
    align-items: center;
    max-height: 44px;
  }

  #modal-user-profile .modal-dialog .modal-body img.user-profile-modal-logo {
    width: 160px;
    height: 32px;
    top: 16px;
    left: 8px;
  }

  #vip-progress {
    .section-system-main.referral-link {
      .col-12 {
        .row.p-1 {
          display: flex;
          flex-direction: column;

          .col-2 {
            margin: auto;
            display: flex;
            justify-content: center;
            padding-right: 0;
            align-items: center;
          }

          .col-10 {
            flex: 0 0 100%;
            max-width: 100%;
          }
        }
      }
    }
  }

  #provider-game-list-page .template-list-page #before-provider-game-list {
    margin-bottom: -8px;
    padding-top: 8px;
  }

  #provider-game-list-page
    .template-list-page
    #before-provider-game-list
    .casino_search-widget
    .modal-trigger-wrapper
    .search-button-field {
    width: 185px !important;
  }

  #w-providers-list-widget-container .w-providers-list-display.expanded ul {
    gap: 8px;
  }

  #w-providers-list-widget-container .w-providers-list-display.expanded ul li {
    padding: 8px !important;
    gap: 6px;
  }

  #w-providers-list-widget-container
    .w-providers-list-display.expanded
    ul
    li
    .w-provider-item-details {
    gap: 4px;
  }

  .rules-wrapper {
    flex-direction: column;
  }

  .rules-wrapper .category-page-content-menu .menuw {
    display: none;
  }

  .category-page-content.sportsrules-page {
    width: 100% !important;
  }

  .rules-dropdown {
    position: relative;
    display: inline-block !important;

    button {
      background: var(--bg-section);
      padding: 8px 16px !important;
      border: none;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
    }

    button:hover {
      background: var(--button-primary-bg);
    }

    #rulesDrop {
      display: none;
      position: absolute;
      background: var(--bg-side-nav-header-section);
      min-width: 160px;
      overflow: auto;
      box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
      z-index: 1;
      left: 0;
      top: 37px;
      border-radius: 4px;

      a {
        color: rgba(255, 255, 255, 0.6);
        padding: 12px 16px;
        text-decoration: none;
        display: block;
      }

      a:hover {
        background-color: var(--button-primary-bg);
        color: #fff;
      }
    }

    #rulesDrop.show {
      display: block;
    }
  }

  .category-page-content.sportsrules-page {
    & .category-page-content-header {
      & .sportsrules-header {
        & .sportsrules-logo {
          height: 60px !important;
          width: 60px !important;
        }

        & h1 {
          font-size: 40px !important;
        }
      }
    }

    & .info-accordion-wrapper {
      & .accordion {
        height: 64px;
      }
    }
  }

  .sportsrules-page .category-page-content-header {
    gap: 24px;
    margin-bottom: 8px;
  }

  #vip-progress .section-system-main.referral-link .col-12 .row,
  #vip-progress
    .section-system-main.referral-link
    .col-12
    .komp-next-tier-progress {
    margin: 0 !important;
    padding: 4px !important;
  }

  #vip-progress .section-system-main.referral-link {
    padding: 8px 0px !important;
  }

  #vip-progress .section-system-main.referral-link .col-12 .row .col-10,
  #vip-progress
    .section-system-main.referral-link
    .col-12
    .row
    .col-10
    .row
    .col-6,
  #vip-progress
    .section-system-main.referral-link
    .col-12
    .komp-next-tier-progress
    .row
    .col-6 {
    padding: 0 !important;
  }

  #modernSkin.main-wrapper .layout-wrapper .header-section a.komp,
  #modernSkin.main-wrapper .layout-wrapper .header-section a.vip {
    /* display: none; */
  }

  #login-w .dropdown .dropdown-menu {
    width: fit-content;
  }

  .available-bonuses-tab
    .available-bonus-item
    .description-section-wrapper
    .name-wrapper
    span:before,
  .available-bonuses-tab
    .available-bonus-item
    .description-section-wrapper
    .name-wrapper
    span
    i:before {
    color: #fff;
  }

  .sports-wrap .sports-fullscreen {
    display: flex !important;
    justify-content: center;
    align-items: center;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .grp-balance
    .btn-bonus-balance-wrapper,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .grp-balance
    .btn-balance-wrapper {
    flex-direction: 0 0 50%;
    max-width: 50%;
    padding: 2px 0;
  }

  #wallet
    .player-account-window-wallet
    .col-12
    .nav-tab-system-horizontal
    > .col-12 {
    position: fixed;
    background: var(--bg-section);
    z-index: 1;
  }

  #notification-page
    #notification-container
    .table-notification-form
    table
    tbody
    tr
    .notification-body
    button.btn-notificaton-body {
    padding: 4px 8px !important;
    height: auto;
  }

  #deposit #deposit-page .live-chat-buttons-deposit,
  #withdraw #withdraw-page .live-chat-buttons-withdrawal {
    position: fixed;
    margin-top: -16px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    right: -4px;
    left: unset;
  }

  #deposit #deposit-page .live-chat-buttons-deposit a,
  #withdraw #withdraw-page .live-chat-buttons-withdrawal a {
    width: 32px;
  }

  #deposit #deposit-page .live-chat-buttons-deposit a:nth-of-type(2),
  #withdraw #withdraw-page .live-chat-buttons-withdrawal a:nth-of-type(3) {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: -22px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .header-section
    a.regulations:nth-child(3) {
    display: none;
  }

  .left-align {
    padding-left: 4px;
    gap: 8px;
  }

  .left-align img {
    height: 32px;
    width: 32px;
  }

  .sports-wrap .btisw iframe {
    min-height: calc(100dvh - 85px) !important;
  }

  #deposit #deposit-page .live-chat-buttons-deposit a,
  #withdraw #withdraw-page .live-chat-buttons-withdrawal a {
    position: absolute;
    right: 0 !important;
  }

  #deposit #deposit-page .live-chat-buttons-deposit a:nth-of-type(2) {
    top: -212px;
  }

  #withdraw #withdraw-page .live-chat-buttons-withdrawal a:nth-of-type(1) {
    top: 0px;
  }

  #withdraw #withdraw-page .live-chat-buttons-withdrawal a:nth-of-type(3) {
    top: 160px;
  }

  .grp-change-password,
  .grp-edit-profile {
    padding: 0 0 56px;
  }

  #collapse-bank .card-body .form-group .dropdown-toggle {
    min-width: 100%;
  }

  .sports-wrap
    #digitain-sportsbook-game-frame-digitainsports-wkprop
    sport-mobile,
  .sports-wrap
    #digitain-e-sports-game-frame-digitainsports-wkprop
    sport-esport-view {
    height: calc(100dvh - 65px) !important;
    overflow: auto;
  }

  .focused
    .sports-wrap
    #digitain-sportsbook-game-frame-digitainsports-wkprop
    sport-mobile,
  .focused
    .sports-wrap
    #digitain-e-sports-game-frame-digitainsports-wkprop
    sport-esport-view {
    height: calc(100dvh - 125px) !important;
    overflow: auto;
  }

  .sports-wrap .btisw iframe {
    height: calc(100dvh - 35px) !important;
    overflow: auto;
  }

  .focused .sports-wrap .btisw iframe {
    height: calc(100dvh - 95px) !important;
    height: calc(100dvh - 35px) !important;
    overflow: auto;
  }

  .user-referral-commission-history
    .user-referral-commission-history-daily
    .user-referral-filters {
    flex-direction: column;
    gap: 4px;
  }

  #modernSkin .layout-wrapper .content-wrapper .scrollY {
    overflow-y: unset;
    overflow-x: unset;
  }
}

@media only screen and (max-width: 720px) {
  .promotion-popup-container {
    width: calc(100vw - 16px) !important;
    height: calc(100dvh - 86px) !important;
    align-items: center;

    .promotion-item-card {
      .promotion-card {
        background-color: var(--bg-app-left-nav) !important;

        .promotion-card-content {
          img {
            max-height: calc(100dvh - 214px);
          }
        }
      }
    }
  }

  .deposit-transactions-history-classic
    .table-responsive
    .table-system
    thead
    tr
    th,
  .deposit-transactions-history-classic
    .table-responsive
    .table-system
    tbody
    tr
    td,
  .withdrawal-transactions-history-classic
    .table-responsive
    .table-system
    tbody
    tr
    td,
  .withdrawal-transactions-history-classic
    .table-responsive
    .table-system
    tbody
    tr
    th {
    text-wrap: nowrap;
  }
}

@media only screen and (max-width: 575px) {
  .nm-widget.login-w .btn-user-profile.dropdown-toggle:after {
    display: none;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .side-menu
    .scroll-section {
    max-height: calc(100vh - 100px);
    overflow: auto;
    margin-bottom: 72px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .side-menu {
    padding: 15px 20px 20px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.menu-nav
    section
    .side-menu
    ul
    .nav-item
    a,
  #modernSkin.main-wrapper
    .layout-wrapper
    #app_left_navigation.shrink
    section
    .side-menu
    ul
    .nav-item
    a:hover {
    position: relative;
    padding: 0 0 0 45px !important;
  }

  #modernSkin #app_mobile_navigation {
    height: 55px;
  }

  #modernSkin #app_mobile_navigation .mobile-menu ul {
    padding: 0 15px;
  }

  #modernSkin
    #app_mobile_navigation
    .mobile-menu
    ul
    li
    a[data-link-router-push] {
    font-size: 14px;
    bottom: 2px;
  }

  #modernSkin #app_mobile_navigation #menu span {
    font-size: 14px;
  }

  #modernSkin.main-wrapper .layout-wrapper .content-wrapper .home-page-content {
    padding: 20px 15px 0 !important;
  }

  .scroll-wrap .hero-links .hero-item,
  .scroll-wrap .ads .join-links .join-item {
    height: 250px;
  }

  .scroll-wrap .ads .join-table {
    grid-column: span 2;
  }

  .joinbet-about {
    margin-top: 30px;
    padding: 20px;
  }

  #app_footer .footer-container .quick-links .menu-column {
    width: 50%;
  }

  #app_footer .footer-container .menu-column h6 {
    margin-bottom: 15px;
  }

  #app_footer .footer-container ul .nav-item:not(:last-child) {
    margin-bottom: 5px;
  }

  #app_footer .footer-container .provider-container {
    padding: 20px 0;
  }

  #app_footer .footer-container .provider-container .provider-item {
    width: 50%;
  }

  #app_footer .footer-container .subfooter {
    margin-top: 30px;
  }

  #casino-lobby-component .tab-navigation .tab {
    height: 30px;
    padding: 0 7px !important;
    margin-right: 7px;
    font-size: 13px !important;
  }

  .game-lobby-renderer.horizontal,
  #modernSkin .content-wrapper .home-page-content .game-provider-list,
  .loader-container.horizontal div {
    gap: 0 8px !important;
    grid-auto-columns: calc(calc(100% - 16px) / 3) !important;
  }

  .game-lobby-renderer.tiles,
  .scroll-wrapper.provider-list-page .game-providers,
  .loader-container.tiles div {
    gap: 12px 8px !important;
    grid-template-columns: repeat(3, 1fr) !important;
  }

  .template-page-header-container .template-page-header h5,
  .promo-page-header-container .promo-page-header h5,
  .casino_favorites-widget .header-container h5 {
    font-size: 18px !important;
  }

  .nm-widget .game-lobby-load-more-container {
    margin-top: 20px;
  }

  #modal-user-profile .content-wrapper-system {
    padding-bottom: 30px;
  }

  #modal-user-profile .modal-body .modal-wrapper .grp-balance .btn-balance {
    height: 40px;
  }

  .section-system-filter {
    padding: 0 5px 20px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .grp-date-range,
  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .grp-status {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding-right: 10px;
    padding-left: 10px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .grp-date-range {
    margin-bottom: 10px;
  }

  .date-range-wrapper i.fa-calendar-alt {
    font-size: 18px;
    left: 16px;
  }

  #notification-page #notification-container,
  #notification-page #notification-message {
    margin-top: 10px;
  }

  #notification-page #notification-container .btn-notification,
  .grp-edit-profile .grp-actions {
    display: flex;
    gap: 0 10px;
  }

  #notification-page .mark-all-btn,
  #notification-page .delete-all-btn {
    width: 50%;
    margin: 0 !important;
  }

  #notification-page .mark-all-btn button,
  #notification-page .delete-all-btn button,
  .grp-edit-profile .grp-actions button {
    height: 40px !important;
    padding: 0 5px !important;
    width: 100%;
    border-radius: var(--border-radius-10) !important;
    margin: 0 !important;
  }

  .report.casino-bet .container-search,
  .report.sport-bet .container-search {
    margin-bottom: 20px;
  }

  .grp-edit-profile .grp-actions {
    padding: 0;
  }

  .grp-edit-profile .section-system {
    margin: 10px 0 20px;
    padding: 0;
  }

  .article-content-wrapper {
    padding: 20px 15px;
  }

  .section-system-main,
  .section-system-main-lg {
    margin: 0 0 20px;
    padding: 20px 15px;
  }

  #modal-user-profile .modal-body .modal-wrapper .wallet-action-container {
    gap: 0 10px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .wallet-action-container
    .btn-system-primary {
    min-width: calc(50% - 5px);
    border-radius: var(--border-radius-10);
    height: 40px;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .wallet-action-container
    .btn-system-secondary {
    min-width: calc(50% - 5px);
    border-radius: var(--border-radius-10);
    height: 40px;
  }

  .promo-page .promo-article-banner,
  #casino-lobby-component .hero-container {
    height: 230px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper.isOnSportsPage
    .home-page-content
    #app_footer
    .footer-container {
    padding: 0 15px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content
    .casino_search-widget
    .new-skin-modal-container,
  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    .home-page-content.shrink
    .casino_search-widget
    .new-skin-modal-container {
    margin-left: 0 !important;
    width: 100% !important;
    margin-top: 65px !important;
  }

  .gamestage-wrapper-new-skin
    .gamestage-wrapper
    .gamestage-container
    .gamestage-center-info-container
    .gamestage-play-button-container
    button {
    padding: 0 10px !important;
    font-size: 14px !important;
  }

  #casino-lobby-component .hero-container img {
    object-position: 56% center;
  }

  #chat-widget-container {
    bottom: 55px !important;
  }

  .report.casino-bet {
    margin-top: 0;
  }

  .report.casino-bet .wrapper-search,
  .report.sport-bet .wrapper-search {
    padding-right: 0;
  }

  .section-system-main.referrals-tab-link {
    padding: 15px;
  }

  .referrals-tab .referrals-tab-link .referrals-tab-link-label {
    padding: 0 !important;
  }

  .referrals-tab
    .section-system-filter
    .referrals-tab-filters
    .date-range-wrapper,
  .referrals-tab
    .section-system-filter
    .referrals-tab-filters
    .referrals-tab-search,
  .user-referral-commission-history-report
    .user-referral-filters
    .user-referral-search,
  .user-referral-commission-history-monthly .user-referral-filters .dropdown,
  .month-year-picker-datepicker {
    width: 100% !important;
  }

  .referrals-tab .section-system-filter .referrals-tab-filters,
  .user-referral-commission-history-monthly .user-referral-filters,
  .user-referral-commission-history-report .user-referral-filters {
    flex-direction: column;
    gap: 10px !important;
  }

  .user-referral-commission-history-monthly .user-referral-filters,
  .user-referral-commission-history-report .user-referral-filters {
    margin: 20px 0 !important;
  }

  .section-system-table {
    margin: 10px 5px;
  }

  .user-referral-commission-history .user-referral-commission-history-tabs {
    margin-top: 20px !important;
  }

  .nm-widget.language-w .language-public .language img {
    margin-right: 0;
  }

  .nm-widget.language-w .language-public .language.dropdown-toggle:after {
    display: none;
  }

  body.logged-in #modernSkin #app_header #brand-logo.mobile-logo {
    height: 40px !important;
  }

  .nm-widget.wallet-button-w button,
  .nm-widget.bonus-badge-w button {
    font-size: 11px !important;
  }

  .scroll-wrap .hero-links {
    flex-flow: column;
    gap: 16px;
  }

  .bottom-logos > div {
    gap: 8px;
  }

  .bottom-logos .bottom-logo-wrapper {
    flex: 1 1 30%;
    max-width: 33.33%;
    height: 50px;
  }

  body.logged-in
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container,
  body
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    flex: 1 0 64px !important;
    min-width: 64px;
  }

  .promo-page .promoTabContent.active {
    gap: 8px;
  }

  .category-page-content .card-box-section .section-box {
    padding: 16px;
    gap: 16px;
    flex-direction: column;
  }

  .category-page-content .card-box-section .section-box .card-box-details {
    margin: -44px 0 12px 0;
  }

  .category-page-content .card-box-section .section-box .card-box-details h6 {
    margin: 0px 0 12px 56px;
  }

  .category-page-content .card-box-section .section-box img {
    height: 48px;
    width: 48px;
  }

  .tournament-view-modal,
  .tournament-result-modal {
    & .modal-dialog-centered {
      & .modal-content {
        padding: 24px !important;

        & .modal-body {
          padding: 16px;

          & .tournament-preview-container {
            & .title {
              font-size: 20px;
            }
          }
        }
      }
    }
  }

  .promo-page {
    & .promo-article-banner {
      height: fit-content;
      padding: 0;

      & .promo-article-hero {
        height: 300px;
      }
    }

    & .promo-article-body {
      padding: 0 16px;

      & h4 {
        line-height: 100%;
        margin-bottom: 16px;
      }

      & h5 {
        line-height: 120%;
      }

      & ul {
        text-align: left;

        & li:not(:last-child) {
          margin-bottom: 16px;
        }
      }
    }
  }

  .category-page-content {
    & .section-box {
      padding: 24px 16px;

      & ul {
        text-align: left !important;

        & li:not(:last-child) {
          margin-bottom: 16px;
        }
      }
    }
  }

  .category-page-content .section-box .tab,
  .komp-page .kompTabContent .komptab-desc {
    width: calc(100% + 28px);
    margin-left: -14px;
  }

  .category-page-content .para-divider {
    padding: 8px 0;
  }

  .category-page-content.sportsrules-page {
    & .info-accordion-wrapper {
      & .accordion {
        padding: 0 16px !important;
        font-size: 16px !important;
        height: 56px;

        & .carret-corner {
          height: 20px;
        }
      }

      & .panel {
        &.shown {
          padding: 16px;
        }
      }
    }
  }

  #page_content_modern .sports-wrap {
    width: calc(100% + 30px);
    left: -15px;
  }

  #modal-user-profile .modal-body:before {
    background-image: url(https://wnkstg.sgp1.cdn.digitaloceanspaces.com/DOSLJN/assets/logo/uni88-mobile-logo.png);
  }

  #modal-user-profile .modal-body:before {
    width: 40px;
    height: 40px;
    left: 12px;
  }

  .tab-content-main-content > .tab-pane.active {
    padding: 0 24px 40px;
  }

  .referral-page {
    .section-hero {
      .left-box {
        padding: 0 40px !important;
      }

      .right-box {
      }
    }

    .two-col:nth-child(2) {
      .left-col,
      .right-col {
        padding-top: 72px;

        .button-container {
          a {
            button {
              padding: 0 8px !important;
            }
          }
        }

        img {
          width: 100% !important;
        }
      }
    }

    .two-col:nth-child(3) {
      .commission-paid-wrapper {
        .commission-paid-progress {
          .commission-paid-details {
            h6,
            h2 {
              font-size: 12px !important;
            }
          }
        }
      }
    }

    .htu {
      .left-box {
        width: 100% !important;
      }
    }

    .two-col:nth-child(8) {
      .commision-conditions {
        padding: 0 !important;

        table {
          tbody {
            tr {
              td {
                padding: 0 8px !important;
                font-size: 14px !important;
              }
            }
          }
        }
      }
    }
  }

  .referral-page .card-box-section .section-box img {
    width: 60px !important;
    height: 60px !important;
  }

  .scroll-wrap .hero-links .hero-item.sports .hero-sports-wrapper {
    opacity: 0;
  }

  .scroll-wrap .hero-links .hero-item.sports .hero-sports-details {
    opacity: 1;
  }

  .scroll-wrap .hero-links .hero-item {
    flex: auto;
  }

  #modal-user-profile
    .modal-body
    .modal-wrapper
    .tab-content-wrapper
    .btn-system-amount {
    margin-right: 4px;
  }

  .tab-content.tab-content-player-account-window {
    padding-bottom: 120px;
  }

  .promo-page .promo-article-banner .promo-article-hero.mobile {
    display: block !important;
  }

  .promo-page .promo-article-banner .promo-article-hero {
    display: none;
  }

  section.galow {
    .game-lobby-slider-container {
      left: auto !important;
      right: 0;
    }
  }

  #modernSkin
    .content-wrapper
    .home-page-content
    .gamestage-wrapper-new-skin
    .game-info-wrapper
    .game-info-container
    .primary-details-wrapper
    .details-container {
    padding: 0 !important;
  }

  body.logged-in #app_header .player-information-header .header-wallets {
    flex-direction: column;
    margin-right: 8px;
  }

  body.logged-in
    #app_header
    .player-information-header
    .header-wallets
    div
    button {
    height: 24px;
    max-width: 124px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  *[lang="ko"]
    body.logged-in
    #app_header
    .player-information-header
    .header-wallets
    div
    button {
    max-width: 156px;
  }

  *[lang="th"]
    body.logged-in
    #app_header
    .player-information-header
    .header-wallets
    div
    button {
    max-width: 115px;
  }

  body.logged-in #app_header .player-information-header .header-wallets div,
  body.logged-in
    #app_header
    .player-information-header
    .header-wallets
    div
    button {
    width: 100% !important;
  }

  #bonus-popup .modal-content {
    padding: 24px 12px !important;
  }

  #bonus-popup .modal-content .modal-body {
    padding: 0px 0 24px;
  }

  #bonus-popup .modal-content .modal-body .bonus-list-wrapper {
    padding-right: 8px;
    padding-left: 12px;
  }

  #bonus-popup
    .modal-content
    .modal-body
    .bonus-list-wrapper
    .bonus-details
    .col-1
    .row
    .col-12 {
    padding-left: 12px;
  }

  #bonus-popup
    .modal-content
    .modal-body
    .bonus-list-wrapper
    .bonus-details
    .col-1
    .row
    .col-12
    span {
    font-size: 22px;
  }

  #bonus-popup
    .modal-content
    .modal-body
    .bonus-list-wrapper
    .btn-action-wrapper {
    margin-top: 12px;
  }

  #bonus-popup
    .modal-content
    .modal-body
    .bonus-list-wrapper
    .btn-action-wrapper
    .claim {
    padding: 8px !important;
  }

  .category-page-content.sportsrules-page {
    & .category-page-content-header {
      margin-bottom: 8px !important;
      gap: 24px !important;

      & .sportsrules-header {
        & .sportsrules-logo {
          height: 60px !important;
          width: 60px !important;
        }

        & h1 {
          font-size: 24px !important;
        }
      }
    }

    & .info-accordion-wrapper {
      & .accordion {
        height: 64px;
      }
    }
  }

  #my-komp-points {
    padding: 4px;
  }

  #my-komp-points .referral-link.form .row.form-group {
    flex: 0 0 100%;
    max-width: 100%;
    margin: 0 !important;
    padding: 0 !important;
  }

  #my-komp-points .referral-link.form .row.form-group .col-2 {
    flex: 0 0 33%;
    max-width: 33%;
    text-align: center;
    padding: 4px;
  }

  #my-komp-points .referral-link.form .row.form-group .col-2 .form-prompt {
    text-wrap: nowrap;
  }

  .tab-content-player-account-window
    #my-komp-points
    .section-system-main
    .referral-link {
    font-size: 16px;
    color: #fff;
  }

  .tab-content-player-account-window #my-komp-points .referral-link.form {
    font-size: 12px;
    color: #fff;
    padding: 20px 4px !important;
  }

  #my-komp-points .tab-content-wrapper .text-right.referral-link {
    text-align: left !important;
  }

  #available_bonuses
    #available-bonuses-page
    .section-system-main.available-bonus-item {
    margin-bottom: 20px !important;
  }

  #notification-page #notification-message .btn-delete-notification {
    right: auto;
    left: 0;
    bottom: -64px;
    top: auto;
  }

  #notification-page
    #notification-container
    .table-notification-form
    table
    tbody
    tr
    .notification-body {
    width: 90%;
  }

  #notification-page
    #notification-container
    .table-notification-form
    table
    tbody
    tr
    .deleteButton {
    width: 10%;
  }

  #notification-page
    #notification-container
    .table-notification-form
    table
    tbody
    tr
    .notification-body
    button.btn-notificaton-body
    ul
    li:nth-of-type(1) {
    float: none !important;
    margin: 4px 0;
  }

  .user-email-verification {
    height: 100% !important;
  }

  .user-email-verification .custom-modal-body {
    height: fit-content !important;
    padding: 0px 16px 32px !important;
  }

  .user-email-verification
    .custom-modal-body
    .custom-modal-section
    .icon-container {
    padding: 12px 0;
  }

  .user-email-verification
    .custom-modal-body
    .custom-modal-section
    aside
    .buttons
    button {
    padding: 4px 8px !important;
    width: 45%;
    background: var(--button-primary-bg);
    font-size: 14px !important;
  }

  .wallet-button-currency:before,
  .bonus-badge-currency:before {
    font-size: 11px;
  }

  .wallet-button-balance,
  .bonus-badge-balance {
    margin-left: -16px;
  }

  .sports-wrap .btisw iframe {
    min-height: calc(100dvh - 80px) !important;
  }

  .section-system-main.referrals-tab-link {
    margin-bottom: 0px !important;
    margin: 4px 0px !important;
  }

  .referrals-tab .section-system-filter {
    padding: 8px 0 0 !important;
  }

  .daterangepicker {
    margin-top: 0px;
  }
}

@media only screen and (max-width: 480px) {
  .nm-widget.login-w .login,
  .nm-widget.register-w .btn-join {
    padding: 0 4px !important;
  }

  #modernSkin.main-wrapper .layout-wrapper .content-wrapper .home-page-content {
    padding: 20px 8px 0 !important;
  }

  #app_header.main-header-container
    .player-information-header
    .nm-widget.casino_search-widget {
    display: none;
  }

  .nm-widget.wallet-button-w button,
  .nm-widget.bonus-badge-w button {
    padding: 0 6px !important;
  }

  .nm-widget.login-w .btn-user-profile {
    height: 32px;
    width: 32px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    padding: 0 6px 0 8px !important;
    flex: 1 0 164px !important;
    min-width: 164px;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .player-information-header {
    padding-right: 0px !important;
  }

  #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .player-information-header
    .right-align,
  .player-information-header .header-wallets {
    gap: 6px;
  }

  .scroll-wrap .hero-links .hero-item,
  .scroll-wrap .ads .join-links .join-item {
    height: 190px;
  }

  body.logged-in
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container,
  body
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .logo-container {
    flex: 1 0 54px !important;
    min-width: fit-content;
    padding: 0 4px 0 0 !important;
  }

  .promo-page .promoTabContent.active {
    grid-template-columns: repeat(1, 1fr);
  }

  .category-page-content .vip-cards-section {
    gap: 16px;
  }

  .category-page-content .vip-cards-section .vip-card {
    flex: 1 0 calc(100% - 8px);
    max-width: calc(100% - 8px);
  }

  .category-page-content .vip-cards-section .vip-card img.badge-icon {
    width: 180px;
    height: 188px;
    margin-bottom: 16px;
  }

  .category-page-content .vip-cards-section .vip-card ul {
    padding: 0 16px;
  }

  .category-page-content .vip-cards-section .vip-card ul li {
    padding: 12px 0;
  }

  .category-page-content .vip-cards-section .vip-card ul li h2 {
    margin-bottom: 8px;
  }

  .category-page-content .vip-cards-section .vip-card ul li span {
    font-size: 12px;
  }

  .category-page-content .vip-cards-section .vip-card img.vector-bg {
    width: calc(100% + 20px);
  }

  .category-page-content .section-box .tab button {
    padding: 8px !important;
    font-size: 11px !important;
  }

  .tournament-list-wrapper {
    & .tournament-list-container {
      & .tournament-list-column {
        & .tournament-list-item {
          & .tournament-item-detail-panel {
            padding: 16px;
          }
        }
      }
    }
  }

  .tournament-view-modal,
  .tournament-result-modal {
    & .modal-dialog-centered {
      margin: 70px 0 0;

      & .modal-content {
        padding: 24px 16px !important;

        & .modal-body {
          & .tournament-preview-container,
          &.modal-padding-top {
            & .tournament-preview-detail-panel,
            & .tournament-view-result-wrapper {
              & .base-time-ticker {
                & p {
                  padding: 8px;
                }
              }
            }
          }
        }
      }
    }
  }

  .tournament-view-wrapper {
    & .container-fluid {
      & .tournament-view-modern-wrapper {
        & .banner-title-panel {
          height: 300px;

          & .tournament-name {
            font-size: 20px;
          }
        }

        & .data-panel,
        & .leaderboard-panel {
          padding: 16px 16px 0;

          & .tournament-view-description,
          & .tournament-view-games,
          & .tournament-panel,
          & .tournament-previous-container {
            & .description-title,
            & .tournament-view-games-title,
            & .tournament-leaderboard-title,
            & .title {
              font-size: 18px;
            }

            & .tournament-view-games-article {
              & .tournament-view-games-article-thumbnails {
                grid-template-columns: repeat(3, 1fr);
                gap: 8px;
              }
            }

            & .tournament-previous-panel {
              height: 200px;

              & .previous-tournament-name {
                font-size: 16px;
                padding: 8px;
              }
            }
          }

          & .tournament-view-myrank-wrapper,
          & .tournament-view-leaderboard-wrapper {
            & .table-responsive {
              & table {
                & th {
                  padding: 8px;
                }

                & tr {
                  & td {
                    padding: 8px;
                  }
                }
              }
            }
          }
        }
      }
    }
  }

  .promo-page {
    & .promo-article-banner {
      & .promo-article-hero {
        height: 250px;
      }
    }
  }

  .mobile-menu
    #mobile-menu-items
    .menu-toggler:checked
    ~ ul
    .menu-item:nth-child(1) {
    transform: rotate(0deg) translate(calc(-118px - 50%), -70px);
  }

  .mobile-menu
    #mobile-menu-items
    .menu-toggler:checked
    ~ ul
    .menu-item:nth-child(2) {
    transform: rotate(0) translate(-50%, -92px);
  }

  .mobile-menu
    #mobile-menu-items
    .menu-toggler:checked
    ~ ul
    .menu-item:last-child {
    transform: rotate(0) translate(calc(118px - 50%), -70px);
  }

  #page_content_modern .sports-wrap {
    width: calc(100% + 16px);
    left: -8px;
  }

  .referral-page {
    .two-col:nth-child(2) {
      .left-col,
      .right-col {
        padding-top: 8px;
      }
    }
  }

  .btn-system-amount {
    min-width: 128px;
  }

  #modal-user-profile .modal-dialog .modal-body img.user-profile-modal-logo {
    content: url(https://alpha-static.gpfront.com/DOSLJN/assets/logo/uni88-mobile-logo.png);
    width: 42px;
    height: 42px;
  }

  .promo-page .promo-article-body.main-desc {
    padding: 24px 16px;
  }

  .promo-page .promo-article-body.main-desc h4 {
    font-size: 18px;
    line-height: 24px;
  }

  .promo-page .promo-article-body.main-desc h6 {
    font-size: 16px;
  }

  .promo-page .promo-article-body.main-desc .sub-body p {
    font-size: 14px;
  }

  .promo-article-body .sub-body .promo-card-wrapper h1 {
    font-size: 34px;
    top: -10px;
    left: -29px;
    padding: 7px 32px;
    width: 34px;
  }

  .promo-page .tab {
    grid-template-columns: repeat(6, 1fr);
    display: grid;
    gap: 1px;
    width: 100%;
  }

  .promo-page .promoTabLinks:nth-child(-n + 3) {
    grid-column: span 2;
  }

  .promo-page .promoTabLinks:nth-child(n + 4) {
    grid-column: span 3;
  }

  .promo-page .promoTabLinks:nth-child(1) {
    border-radius: 4px 0 0 0;
  }

  .promo-page .promoTabLinks:nth-child(3) {
    border-radius: 0 4px 0 0;
  }

  .promo-page .promoTabLinks:nth-child(4) {
    border-radius: 0 0 0 4px;
  }

  .promo-page .promoTabLinks:nth-child(5) {
    border-radius: 0 0 4px 0;
  }

  #komp-redemption
    .tab-content-wrapper
    .btn-system-amount-wrapper
    .section-title {
    max-width: 72%;
  }

  #komp-redemption
    .tab-content-wrapper
    .btn-system-amount-wrapper
    .section-title
    a {
    position: absolute;
    top: 20px;
    right: 24px;
  }

  #komp-redemption .tab-content-wrapper .btn-system-amount-wrapper .row.col-12,
  #komp-redemption .tab-content-wrapper .btn-system-amount-wrapper .row.col-12 {
    margin: 0 !important;
  }

  #komp-redemption
    .tab-content-wrapper
    .btn-system-amount-wrapper
    .row.col-12
    .col-4,
  #komp-redemption
    .tab-content-wrapper
    .btn-system-amount-wrapper
    .row.col-12
    .col-8 {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0 !important;
  }

  #komp-redemption
    .tab-content-wrapper
    .btn-system-amount-wrapper
    .row.col-12
    .dropdown
    button {
    min-width: 100%;
  }

  #komp-redemption
    .tab-content-wrapper
    .btn-system-amount-wrapper
    .row.col-12
    .col-8 {
    width: 100%;
    margin: auto;
  }

  #komp-redemption
    .tab-content-wrapper
    .btn-system-amount-wrapper
    .row.col-12
    .col-8
    .grp-deposit-amt {
    width: 100%;
    margin: auto;
  }

  #accd-profile-vip {
    margin-bottom: 150px;
  }

  #vip-progress .section-system-main.referral-link {
    margin: 24px 0 !important;
  }

  #accd-profile-vip .card-body {
    padding: 16px 0;
  }

  #accd-profile-vip .card-body .form-group .dropdown,
  #accd-profile-vip .card-body .form-group .dropdown button {
    width: 100%;
    min-width: 100%;
  }

  .tab-content-main-content > .tab-pane.active {
    padding: 0 16px 120px;
  }

  body.logged-in #app_header .player-information-header .header-wallets {
    margin-right: 0px;
  }

  .left-align {
    gap: 4px;
  }

  body.logged-in
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .player-information-header
    .left-align
    a.regulations,
  body
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .player-information-header
    .left-align
    a.vip,
  body
    #modernSkin.main-wrapper
    .layout-wrapper
    .content-wrapper
    #app_header.main-header-container
    .player-information-header
    .left-align
    a.komp {
    padding: 6px !important;
    font-size: 12px;
  }

  #modernSkin.main-wrapper .layout-wrapper .header-section a.site-header-logo {
    width: fit-content;
  }

  .promotion-popup-container {
    .promotion-item-card {
      width: calc(100% - 64px);

      .promotion-card {
        max-width: 100% !important;

        .promotion-card-content {
          min-width: 100%;
        }
      }
    }
  }

  #deposit-page .wallet-payment-method form .tencoin-deposit-qr-address {
    width: 100%;
  }

  .login-modal-dual-mode button {
    font-size: 14px !important;
    padding: 8px !important;
  }

  #modernSkin .before-provider-game-list-casino-group .casino_search-widget .search-button-field {
   width: 240px !important; 
  }
}

@media only screen and (max-width: 420px) {
  .game-lobby-renderer .game-lobby-renderer-card.see-all-card {
    top: -40px;
  }
}

@media only screen and (max-width: 375px) {
  #komp-redemption .tab-content-wrapper .btn-system-amount-wrapper .row.col-12

    /*
	#modernSkin .content-wrapper .game-lobby-renderer.horizontal,
	*/
    #modernSkin .content-wrapper .home-page-content .game-provider-list,
    .loader-container.horizontal div {
    gap: 0 6px !important;
    grid-auto-columns: calc(calc(100% - 6px) / 2) !important;
  }

  /*.game-lobby-renderer.tiles,*/
  .scroll-wrapper.provider-list-page .game-providers

    /*,
	.loader-container.tiles div */ {
    gap: 10px 6px !important;
    grid-template-columns: repeat(2, 1fr) !important;
  }
}