<div id="mySidenav" class="sidenav">

    <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
    <a href="index.html">Home</a>
    <a href="about.html">About</a>
    
    <a href="#" data-toggle="collapse" data-target="#collapseChapter" aria-expanded="false" aria-controls="collapseChapter">Chapters</a>
                
                <div class="collapse chapternav" id="collapseChapter">
                                    <a class = "chapter-inactive" href = '#'>1</a>
                                    <a class = "chapter-inactive" href = '#'>2</a>
                                    <a class = "chapter-inactive" href = '#'>3</a>
                                    <a class = "chapter" href = 'index.html'>4 - The Meeting</a>
                                    <a class = "chapter-inactive" href = '#'>5</a>
                                    <a class = "chapter-inactive" href = '#'>6</a>
                                    <a class = "chapter-inactive" href = '#'>7</a>
                 </div>
                            
    <a href="contact.html">Contact</a>
    <a href="subscribe.html">Subscribe</a>
    
</div>