From 0157bef955b763dec896b83656d5c07f02be5a22 Mon Sep 17 00:00:00 2001
From: Mohit Rana <mohitr8998@gmail.com>
Date: Sun, 10 Nov 2024 01:42:35 -0500
Subject: [PATCH] added styling to the forms and footer section of website

---
 styles.css | 404 ++++++++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 403 insertions(+), 1 deletion(-)

diff --git a/styles.css b/styles.css
index 5b0b6ff..24d0f89 100644
--- a/styles.css
+++ b/styles.css
@@ -535,4 +535,406 @@ blockquote {
 
 .link:hover {
   text-decoration: underline;
-}
\ No newline at end of file
+}
+
+
+
+/* Footer Section */
+#footer {
+  background-color: #333;
+  color: white;
+  padding: 20px;
+  text-align: center;
+}
+#footer h2,h3{
+  color: white;
+}
+#footer p{
+  color: rgb(222, 222, 222);
+}
+#footer form input {
+  padding: 10px;
+  margin: 10px 0;
+  border-radius: 5px;
+  border: 1px solid #ccc;
+}
+#newsletter-form{
+  display: flex;
+  align-items: center;
+  gap: 2rem;
+}
+#footer form button {
+  background-color: #2196f3;
+  color: white;
+  border: none;
+  border-radius: 5px;
+  height: 2.5rem;
+  padding: 0.2rem 1rem;
+}
+
+#footer form button:hover {
+  background-color: #1976d2;
+}
+
+.social-media a {
+  margin: 0 10px;
+  color: white;
+  text-decoration: none;
+}
+
+.social-media a:hover {
+  text-decoration: underline;
+}
+
+/* FAQ Section */
+.faqisection {
+  padding: 50px 0;
+  background-color: #f9f9f9;
+  color: #333;
+}
+
+.faqs {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 20px;
+}
+
+.faqs h2 {
+  font-size: 32px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+.faq-item {
+  margin-bottom: 20px;
+}
+
+.faq-item h3 {
+  font-size: 24px;
+  margin-bottom: 10px;
+}
+
+.faq-item p {
+  font-size: 16px;
+  line-height: 1.6;
+}
+
+/* Feedback Section */
+.feedback {
+  padding: 50px 20px;
+  background-color: #eef4f7;
+  color: #333;
+  text-align: center;
+}
+
+.feedback h2 {
+  font-size: 32px;
+  margin-bottom: 30px;
+}
+
+#feedback-form {
+  max-width: 600px;
+  margin: 0 auto;
+  text-align: left;
+}
+
+#feedback-form input, #feedback-form textarea {
+  width: 100%;
+  padding: 10px;
+  margin-bottom: 20px;
+  border: 1px solid #ddd;
+  border-radius: 5px;
+}
+
+#feedback-form button {
+  background-color: #4caf50;
+  color: white;
+  padding: 12px 20px;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+}
+
+#feedback-form button:hover {
+  background-color: #388e3c;
+}
+
+/* About Section */
+.about-container {
+  display: flex;
+  flex-direction: column;
+  padding: 50px 20px;
+  justify-content: space-between;
+  align-items: center;
+  background-color: #f1f1f1;
+}
+
+.about-text {
+  flex: 1;
+  padding: 20px;
+}
+
+.about-text p {
+  font-size: 16px;
+  line-height: 1.6;
+  margin-bottom: 20px;
+}
+
+.about-image img {
+  max-width: 100%;
+  border-radius: 8px;
+  height: auto;
+}
+
+.about-heading h2 {
+  font-size: 32px;
+  text-align: center;
+  margin-bottom: 30px;
+}
+
+/* Mission Section */
+.mission-container {
+  padding: 50px 20px;
+  background-color: #f9f9f9;
+  text-align: center;
+}
+
+.mission-container h3 {
+  font-size: 32px;
+  margin-bottom: 30px;
+}
+
+.mission-box {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+}
+
+.mission-item {
+  text-align: center;
+  flex: 1;
+  min-width: 200px;
+  margin: 10px;
+  padding: 20px;
+  background-color: #fff;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  border-radius: 8px;
+}
+
+.mission-item img {
+  max-width: 50px;
+  margin-bottom: 15px;
+}
+
+.mission-item h4 {
+  font-size: 24px;
+  margin-bottom: 10px;
+}
+
+.mission-item p {
+  font-size: 16px;
+}
+
+/* Values Section */
+.values-container {
+  padding: 50px 20px;
+  background-color: #eef4f7;
+}
+
+.values-container h3 {
+  font-size: 32px;
+  text-align: center;
+  margin-bottom: 30px;
+}
+
+.values-cards {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+}
+
+.value-card {
+  background-color: #fff;
+  padding: 20px;
+  flex: 1;
+  min-width: 250px;
+  margin: 10px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  border-radius: 8px;
+}
+
+.value-card h4 {
+  font-size: 24px;
+  margin-bottom: 10px;
+}
+
+.value-card p {
+  font-size: 16px;
+}
+
+/* Sign Up Section */
+.container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 50px 20px;
+  background-color: #f9f9f9;
+}
+
+.form_area {
+  width: 100%;
+  max-width: 500px;
+  background-color: #fff;
+  padding: 30px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  border-radius: 8px;
+}
+
+.title {
+  font-size: 32px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+.form_group {
+  margin-bottom: 20px;
+}
+
+.sub_title {
+  font-size: 16px;
+  margin-bottom: 5px;
+}
+
+.form_style {
+  width: 100%;
+  padding: 12px;
+  border: 1px solid #ddd;
+  border-radius: 5px;
+  font-size: 16px;
+}
+
+.btn {
+  background-color: #4caf50;
+  color: white;
+  padding: 12px 20px;
+  border: none;
+  border-radius: 5px;
+  width: 100%;
+  cursor: pointer;
+  margin-bottom: 1rem;
+}
+
+.btn:hover {
+  background-color: #388e3c;
+}
+
+.link {
+  color: #4caf50;
+  text-decoration: none;
+}
+
+.link:hover {
+  text-decoration: underline;
+}
+/* Footer Section */
+#footer {
+  background-color: #2a2a2a;
+  color: white;
+  padding: 40px 20px;
+  text-align: center;
+}
+
+/* Heading */
+#footer h2 {
+  font-size: 2rem;
+  margin-bottom: 20px;
+}
+
+/* Newsletter Form */
+#newsletter-form {
+  display: flex;
+  justify-content: center;
+  margin-bottom: 30px;
+}
+
+#newsletter-form input {
+  padding: 10px;
+  font-size: 1rem;
+  border: none;
+  border-radius: 5px;
+  margin-right: 10px;
+  width: 300px;
+}
+
+#newsletter-form button {
+  padding: 10px 20px;
+  font-size: 1rem;
+  background-color: #f9a825;
+  border: none;
+  border-radius: 5px;
+  color: white;
+  cursor: pointer;
+}
+
+#newsletter-form button:hover {
+  background-color: #f57f17;
+}
+
+/* Social Media Links */
+.social-media {
+  margin: 20px 0;
+}
+
+.social-media a {
+  color: white;
+  font-size: 1.2rem;
+  margin: 0 15px;
+  text-decoration: none;
+}
+
+.social-media a:hover {
+  color: #f9a825;
+}
+
+/* Community Message Section */
+.community-message {
+  margin: 30px 0;
+}
+
+.community-message h3 {
+  font-size: 1.5rem;
+  margin-bottom: 10px;
+}
+
+.community-message p {
+  font-size: 1rem;
+  line-height: 1.5;
+}
+
+/* Footer Links */
+.footer-links {
+  margin: 20px 0;
+}
+
+.footer-links a {
+  color: white;
+  font-size: 1.2rem;
+  margin: 0 15px;
+  text-decoration: none;
+}
+
+.footer-links a:hover {
+  color: #f9a825;
+}
+
+/* Footer Bottom */
+.footer-bottom {
+  margin-top: 40px;
+  font-size: 1rem;
+  color: #b0b0b0;
+}
+
+.footer-bottom p {
+  margin: 0;
+}
+