<div class="layout">
    <header class="layout__header">
        <section>Thundercat House Rules</section>
    </header>
    <nav class="layout__nav">
        <ul class="layout__nav-menu">
            <li class="layout__nav-item">
                <a class="layout__nav-link" href="#">
                    No Scratching
                </a>
            </li>
            <li class="layout__nav-item">
                <a class="layout__nav-link" href="#">
                    No Shedding
                </a>
            </li>
            <li class="layout__nav-item">
                <a class="layout__nav-link layout__nav-link--active" href="#">
                    Kitty Litter Is Mandantory
                </a>
                <ul class="layout__nav-menu layout__nav-child-menu">
                    <li class="layout__nav-item">
                        <a class="layout__nav-link" href="#">
                            Yes I'm Serious
                        </a>
                    </li>
                    <li class="layout__nav-item">
                        <a class="layout__nav-link" href="#">
                            There's Always Outside
                        </a>
                    </li>
                </ul>
                <li class="layout__nav-item">
                    <a class="layout__nav-link" href="#">
                        Lion 'O Don't Play That
                    </a>
                </li>
            </li>
        </ul>
    </nav>
    <div class="layout__main">
        <h2>Thundercats... HO!!!!!!</h2>
    </div>
    <footer class="layout__footer">
        <div class="layout__footer-left-item">Important footer stuff</div>
        <div class="layout__footer-right-item">Not as important footer stuff</div>
    </footer>
</div>