update

Took 3 hours 30 minutes

public/stylesheets/style.css

@@ -64,6 +64,7 @@ h1 {
 #title {
     text-align: center;
     float: left;
+    margin-top: 0.6%;
     width: calc(100% / 3);
 }
 
@@ -73,7 +74,8 @@ h1 {
     float: left;
     width: calc(100% / 3);
     text-align: left;
-    padding-top: 1.2%;
+    padding-top: 1.6%;
+    padding-left: 10px;
 }
 
 
@@ -81,8 +83,9 @@ h1 {
     float: left;
     width: calc(100% / 3);
     text-align: right;
-    font-size: 0.5em;
+    font-size: 0.8em;
     padding-top: 1.2%;
+    padding-right: 10px;
 }
 
 
@@ -145,11 +148,40 @@ h1 {
     scrollbar-width: none; /* Firefox */
     scroll-behavior: smooth;
     color: white;
+    /*animation: showPane 0.3s forwards;*/
+
+}
+
+@keyframes showPane {
+    0% {
+        display: none;
+        opacity: 0;
+    }
+    1% {
+        display: block;
+    }
+    100% {
+        opacity: 1;
+    }
 }
 
 .hiddenPane {
+    transition: 0.4s;
     display: none !important;
-    transition: 0.2s;
+    /*animation: hidePane 0.4s forwards;*/
+}
+@keyframes hidePane {
+    0% {
+        opacity: 1;
+        display: block !important;
+    }
+    99% {
+        display: block !important;
+    }
+    100% {
+        display: none !important;
+        opacity: 0;
+    }
 }
 
 #settings {