  <header id="header" class="header sticky-top">

    <!-- <div class="topbar d-flex align-items-center">
      <div class="container d-flex justify-content-center justify-content-md-between">
        <div class="contact-info d-flex align-items-center">
          <i class="bi bi-envelope d-flex align-items-center"><a href="mailto:contact@example.com">info@mopoinvest.ltd</a></i>
          <i class="bi bi-phone d-flex align-items-center ms-4"><span>+254 111 323 796</span></i>
        </div>
        <div class="social-links d-none d-md-flex align-items-center">
          <a href="#" class="twitter"><i class="bi bi-twitter-x"></i></a>
          <a href="#" class="facebook"><i class="bi bi-facebook"></i></a>
          <a href="#" class="instagram"><i class="bi bi-instagram"></i></a>
          <a href="#" class="linkedin"><i class="bi bi-linkedin"></i></a>
        </div>
      </div>
    </div> -->
    <!-- End Top Bar -->

    <div class="branding d-flex align-items-center">

      <div class="container position-relative d-flex align-items-center justify-content-between">
        <a href="/" class="logo d-flex align-items-center me-auto">
          <!-- Uncomment the line below if you also wish to use an image logo -->
          <!-- <img src="wsite/assets/img/mopo_logo.png" alt=""> -->
          <h1 class="sitename"> Farm & Stay </h1>
        </a>

        <nav id="navmenu" class="navmenu">
          <ul>
            <li><a href="/" class="active">Home<br></a></li>
            <!-- <li><a href="about-us.php">About</a></li>
            <li><a href="services.php">Services</a></li> -->
            <!-- <li><a href="amenities.php">Amenities </a></li> -->
            <li><a href="rooms">   Accomodation </a></li>
            <li><a href="amenities"> Amenities </a></li>
            <li><a href="#">  Our Farm </a></li>
            <li><a href="direction">  Directions </a></li>
            <!-- <li><a href="booking.php">Book a room </a></li> -->
            <li><a href="gallery">Gallery</a></li>
            <li class="dropdown"><a href="#"><span> My Account  </span> <i class="bi bi-chevron-down  toggle-dropdown"></i></a>
          
            <!--<li class="dropdown"><a href="#"><span><i class="fa fa-user fa-lg toggle-dropdown "></i> </span> <i class="bi bi-chevron-down "></i></a>-->
            <!-- <li class="dropdown"><a href="#"><span><i class="fa fa-user-plus fa-lg toggle-dropdown "></i></span> </a> -->
              <ul>
                <li><a href="vis/vlogin.php">  <span> Login </span> <i class="fa fa-user-plus"></i>  </a></li>
                <li> <a href="vis/vregister.php">  <span> Register </span> <i class="fa fa-user-plus"></i>  </a></li>
                
              </ul>
            </li>
            <!-- <li><a href="branches.php">Branches</a></li> -->
            <!-- <li><a href="team.php"> Our Team</a></li> -->
           
            <!-- <li><a href="contact.php">Contact</a></li> -->
          </ul>
          <i class="mobile-nav-toggle d-xl-none bi bi-list"></i>
        </nav>

        <a class="cta-btn d-none d-sm-block" href="booking.php" style="background-color:#f2f;"> <i class="fa fa-calendar "></i> Book a room</a>

      </div>

    </div>

  </header>