From 69f1c523ae9a2568f1b36684f877d38c1c2bf947 Mon Sep 17 00:00:00 2001
From: Spandan Mukherjee <95229740+SpandanM110@users.noreply.github.com>
Date: Mon, 23 Oct 2023 15:08:40 +0530
Subject: [PATCH] Added

---
 index.html | 35 ++++++++++++-------------
 style.css  | 77 ++++++++++++++++++++++++++++++++++--------------------
 2 files changed, 65 insertions(+), 47 deletions(-)

diff --git a/index.html b/index.html
index 619b7fd..f632583 100644
--- a/index.html
+++ b/index.html
@@ -103,6 +103,12 @@
                 </div>
 
             </nav>
+            <style>
+                .navbar-nav .nav-link {
+                  font-size: 18px; /* Adjust the size as needed */
+                }
+              </style>
+              
         </header>
 
         <div class="search-box">
@@ -112,7 +118,7 @@
                 <i class="fas fa-search"></i>
             </a>
             <button type="button" class="clear-button">
-                <i class="fas fa-times"></i>
+                <i class="fas fa-add"></i>
             </button>
         </div>
 
@@ -483,7 +489,7 @@ <h4 class="card-title"><b>Discover our essence</b></h4>
                                                 </a>
                                             </div>
                                         </div>
-                                        <div class="col-md-5 text-center logo-container">
+                                        <div class="col-md-20 text-center logo-container">
                                             <img src="images/logo.png" alt="Site Logo" class="site-logo">
                                         </div>
                                     </div>
@@ -848,22 +854,15 @@ <h4>Offers</h4>
                 <div class="footer-lower-item2">
                     <p
                         style="font-size: 1rem; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;margin-bottom: 0.3em;">
-                        Our Payment Partners</p>
-                    <div class="payment-logos">
-                        <iconify-icon id="payment-logos1" icon="logos:mastercard"
-                            style="font-size: 30px;"></iconify-icon>
-                        <iconify-icon id="payment-logos2" icon="logos:visaelectron" width="45"
-                            style="padding-top: 0.5em;"></iconify-icon>
-                        <iconify-icon id="payment-logos3" icon="simple-icons:amazonpay" width="40"></iconify-icon>
-                        <iconify-icon id="payment-logos4" icon="logos:google-pay"
-                            style="font-size: 25px; padding-top: 0.3em;"></iconify-icon>
-                        <iconify-icon id="payment-logos5" icon="logos:paypal" style="font-size: 30px;"></iconify-icon>
-                        <iconify-icon id="payment-logos6" icon="simple-icons:paytm" width="45"
-                            style="padding-top: -0.5em;"></iconify-icon>
-                        <iconify-icon id="payment-logos7" icon="simple-icons:phonepe"
-                            style="font-size: 35px;"></iconify-icon>
-
-                    </div>
+                        <div class="payment-logos">
+                            <iconify-icon id="payment-logos1" icon="logos:mastercard" style="font-size: 30px;"></iconify-icon>
+                            <iconify-icon id="payment-logos2" icon="logos:visaelectron" width="45" style="padding-top: 0.5em;"></iconify-icon>
+                            <iconify-icon id="payment-logos3" icon="simple-icons:amazonpay" width="40"></iconify-icon>
+                            <iconify-icon id="payment-logos4" icon="logos:google-pay" style="font-size: 25px; padding-top: 0.3em;"></iconify-icon>
+                            <iconify-icon id="payment-logos5" icon="logos:paypal" style="font-size: 30px;"></iconify-icon>
+                            <iconify-icon id="payment-logos6" icon="simple-icons:paytm" width="45" style="padding-top: -0.5em;"></iconify-icon>
+                            <iconify-icon id="payment-logos7" icon="simple-icons:phonepe" style="font-size: 35px;"></iconify-icon>
+                        </div>
 
                 </div>
 
diff --git a/style.css b/style.css
index 5127c69..05fd887 100644
--- a/style.css
+++ b/style.css
@@ -698,31 +698,52 @@ footer a:hover{
 .footer-lower-item2{
     width: 50%;
 }
-.payment-logos{
-    padding-left: 1.5em;
-    padding-right: 7.5em;
-    display: flex;
-    justify-content: space-evenly;
+.payment-logos {
+  padding-left: 1.5em;
+  padding-right: 7.5em;
+  display: flex;
+  justify-content: space-evenly;
 }
-@media (min-width:765px) and (max-width:1000px){
-    .footer-lower-item1{
-        width: 47%;
-    }
-    .payment-logos{
-        padding-right: 2.5em;
-    }
-    #payment-logos5 , #payment-logos6 , #payment-logos7 {
-        display: none;
-    }
+
+/* Reduce the space between icons for smaller screens */
+.payment-logos iconify-icon {
+  margin: 0 10px; /* Adjust the margin for smaller screens */
 }
-@media (max-width:765px) {
-    .footer-lower-item2{
-        display: none;
-    }
-    .footer-lower-item1{
-        width: 80%;
-    }
+
+@media (min-width: 765px) and (max-width: 1000px) {
+  .footer-lower-item1 {
+      width: 47%;
+  }
+  .payment-logos {
+      padding-right: 2.5em;
+  }
+  #payment-logos5, #payment-logos6, #payment-logos7 {
+      display: none;
+  }
 }
+
+@media (max-width: 765px) {
+  .footer-lower-item2 {
+      display: none;
+  }
+  .footer-lower-item1 {
+      width: 80%;
+  }
+
+  /* Adjust spacing for smaller screens */
+  .payment-logos {
+      padding-left: 1em;
+      padding-right: 1em;
+      justify-content: space-between;
+  }
+
+  /* Further reduce the space between icons for smaller screens */
+  .payment-logos iconify-icon {
+      margin: 0 5px; /* Adjust the margin for smaller screens */
+  }
+}
+
+
 /* footer lower styling ends */
 
 /* About Us section's styles start here */
@@ -796,15 +817,13 @@ footer a:hover{
 /* About Us section's styles ends here */
 
 .form-container {
-  background-color: #f9f9f9;
-  padding: 20px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
-  max-width: 100%;
+  max-width: 200%; /* Increase the max-width to your desired value, e.g., 75% */
   margin: 0 auto;
+  padding: 40px;
+  background-color: #ffffff;
+  border-radius: 30px;
+  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
 }
-
-
 .styled-form {
   display: flex;
   flex-direction: column;