diff --git a/public/index.html b/public/index.html
index be495ee1b..cf1733a77 100644
--- a/public/index.html
+++ b/public/index.html
@@ -976,7 +976,7 @@
           <div id="wordsTitle">input history</div>
           <div id="timerNumber">60</div>
           <div id="miniTimerAndLiveWpm">
-            <div class="time">1:00</div>
+            <div class="time hidden">1:00</div>
             <div class="wpm">60</div>
           </div>
           <div id="wordsWrapper">
diff --git a/public/js/script.js b/public/js/script.js
index 14448be20..365500f23 100644
--- a/public/js/script.js
+++ b/public/js/script.js
@@ -859,15 +859,17 @@ function showTimer() {
       250
     );
   } else if (config.timerStyle === "mini") {
-    $("#miniTimerAndLiveWpm .time")
-      .stop(true, true)
-      .removeClass("hidden")
-      .animate(
-        {
-          opacity: op,
-        },
-        250
-      );
+    if (op > 0) {
+      $("#miniTimerAndLiveWpm .time")
+        .stop(true, true)
+        .removeClass("hidden")
+        .animate(
+          {
+            opacity: op,
+          },
+          250
+        );
+    }
   }
 }
 
@@ -878,12 +880,17 @@ function hideTimer() {
     },
     125
   );
-  $("#miniTimerAndLiveWpm .time").stop(true, true).animate(
-    {
-      opacity: 0,
-    },
-    125
-  );
+  $("#miniTimerAndLiveWpm .time")
+    .stop(true, true)
+    .animate(
+      {
+        opacity: 0,
+      },
+      125,
+      () => {
+        $("#miniTimerAndLiveWpm .time").addClass("hidden");
+      }
+    );
   $("#timerNumber").stop(true, true).animate(
     {
       opacity: 0,
@@ -2333,6 +2340,8 @@ function restartTest(withSameWordset = false) {
       } else {
         hideKeymap();
       }
+      document.querySelector("#miniTimerAndLiveWpm .wpm").innerHTML = "0";
+      document.querySelector("#liveWpm").innerHTML = "0";
 
       if (activeFunBox === "layoutfluid") {
         changeLayout("qwerty");