-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
77 lines (75 loc) · 3.5 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WoW Fan Club</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<header class="header">
<div class="logo">WoW Fan Club</div>
<div class="header-links">
<ul>
<li><a href="https://www.reddit.com/r/wow/">WoW subreddit</a></li>
<li><a href="https://worldofwarcraft.blizzard.com/en-us/">WoW main page</a></li>
<li><a href="https://www.deviantart.com/search?q=World+of+Warcraft">WoW fan art</a></li>
</ul>
</header>
<main class="main">
<main class="top">
<div class="text">
<h1>Lose yourself in the World...of Warcraft</h1>
This is a website dedicated to all the lovely things involving World of World of Warcraft. Here you will find fan art, blog posts, and general tales of adventure throughout the World of Warcraft!
<button>Adventure Awaits</button>
</div>
<div class="img">
<img src="./images/wowimage.jpg" alt="leaders of the horde and alliance side by side" height="280" width="420" >
</div>
</main>
<main class="mid">
<div class="title">Choose your path</div>
<div class="container">
<div class="info">
<img src="./images/orc.jpg" alt="orc warrior" width="100" height="100">
<div class="text-mid">Orc warrior who conquers on the battlefield?</div>
</div>
<div class="info">
<img src="./images/bfa.jpg" alt="orc and human face to face" width="100" height="100">
<div class="text-mid">Who will you side with? Conquering orcs? Or the resilient humans?</div>
</div>
<div class="info">
<img src="./images/hordevsalliance.jpg" alt="orcs fighting humans" width="100" height="100">
<div class="text-mid">Fight along side the Heros of each faction to claim victory! </div>
</div>
<div class="info">
<img src="./images/paladin.jpg" alt="human paladin" width="100" height="100">
<div class="text-mid">Human paladin who uses divine light to dispense justice to those unjust?</div>
</div>
</div> </div>
</main>
<main class="lmid">
<div class="quote">
trust you have learned. To fight out of fear or anger is to fight a war that never ends. Face your fears, calm your hatreds. Find peace within yourself, so that you may share it with the world around you. These are the greatest treasures in life. Surely they.... Are worth fighting for.
<div class="strong">
<strong>-Emperor Shaohao</strong>
</div>
</div>
</main>
<main class="last">
<div class="last-container">
<div class="last-text">
<h2>The time is now!</h2>
Sign up for news letters and more WoW related content!
</div>
<div class="button2">
<button class="sign-up">Sign Up</button>
</div>
</div>
</main>
</main>
<footer class="footer">
Copyright © The Odin Project 2021
</footer>
</body>
</html>