diff --git a/app.php b/app.php
index 965c664..1e8a667 100644
--- a/app.php
+++ b/app.php
@@ -92,9 +92,14 @@ header("Link: <static/js/bootstrap.min.js>; rel=preload; as=script", false);
             echo <<<END
             <div class="row justify-content-center" id="msg-alert-box">
                 <div class="col-11 col-sm-6 col-md-5 col-lg-4 col-xl-4">
-                    <div class="alert alert-dismissible alert-$alerttype">
-                        <button type="button" class="close">&times;</button>
-                        <i class="fas fa-$alerticon"></i> $alertmsg
+                    <div class="alert alert-dismissible alert-$alerttype mt-2 p-0 border-0 shadow">
+                        <div class="p-2 pl-3">
+                            <button type="button" class="close">&times;</button>
+                            <i class="fas fa-$alerticon"></i> $alertmsg
+                        </div>
+                        <div class="progress">
+                            <div class="progress-bar bg-$alerttype w-0" id="msg-alert-timeout-bar"></div>
+                        </div>
                     </div>
                 </div>
             </div>
diff --git a/index.php b/index.php
index 18e052d..0cf82e3 100644
--- a/index.php
+++ b/index.php
@@ -8,7 +8,7 @@ require_once __DIR__ . "/required.php";
 require_once __DIR__ . "/lib/login.php";
 
 // if we're logged in, we don't need to be here.
-if ($_SESSION['loggedin'] && !isset($_GET['permissionerror'])) {
+if (!empty($_SESSION['loggedin']) && $_SESSION['loggedin'] === true && !isset($_GET['permissionerror'])) {
     header('Location: app.php');
 }
 
@@ -20,7 +20,7 @@ if (isset($_GET['permissionerror'])) {
 $userpass_ok = false;
 $multiauth = false;
 if (checkLoginServer()) {
-    if ($VARS['progress'] == "1") {
+    if (!empty($VARS['progress']) && $VARS['progress'] == "1") {
         if (!CAPTCHA_ENABLED || (CAPTCHA_ENABLED && verifyCaptcheck($VARS['captcheck_session_code'], $VARS['captcheck_selected_answer'], CAPTCHA_SERVER . "/api.php"))) {
             $errmsg = "";
             if (authenticate_user($VARS['username'], $VARS['password'], $errmsg)) {
@@ -61,7 +61,7 @@ if (checkLoginServer()) {
         } else {
             $alert = lang("captcha error", false);
         }
-    } else if ($VARS['progress'] == "2") {
+    } else if (!empty($VARS['progress']) && $VARS['progress'] == "2") {
         if ($_SESSION['passok'] !== true) {
             // stop logins using only username and authcode
             sendError("Password integrity check failed!");
@@ -117,7 +117,7 @@ header("Link: <static/js/bootstrap.min.js>; rel=preload; as=script", false);
                     <h5 class="card-title"><?php lang("sign in"); ?></h5>
                     <form action="" method="POST">
                         <?php
-                        if (!is_empty($alert)) {
+                        if (!empty($alert)) {
                             ?>
                             <div class="alert alert-danger">
                                 <i class="fa fa-fw fa-exclamation-triangle"></i> <?php echo $alert; ?>
diff --git a/static/js/app.js b/static/js/app.js
index 602807d..3db2f40 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -7,6 +7,58 @@ $(document).ready(function () {
     $(".alert .close").click(function (e) {
         $(this).parent().fadeOut("slow");
     });
+
+    if ($("#msg-alert-box").length) {
+        $("#msg-alert-box .progress").css("height", "3px");
+        $("#msg-alert-box .progress").css("border-radius", "0px 0px .25rem .25rem");
+        $("#msg-alert-box .progress-bar").css("transition", "width 0.25s linear");
+        var msginteractiontick = 0;
+        var fifty = 10;
+        var gone = 20;
+
+        var msgticker = setInterval(function () {
+            if ($('#msg-alert-box .alert:hover').length) {
+                msginteractiontick = 0;
+            } else {
+                msginteractiontick++;
+            }
+            if (msginteractiontick > 0) {
+                function setBarWidth(offset) {
+                    $("#msg-alert-timeout-bar").css("width", (msginteractiontick + offset) / gone * 100 + "%");
+                }
+                setBarWidth(-1 + .25);
+                setTimeout(function () {
+                    setBarWidth(-1 + .5);
+                }, 250);
+                setTimeout(function () {
+                    setBarWidth(-1 + .75);
+                }, 500);
+                setTimeout(function () {
+                    setBarWidth(0);
+                }, 750);
+            } else {
+                $("#msg-alert-timeout-bar").css("width", "0%");
+            }
+
+            if (msginteractiontick < fifty) {
+                $("#msg-alert-box .alert").css("opacity", "1");
+            }
+            if (msginteractiontick == fifty) {
+                $("#msg-alert-box .alert").fadeTo(1000, 0.5);
+            }
+            if (msginteractiontick >= gone) {
+                $("#msg-alert-box .alert").fadeOut("slow", function () {
+                });
+                window.clearInterval(msgticker);
+            }
+        }, 1000 * 1);
+
+        $("#msg-alert-box").on("mouseenter", function () {
+            $("#msg-alert-box .alert").css("opacity", "1");
+            msginteractiontick = 0;
+            console.log("👈😎👈 zoop");
+        });
+    }
 });