diff --git a/Tesses.YouTubeDownloader.Server/res/theme.css b/Tesses.YouTubeDownloader.Server/res/theme.css
index d35475f..5ea8865 100644
--- a/Tesses.YouTubeDownloader.Server/res/theme.css
+++ b/Tesses.YouTubeDownloader.Server/res/theme.css
@@ -75,4 +75,12 @@ body.dark {
 --surface-container:#251e1d;
 --surface-container-high:#2f2827;
 --surface-container-highest:#3b3332;
+}
+
+.loading-indicator
+{
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
 }
\ No newline at end of file
diff --git a/Tesses.YouTubeDownloader.Server/src/components/shell.tcross b/Tesses.YouTubeDownloader.Server/src/components/shell.tcross
index 288adde..cda4c37 100644
--- a/Tesses.YouTubeDownloader.Server/src/components/shell.tcross
+++ b/Tesses.YouTubeDownloader.Server/src/components/shell.tcross
@@ -62,12 +62,13 @@ func Components.Shell(title, html, page, $mypage)
 </nav>
   
 <main class="responsive">
-  <div class="htmx-indicator shape loading-indicator extra" id="loading-indicator">
-  <img class="responsive" src="./tytd.svg">
-  </div>
   <raw(html)>
+
+  
 </main>
-    
+<div class="htmx-indicator shape loading-indicator extra" id="loading-indicator">
+  <img class="responsive" src="./tytd.svg">
+</div>  
     
 </body>
 </html>;