/*90%*/
    @media (width: 1777.79px){
        .nav-ul-menu {
            margin-top: 1px;
        }
    }
    /*75%*/
    @media (width: 2133.32px){
        .nav-h3-1 {
            line-height: 1.08;
            top: 5px !important;
        }
    }
    /*67%*/
    @media (width: 2400px){
        .nav-h3-1 {
            top: 4px !important;
        }
    }
    /*110%*/
    @media (width: 1454.53px){
        .nav-h3-1 {
            line-height: 1;
            top: 4px !important;
        }
    }
    /*125%*/
    @media (width: 1280px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            line-height: 1.06;
            top: 4px !important;
        }
    }
    /*133%*/
    @media (width: 1199.99px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            top: 4px !important;
        }
    }
    /*140%*/
    @media (width: 1142.86px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            top: 5px !important;
        }
    }
    /*150%*/
    @media (width: 1066.67px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            top: 5px !important;
        }
    }
    .clickable-row:hover {
        background: linear-gradient(98.5deg, #05f0ff -46.16%, #7367ff 42.64%, #963cff 70.3%);
        outline: none;
        color: #ffffff;
        cursor: pointer;
    }

    @media (max-width: 767px) {
        .support_us_responisve {
                margin-top: 0px !important;
            }}
    @media (min-width: 1300px) {
        .hero-sec-div-one {
            max-width: 1400px;
        }
    }
  @media (min-width: 2130px) and (max-width: 2140px) {
  .nav-h3-1 {
    line-height: 1.15;
    top: 4px;
  }
}
    @media (min-width: 480px) {
        .hero-sec-div-one {
            padding-left: 20px;
            padding-right: 0px;
        }
    }

    @media (min-width: 61.25em) {
        .gv-grid-view .gv-grid-view-inner {
            padding: 15px 0px 30px 140px;
        }
    }

    .players-hedding {
        font-family: "GH Guardian Headline", "Guardian Egyptian Web", Georgia, serif !important;
        margin: 10px 0px;
        font-size: 2.5rem;
        font-weight: 700;
        border-bottom: 3px solid #000;
        /* Adjust thickness and color */
        padding-bottom: 5px;
    }

    html {
        scroll-behavior: smooth;
    }

    .navbar {
        padding-top: 0rem !important;
    }

    .gv-wrapper {
        border-top: none !important;
    }

    @media (min-width: 740px) {
        .hero-sec-div-one {
            border-left: none !important;
            border-right: none !important;
        }
    }

    @media (min-width: 61.25em) {
        .gv-grid-view {
            border-left: none !important;
            border-right: none !important;

        }
    }

    @media (min-width: 61.25em) {
        .gv-views-wrapper:before {
            border-right: none !important;
        }
    }

    @media (max-width: 991px) {
        .navbar-res {
            margin-top: 0px !important;
            padding: 0 !important;
            width: 100% !important;
            height: 100% !important;
            border-top: 1px solid #506991;
            box-sizing: border-box;
        }
    }

    .gv-grid-view .gv-grid-cell .gv-grid-cell-inner .gv-grid-cell-image-number {
        width: 45px !important;
        height: 45px !important;
    }

    h1 {
        text-transform: none !important;
    }

    .navbar {
        padding-top: 0rem;
    }

    .timg {
        width: 45px;
        height: 45px;
        border-radius: 50%;
        overflow: hidden;
    }

    /* Override the .img class styles */
    .gv-grid-cell-image-number .img.timg {
        width: auto;
        height: auto;
    }



    #mySidebar {

        display: none;



    }

    .players2 .players_side {
        margin-left: 0px;
        padding-top: 0px;
    }

    .players2 .player_header {

        width: 50px;
        margin-left: -25px;

    }

    .player_header .openbtn {
        margin-left: -32px !important;
    }

    .sidebar {

        position: relative !important;
        ;

        overflow-x: initial !important;

        height: 100% !important;

    }

    .pgridOpen {
        display: block;
    }

    .content__headline {
        letter-spacing: 0em !important;
    }

    .pgridClose {
        display: none;
        transition: left 0.5s ease-in-out;
    }

    @media (max-width: 767px) {
        .nav-ul-menu {
            margin-top: 0px !important;
        }
    }

    @media only screen and (min-width: 768px) and (max-width: 991px) {
        .nav-h3-1 {
            top: 3px !important;
        }

        .btn_yellow1 {
            margin-top: 1px !important;
        }

        .nav-ul-menu {
            margin-top: 2px !important;
        }
    }


         /* <!-- euro page css --> */

            html {
                -moz-osx-font-smoothing: grayscale;
                -webkit-font-smoothing: antialiased;
                /* always show the vertical scroll bar to stop the page
         * jumping about when navigating between pages where
         * one has content shorter than the viewport */
                overflow-y: scroll;
            }

            .hides-video {
                font-size: 18px;
            }

            .Sports-header {
                padding: 0px 1px !important;
            }

            .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                width: calc(100vw - var(--scroll-bar-width, 0px));
                margin-left: -6px;
                height: 170px;
                display: flex;
                flex-flow: column nowrap;
                justify-content: space-between;
                position: relative;
                overflow: hidden
            }

            @media(min-width: 30em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    margin-left: -20px
                }
            }

            @media(min-width: 46.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    margin-left: -21px;
                    width: 740px;
                    height: var(--tablet-height, 160px);
                    border-left: 1px solid rgba(18, 18, 18, 0.3);
                    border-right: 1px solid rgba(18, 18, 18, 0.3)
                }
            }

            @media(min-width: 61.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 980px;
                    height: 160px
                }
            }

            @media (min-width: 71.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 1136px !important;
                }
            }

            @media(min-width: 71.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 1140px
                }
            }

            @media(min-width: 81.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 1300px
                }
            }

            .Sports-header.europe-front.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                margin-left: auto !important;
                margin-right: auto !important
            }

            .Sports-header--title.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                color: #121212;
                text-decoration: none
            }

            .Sports-header--title.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t:hover {
                text-decoration: underline;
                text-decoration-thickness: 3px
            }

            .Sports-header.svelte-1l2xv2t .Sports-header--title.svelte-1l2xv2t>span.svelte-1l2xv2t,
            .Sports-header.svelte-1l2xv2t span.svelte-1l2xv2t.svelte-1l2xv2t {
                font-family: "Guardian Headline", "Guardian Egyptian Web", "Guardian Headline Full", Georgia, serif;
                font-size: 28px;
                font-style: normal;
                font-weight: 700;
                line-height: 115%;
                padding: 3px 0 0 10px;
                max-width: 250px;
                text-decoration: none
            }

            @media(min-width: 30em) {

                .Sports-header.svelte-1l2xv2t .Sports-header--title.svelte-1l2xv2t>span.svelte-1l2xv2t,
                .Sports-header.svelte-1l2xv2t span.svelte-1l2xv2t.svelte-1l2xv2t {
                    padding-left: 20px
                }
            }

            @media(min-width: 46.25em) {

                .Sports-header.svelte-1l2xv2t .Sports-header--title.svelte-1l2xv2t>span.svelte-1l2xv2t,
                .Sports-header.svelte-1l2xv2t span.svelte-1l2xv2t.svelte-1l2xv2t {
                    font-size: 50px;
                    max-width: 380px
                }
            }

            @media(min-width: 61.25em) {

                .Sports-header.svelte-1l2xv2t .Sports-header--title.svelte-1l2xv2t>span.svelte-1l2xv2t,
                .Sports-header.svelte-1l2xv2t span.svelte-1l2xv2t.svelte-1l2xv2t {
                    padding: 3px 0 0 20px;
                    max-width: unset
                }
            }

            .Sports-header--nav.svelte-1l2xv2t ul.svelte-1l2xv2t.svelte-1l2xv2t {
                display: flex;
                flex-flow: row wrap;
                justify-content: flex-start;
                margin: 0;
                padding: 0;
                list-style: none;
                position: relative
            }

            .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t {
                position: relative
            }

            @media(min-width: 71.25em) {
                .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 160px
                }
            }

            .Sports-header--nav.svelte-1l2xv2t ul li a.svelte-1l2xv2t.svelte-1l2xv2t {
                color: #000;
                text-decoration: none;
                font-family: "Guardian Headline", "Guardian Egyptian Web", "Guardian Headline Full", Georgia, serif;
                font-size: 15px;
                font-style: normal;
                font-weight: 700;
                line-height: 115%;
                display: block;
                padding: 4px 10px 6px
            }

            .Sports-header--nav.svelte-1l2xv2t ul li a.svelte-1l2xv2t.svelte-1l2xv2t:before {
                content: "";
                position: absolute;
                display: block;
                top: -4px;
                left: 0;
                width: calc(100% + 1px);
                height: 4px;
                z-index: 19;
                background-color: var(--selected-color);
                opacity: 0;
                transition: transform 0.3s ease-in-out, opacity 0.05s 0.1s linear
            }

            .Sports-header--nav.svelte-1l2xv2t ul li a.svelte-1l2xv2t.svelte-1l2xv2t:hover:before {
                opacity: 1;
                transform: translateY(4px)
            }

            @media(prefers-reduced-motion) {
                .Sports-header--nav.svelte-1l2xv2t ul li a.svelte-1l2xv2t.svelte-1l2xv2t:before {
                    transition: none
                }
            }

            @media(min-width: 61.25em) {
                .Sports-header--nav.svelte-1l2xv2t ul li a.svelte-1l2xv2t.svelte-1l2xv2t {
                    font-size: 17px
                }
            }

            @media(min-width: 71.25em) {
                .Sports-header--nav.svelte-1l2xv2t ul li a.svelte-1l2xv2t.svelte-1l2xv2t {
                    padding: 9px 0 10px 10px
                }
            }

            .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t:after {
                content: "";
                position: absolute;
                height: 100%;
                top: 1px;
                right: -1px;
                max-height: 20px;
                width: 1px;
                display: block;
                opacity: 0.3;
                background-color: #121212
            }

            .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t:first-of-type {
                padding-left: 0
            }

            @media(min-width: 30em) {
                .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t:first-of-type {
                    padding-left: 10px
                }
            }

            @media(min-width: 71.25em) {
                .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t:first-of-type {
                    width: 171px
                }
            }

            .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t:first-of-type::before {
                display: none
            }

            @media(min-width: 30em) {
                .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t:last-of-type {
                    padding-left: 10px
                }
            }

            @media(min-width: 34.375em) {
                .Sports-header--nav.svelte-1l2xv2t ul li.svelte-1l2xv2t.svelte-1l2xv2t:last-of-type {
                    padding-left: 0
                }
            }

            .Sports-header--nav.svelte-1l2xv2t ul li.selected.svelte-1l2xv2t.svelte-1l2xv2t::before {
                content: "";
                position: absolute;
                display: block;
                top: 0;
                left: 0;
                width: calc(100% + 1px);
                height: 4px;
                z-index: 19;
                background-color: var(--selected-color)
            }

            .Sports-header--nav.svelte-1l2xv2t ul li.full-coverage a.svelte-1l2xv2t.svelte-1l2xv2t {
                font-weight: 400
            }

            .Sports-header--nav.svelte-1l2xv2t ul.svelte-1l2xv2t.svelte-1l2xv2t::before {
                display: block;
                content: "";
                position: absolute;
                opacity: 0.3;
                width: 100%;
                height: 1px;
                z-index: 18;
                background-color: #121212
            }

            .Sports-header--nav.svelte-1l2xv2t ul.svelte-1l2xv2t.svelte-1l2xv2t::after {
                display: block;
                content: "";
                position: absolute;
                opacity: 0.3;
                width: 100%;
                height: 1px;
                bottom: 26px;
                background-color: #121212
            }

            @media(min-width: 34.375em) {
                .Sports-header--nav.svelte-1l2xv2t ul.svelte-1l2xv2t.svelte-1l2xv2t::after {
                    display: none
                }
            }

            @media (min-width: 61.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 981px;
                    height: 160px;
                    max-width: 1396px;
                    margin: 0px;
                    padding: 0px;
                }
            }

            @media (min-width: 91.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 1700px !important;
                }
            }

            .ios .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t,
            .android .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                margin: 0px
            }

            .ios .Sports-header.svelte-1l2xv2t a.svelte-1l2xv2t.svelte-1l2xv2t,
            .ios .Sports-header.svelte-1l2xv2t span.svelte-1l2xv2t.svelte-1l2xv2t,
            .ios .Sports-header.svelte-1l2xv2t nav.svelte-1l2xv2t.svelte-1l2xv2t,
            .android .Sports-header.svelte-1l2xv2t a.svelte-1l2xv2t.svelte-1l2xv2t,
            .android .Sports-header.svelte-1l2xv2t span.svelte-1l2xv2t.svelte-1l2xv2t,
            .android .Sports-header.svelte-1l2xv2t nav.svelte-1l2xv2t.svelte-1l2xv2t {
                z-index: 1
            }

            @media(min-width: 46.25em) {

                .ios .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t,
                .android .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: calc(100vw - var(--scroll-bar-width, 0px))
                }
            }

            .shapes.svelte-186u4lg {
                display: none;
                position: absolute;
                top: 0;
                right: -1px;
                height: 160px;
                width: auto;
                z-index: 19
            }

            @media(min-width: 71.25em) {
                .shapes.svelte-186u4lg {
                    display: block
                }
            }

            @media only screen and (max-width: 767px) {
                .logo img {
                    width: 60px !important;
                }

                /* .margin-dektop {
                    margin-left: 0px !important;
                } */
            }

            /* .margin-dektop {
                margin-left: 10px;
            } */



            @media (min-width: 91.25em) {
                .Sports-header.svelte-1l2xv2t.svelte-1l2xv2t.svelte-1l2xv2t {
                    width: 1396px;
                }
            }

            .navbar-nav {
                height: 50px;
            }

            .logo img {
                margin-right: 20px;
            }

            .ball.svelte-1nowxln {
                width: 36px;
                right: 241px;
                bottom: 38px;
            }

            .shapes.svelte-186u4lg {
                display: block;
                margin: 0px 1px;
            }

            @media (min-width: 71.25em) {}

            /* 90% css */
            @media (min-width: 1400px) and (max-width: 1699px) {
                .ball.svelte-1nowxln {
                    width: 36px;
                    right: 241px !important;
                    bottom: 38px;
                }

                .Euro-header-extension--white.svelte-vpg0bt .image-2.svelte-vpg0bt {
                    right: -400px !important;
                    top: 0px;
                }
            }

            /* 80% css */
            @media (min-width: 1700px) and (max-width: 1799px) {
                .Euro-header-extension--white.svelte-vpg0bt .image-2.svelte-vpg0bt {
                    right: -401px !important;
                    top: 0px;
                }

                .ball.svelte-1nowxln {
                    right: 240px !important;
                }
            }

            /* 75% css */
            @media (min-width: 1800px) and (max-width: 1899px) {
                .ball.svelte-1nowxln {
                    right: 240px;
                }

                .Sports-header {
                    margin: 1px 0px 0px 0px !important;
                }

                .Euro-header-extension--red.svelte-vpg0bt p.svelte-vpg0bt {
                    grid-area: text;
                    margin-top: 1px;
                }

                .player.svelte-1gus7fp.svelte-1gus7fp {
                    width: 108px;
                    right: 278px;
                    bottom: 39px !important;
                    background-color: #FFD900;
                }
            }

            /* 67% css */
            @media (min-width: 1900px) and (max-width: 2199px) {
                .shapes.svelte-186u4lg {
                    display: block;
                    margin: 0px 1px;
                }

                .Euro-header-extension--white.svelte-vpg0bt .image-2.svelte-vpg0bt {
                    right: -401px !important;
                    top: 0px;
                }
            }

            /* 50% css */
            @media (min-width: 2200px) and (max-width: 2999px) {
                .shapes.svelte-186u4lg {
                    display: block;
                    margin: 0px 0px;
                }

                .ball.svelte-1nowxln {
                    right: 240px !important;
                }
            }

            @media(max-width :992px) {
                .shapes.svelte-186u4lg {
                    display: none !important;
                    margin: 0px 1px;
                }

                .section-headlines-one p {
                    font-size: 1.5rem;
                }

                .ball.svelte-1nowxln {
                    display: none !important;
                }

                .description-second {
                    display: none;
                }

                .headlines-hides {
                    display: none;
                }
            }

            .fonts {
                font-size: 16px;
                font-family: "GH Guardian Headline", "Guardian Egyptian Web", Georgia, serif !important;
            }


            /* first section */
            .u-faux-block-link--hover {
                color: black !important;
                background-color: white;
            }

            @media (min-width: 91.25em) {
                .Euro-header-extension.svelte-vpg0bt.svelte-vpg0bt {
                    width: 1396px !important;
                }
            }

            @media (min-width: 71.25em) {
                .Euro-header-extension.svelte-vpg0bt.svelte-vpg0bt {
                    width: 1136px;
                }
            }

            @media (max-width: 768px) {
                .Euro-header-extension--red .image-1 {
                    content: url(../../worldcup/euro-img/player-guide-1-mobile.png);
                }
            }

            @media (max-width: 768px) {
                .Euro-header-extension--white .image-2 {
                    content: url(../../worldcup/euro-img/player-guide-2-mobile.png) !important;
                }

                .Euro-header-extension--white.svelte-vpg0bt .image-2.svelte-vpg0bt {
                    right: 10px !important;
                    top: 0px;
                }

                .player.svelte-1gus7fp.svelte-1gus7fp {
                    width: 77px !important;
                    right: 36px !important;
                    bottom: 55px !important;
                }
            }

            @media (max-width: 992px) {
                .player.svelte-1gus7fp.svelte-1gus7fp {
                    right: 36px !important;
                }
            }

            @media (max-width: 479.9px) {
                .dcr-5oiine {
                    padding-left: 20px;
                    padding-right: 20px;
                }
            }

            @media (max-width: 659.9px) {
                .dcr-ymokyv {
                    margin-left: 10px;
                    margin-right: -10px;
                    padding-left: 10px;
                    padding-right: 10px;
                }

                .section-headlines-one {
                    padding: 0px 10px;
                }

                .col-md-7,
                .col-md-2 {
                    padding: 0px 20px;
                }
            }



            .player.svelte-1gus7fp.svelte-1gus7fp {
                width: 108px;
                right: 278px;
                bottom: 38px;
                background-color: #FFD900;
            }

            .Euro-header-extension--white.svelte-vpg0bt .image-2.svelte-vpg0bt {
                right: -400px;
                top: 0px;
            }

            .top_right li {
                /* padding-left: 0.3px; */
                padding-left: 0.2px;
            }

            .top_right ul li a {
                padding-top: 0px;
            }
 
        /* <!-- end euro page css --> */



            /* Header Styling */
            .custom-header {
                background-color: #000;
                padding: 0px 80px;
            }

            .custom-nav {
                display: flex;
                align-items: center;
                justify-content: space-between;
            }

            .custom-nav-list {
                list-style: none;
                display: flex;
                align-items: center;
                width: 100%;
                padding: 0;
                height: 73px;
            }

            /* .custom-nav-list li {
                margin-right: 15px;
            } */

            .custom-logo {
                color: #ffffff;
                font-size: 26px;
                /* font-family: 'Euclid Circular A', "adobe-garamond-pro-1"; */
                padding-top: 18px;
                padding-bottom: 19px;
                padding-right: 23px;
                padding-left: 42px;
            }

            .custom-nav-link {
                display: block;
                text-decoration: none;
                float: left;
                color: #ffffff;
                padding-top: 21px;
                padding-bottom: 22px;
                padding-right: 10px;
                padding-left: 10px;
                font-size: 1.2rem;
                /* font-family: 'Euclid Circular A', "adobe-garamond-pro-1"; */
            }

            .custom-nav-link.active {
                background-color: #4a4a4a;
                /* border-radius: 4px; */
            }

            .custom-nav-link:hover {
                background-color: #4a4a4a;
                /* border-radius: 4px; */
            }

            @media (min-width: 801px) and (max-width: 1100px) {
                .custom-header {
                    /* background-color: #000; */
                    padding: 0px 0px;
                }

                #city_nav1 ul {
                    display: ruby;
                    margin-top: 20px;
                }

                .custom-section-box {
                    width: 100%;
                }

                #city_nav1 ul li a.act {
                    color: #ffffff;
                    background-color: #022C46;
                    margin-top: 20px;
                }
            }

            .desktop {
                background-image: url(https://www.diasporaglobal.org/worldcup/images/spacer.gif);
                background-repeat: repeat-x;
                /* background-position: center bottom; */
            }

            @media (max-width: 767px) {

                .desktop-city-name,
                .desktop {
                    display: none;
                }
            }

            @media (min-width: 767px) {
                .mobile-city-name {
                    display: none;
                }
            }

            .width-class {
                width: 10% !important;
            }

            @media (max-width: 800px) {
                .container {
                    padding-right: var(--bs-gutter-x, 0.5rem);
                    padding-left: var(--bs-gutter-x, -0.2rem);
                }

                /* Align header items for mobile */
                .custom-header {
                    padding: 10px 0px 0px 5px;
                    text-align: center;
                    height: 280px;
                }

                .custom-logo {
                    /* display: block;
                    text-align: center; */
                    margin-bottom: 10px;
                    color: #ffffff;
                    font-size: 26px;
                    /* font-family: 'Euclid Circular A', "adobe-garamond-pro-1"; */
                    padding-top: 18px;
                    padding-bottom: 19px;
                    padding-right: 43px;
                    padding-left: 42px;
                }

                .custom-nav {
                    flex-direction: column;
                    align-items: flex-start;
                }

                .custom-nav-list {
                    flex-direction: column;
                    align-items: flex-start;
                    /* border: 1px solid #4a4a4a; */
                    /* Add border to the menu */
                    width: 100%;
                }

                .custom-nav-list li:first-child {
                    /* width: 100%;
                    margin-bottom: 15px;
                    margin-top: 15px; */
                    display: none;
                    /* First li is full width */
                }

                .custom-nav-list li:last-child {
                    width: 100%;
                }

                .custom-nav-item-right {
                    margin-top: 10px;
                }

                .custom-nav-list li:not(:first-child):not(:last-child) {
                    width: 100%;
                    font-size: 14px;
                    /* border-radius: 0px; */
                    border: 1px solid #616161;
                    /* All other li elements are 50% width */
                }

                .custom-nav-link.active {
                    background-color: #4a4a4a;
                    border-radius: none;
                }


                .custom-nav-link {
                    width: 100%;
                    /* Make links span the full width */
                    text-align: left;
                    /* Align text to the left */
                    padding: 5px 15px;
                    border-bottom: 1px solid #4a4a4a;
                    font-size: 14px;
                    /* Add border between menu items */
                }

                .custom-nav-link:last-child {
                    border-bottom: none;
                    /* Remove border from the last item */
                }

                .custom-nav-item-right .custom-btn {
                    display: block;
                    width: 100%;
                    color: #fff;
                    text-align: start;
                    padding: 15px;
                    text-decoration: none;
                }

                .custom-section {
                    width: 100% !important;
                    margin: 0px 5px !important;
                }

                .custom-section-box {
                    display: block !important;
                    margin-right: 5px !important;
                }

                .custom-section {
                    padding: 10px 5px 0px 0px !important;
                }
            }



            /* Right Align Button with Full Height Background */
            .custom-nav-item-right {
                margin-left: auto;
                height: 100%;
                display: flex;
                align-items: center;
                background-color: #e64467;
                width: 28%;
            }

            .custom-btn {
                text-decoration: none;
                display: inline-block;
                color: #ffffff;
                padding-top: 18px;
                padding-bottom: 18px;
                text-align: center;
                font-size: 26px;
                width: 100%;
                clear: both;
            }

            .custom-btn:hover {
                text-decoration: underline;
            }

            /* Section Styling */
            .custom-section {
                margin: 20px auto;
                padding: 10px 0px 0px 0px;
            }

            .custom-section-box {
                background-color: #e64467;
                display: inline-block;
                padding: 15px 20px;
                margin-right: 58px;
            }


            .custom-section-text {
                font-size: 24px;
                color: #fff;
                font-weight: 400;
            }

            #city_nav1 ul {
                display: flex;
                list-style: none;
                padding: 0;
                margin: 0;
            }

            #city_nav1 ul li a {
                display: block;
                text-decoration: none;
                float: left;
                padding-top: 15px;
                padding-bottom: 16px;
                padding-right: 50px;
                padding-left: 50px;
                font-size: 1.2rem;
                font-weight: bold;
            }

            #city_nav1 ul li a.act {
                color: #ffffff;
                background-color: #022C46;
            }

            #city_nav1 ul li a:hover {
                background-color: #022C46;
                color: #fff;
            }

            #city_nav1 ul li a {
                color: black;
            }

            @media (max-width: 800px) {
                #city_nav1 ul {
                    display: ruby;
                    margin-top: 20px;
                    margin-left: 5px;
                }

                .custom-section-box {
                    width: 100%;
                }

                #city_nav1 ul li a.act {
                    color: #ffffff;
                    background-color: #022C46;
                    margin-top: 20px;
                }
            }

            tbody {
                display: table-row-group;
                vertical-align: middle;
                unicode-bidi: isolate;
                border-color: inherit;
            }

            .Euro-header-extension.svelte-vpg0bt.svelte-vpg0bt {
                margin-bottom: 0px;
            }

            .flag_border {
                border: 1px solid #737373;
            }

            .group-tab.active {
                background-color: #022C46;
                border-radius: 5px;
                padding: 5px 10px;
            }

            #city_nav1 ul li a.active {
                color: #ffffff;
            }

            /* Style for the stadium list items */
            .stadium-item {
                flex: 1 1 25%;
                max-width: 25%;
                list-style: none;
                text-align: center;
                margin-bottom: 15px;
            }

            .team_page_heading {
                background-image: url('../images/spacer.gif');
                background-repeat: repeat-x;
                background-position: center bottom;
            }

            /* Make the stadium items 100% width on smaller screens */
            @media (max-width: 768px) {
                .stadium-item {
                    flex: 1 1 100%;
                    max-width: 100%;
                    text-align: start;
                }

                #city_nav1 ul li a {
                    padding-left: 5px;
                }

                .stadium-img {
                    width: 100%;
                    padding: 0px 10px;
                }
            }
  

                 
            .city-image img {
                width: 100%;
                height: auto;
                display: block;
                margin-bottom: 15px;
                /* Adds spacing below the image for mobile */
            }

            .city-cap {
                font-size: 72px;
                display: block;
                float: left;
                line-height: 72px;
                height: 45px;
                padding: 0;
                margin: -16px 5px 0 0;
                color: #333;
                position: relative;
                text-transform: uppercase;
            }

            .big-image {
                width: 100%;
            }

            @media (max-width: 768px) {
                .city-image img {
                    margin-bottom: 0;
                    /* Removes unnecessary margin on smaller screens */
                }
            }

            @media (min-width: 71.25em) {
                .Sports-header--nav.svelte-1l2xv2t ul li a.svelte-1l2xv2t.svelte-1l2xv2t {
                    padding: 9px 0 10px 0px;
                }
            }
      

                    
            @font-face {
                font-family: 'Ultimate Battle';
                src: url('../css/UltimateBattle.ttf') format('truetype');
            }

            .day1-city_bg-color,
            .day1-city_bg-color-sponsor {
                font-family: 'Ultimate Battle', sans-serif;
            }

            .top_nav {
                margin: 0px;
            }

            .mobile-image-for {
                display: none;
            }

            @media (max-width: 768px) {
                .image-wrapper {
                    display: none;
                }

                .mobile-image-for {
                    display: flex;
                }

                .day1-city-image-right {
                    margin: 0px;
                }

                .for-mobile-view {
                    margin-top: 105px;
                }
            }
      

            
            :root {
                --w: 1100px;
                --h: 600px;
                --portrait-w: 360px;
                --thumb-w: 112px;
                --slide-duration: 5000ms;
            }

            .carousel {
                /* width: min(var(--w), calc(100% - 16px)); */
                /*height: 716px;*/
                height: 650px;
                margin: 18px auto;
                position: relative;
                overflow: hidden;
                /* border-radius: 2px; */
                background: #000;
                box-shadow: 0 6px 28px rgba(0, 0, 0, 0.7);
            }

            .bg-wrap {
                position: absolute;
                inset: 0;
                display: flex;
                z-index: 0;
                pointer-events: none;
            }

            .bg-side {
                flex: 1;
                background-size: cover;
                background-position: center;
                /*filter: blur(2.5px) brightness(0.6) saturate(0.6);*/
                filter: blur(2.5px) opacity(60%);
                transform: scale(1.25);
                transition: background-image 450ms ease;
            }
            .bg-side::before {
                content: "";
                position: absolute;
                inset: 0;
                background: linear-gradient(
                    0deg,
                    rgba(0, 0, 0, 1) 0%,  
                    rgba(0, 0, 0, 1) 10%,  
                    rgba(0, 0, 0, 0) 100%
                );
                backdrop-filter: blur(10px) opacity(60%);
                -webkit-backdrop-filter: blur(10px);
            }

            .bg-side.left {
                transform-origin: left center;
            }

            .bg-side.right {
                transform-origin: right center;
            }

            .center-gradient {
                position: absolute;
                inset: 0;
                background: linear-gradient(90deg, rgba(6, 14, 26, 0.85) 0%, rgba(6, 14, 26, 0.0) 30%, rgba(6, 14, 26, 0.0) 70%, rgba(6, 14, 26, 0.85) 100%);
                z-index: 1;
                pointer-events: none;
            }

            /* center portrait column */
            .center-stage {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                z-index: 2;
                display: flex;
                align-items: center;
                justify-content: center;
                height: 100%;
                /* width: var(--portrait-w); */
                width: 40%;
                width: 35%;
                pointer-events: none;
            }

            .portrait {
                width: 100%;
                height: 100%;
                /*border-radius: 2px;*/
                overflow: hidden;
                box-shadow: 0 20px 60px rgba(0, 0, 0, 0.75), inset 0 -60px 80px rgba(0, 0, 0, 0.15);
            }

            .portrait img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                display: block;
            }

            .top-label {
                display: none;
            }

            .city-title {
                display: none;
            }

            .bottom-panel {
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                z-index: 4;
                height: 19%;
                padding: 18px 20px;
                background: linear-gradient(0deg, rgb(0 0 0) 0%, rgb(0 0 0) 50%, rgb(0 0 0 / 97%), rgb(0 0 0 / 70%), rgb(0 0 0 / 3%) 100%);
                display: flex;
                align-items: flex-end;
                gap: 20px;
                /*background-color: #000000f0;*/
                justify-content: center;
            }

            .info-left {
                width: 58%;
                max-width: 700px;
                padding-left: 8px;
                /*margin-bottom: 50px;*/
            }

            .info-left h3 {
                margin: 6px 0 25px 0;
                font-size: 20px;
                font-weight: 600;
                color: #fff;
            }

            .info-left p {
                margin: 0;
                font-size: 13px;
                color: #d5d8dd;
                line-height: 1.45;
                max-width: 520px;
            }

            .progress-wrap {
                margin-top: 7%;
                width: 77%;
                height: 4px;
                background: rgba(255, 255, 255, 0.07);
                border-radius: 3px;
                overflow: hidden;
            }

            .progress {
                height: 100%;
                width: 0%;
                background: linear-gradient(90deg, #fff, #cfcfcf);
                transition: width linear;
            }

            .thumbs-right {
                margin-left: auto;
                display: flex;
                align-items: center;
                gap: 40px;
                max-width: 50%;
                padding-right: 6px;
                flex-wrap: nowrap;
                height: 85px;
                overflow-x: auto;
                /* enable horizontal scrolling */
                -webkit-overflow-scrolling: touch;
                /* smooth scrolling on iOS */
                scrollbar-width: none;
                /* firefox */
                scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
            }

            .thumb-item {
                display: inline-flex;
                flex-direction: column;
                align-items: center;
                gap: 6px;
                width: var(--thumb-w);
                flex: 0 0 var(--thumb-w);
                /* fixed width */
                cursor: pointer;
                user-select: none;
            }

            .thumbs-right::-webkit-scrollbar {
                height: 8px;
            }

            .thumbs-right::-webkit-scrollbar-thumb {
                background: rgba(255, 255, 255, 0.12);
                border-radius: 6px;
            }

            .thumbs-right::-webkit-scrollbar-track {
                background: transparent;
            }

            .thumbs-right::-webkit-scrollbar {
                display: none;
            }


            .thumb-item {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 10px;
                width: var(--thumb-w);
                flex: 0 0 var(--thumb-w);
                cursor: pointer;
                user-select: none;
            }

            .thumb {
                width: 140px;
                height: 80px;
                /*border-radius: 3px;*/
                background-size: cover;
                background-position: center;
                /*box-shadow: 0 6px 16px rgba(0, 0, 0, 0.6) inset;*/
                border: 1px solid transparent;
                /*transition: transform .18s ease, border-color .18s ease, opacity .18s ease;*/
                opacity: 0.85;
            }

            .thumb-name {
                display: none;
            }

            .thumb-item.active .thumb {
                border-color: rgba(255, 255, 255, 0.95);
                /*transform: translateY(-6px);*/
                opacity: 1;
            }

            .nav-left {
                position: absolute;
                bottom: 30px;
                /*left: 48%;*/
                transform: translateX(-50%);
                z-index: 5;
                width: 28px;
                height: 28px;
                border-radius: 14px;
                /* background: rgba(0,0,0,0.45); */
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                /* box-shadow:0 2px 8px rgba(0,0,0,0.6); */
                /* border:1px solid rgba(255,255,255,0.06); */
            }

            .nav-left svg {
                transform: translateX(1px);
                stroke: #fff;
                opacity: 0.95;
            }

            .nav-right {
                position: absolute;
                bottom: 30px;
                /*left: 92%;*/
                transform: translateX(-50%);
                z-index: 5;
                width: 28px;
                height: 28px;
                border-radius: 14px;
                /* background: rgba(0,0,0,0.45); */
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                /* box-shadow:0 2px 8px rgba(0,0,0,0.6); */
                /* border:1px solid rgba(255,255,255,0.06); */
            }

            .nav-right svg {
                transform: translateX(1px);
                stroke: #fff;
                opacity: 0.95;
            }

            /* responsive */
            @media (max-width: 980px) {
                :root {
                    --portrait-w: 320px;
                }

                .city-title {
                    font-size: 52px;
                    top: 36px;
                }

                .carousel {
                    height: 520px;
                }
            }

            @media (max-width: 640px) {
                :root {
                    --portrait-w: 220px;
                    --thumb-w: 88px;
                }

                .carousel {
                    height: 420px;
                }

                .city-title {
                    font-size: 28px;
                    top: 18px;
                }

                .info-left {
                    display: none;
                }

            }
            .my-position-absolut {
                position: absolute;
                display: flex;
                justify-content: space-around;
            }
            .col-lg-6{
                display: flex;
                justify-content: flex-end;
            }
            .row {
                width: 100%;
            }

           .space-image-map-section {
            margin-top: 20px;
           }
           @media (max-width: 320px){
                .padding-0px {
                    padding: 0px !important;
                }
                .day1-city_bg-color{
                    font-size: 18px !important;
                }
                .for-mobile-welcome-text {
                    width: 96%;
                }
                .for-mobile-view {
                    margin-top: 10px !important;
                }
           }

           .day1-city_bg-color-sponsor {
            margin-left: 0px;
           }

           @media (max-width: 375px){
                .padding-0px {
                    padding: 0px !important;
                }
                .day1-city_bg-color{
                    font-size: 18px !important;
                }
                .for-mobile-welcome-text {
                    width: 96%;
                }
                .for-mobile-view {
                    margin-top: 10px !important;
                }
           }
           @media (max-width: 430px){
                .padding-0px {
                    padding: 0px !important;
                }
                .day1-city_bg-color{
                    font-size: 18px !important;
                }
                .for-mobile-welcome-text {
                    width: 96%;
                }
                .for-mobile-view {
                    margin-top: 10px !important;
                }
           }
           @media (max-width: 790px){
                .padding-0px {
                    padding: 0px !important;
                }
                .day1-city_bg-color{
                    font-size: 18px !important;
                }
                .for-mobile-welcome-text {
                    width: 96%;
                }
                .for-mobile-view {
                    margin-top: 10px !important;
                }
           }
           @media (max-width:830px){
                .padding-0px {
                    padding: 0px !important;
                }
                .day1-city_bg-color{
                    font-size: 18px !important;
                }
                .for-mobile-welcome-text {
                    width: 96%;
                }
                .for-mobile-view {
                    margin-top: 10px !important;
                }
           }
        
            
     
             .carousel-wrapper {
                width: 100%;
                max-width: 600px;
                margin: 0 auto;
                height: 490px;
                position: relative;
                overflow: hidden;
            }
            
            .location-title {
                text-align: start;
                padding: 24px 0 20px;
                font-size: 24px;
                margin-left: 7%;
                font-weight: bold;
                font-family: 'Poppins', sans-serif;
                /*text-transform: uppercase;*/
                color: #fff;
            }
            
            .image-track {
              display: flex;
              gap: 10px;
              overflow-x: auto; 
              padding: 10px;
              scroll-snap-type: x mandatory;
              scrollbar-width: none;  /* Firefox ke liye */
              -ms-overflow-style: none; /* IE/Edge ke liye */
            }
            .image-track::-webkit-scrollbar {
              display: none; /* Chrome ke liye scrollbar hide */
            }
            
            .carousel-items {
              flex: 0 0 auto;
              width: 91%;
              max-width: 600px;
              scroll-snap-align: center;
            }

            .carousel-items img {
              width: 100%;
              height: 200px;
              object-fit: cover;
            }
            
            .city-info {
                padding: 20px;
                text-align: center;
                font-size: 13px;
                line-height: 1.5;
                color: #fff;
                font-family: 'Poppins', sans-serif;
                /*background-color: #f9f9f9;*/
            }
            
            .timer-container {
                width: 100%;
                height: 4px;
                background-color: #333;
                position: relative;
                margin-top: 35px;
            }
            
            .timer-indicator {
                height: 100%;
                width: 0%;
                background-color: #e0e0e0;
                animation: fillTimer 5s linear forwards;
            }
            
           
             .d-none-for-desktop {
              display: block !important;
              background-color: #000;
            }
            .d-none-for-mobile {
              display: none !important;
            }
            .to-mobilr-view-for-d-n {
                display: none !important;
              }
              .to-mobile-view-for-d-f {
                display: flex !important;
              }
              .space-image-map-section-mobile-view-gap {
                display: none ;
              }
              .space-image-map-section {
                display: block;
              }
              @media (max-width: 992px){
                .space-image-map-section-mobile-view-gap {
                display: block !important;
                margin-top: 14px;   
              }
              .space-image-map-section {
                display: none !important;
              }
              }
            @media only screen and (min-width: 992px) {
                
              .d-none-for-desktop {
                display: none !important;
              }
              .d-none-for-mobile {
                display: block !important;
              }
              .to-mobilr-view-for-d-n {
                display: flex !important;
              }
              .to-mobile-view-for-d-f {
                display: none !important;
              }
              
            }

       

            @media (max-width: 999px) {
                .for-mobile-welcome-text {
                    width: 96%;
                    margin: 0 14px;
                    text-align: left;
                }
            }
             @media (max-width: 440px){
              .mo-top-nav>ul{
                flex-wrap: nowrap;
            }
              .mo-top-nav>ul>li {
                padding: 3.5%;
                
            }
              .mo-top-nav>ul>li>a {
                font-size: 13px;
            }
        }
        
        @media (max-width: 414px){
              .mo-top-nav>ul{
                flex-wrap: nowrap;
            }
              .mo-top-nav>ul>li {
                padding: 3% !important;
                
            }
              .mo-top-nav>ul>li>a {
                font-size: 13px;
            }
        }
        
        @media (max-width: 390px){
              .mo-top-nav>ul{
                flex-wrap: nowrap;
            }
              .mo-top-nav>ul>li {
                padding: 2.5% !important;
                
            }
              .mo-top-nav>ul>li>a {
                font-size: 13px;
            }
        }
        
        @media (max-width: 375px){
              .mo-top-nav>ul{
                flex-wrap: nowrap;
            }
              .mo-top-nav>ul>li {
                padding: 2% !important ;
                
            }
              .mo-top-nav>ul>li>a {
                font-size: 13px;
            }
        }
        
        @media (max-width: 360px){
              .mo-top-nav>ul{
                flex-wrap: nowrap;
            }
              .mo-top-nav>ul>li {
                padding: 1.7% !important;
                
            }
              .mo-top-nav>ul>li>a {
                font-size: 13px;
            }
        }
        
        @media (max-width: 344px){
              .mo-top-nav>ul{
                flex-wrap: nowrap;
            }
              .mo-top-nav>ul>li {
                padding: 1.1% !important;
                
            }
              .mo-top-nav>ul>li>a {
                font-size: 13px;
            }
        }
        
        @media (width: 320px){
              .mo-top-nav>ul{
                flex-wrap: nowrap;
            }
              .mo-top-nav>ul>li {
                padding: 0% !important;
                
            }
              .mo-top-nav>ul>li>a {
                font-size: 14px;
            }
        }
    


      
        footer {
            margin-top: 2% !important;
        }