<!DOCTYPE html>
<html>

<head>
  <title>SpotHero</title>
  <link rel="stylesheet" href="styles.css">
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>

</head>

<body>
  <header>
    <div class="container-fluid">
      <div class="top-head">
        <nav class="navbar navbar-expand-lg navbar-light ">
          <div class="container-fluid">
            <div class="logo">
              <a class="navbar-brand" href="#"> <img src="logo-parkify-ca.png" alt="SpotHero Logo"></a>
            </div>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
              <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNavDropdown">
              <ul class="navbar-nav ml-auto">
                <li class="nav-item">
                  <a class="nav-link active" aria-current="page" href="#">About</a>
                </li>

                <li class="nav-item">
                  <svg viewBox="0 0 24 24" focusable="false" height="12px" class="chakra-icon css-oqor5s" alt="Smartphone Icon" data-testid="header-menu-get-app-icon"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
                      <path d="M17 1.01L7 1c-1.1 0-2 .9-2 2v18c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2V3c0-1.1-.9-1.99-2-1.99zM17 19H7V5h10v14z"></path>
                    </svg></svg>
                  <a class="nav-link" href="#">Get the App</a>
                </li>
                <li class="nav-item">
                  <svg viewBox="0 0 24 24" focusable="false" height="12px" class="chakra-icon css-2lojbv" alt="Account Icon" data-testid="login-status-logo"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
                      <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM7.07 18.28c.43-.9 3.05-1.78 4.93-1.78s4.51.88 4.93 1.78C15.57 19.36 13.86 20 12 20s-3.57-.64-4.93-1.72zm11.29-1.45c-1.43-1.74-4.9-2.33-6.36-2.33s-4.93.59-6.36 2.33C4.62 15.49 4 13.82 4 12c0-4.41 3.59-8 8-8s8 3.59 8 8c0 1.82-.62 3.49-1.64 4.83zM12 6c-1.94 0-3.5 1.56-3.5 3.5S10.06 13 12 13s3.5-1.56 3.5-3.5S13.94 6 12 6zm0 5c-.83 0-1.5-.67-1.5-1.5S11.17 8 12 8s1.5.67 1.5 1.5S12.83 11 12 11z"></path>
                    </svg></svg>
                  <a class="nav-link" href="#">Log in or Sign Up</a>
                </li>

              </ul>
            </div>
          </div>
        </nav>

      </div>
      <section class="hero">
        <div class="container">
          <div class="car">
            <svg focusable="false" class="Icon chakra-icon css-ybmklk" height="35px" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 1024 1024" fill="currentColor">
              <path d="M812.8 953.6c0 38.4-134.4 70.4-300.8 70.4s-300.8-32-300.8-73.6C211.2 912 345.6 880 512 880s300.8 32 300.8 73.6M995.2 240v48c0 9.6-6.4 16-16 16l-51.2 3.2c-9.6 0-16 6.4-16 16l-16 371.2c0 6.4-9.6 16-19.2 16H774.4c-9.6 0-22.4-9.6-22.4-19.2V592c0-9.6-6.4-16-16-16-73.6 6.4-150.4 9.6-224 9.6-76.8 0-150.4-3.2-224-9.6-9.6 0-16 6.4-16 16v99.2c0 9.6-12.8 19.2-22.4 19.2H147.2c-12.8 0-19.2-6.4-19.2-16l-16-371.2c0-9.6-6.4-16-16-16L44.8 304c-9.6 0-16-6.4-16-16v-48c0-9.6 6.4-16 16-16h89.6c6.4 0 16-6.4 16-16 6.4-32 35.2-86.4 48-115.2 16-25.6 48-92.8 144-92.8h339.2c96 0 128 67.2 140.8 92.8 12.8 28.8 41.6 83.2 48 115.2 3.2 9.6 9.6 16 19.2 16h89.6c9.6 0 16 6.4 16 16M368 374.4c0-35.2-12.8-60.8-86.4-60.8-64 0-67.2 28.8-67.2 60.8s25.6 51.2 67.2 51.2c44.8 0 86.4-19.2 86.4-51.2m144-147.2c144 0 259.2 6.4 259.2 6.4s-16-54.4-32-86.4C710.4 92.8 668.8 96 640 96H390.4c-32 0-73.6 0-99.2 51.2-19.2 32-32 86.4-32 86.4s108.8-6.4 252.8-6.4m297.6 147.2c0-35.2-3.2-60.8-67.2-60.8-73.6 0-86.4 28.8-86.4 60.8s38.4 51.2 86.4 51.2c44.8 0 67.2-19.2 67.2-51.2"></path>
            </svg>
          </div>

          <div class="col-9 mx-auto text_box">
            <h1>Reserve Parking Now & Save</h1>
            <div class="main-tab">
              <ul class="nav nav-pills mb-3 border-bottom border-1" id="pills-tab" role="tablist">
                <li class="nav-item" role="presentation">
                  <button class="nav-link text-primary fw-semibold active position-relative" id="pills-home-tab" data-bs-toggle="pill" data-bs-target="#pills-home" type="button" role="tab" aria-controls="pills-home" aria-selected="true">Hourly</button>
                </li>
                <li class="nav-item" role="presentation">
                  <button class="nav-link text-primary fw-semibold position-relative" id="pills-profile-tab" data-bs-toggle="pill" data-bs-target="#pills-profile" type="button" role="tab" aria-controls="pills-profile" aria-selected="false">Monthly</button>
                </li>
                <li class="nav-item" role="presentation">
                  <button class="nav-link text-primary fw-semibold position-relative" id="pills-contact-tab" data-bs-toggle="pill" data-bs-target="#pills-contact" type="button" role="tab" aria-controls="pills-contact" aria-selected="false">Airport</button>
                </li>
              </ul>
            </div>
            <div class="tab-content  rounded-3 " id="pills-tabContent">
              <div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">

              </div>
              <div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">

              </div>

              <form class="search-form">
                <div class="main-div">
                  <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="25px" viewBox="0 0 24 24" class="Icon">
                    <path d="M10.172 17.987a7.95 7.95 0 0 0 4.897-1.688l4.396 4.396 1.414-1.414-4.396-4.396a7.95 7.95 0 0 0 1.689-4.898c0-4.41-3.59-8-8-8s-8 3.59-8 8 3.589 8 8 8m0-14c3.309 0 6 2.691 6 6s-2.691 6-6 6-6-2.69-6-6 2.69-6 6-6"></path>
                  </svg>
                  <input type="text" placeholder="Address, Place, City or Venue" class="search_box">
                  <button type="submit" class="sub-btn">Search</button>
                </div>
              </form>
              <div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">
                <ul class="AutoSuggestInput-suggestions">
                  <li class="AutoSuggestInput-item AutoSuggestInput-item-active">Reno-Tahoe International Airport (RNO)</li>
                  <li class="AutoSuggestInput-item">Cleveland Hopkins International Airport (CLE)</li>
                  <li class="AutoSuggestInput-item">Harry Reid International Airport (LAS)</li>
                  <li class="AutoSuggestInput-item">Miami International Airport, Northwest 42nd Avenue (MIA)</li>
                  <li class="AutoSuggestInput-item">Palm Springs International Airport (PSP)</li>
                  <li class="AutoSuggestInput-item">Bradley International Airport (BDL)</li>
                  <li class="AutoSuggestInput-item">Dallas/Fort Worth International Airport (DFW)</li>
                  <li class="AutoSuggestInput-item">Minneapolis–Saint Paul International Airport (MSP)</li>
                  <li class="AutoSuggestInput-item">Hartsfield–Jackson Atlanta International Airport (ATL)</li>
                  <li class="AutoSuggestInput-item">John Wayne Airport (SNA)</li>
                  <li class="AutoSuggestInput-item">Seattle–Tacoma International Airport (SEA)</li>
                  <li class="AutoSuggestInput-item">Dallas Love Field (DAL)</li>
                  <li class="AutoSuggestInput-item">O'Hare International Airport (ORD)</li>
                  <li class="AutoSuggestInput-item">Burlington International Airport (BTV)</li>
                  <li class="AutoSuggestInput-item">Birmingham-Shuttlesworth International Airport (BHM)</li>
                  <li class="AutoSuggestInput-item">George Bush Intercontinental Airport (IAH)</li>
                  <li class="AutoSuggestInput-item">El Paso International Airport (ELP)</li>
                  <li class="AutoSuggestInput-item">John Glenn Columbus International Airport (CMH)</li>
                  <li class="AutoSuggestInput-item">Burke Lakefront Airport (BKL)</li>
                  <li class="AutoSuggestInput-item">General Mitchell International Airport (MKE)</li>
                  <li class="AutoSuggestInput-item">Billy Bishop Toronto City Airport (YTZ)</li>
                  <li class="AutoSuggestInput-item">James M. Cox Dayton International Airport (DAY)</li>
                  <li class="AutoSuggestInput-item">Oakland International Airport (OAK)</li>
                  <li class="AutoSuggestInput-item">Ottawa International Airport (YOW)</li>
                  <li class="AutoSuggestInput-item">Newark Liberty International Airport (EWR)</li>
                  <li class="AutoSuggestInput-item">Austin–Bergstrom International Airport (AUS)</li>
                  <li class="AutoSuggestInput-item">Kansas City International Airport (MCI)</li>
                  <li class="AutoSuggestInput-item">Pittsburgh International Airport (PIT)</li>
                  <li class="AutoSuggestInput-item">Philadelphia International Airport (PHL)</li>
                  <li class="AutoSuggestInput-item">Louis Armstrong New Orleans International Airport (MSY)</li>
                  <li class="AutoSuggestInput-item">Toronto Pearson International Airport (YYZ)</li>
                  <li class="AutoSuggestInput-item">Norman Y. Mineta San Jose International Airport (SJC)</li>
                  <li class="AutoSuggestInput-item">Buffalo Niagara International Airport (BUF)</li>
                  <li class="AutoSuggestInput-item">Richmond International Airport (RIC)</li>
                  <li class="AutoSuggestInput-item">Orlando International Airport (MCO)</li>
                  <li class="AutoSuggestInput-item">Portland International Jetport (PWM)</li>
                  <li class="AutoSuggestInput-item">William P. Hobby Airport (HOU)</li>
                  <li class="AutoSuggestInput-item">Ontario International Airport (ONT)</li>
                  <li class="AutoSuggestInput-item">Sarasota Bradenton International Airport (SRQ)</li>
                  <li class="AutoSuggestInput-item">T. F. Green Airport (PVD)</li>
                  <li class="AutoSuggestInput-item">Indianapolis International Airport (IND)</li>
                  <li class="AutoSuggestInput-item">Long Island MacArthur Airport (ISP)</li>
                  <li class="AutoSuggestInput-item">Hollywood Burbank Airport (BUR)</li>
                  <li class="AutoSuggestInput-item">Washington Dulles International Airport (IAD)</li>
                  <li class="AutoSuggestInput-item">Chicago Midway International Airport (MDW)</li>
                  <li class="AutoSuggestInput-item">Jacksonville International Airport (JAX)</li>
                  <li class="AutoSuggestInput-item">St. Louis Lambert International Airport (STL)</li>
                  <li class="AutoSuggestInput-item">Memphis International Airport (MEM)</li>
                  <li class="AutoSuggestInput-item">Salt Lake City International Airport (SLC)</li>
                  <li class="AutoSuggestInput-item">Albuquerque International Sunport (ABQ)</li>
                  <li class="AutoSuggestInput-item">Fort Lauderdale–Hollywood International Airport (FLL)</li>
                  <li class="AutoSuggestInput-item">Will Rogers World Airport (OKC)</li>
                  <li class="AutoSuggestInput-item">San Francisco International Airport (SFO)</li>
                  <li class="AutoSuggestInput-item">Logan International Airport (BOS)</li>
                  <li class="AutoSuggestInput-item">Denver International Airport (DEN)</li>
                  <li class="AutoSuggestInput-item">Calgary International Airport (YYC)</li>
                  <li class="AutoSuggestInput-item">San Diego International Airport (SAN)</li>
                  <li class="AutoSuggestInput-item">Ronald Reagan Washington National Airport (DCA)</li>
                  <li class="AutoSuggestInput-item">Tulsa International Airport (TUL)</li>
                  <li class="AutoSuggestInput-item">Portland International Airport (PDX)</li>
                  <li class="AutoSuggestInput-item">Bill and Hillary Clinton National Airport (LIT)</li>
                  <li class="AutoSuggestInput-item">Norfolk International Airport (ORF)</li>
                  <li class="AutoSuggestInput-item">Raleigh-Durham International Airport (RDU)</li>
                  <li class="AutoSuggestInput-item">Westchester County Airport (HPN)</li>
                  <li class="AutoSuggestInput-item">Nashville International Airport (BNA)</li>
                  <li class="AutoSuggestInput-item">Tampa International Airport (TPA)</li>
                  <li class="AutoSuggestInput-item">Phoenix Sky Harbor International Airport (PHX)</li>
                  <li class="AutoSuggestInput-item">Charlotte Douglas International Airport (CLT)</li>
                  <li class="AutoSuggestInput-item">Los Angeles International Airport (LAX)</li>
                  <li class="AutoSuggestInput-item">Tucson International Airport (TUS)</li>
                  <li class="AutoSuggestInput-item">Edmonton International Airport (YEG)</li>
                  <li class="AutoSuggestInput-item">Daniel K. Inouye International Airport (HNL)</li>
                  <li class="AutoSuggestInput-item">Charleston International Airport (CHS)</li>
                  <li class="AutoSuggestInput-item">John F. Kennedy International Airport (JFK)</li>
                  <li class="AutoSuggestInput-item">LaGuardia Airport (LGA)</li>
                  <li class="AutoSuggestInput-item">Savannah/Hilton Head International Airport (SAV)</li>
                  <li class="AutoSuggestInput-item">Detroit Metropolitan Airport (DTW)</li>
                  <li class="AutoSuggestInput-item">Baltimore–Washington International Airport (BWI)</li>
                  <li class="AutoSuggestInput-item">San Antonio International Airport (SAT)</li>
                  <li class="AutoSuggestInput-item">Paine Field Airport (PAE)</li>
                </ul>
              </div>
            </div>
          </div>
          <button class="find-parking">
            <svg width="0.875rem" height="0.65rem" aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" class="Icon">
              <path d="M2.002 9.538a1 1 0 0 0 .581.966l7.504 3.442 3.442 7.503c.164.356.52.583.909.583l.057-.002a1 1 0 0 0 .894-.686l5.595-17.032a1 1 0 0 0-.243-1.02 1 1 0 0 0-1.02-.243L2.688 8.645a1 1 0 0 0-.686.893"></path>
            </svg>
            Find Parking Near Me
          </button>
        </div>
      </section>
  </header>

  <main>
    <?php
    // require_once("top.php");
    echo '</head>';
    echo '<body>';
    // require_once("navbar.php");
    if (isset($_SESSION['user_logged_in']) && $_SESSION['user_logged_in'] == 1) {
      require_once("welcome_login.php");
    } else {
      require_once("welcome.php");
    }
    echo '</body>';
    ?>
  </main>

  <script>
    var element = document.getElementById("pills-contact-tab");
    element.addEventListener("click", myFunction);
     
    function myFunction() {
      document.getElementById("pills-contact").style.display = "block";
    }

  </script>
</body>

</html>