single HTML tag around repeating patterns

This is probably one of those really simple things that I just can't seem to grasp today.
I am trying to place a <div> tag around a repeating pattern. Everything I do either gives me a <div> around each subsection or I get none of the subsections and just a <div>.
The div tag below should surround all of my SUBSECTIONs. The way I have it now I get the same div for every subsection.
So how can I get one instance of the div surrounding multiple subsections?

<xsl:template match="PROC/SUBSECTION">
	<div id="procedures" class="procedures" style="display:none">

		<xsl:for-each select="TITLE">
   			<h2><xsl:apply-templates  select = "." /></h2>
 		</xsl:for-each>
	
		<xsl:for-each select="PARA">
   			<p><xsl:apply-templates  select = "." /></p>
 		</xsl:for-each>

 		<ol>
 		<xsl:for-each select="LIST/ITEM-NUMBER">
   			<li><xsl:apply-templates  select = "." /></li>
 		</xsl:for-each>
 		</ol>
	</div>
</xsl:template>

I want my final output to look like this:

<div id="procedures" class="procedures" style="display:none">
<h2>title 1</h2>
<p>paragraph 1</p>
<ol>
	<li>list 1.1</li>
	<li>list 2.1</li>
</ol>
<h2>title 2</h2>
<p>paragraph 2</p>
<ol>
	<li>list 1.2</li>
	<li>list 2.2</li>
</ol>
</div>


Thanks
Brad

 XSL-List info and archive:  http://www.mulberrytech.com/xsl/xsl-list