diff --git a/src/gpxtable/templates/base.html b/src/gpxtable/templates/base.html
index 08a8e92..4207d17 100644
--- a/src/gpxtable/templates/base.html
+++ b/src/gpxtable/templates/base.html
@@ -16,20 +16,8 @@
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
         integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" crossorigin="anonymous">
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1/themes/prism.min.css" crossorigin="anonymous">
-    <style>
-        pre[class*="language-"] {
-            position: relative;
-            margin: 5px 0 ;
-            padding: 1.75rem 0 1.75rem 1rem;
-          }
-
-          pre[class*="language-"] button{
-            position: absolute;
-            top: 5px;
-            right: 5px;
-          }
-    </style>
+    {% block extrahead -%}
+    {%- endblock %}
 </head>
 
 <body>
@@ -77,47 +65,13 @@
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
         integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
         crossorigin="anonymous"></script>
-    <script src="https://cdn.jsdelivr.net/npm/prismjs@1/prism.min.js"></script>
     <script>
         // bootstrap-style tooltips
         const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
         const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
     </script>
-    <script>
-        // code copy buttons -- where there is a pre/code block, add a copy button
-        const copyButtonLabel = "Copy Code";
-
-        // use a class selector if available
-        let blocks = document.querySelectorAll("pre");
-
-        blocks.forEach((block) => {
-        // only add button if browser supports Clipboard API
-        if (navigator.clipboard) {
-            let button = document.createElement("button");
-
-            button.innerText = copyButtonLabel;
-            block.appendChild(button);
-
-            button.addEventListener("click", async () => {
-            await copyCode(block);
-            });
-        }
-        });
-
-        async function copyCode(block, button) {
-            let code = block.querySelector("code");
-            let text = code.innerText;
-
-            await navigator.clipboard.writeText(text);
-
-            // visual feedback that task is completed
-            button.innerText = "Code Copied";
-
-            setTimeout(() => {
-              button.innerText = copyButtonLabel;
-            }, 700);
-          }
-    </script>
+    {% block extrabody -%}
+    {%- endblock %}
 </body>
 
 </html>
diff --git a/src/gpxtable/templates/results.html b/src/gpxtable/templates/results.html
index 2d872ac..2ddfd94 100644
--- a/src/gpxtable/templates/results.html
+++ b/src/gpxtable/templates/results.html
@@ -1,24 +1,79 @@
 {% extends 'base.html' %}
 
 {% block content %}
-<div class="row g-3">
-    <div class="col-lg">
-        <h1>{% block title %} GPXTable Results {% endblock %}</h1>
-
-        {% if format == "html" %}
-            <div class="border m-3">
-                {{ output | safe }}
-            </div>
-        {% elif format == "markdown" %}
-            <pre class="border m-3"><code class="language-markdown">
-                    {{- output | safe -}}
-            </code></pre>
-        {% else %}
-            <pre><code class="language-html">
-                    {{- output | safe -}}
-            </code></pre>
-        {% endif %}
+    <div class="row g-3">
+        <div class="col-lg">
+            <h1>{% block title %} GPXTable Results {% endblock %}</h1>
+
+            {% if format == "html" %}
+                <div class="border m-3">
+                    {{ output | safe }}
+                </div>
+            {% elif format == "markdown" %}
+                <pre class="border m-3"><code class="language-markdown">
+                        {{- output | safe -}}
+                </code></pre>
+            {% else %}
+                <pre><code class="language-html">
+                        {{- output | safe -}}
+                </code></pre>
+            {% endif %}
+        </div>
     </div>
-</div>
+{% endblock %}
+{% block extrahead %}
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prismjs@1/themes/prism.min.css" crossorigin="anonymous">
+    <style>
+        pre[class*="language-"] {
+            position: relative;
+            margin: 5px 0 ;
+            padding: 1.75rem 0 1.75rem 1rem;
+        }
+
+        pre[class*="language-"] button{
+            position: absolute;
+            top: 5px;
+            right: 5px;
+        }
+    </style>
+{% endblock %}
+{% block extrabody %}
+    <script src="https://cdn.jsdelivr.net/npm/prismjs@1/prism.min.js" crossorigin="anonymous"></script>
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            // code copy buttons -- where there is a pre/code block, add a copy button
+            const copyButtonLabel = "Copy";
+
+            // use a class selector if available
+            let blocks = document.querySelectorAll("pre");
+
+            blocks.forEach((block) => {
+            // only add button if browser supports Clipboard API
+                if (navigator.clipboard) {
+                    let button = document.createElement("button");
+
+                    button.innerText = copyButtonLabel;
+                    block.appendChild(button);
+
+                    button.addEventListener("click", async () => {
+                        await copyCode(block, button);
+                    });
+                }
+            });
+
+            async function copyCode(block, button) {
+                let code = block.querySelector("code");
+                let text = code.innerText;
+
+                await navigator.clipboard.writeText(text);
+
+                // visual feedback that task is completed
+                button.innerText = "Copied";
 
+                setTimeout(() => {
+                    button.innerText = copyButtonLabel;
+                }, 700);
+            }
+        });
+    </script>
 {% endblock %}
