resposnivity for phones

Vansh · Vansh · commit ab92dbe736ad · 2024-06-18T00:16:17.000+05:30
diff --git a/index.html b/index.html
@@ -10,20 +10,22 @@
 <body>
 
     <!-- === INTERFACE === -->
-    <div id="interface">
-        <h1>Cosmic Blast</h1>
-        <p>Welcome to the Cosmic Blast Game! Save the Earth from incoming asteroids by clicking on them.</p>
-        <p>Instructions:</p>
-        <ul>
-            <li>Click on the asteroids to destroy them and increase your score.</li>
-            <li>Missed asteroids will damage Earth, causing it to slowly fade as its health decreases</li>
-            <li>If health reaches zero, the game is over.</li>
-        </ul>
-        <button id="start-btn" class="start-btn">Start Game</button>
-        <!-- <button class="start-btn"><a href="/">HOME</a></button> -->
-        <div class="footer">
-            <p>&copy; <a href="https://github.com/vansh-codes/">vansh-codes</a> 2024
-            </p>
+    <div class="col-md-12">
+        <div id="interface">
+            <h1>Cosmic Blast</h1>
+            <p>Welcome to the Cosmic Blast Game! Save the Earth from incoming asteroids by clicking on them.</p>
+            <p>Instructions:</p>
+            <ul>
+                <li>Click on the asteroids to destroy them and increase your score.</li>
+                <li>Missed asteroids will damage Earth, causing it to slowly fade as its health decreases</li>
+                <li>If health reaches zero, the game is over.</li>
+            </ul>
+            <button id="start-btn" class="start-btn">Start Game</button>
+            <!-- <button class="start-btn"><a href="/">HOME</a></button> -->
+            <div class="footer">
+                <p>&copy; <a href="https://github.com/vansh-codes/">vansh-codes</a> 2024
+                </p>
+            </div>
         </div>
     </div>
 
diff --git a/style.css b/style.css
@@ -11,7 +11,10 @@ body{
     flex-direction: column;
     align-items: center;
     justify-content: center;
+    text-align: center;
     height: 100vh;
+    color: white;
+    margin: 0 5rem;
 }
 
 #interface h1 {
@@ -81,6 +84,7 @@ body{
  }
 
 #game-container {
+    color: white;
     display: none;
     position: relative;
     width: 100vw;
@@ -112,6 +116,7 @@ body{
 
 #score {
     position: absolute;
+    color: white;
     top: 10px;
     left: 10px;
     font-size: 1.4rem;
@@ -142,6 +147,7 @@ body{
 
 #end-screen {
     display: none;
+    color: white;
     position: fixed;
     top: 50%;
     transform: translate(-50%, -50%);
@@ -150,6 +156,7 @@ body{
     height: 100%;
     background-image: url("assets/background.jpg");
     z-index: 10; /* Ensure it's above other elements */
+    margin: 0 5rem;
 }
 
 .popup {
