-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
188 lines (155 loc) · 6.51 KB
/
index.html
File metadata and controls
188 lines (155 loc) · 6.51 KB
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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Yoga Off East</title>
<link href="https://fonts.googleapis.com/css?family=Nunito+Sans:300,400,700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Playfair+Display:400,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<div class="logo">
<span class="yoga">yoga</span>
<span class="off">off</span>
<span class="east">east</span>
</div>
<nav>
<ul>
<li><a href="origins.html">Origins</a></li>
<li><a href="yoga3d.html">3D Yogic Guide</a></li>
<li><a href="bot.html">Yogi - the BOT</a></li>
<li><a href="#">Schedule</a></li>
<li><a href="#">Membership</a></li>
<li><a href="#">Pricing</a></li>
<li><a href="#">Teacher training</a></li>
</ul>
</nav>
</header>
<main>
<section class="hero">
<img src="image.png" alt="Yoga Class" class="hero-img">
<div class="cta">
<button id="joinBtn">JOIN US</button>
</div>
</section>
</main>
<section class="welcome-section">
<div class="welcome-left">
<p>
Yoga off East is a giant exhale, from the moment you walk in the door.
<span class="highlight">We are your sacred break from the busy,</span>
a moment to ground during your day.
</p>
</div>
<div class="welcome-right">
<h2>Welcome Home.</h2>
<p>
We are a neighborhood yoga studio in Durham, NC offering weekly yoga classes, teacher training, workshops, retreats, and more. We connect and elevate our community through yoga and can’t wait to welcome you to your mat. We believe in the strength of connection; connection with your physical self and connection to the greater world around you. We understand the cyclical nature of our lives and our practices. We are passionate about creating a space where every body is family.
</p>
<p>Welcome home.</p>
</div>
</section>
<section class="yoga-off-east-section">
<div class="yoga-off-east-content">
<h2 class="yoga-off-east-title">New to Yoga off East?</h2>
<p class="yoga-off-east-desc">
Try us out with our new client special - 3 classes for $30 in 3 weeks. We can’t wait to meet you!
</p>
<a href="#" class="yoga-off-east-btn">Learn More</a>
</div>
<div class="yoga-off-east-image-wrapper">
<!-- Add your backgroundless (transparent PNG) image below -->
<img src="bg.png" alt="Yoga Studio Interior" class="yoga-off-east-image" />
</div>
</section>
<section class="cards-section">
<div class="card">
<img src="pic1.png" alt="Gift Card" />
<h3>Purchase a Gift Card</h3>
<a href="#" class="card-link">gift cards →</a>
</div>
<div class="card">
<img src="pic2.png" alt="Retreats Workshops" />
<h3>Retreats, Workshops, Series</h3>
<a href="#" class="card-link">our events →</a>
</div>
<div class="card">
<img src="pic3.png" alt="Teacher Training" />
<h3>200-hr Yoga Teacher Training</h3>
<a href="#" class="card-link">learn more →</a>
</div>
</section>
<section class="team-section">
<div class="team-left">
<h2>Meet the Yogis</h2>
<p>
Our experienced teachers welcome students of all skill levels and design flow classes that are relevant, fresh and challenging.
</p>
<button class="team-btn">OUR TEAM</button>
</div>
<div class="team-right">
<img src="yogis.png" alt="Yoga Team" />
</div>
</section>
<section class="social-section">
<h2>Keep in touch</h2>
<p class="social-desc">
Follow along with your favorite Durham yoga studio + renew your spirit even on the days we don't get to see your beautiful face. We love to share mindfulness tips, upcoming classes and workshops, and behind-the-scenes peeks into our studio and teachers.
<a href="#" class="social-link">Follow us →</a>
</p>
<div class="social-grid">
<img src="z1.jpeg" alt="Yoga 1" />
<img src="z2.jpeg" alt="Yoga 2" />
<img src="z3.jpeg" alt="Yoga 3" />
<img src="z4.jpeg" alt="Yoga 4" />
<img src="z5.jpeg" alt="Yoga 5" />
<img src="z6.jpeg" alt="Yoga 6" />
<img src="z7.jpeg" alt="Yoga 7" />
<img src="z8.jpeg" alt="Yoga 8" />
<img src="z9.jpeg" alt="Yoga 9" />
<img src="z10.jpeg" alt="Yoga 10" />
<img src="z11.jpeg" alt="Yoga 11" />
<img src="z12.jpeg" alt="Yoga 12" />
</div>
</section>
<footer class="footer-section">
<div class="footer-newsletter">
<p>Stay in the loop with news and updates</p>
<form class="newsletter-form">
<input type="email" placeholder="Email Address" required />
<button type="submit">SIGN UP</button>
</form>
</div>
<div class="footer-links">
<a href="#">studio etiquette</a>
<a href="#">studio</a>
<a href="#">classes</a>
<a href="#">pricing</a>
<a href="#">gift cards</a>
<a href="#">faq</a>
<a href="#">contact</a>
</div>
<div class="footer-social">
<a href="#" aria-label="Facebook"><img src="https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/facebook.svg" alt="Facebook" /></a>
<a href="#" aria-label="Twitter"><img src="https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/twitter.svg" alt="Twitter" /></a>
<a href="#" aria-label="Email"><img src="https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/maildotru.svg" alt="Email" /></a>
<a href="#" aria-label="Instagram"><img src="https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/instagram.svg" alt="Instagram" /></a>
</div>
<div class="footer-awards">
<img src="logo1.png" alt="Best of Durham 2023" />
<img src="logo2.png" alt="Best of Triangle 2023" />
</div>
<div class="footer-bottom">
<p>© 2025 Yoga Off East • All Rights Reserved</p>
<p>
<span class="footer-email">e</span> hello@yogaoffeast.com
<span class="footer-phone">p</span> 919.275.2765
<span class="footer-address">a</span> 324 Blackwell Street (Bay 5, 2nd floor), Durham NC 27701
</p>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>