<!-- BEGIN COPY / PASTE -->
    <style>
      .accordion {
        margin: 1em 0;
      }
      .accordion input {
        display: none;
      }
      .accordion label {
        display: block;
        padding: 0.5em;
        background: #007bff;
        color: white;
        cursor: pointer;
      }
      .accordion .content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-out;
        background: #f1f1f1;
        padding: 0 0.5em;
      }
      .accordion input:checked ~ .content {
        max-height: 100px; /* Adjust as needed */
      }
    </style>

    <div class="accordion">
      <input type="checkbox" id="section1" />
      <label for="section1">Section 1</label>
      <div class="content">
        <p>This is the content for section 1.</p>
      </div>
    </div>
    <div class="accordion">
      <input type="checkbox" id="section2" />
      <label for="section2">Section 2</label>
      <div class="content">
        <p>This is the content for section 2.</p>
      </div>
    </div>
    <!-- END COPY / PASTE -->