<html><head></head><body><header data-component-type="Navigation" class="w-full z-50 relative top-0 transition-all duration-300" data-component-slug="sports-template-navbar">
  <nav class="max-w-[1400px] mx-3 md:mx-3 sm:mx-3 lg:mx-3 xl:mx-auto px-5 py-0 h-[100px] flex sticky top-0 justify-between items-center border-[#ECE9E4] bg-[#111111] shadow-lg backdrop-blur">
    <!-- Mobile Menu Button -->
    <button id="menu-btn" class="md:hidden focus:outline-none order-1">
      <svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
        <path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16"></path>
      </svg>
    </button>

    <!-- Logo -->
    <div class="flex items-center gap-2 text-2xl font-bold order-2 md:order-1 ml-auto md:ml-0">
      <img data-node="logo" data-node-type="file" data-node-label="Logo" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767338041/seltrix/templates/sports-template/Logo.png" src="{{logo}}" class="w-[200px] h-auto" alt="Logo">
    </div>

    <!-- Desktop Menu -->
    <ul class="hidden md:flex space-x-6 order-2">
      <!-- HOME -->
       {{#if show_nav_item_1}}
      <li>
        <a data-node="nav_item_1" data-node-type="page_links" data-node-label="Nav 1 Link" href="{{nav_item_1}}" data-node-default="/" class="nav-link text-white transition hover:bg-[#940F0F80] px-[20px] py-[39px]">
          <span data-node="nav_item_1_text" data-node-type="text" data-node-label="Nav 1 Text" data-node-default="Home">
            {{nav_item_1_text}}
          </span>
        </a>
      </li>
       {{/if}} {{#if show_nav_item_2}}
      <!-- ABOUT -->
      <li>
        <a data-node="nav_item_2" data-node-type="page_links" data-node-label="Nav 2 Link" href="{{nav_item_2}}" data-node-default="#" class="nav-link text-white transition hover:bg-[#940F0F80] px-[20px] py-[39px]">
          <span data-node="nav_item_2_text" data-node-type="text" data-node-label="Nav 2 Text" data-node-default="About">
            {{nav_item_2_text}}
          </span>
        </a>
      </li>
      {{/if}} {{#if show_nav_item_3}}
      <!-- GALLERY -->
      <li>
        <a data-node="nav_item_3" data-node-type="page_links" data-node-label="Nav 3 Link" href="{{nav_item_3}}" data-node-default="#" class="nav-link text-white transition hover:bg-[#940F0F80] px-[20px] py-[39px]">
          <span data-node="nav_item_3_text" data-node-type="text" data-node-label="Nav 3 Text" data-node-default="Gallery">
            {{nav_item_3_text}}
          </span>
        </a>
      </li>
      {{/if}} {{#if show_nav_item_4}}

      <!-- NEWS -->
      <li>
        <a data-node="nav_item_4" data-node-type="page_links" data-node-label="Nav 4 Link" href="{{nav_item_4}}" data-node-default="#" class="nav-link text-white transition hover:bg-[#940F0F80] px-[20px] py-[39px]">
          <span data-node="nav_item_4_text" data-node-type="text" data-node-label="Nav 4 Text" data-node-default="News">
            {{nav_item_4_text}}
          </span>
        </a>
      </li>
       {{/if}} {{#if show_nav_item_5}}
      <!-- CONTACT -->
      <li>
        <a data-node="nav_item_5" data-node-type="page_links" data-node-label="Nav 5 Link" href="{{nav_item_5}}" data-node-default="#" class="nav-link text-white transition hover:bg-[#940F0F80] px-[20px] py-[39px]">
          <span data-node="nav_item_5_text" data-node-type="text" data-node-label="Nav 5 Text" data-node-default="Contact">
            {{nav_item_5_text}}
          </span>
        </a>
      </li>
       {{/if}}
    </ul>
  </nav>

  <!-- Mobile Menu -->
  <div id="mobile-menu" class="fixed top-0 left-0 w-full h-full bg-[#111111] -translate-x-full transition-transform duration-300 z-[900]">
    <div class="flex justify-between items-center px-6 py-4 border-b border-[white]">
      <span class="text-xl font-bold text-white">Menu</span>
      <button id="close-btn" class="text-white focus:outline-none">
        <svg class="w-6 h-6" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
          <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path>
        </svg>
      </button>
    </div>

    <ul class="flex flex-col space-y-6 mt-6 px-6">
      <!-- HOME -->
         {{#if show_mobile_nav_item_1}}
      <li>
        <a data-node="m_nav_item_1" data-node-type="page_links" href="{{m_nav_item_1}}" data-node-default="/" class="nav-link text-white transition">
          <span data-node="m_nav_item_1_text" data-node-type="text" data-node-default="Home">
            {{m_nav_item_1_text}}
          </span>
        </a>
      </li>

      <!-- ABOUT -->
         {{/if}} {{#if show_mobile_nav_item_2}}
      <li>
        <a data-node="m_nav_item_2" data-node-type="page_links" href="{{m_nav_item_2}}" data-node-default="/aboutus" class="nav-link text-white transition">
          <span data-node="m_nav_item_2_text" data-node-type="text" data-node-default="About">
            {{m_nav_item_2_text}}
          </span>
        </a>
      </li>
       {{/if}} {{#if show_mobile_nav_item_3}}
      <!-- GALLERY -->
      <li>
        <a data-node="m_nav_item_3" data-node-type="page_links" href="{{m_nav_item_3}}" data-node-default="/gallery" class="nav-link text-white transition">
          <span data-node="m_nav_item_3_text" data-node-type="text" data-node-default="Gallery">
            {{m_nav_item_3_text}}
          </span>
        </a>
      </li>
        {{/if}} {{#if show_mobile_nav_item_4}}
      <!-- NEWS -->
      <li>
        <a data-node="m_nav_item_4" data-node-type="page_links" href="{{m_nav_item_4}}" data-node-default="/news" class="nav-link text-white transition">
          <span data-node="m_nav_item_4_text" data-node-type="text" data-node-default="News">
            {{m_nav_item_4_text}}
          </span>
        </a>
      </li>
        {{/if}} {{#if show_mobile_nav_item_5}}
      <!-- CONTACT -->
      <li>
        <a data-node="m_nav_item_5" data-node-type="page_links" href="{{m_nav_item_5}}" data-node-default="/contactus" class="nav-link text-white transition">
          <span data-node="m_nav_item_5_text" data-node-type="text" data-node-default="Contact">
            {{m_nav_item_5_text}}
          </span>
        </a>
      </li>
       {{/if}}
    </ul>
  </div>
</header></body></html>