7 files changed, 21 insertions, 23 deletions
diff --git a/site/public/about/credits/index.html b/site/public/about/credits/index.html
index 0b3f9db8..9fec7e64 100644
--- a/site/public/about/credits/index.html
+++ b/site/public/about/credits/index.html
@@ -20,15 +20,14 @@
     <div class='links'>
       <a href="/search">Face Search</a>
       <a href="/datasets">Datasets</a>
-      <a href="/research/from_1_to_100_pixels/">Research</a>
+      <a href="/">Research</a>
       <a href="/about">About</a>
     </div>
   </header>
   <div class="content">
     
   <section><h1>Credits</h1>
-<p><img src="https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg" alt="alt text"></p>
-<ul>
+</section><section class='images'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg' alt='alt text'><div class='caption'>alt text</div></div></section><section><ul>
 <li>MegaPixels by Adam Harvey</li>
 <li>Made with support from Mozilla</li>
 <li>Site developed by Jules Laplace</li>
diff --git a/site/public/about/disclaimer/index.html b/site/public/about/disclaimer/index.html
index 1c14a97c..553bf084 100644
--- a/site/public/about/disclaimer/index.html
+++ b/site/public/about/disclaimer/index.html
@@ -20,7 +20,7 @@
     <div class='links'>
       <a href="/search">Face Search</a>
       <a href="/datasets">Datasets</a>
-      <a href="/research/from_1_to_100_pixels/">Research</a>
+      <a href="/">Research</a>
       <a href="/about">About</a>
     </div>
   </header>
diff --git a/site/public/about/index.html b/site/public/about/index.html
index 8441e317..363e8fc0 100644
--- a/site/public/about/index.html
+++ b/site/public/about/index.html
@@ -20,14 +20,13 @@
     <div class='links'>
       <a href="/search">Face Search</a>
       <a href="/datasets">Datasets</a>
-      <a href="/research/from_1_to_100_pixels/">Research</a>
+      <a href="/">Research</a>
       <a href="/about">About</a>
     </div>
   </header>
   <div class="content">
     
-  <section><p><img src="https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg" alt="alt text"></p>
-<ul>
+  <section class='images'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg' alt='alt text'><div class='caption'>alt text</div></div></section><section><ul>
 <li>MegaPixels by Adam Harvey</li>
 <li>Made with support from Mozilla</li>
 <li>Site developed by Jules Laplace</li>
diff --git a/site/public/about/press/index.html b/site/public/about/press/index.html
index 76ba90e4..aa6e5e13 100644
--- a/site/public/about/press/index.html
+++ b/site/public/about/press/index.html
@@ -20,15 +20,14 @@
     <div class='links'>
       <a href="/search">Face Search</a>
       <a href="/datasets">Datasets</a>
-      <a href="/research/from_1_to_100_pixels/">Research</a>
+      <a href="/">Research</a>
       <a href="/about">About</a>
     </div>
   </header>
   <div class="content">
     
   <section><h1>Press</h1>
-<p><img src="https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg" alt="alt text"></p>
-<ul>
+</section><section class='images'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg' alt='alt text'><div class='caption'>alt text</div></div></section><section><ul>
 <li>Aug 22, 2018: "Transgender YouTubers had their videos grabbed to train facial recognition software" by James Vincent <a href="https://www.theverge.com/2017/8/22/16180080/transgender-youtubers-ai-facial-recognition-dataset">https://www.theverge.com/2017/8/22/16180080/transgender-youtubers-ai-facial-recognition-dataset</a></li>
 <li>Aug 22, 2018: "Transgender YouTubers had their videos grabbed to train facial recognition software" by James Vincent <a href="https://www.theverge.com/2017/8/22/16180080/transgender-youtubers-ai-facial-recognition-dataset">https://www.theverge.com/2017/8/22/16180080/transgender-youtubers-ai-facial-recognition-dataset</a></li>
 <li>Aug 22, 2018: "Transgender YouTubers had their videos grabbed to train facial recognition software" by James Vincent <a href="https://www.theverge.com/2017/8/22/16180080/transgender-youtubers-ai-facial-recognition-dataset">https://www.theverge.com/2017/8/22/16180080/transgender-youtubers-ai-facial-recognition-dataset</a></li>
diff --git a/site/public/about/privacy/index.html b/site/public/about/privacy/index.html
index 21fd2255..d1ec1c77 100644
--- a/site/public/about/privacy/index.html
+++ b/site/public/about/privacy/index.html
@@ -20,7 +20,7 @@
     <div class='links'>
       <a href="/search">Face Search</a>
       <a href="/datasets">Datasets</a>
-      <a href="/research/from_1_to_100_pixels/">Research</a>
+      <a href="/">Research</a>
       <a href="/about">About</a>
     </div>
   </header>
diff --git a/site/public/about/style/index.html b/site/public/about/style/index.html
index 2e0c80d0..24e6f5be 100644
--- a/site/public/about/style/index.html
+++ b/site/public/about/style/index.html
@@ -20,21 +20,19 @@
     <div class='links'>
       <a href="/search">Face Search</a>
       <a href="/datasets">Datasets</a>
-      <a href="/research/from_1_to_100_pixels/">Research</a>
+      <a href="/">Research</a>
       <a href="/about">About</a>
     </div>
   </header>
   <div class="content">
     
