@media screen and (min-width: 1920px) {
    .gameList .gameItem {
        width: 12.5%
    }

    .termsPage {
        max-width: 100%;
    }

    .loyaltyContent {
        max-width: 1200px;
        margin: auto
    }

    .tournamentsList {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }

    .tournamentsList .tournamentsCard {
        width: 100%;
    }

    .suggestSliderItem .suggestSliderBig {
        min-width: auto;

        width: auto
    }

    .suggestSliderItem .suggestSliderBig img {
        min-height: 700px;
        width: auto !important;
    }

    .suggestSliderItem .siggestSliderRight a img {
        height: calc(350px - 8px);
        object-fit: cover;
        object-position: center;
    }
}

@media screen and (min-width: 1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1366px
    }

    .loyaltyProgram {
        overflow: hidden;
    }
}

@media screen and (max-width: 1400px) {
    #mainSection {
        max-width: 100%;
    }

    section {
        width: calc(100% - 288px);
    }

    .tournamentsCard .tournamentsCardLeft {
        width: 50%;
        min-width: 50%;
        max-width: 50%;
    }
}

@media screen and (max-width: 1200px) {
    header {
        max-width: 230px
    }

    section {
        width: calc(100% - 230px);
    }

    header .logo img {
        max-width: 100%;
        width: 150px;
    }

    header .iconLogo img {
        max-width: 100%;
        width: 150px;
    }

    #topMenu .logo img {
        max-width: 100%;
        width: 130px;
    }

    .gameTabHeader .nav-pills .nav-item {
        padding: 0 10px
    }

    .gameTabHeader .nav-pills .nav-link {
        font-size: 12px
    }

    .gameTabHeader .nav-pills .nav-link .icons {
        width: 24px;
        height: 24px
    }

    .gameTabHeader .filterIcon {
        font-size: 12px
    }

    .gameTabHeader .filterIcon .icon {
        height: 24px;
        width: 24px
    }

    .gameTabHeader .filterIcon .icon img {
        width: 100%
    }

    .gameTabHeader .searchIcon {
        font-size: 12px
    }

    .gameTabHeader .searchIcon .icon {
        width: 24px;
        height: 24px
    }

    .gameTabHeader .favoriteIcon {
        font-size: 12px
    }

    .gameTabHeader .favoriteIcon .icon {
        width: 24px;
        height: 24px
    }

    .loyaltyContent:after {
        display: none;
    }

    .loyalty-1 {
        margin-bottom: 150px;
    }

    header .headerContent {
        display: flex;
        flex-direction: column
    }

    .sideNews {
        margin-bottom: 15px
    }
}

@media screen and (max-width: 1024px) {
    header {
        max-width: 200px
    }

    section {
        width: calc(100% - 200px);
    }

    header .logo img {
        max-width: 100%;
        width: 130px;
    }

    header .iconLogo img {
        max-width: 100%;
        width: 130px;
    }

    #topMenu .logo img {
        max-width: 100%;
        width: 110px;
    }

    .sideNews .sideNewsList a {
        padding: 10px
    }

    .sideNews .sideNewsList a .icon img {
        width: 32px;
        height: 32px
    }

    .sideNews .sideNewsList a .text span {
        font-size: 10px;
    }

    .sideNews .sideNewsList a .text strong {
        font-size: 13px
    }

    footer .footerTop .footerAbout {
        font-size: 11px;
        max-width: 240px
    }
}

