diff --git a/docs/buttons/buttons-grouped.html b/docs/buttons/buttons-grouped.html
index 07b46c3d..1aed23af 100755
--- a/docs/buttons/buttons-grouped.html
+++ b/docs/buttons/buttons-grouped.html
@@ -21,6 +21,8 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
+		
 		<p>Occasionally, you may want to visually group a set of buttons together to form a single block that looks contained like a navigation component. To get this effect, wrap a set of buttons in a container with the <code> data-role="controlgroup"</code> attribute &mdash; the framework will create a vertical button group, remove all margins and drop shadows between the buttons, and only round the first and last buttons of the set to create the effect that they are grouped together. </p>
 <pre><code>
 &lt;div data-role=&quot;controlgroup&quot;&gt;
@@ -62,9 +64,34 @@
 		</div>
 		
 		
-
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
 		
-	</div><!-- /content -->
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li data-theme="a"><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/buttons/buttons-icons.html b/docs/buttons/buttons-icons.html
index 06a46a0b..49616e84 100755
--- a/docs/buttons/buttons-icons.html
+++ b/docs/buttons/buttons-icons.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<h2>Adding Icons to Buttons</h2>
 		<p>The jQuery Mobile framework includes a selected set of icons most often needed for mobile apps. To minimize download size, jQuery Mobile includes a single white icon sprite, and automatically adds a semi-transparent black circle behind the icon to ensure that it has good contrast on any background color.</p> 
@@ -181,8 +182,35 @@
         <a href="index.html" data-role="button" data-icon="search" data-iconpos="notext" data-theme="c" data-inline="true">My button</a>
 		</div>
 	
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li data-theme="a"><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/buttons/buttons-inline.html b/docs/buttons/buttons-inline.html
index 5b0d71d0..19f2498b 100755
--- a/docs/buttons/buttons-inline.html
+++ b/docs/buttons/buttons-inline.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<p>By default, all buttons in the body content are styled as block-level element so they fill the width of the screen:</p>
 		
@@ -49,10 +50,35 @@
 		
 		<p>If you want buttons to sit side-by-side but stretch to fill the width of the screen, you can use the <a href="../content/content-grids.html">content column grids</a> to put normal full-width buttons into 2- or 3-columns.</p>	
 			
-		
-	
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li data-theme="a"><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
\ No newline at end of file
diff --git a/docs/buttons/buttons-themes.html b/docs/buttons/buttons-themes.html
index d04022d7..79b16cf5 100644
--- a/docs/buttons/buttons-themes.html
+++ b/docs/buttons/buttons-themes.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 			
 			<h2>Theming</h2>
 			
@@ -94,7 +95,34 @@
 			<a href="index.html" data-role="button" data-theme="e" data-icon="arrow-l" data-inline="true">Theme e</a>
 		</div>
 		
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li data-theme="a"><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/buttons/buttons-types.html b/docs/buttons/buttons-types.html
index ebe982c8..2d3993cd 100755
--- a/docs/buttons/buttons-types.html
+++ b/docs/buttons/buttons-types.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 	
 	<p>Buttons that are used for navigation should be coded as anchor links, and those that submit forms as <code>button</code> elements &mdash; each will be styled identically by the framework.</p>
 	
@@ -55,7 +56,34 @@
 		<p><strong>Input type="image"</strong> based button:</p>
 		<input type="image" value="Input type=image" />
 		
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li data-theme="a"><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/content/content-collapsible.html b/docs/content/content-collapsible.html
index 4fb54cf6..bb302a80 100755
--- a/docs/content/content-collapsible.html
+++ b/docs/content/content-collapsible.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<h2>Collapsible content markup</h2>
 		<p>To create a collapsible blocks of content, create a container and add the <code> data-role="collapsible"</code> attribute.</p>
@@ -134,8 +135,34 @@
 			</div>
 		</div>
 		
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li data-theme="a"><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
 	
-	</div><!-- /content -->
 </div><!-- /page -->
 
 </body>
diff --git a/docs/content/content-grids.html b/docs/content/content-grids.html
index 94168094..0e95a174 100755
--- a/docs/content/content-grids.html
+++ b/docs/content/content-grids.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<p>Using multiple column layouts isn't generally recommended on a mobile device because of the narrow screen width, but there are times where you may need to place small elements side-by-side (like buttons or navigation tabs, for example). </p>
 		
@@ -136,7 +137,34 @@
 			<div class="ui-block-c"><div class="ui-bar ui-bar-e" style="height:120px">C</div></div>
 		</div><!-- /grid-c -->
 		
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li data-theme="a"><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/content/content-html.html b/docs/content/content-html.html
index 9d6eb71d..b85c53a1 100755
--- a/docs/content/content-html.html
+++ b/docs/content/content-html.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-
+		<div class="content-primary">
 		<style>
 			table { width:100%; }
 			table caption { text-align:left;  }
@@ -109,7 +109,34 @@
 		</table>
 	
 	
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li data-theme="a"><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/content/content-themes.html b/docs/content/content-themes.html
index 4be0366e..a9f95b39 100755
--- a/docs/content/content-themes.html
+++ b/docs/content/content-themes.html
@@ -21,8 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
-			
+			<div class="content-primary">
 		<h2>Theming the content area</h2>
 		<p>The main content area of a page (container with the <code> data-role="content"</code> attribute) should be themed by adding the <code> data-theme</code> attribute to the <code> data-role="page"</code> container to ensure that the background colors are applied to the full page, regardless of the content length. (If you add to the <code> data-theme</code> to the content container, the background color will stop after the content so there may be a gap in color between the content and fixed footer.)</p>
 		
@@ -88,10 +87,34 @@
 		</div><!-- /themed container -->
 		
 	
-		
+	</div><!--/content-primary -->		
 	
+	<div class="content-secondary">
 		
-	</div><!-- /content -->
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li data-theme="a"><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/forms/docs-forms.html b/docs/forms/docs-forms.html
index 0ed8f6d1..ce5a43a9 100755
--- a/docs/forms/docs-forms.html
+++ b/docs/forms/docs-forms.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-
+		<div class="content-primary">
 			<p>jQuery Mobile provides a complete set of finger-friendly form elements that are based on native HTML form elements.</p>
 
 			<h2>Form structure</h2>
