diff --git a/app/static/scripts/function.js b/app/static/scripts/function.js
index 3c4d5cb848d88bdbfe6eddfdd1dcd68c0fa4b7d6..bfc452e8f100bbece2967ff8e7c26516ab7175db 100644
--- a/app/static/scripts/function.js
+++ b/app/static/scripts/function.js
@@ -1,19 +1,5 @@
 function displayloading() {
-            document.getElementById("notification_window").innerHTML = "" +
-                "<div class=\"joyride-tip-guide\" data-index=\"0\" style=\"visibility: visible; display: block; top: 77.5px; left: 570px;\"><span class=\"joyride-nub\" style=\"display: none;\"></span><div class=\"joyride-content-wrapper\" role=\"dialog\"><ol>\n" +
-                "        <h4>\n" +
-                "\n" +
-                "          Your account is pending creation...\n" +
-                "\n" +
-                "        </h4>\n" +
-                "                <br><p>\n" +
-                "                    This can take between 5-10 min.\n" +
-                "                </p>\n" +
-                "      </ol>\n" +
-                "                <img src=\"/static/img/loading.gif\" style=\"width: 35px; height: auto\"> Pending...\n" +
-                "            </div></div>\n" +
-                "\n" +
-                "    <div class=\"joyride-modal-bg\" style=\"display: block;\"></div>"
+	$('#myModal').modal('show');
 }
 
 function request_account() {
@@ -26,4 +12,4 @@ function request_account() {
 
 function refresh() {
     document.location.reload(true);
-}
\ No newline at end of file
+}
diff --git a/app/templates/auth/SignUp.html b/app/templates/auth/SignUp.html
index cd8a3a6e5d56dd8e2663bb479f60d687cb501a85..0582b267f34f4536ef84a8e806a066ba5776d508 100644
--- a/app/templates/auth/SignUp.html
+++ b/app/templates/auth/SignUp.html
@@ -3,6 +3,7 @@
 <head>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.min.js"></script>
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
 <script src="{{ url_for('static', filename='scripts/function.js') }}"></script>
 
 <script>
@@ -20,11 +21,8 @@
         })
 
         socket.on( 'account ready', function( msg ) {
-            let element = document.getElementById("notification_window");
-            element.parentNode.removeChild(element);
-            element.innerHTML = " ";
-            alert("Account creation successful!");
-
+          $('#myModal').modal('hide');
+          alert("Account has been created!");
         })
 
         socket.on( 'Account creation failed', function( msg ) {
@@ -104,12 +102,19 @@
     </div>
     </div>
 
-
-<div id="notification_window" >
-</div>
-
-        <div id ="testo"></div>
-</body>
+    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" data-keyboard="false">
+        <div class="modal-dialog modal-sm" role="document">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h4 class="modal-title" id="myModalLabel">Thank you for requesting</h4>
+                </div>
+                <div class="modal-body">
+                    <span>We are creating your account. It may take 5-10 minutes.</span>
+                    <img src="{{ url_for('static', filename='img/loading.gif') }}" width="40px">
+                </div>
+            </div>
+        </div>
+    </div>
 <footer>
   <div class="container-fluid">
     <div class="row">
@@ -120,6 +125,6 @@
       </div>
     </div>
   </div><!-- /.container -->
-
 </footer>
+</body>
 </html>