diff --git a/static/download_results.js b/static/download_results.js
new file mode 100644
index 0000000..ac0901a
--- /dev/null
+++ b/static/download_results.js
@@ -0,0 +1,59 @@
+function deleteFiles(filePaths) {
+    fetch('/delete_files', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/x-www-form-urlencoded',
+        },
+        body: new URLSearchParams({
+            'file_paths': filePaths
+        })
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.success) {
+            alert('Files deleted successfully');
+            location.reload();
+        } else {
+            alert('Error deleting files: ' + JSON.stringify(data.errors));
+        }
+    });
+}
+
+function deleteSelectedFiles() {
+    const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
+        .map(checkbox => checkbox.value);
+    if (selectedFiles.length > 0) {
+        deleteFiles(selectedFiles);
+    } else {
+        alert('No files selected');
+    }
+}
+
+function downloadSelectedFiles() {
+    const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
+        .map(checkbox => checkbox.value);
+    if (selectedFiles.length > 0) {
+        selectedFiles.forEach(file => {
+            const link = document.createElement('a');
+            link.href = file;
+            link.download = file.split('/').pop();
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+        });
+    } else {
+        alert('No files selected');
+    }
+}
+
+// Function to check or uncheck all checkboxes in a table by checking or unchecking the "CheckAll" checkbox
+function checkAllCheckboxes(tableId, checkAllCheckboxId) {
+    const table = document.getElementById(tableId);
+    const checkboxes = table.querySelectorAll('input[type="checkbox"][name="fileCheckbox"]');
+    const checkAllCheckbox = document.getElementById(checkAllCheckboxId);
+    const isChecked = checkAllCheckbox.checked;
+
+    checkboxes.forEach(checkbox => {
+        checkbox.checked = isChecked;
+    });
+}
\ No newline at end of file
diff --git a/templates/download_results.html b/templates/download_results.html
index 92b0795..9ac43db 100644
--- a/templates/download_results.html
+++ b/templates/download_results.html
@@ -1,88 +1,5 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Your page title</title>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    {{ bootstrap.load_css() }}
-    <link rel="stylesheet" href="{{url_for('.static', filename='style.css')}}">
-    <script>
-        function deleteFiles(filePaths) {
-            fetch('/delete_files', {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/x-www-form-urlencoded',
-                },
-                body: new URLSearchParams({
-                    'file_paths': filePaths
-                })
-            })
-            .then(response => response.json())
-            .then(data => {
-                if (data.success) {
-                    alert('Files deleted successfully');
-                    location.reload();
-                } else {
-                    alert('Error deleting files: ' + JSON.stringify(data.errors));
-                }
-            });
-        }
-
-        function deleteSelectedFiles() {
-            const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
-                .map(checkbox => checkbox.value);
-            if (selectedFiles.length > 0) {
-                deleteFiles(selectedFiles);
-            } else {
-                alert('No files selected');
-            }
-        }
-
-        function downloadSelectedFiles() {
-            const selectedFiles = Array.from(document.querySelectorAll('input[name="fileCheckbox"]:checked'))
-                .map(checkbox => checkbox.value);
-            if (selectedFiles.length > 0) {
-                selectedFiles.forEach(file => {
-                    const link = document.createElement('a');
-                    link.href = file;
-                    link.download = file.split('/').pop();
-                    document.body.appendChild(link);
-                    link.click();
-                    document.body.removeChild(link);
-                });
-            } else {
-                alert('No files selected');
-            }
-        }
-        
-        // Function to check or uncheck all checkboxes in a table by checking or unchecking the "CheckAll" checkbox
-        function checkAllCheckboxes(tableId, checkAllCheckboxId) {
-            const table = document.getElementById(tableId);
-            const checkboxes = table.querySelectorAll('input[type="checkbox"][name="fileCheckbox"]');
-            const checkAllCheckbox = document.getElementById(checkAllCheckboxId);
-            const isChecked = checkAllCheckbox.checked;
-        
-            checkboxes.forEach(checkbox => {
-                checkbox.checked = isChecked;
-            });
-        }
-    </script>
-</head>
-<body>
-    <header>
-        <h1>Torn User Activity Scraper</h1>
-        <nav class="navbar navbar-expand-lg navbar-light bg-light">
-            <div class="navbar-nav mr-auto">
-                {% from 'bootstrap4/nav.html' import render_nav_item %}
-                {{ render_nav_item('index', 'Home') }}
-                {{ render_nav_item('results', 'Results') }}
-                {{ render_nav_item('download_results', 'Download Results') }}
-            </div>
-        </nav>
-    </header>
 
+{% include "header.html" %}
     <main>
         <section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center">
             <div class="container-md my-5 mx-2 shadow-lg p-4 ">
@@ -91,16 +8,18 @@
                         <div class="col">
                             <h2>Data Files</h2>
                         </div>