@@ -115,7 +115,34 @@ myswitch .slider("refresh");
 
 <p>We're considering adding a refresh method to forms to let the framework refresh all the individual elemnts withing but that is a future enhancement.</p>
 
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/forms/forms-all-native.html b/docs/forms/forms-all-native.html
index 66a7419d..92d7cc6f 100755
--- a/docs/forms/forms-all-native.html
+++ b/docs/forms/forms-all-native.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 
 		<form action="#" method="get">
 
@@ -204,8 +205,36 @@
 
 	</form>
 
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
 </html>
+
diff --git a/docs/forms/forms-all.html b/docs/forms/forms-all.html
index 20c0511c..184ade1e 100755
--- a/docs/forms/forms-all.html
+++ b/docs/forms/forms-all.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 
 		<form action="#" method="get">
 
@@ -202,8 +203,34 @@
 	    </fieldset>
 		</div>
 	</form>
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
 
-	</div><!-- /content -->
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/forms/forms-checkboxes.html b/docs/forms/forms-checkboxes.html
index 3e473db1..352e487c 100755
--- a/docs/forms/forms-checkboxes.html
+++ b/docs/forms/forms-checkboxes.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<form action="#" method="get">
 
@@ -110,8 +111,35 @@ $("input[type='checkbox']").attr("checked",true).checkboxradio("refresh");
 
 	</form>
 	
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/docs/forms/forms-radiobuttons.html b/docs/forms/forms-radiobuttons.html
index 678aa71f..9ca35424 100755
--- a/docs/forms/forms-radiobuttons.html
+++ b/docs/forms/forms-radiobuttons.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<form action="#" method="get">
 
@@ -114,9 +115,35 @@ $("input[type='radio']").attr("checked",true).checkboxradio("refresh");
 
 	</form>
 	
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
 	
-	</div><!-- /content -->
 </div><!-- /page -->
 
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/docs/forms/forms-sample-response.php b/docs/forms/forms-sample-response.php
index 938d414e..9edf7067 100755
--- a/docs/forms/forms-sample-response.php
+++ b/docs/forms/forms-sample-response.php
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content" data-theme="c">
+		<div class="content-primary">
 		
 		<form action="index.html" method="get">
 			
@@ -35,8 +36,35 @@
 
 	</form>
 	
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/docs/forms/forms-sample-selfsubmit.php b/docs/forms/forms-sample-selfsubmit.php
index c565fc4f..f2fa9078 100755
--- a/docs/forms/forms-sample-selfsubmit.php
+++ b/docs/forms/forms-sample-selfsubmit.php
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content" data-theme="c">
+		<div class="content-primary">
 		
 		<form action="forms-sample-selfsubmit.php" method="post">
 			
@@ -36,8 +37,35 @@
 			<button type="submit">Submit</submit>
 	</form>
 	
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/docs/forms/forms-sample.html b/docs/forms/forms-sample.html
index 9ca63c54..622bde90 100755
--- a/docs/forms/forms-sample.html
+++ b/docs/forms/forms-sample.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+			<div class="content-primary">
 			
 			<h2>Ajax form submission</h2>
 
@@ -48,9 +49,35 @@
 				</fieldset>
 			</form>
 
-	
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/forms/forms-search.html b/docs/forms/forms-search.html
index 0edfcc81..c5e0dd70 100755
--- a/docs/forms/forms-search.html
+++ b/docs/forms/forms-search.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<form action="#" method="get">
 
@@ -52,8 +53,36 @@
 
 	</form>
 	
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
+	
\ No newline at end of file
diff --git a/docs/forms/forms-selects.html b/docs/forms/forms-selects.html
index 7d7b260a..773af8a4 100644
--- a/docs/forms/forms-selects.html
+++ b/docs/forms/forms-selects.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 
 		<form action="#" method="get">
 
@@ -430,8 +431,36 @@ myselect.selectmenu("refresh");
 </pre></code>
     
 	</form>
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
 </html>
+
diff --git a/docs/forms/forms-slider.html b/docs/forms/forms-slider.html
index 568eb082..e502a13d 100755
--- a/docs/forms/forms-slider.html
+++ b/docs/forms/forms-slider.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 
 		<form action="#" method="get">
 
@@ -62,7 +63,34 @@ $("input[type=range]").val(60).slider("refresh");
 
 	</form>
 
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
diff --git a/docs/forms/forms-switch.html b/docs/forms/forms-switch.html
index 65f305cf..5a180760 100755
--- a/docs/forms/forms-switch.html
+++ b/docs/forms/forms-switch.html
@@ -20,6 +20,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<form action="#" method="get">
 
@@ -59,8 +60,36 @@ myswitch .slider("refresh");
 
 	</form>
 	
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
 </html>
+
diff --git a/docs/forms/forms-text.html b/docs/forms/forms-text.html
index 4c461e99..a330541a 100755
--- a/docs/forms/forms-text.html
+++ b/docs/forms/forms-text.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 		
 		<form action="#" method="get">
 
@@ -107,8 +108,35 @@
 
 	</form>
 	
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+	
+	<div class="content-secondary">
+		
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+			
+				<h3>Demos &amp; Docs Sections</h3>
+				
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+				
+					<li data-role="list-divider">Components</li>
+					<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+	
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+	
 </div><!-- /page -->
 
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/docs/forms/forms-themes.html b/docs/forms/forms-themes.html
index 86a3ce09..08cb1cc3 100755
--- a/docs/forms/forms-themes.html
+++ b/docs/forms/forms-themes.html
@@ -21,7 +21,8 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-    
+    	<div class="content-primary">
+	
     <h2>Form themes</h2>
     <p>jQuery Mobile has a rich <a href="../api/themes.html">theming system</a> that gives you full control of how pages and forms are styled. By default all form elements inside a container will automaticlaly adopt the same theme color swatch as their parent. This allows form elements to blend into their layouts with minimal work. The <code> data-theme</code> attribute can be applied any individual form element to apply any of the lettered theme color swatches to create contrast and emphasis in your designs.</p> 
     
