-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
65 lines (56 loc) · 2.67 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
<!DOCTYPE html>
<html>
<head>
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css"> -->
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- HERO SECTION -->
<section id="hero">
<div class="hero-section">
<h1 class="hero-title">VISIT ASTERA!</h1>
<h2 class="hero-text">Enjoy MONSTER HUNTING and exploring the NEW WORLD.</h2>
</div>
</section>
<!-- ACTIVITIES SECTION -->
<div class="main-content">
<section id="activities">
<h3 id="activity-title">Top three activities to do at Astera in Monster Hunter World!</h3>
<p class="hover-suggest">Hover over the images for a closer look!</p>
<div id="activity-section">
<div class="activity-card">
<img class="activity-img zoom" src="images/MHW-FOOD.jpg"
alt="Freshly made dish by the local canteen. Featuring various meats and seafoods coupled with a foamy beverage.">
<h2>Eat some good grub!</h2>
<p>Always power up before a hunt by trying all sorts of great dishes</p>
</div>
<div class="activity-card">
<img class="activity-img zoom" src="images/MHW-ROOM.jpg"
alt="An elegantly decorated personal room.">
<h2>Deck out your room!</h2>
<p>Get nice and cozy in your personally decorated room. Complete with pets!</p>
</div>
<div class="activity-card">
<img class="activity-img zoom" src="images/MHW-ARMOR.jpg"
alt="A hunter character wearing seasonal Halloween armor posing in front of the smithy">
<h2>Hunt monsters to create your best armors!</h2>
<p>Waltz around town in your newest sweet gear from the local smithy</p>
</div>
</div>
</section>
<!-- GUIDE SECTION -->
<section id="guide-section">
<section class="guide-container">
<img class="guide-img zoom" src="images/MHW-GUIDE.jpg"
alt="A black cat-like character standing on it's hind legs wearing yellow leather explorer armor and googles striking a pose.">
<div>
<h3>Your guide</h3>
<p id="guide-text">"Palicoes are cat-like companions in Monster Hunter World. Take care of em, and
they'll take care of you"</p>
<h4>Palico</h4>
</div>
</section>
</section>
</div>
</body>
</html>