No notes defined.

<header class=" siteHeader">
    <div class="siteHeader__container container">
        <a href="/" class="siteHeader__brand">
            <svg xmlns="http://www.w3.org/2000/svg" class="siteHeader__logo" width="36" height="44" viewBox="3 1 18 22" stroke-width="1" stroke="currentColor" fill="none">
                <path d="M6 17.6l-2 -1.1v-2.5" />
                <path d="M4 10v-2.5l2 -1.1" />
                <path d="M10 4.1l2 -1.1l2 1.1" />
                <path d="M18 6.4l2 1.1v2.5" />
                <path d="M20 14v2.5l-2 1.12" />
                <path d="M14 19.9l-2 1.1l-2 -1.1" />
                <line x1="12" y1="12" x2="14" y2="10.9" />
                <line x1="18" y1="8.6" x2="20" y2="7.5" />
                <line x1="12" y1="12" x2="12" y2="14.5" />
                <line x1="12" y1="18.5" x2="12" y2="21" />
                <path d="M12 12l-2 -1.12" />
                <line x1="6" y1="8.6" x2="4" y2="7.5" />
            </svg>
            <div class="siteHeader__siteName">Boilerplate</div>
        </a>
        <nav class=" primaryNav">
            <bp-directional>
                <ul class="primaryNav__list">
                    <li class="primaryNav__item">
                        <bp-dropdown label-class="primaryNav__link" href="" label="Maine" id="a11y-maine">
                            <bp-directional>
                                <div class="container linkGroups">
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Seacoast</div>
                                        <ul class="linkGroup__list -wide">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Bar Harbor</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Camden</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Castine</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Damariscotta</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Kennebunkport</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Old Orchard Beach</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Portland</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Rockland</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Stonington</a></li>
                                        </ul>
                                    </div>
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Parks</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Acadia</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Baxter</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Camden Hills</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Popham Beach</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Quoddy Head</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Reid</a></li>
                                        </ul>
                                    </div>
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Activities</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Agricultural Attractions</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Arts &amp; Culture</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Camping</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Fishing</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Guide Services</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Hiking &amp; Climbing</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Hunting</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Lighthouses &amp; Sightseeing</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Shopping</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Spas, Health &amp; Wellness</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Wildlife Watching</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Winter Activities</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </bp-directional>
                        </bp-dropdown>
                    </li>
                    <li class="primaryNav__item">
                        <bp-dropdown label-class="primaryNav__link" href="" label="New Hampshire" id="a11y-new-hampshire">
                            <bp-directional>
                                <div class="container linkGroups">
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Towns</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Manchester</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Portsmouth</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Sunapee</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Concord</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Conway</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Keene</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Laconia</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Berlin</a></li>
                                        </ul>
                                    </div>
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Parks</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Bear Brook</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Franconia Notch</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Hampton Beach</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Odiorne Point</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Pawtuckaway</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">White Mountains</a></li>
                                        </ul>
                                    </div>
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Activities</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Boating</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Camping</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Canoeing &amp; Kayaking</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Christmas Tree Farms</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Covered Bridges</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Fishing</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Guide Services</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Hunting</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Shopping</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Skiing &amp; Riding</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Waterfalls</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">White Water Rafting</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </bp-directional>
                        </bp-dropdown>
                    </li>
                    <li class="primaryNav__item">
                        <bp-dropdown class="-rightEdge" label-class="primaryNav__link" href="" label="Massachusetts" id="a11y-massachusetts">
                            <bp-directional>
                                <div class="container linkGroups">
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Cities</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Boston</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Cambridge</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Lowell</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Plymouth</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Salem</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Springfield</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Worcester</a></li>
                                        </ul>
                                    </div>
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">Cape Cod &amp; Islands</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Chatham</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Falmouth</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Hyannis</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Martha's Vineyard</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Nantucket</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Oak Bluffs</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Orleans</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Provincetown</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Sandwich</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Truro</a></li>
                                        </ul>
                                    </div>
                                    <div class="linkGroup">
                                        <div class="linkGroup__heading">In the City</div>
                                        <ul class="linkGroup__list">
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Camping</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Casinos</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Massachusetts Gardens</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Museums &amp; Galleries</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Night Life</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Performing Arts</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Scenic Drive Tours</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Shopping</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">Ski Areas</a></li>
                                            <li class="linkGroup__item"><a class="linkGroup__link" href="#">State Parks</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </bp-directional>
                        </bp-dropdown>
                    </li>
                </ul>
            </bp-directional>
        </nav>
        <bp-mobile-navigation title="Example Menu" class="siteHeader__end">
            <ul class="mobileNav__list">
                <li class="mobileNav__item">
                    <a href="">Maine</a>
                    <ul>
                        <li><a href="#">Bar Harbor</a></li>
                        <li><a href="#">Camden</a></li>
                        <li><a href="#">Castine</a></li>
                        <li><a href="#">Damariscotta</a></li>
                        <li><a href="#">Kennebunkport</a></li>
                        <li><a href="#">Old Orchard Beach</a></li>
                        <li><a href="#">Portland</a></li>
                        <li><a href="#">Rockland</a></li>
                        <li><a href="#">Stonington</a></li>
                        <li><a href="#">Acadia</a></li>
                        <li><a href="#">Baxter</a></li>
                        <li><a href="#">Camden Hills</a></li>
                        <li><a href="#">Popham Beach</a></li>
                        <li><a href="#">Quoddy Head</a></li>
                        <li><a href="#">Reid</a></li>
                        <li><a href="#">Agricultural Attractions</a></li>
                        <li><a href="#">Arts &amp; Culture</a></li>
                        <li><a href="#">Camping</a></li>
                        <li><a href="#">Fishing</a></li>
                        <li><a href="#">Guide Services</a></li>
                        <li><a href="#">Hiking &amp; Climbing</a></li>
                        <li><a href="#">Hunting</a></li>
                        <li><a href="#">Lighthouses &amp; Sightseeing</a></li>
                        <li><a href="#">Shopping</a></li>
                        <li><a href="#">Spas, Health &amp; Wellness</a></li>
                        <li><a href="#">Wildlife Watching</a></li>
                        <li><a href="#">Winter Activities</a></li>
                    </ul>
                </li>
                <li class="mobileNav__item">
                    <a href="">New Hampshire</a>
                    <ul>
                        <li><a href="#">Manchester</a></li>
                        <li><a href="#">Portsmouth</a></li>
                        <li><a href="#">Sunapee</a></li>
                        <li><a href="#">Concord</a></li>
                        <li><a href="#">Conway</a></li>
                        <li><a href="#">Keene</a></li>
                        <li><a href="#">Laconia</a></li>
                    </ul>
                </li>
                <li class="mobileNav__item">
                    <a href="">Massachusetts</a>
                    <ul>
                        <li><a href="#">Boston</a></li>
                        <li><a href="#">Cambridge</a></li>
                        <li><a href="#">Lowell</a></li>
                        <li><a href="#">Plymouth</a></li>
                        <li><a href="#">Salem</a></li>
                        <li><a href="#">Springfield</a></li>
                        <li><a href="#">Worcester</a></li>
                    </ul>
                </li>
            </ul>
        </bp-mobile-navigation>
    </div>
