-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
378 lines (365 loc) · 17.3 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
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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Basic Page Needs
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta charset="utf-8">
<title>Citizen Hacks</title>
<meta name="description"
content="For 36 hours, join students and leading innovators in tackling the challenge of privacy in the digital age. Featuring keynote speaker Dr. Ann Cavoukian.">
<meta name="author" content="wuon">
<!-- Mobile Specific Metas
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!-- Facebook Crawler Metas
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta property="og:url" content="https://citizenhacks.com" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Citizen Hacks" />
<meta property="og:description" content="For 36 hours, join students and leading innovators in tackling the challenge of privacy in the digital age. Featuring keynote speaker Dr. Ann Cavoukian." />
<meta property="og:image" content="https://citizenhacks.com/assets/ch-padded.jpg" />
<meta property="og:image:alt" content="Citizen Hacks" />
<!-- FONT
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link href="//fonts.googleapis.com/css?family=Source+Sans+Pro:200,400,600,700,900|Lato:300,400" rel="stylesheet"
type="text/css">
<!-- CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<!-- JS
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<script defer src="https://use.fontawesome.com/releases/v5.0.11/js/all.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="anime.min.js"></script>
<script src="main.js"></script>
<link rel="icon" href="assets/small.png">
</head>
<body class="body">
<ul id="menu">
<a href="#hero" class="panel-button">
<li>Home</li>
</a>
<a href="#about" class="panel-button">
<li>About</li>
</a>
<a href="#sponsors" class="panel-button">
<li>Sponsors</li>
</a>
<a href="#faq" class="panel-button">
<li>FAQ</li>
</a>
<a href="mailto:[email protected]" class="panel-button">
<li>Contact</li>
</a>
</ul>
<div class="bg-cover" class="reveal"></div>
<div class="panel">
<header id="header">
<div class="header-container">
<div class="horizontal">
<div class="header-title web">
<a href="index.html">
<img class="header-logo" src="assets/small.svg" alt="Citizen Hacks">
</a>
</div>
<div>
<a class="hamburger-shell">
<div class="hamb top"></div>
<div class="hamb middle"></div>
<div class="hamb bottom"></div>
</a>
</div>
<div>
<a class="contact-us-button mobile" href="mailto:[email protected]">
Contact
</a>
</div>
</div>
<div class="horizontal links">
<div>
<a class="link" id="hero-button">Home</a>
</div>
<div>
<a class="link" href="#about">About</a>
</div>
<div>
<a class="link" href="#sponsors">Sponsors</a>
</div>
<div>
<a class="link" href="#faq" >FAQ</a>
</div>
<div>
<a class="contact-us-button" href="mailto:[email protected]">
Contact
</a>
</div>
</div>
</div>
</header>
<div class="hero-container" id="hero">
<div class="content">
<div class="hero center">
<div class="hero-content-container vertical center">
<div class="hero-big-title opacity">
<img class="hero-logo" src="assets/full.svg" alt="Citizen Hacks">
</div>
<div class="sub-title opacity">
For 36 hours, join students and leading innovators in tackling the challenge of privacy in the
digital age.<br><br>
</div>
<div class="sub-title opacity">
Featuring keynote speaker <a target="_blank"
href="https://www.ryerson.ca/pbdce/about/ann-cavoukian/">Dr. Ann
Cavoukian</a>.
</div>
<div>
<p class="date opacity">
September 6-8, 2019 at
<a target="_blank"
href="https://www.google.com/maps/place/OneEleven/@43.6434299,-79.3924427,17z/data=!3m1!4b1!4m5!3m4!1s0x882b34cd979b9de1:0xcec413b6548741d2!8m2!3d43.643426!4d-79.390254">
OneEleven
</a>
</p>
</div>
<div>
<a class="learn-more-button opacity" href="https://mailtrain.citizenhacks.com/subscription/WboiBN3gM">Subscribe</a>
<!--
<a class="learn-more-button opacity" href="application.html">Apply</a>
-->
</div>
</div>
</div>
</div>
</div>
<div class="about-container" id="about">
<div class="vertical about center">
<div class="title">
About
</div>
<div class="pink-line"></div>
<div class="about-description">
Youth play an essential role in defining our digital future. That’s why we created Citizen Hacks, a
student-run
hackathon that encourages the next generation of innovators and users to actively participate in
building a
digital world that works for everyone.
</div>
<div class="about-description">
Citizen Hacks is a platform for university and high school students to collaborate with educators,
businesses,
nonprofits, and governmental organizations in exploring the challenges and potential of creating
technology
that benefits society.
</div>
</div>
</div>
<div class="sponsor-container" id="sponsors">
<div class="vertical sponsor center">
<div class="title">
Sponsors
</div>
<div class="blue-line"></div>
<div>
<a href="https://keybase.io/">
<img width=180 height=48 class="silver" src="assets/keybase-logo.png" alt="Keybase">
</a>
</div>
<div>
<a href="https://www.mattermost.org/">
<img class="bronze" src="assets/logoHorizontal.png" alt="Mattermost">
</a>
<a href="https://protonmail.com/">
<img class="bronze" src="assets/protonmail-logo-dark.png" alt="Protonmail">
</a>
<a href="https://fastmail.com/?ref=citizenhacks">
<img class="bronze" src="assets/blue-on-transparent-with-wordmark.png" alt="Fastmail">
</a>
</div>
<div>
<a href="https://www.engsoc.uwaterloo.ca/">
<img class="startup" src="assets/Logo_EngSoc.png" alt="Waterloo EngSoc">
</a>
</div>
</div>
</div>
<!--
<div class="stats-container">
<div class="horizontal stats">
<div>
<span class="stats-number" id="people"></span>
<span class="stats-text"> hackers </span>
</div>
<div>
<span class="stats-number" id="speaker"></span>
<span class="stats-text"> speakers </span>
</div>
<div>
<span class="stats-number" id="sponsor"></span>
<span class="stats-text"> sponsors </span>
</div>
</div>
</div>
-->
<div class="prelude"></div>
<div class="faq-container" id="faq">
<div class="vertical center">
<div class="title">
FAQ
</div>
<div class="yellow-line"></div>
<div class="row faq">
<div class="column">
<div class="faq-body">
<div class="faq-title">
What is the topic of Citizen Hacks?
</div>
<div class="faq-description">
At Citizen Hacks 2019, we’re asking you this question: “How can we build a digital future
that protects
everyone’s privacy?” Working alongside teammates, you’ll create solutions that respond to
this challenge.
Whether this means designing technology that cares about privacy, creating laws or policies
that protect
personal data, or finding ways to promote privacy through education, the path you take is up
to you!
</div>
</div>
<div class="faq-body">
<div class="faq-title">
Who can participate?
</div>
<div class="faq-description">
If you’re a student in high school or university, we’d love to have you!
</div>
</div>
<div class="faq-body">
<div class="faq-title">
What activities will there be at Citizen Hacks?
</div>
<div class="faq-description">
In addition to hacking, there will be workshops and panels with leaders in the field of
privacy,
opportunities to meet with sponsors, and other fun activities throughout the weekend.
Citizen Hacks is
much more than a hackathon—it’s a place for you to learn from and connect with industry
leaders,
innovators, and other like-minded people, all while exploring the potential of creating
technology that
benefits society.
</div>
</div>
<div class="faq-body">
<div class="faq-title">
What is a hackathon?
</div>
<div class="faq-description">
A hackathon is an event where participants use their knowledge and skills to create,
develop, design, and
pitch a solution to a particular problem over 36 hours. They’re open not just to programmers
and
engineers, but to anyone who’s interested in working together to find answers to the world’s
most
pressing problems.
</div>
</div>
<div class="faq-body">
<div class="faq-title">
How can I sponsor?
</div>
<div class="faq-description">
You can find more information about sponsoring Citizen Hacks in our
<a href="./sponsor.pdf">sponsorship package</a>, or email us at
<a href="mailto:[email protected]">[email protected]</a>.
</div>
</div>
</div>
<div class="column">
<div class="faq-body">
<div class="faq-title">
What if I’ve never been to a hackathon before?
</div>
<div class="faq-description">
No matter what your skills are, we can use your help in responding to the central challenge
of Citizen
Hacks: “How can we build a digital future that protects everyone’s privacy?” We believe that
solutions
are better when they integrate diverse ways of thinking. There will be many opportunities to
learn new
skills or ideas at workshops and from the people around you. We’ll also be holding team
building events
where you can meet new people. Just come eager to learn and share your own knowledge!
</div>
</div>
<div class="faq-body">
<div class="faq-title">
Are there any fees to attend Citizen Hacks?
</div>
<div class="faq-description">
There are no fees to attend Citizen Hacks. <!--We will provide the food and accommodations during the event.
All you need to do is find your own way here and cover any incidental expenses—we unfortunately don’t
provide reimbursements for these things.-->
</div>
</div>
<div class="faq-body">
<div class="faq-title">
What should I bring?
</div>
<div class="faq-description">
Bring a laptop, chargers, comfortable clothing, and your desire to learn and innovate! If
you’d like, you
can also bring a pillow and blanket to get comfy. Everything else will be provided for you.
</div>
</div>
<div class="faq-body">
<div class="faq-title">
Can I start working on my hack before?
</div>
<div class="faq-description">
You can’t start creating anything before the hackathon begins, however, you can form a team
and discuss
what you’ll do over the 36 hours.
</div>
</div>
<div class="faq-body">
<div class="faq-title">
Other Questions
</div>
<div class="faq-description">
If you have other questions that we haven’t answered here, you can send an email to
<a href="mailto:[email protected]">[email protected]</a>.
</div>
</div>
</div>
</div>
</div>
</div>
<footer>
<div class="footer-container">
<div class="horizontal">
<div class="header-title">
<img class="header-logo" src="assets/small.svg" alt="Citizen Hacks">
</div>
</div>
<div class="horizontal right">
<div class="icon-container">
<a class="icon" href="https://www.facebook.com/citizenhacks">
<i class="fab fa-facebook-f"></i>
</a>
</div>
<div class="icon-container">
<a class="icon" href="https://www.twitter.com/CitizenHacks">
<i class="fab fa-twitter"></i>
</a>
</div>
<div class="icon-container">
<a class="icon" rel="me" href="https://mastodon.social/@citizenhacks">
<i class="fab fa-mastodon"></i>
</a>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>