@@ -363,8 +364,35 @@
 
 		</form>
 		
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/forms/index.html b/docs/forms/index.html
index 877733b5..5ede46d5 100755
--- a/docs/forms/index.html
+++ b/docs/forms/index.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		
 		<p>All form elements begin with standard html controls that are enhanced to make them more attractive and easy-to-use. In browsers that don't support the custom controls, they will still have a usable experience because these are all based on native form elements.</p>
 			
 		<ul data-role="listview" data-inset="true">
diff --git a/docs/forms/plugin-eventsmethods.html b/docs/forms/plugin-eventsmethods.html
index 4b7692bc..aa6d082f 100755
--- a/docs/forms/plugin-eventsmethods.html
+++ b/docs/forms/plugin-eventsmethods.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">
 
 		<p>After jQuery Mobile auto-enhances form controls into custom controls, you can manipulate many of their properties via plugin methods. The currently available methods are listed below. Check Github for updates - we're working on complete coverage.</p>
 		
@@ -176,9 +177,36 @@ $('input').button('disable');
 		<p>The page plugin contains a list of input types that are set to either true which means they'll degrade to type=text, false which means they'll be left alone, or a string such as "number", which means they'll be converted to that type (such as the case of type=range).</p>
 		
 		<p>You can configure which types are changed via the page plugin's <code>degradeInputs</code> option, which can be manipulated externally via <code>$.mobile.page.prototype.options.degradeInputs</code>, which has properties: color, date, datetime, "datetime-local", email, month, number, range, search, tel, time, url, and week. Be sure to configure this inside an event handler bound to the <code>mobileinit</code> event, so that it applies to the first page as well as subsequent pages that are loaded.</p>				
-	</div><!-- /content -->
-	
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li data-theme="a"><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
+	
\ No newline at end of file
diff --git a/docs/lists/docs-lists.html b/docs/lists/docs-lists.html
index 331d48a2..0b9287ea 100755
--- a/docs/lists/docs-lists.html
+++ b/docs/lists/docs-lists.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+			<div class="content-primary">
 			<h2>Basic linked lists</h2>
 			<p>A list view is coded as a simple unordered list containing linked list items with a <code> data-role="listview"</code> attribute. jQuery Mobile will apply all the necessary styles to transform the list into a mobile-friendly list view with right arrow indicator that fills the full width of the browser window. When you tap on the list item, the framework will trigger a click on the first link inside the list item, issue an AJAX request for the URL in the link, create the new page in the DOM, then kick off a page transition. Here is the HTML markup for a basic linked list.</p>
 			
@@ -96,8 +96,36 @@
 			<p>We're currently working on a few improvements to the refresh method, so keep your eye on Github for updates.</p>			
 			
 
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
+	
\ No newline at end of file
diff --git a/docs/lists/index.html b/docs/lists/index.html
index e725a527..1a22a9a4 100755
--- a/docs/lists/index.html
+++ b/docs/lists/index.html
@@ -55,9 +55,15 @@
 			<!--<li><a href="api-lists.html">API documentation</a></li>-->
 		</ul>
 		
+	
 
 	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-all-full.html b/docs/lists/lists-all-full.html
index 91e618b5..5bedd25b 100644
--- a/docs/lists/lists-all-full.html
+++ b/docs/lists/lists-all-full.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-	
+		<div class="content-primary">
 	<form>
 			<h2>Simple list</h2>
 
@@ -120,9 +120,35 @@
 
 		
 		</form>
-		
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-count.html b/docs/lists/lists-count.html
index 52e10c19..cef588af 100755
--- a/docs/lists/lists-count.html
+++ b/docs/lists/lists-count.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+			<div class="content-primary">
 		<ul data-role="listview">
 			<li><a href="index.html">Inbox <span class="ui-li-count">12</span></a></li>
 			<li><a href="index.html">Outbox <span class="ui-li-count">0</span></a></li>
@@ -28,8 +29,35 @@
 			<li><a href="index.html">Sent <span class="ui-li-count">328</span></a></li>
 			<li><a href="index.html">Trash <span class="ui-li-count">62</span></a></li>
 		</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-divider.html b/docs/lists/lists-divider.html
index 46297741..27d011f4 100755
--- a/docs/lists/lists-divider.html
+++ b/docs/lists/lists-divider.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+			<div class="content-primary">
 			<ul data-role="listview">
 				<li data-role="list-divider">A</li>
 				<li><a href="index.html">Adam Kinkaid</a></li>
@@ -59,8 +60,35 @@
 				<li data-role="list-divider">S</li>
 				<li><a href="index.html">Sawyer Wakefield</a></li>
 			</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/lists/lists-formatting.html b/docs/lists/lists-formatting.html
index 901bb724..0fedf521 100755
--- a/docs/lists/lists-formatting.html
+++ b/docs/lists/lists-formatting.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-				
+					<div class="content-primary">
 		<ul data-role="listview">
 			<li data-role="list-divider">Friday, October 8, 2010 <span class="ui-li-count">2</span></li>
 			<li><a href="index.html">
@@ -80,8 +80,35 @@
 					<p class="ui-li-aside"><strong>6:24</strong>AM</p>
 				</a></li>
 		</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-forms-inset.html b/docs/lists/lists-forms-inset.html
index eaa0bcfe..ce3de59d 100644
--- a/docs/lists/lists-forms-inset.html
+++ b/docs/lists/lists-forms-inset.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-	
+		<div class="content-primary">
 	<form>
 		<ul data-role="listview" data-inset="true">
 			<li data-role="fieldcontain">
@@ -197,8 +197,35 @@
 		
 		</form>
 		
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-forms.html b/docs/lists/lists-forms.html
index 656a71f0..e52b42af 100644
--- a/docs/lists/lists-forms.html
+++ b/docs/lists/lists-forms.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-	
+		<div class="content-primary">
 	<form>
 		<ul data-role="listview">
 			<li data-role="fieldcontain">
@@ -195,8 +195,35 @@
 		
 		</form>
 		
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-icons.html b/docs/lists/lists-icons.html
index 6fdd9021..e0a630c9 100755
--- a/docs/lists/lists-icons.html
+++ b/docs/lists/lists-icons.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-		
+			<div class="content-primary">
 		<ul data-role="listview">
 			<li><a href="index.html"><img src="images/gf.png" alt="France" class="ui-li-icon">France <span class="ui-li-count">4</span></a></li>
 			<li><a href="index.html"><img src="images/de.png" alt="Germany" class="ui-li-icon">Germany <span class="ui-li-count">4</span></a></li>