-  <section><p><img src="https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg" alt="Alt text here"></p>
-<h1>Header 1</h1>
-<h2>Header 2</h2>
+  <section class='images'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/test.jpg' alt='Alt text here'><div class='caption'>Alt text here</div></div></section><section><h2>Header 2</h2>
 <h3>Header 3</h3>
 <h4>Header 4</h4>
 <h5>Header 5</h5>
 <h6>Header 6</h6>
 <p><strong>Bold text</strong>, <em>italic text</em>, <strong><em>bold italic text</em></strong></p>
-<p>At vero eos et et iusto qui blanditiis <a href="#">praesentium voluptatum</a> deleniti atque corrupti<sup class="footnote-ref" id="fnref-1"><a href="#fn-1">1</a></sup>, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non-provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio<sup class="footnote-ref" id="fnref-2"><a href="#fn-2">2</a></sup>. Nam libero tempore, cum soluta nobis est eligendi optio, cumque nihil impedit, quo minus id, quod maxime placeat, facere possimus, omnis voluptas assumenda est, omnis dolor repellendus<sup class="footnote-ref" id="fnref-3"><a href="#fn-3">3</a></sup>.</p>
+<p>At vero eos et et iusto qui blanditiis <a href="#">praesentium voluptatum</a> deleniti atque corrupti[^1], quos dolores et quas molestias excepturi sint, obcaecati cupiditate non-provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio[^2]. Nam libero tempore, cum soluta nobis est eligendi optio, cumque nihil impedit, quo minus id, quod maxime placeat, facere possimus, omnis voluptas assumenda est, omnis dolor repellendus[^3].</p>
 <ul>
 <li>Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium</li>
 <li>Totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo</li>
@@ -42,9 +40,15 @@
 <li>Odit aut fugit, sed quia consequuntur magni dolores eos</li>
 <li>Qui ratione voluptatem sequi nesciunt, neque porro quisquam </li>
 </ul>
-<blockquote><p>est, qui dolorem ipsum, quia dolor sit amet consectetur adipisci[ng] velit, sed quia non-numquam [do] eius modi tempora inci[di]dunt, ut labore et dolore magnam aliquam quaerat voluptatem.</p>
+<h2>single image test</h2>
+</section><section class='images'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/man.jpg' alt='This person is alone'><div class='caption'>This person is alone</div></div></section><section><h2>double image test</h2>
+</section><section class='images'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/man.jpg' alt='This person is on the left'><div class='caption'>This person is on the left</div></div>
+<div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/man.jpg' alt='This person is on the right'><div class='caption'>This person is on the right</div></div></section><section><h2>triple image test</h2>
+</section><section class='images'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/man.jpg' alt='Person 1'><div class='caption'>Person 1</div></div>
+<div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/man.jpg' alt='Person 2'><div class='caption'>Person 2</div></div>
+<div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/man.jpg' alt='Person 3. Let me tell you about Person 3.  This person has a very long description with text which wraps like crazy'><div class='caption'>Person 3. Let me tell you about Person 3.  This person has a very long description with text which wraps like crazy</div></div></section><section><blockquote><p>est, qui dolorem ipsum, quia dolor sit amet consectetur adipisci[ng] velit, sed quia non-numquam [do] eius modi tempora inci[di]dunt, ut labore et dolore magnam aliquam quaerat voluptatem.</p>
 </blockquote>
-<p>Inline <code>code</code> has <code>back-ticks around</code> it.</p>
+</section><section class='wide'><div class='image'><img src='https://nyc3.digitaloceanspaces.com/megapixels/v1/site/about/assets/wide-test.jpg' alt='This image is extremely wide and the text beneath it will wrap but thats fine because it can also contain <a href="https://example.com/">hyperlinks</a>! Yes, you read that right&mdash;hyperlinks! Lorem ipsum dolor sit amet ad volotesque sic hoc ad nauseam'><div class='caption'>This image is extremely wide and the text beneath it will wrap but that's fine because it can also contain <a href="https://example.com/">hyperlinks</a>! Yes, you read that right&mdash;hyperlinks! Lorem ipsum dolor sit amet ad volotesque sic hoc ad nauseam</div></div></section><section><p>Inline <code>code</code> has <code>back-ticks around</code> it.</p>
 <pre><code class="lang-javascript">var s = &quot;JavaScript syntax highlighting&quot;;
 alert(s);
 </code></pre>
@@ -59,10 +63,7 @@ But let's throw in a &lt;b&gt;tag&lt;/b&gt;.
 <p>Citations below here</p>
 <div class="footnotes">
 <hr>
-<ol><li id="fn-1"><p>First source<a href="#fnref-1" class="footnote">&#8617;</a></p></li>
-<li id="fn-2"><p>Second source<a href="#fnref-2" class="footnote">&#8617;</a></p></li>
-<li id="fn-3"><p>Third source<a href="#fnref-3" class="footnote">&#8617;</a></p></li>
-</ol>
+<ol></ol>
 </div>
 </section>
 
diff --git a/site/public/about/terms/index.html b/site/public/about/terms/index.html
index 73155546..4b9f4445 100644
--- a/site/public/about/terms/index.html
+++ b/site/public/about/terms/index.html
@@ -20,7 +20,7 @@
     <div class='links'>
       <a href="/search">Face Search</a>
       <a href="/datasets">Datasets</a>
-      <a href="/research/from_1_to_100_pixels/">Research</a>
+      <a href="/">Research</a>
       <a href="/about">About</a>
     </div>
   </header>