Make all the pages Responsive

index.css

@@ -253,7 +253,7 @@ footer {
     display: flex;
     flex-wrap: nowrap;
     flex-direction: column;
-}
+
 
     /* gap: 30px; */
     padding: 25px;
@@ -625,7 +625,7 @@ html {
 	padding: 0.5rem;
 	text-decoration: none;
 	transition: 0.2s ease-out;
-
+    z-index: 2;
 }
 
 .back-to-top span {

index.html

@@ -20,7 +20,6 @@
     }
 
 
-
     * {
       padding: 0;
       margin: 0;
@@ -113,11 +112,17 @@
     }
 
     nav {
+      display: flex;
+      flex-flow: wrap;
+      justify-content: center;
+      align-items: center;
       box-shadow: 0px 10px 8px -11px rgba(0, 0, 0, 0.1);
     }
 
     .main-nav {
+      display: none;
       justify-content: space-between;
+      flex-flow: wrap;
       padding: 13px 0 10px;
     }
 
@@ -132,6 +137,7 @@
       justify-content: flex-start;
       gap: .7rem;
       margin: 0 0 0 3rem;
+      outline-color: transparent;
     }
 
     .search-icon-container {
@@ -152,8 +158,6 @@
       font-size: 1.2rem;
     }
 
-
-
     .right-nav-container {
       justify-content: space-between;
       flex-grow: .9;
@@ -537,6 +541,27 @@
       padding: 2rem 1rem;
     }
 
+    .foot-left{
+      display: flex;
+      flex-flow: wrap;
+    }
+
+    .foot-right{
+      display: flex;
+      flex-flow: wrap;
+    }
+
+    .foot-down{
+      display: flex;
+      justify-content: center;
+    }
+
+    .payment-icons{
+      display: flex;
+      flex-flow: wrap;
+      padding-left: 50px;
+    }
+
     .title {
       font-size: 1.5rem;
       font-weight: bold;
@@ -547,6 +572,7 @@
       display: flex;
       overflow-x: auto;
       gap: 1rem;
+      flex-flow: wrap;
     }
 
     .deal-item {
@@ -1219,7 +1245,7 @@ <h5>Registered Office Address:</h5>
 
 
 
-          <li class="payment-icons" style="padding-left: 500px;">
+          <li class="payment-icons">
             <img src="./assets/images/visa.jpeg" alt="Visa">
             <img src="./assets/images/mastercard.jpeg" alt="Mastercard">
             <img src="./assets/images/rupay.png" alt="rupay">

orders.css

@@ -8,12 +8,13 @@ body{
     background-color: #f1f3f6;
 }
 #navbar-container {
-    margin-bottom: 20px; 
+    margin-bottom: 50px; 
 }
 
 .containers {
     display: flex;
     padding: 20px;
+    margin-top: 10px;
 }
 
 #filtersBox {
@@ -34,6 +35,10 @@ body{
 .orderStatus, .orderTime {
     padding: 0 16px;
     border-top: 1px solid #f8f8f8;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
 }
 
 .opt {
@@ -42,6 +47,10 @@ body{
     cursor: pointer;
 }
 
+.opt>span{
+    padding-left: 5px;
+}
+
 #info {
     font-weight: 500;
     font-size: 14px;
@@ -56,6 +65,7 @@ body{
 
 .search{
     display: flex;
+    flex-flow: wrap;
     margin-right: 10%;
     margin-bottom: 16px;
     border-radius: 4px 0 0 4px;
@@ -82,16 +92,16 @@ body{
     color: #fff;
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2);
     border: none;
+    display: flex;
     align-items: center;
 }
 
 .search-icon{
-    display: -webkit-flex;
-    display: -ms-flexbox;
     display: flex;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
+    justify-content: center;
     padding: 5px;
 }
 
@@ -102,8 +112,11 @@ body{
 .orderContainer {
     background-color: #e6eeff;
     border: 1px solid #888;
-    margin: 20px;
+    margin: 20px 20px 20px 10px;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
+    width: 100%;
+    height: auto;
+    padding-left: 20px;
 }
 
 .orderContainer:hover {
@@ -165,7 +178,7 @@ body{
 }
 
 .img {
-    width: 75px;
+    width: 100px;
     height: 75px;
     overflow: hidden;
 }
@@ -372,3 +385,6 @@ footer {
     vertical-align: middle;
 }
 
+.office>h5{
+    padding-top: 30px;
+}

profile.css

@@ -1,6 +1,6 @@
 body {
   background-color: #f4f4f4;
-  margin-top: 150px;
+  margin-top: 100px;
 }
 
 #navbar-container {
@@ -13,7 +13,7 @@ body {
 }
 
 #input_data {
-  width: 100%;
+  width: 300px;
   border: none;
   background-color: transparent;
   padding: 5px;

signin.css

@@ -8,11 +8,12 @@
     justify-content: center;
     align-items: center;
     margin-top: 10px;
-
+    flex-flow: wrap;
 }
 
 #innerbox{
     display: flex;
+    flex-flow: wrap;
     background-color: white;
     width: 60%;
     height: 500px;
@@ -23,12 +24,17 @@
     background-color: #2874F0;
     color: white;
     font-family: sans-serif;
-    width: 45%;
+    width: auto;
+    height: auto;
 }
 
 .rightinnerbox{
     font-family: sans-serif;
     width: 55%;
+    display: flex;
+    flex-flow: wrap;
+    justify-content: center;
+    align-items: center;
 }
 
 .para1{