Perch Repeater Inside Block

Hi guys,

I'm having some difficulty putting a repeater inside a block - all that happens is that all of the fields in the block sit within the repeater, instead.

Below is my block (containing the repeater):

    <perch:block type="title-text-left-half-with-faq" label="title text left half (with FAQ Section)">
        <div class="title-text-left-half">
          <div>

            <perch:if exists="title-left">
            <div class="inner">
             <h2><perch:content id="title-left" type="text" label="Title left" /></h2>
            </div>
            <!-- /div.inner --> 
            </perch:if>
          </div>
          <!-- /div.left-col -->

          <div>
            <div class="inner">
             <perch:content id="text-right" type="textarea" label="Text right" markdown="true" editor="markitup"  />
            </div>
            <!-- /div.inner --> 
          </div>
          <!-- /div.right-col --> 
    <perch:repeater id="faq-and-text" label="FAQ Section">
    <div id="theStory" style="clear:both;">
  <span id="storyHeader">   
    <h3> <span style="width: 17px;margin-top:13px;" id="hrzntlLine" ></span><span style="width: 17px;margin-top:13px;" id="vrtclLine" ></span><span id="storyStory" ><perch:content id="question" type="textarea" label="Question" textile="true" editor="markitup" /><span></h3>
  </span>
  <div id="storyContent" style="display:none; -moz-column-count: 1; -webkit-column-count: 1; column-count: 1;">
    <perch:content id="content" type="textarea" label="Story content" textile="true" editor="markitup" />
  </div>
</div>
</perch:repeater>
    </div>
    <!-- /div.title-text-left --> 
    <perch:if exists="title-image-right-tiny">
        <div class="title-image-right-half">
        <perch:if exists="title-image-right-tiny">
            <div class="right-half-digital"><img src="<perch:content id="title-image-right-tiny" type="image" label="Image 1" width="400" height="400" crop="true"/>" /></div>
        </perch:if>
        <perch:if exists="title-image-right">
            <div class="right-half-digital"><img src="<perch:content id="title-image-right" type="image" label="Image 2" width="400" height="400" crop="true"/>" /></div>
        </perch:if>
        <perch:if exists="title-image-right-big">
            <div class="right-half-digital"><img src="<perch:content id="title-image-right-big" type="image" label="Image 3" width="400" height="400" crop="true"/>" /></div>
        </perch:if>
        <perch:if exists="title-image-right-big-four">
            <div class="right-half-digital"><img src="<perch:content id="title-image-right-big-four" type="image" label="Image 4" width="400" height="400" crop="true"/>" /></div>
        </perch:if>
        </div>
    </perch:if>
  </perch:block>

Any ideas?

Thanks!