generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathget-started.html
176 lines (167 loc) · 8.74 KB
/
get-started.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
content="Looking to start your yoga journey? Sunrise Yoga has all the information here to get you started!">
<title>Sunrise Yoga</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous" />
<link href="assets/css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<header>
<!-- Bootstrap amended navbar-->
<nav class="navbar navbar-expand-md navbar-light">
<div class="container-fluid">
<a class="navbar-brand" href="index.html">
<div id="logo">
<h1 id="title">Sunrise Yoga</h1>
<p id="tagline">Mind.Body.Soul</p>
</div>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbardropdown"
aria-controls="navbardropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbardropdown">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link active" href="get-started.html">Get Started</a>
</li>
<li class="nav-item">
<a class="nav-link" href="classes.html">Classes</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- /Bootstrap amended navbar-->
</header>
<!-- Title Container-->
<div class="container-fluid">
<div id="title-banner">
<h2>Get started</h2>
<p>Be in the moment</p>
</div>
</div>
<!-- /Title Container-->
<!-- Main Container-->
<div class="container">
<section id="get-started">
<div class="row justify-content-center">
<div class="d-none d-lg-block col-lg-12">
<img src="assets/images/get-started.jpg" alt="girl in a seated yoga position" class="img-fluid"
id="get-started-image">
</div>
</div>
<div class="row">
<div class="col-12">
<h2>New to yoga?</h2>
<p class="content">If you are reading this page and beginning to wonder why you are even considering
yoga, then look no further.
<br>
For those who don't know, or are unsure, yoga is an ancient form of exericse that explores
physical, mental and spiritual disciplines. Yoga focuses on strength, flexibility and breathing
through series of postures and breathwork.
<br>
Starting anything new is scary and daunting.
Here at Sunrise Yoga,
we believe in how yoga feels and how it makes you feel, not just how it looks. Don't be scared
of struggling or getting the form wrong, that is what our experienced teachers are here for.
<br>
Once you're on the mat you will wonder why it has taken you so long to get there!</p>
</div>
</div>
</section>
<!-- Code amended from W3 School-->
<section id="beginner-options">
<div class="row justify-content-center">
<div class=" col-12">
<div class="column">
<div class="image-content">
<img src="assets/images/beginner-classes.jpg" alt="Yoga class" style="width:100%">
<div class="portfolio-content">
<h3>Beginner Classes</h3>
<br>
<p>We have a variety of classes aimed at beginners, whether you are just starting out or
needing a refresher. These classes are designed to help you build your foundation
and allow you practice at a slower pace.
</div>
</div>
</div>
<div class="column">
<div class="image-content">
<img src="assets/images/private-lessons.jpg"
alt="Three people practicing yoga in a private lesson" style="width:100%">
<div class="portfolio-content">
<h3>Private Lessons</h3>
<br>
<p>Sometimes we need a little extra attention and support. That is where our private
lessons are ideal. They are suitable for any level but can be great to support you
in mastering the basics with a tailored approach. If you would like to arrange a
private lesson please feel free to contact us.</p>
</div>
</div>
</div>
<div class="column" id="community">
<div class="image-content">
<img src="assets/images/community.jpg"
alt="A group of people raising their hands infront of a sunrise" style="width:100%">
<div class="portfolio-content">
<h3>Get involved in our community</h3>
<br>
<p>Being part of a community has been part of Sunrise Yoga's founding principles and we
want our
friends
of the studio to be part of one too. From coffee mornings to helping out at local
fundraisers to yoga retreats, we get involved in a variety of ways. To stay
up-to-date, <a class="btn-sm btn-dark" href="index.html#sign-up" role="button"> Sign
up</a> to our newsletter!
<br>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<!-- End of W3 Code -->
<!-- /Main Container-->
<!-- Footer-->
<footer>
<div class="row justify-content-center">
<div class="col-12">
<ul class="social-links">
<li> <a href="https://www.facebook.com" aria-label="Go to Facebook" target="_blank"
rel="noopener"><i class="fab fa-facebook-square"></i></a> </li>
<li> <a href="https://www.instagram.com" aria-label="Go to Instgram" target="_blank"
rel="noopener"><i class="fab fa-instagram"></i></a></li>
<li> <a href="https://www.youtube.com" aria-label="Go to YouTube" target="_blank" rel="noopener"><i
class="fab fa-youtube"></i></a>
</li>
</ul>
<p>
For educational purposes only.
</p>
</div>
</div>
</footer>
<!-- /Footer-->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous">
</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous">
</script>
</body>
</html>