diff --git a/main.css b/main.css
index 89c9ba1..0969d4e 100644
--- a/main.css
+++ b/main.css
@@ -21,7 +21,7 @@
 :root {
     --zelda-border-light: #5f87dd;
     --zelda-border-dark: #1c2a49;
-    --zelda-bg: #2f487c;
+    --zelda-bg: #2f487c;
     --zelda-bg-hilite: #3f67cd;
     --zelda-file-button-width: calc(145px*var(--scaling-factor));
     --zelda-button-width: calc(200px*var(--scaling-factor));
@@ -70,18 +70,19 @@ a:hover
 }
 
 .zelda-button {
+    font-family: Chiaro;
     color: white;
     cursor: pointer;
     font-size: var(--zelda-button-font-size);
     padding-top: calc(10px*var(--scaling-factor));
     width: var(--zelda-button-width);
-    text-align: center;
-    background: linear-gradient(
-        90deg,
-        var(--zelda-bg),
-        var(--zelda-bg-hilite) 30%,
-        var(--zelda-bg) 80%,
-        var(--zelda-bg-hilite)
+    text-align: center;
+    background: linear-gradient(
+        90deg,
+        var(--zelda-bg),
+        var(--zelda-bg-hilite) 30%,
+        var(--zelda-bg) 80%,
+        var(--zelda-bg-hilite)
     );
 }
 
@@ -89,15 +90,15 @@ a:hover
 .zelda-file-box {
     position: relative;
     font-family: Chiaro;
-    color: white;
-    background: linear-gradient(
-        120deg,
-        var(--zelda-bg) 10%,
-        var(--zelda-bg-hilite) 30%,
-        var(--zelda-bg-hilite) 40%,
-        var(--zelda-bg) 60%,
-        var(--zelda-bg-hilite) 80%,
-        var(--zelda-bg)
+    color: white;
+    background: linear-gradient(
+        120deg,
+        var(--zelda-bg) 10%,
+        var(--zelda-bg-hilite) 30%,
+        var(--zelda-bg-hilite) 40%,
+        var(--zelda-bg) 60%,
+        var(--zelda-bg-hilite) 80%,
+        var(--zelda-bg)
     );
 }
 
@@ -146,9 +147,16 @@ a:hover
 .zelda-file-box-main {
     line-height: calc(5px*var(--scaling-factor));
     width: 100%;
+    /* border-top-style: none; */
+    /* border-top-left-radius: 0; */
+    font-size: var(--zelda-content-font-size);
+}
+
+/* First of its type under the filename box */
+:not(.zelda-file-box-main) + .zelda-file-box-main {
     border-top-style: none;
     border-top-left-radius: 0;
-    font-size: var(--zelda-content-font-size);
+    border-top-right-radius: 0;
 }
 
 .progress-value {
diff --git a/test.css b/test.css
new file mode 100644
index 0000000..5395dfc
--- /dev/null
+++ b/test.css
@@ -0,0 +1,74 @@
+div#progressChart {
+    min-width: 310px;
+    height: 400px;
+    max-width: 800px;
+    margin: 0 auto;
+}
+
+
+
+/* Zelda Accordion styles */
+.content-container {
+    /* border-radius: 8px; */
+    /* overflow: hidden; */ /* Masks with the glowing if enabled */
+    /* box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5); */
+  }
+
+details {
+    z-index: 1;
+    margin: 0;
+    padding: 0;
+    /* transition: all 1s ease; */
+}
+
+details > summary {
+    list-style: none;
+}
+
+details > summary::-webkit-details-marker {
+    display: none;
+  }
+
+/* Size glow to File button size (a less hacky way probably exists) */
+
+summary .glow {
+  z-index: 2;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: var(--zelda-file-button-width);
+  height: calc(47px*var(--scaling-factor));
+  border-radius: calc(4px*var(--scaling-factor));
+  display: none;
+}
+
+summary:hover .glow {
+  display: block;
+  transition:all 0.2s ease;
+  background: rgba(200, 200, 200, 0.5);
+  box-shadow: 0 0 20px rgba(200, 200, 200, .7);
+}
+
+details:not([open]) hr {
+    opacity: 0;
+}
+
+summary .zelda-file-box-filename {
+    /* border-bottom-width: 0px; */
+    border-bottom-style: solid;
+}
+
+details[open] .zelda-file-box-filename {
+    border-bottom-style: hidden;
+}
+
+details[open] summary ~ * {
+  animation: fade-in .5s ease-in-out;
+}
+
+@keyframes fade-in {
+  0%    {opacity: 0 }
+  100%  {opacity: 1 }
+}
+
+
diff --git a/test.html b/test.html
new file mode 100644
index 0000000..35233cb
--- /dev/null
+++ b/test.html
@@ -0,0 +1,202 @@
+<!doctype html>
+<html lang=en>
+
+<head>
+    <meta charset="utf-8">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
+        integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
+    <link rel="stylesheet" href="main.css" />
+    <link rel="stylesheet" href="test.css" />
+    <script type="text/javascript" src="https://code.highcharts.com/highcharts.js"></script>
+    <script type="text/javascript" src="https://code.highcharts.com/modules/data.js"></script>
+    <script type="text/javascript" src="https://code.highcharts.com/modules/exporting.js"></script>
+    <script type="text/javascript" src="progress.js"></script>
+    <script type="text/javascript" src="bg.js"></script>
+    <script type="text/javascript" src="audio.js"></script>
+    <title>Z64</title>
+</head>
+
+<body>
+
+    <div>
+        <div class="container text-center">
+            <img src="img/logo.png" style="width: 200px; height: 200px" />
+        </div>
+
+        <br><br><br>
+        <h1 class="text-center">ZRET Decompilation Status</h1>
+        <br><br><br>
+
+        <div class="content-container">
+
+            <div class="zelda-file-box" id="oot-progress-container">
+
+                <details open>
+                    <summary>
+                        <div class="glow"></div>
+                        <div width=100%>
+
+                            <div class="zelda-box zelda-button zelda-file-box-slot">File 1</div>
+
+                            <div class="zelda-box zelda-file-box-filename">Oot Mq Debug
+                                <hr style="border-color: #1c2a49;margin-top: 14px;border-width: 3px;">
+                            </div>
+                        </div>
+                    </summary>
+
+
+                    <div>
+                        <div class="zelda-box zelda-file-box-hack_left"></div>
+                        <div class="zelda-box zelda-file-box-hack_right"></div>
+                    </div>
+
+                    <div class="zelda-file-box-main zelda-box zelda-file-box-main">
+                        <div>
+                            <p style="float: left">Last Change:</p>
+                            <p id="ootLastChange" class="progress-value" style="color: cyan;">Error</p>
+                        </div>
+                        <hr>
+                        <div>
+                            <p style="float: left">Total:</p>
+                            <p id="ootTotalPercent" class="progress-value">Error</p>
+                        </div>
+
+                        <div>
+                            <p style="float: left">Boot:</p>
+                            <p id="ootBootPercent" class="progress-value">Error</p>
+                        </div>
+
+                        <div>
+                            <p style="float: left">Code:</p>
+                            <p id="ootCodePercent" class="progress-value">Error</p>
+                        </div>
+
+                        <div>
+                            <p style="float: left">Overlays:</p>
+                            <p id="ootOverlayPercent" class="progress-value">Error</p>
+                        </div>
+                    </div>
+
+                    <div class="zelda-file-box-main zelda-box zelda-file-box-main">
+                        <div id="ootProgressChart" class="chart"></div>
+                        <script type="text/javascript" src="chart_oot.js"></script>
+                    </div>
+
+                    <div class="zelda-box zelda-button" id="ootToggleMatching">Matching: <span
+                            style="color:red">No</span>
+                    </div>
+                </details>
+
+
+            </div>
+
+            <br>
+
+            <div class="zelda-file-box" id="mmProgressContainer">
+
+                <details>
+                    <summary>
+                        <div class="glow"></div>
+                        <div width=100%>
+                            <div class="zelda-box zelda-button zelda-file-box-slot">File 2</div>
+                            <div class="zelda-box zelda-file-box-filename">Majora's Mask
+                                <hr style="border-color: #1c2a49;margin-top: 14px;border-width: 3px;">
+                            </div>
+                        </div>
+                    </summary>
+
+                    <div>
+                        <div class="zelda-box zelda-file-box-hack_left"></div>
+                        <div class="zelda-box zelda-file-box-hack_right"></div>
+                    </div>
+                    <div class="zelda-file-box-main zelda-box">
+                        <div>
+                            <p style="float: left">Last Change:</p>
+                            <p id="mmLastChange" class="progress-value" style="color: cyan;">Error</p>
+                        </div>
+                        <hr>
+                        <div>
+                            <p style="float: left">Total:</p>
+                            <p id="mmTotalPercent" class="progress-value">Error
+                            <p>
+                        </div>
+
+                        <div>
+                            <p style="float: left">Boot:</p>
+                            <p id="mmBootPercent" class="progress-value">Error</p>
+                        </div>
+
+                        <div>
+                            <p style="float: left">Code:</p>
+                            <p id="mmCodePercent" class="progress-value">Error</p>
+                        </div>
+
+                        <div>
+                            <p style="float: left">Overlays:</p>
+                            <p id="mmOverlayPercent" class="progress-value">Error</p>
+                        </div>
+                    </div>
+                    <div class="zelda-file-box-main zelda-box">
+                        <div id="mmProgressChart"></div>
+                        <script type="text/javascript" src="chart_mm.js"></script>
+                    </div>
+
+                    <div class="zelda-box zelda-button" id="mmToggleMatching">Matching: <span
+                            style="color:red">No</span>
+                    </div>
+                </details>
+            </div>
+
+            <br>
+
+            <div class="zelda-file-box" id="tmcProgressContainer">
+                <details>
+                    <summary>
+                        <div class="glow"></div>
+                        <div width=100%>
+                            <div class="zelda-box zelda-button zelda-file-box-slot">File 3</div>
+                            <div class="zelda-box zelda-file-box-filename">The Minish Cap
+                                <hr style="border-color: #1c2a49;margin-top: 14px;border-width: 3px;">
+                            </div>
+                        </div>
+                    </summary>
+                    <div>
+                        <div class="zelda-box zelda-file-box-hack_left"></div>
+                        <div class="zelda-box zelda-file-box-hack_right"></div>
+                    </div>
+                    <div class="zelda-file-box-main zelda-box">
+                        <div>
+                            <p style="float: left">Last Change:</p>
+                            <p id="tmcLastChange" class="progress-value" style="color: cyan;">Error</p>
+                        </div>
+                        <hr>
+                        <div>
+                            <p style="float: left">Code Decompilation:</p>
+                            <p id="tmcCodePercent" class="progress-value">Error
+                            <p>
+                        </div>
+
+                        <div>
+                            <p style="float: left">Data Reconstruction:</p>
+                            <p id="tmcDataPercent" class="progress-value">Error</p>
+                        </div>
+                    </div>
+                    <div class="zelda-file-box-main zelda-box">
+                        <div id="tmcProgressChart"></div>
+                        <script type="text/javascript" src="chart_tmc.js"></script>
+                    </div>
+
+                    <div class="zelda-box zelda-button" id="tmcToggleMatching">Matching: <span
+                            style="color:red">No</span>
+                    </div>
+                </details>
+            </div>
+
+
+            <br>
+            <div class="zelda-box zelda-button"><a href="index.html">Main Page</a></div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
