Untitled

<!doctype html>
<html lang="fr">

    <head>

        <title>FindTheRing.com</title>
        <meta charset="UTF-8"/>
        <meta name="author" content="Geoffroy Crabières"/>
        <meta name="description" content="Dangerous fellowship try to destroy the ring"/>
        <meta name="language" content="fr-FR"/>

    </head>

    <body>

        <header>

            <nav>
                <ul>
                    <li><a href="https://www.findtheprecious.com" title="FindThePrecious.com">FindThePrecious.com</a></li>
                    <li><a href="#fellows" title="Fellows">Fellows</a></li>
                    <li><a href="#contact" title=""Contact">Contact us</a></li>
                </ul>
            </nav>

        </header>

        <div>
            <h1>Dangerous fellowship try to destroy the ring</h1>
            <p>Orcs, Goblins, Balrogs, protect your master Sauron!</p>
        </div>

        <section>

            <h2 id="fellows">Fellows wanted dead</h2><p>(or alive if you want to eat them later)</p>

            <div class="wanted-bloc">
               <img src="https://via.placeholder.com/468x60?text=Reward+1000+gold+coins" alt="The Wizard"/>
              <h3>The Wizard</h3>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce consequat interdum pulvinar. Aliquam pulvinar urna nunc, ut malesuada dui consequat ut.</p>
            </div>

            <div class="wanted-bloc">
              <img src="https://via.placeholder.com/468x60?text=Reward+1000+gold+coins" alt="Hobbit"/>
              <h3>Hobbit #3</h3>
             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce consequat interdum pulvinar. Aliquam pulvinar urna nunc, ut malesuada dui consequat ut.</p>
           </div>

            <div class="wanted-bloc">
              <img src="https://via.placeholder.com/468x60?text=Reward+250+gold+coins" alt="Yummy Dward"/>
              <h3>Yummy Dwarf</h3>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce consequat interdum    pulvinar. Aliquam pulvinar urna nunc, ut malesuada dui consequat ut.</p>
            </div>
        </section>

         <hr>

        <section>

            <h2 id="contact">Contact Us</h2>

            <form>

            <input type="email" name="email" placeholder="Email">

            <input type="text" name="address" placeholder="Address">

            <select>
                <option value="option1">Option #1</option>
                <option value="option2">Option #2</option>
                <option value="option3">Option #3</option>
                <option value="option4">Option #4</option>
            </select>


            <textarea name="message" placeholder="your message"></textarea>

            <input type="submit" name="send" value="Send!">

            </form>
        </section>

        <footer>

            <ul>
                <li><a href="https://www.findtheprecious.com/about">About us</a></li>
                <li><a href="https://www.findtheprecious.com/fellows">Fellows</a></li>
                <li><a href="https://www.findtheprecious.com/join">Join our army</a></li>
            </ul>

            <ul>
                <li><a href="https://www.findtheprecious.com/faq">About us</a></li>
                <li><a href="https://www.findtheprecious.com/rewards-conditions">Reward conditions</a></li>
                <li><a href="https://www.findtheprecious.com/legal-mentions">Legal mentions</a></li>
            </ul>

            <ul>
                <li><a href="https://www.sauron4ever.com">Sauron4ever.com</a></li>
                <li><a href="https://www.twitter.com/sauron4ever">Follow him also on twitter</a></li>
            </ul>

        </footer>

    </body>
</html>