@media screen and (max-width: 992px) {
    .mobileHeader {
        display: flex;
        align-items: center;
        padding: 10px 15px
    }

    .mobileHeader .mobileLogo {
        margin-left: 20px
    }

    .mobileHeader .mobileLogo img {
        max-width: 100%;
        width: 180px;
        height: auto;
    }

    .mobileHeader .mobileHeaderLeft .logo img {
        max-width: 100%;
        width: 150px;
        height: auto;
    }

    .mobileHeaderRight {
        margin-left: auto
    }

    .mobileMenuIcon span {
        display: block;
        width: 18px;
        height: 2px;
        background: #B0B1B2;
    }

    .mobileHeader .btn {
        padding: 4px 18px;
        font-size: 13px
    }

    .mobileHeader .btn+.btn {
        margin-left: 10px
    }

    .mobileMenuIcon span+span {
        margin-top: 4px
    }

    #mainSection {
        display: block !important
    }

    header {
        position: fixed;
        left: -288px;
        width: 288px;
        max-width: 100%;
        z-index: 4;
        background-color: #141618;
        background-image: url(../images/headerbg.png);
        background-size: 100%;
        background-repeat: no-repeat;
        height: 100vh;
        overflow: auto;
        webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    header.open {
        left: 0
    }

    header .search {
        display: none;
        padding: 0 20px
    }

    header .headerTop .search input+a.hidden {
        left: 30px;
    }

    header .search.open {
        display: block;
    }

    header .logo {
        display: none;
    }

    .sideNews {
        margin-top: 10px
    }

    header .headerTop {
        padding: 0;
        background: transparent;
    }

    .mobileTop {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px 10px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1)
    }

    .mobileTop .mobileLogo img {
        max-width: 100%;
        width: 160px;
        height: auto;
    }

    .mobileTop .mobileMenuClose {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        border: 1px solid #313840
    }

    .mobileTop .mobileMenuClose svg {
        width: 9px;
    }

    .mobileTop .mobileSearch svg path {
        fill: #fff;
        fill-opacity: 1
    }

    .mobileTopMenu {
        display: block;
    }

    .mobileTopMenu a {
        display: flex;
        align-items: center;
        color: #fff;
        font-weight: 400;
        text-decoration: none;
        padding: 10px 0;
    }

    .mobileTopMenu a .icon {
        margin-right: 15px;
    }

    #mainSection:has(header.open):before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 3;
        background: rgba(0, 0, 0, 0.8)
    }

    body:has(header.open) {
        overflow: hidden;
    }

    header .iconLogo {
        display: none;
    }

    #topMenu {
        display: none !important
    }

    section {
        width: 100%;
        max-width: 100%;
    }

    .gameTabHeader .mobileCategoryList {
        position: relative;
    }

    .gameTabHeader .mobileCategoryList:before {
        content: "";
        position: absolute;
        right: 0;
        top: 32%;
        right: 11px;
        transform: translateY(-50%);
        background-image: url(../images/icons/ico-arrow-down.svg);
        background-size: cover;
        width: 14px;
        height: 10px;

    }

    .gameTabHeader .mobileCategoryList.open:before {
        transform: rotate(180deg)
    }

    .gameTabHeader .mobileCategoryList .icons {
        display: block;
        height: 24px;
        text-align: center;
        margin: 0 auto 10px
    }

    .gameTabHeader .mobileCategoryList {
        display: block;
        color: #A5ABB2;
        font-size: 12px;
        padding: 17px 10px;
        text-decoration: none
    }

    .gameTabHeader .mobileCategoryList:hover {
        color: var(--primary)
    }

    .mobileCat {
        display: none;
    }

    .mobileCat.open {
        display: block;
        border-top: 1px solid #212224;

    }

    .gameList .gameItem {
        width: 25%;
    }

    .loyaltyHeader {
        padding: 0px 50px
    }

    .loyaltyProgram {
        overflow: hidden
    }

    .loyaltyItem {
        margin: 0 0 50px !important
    }

    .loyalty-2 .loyaltyHeadBox {
        margin-left: 0
    }

    .loyalty-2 .loyaltyBottomBox {
        margin-left: 0;
    }

    .loyalty-1 .loyaltyHeadBox {
        margin-left: 0
    }

    .loyalty-1 .loyaltyBottomBox {
        margin-left: 0;
    }

    .loyalty-5 .loyaltyHeadBox {
        margin-left: 0;
    }

    .fixedBottom {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 2;
        background: #101416;
        width: 100%;
        border-top: 1px solid #303841;
    }

    .fixedBottom .fixedBottomContent {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5px 0;
    }

    .fixedBottom .fixedBottomContent a {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-style: normal;
        font-weight: 600;
        font-size: 11px;
        letter-spacing: -0.41px;
        color: #A3ACB3;
        text-decoration: none;
        min-width: 80px;
    }

    .fixedBottom .fixedBottomContent a .icon {
        width: 100%;
        height: 22px;
        display: inline-block;
        text-align: center;
        margin-bottom: 6px;
    }

    .fixedBottom .fixedBottomContent a .icon svg {
        height: 22px;
        width: 22px;
    }

    footer {
        padding-bottom: 60px
    }

    .termsLink {
        flex-direction: column
    }

    .termsLink a {
        display: inline-block;
        background: transparent;
        color: #F3B44A;
        margin-bottom: 5px
    }

    .termsPage .termsTitle {
        font-size: 32px
    }

    .tournamentsCard {
        flex-direction: column
    }

    .tournamentsCard .tournamentsCardLeft {
        width: 100%;
        max-width: 100%;
        min-width: 100%;
    }

    .pageTabHead .nav-pills {
        display: flex;
        flex-wrap: nowrap;
        overflow: auto;
    }

    .pageTabHead .nav-pills .nav-link {
        white-space: nowrap
    }

    .tournamentsCard .tournamentsCardRight {
        padding: 15px
    }

    .tournamentsDetail .tournamentPhoto {
        position: relative;
    }

    .tournamentsDetail .tournamentPhoto img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        object-position: center
    }

    .tournamentsDetail .tournamentPhoto:before {
        content: "";
        position: absolute;
        height: 100%;
        width: 100%;
        left: 0px;
        right: 0px;
        top: 0px;

        background: linear-gradient(183.07deg, rgba(16, 20, 22, 0) 3.69%, #101416 97.45%);

    }

    .tournamentsDetail .timer {
        bottom: 15px
    }

    .tournamentsDetail .timer .counter span i {
        font-size: 27px
    }

    #pageContent:has(>.pageTop) {
        padding-top: 16px
    }

    .pageTop {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
    }

    .pageTop .live {
        position: relative;
        top: auto;
        right: auto;
    }

    .pageback {
        display: flex;
        align-items: center;

        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;

        display: flex;
        align-items: center;
        letter-spacing: -0.41px;

        color: #E6E6E6;
        text-decoration: none;


    }

    .pageback .icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        border: 1px solid #fff;
        margin-right: 12px;
    }

    .pageback .icon svg {
        width: 10px
    }

    .tournamentDetailMeta .btn-primary {
        display: none;
    }

    .promoCard.promoCard-Big .text strong {
        font-size: 20px;
        line-height: normal
    }

    .profileMenu {
        overflow: auto;
    }

    .profileMenu a {
        white-space: nowrap
    }

    .userProfileLeftInfo {
        padding: 0 20px
    }

    .profileBalance {
        padding: 0 20px
    }

    .mobileHeaderRight:has(>.mobileHeaderUser) {
        display: flex;
        align-items: center
    }

    .mobileHeaderUser {
        display: flex;
        align-items: center;
        margin-right: 20px
    }

    .mobileHeaderUser .icon {
        margin-right: 16px;
    }

    .mobileHeaderUser a {
        display: flex;
        align-items: center;
        text-decoration: none;
    }

    .mobileHeaderUser a .text span {
        display: block;
        font-style: normal;
        font-weight: 400;
        font-size: 10px;
        line-height: 12px;
        color: #A3ACB3;
    }

    .mobileHeaderUser a .text strong {
        display: block;
        font-style: normal;
        font-weight: 700;
        font-size: 14px;


        letter-spacing: -0.41px;
        color: #FFFFFF;


    }

    .mobileHeaderUser a .text {
        margin-right: 12px
    }

    .mobileSmall {
        display: block;
        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 140.1%;
        text-align: center;
        letter-spacing: -0.41px;
        color: rgba(255, 255, 255, 0.65);


    }

    .file-upload {
        background-color: var(--primary) !important
    }

    .file-container {
        margin: 10px 0
    }

    .file-upload>div {
        padding: 5px 25px !important;
    }

    .file-upload>div span {
        display: block;
        width: 100%;
        max-width: 100%;

        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 22px;

        text-align: center;
        letter-spacing: -0.41px;

        color: #FFFFFF !important;


    }

    .file-upload>div p,
    .file-upload>div small {
        display: none;
    }
}




