FindThePrecious

<!DOCTYPE html>
<html  lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Find the precious</title>
</head>

<body>
    <header>
      <h1>Find the precious</h1>
      <nav>
        <ul>
            <li><a href="#fellows">Fellows</a></li>
            <li><a href="#contact">Contact Us</a></li>
        </ul>
      </nav>
    </header>

    <section>
      <h2 id="fellows">Fellows</h2>
        <a href ="https://www.placeholder.com"><img src="https://via.placeholder.com/140" alt="photo Fellow"></a>
        <p>Dangerous fellowship try to destroy the ring <br> Orcs, Goblins, Balrogs, protect your master Sauron !</p>
      <h4>Fellows wanted dead (or alive if you want to eat them later)</h4>
        <a href ="https://www.placeholder.com"><img src="https://via.placeholder.com/140" alt="photo Fellow numero 1"></a>
          <h5>The Wizzard</h5>
            <p>Lorem Ipsum</p>
            <a href ="https://www.placeholder.com"><img src="https://via.placeholder.com/140" alt="photo Fellow numero 2"></a>
          <h5>Obbit #3</h5>
            <p>Lorem Ipsum</p>
            <a href ="https://www.placeholder.com"><img src="https://via.placeholder.com/140" alt="photo Fellow numero 1"></a>
          <h5>Yummy Dwarf</h5>
            <p>Lorem Ipsum</p>
        <hr>
    </section>

    <section>
      <h2 id="contact">Contact Us</h2>
      <form method="post">
        <div class="email">
          <label>Email:</label>
          <input type="text">
        </div>

        <div class="adresse">
          <label>Adresse:</label>
          <input type="text">
         </div>

         <div class="select">
           <select>
            <option>I have seen one of them</option>
            <option>Option 2</option>
           </select>
          </div>

          <div class="message">
            <label>Message:</label>
              <textarea name="message"></textarea>
          </div>

          <div class="send">
            <input type="submit" value="Send !">
          </div>
      </form>
    </section>

    <footer>
      <section>
        <ul>
          <li><h5>About us</h5></li>
          <li><a href="#fellows"><h5>Fellows</h5></a></li>
          <li><a href="#contact"><h5>Join our army</h5></a></li>
          <li><h5>FAQ</h5></li>
          <li><h5>Reward conditions</h5></li>
          <li><h5>Legal mentions</h5></li>
        </ul>
      </section>
      <section>
        <h5><a href="https://www.sauron4ever.com" target="_blank">Sauron4Ever.com</a>
          <a href="https://twitter.com/" target="_blank">Follow him also on twitter</a></h5>
      </section>
    </footer>
</body>
</html>