-
Notifications
You must be signed in to change notification settings - Fork 0
/
creature.html
507 lines (435 loc) · 29.5 KB
/
creature.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
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="assets/img/fac.png" type="image/png">
<!--=============== REMIXICONS ===============-->
<link href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="hhttps://nagoshiashumari.github.io/Rpg-Awesome/stylesheets/rpg-awesome.min.css" rel="stylesheet">
<!--=============== SWIPER CSS ===============-->
<link rel="stylesheet" href="assets/css/swiper-bundle.min.css">
<!--=============== CSS ===============-->
<link rel="stylesheet" href="assets/css/styles.css">
<!--=============== googlefont ===============-->
<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=Cinzel:wght@600;700&display=swap" rel="stylesheet">
<title>Creatures | Harry Potter Verse ↯</title>
</head>
<body>
<style>
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
@import url("https://nagoshiashumari.github.io/Rpg-Awesome/stylesheets/rpg-awesome.min.css");
</style>
<header class="header" id="header">
<nav class="nav container">
<a href="index.html" class="nav__logo"><b> ↯ Back</b></a>
<div class="nav__menu" id="nav-menu">
<ul class="nav__list">
<li class="nav__item">
<div class="dropdown">
<button class="dropbtn">Features
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown-content">
<a href="sorting.html">Sorting Ceremony</a>
<a href="wand.html">Find Wand</a>
<a href="Patronus.html">Reveal Patronus</a>
<a href="boggarts.html">Face Boggarts</a>
</div>
</div>
</li>
<li class="nav__item">
<div class="dropdown">
<button class="dropbtn">Explore
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown-content">
<a href="places.html">Iconic Locations</a>
<a href="spells.html">Spells & Charms</a>
<a href="duels.html">Wizard Duels</a>
<a href="movie.html">Movies</a>
<a href="book.html">Books</a>
</div>
</div>
</li>
<li class="nav__item">
<div class="dropdown">
<button class="dropbtn">Secrets
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown-content">
<a href="curses.html">Unforgivable Curses</a>
<a href="deadly.html">Deadly Hallows</a>
<a href="Army.html">Dumbeldore's Army </a>
<a href="news.html">Daily Prophet</a>
</div>
</div>
</li>
</ul>
<br>
<div class="nav__dark">
<!-- Theme change button -->
<span class="change-theme-name">Gryffindor Theme</span>
<i class="ra ra-venomous-snake ra-1x change-theme" id="theme-button"></i>
</div>
<i class="ri-close-line nav__close" id="nav-close"></i>
</div>
<div class="nav__toggle" id="nav-toggle">
<i class="ri-function-line"></i>
</div>
</nav>
</header>
<main class="main">
<!--==================== Creatures ====================-->
<img src="assets/img/bg/creat.jpg" class="main__img" style="opacity: 40%;">
<section class="discover section " style="position: relative;">
<div class="lol">
<h2 class="section__title ">Magical Creatures</h2>
</div>
<div class="video__container container ">
<p><img src="assets/img/creatures/owl.webp" alt="Harry&#39;s Spellbook"
style="margin: 50.64px 0px; border-radius: 10px;"> <br>Magical creatures are an aspect of the
fictional wizarding world contained in the Harry Potter series and connected media, all created by
British author J. K. Rowling. Throughout the seven main books of the series, Harry and his friends
encounter many of these creatures on their adventures in Hogwarts, the Forbidden Forest, or other
locations throughout the Wizarding World. In addition, students learn to take care of creatures such
as Hippogriffs and Unicorns in the Care of Magical Creatures class at Hogwarts. Rowling has also
written Fantastic Beasts and Where to Find Them, a guide to the magical beasts found in the series,
and based on the fictional textbook of the same name written by Newt Scamander and used by students
at Hogwarts. A diverse menagerie of exotic magical beasts live inside J.K. Rowling’s
Wizarding World. Read on to learn about the many magical creatures of the Harry Potter universe.
</p>
<br><br><br><br>
<div class="body-oll container">
<strong>
<h1>OWL</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/owl.gif" width="518" height="167"
loading="lazy" style="margin: 50.64px 0px;border-radius: 10px;">
<li style="text-align:center">It seems only fitting that the first magical creature introduced
in the Harry Potter series is none other than an owl of the Wizarding World. The entire film
franchise begins with a shot of an owl perched on the Privet Drive street sign, overlooking
baby Harry Potter's arrival in the muggle village of Little Whinging. And within the first
30 minutes of Harry Potter and the Sorcerer's Stone, we've met his loyal pet Hedwig, who
dies saving him six years later.
Owls who live among the wizardkind posses the power of delivering mail to recipients without
needing an address. A witch or wizard must use one of the following enchantments to avoid
being found by owl: Repelling, Disguising or Masking spells.
<br>
</li>
</ol><br><br><br>
<strong>
<h1>House-Elf</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/elf.gif" alt="" width="518" height="167"
style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">House-elves are creatures who in the Wizarding World are typically
treated as slaves. They remain loyal to their master until they are granted a piece of
clothing, a symbol of freedom and dignity. Until then, they often wear pillow cases or
similar, haphazard scraps of cloth and must punish themselves brutally if they act against
the wishes of their master. House-elves have their own wandless use of magic, which includes
apparating (disappearing on the spot and appearing elsewhere).
One major Harry Potter fan favorite happens to be a house-elf: Dobby! Dobby is originally
property of the Malfoy family, until Harry Potter tricks Lucius Malfoy into giving Dobby a
sock. During Harry Potter and the Deathly Hallows — Part 1, Dobby dies trying to save
Harry's life. <br></li>
</ol><br><br><br>
<strong>
<h1>Goblin</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/goblin.gif" alt="" width="518"
height="167" style="margin: 50.64px 0px;border-radius: 10px;" loading="lazy">
<li style="text-align:center">Oh, Goblins. Love them or hate them — they serve a very important
role in protecting Gringotts Wizarding Bank, one they do very well (if you don't count the
break-ins performed by Professor Quirrell in Sorcerer's Stone and by Harry, Hermione and Ron
in Deathly Hallows – Part 2).
Goblins are humanoids that coexist relatively peacefully with witches and wizards, despite
their bad attitudes. They can perform magic without wands and have their own native
language, humorously called Gobbledygook.
Harry meets his first Goblin when Hagrid escorts him to withdraw wizarding currency for his
school supplies. <br></li>
</ol><br><br><br>
<strong>
<h1>Ghost</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/ghost.gif"
alt="" width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;"
loading="lazy">
<li style="text-align:center">Boo! A community of ghosts lives within Hogwarts School of
Witchcraft and Wizardry — one of the more popular ones being Nearly Headless Nick, who (to
Ron's horror) demonstrates how he earned his nickname. But besides Nick's gruesome neck,
ghosts of the Harry Potter universe are not meant to be frightening. They can fly through
solid objects, are affected by spells, and can fall in love with the living (i.e. Moaning
Myrtle's crush on Harry). Muggles, AKA nonmagical humans, are excluded from this limbo
state, as only witches and wizards can roam the earth after death. <br></li>
</ol><br><br><br>
<strong>
<h1>Three-Headed Dog</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/3headdog.gif"
alt="" width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;"
loading="lazy">
<li style="text-align:center">Who would have guessed a pet named Fluffy could be so deadly? Best
friends Harry, Hermione and Ron stumble upon a very scary version of man's best friend
inside the castle. Fluffy, Hagrid's three-headed dog, was placed within Hogwarts to guard
the sorcerer's stone, a powerful rock that can be used to extend one's lifespan and turn
metal into gold. Our favorite trio later learn the secret to getting pass this rare
creature: if you play the canine music, it will fall straight to sleep. <br></li>
</ol><br><br><br>
<strong>
<h1>Dragon</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/dragon.gif"
alt="" width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;"
loading="lazy">
<li style="text-align:center">The very first dragon we meet is a baby Norwegian Ridgeback named
Norbert, hatched inside of Hagrid's hut. Unfortunately for the animal-loving gamekeeper,
Hagrid has to say goodbye to his winged, fire-breathing pet since dragons are forbidden on
Hogwarts grounds. But Norbert is far from the last dragon we meet in the movies. Four new
species are introduced in Goblet of Fire during the Triwizard Tournament: the Chinese
Fireball, Swedish Short-Snout, Common Welsh Green and Hungarian Horntail. The movies save
the greatest dragon for last: in Deathly Hallows — Part 2, a Ukrainian Ironbelly is shown
guarding the safes of Gringotts Bank. Harry, Ron and Hermione fly on its back in an
action-packed escape scene after stealing from one of the darkest wizards alive. <br></li>
</ol><br><br><br>
<strong>
<h1>Hippogriff</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/hippogriff.webp"
alt="" width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;"
loading="lazy">
<li style="text-align:center">Hippogriffs have the body, hind legs and tail of a horse, and the
face, front legs and wings of an eagle. They are incredibly proud creatures, so one must bow
to it and await the hippogriff's returning bow before attempting to approach it. If you want
to avoid getting swiped in the face by its giant talons, it's crucial to maintain constant
eye contact, without a single blink.
A hippogriff named Buckbeak forms a special bond with Harry after he flies on its back
during Hagrid's Care of Magical Creatures class. Later, Harry helps save Buckbeak from
execution, and together they rescue Sirius Black from receiving the Dementor's Kiss. <br>
</li>
</ol><br><br><br>
<strong>
<h1>Mandrake</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/mandrake.gif" alt=""
width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">Warning: never approach a mature mandrake without ear muffs! The
mandrake is a very lively root with a deadly cry. Yes, cry. These roots are more like little
beings and they are very temperamental. Mandrakes even go through puberty, get acne and are
not fully mature until they start hopping into the pots of other mandrakes. J.K. Rowling
lets you ponder what that means on your own.
Mandrakes have special healing powers and can be used to make a Restorative Draught to
revive someone who has been Petrified, or turned to stone. <br></li>
</ol><br><br><br>
<strong>
<h1>Acromantula</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/spidy.gif" alt="" width="518" height="167"
style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">The Acromantula is Ron's worst nightmare. Ron (who has a terrible
fear of spiders) meets the king of all eight-legged creatures face to face inside the
Forbidden Forest. Joined by Harry, the two meet Aragog, Hagrid's blind acromantula who
fathers tens of thousands of spiders and secretly lives on the edge of the school grounds
(until he dies in the Half-Blood Prince).
These hairy creatures produce deadly venom, feed on humans and have a legspan that can reach
15 feet. Most surprising is their ability to speak perfect English, which must come in handy
to lure and torture their prey.<br>
</li>
</ol><br><br><br>
<strong>
<h1>Basilisk</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/basilisk.gif" alt="" width="518" height="167"
style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">If you have a fear of snakes, consider yourself lucky to have
never stumbled upon a basilisk. This giant monster can be 50 feet long, live hundreds of
years, and kill anyone or anything who crosses its pass, simply by making eye contact. If a
person, ghost or cat looks a basilisk in the eye indirectly, be it through a reflection or
camera lens, the victim will be Petrified and turned to stone. The giant serpent also has
incredibly powerful venom, one of the only substances in the Wizarding World strong enough
to destroy one of Voldemort's horcruxes <br></li>
</ol><br><br><br>
<strong>
<h1>Dementor</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/dementor.gif" alt="" width="518" height="167"
style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">Warning: never approach a mature mandrake without ear muffs! The
mandrake is a very lively root with a deadly cry. Yes, cry. These roots are more like little
beings and they are very temperamental. Mandrakes even go through puberty, get acne and are
not fully mature until they start hopping into the pots of other mandrakes. J.K. Rowling
lets you ponder what that means on your own.
Mandrakes have special healing powers and can be used to make a Restorative Draught to
revive someone who has been Petrified, or turned to stone. <br></li>
</ol><br><br><br>
<strong>
<h1>Selkie</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/serkie.gif" alt=""
width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">Beware of the selkies! A colony of this Scottish merpeople
subspecies lives in the Black Lake of Hogwarts. They are considered less beautiful than
sirens and can be extremely dangerous.
Harry and his fellow Triwizard Tournament champions must surpass the underwater selkie
community during their second task, which is no easy feat, thanks to their sharp tridents
and frightening cries. <br></li>
</ol><br><br><br>
<strong>
<h1>Phoenix</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/phoenix.gif" alt="" width="518"
height="167" style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">Phoenixes are incredibly powerful creatures, and a special one
named Fawkes saves Harry's life. Scarlet in color, the swan-sized creature possesses the
following powers: it can disappear and reappear through a burst of flames, carry a
tremendous amount of weight, survive a basilisk's deadly gaze (more on that below), produce
tears with special healing powers and regenerate itself after death. On what is called a
phoenix's Burning Day, the bird will burst into flames and rise from the ashes to begin a
new life.
Dumbledore's phoenix Fawkes comes to rescue Harry inside the Chamber of Secrets and uses its
tears to heal Harry's venom-filled wound. <br>
</li>
</ol><br><br><br>
<strong>
<h1>Cornish Pixie</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/pixies.gif" alt=""
width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">To summarize pixies in one word: annoying. Professor Lockhart
stupidly releases a cage-full of Cornish pixies upon his Defense Against the Dark Arts class
in a poorly-planned attempt to provide them with a hands-on experience. Cornish pixies are
blue mischief-makers who enjoy tormenting humans by destroying their belongings, lifting
them by the ears and causing general mayhem. The always clever Hermione restores the
classroom to order by performing a Freezing Charm that makes them sit still for once.
(Lockhart had cowardly fled the scene and left his students to fend for themselves.) <br>
</li>
</ol><br><br><br>
<strong>
<h1>Giant</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/giant.gif"
alt="" width="518" height="167" style="margin: 50.64px 0px; border-radius: 10px;"
loading="lazy">
<li style="text-align:center">How's the weather up there? Giants can grow to be 25 feet tall!
They tend to be less intelligent than witches and wizards but aren't nearly as dimwitted as
trolls. Giants can learn English (and also have their own language), but good luck simply
talking your way through a dispute. They have a history of being violent and are difficult
to detain since spells don't have much effect on them.
Disclaimer: not all giants are bad! While most take Voldemort's side during the First and
Second Wizarding Wars, we have the pleasure of meeting Hagrid's brother Grawp (AKA Grawpy).
Grawpy is kind to Harry and his friends, protects the centaurs of the Forbidden Forrest, and
goes after the evil Professor Umbridge when she crosses the line. Fun fact: he has quite the
crush on our heroine Hermione.<br>
</li>
</ol><br><br><br>
<strong>
<h1>Thestral</h1>
</strong><br>
<ol class="body-ol container">
<img src="assets/img/creatures/thestral.gif" alt="" width="518" height="167"
style="margin: 50.64px 0px; border-radius: 10px;" loading="lazy">
<li style="text-align:center">Thestrals are a particularly mysterious breed of winged horses;
they can only be seen by those who have witnessed death. These
creatures have skeletal bodies, bat-like wings and white eyes that lack pupils. They are
lured by the smell of blood, but when treated kindly allow humans to ride them.
Harry couldn't see thestrals until he witnessed the murder of Cedric Diggory during the
Goblet of Fire. Harry's parents died in his presence when he was a baby, but since he was
shielded in his crib, he was unable to see thestrals before Cedric's death. <br>
</li>
</ol><br><br><br>
</div>
</div>
</section>
<div class="swiper-wrapper">
<div class=" swiper-slide">
</div>
</div>
<div id="video-file">
<div id="video-button"></div>
</div>
</main>
<!--==================== FOOTER ====================-->
<footer class="footer section">
<div class="footer__container container grid">
<div class="footer__content grid">
<div class="footer__data">
<h3 class="footer__title">Harry Potter Verse</h3>
<img src="assets/img/signature.png">
<p class="footer__description">A wizarding world for Potter Heads
</p>
<div>
<a href="https://twitter.com/AkshatJalan13" target="_blank" class="footer__social">
<i class="ri-twitter-fill"></i>
</a>
<a href="https://www.instagram.com/akshatxjalan/" target="_blank" class="footer__social">
<i class="ri-instagram-fill"></i>
</a>
<a href="https://www.youtube.com/c/HaGGele" target="_blank" class="footer__social">
<i class="ri-youtube-fill"></i>
</a>
</div>
</div>
<hr>
<div class="footer__data">
<h3 class="footer__subtitle">Navigate</h3>
<ul>
<li class="footer__item">
<a href="index.html" class="footer__link">Home</a>
</li>
<li class="footer__item">
<a href="book.html" class="footer__link">Books</a>
</li>
<li class="footer__item">
<a href="movie.html" class="footer__link">Movies</a>
</li>
</ul>
</div>
<div class="footer__data">
<h3 class="footer__subtitle">Other Work</h3>
<ul>
<li class="footer__item">
<a href="https://akshatjalan.github.io/akshat/" class="footer__link">Portfolio</a>
</li>
<li class="footer__item">
<a href="https://akshatjalan.github.io/haggele/" class="footer__link">HaGGele</a>
</li>
<li class="footer__item">
<a href="https://ebook-akshat.netlify.app/" class="footer__link">Book Store</a>
</li>
</ul>
</div>
</div>
<div class="footer__rights container">
<p class="footer__copy">Copyright © Akshat Jalan | 2025</p>
</div>
</footer>
<!--========== SCROLL UP ==========-->
<a href="#" class="scrollup" id="scroll-up">
<i class="ri-arrow-up-line scrollup__icon"></i>
</a>
<!--=============== SCROLL REVEAL===============-->
<script src="assets/js/scrollreveal.min.js"></script>
<!--=============== SWIPER JS ===============-->
<script src="assets/js/swiper-bundle.min.js"></script>
<!--=============== MAIN JS ===============-->
<script src="assets/js/main.js"></script>
</body>
</html>