Resubmission

index.html

@@ -12,37 +12,39 @@
         <div class="container">
             <footer class="bg-[#659f8f] dark:bg-[#313131]">
                 <div class="container px-6 py-12 mx-auto">
-                    <div class="grid">
+                    <div class="grid grid-cols-1 gap-6 sm:grid-cols-2 sm:gap-y-10 lg:grid-cols-4">
                         <div class="sm:col-span-2">
-                            <h1 class="max-w-lg" >Subscribe.</h1>
-                            <div class="flex">
-                                <input id="email" type="text">
-                                <button class="w-full px-6 py-2.5 bg-white">
+                            <h1 class="max-w-lg text-xl font-semibold tracking-tight text-[#313131] xl:text-2xl dark:text-white" >Subscribe to our newsletter for updates.</h1>
+                            <div class="flex-col mx-auto mt-6 space-y-3 md:space-y-0 md:flex-row">
+                                <input id="email" placeholder="Email Address" class="px-4 py-2 text-[#313131] bg-white border rounded-md dark:bg-[#313131] dark:text-white dark:border-[#313131] focus:border-[#d86943] dark:focus:border-[#d86943] focus:outline-none focus:ring focus:ring-opacity-40 focus:ring-[#d86943]">
+                                <button class="p-2 bg-orange-500 text-white max-w-screen-lg px-4 py-2 font-semibold border rounded-md hover:opacity-50 focus:border-[#85736c] dark:focus:border-[#d86943] focus:outline-none focus:ring focus:ring-opacity-40 focus:ring-[#d86943]">
                                     Subscribe
                                 </button>
                             </div>
                         </div>
                         <div>
-                            <p class="text-[#313131]">Quick Link</p>
-                            <div class="flex">
-                                <a href="#">Home</a>
-                                <a href="#">Who We Are</a>
-                                <a href="#">Our Philosophy</a>
-                            </div>
+                            <p class="text-[#313131] font-bold">Quick Link</p>
+                            <ul>
+                                <li><a href="#" class="hover:underline">Home</a></li>
+                                <li><a href="#" class="hover:underline">Who We Are</a></li>
+                                <li><a href="#" class="hover:underline">Our Philosophy</a></li>
+
+                            </ul>
                         </div>
                         <div>
-                            <p class="text-[#313131]">Technologies</p>
-                            <div class="">
-                                <a href="#">HTML</a>
-                                <a href="#">CSS</a>
-                                <a href="#">JavaScript</a>
-                            </div>
+                            <p class="text-[#313131] font-bold">Technologies</p>
+                            <ul>
+                              <li><a href="#" class="hover:underline">HTML</a></li>
+                              <li><a href="#" class="hover:underline">CSS</a></li>
+                              <li><a href="#" class="hover:underline">JavaScript</a></li>
+                            </ul>
                         </div>
                     </div>
-
+
+
                     <hr class="my-6 border-[#d86943]">
 
-                    <div class="flex">
+                    <div class="flex items-center justify-between">
                         <a href="#">
                             <img class="w-auto h-7" src="https://codespace-assets.global.ssl.fastly.net/wp/assets/website/codespace-primary-logo-light.svg" alt="">
                         </a>