---
layout: default
route: documentation
---

{% include navbar.html id="Documentation" %}

<main class="bd-main">
  <div class="bd-side-background"></div>
  <div class="bd-main-container container">
    <div class="bd-duo">
      <div class="bd-lead">
        <div class="bd-breadcrumb">
          <nav class="breadcrumb" aria-label="breadcrumbs">
            <ul>
              <li>
                <a href="{{ site.url }}">Home</a>
              </li>
              <li>
                <a href="{{ site.url }}/documentation">Documentation</a>
              </li>
              <li>
                <a href="{{ site.url }}/documentation/elements">Elements</a>
              </li>
              <li class="is-active">
                <a href="#" aria-current="page">Button</a>
              </li>
            </ul>
          </nav>
        </div>

        <header class="bd-header">
          <h1 class="title">
            {{ page.title }}
          </h1>
          <p class="subtitle">
            {{ page.subtitle }}
          </p>
        </header>

        <div class="bd-content">
          {{ content }}
        </div>
      </div>

      <aside class="bd-side">
        {% include carbon.html %}
      </aside>
    </aside>
  </div>
</main>

{% include elements/improve-page.html %}