@@ -35,8 +35,35 @@
 		</ul>
 
 
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-inset.html b/docs/lists/lists-inset.html
index d752b5be..f9948663 100755
--- a/docs/lists/lists-inset.html
+++ b/docs/lists/lists-inset.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-	
+		<div class="content-primary">
 	<form>
 			<h2>Simple list</h2>
 
@@ -121,8 +121,35 @@
 		
 		</form>
 		
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-nested.html b/docs/lists/lists-nested.html
index 109bf4bd..f3342406 100755
--- a/docs/lists/lists-nested.html
+++ b/docs/lists/lists-nested.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">	
 		<ul data-role="listview">
 			<li>
 				<h3>Animals</h3>
@@ -139,9 +140,35 @@
 				</ul>
 			</li>
 		</ul>
-	</div><!-- /content -->
-	
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-ol.html b/docs/lists/lists-ol.html
index 51605fa6..23a88521 100755
--- a/docs/lists/lists-ol.html
+++ b/docs/lists/lists-ol.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">	
 			<ol data-role="listview">
 				<li><a href="index.html">The Godfather</a></li>
 				<li><a href="index.html">Inception</a></li>
@@ -43,8 +44,35 @@
 				<li><a href="index.html">The Big Lebowski</a></li>
 				<li><a href="index.html">Psycho</a></li>
 			</ol>
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/lists/lists-readonly-inset.html b/docs/lists/lists-readonly-inset.html
index 88e2695d..d7c50682 100644
--- a/docs/lists/lists-readonly-inset.html
+++ b/docs/lists/lists-readonly-inset.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-	
+		<div class="content-primary">
 			<h2>Simple list</h2>
 
 			<ul data-role="listview" data-inset="true">
@@ -117,8 +117,35 @@
 
 		
 		
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/lists/lists-readonly.html b/docs/lists/lists-readonly.html
index 9600443e..4d233438 100644
--- a/docs/lists/lists-readonly.html
+++ b/docs/lists/lists-readonly.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-	
+		<div class="content-primary">
 			<h2>Simple list</h2>
 
 			<ul data-role="listview">
@@ -113,8 +113,35 @@
 			</ul>
 
 		
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/lists/lists-search-inset.html b/docs/lists/lists-search-inset.html
index f0294b15..920dba1e 100755
--- a/docs/lists/lists-search-inset.html
+++ b/docs/lists/lists-search-inset.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">	
 			<ul data-role="listview" data-filter="true" data-inset="true">
 				<li><a href="index.html">Acura</a></li>
 				<li><a href="index.html">Audi</a></li>
@@ -45,8 +46,35 @@
 				<li><a href="index.html">Volkswagon</a></li>
 				<li><a href="index.html">Volvo</a></li>
 			</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/lists/lists-search-with-dividers.html b/docs/lists/lists-search-with-dividers.html
index e6178b74..6287a88a 100644
--- a/docs/lists/lists-search-with-dividers.html
+++ b/docs/lists/lists-search-with-dividers.html
@@ -20,6 +20,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">	
 			<ul data-role="listview" data-filter="true" data-filter-placeholder="Search people..." data-filter-theme="b">
 				<li data-role="list-divider">A</li>
 				<li><a href="index.html">Adam Kinkaid</a></li>
@@ -58,8 +59,35 @@
 				<li data-role="list-divider">S</li>
 				<li><a href="index.html">Sawyer Wakefield</a></li>
 			</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/lists/lists-search.html b/docs/lists/lists-search.html
index b8190e0d..3f7e4dc6 100755
--- a/docs/lists/lists-search.html
+++ b/docs/lists/lists-search.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
+		<div class="content-primary">	
 			<ul data-role="listview" data-filter="true">
 				<li><a href="index.html">Acura</a></li>
 				<li><a href="index.html">Audi</a></li>
@@ -45,8 +46,35 @@
 				<li><a href="index.html">Volkswagon</a></li>
 				<li><a href="index.html">Volvo</a></li>
 			</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/lists/lists-split-purchase.html b/docs/lists/lists-split-purchase.html
index 95d5c955..c768baca 100755
--- a/docs/lists/lists-split-purchase.html
+++ b/docs/lists/lists-split-purchase.html
@@ -21,15 +21,40 @@
 		</div><!-- /header -->
 
 		<div data-role="content">
-			
+			<div class="content-primary">	
 			<h4>This album costs $10.99 and includes 9 tracks.</h4>
 			<p>Your download will begin immediately on your mobile device and all tracks will by added your your library next time you sync.</p>
 			<a href="index.html" data-role="button" data-rel="back" data-theme="b">Purchase album</a>
 			<a href="index.html" data-role="button" data-rel="back">No thanks</a>
+			</div><!--/content-primary -->		
+
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
 		</div><!-- /content -->
-	</div><!-- /page -->
 
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
 
+		</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+		</body>
+		</html>
diff --git a/docs/lists/lists-split.html b/docs/lists/lists-split.html
index 5f5679e7..dca4f438 100755
--- a/docs/lists/lists-split.html
+++ b/docs/lists/lists-split.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-		
+		<div class="content-primary">	
 		<ul data-role="listview" data-split-icon="gear" data-split-theme="d">
 			<li><a href="index.html">
 				<img src="images/album-bb.jpg" />
@@ -93,9 +93,35 @@
 				</a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
 			</a></li>
 		</ul>
+		</div><!--/content-primary -->		
+
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
 	</div><!-- /content -->
-</div><!-- /page -->
 
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
 
-</body>
-</html>
\ No newline at end of file
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-themes.html b/docs/lists/lists-themes.html
index c9e983d4..d7b1e19d 100755
--- a/docs/lists/lists-themes.html
+++ b/docs/lists/lists-themes.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content" class="ui-body">
-		
+		<div class="content-primary">	
 
 		<p>All the standard button swatches can be applied to lists. The framework assigns a default list theme swatch of &quot;c&quot; (silver in the default theme) and swatch &quot;b&quot; (blue in default theme) for dividers. Below is a default themed list.</p>
 		
@@ -210,9 +210,35 @@
 		</ul>
 		
 		
-			
-	</div><!-- /content -->
-</div><!-- /page -->
+		</div><!--/content-primary -->		
 