\ No newline at end of file
diff --git a/src/gpxtable/templates/upload.html b/src/gpxtable/templates/upload.html
index 6d24a67..dd3b659 100644
--- a/src/gpxtable/templates/upload.html
+++ b/src/gpxtable/templates/upload.html
@@ -2,96 +2,97 @@
 
 {% block content %}
 <div class="row g-3">
-  <div class="col-lg-6">
-    <h1>{% block title %} GPX Upload {% endblock %}</h1>
-    {% with messages = get_flashed_messages() %}
-      {% if messages %}
-        {% for message in messages %}
-          <div class="alert alert-primary" role="alert">{{ message }}</div>
-        {% endfor %}
-      {% endif %}
-    {% endwith %}
-    <form class="my-2" id="gpx_upload" method="post" enctype="multipart/form-data" onsubmit="return validateForm()">
-      <div class="row border my-3 p-2">
-        <div class="input-group my-3">
-          <label class="input-group-text" for="gpxFile">GPX file</label>
-          <input class="form-control" type="file" id="gpxFile" name="file">
-        </div>
-        <div class="mb-3">
-          or
-        </div>
-        <div class="input-group mb-3">
-          <label class="input-group-text" for="gpxUrl">URL to GPX file</label>
-          <input class="form-control" type="url" id="gpxUrl" name="url">
-        </div>
-      </div>
-
-      <div class="input-group my-3">
-        <label class="input-group-text" for="departure" data-bs-toggle="tooltip" title="Override or specify daily departure time">Departing&nbsp;<i class="bi bi-info-circle"></i></label>
-        <input class="form-control" type="datetime-local" id="departure" name="departure">
-      </div>
-
-      <div class="input-group my-3">
-        <label class="input-group-text" for="speed" data-bs-toggle="tooltip" title="Override travel speed">Speed&nbsp;<i class="bi bi-info-circle"></i></label>
-        <input class="form-control" type="text" id="speed" name="speed" pattern="[\d\.]*" inputmode="numeric" size="3"
-                aria-describedby="speedHelp">
-      </div>
-
-      <div class="input-group my-3">
-        <label class="input-group-text" for="tz" data-bs-toggle="tooltip" title="Local time zone">Timezone&nbsp;<i class="bi bi-info-circle"></i></label>
-        <input class="form-control" type="text" id="tz" name="tz" aria-describedby="tzHelp" default="">
-      </div>
-
-      <div class="input-group my-3">
-        <label class="input-group-text" for="output">Output format</label>
-        <select class="form-control" id="output" name="output">
-          <option value="markdown" selected>Markdown</option>
-          <option value="html">HTML</option>
-          <option value="htmlcode">HTML cut-and-paste</option>
-        </select>
-      </div>
-
-      <div class="my-3">
-        <div class="form-check form-switch">
-          <label class="form-check-label" for="metric">Use Metric Units</label>
-          <input class="form-check-input" type="checkbox" name="metric" id="metric">
-        </div>
-
-        <div class="form-check form-switch">
-          <label class="form-check-label" for="coordinates">Display Lat/Long</label>
-          <input class="form-check-input" type="checkbox" id="coordinates" name="coordinates">
-        </div>
-
-        <div class="form-check form-switch">
-          <label class="form-check-label" for="ignore_times">Ignore GPX times</label>
-          <input class="form-check-input" type="checkbox" id="ignore_times" name="ignore_times">
-        </div>
-      </div>
-
-      <button class="btn btn-primary mb-3" type="submit">Submit</button>
-    </form>
-  </div>
+    <div class="col-lg-6">
+        <h1>{% block title %} GPX Upload {% endblock %}</h1>
+        {% with messages = get_flashed_messages() %}
+            {% if messages %}
+                {% for message in messages %}
+                    <div class="alert alert-primary" role="alert">{{ message }}</div>
+                {% endfor %}
+            {% endif %}
+        {% endwith %}
+        <form class="my-2" id="gpx_upload" method="post" enctype="multipart/form-data" onsubmit="return validateForm()">
+            <div class="row border my-3 p-2">
+                <div class="input-group my-3">
+                    <label class="input-group-text" for="gpxFile">GPX file</label>
+                    <input class="form-control" type="file" id="gpxFile" name="file">
+                </div>
+                <div class="mb-3">
+                    or
+                </div>
+                <div class="input-group mb-3">
+                    <label class="input-group-text" for="gpxUrl">URL to GPX file</label>
+                    <input class="form-control" type="url" id="gpxUrl" name="url">
+                </div>
+            </div>
+            <div class="row border my-3 p-2">
+                <h2 class="h4">Options</h2>
+                <div class="input-group my-3">
+                    <label class="input-group-text" for="departure" data-bs-toggle="tooltip"
+                        title="Override or specify daily departure time">Departing&nbsp;<i
+                            class="bi bi-info-circle"></i></label>
+                    <input class="form-control" type="datetime-local" id="departure" name="departure">
+                </div>
+                <div class="input-group my-3">
+                    <label class="input-group-text" for="speed" data-bs-toggle="tooltip"
+                        title="Override travel speed">Speed&nbsp;<i class="bi bi-info-circle"></i></label>
+                    <input class="form-control" type="text" id="speed" name="speed" pattern="[\d\.]*"
+                        inputmode="numeric" size="3" aria-describedby="speedHelp">
+                </div>
+                <div class="input-group my-3">
+                    <label class="input-group-text" for="tz" data-bs-toggle="tooltip"
+                        title="Local time zone">Timezone&nbsp;<i class="bi bi-info-circle"></i></label>
+                    <input class="form-control" type="text" id="tz" name="tz" aria-describedby="tzHelp" default="">
+                </div>
+                <div class="input-group my-3">
+                    <label class="input-group-text" for="output">Output format</label>
+                    <select class="form-control" id="output" name="output">
+                        <option value="markdown" selected>Markdown</option>
+                        <option value="html">HTML</option>
+                        <option value="htmlcode">HTML cut-and-paste</option>
+                    </select>
+                </div>
+                <div class="my-3">
+                    <div class="form-check form-switch">
+                        <label class="form-check-label" for="metric">Use Metric Units</label>
+                        <input class="form-check-input" type="checkbox" name="metric" id="metric">
+                    </div>
+                    <div class="form-check form-switch">
+                        <label class="form-check-label" for="coordinates">Display Lat/Long</label>
+                        <input class="form-check-input" type="checkbox" id="coordinates" name="coordinates">
+                    </div>
+                    <div class="form-check form-switch">
+                        <label class="form-check-label" for="ignore_times">Ignore GPX times</label>
+                        <input class="form-check-input" type="checkbox" id="ignore_times" name="ignore_times">
+                    </div>
+                </div>
+            </div>
+            <button class="btn btn-primary mb-3" type="submit">Submit</button>
+        </form>
+    </div>
 </div>
