{# attach_library('ufc/ufc_react') #}
<header aria-label="Site header" class="header" id="header" role="banner">
  {{ page.navigation }}
</header>

<section id="hero">
  <div id="hero-wrapper">
    {{ page.hero }}
  </div>
</section>

<section class="main" id="main">
   <main aria-label="Site main content" class="content" id="content" role="main">
     {{ page.content }}
   </main>
</section>
<footer aria-label="Site footer" class="footer" id="footer" role="contentinfo">
  {# include('dchadwick:button', {text: 'Click me', type: 'danger'}, with_context = false) #}

  {# embed 'dchadwick:accordion' %}

    {% block accordion_title %}
      Click Me!
    {% endblock %}

    {% block accordion_content %}
      Here is some content that goes in the place where the body is.
    {% endblock %}

  {% endembed #}

   <div class="footer--bottom">
       {{ page.footer_bottom }}
   </div>
</footer>
