canary.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Canary</title>
    <link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
    <nav>
        <ul>
            <li>
                <a href="index.html">home</a>
            </li>
            <li>
                <a href="meadowlark.html">meadowlark</a>
            </li>
            <li>
                <a href="canary.html" class="current-page">canary</a>
            </li>
            <li>
                <a href="rooster.html">most elusive bird</a>
            </li>
        </ul>
    </nav>
    <main>
        <h1>
            <!-- Bird name here -->
        </h1>
        <!-- Description of bird -->
        <div>
            <!-- Image of bird -->
            <!-- Audio of bird -->
            <div>
                <h4>Image credit: <a href="https://commons.wikimedia.org/wiki/File:Canary_(Serinus_canaria)_01.jpg">Wikimedia</a> Audio credit: <a href="http://soundbible.com/14-Canary-Singing.html">SoundBible</a></h4>
            </div>
        </div>
    </main>
</body>
</html>