-</body>
-</html>
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-thumbnails.html b/docs/lists/lists-thumbnails.html
index 239c88a7..889975a6 100755
--- a/docs/lists/lists-thumbnails.html
+++ b/docs/lists/lists-thumbnails.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-		
+		<div class="content-primary">	
 		<ul data-role="listview">
 			<li><a href="index.html">
 				<img src="images/album-bb.jpg" />
@@ -81,10 +81,35 @@
 				<p>Arcade Fire</p>
 			</a></li>
 		</ul>
+		</div><!--/content-primary -->		
 
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
 
 	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
diff --git a/docs/lists/lists-ul.html b/docs/lists/lists-ul.html
index 399fdb40..9c8aefaa 100755
--- a/docs/lists/lists-ul.html
+++ b/docs/lists/lists-ul.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-		
+			<div class="content-primary">
 			<ul data-role="listview">
 				<li><a href="index.html">Acura</a></li>
 				<li><a href="index.html">Audi</a></li>
@@ -46,8 +46,35 @@
 				<li><a href="index.html">Volkswagon</a></li>
 				<li><a href="index.html">Volvo</a></li>
 			</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
+			</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li data-theme="a"><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" class="footer-docs" data-theme="c">
+				<p>&copy;2011 The jQuery Project</p>
+		</div>
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
diff --git a/docs/pages/docs-dialogs.html b/docs/pages/docs-dialogs.html
index c848db5c..e2319cfb 100755
--- a/docs/pages/docs-dialogs.html
+++ b/docs/pages/docs-dialogs.html
@@ -21,6 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content" class="ui-body">
+			<div class="content-primary">
 			<h2>Creating dialogs</h2>
 			<p>Any page can be presented as a modal dialog by adding the <code>data-rel="dialog"</code> attribute to the page anchor link. When the "dialog" attribute is applied, the framework adds styles to add rounded corners, margins around the page and a dark background to make the "dialog" appear to be suspended above the page.</p>
 
@@ -67,7 +68,34 @@
 						<a href="dialog-buttons.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="slidedown">Share photos...</a>
 			
 			
-	</div><!-- /content -->
+	</div><!--/content-primary -->		
+
+	<div class="content-secondary">
+
+		<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+				<h3>Demos &amp; Docs Sections</h3>
+
+				<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+					<li data-role="list-divider">Components</li>
+					<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+					<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+					<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+					<li><a href="../../docs/content/index.html">Content formatting</a></li>
+					<li><a href="../../docs/forms/index.html">Form elements</a></li>
+					<li><a href="../../docs/lists/index.html">List views</a></li>
+
+				</ul>
+		</div>
+	</div>		
+
+</div><!-- /content -->
+
+<div data-role="footer" class="footer-docs" data-theme="c">
+		<p>&copy;2011 The jQuery Project</p>
+</div>
+
 </div><!-- /page -->
 
 </body>
diff --git a/docs/pages/docs-link-scenarios.html b/docs/pages/docs-link-scenarios.html
index 6bf03100..e93c51b3 100755
--- a/docs/pages/docs-link-scenarios.html
+++ b/docs/pages/docs-link-scenarios.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+				<div class="content-primary">
 			<p>jQuery Mobile is designed to work with simple page linking conventions. The following list demonstrates how different types of links will be handled, either remotely or through an Ajax Request.</p> 
 
 			<ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
@@ -41,8 +41,36 @@
 				<li><a href="#">[href="#"]</a></li>
 			</ul>
 			
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/pages/docs-links-urltest/index.html b/docs/pages/docs-links-urltest/index.html
index cf4043d2..1d1d67dc 100644
--- a/docs/pages/docs-links-urltest/index.html
+++ b/docs/pages/docs-links-urltest/index.html
@@ -13,8 +13,8 @@
 </head> 
 <body> 
 
-	<div data-role="page" data-url="docs/pages/docs-links-urltest/" data-theme="f">
-		<div data-role="header">
+	<div data-role="page" data-url="docs/pages/docs-links-urltest/">
+		<div data-role="header" data-theme="f">
 			<h1>URL Test Page</h1>
 		</div>
 		<div data-role="content">
diff --git a/docs/pages/docs-links.html b/docs/pages/docs-links.html
index c894b345..cc010f7e 100755
--- a/docs/pages/docs-links.html
+++ b/docs/pages/docs-links.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+			<div class="content-primary">	
 			<p>jQuery Mobile is designed to work with simple page linking conventions. Essentially, you can link pages and assets as you normally would, and jQuery Mobile will automatically handle page requests in a single-page model, using Ajax when possible. When Ajax isn't possible (such as a non-same-domain url, or if specified using certain attributes on the link), a normal http request is used instead.</p> 
 
 			<p>The goal of this model is to allow developers to create websites using best practices &mdash; where ordinary links will "just work" without any special configuration &mdash; while creating a rich, native-like experience that can't be achieved with standard HTTP requests.</p> 
@@ -72,9 +72,36 @@
 		<p>Learn more about the technical details of the <a href="docs-navmodel.html">Ajax, hashes and history</a> in jQuery mobile.</p>
 		
 
-			
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/pages/docs-navmodel.html b/docs/pages/docs-navmodel.html
index 8b0800fb..273773f4 100644
--- a/docs/pages/docs-navmodel.html
+++ b/docs/pages/docs-navmodel.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 			<h2>jQuery Mobile's navigation model</h2> 
 
 			<p>A "page" in jQuery Mobile consists of an element (usually a <code>div</code>) with a <code> data-role</code> attribute set to <code>"page"</code>, which generally contains <code>div</code> elements with roles of <code>"header"</code>, <code>"content"</code>, and <code>"footer"</code>, each containing common markup, forms, and custom jQuery Mobile widgets.</p> 
@@ -94,9 +94,36 @@
 			<li><p>The "ui-page" key name used in sub-hash url references can be set to any value you'd like, so as to blend into your URL structure. This value is stored in <code>jQuery.mobile.subPageUrlKey</code>.</p></li> 
 			</ul>
 			
