challenge6

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Find the precious!</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body> <div id="menu">
        <nav> </div>
            <ul>
                <li class="find">FindThePrecious.com</li>
                <li class="fellow">Fellows</li>
                <li class="contact">Contact us</li>
            </ul>
        </nav>
      <a class="back1" href="https://placeholder.com"><img src="https://via.placeholder.com/4000x200" alt="FellowA"></a>
        <section>

        </section>
        <section>
            <h2>Fellows wanted dead (or alive if you want to eat them later)</h2>
        </section>
        <section>
          <div id="pictures"
            <article> <a href="https://placeholder.com"><img src="https://via.placeholder.com/300" alt="FellowA"></a>
       </article>
            <article><a href="https://placeholder.com"><img src="https://via.placeholder.com/300" alt="FellowA"></a></article>
            <article><a href="https://placeholder.com"><img src="https://via.placeholder.com/300" alt="FellowA"></a></article>  </div>
        </section>
<hr>
        <form>
            <h2 class="contact_title">Contact us</h2>
          <input class="form" type="email" placeholder="@"> </br>
            <input class="form" type="text" placeholder="&#8962;"> </br>
            <input class="form" type="text" placeholder="I have seen one of them"> </br>
            <textarea class="form" placeholder="Your message"></textarea>
        </form>
    </body>
</html>


<!-- CSS -->

ul {
  display: flex;
  background-color: black;
  color: white;
  height: 30px;
  text-aling: left;
  list-style-type: none;
  margin-bottom: -5px;

  }

.find {
  padding: 2px;
  font-size: 20px;
  }

.fellow  {
  padding: 5px;
  margin-left: 60px;
  }

.contact {
  padding: 5px;
  margin-left: 60px;
  }

h2 {
 text-align: center;
 margin: 40px;
  }


article {
  display: inline-block;
  margin: 10px;
  }

#pictures{
  text-align: center;
  margin-bottom: 80px;
  }

form {
  text-align: center;
  }

.form
{
  text-align: left;
  width: 500px;
  height: 30px;
  margin: 10px;
  }

.contact_title {
  text-align: left;
  }