143be9bfa42cd43087b2c676721d7c653bf66f47
kate
  Wed Jan 18 15:17:07 2017 -0800
Add first cut h3 tag styling. refs 18504

diff --git src/hg/htdocs/template.html src/hg/htdocs/template.html
index aca75e8..1183c08 100755
--- src/hg/htdocs/template.html
+++ src/hg/htdocs/template.html
@@ -47,66 +47,72 @@
     div.
     </p>
     <p>
     NOTE: The two columns will only appear on wider screens.  On small screens, the sections will be
     stacked vertically (a feature of bootstrap responsive layout).
     </p>
 
 <!-- Preformatted code example -->
     <p>
     Here is some code:
     </p>
 <pre><code>sudo -i
 bash browserSetup.sh install</code></pre>
 
 <p>
-And here is some text with a <code>bit of code</code> embedded.
+And <span>here</span> is some text with a <code>bit of code</code> embedded.
 </p>
+  </div>
+
+<!-- Right column -->
+  <div class="col-md-6">
+    <h2>Another section</h2>
+
+<!-- Subsections -->
+    <p>
+    Here are two subsections.
+    </p>
+      <h3>Lists</h3>
+        <p>
+        Here is a bulleted list ('ul' and 'li' elements):
+        </p>
+<!-- Bulleted list example -->
+      <ul>
+        <li>red</li>
+        <li>white</li>
+        <li>blue</li>
+      </ul>
 
 <!-- Numbered list example -->
     <p>
     Here is a numbered list ('ol' and 'li' elements):
     </p>
     <ol>
       <li>
       <strong>chrom</strong> - The name of the chromosome (e.g. chr3, chrY, chr2_random) or 
       scaffold (e.g. scaffold10671).</li>
       <li>
       <strong>chromStart</strong> - The starting position of the feature in the chromosome or 
       scaffold.  The first base in a chromosome is numbered 0.</li>
       <li>
       <strong>chromEnd</strong> - The ending position of the feature in the chromosome or scaffold. 
       The <em>chromEnd</em> base is not included in the display of the feature. 
       For example, the first 100 bases of a chromosome are defined 
       as <em>chromStart=0, chromEnd=100</em>, and span the bases numbered 0-99.</li>
     </ol>
-  </div>
-
-<!-- Right column -->
-  <div class="col-md-6">
-    <h2>Another section</h2>
-    <p>
-    Here is a bulleted list ('ul' and 'li' elements):
-    </p>
-
-<!-- Bulleted list example -->
-    <ul>
-      <li>red</li>
-      <li>white</li>
-      <li>blue</li>
-    </ul>
 
+        <h3>Tables</h3>
     <p>
     Here is a table ('table', 'tr', 'th', and 'td' elements):
     </p>
 
 <!-- Table example -->
     <table>
       <tr>
         <th>Type</th>
         <th>Total</th>
       </tr>
       <tr>
         <td>Chromosomes</td>
         <td>261</td>
       </tr>
       <tr>