+{% endblock %}
+{% block extrabody %}
 <script>
-  document.addEventListener("DOMContentLoaded", function() {
-    const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
-    document.getElementById("tz").defaultValue = timezone;
-  });
+    document.addEventListener("DOMContentLoaded", function () {
+        const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+        document.getElementById("tz").defaultValue = timezone;
+    });
 
-  function validateForm() {
-    var fileInput = document.getElementById('gpxFile').value;
-    var urlInput = document.getElementById('gpxUrl').value;
+    function validateForm() {
+        var fileInput = document.getElementById('gpxFile').value;
+        var urlInput = document.getElementById('gpxUrl').value;
 
-    if (fileInput === '' && urlInput === '') {
-      alert('Please provide either a GPX file or a URL.');
-      return false;
-    }
+        if (fileInput === '' && urlInput === '') {
+            alert('Please provide either a GPX file or a URL.');
+            return false;
+        }
 
-    if (fileInput !== '' && urlInput !== '') {
-      alert('Please provide only one: either a GPX file or a URL.');
-      return false;
+        if (fileInput !== '' && urlInput !== '') {
+            alert('Please provide only one: either a GPX file or a URL.');
+            return false;
+        }
+        return true;
     }
-    return true;
-  }
 </script>
-{% endblock %}
+{% endblock %}
\ No newline at end of file
