foundation.erb

    <div class="off-canvas-wrap">
        <div class="inner-wrap">
            <nav class="tab-bar">
                <section class="left-small">
                    <a class="left-off-canvas-toggle menu-icon" ><span></span></a>
                </section>
                <%= render 'layouts/mobile_menu_btn' %>

                <section class="middle tab-bar-section" style="">
                    <div style="width: 100%; text-align: left; margin-left: 0em;"><span style="font-weight: 800; font-size: 1.5em;">MAKER</span><span><%= image_tag "course/logo.png", {class: "logo", alt: "Logo", style: "margin: 0px 2px; margin-bottom: 10px;width: 30px"} %></span><span style="font-weight: 300;  font-size: 1.5em;">SQUARE</span></div>
                </section>

                <section class="right-small">
                    <a class="right-off-canvas-toggle menu-icon" >
                        <span></span>
                    </a>
                </section>
            </nav>

            <%= render "layouts/mobile_left_menu" %>
            <%= render "layouts/mobile_right_menu" %>

            <section class="main-section">
                <%# this is the main mobile content section %>
                <%= yield :mobile_hero_unit %>
                <%= yield %>
                <%= render 'layouts/footer' %>
            </section>

            <a class="exit-off-canvas"></a>
        </div>
    </div>