generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
guided-meditations.html
225 lines (202 loc) · 12.5 KB
/
guided-meditations.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
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
<!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="MINDX is a website specialising in mindfulness as a form of cognitive behavioural therapy for inquisitive and novice meditators alike" />
<meta name="keywords" content="mindfulness, cognitive behavioural therapy, guided meditation" />
<meta name="author" content="Faris Dhoot" />
<link rel="stylesheet" href="assets/css/style.css" />
<link rel="icon" href="assets/images/favicon.ico" />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
<title>MINDX</title>
</head>
<body>
<!-- Logo -->
<header id="guided-sticky-header">
<a href="index.html">
<h1 id="logo">Mind<span>x</span></h1>
</a>
<!-- Navigation Bar -->
<nav>
<ul class="navbar">
<li>
<a href="index.html" class="nav-hov">Home</a>
</li>
<li>
<a href="guided-meditations.html" class="nav-hov active">Guided Meditations</a>
</li>
<li>
<div id="signup-call">
<a href="sign-up.html">Sign Up</a>
</div>
</li>
</ul>
</nav>
</header>
<!-- Guided Meditations-->
<section class="guided-meditations">
<div class="intro-to-mbct">
<h2>Guided Meditations</h2>
<p>
Mindfulness is the practice of maintaining a moment-by-moment awareness of one’s thoughts, feelings, bodily sensations and surrounding environment without judgement. It is a state that is cultivated through meditation and other
exercises, empowering users to live in the present. Studies show that mindfulness is a powerful conduit in improving an individual’s overall wellbeing.
</p>
<p id="right-aligned-p">
Here at MINDX we use the philosophies that underpin mindfulness as a form of Cognitive Behavioural Therapy to treat various mental and physical health conditions, creating a Mindful Based Cognitive Therapy. We believe that
mindfulness is a life skill that everyone should possess, as the present moment is the only time over which we have dominion.
</p>
<p>
Below is a selection of guided exercises that consciously build upon each other, to help you in your journey. You start from the foundation of meditation, Breathing and work your way in difficulty to a full Mindful Yoga Meditation.
MINDX was specifically designed to be accessible meaning you can practice your favourite meditation wherever and whenever you please.
</p>
</div>
<div class="guided-grid">
<h3 class="heading-box">Breathing</h3>
<p class="paragraph-box">
At the core of formal meditation and something that we do instinctively, this short mindfulness exercise focuses on bringing awareness to the process of breathing. Watching our breath allows us to come into the present moment and
practice the art of being aware.
</p>
<audio src="assets/audio/breathing.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/breathing.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=I-SFdhVwrVA</a> Instead.</p>
</audio>
<div class="circle-icon-container image-box">
<span class="material-icons guided" aria-hidden="true">air</span>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Body Scan</h3>
<p class="paragraph-box">
One of the most accessible exercises, body scan meditation involves mindfully bringing attention to our bodies. We mentally scan from head to toe bringing greater awareness to bodily sensations. This helps us feel more connected
to our physical self’s, gaining greater insights into potential causes of unwanted feelings.
</p>
<audio src="assets/audio/body-scan.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/body-scan.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=QS2yDmWk0vs&t=7s</a> Instead.</p>
</audio>
<div class="square-icon-container">
<span class="material-icons guided image-box" aria-hidden="true">self_improvement</span>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Sitting</h3>
<p class="paragraph-box">
Stationary or seated meditation uses breath as the central focal point and at times incorporating awareness of sounds, bodily sensations, thoughts or feelings.
</p>
<audio src="assets/audio/sitting.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/sitting.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=2L00t5VeVjQ</a> Instead.</p>
</audio>
<div class="circle-icon-container">
<span class="material-icons guided image-box" aria-hidden="true">airline_seat_recline_normal</span>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Sleeping</h3>
<p class="paragraph-box">
Healthy sleep is contingent on quality of rest rather than quantity of hours. The minds propensity of getting occupied on thoughts is arguably strongest at bedtime. Sleep meditations are specific guided experiences that offer a
natural sleep aid, allowing us to relinquish the day.
</p>
<audio src="assets/audio/sleep.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/sleep.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=aZoZguD_UwE</a> Instead.</p>
</audio>
<div class="square-icon-container">
<span class="material-icons guided image-box" aria-hidden="true">hotel</span>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Start The Day</h3>
<p class="paragraph-box">
Morning meditations are used to set the intentions for the day, anchoring us at times of uncertainty. They give us the best opportunity to be fully aware, awake and alive before doing anything. This helps in creating a regular
daily routine cultivating a calm, mindful and productive day.
</p>
<audio src="assets/audio/start-the-day.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/start-the-day.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=ENYYb5vIMkU</a> Instead.</p>
</audio>
<div class="square-icon-container">
<span class="material-icons guided" aria-hidden="true">flare</span>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Anxiety</h3>
<p class="paragraph-box">
The problem with anxiety is that it inhibits our ability for rational thought while it, itself begins to spiral out of control. By focusing our concentration, bringing ourselves back to the present moment over and over again we
can address the root and relieve the problem whether positive or negative.
</p>
<audio src="assets/audio/anxiety.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/anxiety.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=O-6f5wQXSu8</a> Instead.</p>
</audio>
<div class="circle-icon-container">
<i class="far fa-frown guided image-box" aria-hidden="true"></i>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Depression</h3>
<p class="paragraph-box">
Depression is a state that weighs us down, narrowing our sense of hope and perspective and leading to demotivation, isolation and fear. Guided meditations for depression can offer a life line to grapple onto in such dire times. It
teaches us not to attach such weight or importance to the thoughts that fuel our issues, creating necessary space for us to shift perspective.
</p>
<audio src="assets/audio/depression.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/depression.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=xRxT9cOKiM8</a> Instead.</p>
</audio>
<div class="circle-icon-container">
<i class="far fa-sad-cry guided image-box" aria-hidden="true"></i>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Stress</h3>
<p class="paragraph-box">
Life can be stressful causing a sense of unease, triggering our flight-or-fight response. A prolonged state of such worry can cause various mental and physical strains on our bodies. This specific mindful meditation affects the
body in exactly the opposite way by triggering the body’s relaxation response.
</p>
<audio src="assets/audio/stress.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/stress.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=sG7DBA-mgFY&t=1s</a> Instead.</p>
</audio>
<div class="circle-icon-container">
<i class="far fa-tired guided image-box" aria-hidden="true"></i>
</div>
</div>
<div class="guided-grid">
<h3 class="heading-box">Mindfulness</h3>
<p class="paragraph-box">
By combining meditation and mindfulness this exercise is a form of mental training, teaching us to slow down racing thoughts, let go of negativity and calm both our minds and bodies. The emphasis of this meditation is being fully
focussed on “the now” so that we can acknowledge and accept our thoughts, feelings and sensations without judgement.
</p>
<audio src="assets/audio/mindfulness.mp4" class="exercise-box" controls loop muted>
<p>Your Browser Dose Not Support HTML5 Audio. Here Is A <a href="assets/audio/mindfulness.mp4" target="_blank" rel="author external">https://www.youtube.com/watch?v=6p_yaNFSYao</a> Instead.</p>
</audio>
<div class="circle-icon-container">
<span class="material-icons guided image-box" aria-hidden="true">psychology</span>
</div>
</div>
<div id="guided-flex-video">
<h3 class="heading-box">Mindful Yoga</h3>
<p class="paragraph-box">
Yoga is an ancient form of mind and body exercise that boots physical and mental wellbeing through a series of movements called postures that focus on flexibility, strength and breathing techniques.
</p>
<iframe width="300" height="100" src="https://www.youtube.com/embed/COp7BR_Dvps" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
</iframe>
</div>
</section>
<!-- Social Media Links & Contact Details -->
<footer>
<ul class="social-networks">
<li>
<a href="https://facebook.com" rel="noopener" target="_blank" aria-label="Explore our Facebook page (opens in a new tab)"><i class="fab fa-facebook-f"></i></a>
</li>
<li>
<a href="https://youtube.com" rel="noopener" target="_blank" aria-label="Explore our Youtube page (opens in a new tab)"><i class="fab fa-youtube"></i></a>
</li>
<li>
<a href="https://instagram.com" rel="noopener" target="_blank" aria-label="Explore our Instagram page (opens in a new tab)"><i class="fab fa-instagram"></i></a>
</li>
<li>
<a href="https://twitter.com" rel="noopener" target="_blank" aria-label="Explore our Twitter page (opens in a new tab)"><i class="fab fa-twitter"></i></a>
</li>
</ul>
<a href="mailto:[email protected]">Contact Us: [email protected]</a>
<p><i class="far fa-copyright"></i> 2021 MINDX.Ltd</p>
</footer>
<!-- Font Awesome Script -->
<script src="https://kit.fontawesome.com/79a9048c05.js" crossorigin="anonymous"></script>
</body>
</html>