-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhack.html
122 lines (100 loc) · 5.03 KB
/
hack.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
<!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">
<link rel="stylesheet" href="hack.css">
<title>Ocean Free</title>
<link rel="stylesheet" href="heroes.css">
</head>
<body>
<h1 id="title">Ocean Free</h1>
<h2 id="subtitle">Help to clean the ocean</h2>
<div id="HomePictureContainer">
<picture id="HomePicture">
<img src="https://wallpaperaccess.com/full/12676.jpg" alt="">
</picture>
</div>
<h3 id="Intro">
<span>
Do you love the ocean and want to protect it from pollution?
</span>
<span>
Then this game is for you!
</span>
</h3>
<section>
<article>
<p>Ocean free is a web-based video game designed to raise awareness about the importance of keeping our oceans clean and free from pollution.</p>
<p>In this game, your task is to prevent trash from reaching the bottom of the ocean by clicking on it as soon as it appears. The more trash you click, the more points you earn, and the cleaner the ocean becomes. </p>
<p>But be careful, some trash items are faster and trickier than others. As you progress through the game, the level of difficulty increases, and you will encounter different types of trash, such as plastic bottles, fishing nets, and even toxic waste.</p>
<p>The game is designed to educate players about the ecological crises that are happening around the world and how your actions can make a difference in protecting the environment. By highlighting the importance of keeping our oceans clean, the game aims to inspire players to take action and make changes in their own lives.</p>
<p>Can you save the ocean from trash? Start playing "Ocean Free" today and see how many points you can score while learning about the importance of environmental conservation.</p>
</article>
</section>
<div class="b-example-divider"></div>
<section>
<h2 class="subtitles">The game</h2>
<p>Include more images</p>
</section>
<section id="TeamSection">
<h2 class="subtitles">Meet the team</h2>
<article>
<p> <strong>Ocean Free</strong> game was created for the <a href="https://hackthehill.com/" target="_blank" rel="noopener noreferrer">Hack the Hill Hackathon</a>, March 3-5, 2023, Ottawa, ON, CA.</p>
</article>
<div class="AllMembers">
<article class="TeamMember">
<picture class="PicTeamMember">
<img src="https://www.biowars.com/blog/wp-content/uploads/2021/01/how-to-draw-a-face-hair-1.jpg" alt="">
</picture>
<div class="InfoTeamMember">
<p class="NameMember">Cedric Dimatulac</p>
<p class="SchoolMember">University of Ottawa</p>
<p class="ProgramMember">Computer Science</p>
</div>
</article>
<article class="TeamMember">
<picture class="PicTeamMember">
<img src="" alt="">
</picture>
<div class="InfoTeamMember">
<p class="NameMember">Lucas</p>
<p class="SchoolMember">Carleton University</p>
<p class="ProgramMember">Program</p>
</div>
</article>
<article class="TeamMember">
<picture class="PicTeamMember">
<img src="" alt="">
</picture>
<div class="InfoTeamMember">
<p class="NameMember">Victoria Cimpu</p>
<p class="SchoolMember">University of Ottawa</p>
<p class="ProgramMember">Software Engineering</p>
</div>
</article>
<article class="TeamMember">
<picture class="PicTeamMember">
<img src="" alt="">
</picture>
<div class="InfoTeamMember">
<p class="NameMember">Camilo Castro</p>
<p class="SchoolMember">Algonquin College</p>
<p class="ProgramMember">Electrical Engineering Technician</p>
</div>
</article>
<article class="TeamMember">
<picture class="PicTeamMember">
<img src="" alt="">
</picture>
<div class="InfoTeamMember">
<p class="NameMember">Dulguun Enkhtsog</p>
<p class="SchoolMember">Carleton University</p>
<p class="ProgramMember">Computer Science - Software Engineering</p>
</div>
</article>
</div>
</section>
</body>
</html>