-			
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/pages/docs-pages.html b/docs/pages/docs-pages.html
index 96296aee..b7ba47a1 100644
--- a/docs/pages/docs-pages.html
+++ b/docs/pages/docs-pages.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 			<p>The jQuery Mobile "page" structure is optimized to support either single pages, or local internal linked "pages" within a page.</p> 
 			
 			<p>The goal of this model is to allow developers to create websites using best practices &mdash; where ordinary links will "just work" without any special configuration &mdash; while creating a rich, native-like experience that can't be achieved with standard HTTP requests.</p> 
@@ -192,9 +192,35 @@
 
 
 
+				</div><!--/content-primary -->		
 
-	</div><!-- /content -->
-</div><!-- /page -->
+				<div class="content-secondary">
 
-</body>
-</html>
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/pages/docs-transitions.html b/docs/pages/docs-transitions.html
index 197b127f..836df468 100755
--- a/docs/pages/docs-transitions.html
+++ b/docs/pages/docs-transitions.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 		<h2>Page transitions</h2> 
 
 		<p>The jQuery Mobile framework includes a set of six CSS-based transition effects that can be applied to any object or page change event, which apply the chosen transition when navigating to a new page and the reverse transition for the Back button. By default, the framework applies the right to left slide transition.</p>
@@ -48,8 +48,36 @@
 			<p><strong>Transitions from <a href="http://www.jqtouch.com/">jQtouch</a></strong> (<em>with small modifications</em>): Built by David Kaneda and maintained by Jonathan Stark.</p>
 		</div>
 			
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/pages/index.html b/docs/pages/index.html
index 73b025ed..f6b75729 100755
--- a/docs/pages/index.html
+++ b/docs/pages/index.html
@@ -21,7 +21,8 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-		<p>jQuery Mobile includes automatic AJAX page loading of external pages with back button history support, a set of animated page transitions and simple tools for displaying pages as dialogs.</p>
+
+				<p>jQuery Mobile includes automatic AJAX page loading of external pages with back button history support, a set of animated page transitions and simple tools for displaying pages as dialogs.</p>
 
 			
 		<ul data-role="listview" data-inset="true">