@media screen and (max-width: 768px) {

    .vipContent {
        border: 0
    }

    .mobileHeader .mobileLogo img {
        max-width: 100%;
        width: 160px;
    }

    .mobileHeader .mobileHeaderLeft .logo img {
        max-width: 100%;
        width: 130px;
    }

    .mobileTop .mobileLogo img {
        max-width: 100%;
        width: 140px;
    }

    .vipContent table {
        border: 0;
    }

    .vipContent table caption {
        font-size: 1.3em;
    }

    .vipContent table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .vipContent table tr {
        border-bottom: 3px solid #ddd;
        display: block;
        margin-bottom: .625em;
    }

    .vipContent table td {
        border-bottom: 1px solid #ddd;
        display: block;
        font-size: .8em;
        text-align: right;
    }

    .vipContent table td::before {

        content: attr(data-label);
        float: left;
        font-weight: bold;
        text-transform: uppercase;
    }

    .vipContent table td:last-child {
        border-bottom: 0;
    }

    .vipContent table tr td:first-child {
        background: var(--primary)
    }

    .gameList .gameItem {
        width: 33.33333%
    }

    footer .footerTop {
        flex-direction: column;
        flex-wrap: wrap
    }

    footer .footerTop .footerAbout {
        order: 5;
        width: 100%;
        max-width: 100%;
        margin-bottom: 20px;
    }

    .footerMeta {
        width: 100%;
        margin: auto;
        text-align: center;
    }

    .footerMeta .language {
        display: flex;
        justify-content: center;
        text-align: center
    }

    .language .dropdown-toggle {
        width: 184px;
        max-width: 100%;
    }

    .social {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .footerMeta .social a+a {
        margin-top: 0;
        margin-left: 10px;
    }

    .footerMeta .social a .text {
        display: none;
    }

    .footerMeta .social a .icon {
        height: 28px;
        width: 28px;
    }

    .footerMeta .social a .icon svg {
        height: 28px;
    }

    .mobileMenuLink {
        display: flex;
        padding: 9px 0;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        display: flex;
        align-items: center;
        letter-spacing: 0.01px;
        color: rgba(255, 255, 255, 0.65);
        text-decoration: none;
        border-top: 1px solid rgba(163, 172, 179, 0.2);
        pointer-events: all;


    }


    .mobileMenuLink img {
        display: inline-block;
    }

    .mobileMenuLink+ul {
        display: none;
    }

    .mobileMenuLink.open+ul {
        display: block;
    }

    .loyaltyItem .loyaltyHeadBox {
        margin: auto !important
    }

    .loyalty-2 {
        padding-right: 0
    }

    .loyalty-2 .loyaltyBottomBox {
        margin: auto
    }

    .loyalty-1 .loyaltyHeadBox {
        margin: auto
    }

    .loyalty-1 .loyaltyBottomBox {
        margin: auto
    }

    .loyalty-5 .loyaltyHeadBox {
        margin: auto
    }

    .loyaltyItem .loyaltyBottomBox {
        margin: 10px auto 0
    }

    #newsModal .modal-dialog {
        width: 100%;
        height: 100%;
        max-width: 100%;
        max-height: 100%;
        min-height: 100%;
        margin: 0;
    }

    #newsModal .modal-dialog .modal-content {
        height: 100%;
    }

    .loyaltyContent {
        padding: 0 30px
    }

    .loyaltyItem .loyaltyHeadBox .text .lboxprize strong {
        font-size: 24px;
    }

    #bonusModal.modal .modal-dialog {
        max-width: 100%;
    }

    #bonusModal .modal-content {
        height: 100%;
    }

    #bonusModal .modal-content .modal-body {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .suggestSlider {
        display: none;
    }

    .suggestSliderMobile {
        display: block;
    }

    .suggestSliderNav {
        display: none;
    }

    .gameTabTitle {
        margin-bottom: 0
    }

    .d-flex:has(>.gameTabTitle) {
        margin-bottom: 20px
    }

    #mainBanner .item a img.mobileSlide {
        display: block;

    }

    #mainBanner .item a img.webSlide {
        display: none;
    }
}