-                        <div class="col btn-group" >
-                            <button class="btn-danger" onclick="deleteSelectedFiles()">Delete Selected Files</button>
-                            <button class="btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button>
+                        <div class="col">
+                            <div class="btn-group btn-group-sm">
+                                <button class="btn btn-warning" onclick="deleteSelectedFiles()">Delete Selected Files</button>
+                                <button class="btn btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button>
+                            </div>
                         </div>
                     </div>
                 </div>
                 <table id="dataFilesTable" class="table table-striped table-bordered table-hover">
                     <thead>
                         <tr>
-                            <th><input type="checkbox" id="checkAllData" onclick="checkAllCheckboxes('dataFilesTable', 'checkAllData')">Select</th>
+                            <th><input type="checkbox" id="checkAllData" onclick="checkAllCheckboxes('dataFilesTable', 'checkAllData')"> Select</th>
                             <th onclick="sortTable(1, 'dataFilesTable')">File Name</th>
                             <th onclick="sortTable(2, 'dataFilesTable')">Last Modified</th>
                             <th onclick="sortTable(3, 'dataFilesTable')">Created</th>
@@ -117,7 +36,7 @@
                             <td>{{ file.created | datetimeformat }}</td>
                             <td>{{ file.size }}</td>
                             <td>
-                                <button onclick="deleteFiles(['{{ file.name }}'])">Delete</button>
+                                <button class="btn btn-warning" onclick="deleteFiles(['{{ file.name }}'])">Delete</button>
                             </td>
                         </tr>
                         {% endfor %}
@@ -128,11 +47,12 @@
                         <div class="col">
                             <h2>Log Files</h2>
                         </div>
-                        <div class="col btn-group" >
-                            <button class="btn-danger" onclick="deleteSelectedFiles()">Delete Selected Files</button>
-                            <button class="btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button>
+                        <div class="col">
+                            <div class="btn-group btn-group-sm">
+                                <button class="btn btn-warning" onclick="deleteSelectedFiles()">Delete Selected Files</button>
+                                <button class="btn btn-success" onclick="downloadSelectedFiles()">Download Selected Files</button>
+                            </div>
                         </div>
-                    </div>
                 </div>                <table id="logFilesTable" class="table table-striped table-bordered table-hover">
                     <thead>
                         <tr>
@@ -153,7 +73,7 @@
                                 <td>{{ file.created | datetimeformat }}</td>
                                 <td>{{ file.size }}</td>
                                 <td>
-                                    <button onclick="deleteFiles(['{{ file.name }}'])">Delete</button>
+                                    <button class="btn btn-warning" onclick="deleteFiles(['{{ file.name }}'])">Delete</button>
                                 </td>
                             </tr>
                         {% endfor %}
@@ -162,5 +82,8 @@
             </div>
         </section>
     </main>
-</body>
-</html>
\ No newline at end of file
+    {% block scripts %}
+         {{ bootstrap.load_js() }}
+        <script src="{{url_for('.static', filename='download_results.js')}}"></script>
+    {% endblock %}
+    {% include "footer.html" %}
\ No newline at end of file
diff --git a/templates/footer.html b/templates/footer.html
new file mode 100644
index 0000000..691287b
--- /dev/null
+++ b/templates/footer.html
@@ -0,0 +1,2 @@
+</body>
+</html>
\ No newline at end of file
diff --git a/templates/header.html b/templates/header.html
new file mode 100644
index 0000000..3b9b0a1
--- /dev/null
+++ b/templates/header.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Your page title</title>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    {{ bootstrap.load_css() }}
+    <link rel="stylesheet" href="{{url_for('.static', filename='style.css')}}">
+</head>
+<body>
+    <header>
+        <h1>Torn User Activity Scraper</h1>
+        <nav class="navbar navbar-expand-lg navbar-light bg-light">
+            <div class="navbar-nav mr-auto">
+                {% from 'bootstrap4/nav.html' import render_nav_item %}
+                {{ render_nav_item('index', 'Home') }}
+                {{ render_nav_item('results', 'Results') }}
+                {{ render_nav_item('download_results', 'Download Results') }}
+            </div>
+        </nav>
+    </header>
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 5db5540..dfd15c9 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,26 +1,4 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Your page title</title>
-    <!-- Required meta tags -->
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    {{ bootstrap.load_css() }}
-    <link rel="stylesheet" href="{{url_for('.static', filename='style.css')}}">
-</head>
-<body>
-    <header>
-        <h1>Torn User Activity Scraper</h1>
-        <nav class="navbar navbar-expand-lg navbar-light bg-light">
-            <div class="navbar-nav mr-auto">
-                {% from 'bootstrap4/nav.html' import render_nav_item %}
-                {{ render_nav_item('index', 'Home') }}
-                {{ render_nav_item('results', 'Results') }}
-                {{ render_nav_item('download_results', 'Download Results') }}
-            </div>
-        </nav>
-    </header>
+{% include "header.html" %}
     <main>
         <section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center">
             <div class="container-md my-5 mx-2 shadow-lg p-4 ">
@@ -67,5 +45,4 @@
         {{ bootstrap.load_js() }}
         <script src="{{url_for('.static', filename='app.js')}}"></script>
     {% endblock %}
-</body>
-</html>
\ No newline at end of file
+    {% include "footer.html" %}
\ No newline at end of file