</header>

<main>
    <section class="layer">
        <div class="layer__container container">
            <h1>Resources</h1>
        </div>
    </section>

    <section class="layer results">
        <div class="layer__container container">

            <div>
                <div class=" search">
                    <form action="">

                        <div class=" filters">
                            <div class="filters__filter select">
                                <label class="select__label" for="filter1">Filter by Type:</label>
                                <select class="select__select" name="filter1">
                                    <option>Ipsum asperiores</option>
                                    <option>Consectetur in</option>
                                    <option>Ipsum impedit</option>
                                    <option>Dolor vero</option>
                                    <option>Sit minima</option>
                                    <option>Adipisicing animi</option>
                                    <option>Lorem voluptatem</option>
                                    <option>Lorem voluptatibus</option>
                                    <option>Lorem ipsam</option>
                                    <option>Elit eligendi</option>
                                </select>
                            </div>
                            <div class="filters__filter select">
                                <label class="select__label" for="filter1">Filter by Type:</label>
                                <select class="select__select" name="filter1">
                                    <option>Amet vitae</option>
                                    <option>Sit voluptatibus</option>
                                    <option>Elit reprehenderit</option>
                                    <option>Adipisicing esse</option>
                                    <option>Sit in</option>
                                    <option>Amet quia</option>
                                    <option>Ipsum in</option>
                                    <option>Lorem impedit</option>
                                    <option>Amet inventore</option>
                                    <option>Adipisicing in</option>
                                </select>
                            </div>
                        </div>

                        <div class="search__field">
                            <input class="search__input" type="search" placeholder="Search...">
                            <button class="search__button button -primary" type="submit">Search</button>
                        </div>

                        <div class="search__meta">
                            1-10 of 42 results.
                        </div>
                    </form>
                </div>
            </div>

            <div class="cards">
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
                <div class="cards__card card skeleton">
                    <div class="card__container">
                        <div class="card__tag">
                            <div class="skeleton__line skeleton__line--1-word"></div>
                        </div>
                        <div class="card__icon">
                            <div class="skeleton__image" style="width: 5rem; height: 5rem"></div>
                        </div>
                        <h4 class="card__heading">
                            <div class="skeleton__line skeleton__line--2-words"></div>
                        </h4>
                        <div class="card__content">
                            <div class="skeleton__lines skeleton__lines--5"></div>
                        </div>
                        <div class="card__actions -attached">
                            <div class="card__action skeleton__button button"></div>
                        </div>
                    </div>
                </div>
            </div>

            <nav class=" pagination">
                <ul class="pagination__list">
                    <li class="pagination__item -previous">
                        <a class="pagination__link" href="" aria-label="Previous">
                            <svg class="link__icon" viewBox="0 0 24 24" stroke-width="3" stroke="currentColor" fill="none">
                                <polyline points="15 6 9 12 15 18" />
                            </svg>
                        </a>
                    </li>

                    <li class="pagination__item"><a class="pagination__link" href="">1</a></li>
                    <li class="pagination__item"><a class="pagination__link" href="">2</a></li>
                    <li class="pagination__item -active"><a class="pagination__link" href="">3</a></li>
                    <li class="pagination__item"><a class="pagination__link" href="">4</a></li>
                    <li class="pagination__item"><a class="pagination__link" href="">5</a></li>
                    <li class="pagination__item"><a class="pagination__link" href="">6</a></li>

                    <li class="pagination__item -next -disabled">
                        <a class="pagination__link link" href="" aria-label="Next">
                            <svg class="link__icon" viewBox="0 0 24 24" stroke-width="3" stroke="currentColor" fill="none">
                                <polyline points="9 6 15 12 9 18" />
                            </svg>
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
    </section>
