Cacher is the code snippet organizer for pro developers

<div class="nine columns offset-by-two">
  <div class="module-container ">
    <div class="container u-full-width">
      <!-- module title and subheading -->
      <section class="row module-container__head">
        <div class="twelve columns">
          <h2 class="module-title">Component for Module Container</h2>
        </div>
        <div class="twelve columns">
          <p class="module-subheading">Subheading for UI Elements</p>
        </div>
      </section>
      <!--  component title and component EX buttons followed by type of buttons   -->
      <!-- Buttons -->
      <section class="row conponent-section">
        <h3 class="u-full-width component-title">Basic</h3>
        <section class="u-full-width group-componets">
          add components here
        </section>
        <!-- 	markup container for the accordion dropdown that displays code for each component    -->
        <div class="  markup-container separator">
          <input type="checkbox" name="group-1" id="module-1-1">
          <li class="accordion-item">
            <p>change the label for attribute and input id for each component using the naming scheme module-1-1 for first module first markdown tag</p>
            <p> copy and paste code to start a new module component</p>
            <label for="module-1-1" class="btn  btn--full-width  "> Use Github gist for code change label "for" and id for input </label>
            <article class=" accordion__content--exlarge">
              <script src="https://gist.github.com/OscarRobertRodriguez/40a8a86403360de4923c3a2dcea6e7c5.js"></script>
            </article>
          </li>
        </div>
      </section>
    </div>
  </div>
</div>