<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>The Hat Gallery</title>
<link rel="stylesheet" href="../position/cssposition/position.css"/>
</head>
<body>
<header>
<h1>
<img src="../imges/hat.png" width="130" height="140" alt="The Hat Gallery" class="badge">
<p class="the">The Hat Gallery</p>
</h1>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">More Hats</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Visit Us</a></li>
</ul>
</nav>
</header>
<div class="gallery">
<figure >
<img src="../imges/file00079963469.jpg" width="300" height="210" alt="Panama Hat">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file000308999292.jpg" width="300" height="210" alt="Bonnet">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file000330568599.jpg" width="300" height="210" alt="Pink hat">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file000550955311.jpg" width="300" height="210" alt="Variety">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file0001117960982.jpg" width="300" height="210" alt="Hat">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file0001425538258.jpg" width="300" height="210" alt="Another bonnet">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file00030009680.jpg" width="300" height="210" alt="Dude with hat">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file0001728857809.jpg" width="300" height="210" alt="Cool hat">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
<figure>
<img src="../imges/file0001757413591.jpg" width="300" height="210" alt="Top Hats">
<figcaption><strong>Nam libero tempore.</strong> Soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus</figcaption>
</figure>
</div>
<footer>
<div class="copyright">
<p>Copyright 2015, The Hat Gallery</p>
</div>
</footer>
</body>
</html>
