.NavigationPanel {
    display: none;
}

.GameCategoriesWrapperMobile {
    display: none;
}

@media (max-width: 768px) {
    #SportsIframe {
        height: 1500px !important;
    }
    .GameCategoriesWrapperMobile {
        display: block;
    }
    .GameCategoriesWrapperDesktop {
        display: none;
    }
    .CasinoJackpotWinnerSection .BoxTitle .CasinoDailyCalendarSection .BoxTitle,
    .GamesList .BoxTitle {
        margin-bottom: 32px;
    }
    .Page-Casino .MsnRow .GamesListContainer {
        padding: 0 10px;
    }
    .NavigationPanel {
        display: block;
    }
    :host {
        font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica,
            Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    }

    .NavigationWrapper {
        background: var(--emfe-w-color-footer-bg, #212529);
        width: 100%;
        height: 100px;
    }

    .NavigationPanel {
        position: fixed;
        bottom: 0px;
        left: 0;
        width: 100%;
        height: 65px;
        z-index: 30;
        background-color: #363636;
    }

    .NavigationWindow {
        display: flex;
        flex-direction: column;
        background: #363636;
        position: absolute;
        bottom: 30px;
        left: 0;
        opacity: 0;
        transform: translateY(100%);
        border-radius: 5px 5px 0 0;
        transition: 0.25s ease;
        width: 100%;
        max-height: 40vh;
    }

    .NavigationWindow.NavigationWindowOpened {
        opacity: 1;
        padding-bottom: 40px;
        transform: translateY(5px);
    }

    .NavigationWindow .ModalCloseBtn {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 24px;
        height: 24px;
        border-radius: 100%;
        color: var(--emfe-w-color-secondary, #fd2839);
        background: rgba(255, 255, 255, 0.1);
        cursor: pointer;
        transition: all 150ms ease-in-out;
        z-index: 1;
    }

    .NavigationWindow .ModalCloseBtn svg {
        width: 24px;
        height: 24px;
        margin: 50%;
        transform: translate(-50%, -50%);
    }

    .NavigationWindow .ModalCloseBtn:hover {
        background: rgba(255, 255, 255, 0.2);
    }

    .NavigationWindow .NavigationWindowTitle {
        padding: 16px 10px;
        margin: 0;
        color: var(--emfe-w-color-contrast, #07072a);
        font-size: 12px;
        flex-grow: 0;
    }

    .NavigationWindow .NavigationSecondaryWrapper {
        display: flex;
        flex-wrap: wrap;
        padding: 0 10px;
        flex-grow: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .NavigationPrimaryItemAnchor.NavItem0 {
        grid-area: item0;
    }

    .NavigationPrimaryItemAnchor.NavItem1 {
        grid-area: item1;
    }

    .NavigationPrimaryItemAnchor.NavItem2 {
        grid-area: item2;
    }

    .NavigationPrimaryItemAnchor.NavItem3 {
        grid-area: item3;
    }

    .NavigationPrimaryItemAnchor.NavItem4 {
        grid-area: item4;
    }

    .NavigationBar {
        background: #363636;
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: 1fr 1fr 20% 1fr 1fr;
        grid-template-areas: "item0 item1 . item2 item3";
        height: 65px;
        border-radius: 5px;
        position: relative;
        color: #fff !important;
        padding: 0 15px;
    }

    .NavigationBar.NavigationBarSimple {
        grid-template-columns: repeat(5, 20%);
        grid-template-areas: "item0 item1 item2 item3 item4";
    }

    .NavigationBar.NavigationBarOpened {
        box-shadow: 0 0 11px rgba(0, 0, 0, 0.09);
    }

    .NavigationPrimaryItemAnchor,
    .NavigationSecondaryItemAnchor {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0px;
        text-decoration: none;
        color: var(--emfe-w-color-contrast, #07072a);
        font-size: 9px;
        overflow: hidden;
        white-space: nowrap;
    }

    .NavigationPrimaryItemAnchor .NavigationPrimaryItemImg,
    .NavigationSecondaryItemAnchor .NavigationPrimaryItemImg,
    .NavigationSecondaryItemAnchor .NavigationSecondaryItemImg {
        width: 33px;
    }

    .NavigationPrimaryItemAnchor .NavigationPrimaryItemLabel,
    .NavigationSecondaryItemAnchor .NavigationPrimaryItemLabel,
    .NavigationSecondaryItemAnchor .NavigationSecondaryItemLabel {
        margin: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
        text-align: center;
        color: #fff !important;
    }

    .NavigationSecondaryItemAnchor {
        width: 25%;
        padding: 10px 0;
    }

    .ActiveItem {
        background-color: var(--emfe-w-color-primary, #d0046c);
    }

    .NavigationButton {
        background: #363636;
        border: none;
        width: 20%;
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 0;
    }

    .NavigationButton .middleIcon {
        width: 32px;
        height: 32px;
    }

    .NavigationButton:before {
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-top: 8px solid #f4f4f4;
        content: "";
        height: 0;
        left: 50%;
        opacity: 0;
        position: absolute;
        top: 0;
        transform: translateX(-50%);
        width: 0;
    }

    .NavigationButton.NavigationButtonActive:before {
        opacity: 1;
        transition: 0.7s ease;
    }
    .NavigationPrimaryItemImgWrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 33px;
    }
    .NavigationPrimaryItemLabel {
        font-size: 10px;
    }

    .Page-Casino .MsnRow .GamesListContainer,
    .Page-LiveCasino .MsnRow .GamesListContainer {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
        grid-gap: 0.8rem;
        justify-items: stretch;
        align-items: stretch;
    }
    .Page-Casino .MsnRow .ListGame,
    .Page-LiveCasino .MsnRow .ListGame {
        width: 100%;
    }
    .GameTitle {
        display: block;
        text-align: center;
        max-width: 100%;
        width: 100%;
        color: #fff;
        font-size: 1.5rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        line-height: 1.2;
    }

    .operatorSwiper {
        width: 100%;
        height: 232px !important;
    }

    .operatorSwiper .swiper-slide {
        width: 100%;
    }

    .operatorSwiper .swiper-slide img {
        width: 100%;
        height: 232px !important;
        object-fit: cover;
        display: block;
    }

    .operatorSwiper .swiper-button-prev,
    .operatorSwiper .swiper-button-next {
        width: 32px;
        height: 32px;
        color: #fff;
    }

    .operatorSwiper .swiper-button-prev::after,
    .operatorSwiper .swiper-button-next::after {
        display: none;
    }

    .MsnRow.HighlightedListWrapper .VerticalMobileLayout .GamesListContainer,
    .MsnRow .VerticalMobileLayout .GamesListContainer {
        grid-template-rows: auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 2.4rem 1.6rem 0;
        grid-gap: 1.2rem;
    }

    .Page-Casino .MsnRow .GamesListContainer,
    .Page-LiveCasino .MsnRow .GamesListContainer {
        grid-template-rows: auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 2.4rem 1.6rem 0;
        grid-gap: 1.2rem;
    }

    .deposit-confirm-message {
        font-size: 14px!important;
        color: #333;
        line-height: 1.6;
        margin-bottom: 20px;
        padding: 0;
        font-weight: 400;
        display: flex;
        align-items: center;
        gap: 4px!important;
    }
    .deposit-confirm-message span {
        font-size: 16px!important;
    }

    
}
