Removing unused images, a tiny bit of styling

build.py

@@ -503,19 +503,19 @@ for header in fileStruct:
 
 	if level == 0:
 		toc = toc + '<h2>Part ' + num2roman(levelNums[level]) + ': ' + header['title'] + '</h2>\n';
-		oph = '<h1' + opl +'>Part ' + num2roman(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
+		oph = '<h1 class="clear"' + opl +'>Part ' + num2roman(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
 	elif level == 1:
 		toc = toc + '  <p class="chapter">Ch. ' + str(levelNums[level]) + ':&nbsp;&nbsp;<a href="/' + header['filename'] + '/">' + header['title'] + '</a></p>\n'
-		oph = '<h1' + opl +'>Chapter ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
+		oph = '<h1 class="clear"' + opl +'>Chapter ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
 	elif level == 2:
 		toc = toc + '    <p class="subchapter"><a href="/' + header['filename'] + '/">' + header['title'] + '</a></p>\n'
-		oph = '<h1' + opl +'>Subchapter ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
+		oph = '<h1 class="clear"' + opl +'>Subchapter ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
 	elif level == 3:
 		toc = toc + '      <p class="section"><a href="/' + header['filename'] + '/">' + header['title'] + '</a></p>\n'
-		oph = '<h1' + opl +'>Section ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
+		oph = '<h1 class="clear"' + opl +'>Section ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
 	elif level == 4:
 		toc = toc + '      <p class="subsection"><a href="/' + header['filename'] + '/">' + header['title'] + '</a></p>\n'
-		oph = '<h1' + opl +'>Subsection ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
+		oph = '<h1 class="clear"' + opl +'>Subsection ' + str(levelNums[level]) + ': ' + header['title'] + '</h1>\n';
 
 
 

include/control-masters-mixer-strips.html

@@ -47,15 +47,22 @@ A VCA strip is made of (from top to bottom in the screenshot):
 
 <h2>Connecting to a VCA strip</h2>
 
-<img class="left" src="/images/connecting_to_vca.png" alt="Connecting to VCA">
+<figure class="left">
+  <img src="/images/connecting_to_vca.png" alt="Connecting to VCA">
+  <figcaption>
+    Connecting to a VCA
+  </figcaption>
+</figure>
 
 <p>
 	Connecting a track/bus/VCA to a VCA is as simple as clicking the VCA button that appears on any mixer strip
   under the main fader and choosing the VCA to connect to.
 </p>
 
-<p class="note">The VCA button only shows up in mixer strips when at least one VCA exists, i.e., a
+<p class="note">
-  VCA must be created <em>before</em> connecting tracks to it.</p>
+  The VCA button only shows up in mixer strips when at least one VCA exists, i.e., a
+  VCA must be created <em>before</em> connecting tracks to it.
+</p>
 
 <p>
   Clicking the VCA button shows all the VCAs in the session, and any or all of this VCA can be checked
@@ -63,4 +70,3 @@ A VCA strip is made of (from top to bottom in the screenshot):
   multiple buttons. Disconnecting a VCA from a track is done by unchecking this VCA in
   the list that pops up, or clicking <kbd class="menu">Unassign All</kbd> to disconnect from all VCAs at once.
 </p>
-

include/monitoring-tab.html

@@ -3,7 +3,12 @@
   Provides options affecting monitoring.
 </p>
 
-<img src="/images/a4_session_properties_monitoring.png" alt="session properties monitoring tab"/>
+<figure class="center">
+  <img src="/images/a4_session_properties_monitoring.png" alt="session properties monitoring tab">
+  <figcaption>
+    The session properties 'monitoring' tab
+  </figcaption>
+</figure>
 
 <p>
   The <strong>Track Input Monitoring automatically follows transport state</strong>
@@ -11,10 +16,8 @@
   <a href="@@monitor-setup-in-ardour">Monitor Setup in Ardour</a>.
 </p>
 
-<img class="left" src="/images/a4_monitoring_section.png" alt="monitoring section"/>
-
 <p>
   The 'Use monitor section' displays an extra section in the <strong>Mixer</strong>
   window that is modelled on the similarly named section on large analog consoles.
+  More information can be found on the <a href="@@monitor-section">Monitor Section</a> page.
 </p>
-

source/css/app.css

@@ -122,6 +122,7 @@ ul.inside li, ol.inside li {
   padding-bottom: .3ex;
 }
 
+#content h1.clear,
 #content h2.clear,
 #content h3.clear,
 #content h4.clear {
@@ -275,6 +276,8 @@ ul.inside li, ol.inside li {
 	display: table-caption;
 	caption-side: bottom;
 	font-style: italic;
+  padding-top: 0.5em;
+  padding-bottom: 1em;
 }
 
 #content figcaption.center {
@@ -492,7 +495,7 @@ samp:after {
 
 #content img.mini:hover {
   width: 100%;
-  /*transition: width .5s ease; doesn't work on right-floated figures */ 
+  /*transition: width .5s ease; doesn't work on right-floated figures */
 }
 
 #content p.center {