added all sections & footer on home page

styles.css

@@ -10,7 +10,7 @@ body, html {
     /* overflow-x: hidden; */
 }
 
-/* NAVIGATION BAR --------------- */
+/* NAVIGATION BAR --------------------- */
 
 nav {
     color: black;
@@ -78,7 +78,7 @@ ul li img {
     width: 40px;
 }
 
-/* CATEGORY STRIP  -------------- */
+/* CATEGORY STRIP -------------------- */
 
 .categories {
     display: flex;
@@ -113,12 +113,12 @@ ul li img {
     transform: translateY(-3px);
 }
 
-/* ALL SECTIONS  ---------------- */
+/* ALL SECTIONS ---------------------- */
 
 .sections {
     height: 100vh;
 }
-/* HERO SECTION  ---------------- */
+/* HERO SECTION ---------------------- */
 
 #section1 {
     height: 84vh;
@@ -243,7 +243,7 @@ ul li img {
     width: 50px;
 }
 
-/* CATEGORIES SECTION---------------- */
+/* CATEGORIES SECTION ---------------------- */
 
 #section2 {
     /* background-color: #F0C1E1; */
@@ -272,7 +272,7 @@ ul li img {
     padding-left: 8%;
 }
 
-/* ALL CATEGBOXES------------------- */
+/* ALL CATEGBOXES --------------------------- */
 
 .categBox {
     display: flex;
@@ -485,7 +485,7 @@ ul li img {
     transform: translateY(-3px);
 }
 
-/* RACHU SECTION ------------------- */
+/* RACHU SECTION --------------------------- */
 #section3 {
     /* background-color: #FDDBBB; */
     overflow-y: hidden;
@@ -671,91 +671,117 @@ ul li img {
 /* #section3 {background-color: #FDDBBB;}.rachuHeader {background-color: aqua;}.rachuBox {background-color: yellowgreen;}.rachuBoxes {background-color: yellow;}.rachuData1 {background-color: yellowgreen;}.productName {background-color: aqua;}.productCartButton {background-color: #CDC1FF;}.rachuData2 {background-color: yellow;}.rachuData3 {background-color: wheat;}.rachuFooter {background-color: violet;} */
 
 #section4 {
-    background-color: #FFF9BF;
+    /* background-color: #FFF9BF; */
 }
 #section5 {
-    background-color: #BFECFF;
+    /* background-color: #BFECFF; */
 }
 #section6 {
-    background-color: #CDC1FF;
+    /* background-color: #CDC1FF; */
 }
-/* Footer Section */
-#section7 {
+
+/* Footer Section -------------------------- */
+#section8 {
     height: 45vh;
-    background-color: #D9D9D9;
+    width: 100vw;
+    background-color: #000000;
     border-top: #000000 2px solid;
-    padding: 20px;
     display: flex;
     flex-direction: column;
     align-items: center;
+    justify-content: center;
+    margin-top: 2%;
 }
-
 .footer-container {
     display: flex;
-    justify-content: space-between;
+    justify-content: flex-start;
+    /* align-items: center; */
     width: 100%;
-    max-width: 1200px;
-    padding: 0 20px;
-}
+    max-width: 90%;
+    /* padding: 1000px 1000px auto 1000px; */
 
+}
 .footer-section {
     flex: 1;
-    text-align: left;
-    margin: 0 10px;
-}
+    margin: 0px;
+    display: flex;
+    flex-direction: column;
+    display: flex;
+    justify-content: flex-start;
+    color: white;
 
+}
 .footer-section h3 {
-    font-size: 18px;
+    font-size: 35px;
     font-weight: bold;
     margin-bottom: 10px;
+    text-align: left;
+}
+#footerSiteName {
+    margin-right: 10%;
+    text-align: center;
+    align-items: center;
+}
+#footerSiteName h3 {
+    font-size: 52px;
+}
+#footerSiteName p{
+    margin-top: 4%;
 }
-
 .social-icons {
     display: flex;
-    gap: 10px;
+    gap: 20px;
     margin: 10px 0;
 }
-
 .social-icons a img {
-    width: 24px;
-    height: 24px;
+    width: 55px;
+    height: 55px;
 }
-
 .footer-section p,
 .footer-section ul {
-    color: #333;
-    font-size: 14px;
+    color: rgb(255, 255, 255);
+    font-size: 23px;
+    font-weight: 400;
     margin: 5px 0;
+    display: flex;
+    flex-direction: column;
 }
-
 .footer-section ul {
     list-style: none;
     padding: 0;
     display: flex;
     flex-direction: column; /* Stack items in a column */
     gap: 5px;
-}
+    align-items: flex-start;
 
+}
 .footer-section ul li {
     margin: 0;
+    justify-content: flex-start;
+    text-align: left;
 }
-
 .footer-section ul li a {
-    color: #333;
+    color: rgb(255, 255, 255);
     text-decoration: none;
 }
-
 .footer-section ul li a:hover {
     text-decoration: underline;
 }
-
+#aboutUsSection {
+    margin-top: 0px;
+    padding-top: 0px;
+    display: flex;
+    justify-content: flex-start;
+    /* transform: translateY(1000px); */
+}
 .footer-bottom {
-    border-top: 1px solid #333;
-    margin-top: 20px;
-    padding-top: 10px;
+    border-top: 1px solid rgb(255, 255, 255);
+    margin-top: 2%;
+    padding-top: 2%;
     text-align: center;
-    width: 100%;
-    font-size: 12px;
+    width: 90%;
+    font-size: 20px;
+    color: white;
 }