@media screen and (max-width: 576px) {
    .gameList .gameItem {
        width: 50%
    }

    .mobileHeader .mobileLogo img {
        max-width: 100%;
        width: 150px;
    }

    .mobileHeader .mobileHeaderLeft .logo img {
        max-width: 100%;
        width: 120px;
    }

    .mobileTop .mobileLogo img {
        max-width: 100%;
        width: 130px;
    }

    .gameTabHeader .nav-pills {
        justify-content: flex-start;
        flex-wrap: nowrap
    }

    .gameTabHeader {
        padding: 0 10px
    }

}

@media screen and (max-width: 468px) {
    .mobileHeader .mobileLogo img {
        max-width: 100%;
        width: 120px;
    }

    .mobileHeader .mobileHeaderLeft .logo img {
        max-width: 100%;
        width: 100px;
    }

    .mobileTop .mobileLogo img {
        max-width: 100%;
        width: 110px;
    }

    .mobileHeader .btn {
        font-size: 10px;
        padding: 4px 10px
    }
}

@media screen and (max-width: 360px) {
    .mobileHeader .mobileLogo img {
        max-width: 100%;
        width: 100px;
    }

    .mobileHeader .mobileHeaderLeft .logo img {
        max-width: 100%;
        width: 80px;
    }

    .mobileTop .mobileLogo img {
        max-width: 100%;
        width: 90px;
    }

    .mobileHeader .btn {
        font-size: 9px;
        padding: 4px 8px
    }
}