Update style.css

style.css

@@ -1,13 +1,11 @@
-/* Body style */
 body {
     font-family: Arial, sans-serif;
     margin: 0;
     padding: 0;
     background-color: #f4f4f4;
-    overflow-x: hidden; /* Prevent horizontal scroll */
+    overflow-x: hidden;
 }
 
-/* Navbar style */
 .navbar {
     position: fixed;
     top: 0;
@@ -25,7 +23,6 @@ body {
     height: 40px;
 }
 
-/* Headline Section */
 .headline {
     text-align: center;
     background-color: #004d00;
@@ -43,7 +40,6 @@ body {
     font-size: 18px;
 }
 
-/* Main content section */
 .content {
     background-color: white;
     padding: 40px 20px;
@@ -66,12 +62,9 @@ body {
     background-color: #f8f8f8;
 }
 
-/* Currency Input Boxes */
-.currency-box, .currency-select {
+.currency-box, .currency-group {
     width: 100%;
     margin: 15px 0;
-    display: flex;
-    flex-direction: column;
 }
 
 .currency-box label, .currency-group label {
@@ -90,7 +83,6 @@ body {
     box-sizing: border-box;
 }
 
-/* Swap Button */
 #swap-btn {
     background-color: #006400;
     color: white;
@@ -111,7 +103,6 @@ body {
     background-color: #004d00;
 }
 
-/* Convert Button */
 #convert-btn {
     background-color: #006400;
     color: white;
@@ -128,22 +119,17 @@ body {
     background-color: #004d00;
 }
 
-/* Result display */
 #result {
     font-size: 18px;
     margin-top: 20px;
 }
 
-/* How to Use Section */
 .how-to-use {
     background-color: #004d00;
     color: white;
     padding: 30px 20px;
     margin-top: 20px;
     text-align: center;
-    display: flex;
-    justify-content: center;
-    flex-direction: column;
 }
 
 .how-to-use h2 {
@@ -151,19 +137,15 @@ body {
     margin-bottom: 20px;
 }
 
-/* Steps */
 .steps {
     display: flex;
     justify-content: center;
-    margin-top: 20px;
-    flex-wrap: wrap;
     gap: 20px;
 }
 
 .step {
     background-color: #e0e0e0;
     padding: 20px;
-    margin: 10px;
     width: 300px;
     border-radius: 8px;
     text-align: center;
@@ -173,7 +155,6 @@ body {
     font-weight: bold;
 }
 
-/* Footer */
 .footer {
     background-color: #666666;
     color: white;
@@ -185,28 +166,4 @@ body {
 
 .footer-content p {
     margin: 5px 0;
-}
-
-/* Media Queries for responsiveness */
-@media screen and (max-width: 768px) {
-    .currency-select {
-        flex-direction: column;
-    }
-
-    .currency-group {
-        width: 100%;
-        max-width: 200px;
-    }
-
-    .steps {
-        flex-direction: column;
-    }
-}
-
-@media screen and (max-width: 480px) {
-    .currency-box input,
-    .currency-select select,
-    .currency-select button {
-        width: 100%;
-    }
 }