generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
118 lines (115 loc) · 4.36 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="mind and body club, for yoga, pilates, meditation and mindfulness">
<meta name="keywords" content="mind and body, yoga, pilates, meditation, mindfulness">
<link rel="stylesheet" href="assets/css/style.css">
<title>Mind&Body</title>
</head>
<body>
<!-- Header and icon navigation -->
<header>
<a href="index.html">
<h1 id="logo">Mind & Body</h1>
</a>
<nav id="menu">
<ul>
<li><a href="signup.html">Sign Up</a></li>
<li><a href="classes.html">Classes</a></li>
<li><a href="index.html" class="active">Home</a></li>
</ul>
</nav>
</header>
<!-- Hero image -->
<div id="hero-outer">
<div id="hero-image"></div>
<div id="hero-header">
<h2>Mind and body offers a range of classes to learn new techniques for all ages!</h2>
</div>
</div>
<!-- Club ethos section -->
<section id="club-ethos">
<div id="ethos-heading">
<h2>Why join our classes?</h2>
</div>
<div id="left-about">
<div class="yoga-about">
<h3>Yoga <i class="fa-solid fa-heart"></i></h3>
<hr>
<p>What is yoga, and why is it so popular? Yoga is a series of stretches and poses that you do with breathing techniques.
It offers the powerful benefits of exercise that work on the body and the mind. And since yoga is gentle, almost anyone can do it, regardless of your age or fitness level.</p>
<img src="assets/images/Group_of_women_doing_yoga.jpeg" alt="group of women doing a yoga class">
</div>
</div>
<div id="right-about">
<div class="pilates-about">
<h3>Pilates <i class="fa-solid fa-dumbbell"></i></h3>
<hr>
<p>The wonderful thing about Pilates is that it is suitable for just about everyone, regardless of age and fitness level.
It is beneficial for dealing with specific health conditions, injuries and postural problems and is also very effective in toning your muscles to give you a leaner, stronger figure.</p>
<img src="assets/images/Group_doing_pilates.jpeg" alt="group of individuals doing a pilates class">
</div>
</div>
</section>
<!-- About us -->
<section id="about-us">
<div id="about-header">
<h2>About Us</h2>
<h3>Learn methods of mind & body self improvement techniques!</h3>
</div>
<div id="about-list">
<h3>WE OFFER:</h3>
<ul class="offer-list">
<li>A range of weekly classes for any age range</li>
<li>Confident and experienced trainers</li>
<li>Classes for all fitness levels</li>
<li>Mind & body techniques</li>
<li>Competitve prices</li>
</ul>
</div>
<div id="about-table">
<h3>Opening Hours:</h3>
<table>
<tr>
<th>Days:</th>
<th>Times:</th>
</tr>
<tr>
<td>Mon-Fri</td>
<td>7am - 8pm</td>
</tr>
<tr>
<td>Saturdays</td>
<td>9am - 5pm</td>
</tr>
<tr>
<td>Sundays</td>
<td>Closed</td>
</tr>
</table>
</div>
</section>
<!-- Social network links -->
<footer>
<h2>CONTACT US</h2>
<hr>
<h3>Got a question? Get in touch through our media sites!</h3>
<ul class="social-networks">
<li >
<a href="http://facebook.com" target="facebook" rel="noopener" aria-label="visit our facebook page (opens in a new tab)"><i class="fa-brands fa-square-facebook"></i></a>
</li>
<li >
<a href="http://twitter.com" target="twitter" rel="noopener" aria-label="visit our twitter page (opens in a new tab)"><i class="fa-brands fa-square-twitter"></i></a>
</li>
<li >
<a href="http://instagram.com" target="instagram" rel="noopener" aria-label="visit our instagram page (opens in a new tab)"><i class="fa-brands fa-square-instagram"></i></a>
</li>
</ul>
</footer>
<!-- font awesome script -->
<script src="https://kit.fontawesome.com/62b6c595da.js" crossorigin="anonymous"></script>
</body>
</html>