</main>

<footer class=" siteFooter">
    <div class="siteFooter__container container">

        <a href="/" class="siteFooter__brand">
            <svg xmlns="http://www.w3.org/2000/svg" class="siteFooter__logo" width="36" height="44" viewBox="3 1 18 22" stroke-width="1" stroke="currentColor" fill="none">
                <path d="M6 17.6l-2 -1.1v-2.5" />
                <path d="M4 10v-2.5l2 -1.1" />
                <path d="M10 4.1l2 -1.1l2 1.1" />
                <path d="M18 6.4l2 1.1v2.5" />
                <path d="M20 14v2.5l-2 1.12" />
                <path d="M14 19.9l-2 1.1l-2 -1.1" />
                <line x1="12" y1="12" x2="14" y2="10.9" />
                <line x1="18" y1="8.6" x2="20" y2="7.5" />
                <line x1="12" y1="12" x2="12" y2="14.5" />
                <line x1="12" y1="18.5" x2="12" y2="21" />
                <path d="M12 12l-2 -1.12" />
                <line x1="6" y1="8.6" x2="4" y2="7.5" />
            </svg>
            <div class="siteFooter__siteName">Boilerplate</div>
        </a>

        <div class="siteFooter__links linkGroups">
            <div class="linkGroups__group linkGroup">
                <div class="linkGroup__heading">Maine</div>
                <ul class="linkGroup__list">
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Seacoast</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Parks</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Activities</a></li>
                </ul>
            </div>
            <div class="linkGroups__group linkGroup">
                <div class="linkGroup__heading">Massachusetts</div>
                <ul class="linkGroup__list -wide">
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Boston</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Cambridge</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Lowell</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Salem</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Worcester</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Martha's Vineyard</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Nantucket</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Provincetown</a></li>
                </ul>
            </div>
            <div class="linkGroups__group linkGroup">
                <div class="linkGroup__heading">New Hampshire</div>
                <ul class="linkGroup__list">
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Towns</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Parks</a></li>
                    <li class="linkGroup__item"><a class="linkGroup__link" href="#">Activities</a></li>
                </ul>
            </div>
        </div>

        <nav class="siteFooter__socialLinks">
            <a class="siteFooter__socialLink" href="">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-facebook" width="32" height="32" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M7 10v4h3v7h4v-7h3l1 -4h-4v-2a1 1 0 0 1 1 -1h3v-4h-3a5 5 0 0 0 -5 5v2h-3" />
                </svg>
            </a>

            <a class="siteFooter__socialLink" href="">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="32" height="32" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                    <rect x="4" y="4" width="16" height="16" rx="4" />
                    <circle cx="12" cy="12" r="3" />
                    <line x1="16.5" y1="7.5" x2="16.5" y2="7.501" />
                </svg>
            </a>

            <a class="siteFooter__socialLink" href="">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-twitter" width="32" height="32" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M22 4.01c-1 .49 -1.98 .689 -3 .99c-1.121 -1.265 -2.783 -1.335 -4.38 -.737s-2.643 2.06 -2.62 3.737v1c-3.245 .083 -6.135 -1.395 -8 -4c0 0 -4.182 7.433 4 11c-1.872 1.247 -3.739 2.088 -6 2c3.308 1.803 6.913 2.423 10.034 1.517c3.58 -1.04 6.522 -3.723 7.651 -7.742a13.84 13.84 0 0 0 .497 -3.753c-.002 -.249 1.51 -2.772 1.818 -4.013z" />
                </svg>
            </a>
        </nav>
    </div>

    <div class="siteFooter__utility container">
        <div class="siteFooter__copyright">© 2022 Boilerplate.</div>

        <nav class=" utilityNav">
            <ul class="utilityNav__list">
                <li class="utilityNav__item">
                    <a class="utilityNav__link" href="#">privacy policy</a>
                </li>
                <li class="utilityNav__item">
                    <a class="utilityNav__link" href="#">legal</a>
                </li>
            </ul>
        </nav>

    </div>
</footer>