Accordions side by side

    <div class="main">
        <!-- FAQ -->
        <div id="faq" class="accordion">
            <div class="separator">
                <h2 class="accordion__title">
                    <a class="accordion__toggle  js-accordion-toggle" href="#faq-content1">
                    <i class="icn  icn--accordion  js-accordion-state">Open</i>
                    FAQ Question 1</a>
                </h2>
                <div class="accordion__body  is-closed">
                    <p>FAQ Answer 1 lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
                </div>
            </div>
            <div class="separator">
                <h2 class="accordion__title">
                    <a class="accordion__toggle  js-accordion-toggle" href="#faq-content2">
                    <i class="icn  icn--accordion  js-accordion-state">Open</i>
                    FAQ Question 2</a>
                </h2>
                <div class="accordion__body  is-closed">
                    <p>FAQ Answer 2</p>
                </div>
            </div>
            <div class="separator">
                <h2 class="accordion__title">
                    <a class="accordion__toggle  js-accordion-toggle" href="#faq-content3">
                    <i class="icn  icn--accordion  js-accordion-state">Open</i>
                    FAQ Question 3</a>
                </h2>
                <div class="accordion__body  is-closed">
                    <p>FAQ Answer 3</p>
                </div>
            </div>
        </div>
    </div>

    <aside class="secondary">
        <!-- Archive -->
        <ul id="archive" class="accordion list--unstyled">
            <li class="separator">
                <h4 class="accordion__title  accordion__title--alt">
                    <a class="accordion__toggle  accordion__toggle--alt  js-accordion-toggle" href="#">
                    <i class="icn  icn--accordion-alt  js-accordion-state">Open</i>
                    January</a>
                </h4>
                <div class="accordion__body  is-closed">
                    <ul class="list--unstyled">
                        <li>
                            <a href="#">Post Title</a>
                        </li>
                        <li>
                            <a href="#">Post Title</a>
                        </li>
                        <li>
                            <a href="#">Post Title</a>
                        </li>
                    </ul>
                </div>
            </li>
            <li class="separator">
                <h4 class="accordion__title  accordion__title--alt">
                    <a class="accordion__toggle  accordion__toggle--alt  js-accordion-toggle" href="#">
                    <i class="icn  icn--accordion-alt  js-accordion-state">Open</i>
                    February</a>
                </h4>
                <div class="accordion__body  is-closed">
                    <ul class="list--unstyled">
                        <li>
                            <a href="#">Post Title</a>
                        </li>
                    </ul>
                </div>
            </li>
            <li class="separator">
                <h4 class="accordion__title  accordion__title--alt">
                    <a class="accordion__toggle  accordion__toggle--alt  js-accordion-toggle" href="#">
                    <i class="icn  icn--accordion-alt  js-accordion-state">Open</i>
                    March</a>
                </h4>
                <div class="accordion__body  is-closed">
                    <ul class="list--unstyled">
                        <li>
                            <a href="#">Post Title</a>
                        </li>
                        <li>
                            <a href="#">Post Title</a>
                        </li>
                    </ul>
                </div>
            </li>
        </ul>
    </aside>