diff --git a/docs/pages/link-formats.html b/docs/pages/link-formats.html
index ef641d58..cdcf24b4 100755
--- a/docs/pages/link-formats.html
+++ b/docs/pages/link-formats.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 			<p>All standard HTML link types are supported in jQuery Mobile. To make the experience as polished as possible, any links to pages within the same domain will be automatically turned into Ajax requests and displayed with an animated page transition by the framework. </p>
 			<p>Links that point to other domains or that have <code>rel="external"</code>, <code>data-ajax="false"</code> or <code>target</code> attributes will not be loaded with Ajax and will cause a full page refresh. If multiple "pages" are contained within a single HTML document, they can be linked by referencing the ID of the page as an anchor (#foo).</p>
 			<p>All other types of links like <code>mailto:</code> and <code>tel:</code> aren't impacted by the framework and will work as expected. Learn more about the <a href="docs-navmodel.html">linking and navigation model</a> in jQuery Mobile</p>
@@ -44,8 +44,36 @@
 				<li data-role="list-divider">Other</li>
 				<li><a href="#">A href="#" will return false</a></li>
 			</ul>
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/pages/pages-themes.html b/docs/pages/pages-themes.html
index bb47d8b0..7ef9b2f3 100755
--- a/docs/pages/pages-themes.html
+++ b/docs/pages/pages-themes.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 			<h2>Page Theming</h2>
 			
 			<p>jQuery Mobile has a rich <a href="../api/themes.html">theming system</a> that gives you full control of how pages are styled. There is detailed theming documentation within each page widget, but let's look at a few high-level examples of how theming is applied.</p>
@@ -185,8 +185,35 @@
 			</div>
 
 
-	</div><!-- /content -->
-</div><!-- /page -->
+				</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li data-theme="a"><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/toolbars/bars-fixed.html b/docs/toolbars/bars-fixed.html
index c91ce444..ca23e549 100755
--- a/docs/toolbars/bars-fixed.html
+++ b/docs/toolbars/bars-fixed.html
@@ -22,7 +22,8 @@
 	</div>
 	
 	<div data-role="content">
-		<h2>Fixed toolbars will re-appear after you scroll</h2>
+		<div class="content-primary">
+				<h2>Fixed toolbars will re-appear after you scroll</h2>
 		<p>This is a demo of the "fixed" headers and footers used in the jQuery Mobile framework. The page content flows naturally, allowing us to take advantage of native scrolling instead of a scripting a faux-scrolling workaround. The header and footer divs are right in the flow of the document, but whenever they are out of view, you can tap the screen to make them appear. Tapping again or scrolling the page will cause them to appear back in the flow of the page (at the top and bottom). </p>
 		<p>To set this behavior on a header or footer, add the <code> data-position="fixed"</code> attribute to the toolbar container.</p>
 		
@@ -109,14 +110,38 @@
 		
 		<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.Donec non enim in turpis pulvinar facilisis. Ut felis.</p>
 		
-	</div>
-	
-	<div data-role="footer" data-position="fixed" data-theme="a">
-			<h1>Fixed Footer</h1>
-	</div>
 
 
-</div>
 
-</body>
-</html>
\ No newline at end of file
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="a">
+					<h1>Fixed Footer</h1>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/toolbars/bars-fullscreen.html b/docs/toolbars/bars-fullscreen.html
index 643564c0..b54af6e1 100755
--- a/docs/toolbars/bars-fullscreen.html
+++ b/docs/toolbars/bars-fullscreen.html
@@ -21,7 +21,8 @@
 	</div>
 	
 	<div data-role="content">
-		<img src="images/photo-run.jpeg" width="640" height="480" alt="Photo Run">
+			<div class="content-primary">
+				<img src="images/photo-run.jpeg" width="640" height="480" alt="Photo Run">
 	
 		<p class="ui-body">This page demonstrates the "fullscreen" toolbar mode. This toolbar treatment is used in special cases where you want the content to fill the whole screen, and you want the header and footer toolbars to appear and disappear when the page is clicked responsively &mdash; a common scenario for photo, image or video viewers.</p>
 		
@@ -29,16 +30,36 @@
 		
 		<p class="ui-body">Keep in mind that the toolbars in this mode will sit <strong>over</strong> page content, so not all content will be accessible with the toolbars open, just as shown in this demo.</p>
 			       
-			   
-		
-	</div>
-	
-	<div data-role="footer" data-position="fixed">
-			<h1>Fullscreen fixed footer</h1>
-	</div>
 
+				</div><!--/content-primary -->		
 
-</div>
+				<div class="content-secondary">
 
-</body>
-</html>
\ No newline at end of file
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="a" data-position="fixed">
+					<h1>Fullscreen Fixed Footer</h1>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/toolbars/bars-themes.html b/docs/toolbars/bars-themes.html
index c0a55078..46758912 100644
--- a/docs/toolbars/bars-themes.html
+++ b/docs/toolbars/bars-themes.html
@@ -22,7 +22,7 @@
 	
 
 	<div data-role="content">
-		
+		<div class="content-primary">	
 		<p>Both the header and footer bars will be styled by default with the theme's "a" color swatch (black in the default theme) because these bars are typically primary in the visual hierarchy of a page. </p>
 		
 			
@@ -140,7 +140,35 @@
 		</div>
 
 
-</div>
+				</div><!--/content-primary -->		
 
-</body>
-</html>
\ No newline at end of file
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/toolbars/docs-bars.html b/docs/toolbars/docs-bars.html
index 9f361f34..4f7dfc3a 100755
--- a/docs/toolbars/docs-bars.html
+++ b/docs/toolbars/docs-bars.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 	<h2>Toolbar types</h2>
 	
 	<p>In jQuery Mobile, there are two standard types of toolbars: Headers and Footers. </p>
@@ -45,10 +45,36 @@
 			<p>A <a href="bars-fullscreen.html"><strong>"fullscreen" position mode</strong></a> works just like the fixed mode except that the toolbars aren't shown at the top and bottom of the page and only appear when the page is clicked. This is useful for immersive apps like photo or video viewers where you want the content to full when whole screen and toolbars can be summoned to appear by tapping the screen. Keep in mind that the toolbars in this mode will sit <strong>over</strong> page content so this is best used for specific situations.</p>
 
 				
-					
-		
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/toolbars/docs-footers.html b/docs/toolbars/docs-footers.html
index f17f15e5..d6a588a3 100755
--- a/docs/toolbars/docs-footers.html
+++ b/docs/toolbars/docs-footers.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 			<h2>Footer bar structure</h2>
 
 			<p>The <code>footer</code> bar has the same basic structure as the header except it uses the <code> data-role</code> attribute value of <code>footer</code>. </p> 
@@ -116,11 +116,36 @@
 					
 
 					
-					
 
+						</div><!--/content-primary -->		
 
-	</div><!-- /content -->
-</div><!-- /page -->
+						<div class="content-secondary">
 
-</body>
-</html>
\ No newline at end of file
+							<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+									<h3>Demos &amp; Docs Sections</h3>
+
+									<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+										<li data-role="list-divider">Components</li>
+										<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+										<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+										<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+										<li><a href="../../docs/content/index.html">Content formatting</a></li>
+										<li><a href="../../docs/forms/index.html">Form elements</a></li>
+										<li><a href="../../docs/lists/index.html">List views</a></li>
+
+									</ul>
+							</div>
+						</div>		
+
+					</div><!-- /content -->
+
+					<div data-role="footer" class="footer-docs" data-theme="c">
+							<p>&copy;2011 The jQuery Project</p>
+					</div>
+
+					</div><!-- /page -->
+
+					</body>
+					</html>
\ No newline at end of file
diff --git a/docs/toolbars/docs-headers.html b/docs/toolbars/docs-headers.html
index 3d7b458f..f537d251 100755
--- a/docs/toolbars/docs-headers.html
+++ b/docs/toolbars/docs-headers.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-		
+		<div class="content-primary">	
 			<h2>Header structure</h2>
 			<p>The <code>header</code> is a toolbar at the top of the page that usually contains the page title text and optional buttons positioned to the the left and/or right of the title for navigation or actions.</p> 
 			
@@ -133,8 +133,36 @@
 			<p>If you need to to create a header that doesn't follow the default configuration, simply wrap your custom styled markup in a container <code>div</code> inside the header container and the plugin won't apply the automatic button logic so you can write custom styles for laying out the content in your header.</p> 
 
 
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+				</div><!--/content-primary -->		
+
+				<div class="content-secondary">
+
+					<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+							<h3>Demos &amp; Docs Sections</h3>
+
+							<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+								<li data-role="list-divider">Components</li>
+								<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+								<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+								<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+								<li><a href="../../docs/content/index.html">Content formatting</a></li>
+								<li><a href="../../docs/forms/index.html">Form elements</a></li>
+								<li><a href="../../docs/lists/index.html">List views</a></li>
+
+							</ul>
+					</div>
+				</div>		
+
+			</div><!-- /content -->
+
+			<div data-role="footer" class="footer-docs" data-theme="c">
+					<p>&copy;2011 The jQuery Project</p>
+			</div>
+
+			</div><!-- /page -->
+
+			</body>
+			</html>
\ No newline at end of file
diff --git a/docs/toolbars/docs-navbar.html b/docs/toolbars/docs-navbar.html
index c27d337e..0ec9bfad 100755
--- a/docs/toolbars/docs-navbar.html
+++ b/docs/toolbars/docs-navbar.html
@@ -21,7 +21,7 @@
 	</div><!-- /header -->
 
 	<div data-role="content">
-			
+		<div class="content-primary">		
 	<h2>Simple navbar</h2>
 	
 	<p>jQuery Mobile has a very basic navbar widget that is useful for providing up to 5 buttons with optional icons in a bar  , typically within a header or footer. </p>
@@ -206,9 +206,36 @@
 		</div><!-- /navbar -->
 	</div><!-- /footer -->
 					
-		
-	</div><!-- /content -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+		</div><!--/content-primary -->		
+
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
+	<div data-role="footer" class="footer-docs" data-theme="c">
+			<p>&copy;2011 The jQuery Project</p>
+	</div>
+
+	</div><!-- /page -->
+
+	</body>
+	</html>
\ No newline at end of file
diff --git a/docs/toolbars/footer-persist-a.html b/docs/toolbars/footer-persist-a.html
index 00157e8d..86118f1a 100755
--- a/docs/toolbars/footer-persist-a.html
+++ b/docs/toolbars/footer-persist-a.html
@@ -21,7 +21,7 @@
 	</div>
 	
 	<div data-role="content">
-	
+		<div class="content-primary">
 				<p>This page is a demo of a persistent footer navigation bar. At the foot of the page, you'll see a persistent horizontal navigation bar. Click on any of the links, and you'll see the page content transition but the footer remain fixed: The footer sticks persistently even when transitioning to a new HTML page, because the footer on all four HTML pages has the same <code>data-id</code> attribute. <strong>Note:</strong> If you'd like an active button in your navbar to remain active when you return to it again, add a class of <code>ui-state-persist</code> in addition to <code>ui-btn-active</code></p>
 
 	
@@ -64,8 +64,38 @@
 					<li data-role="list-divider">S</li>
 					<li><a href="index.html">Sawyer Wakefield</a></li>
 				</ul>
-	</div>
 	
+
+
+
+
+
+
+
+		</div><!--/content-primary -->		
+
+		<div class="content-secondary">
+
+			<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+					<h3>Demos &amp; Docs Sections</h3>
+
+					<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+						<li data-role="list-divider">Components</li>
+						<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+						<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+						<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+						<li><a href="../../docs/content/index.html">Content formatting</a></li>
+						<li><a href="../../docs/forms/index.html">Form elements</a></li>
+						<li><a href="../../docs/lists/index.html">List views</a></li>
+
+					</ul>
+			</div>
+		</div>		
+
+	</div><!-- /content -->
+
 	<div data-role="footer" data-id="foo1" data-position="fixed">
 		<div data-role="navbar">
 			<ul>
@@ -75,7 +105,8 @@
 			</ul>
 		</div><!-- /navbar -->
 	</div><!-- /footer -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+	</div><!-- /page -->
+
+	</body>
+	</html>
\ No newline at end of file
diff --git a/docs/toolbars/footer-persist-b.html b/docs/toolbars/footer-persist-b.html
index 323f0ccb..cae98046 100755
--- a/docs/toolbars/footer-persist-b.html
+++ b/docs/toolbars/footer-persist-b.html
@@ -21,7 +21,8 @@
 	</div>
 	
 	<div data-role="content">
-			<ul data-role="listview" data-split-icon="gear" data-split-theme="d">
+		<div class="content-primary">
+					<ul data-role="listview" data-split-icon="gear" data-split-theme="d">
 			<li><a href="index.html">
 				<img src="../lists/images/album-bb.jpg" />
 				<h3>Broken Bells</h3>
@@ -94,18 +95,42 @@
 		</ul>
 		
 
-	</div>
-	
-	<div data-role="footer" data-id="foo1" data-position="fixed">
-		<div data-role="navbar">
-			<ul>
-				<li><a href="footer-persist-a.html">Friends</a></li>
-				<li><a href="footer-persist-b.html" class="ui-btn-active ui-state-persist">Albums</a></li>
-				<li><a href="footer-persist-c.html">Emails</a></li>
-			</ul>
-		</div><!-- /navbar -->
-	</div><!-- /footer -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+			</div><!--/content-primary -->		
+
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" data-id="foo1" data-position="fixed">
+			<div data-role="navbar">
+				<ul>
+					<li><a href="footer-persist-a.html">Friends</a></li>
+					<li><a href="footer-persist-b.html" class="ui-btn-active ui-state-persist">Albums</a></li>
+					<li><a href="footer-persist-c.html">Emails</a></li>
+				</ul>
+			</div><!-- /navbar -->
+		</div><!-- /footer -->
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
\ No newline at end of file
diff --git a/docs/toolbars/footer-persist-c.html b/docs/toolbars/footer-persist-c.html
index b86221c5..c1bbfdfe 100755
--- a/docs/toolbars/footer-persist-c.html
+++ b/docs/toolbars/footer-persist-c.html
@@ -21,7 +21,8 @@
 	</div>
 	
 	<div data-role="content">
-		<ul data-role="listview">
+		<div class="content-primary">
+				<ul data-role="listview">
 			<li data-role="list-divider">Friday, October 8, 2010 <span class="ui-li-count">2</span></li>
 			<li><a href="index.html">
 				
@@ -79,18 +80,42 @@
 					<p class="ui-li-aside"><strong>6:24</strong>AM</p>
 				</a></li>
 		</ul>
-	</div>
-	
-	<div data-role="footer" data-id="foo1" data-position="fixed">
-		<div data-role="navbar">
-			<ul>
-				<li><a href="footer-persist-a.html">Friends</a></li>
-				<li><a href="footer-persist-b.html">Albums</a></li>
-				<li><a href="footer-persist-c.html" class="ui-btn-active ui-state-persist">Emails</a></li>
-			</ul>
-		</div><!-- /navbar -->
-	</div><!-- /footer -->
-</div><!-- /page -->
 
-</body>
-</html>
\ No newline at end of file
+			</div><!--/content-primary -->		
+
+			<div class="content-secondary">
+
+				<div data-role="collapsible" data-collapsed="true" data-theme="b">
+
+						<h3>Demos &amp; Docs Sections</h3>
+
+						<ul data-role="listview" data-theme="c" data-dividertheme="d">
+
+							<li data-role="list-divider">Components</li>
+							<li><a href="../../docs/pages/index.html">Pages &amp; dialogs</a></li>
+							<li data-theme="a"><a href="../../docs/toolbars/index.html">Toolbars</a></li>
+							<li><a href="../../docs/buttons/index.html">Buttons</a></li>
+							<li><a href="../../docs/content/index.html">Content formatting</a></li>
+							<li><a href="../../docs/forms/index.html">Form elements</a></li>
+							<li><a href="../../docs/lists/index.html">List views</a></li>
+
+						</ul>
+				</div>
+			</div>		
+
+		</div><!-- /content -->
+
+		<div data-role="footer" data-id="foo1" data-position="fixed">
+			<div data-role="navbar">
+				<ul>
+					<li><a href="footer-persist-a.html">Friends</a></li>
+					<li><a href="footer-persist-b.html">Albums</a></li>
+					<li><a href="footer-persist-c.html" class="ui-btn-active ui-state-persist">Emails</a></li>
+				</ul>
+			</div><!-- /navbar -->
+		</div><!-- /footer -->
+
+		</div><!-- /page -->
+
+		</body>
+		</html>
\ No newline at end of file