Fix page scrolling on mobile maybe

index.html

@@ -114,6 +114,16 @@
         </div>
       </button>
     </a>
+    <a href="https://torrent.jimbosfiles.com">
+      <button class="custom-button torrent">
+        <div class="color-part"></div>
+        <div class="button-content">
+          <img class="button-image" src="./images/transmission.png" alt="Button Logo" style="width: 5em; height: auto;">
+          <span class="button-text">Torrents</span>
+          <span class="button-subtext">ISOs and Rupert</span>
+        </div>
+      </button>
+    </a>
     <a href="https://mail.jimbosfiles.com/">
       <button class="custom-button mail">
         <div class="color-part"></div>

styles.css

@@ -11,13 +11,13 @@ body {
   display: flex;
   flex-direction: column;
   align-items: center;
-  justify-content: center; /* Center the button container vertically */
+  justify-content: flex-start;
   margin: 0;
-  overflow-x: hidden;
-  height: 100vh; /* Ensure body height fits within viewport */
-  background: #20256e;
+  background: #20256E; /* Apply background color to body */
   color: white;
-  position: relative; /* Relative positioning for footer */
+  position: relative;
+  overflow-x: hidden;
+  min-height: 100%;
 }
 
 header {
@@ -88,6 +88,7 @@ header img {
 .element .color-part { background-color: #4ca68c; }
 .mastodon .color-part { background-color: #776bc9; }
 .lemmy .color-part { background-color: #183038; }
+.torrent .color-part { background-color: #bf3b51; }
 .mail .color-part { background-color: #0777B6; }
 
 .color-part {
@@ -157,12 +158,16 @@ header img {
   }
 
   body {
-    min-height: 100vh; /* Ensure body covers at least full viewport height */
-    padding-bottom: 13em; /* Add space for footer */
-    padding-top: 4em; /* Add space for footer */
+    min-height: 100vh; /* Ensure minimum height covers full viewport */
+    padding-top: 1em; /* Add space for footer */
+    justify-content: flex-start; /* Ensure content starts from the top */
+    overflow-y: auto; /* Allow vertical scrolling when content exceeds viewport */
   }
 
   .button-container {
+    flex-direction: column; /* Stack buttons vertically */
+    max-width: 100%; /* Allow the container to fit within viewport width */
     gap: 1em; /* Adjust gap for mobile */
+    padding-bottom: 5em;
   }
 }