Capstone-Project/contact.html at main · HridayRaj02/Capstone-Project · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Contact Us - HealthNest</title>
    <link rel="stylesheet" href="capstone.css" />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
      rel="stylesheet"
    />
  </head>
  <body>
    <nav class="navbar">
      <div class="container nav-container">
        <a href="capstone.html" class="logo">HealthNest</a>
        <ul class="nav-menu">
          <li><a href="capstone.html" class="nav-link active">Home</a></li>
          <li><a href="about-us.html" class="nav-link">About</a></li>
          <li><a href="services.html" class="nav-link">Services</a></li>
          <li><a href="contact.html" class="nav-link">Contact</a></li>
        </ul>

        <button id="theme-toggle" class="theme-btn">Dark Mode</button>
      </div>
    </nav>

    <section class="page-hero">
      <div class="container">
        <h1>Get In Touch</h1>
        <p class="subtitle">We're here to help you on your wellness journey</p>
      </div>
    </section>

    <section class="contact-section">
      <div class="container">
        <div class="contact-grid">
          <div class="contact-info">
            <h2>Contact Information</h2>
            <div class="info-item">
              <h3>Visit Us</h3>
              <p>
                123 Wellness Avenue<br />Health District, HD 12345<br />United
                States
              </p>
            </div>
            <div class="info-item">
              <h3>Call Us</h3>
              <p>Phone: (555) 123-4567<br />Toll Free: 1-800-HEALTH-1</p>
            </div>
            <div class="info-item">
              <h3>Email Us</h3>
              <p>
                General: info@healthnest.com<br />Support:
                support@healthnest.com
              </p>
            </div>
            <div class="info-item">
              <h3>Business Hours</h3>
              <p>
                Monday - Friday: 8:00 AM - 8:00 PM<br />Saturday: 9:00 AM - 6:00
                PM<br />Sunday: 10:00 AM - 4:00 PM
              </p>
            </div>
          </div>

          <div class="contact-form">
            <h2>Send Us a Message</h2>
            <form>
              <div class="form-group">
                <label for="name">Full Name</label>
                <input type="text" id="name" name="name" required />
              </div>
              <div class="form-group">
                <label for="email">Email Address</label>
                <input type="email" id="email" name="email" required />
              </div>
              <div class="form-group">
                <label for="phone">Phone Number</label>
                <input type="tel" id="phone" name="phone" />
              </div>
              <div class="form-group">
                <label for="service">Service Interest</label>
                <select id="service" name="service">
                  <option value="">Select a service</option>
                  <option value="serene">Serene Care</option>
                  <option value="vibrant">Vibrant Health</option>
                  <option value="holistic">Holistic Wellness</option>
                  <option value="basic">Basic Care Plan</option>
                  <option value="pro">Pro Health Plan</option>
                  <option value="elite">Elite Wellness Plan</option>
                  <option value="products">Wellness Products</option>
                  <option value="other">Other</option>
                </select>
              </div>
              <div class="form-group">
                <label for="message">Your Message</label>
                <textarea
                  id="message"
                  name="message"
                  rows="5"
                  required
                ></textarea>
              </div>
              <button type="submit" class="btn btn-primary">
                Send Message
              </button>
            </form>
          </div>
        </div>
      </div>
    </section>

    <section class="map-section">
      <div class="container">
        <h2>Find Us</h2>
        <div class="map-placeholder">
          <p>Map Location</p>
          <p class="map-address">
            123 Wellness Avenue, Health District, HD 12345
          </p>
        </div>
      </div>
    </section>

    <footer class="footer">
      <div class="container">
        <p>copy; 2024 HealthNest. All rights reserved.</p>
      </div>
    </footer>
    <script src="./capstone.js"></script>
  </body>
</html>