diff --git a/assets/css/footer.css b/assets/css/footer.css
new file mode 100644
index 0000000..eab314d
--- /dev/null
+++ b/assets/css/footer.css
@@ -0,0 +1,132 @@
+footer {
+ background: #616A6B;
+ color: white;
+ display: grid;
+ align-items: center;
+}
+
+footer div p {
+ font-size: 25pt;
+ text-align: center;
+}
+
+#social ul {
+ display: inline-block;
+}
+
+#social li {
+ display: inline;
+}
+
+#copyright {
+ text-align: center;
+ padding-top: 25px;
+ padding-bottom: 25px;
+ height: 100%;
+ background-color: #45a1ff;
+ margin: 0;
+}
+
+#social, #sitemap, #contact {
+ height: max-content;
+}
+
+#contact a, #sitemap a {
+ color: white;
+ text-decoration: none;
+}
+
+#contact a:hover, #sitemap a:hover {
+ text-decoration: underline;
+}
+
+#social ul {
+ display: flex;
+ justify-content: center;
+ padding: 0;
+}
+
+#social li {
+ padding: 20px;
+}
+
+#sitemap ul {
+ list-style: none;
+}
+
+#sitemap li, #contact li {
+ padding-bottom: 15px;
+}
+
+footer ul {
+ font-weight: 600;
+}
+
+#contact ul {
+ list-style: none;
+ text-align: center;
+ padding: 0;
+}
+
+#contact a[href^="tel:"]::before {
+ content: "☎️ ";
+}
+
+#contact a[href^="mailto:"]::before {
+ content: "✉️ ";
+}
+
+@media screen and (min-width: 800px) {
+ footer {
+ grid-template-columns: 1fr 1fr 1fr;
+ grid-template-rows: 85% 15%;
+ }
+
+ #social, #sitemap, #contact {
+ grid-row: 1;
+ }
+
+ #social {
+ grid-column: 1;
+ }
+
+ #sitemap {
+ grid-column: 2;
+ }
+
+ #contact {
+ grid-column: 3;
+ }
+
+ #copyright {
+ grid-column: 1/4;
+ grid-row: 2;
+ }
+}
+
+@media screen and (max-width: 800px) {
+ footer {
+ grid-template-columns: 100%;
+ grid-auto-rows: auto;
+ }
+
+ #social, #sitemap, #contact, #copyright {
+ grid-column: 1;
+ }
+
+ #social {
+ grid-row: 1;
+ }
+
+ #sitemap {
+ grid-row: 2;
+ }
+
+ #contact {
+ grid-row: 3;
+ }
+
+ #copyright {
+ grid-row: 4;
+ }
+}
\ No newline at end of file
diff --git a/assets/css/style.css b/assets/css/style.css
index 4e41b69..3a57e25 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1,3 +1,18 @@
+html {
+ height: 100%;
+ box-sizing: border-box;
+}
+
body {
+ height: 100%;
+ padding: 0;
margin: 0;
+ min-height: 100%;
+ display: grid;
+ grid-template-rows: auto 1fr auto;
+}
+
+* {
+ box-sizing: inherit;
+ font-family: system-ui;
}
\ No newline at end of file
diff --git a/assets/img/facebook.svg b/assets/img/facebook.svg
new file mode 100644
index 0000000..d807aa9
--- /dev/null
+++ b/assets/img/facebook.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/assets/img/instagram.svg b/assets/img/instagram.svg
new file mode 100644
index 0000000..4ce33d4
--- /dev/null
+++ b/assets/img/instagram.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/assets/img/twitter.svg b/assets/img/twitter.svg
new file mode 100644
index 0000000..d60af2b
--- /dev/null
+++ b/assets/img/twitter.svg
@@ -0,0 +1,4 @@
+
+
\ No newline at end of file
diff --git a/index.html b/index.html
index f1b5f09..08221d2 100644
--- a/index.html
+++ b/index.html
@@ -2,9 +2,11 @@
+
Elite Solar
+
@@ -19,5 +21,36 @@
FAQ
+
+
\ No newline at end of file