-
Notifications
You must be signed in to change notification settings - Fork 5
Expand file tree
/
Copy pathpeople.html
More file actions
516 lines (478 loc) · 31.6 KB
/
Copy pathpeople.html
File metadata and controls
516 lines (478 loc) · 31.6 KB
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
508
509
510
511
512
513
514
515
516
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- slick slider -->
<link rel="stylesheet" type="text/css" href="./slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="./slick/slick-theme.css"/>
<link rel="stylesheet" type="text/css" href="./fontawesome/css/all.min.css">
<link rel="stylesheet" href="./css/master.css">
<title>People</title>
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="/icons/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/icons/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/icons/favicon/favicon-16x16.png">
<link rel="manifest" href="/icons/favicon/site.webmanifest">
<link rel="mask-icon" href="/icons/favicon/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="/icons/favicon/favicon.ico">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/icons/favicon/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
</head>
<body>
<section>
<div class="background-grey"></div>
<div class="wrapper top-header">
<!-- <div class="overlay-top"></div> -->
<div class="nav-fixed flex">
<div class="people-menu small-only">
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="bars" class="svg-inline--fa fa-bars fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path></svg>
</div>
<div class="logo">
<a href="./index.html"><img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029038/Team-Mars/logo-text_viyeth.png" alt=""></a>
</div>
<nav class="large-only">
<ul>
<li><a href="./company.html">Company</a></li>
<li><a href="./index.html">People</a></li>
<li><a href="#">support
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593010641/Team-mars/arrow_rjeie7.png" alt=""></a>
</li>
</ul>
</nav>
<div class="people-send large-only">
<a href="./cta-modal.html">Send app to your phone</a>
</div>
<div class="people-question small-only">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 448c-110.532 0-200-89.431-200-200 0-110.495 89.472-200 200-200 110.491 0 200 89.471 200 200 0 110.53-89.431 200-200 200zm107.244-255.2c0 67.052-72.421 68.084-72.421 92.863V300c0 6.627-5.373 12-12 12h-45.647c-6.627 0-12-5.373-12-12v-8.659c0-35.745 27.1-50.034 47.579-61.516 17.561-9.845 28.324-16.541 28.324-29.579 0-17.246-21.999-28.693-39.784-28.693-23.189 0-33.894 10.977-48.942 29.969-4.057 5.12-11.46 6.071-16.666 2.124l-27.824-21.098c-5.107-3.872-6.251-11.066-2.644-16.363C184.846 131.491 214.94 112 261.794 112c49.071 0 101.45 38.304 101.45 88.8zM298 368c0 23.159-18.841 42-42 42s-42-18.841-42-42 18.841-42 42-42 42 18.841 42 42z"/></svg>
</div>
</div>
</div>
</section>
<section id="header_section" class="header">
<div class="wrapper grid-large-temp">
<div class="people-text">
<h2>The People Behind the Bunny</h2>
<quote class="large-only">“Hopper is a culture of makers. We build things.”</quote>
<quote class="small-only">“We don't want to optimize; we want to change the world.”</quote>
<p class="large-only">Joost Ouwerkerk, CTO</p>
<p class="small-only">Maggie, Product Designer</p>
</div>
<div class="people-image">
<div class="horizontal-line small-only"></div>
<img class="large-only" src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029078/Team-Mars/header-images_3x_hipnhm.png" alt="">
<img class="small-only" src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029029/Team-Mars/Header-image-small_gbpq3u.png" alt="">
</div>
</div>
</section>
<section id="accessible" class="small-only">
<div class="wrapper">
<div class="accessible-text">
<h2>Making the world <br> accessible to all</h2>
<p>Working at Hopper means making an authentic impact on the way people arrange and enjoy travel. By allowing booking to be simple and affordable, we’re breaking down the barrier to adventure at scale. The speed at which we design, form, and deploy changes create a dream environment for those who thrive on independence.</p>
<p>Our approach is one centred around consistent communication, earning users trust. We avoid outdated pressure tactics and opt instead for what we believe is the future of great travel. A tailored solution, that removes anxiety around decision making, ensuring the user always finds the best possible deal, within a process that's playful and effortless.</p>
</div>
<div class="image-bunnies flex">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593028932/Team-Mars/bunnies1_hxbwei.png" alt="">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593028932/Team-Mars/bunnies2_kvbwxl.png" alt="">
</div>
</div>
</section>
<section id="section_two" class="large-only">
<div class="wrapper">
<div class="section-two flex-large">
<h2>Making the world <br> accessible to all</h2>
<div class="section-paragraphs">
<p>Building an incredible product takes an incredible team. Here, everyone has an impact — on the app and on the millions of travelers who use Hopper every day. At the heart of Hopper is our users’ trust in us, our expertise, and our passion. So everything we build, we build for them.</p>
<p>We move quickly, testing and iterating, thinking big and planning for the future we want, where everyone can travel. Peek any whiteboard and you’ll find grand plans. Pop into a meeting and hear world-changing, maybe even crazy, ideas. Scribble solutions on a napkin. Brainstorm over the espresso machine. This is how we build — together.</p>
</div>
</div>
</div>
</section>
<section id="modal">
<div class="wrapper">
<div class="help">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 448c-110.532 0-200-89.431-200-200 0-110.495 89.472-200 200-200 110.491 0 200 89.471 200 200 0 110.53-89.431 200-200 200zm107.244-255.2c0 67.052-72.421 68.084-72.421 92.863V300c0 6.627-5.373 12-12 12h-45.647c-6.627 0-12-5.373-12-12v-8.659c0-35.745 27.1-50.034 47.579-61.516 17.561-9.845 28.324-16.541 28.324-29.579 0-17.246-21.999-28.693-39.784-28.693-23.189 0-33.894 10.977-48.942 29.969-4.057 5.12-11.46 6.071-16.666 2.124l-27.824-21.098c-5.107-3.872-6.251-11.066-2.644-16.363C184.846 131.491 214.94 112 261.794 112c49.071 0 101.45 38.304 101.45 88.8zM298 368c0 23.159-18.841 42-42 42s-42-18.841-42-42 18.841-42 42-42 42 18.841 42 42z"/></svg>
</div>
<div class="close">
<svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="cross" class="svg-inline--fa fa-cross fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path d="M1016.88 824.878c-.004-.004-.008-.008-.012-.01l-310.643-310.65 310.644-310.65.012-.01a31.763 31.763 0 0 0 7.312-11.416c4.246-11.376 1.824-24.682-7.324-33.83L870.122 11.566C860.974 2.42 847.672 0 836.294 4.246a31.826 31.826 0 0 0-11.418 7.31c0 .004-.004.006-.008.01L514.22 322.218 203.572 11.568l-.01-.01a31.794 31.794 0 0 0-11.414-7.31c-11.38-4.248-24.682-1.826-33.83 7.32L11.57 158.316c-9.148 9.148-11.568 22.452-7.322 33.828a31.816 31.816 0 0 0 7.312 11.416c.004.002.006.006.01.01l310.65 310.648L11.57 824.87l-.008.01a31.859 31.859 0 0 0-7.314 11.414C0 847.67 2.422 860.976 11.57 870.124l146.748 146.746c9.15 9.148 22.452 11.568 33.83 7.322a31.834 31.834 0 0 0 11.416-7.312c.002-.004.006-.006.01-.01l310.648-310.65 310.648 310.65.012.008a31.822 31.822 0 0 0 11.414 7.314c11.378 4.246 24.684 1.826 33.828-7.322l146.746-146.748c9.148-9.148 11.57-22.454 7.324-33.83a31.805 31.805 0 0 0-7.314-11.414z"></path>
</svg>
</div>
<div class="logo">
<a href="./index.html"><img src="./images/logo.png" alt=""></a>
</div>
<nav class="modal-nav">
<ul class="flex">
<li><a href="#">Company</a></li>
<li><a href="./people.html">People</a></li>
<li><a href="#">Support</a></li>
<li><a href="./cta-modal.html">Download</a></li>
</ul>
</nav>
</div>
</section>
<!-- From Life at Hopper Section -->
<section id="life">
<div class="wrapper">
<div class="video-container grid-large">
<video class="large-only" muted loop poster="images/video-life.png">
<source src="./video/twitter2.mp4" type="video/mp4">
</video>
<video class="small-only" muted loop poster="images/video-life-small.png">
<source src="./video/twitter2.mp4" type="video/mp4">
</video>
<div class="video-text">
<h2>Life at Hopper</h2>
<p class="large-only">How did the humans behind the bunny find their careers? From developers to data scientists to designers, we all have the same goal: redefine how the world books travel.</p>
<p class="small-only">
Learn how the humans behind the bunny found their careers. From Engineers to Designers, Hopper’s mission is the same; help others travel the world.
</p>
<div class="play-video flex">
<button>Watch the short film </button><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M371.7 238l-176-107c-15.8-8.8-35.7 2.5-35.7 21v208c0 18.4 19.8 29.8 35.7 21l176-101c16.4-9.1 16.4-32.8 0-42zM504 256C504 119 393 8 256 8S8 119 8 256s111 248 248 248 248-111 248-248zm-448 0c0-110.5 89.5-200 200-200s200 89.5 200 200-89.5 200-200 200S56 366.5 56 256z"/></svg>
</div>
</div>
</div>
</div>
</section>
<section id="values">
<div class="wrapper flex-large">
<h2>Hopper's core values</h2>
<div class="values-list small-only">
<div class="value-item">
<p><span>Scale for impact.</span> Our product helps more than 600k merchants worldwide do what they love. There are no small problems at Shopify; every project you touch will have a real impact on merchants’ livelihoods, and that makes our work incredibly fulfilling.</p>
</div>
<div class="value-item">
<p><span>Propelled by ambition.</span> We’re growing quickly and, like a rocket ship, we show no signs of slowing down. We want to define the future of entrepreneurship, be a 100 year company, and the global engine that powers commerce.</p>
</div>
<div class="value-item">
<p><span>Learn with the best.</span> Talented people choose to work with us because we provide everything they need to feel challenged, hone their craft, and learn from one another. Surround yourself with a world-class team and level up quickly.
</p>
</div>
</div>
<div class="values-list large-only">
<div class="value-item ">
<p><span>Be curious.</span> Analyze everything. Read everything. Reread everything. Question everything. Never stop learning, whether it’s a skill, a marketplace, the user, the industry, the world. Share knowledge and encourage wondering.</p>
</div>
<div class="value-item">
<p><span>Be empathetic.</span> Believe in humans, not consumers. Build for travelers, not end users. Advocate for individual experiences, kill friction and understand what really matters.</p>
</div>
<div class="value-item">
<p><span>Be fearless.</span> Embrace autonomy, ambition, and risk. Stand up for your scariest ideas. Disregard the way things have always been done in favor of better, bigger, and downright wild.</p>
</div>
<div class="value-item">
<p><span>Be responsible.</span> What you do is part of who you are. Own your decisions. Take action. You might not be the best person to fix everything but nothing is ever “not your problem.”</p>
</div>
<div class="value-item">
<p><span>Be open.</span> Respect different voices. Welcome unique points of view. Strive to understand, not just accept. Champion each other.</p>
</div>
</div>
</div>
</section>
<!-- IMAGE SLIDER -->
<section id="offices">
<div class="wrapper">
<div class="slides">
<div class="slide-item">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029049/Team-Mars/office_diw4q1.png" />
</div>
<div class="slide-item">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029049/Team-Mars/office_diw4q1.png" />
</div>
<div class="slide-item">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029049/Team-Mars/office_diw4q1.png" />
</div>
</div>
<div class="slider-control large-only">
<span class="arrow-backward prev">
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="long-arrow-alt-left" class="svg-inline--fa fa-long-arrow-alt-left fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M134.059 296H436c6.627 0 12-5.373 12-12v-56c0-6.627-5.373-12-12-12H134.059v-46.059c0-21.382-25.851-32.09-40.971-16.971L7.029 239.029c-9.373 9.373-9.373 24.569 0 33.941l86.059 86.059c15.119 15.119 40.971 4.411 40.971-16.971V296z"></path></svg>
</span>
<span class="arrow-forward next">
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="long-arrow-alt-right" class="svg-inline--fa fa-long-arrow-alt-right fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M313.941 216H12c-6.627 0-12 5.373-12 12v56c0 6.627 5.373 12 12 12h301.941v46.059c0 21.382 25.851 32.09 40.971 16.971l86.059-86.059c9.373-9.373 9.373-24.569 0-33.941l-86.059-86.059c-15.119-15.119-40.971-4.411-40.971 16.971V216z"></path></svg>
</span>
</div>
<div class="departments small-only">
<h2>Departments</h2>
<p>Our departments range across data science, engineering, design, product and customer support, working to drive growth, creativity, and a deep understanding of our customer's needs. Throughout them all, you'll find a consistent mentality and desire for collaboration.
</p>
</div>
</div>
</section>
<section id="humans">
<div class="wrapper">
<div class="humans-upper flex large-only">
<div class="humans-text">
<h2>Assorted Hopper Humans</h2>
<p>A ukulele-playing developer, an engineer-turned-data scientist, a copywriter-turned-marketer-turned-product manager: at Hopper, backgrounds are diverse and unique, and pathways for growth are limitless. How will your story add to our mix?</p>
</div>
<div class="humans-image">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029051/Team-Mars/multi-bunny_ktsffx.png" alt="">
</div>
</div>
<div class="humans-image small-only">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593028947/Team-Mars/chair-bunny_srqr0x.png" alt="">
</div>
<div class="quote small-only">
<quote>“We don't want to optimize; we want to change the world.”</quote>
<p>Maggie, Product Designer</p>
</div>
<div class="humans-quote large-only">
<quote>Building a team of really diverse people who work well together is core of what drives us.</quote>
<p>”</p>
</div>
</div>
</section>
<section id="extras">
<div class="wrapper flex-large">
<div class="extras-text large-only">
<h2>Extra-curriculars</h2>
<p>We know that part of being our best selves at work means having fun outside of working hours. Expect board game nights, barbecues, karaoke bars, lunch-and-learns, and company-wide offsites. We like to have fun, what can we say? </p>
</div>
<div class="extras-text small-only">
<h2>Activities</h2>
<p>As much as we prefer to have fun, at times workdays can be stressful. We've got these times covered, organising events, games, BBQs, ping-pong tournaments, karaoke, lunch and learns, dinners and even team trips. We all like to adventure. After all, its what we do best.</p>
</div>
<div class="activities">
<div class="activities-header">
<h2>#activities</h2>
<ul>
<li><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z"/></svg></li>
<li><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M224 256c70.7 0 128-57.3 128-128S294.7 0 224 0 96 57.3 96 128s57.3 128 128 128zm89.6 32h-16.7c-22.2 10.2-46.9 16-72.9 16s-50.6-5.8-72.9-16h-16.7C60.2 288 0 348.2 0 422.4V464c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48v-41.6c0-74.2-60.2-134.4-134.4-134.4z"/></svg>201</li>
<li>Funbun<sup>TM</sup></li>
</ul>
</div>
<div class="interactions">
<div class="member">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029010/Team-Mars/dan_mpnxfo.png" alt="">
<div class="detail">
<div class="name">
<p>Dan</p><time>5:21 PM</time>
</div>
<div class="message">
<p>Who’s up for bouldering after work?</p>
</div>
</div>
</div>
<div class="member">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029039/Team-Mars/mackenzie_jn6ujp.png" alt="">
<div class="detail">
<div class="name">
<p>Mackenzie</p><time>5:21 PM</time>
</div>
<div class="message">
<p>Race you to the top! 💪</p>
</div>
</div>
</div>
<div class="member">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029035/Team-Mars/krysi_irlekm.png" alt="">
<div class="detail">
<div class="name">
<p>Krysi</p><time>5:21 PM</time>
</div>
<div class="message">
<p>There’s also a BBQ outside at 7, are you guys in?</p>
</div>
</div>
</div>
<div class="member">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029017/Team-Mars/fitz_xahkjg.png" alt="">
<div class="detail">
<div class="name">
<p>Fitz</p><time>5:21 PM</time>
</div>
<div class="message">
<p>Wish I could make it, but I’m in Hawaii drawing bunnies from the beach 🐰 🏖</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="careers">
<div class="wrapper flex">
<div class="careers-image large-only">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029073/Team-Mars/working-bunnies_aih8wl.png" alt="">
</div>
<div class="careers-text">
<h2 class="large-only">So what do you think?</h2>
<h2 class="small-only">We're waiting for you</h2>
<p class="large-only">We’re a fast-paced and fun-loving team working together to solve big problems. You’d be a great fit! </p>
<p class="small-only">As much as we prefer to have fun, at times workdays can be stressful. We've got these times covered, organising events, games, BBQs, ping-pong tournaments, karaoke, lunch and learns, dinners and even team trips. We all like to adventure. After all, its what we do best.</p>
<a href="./careerList.html">See Open Careers<span class="large-only">21</span></a>
</div>
<div class="bunnies-dog small-only">
<img src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593028932/Team-Mars/bunnies-dog_oj1bne.png">
</div>
</div>
</section>
<footer id="footer" class="">
<div class="flex">
<img class="small-only" src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029037/Team-Mars/logo-grey_c8ukpz.png">
</div>
<div class="line large-only">
<hr />
</div>
<div class="wrapper flex">
<!-- <img class="small-only" src="./images/logo.png"> -->
<div class="footer-left flex">
<img class="large-only" src="https://res.cloudinary.com/dw4rdnuqh/image/upload/v1593029038/Team-Mars/logo-text_viyeth.png" alt="">
<div class="flex select">
<svg class="large-only" width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.4925 0C3.3525 0 0 3.36 0 7.5C0 11.64 3.3525 15 7.4925 15C11.64 15 15 11.64 15 7.5C15 3.36 11.64 0 7.4925 0ZM12.69 4.5H10.4775C10.2375 3.5625 9.8925 2.6625 9.4425 1.83C10.8225 2.3025 11.97 3.2625 12.69 4.5ZM7.5 1.53C8.1225 2.43 8.61 3.4275 8.9325 4.5H6.0675C6.39 3.4275 6.8775 2.43 7.5 1.53ZM1.695 9C1.575 8.52 1.5 8.0175 1.5 7.5C1.5 6.9825 1.575 6.48 1.695 6H4.23C4.17 6.495 4.125 6.99 4.125 7.5C4.125 8.01 4.17 8.505 4.23 9H1.695ZM2.31 10.5H4.5225C4.7625 11.4375 5.1075 12.3375 5.5575 13.17C4.1775 12.6975 3.03 11.745 2.31 10.5ZM4.5225 4.5H2.31C3.03 3.255 4.1775 2.3025 5.5575 1.83C5.1075 2.6625 4.7625 3.5625 4.5225 4.5ZM7.5 13.47C6.8775 12.57 6.39 11.5725 6.0675 10.5H8.9325C8.61 11.5725 8.1225 12.57 7.5 13.47ZM9.255 9H5.745C5.6775 8.505 5.625 8.01 5.625 7.5C5.625 6.99 5.6775 6.4875 5.745 6H9.255C9.3225 6.4875 9.375 6.99 9.375 7.5C9.375 8.01 9.3225 8.505 9.255 9ZM9.4425 13.17C9.8925 12.3375 10.2375 11.4375 10.4775 10.5H12.69C11.97 11.7375 10.8225 12.6975 9.4425 13.17ZM10.77 9C10.83 8.505 10.875 8.01 10.875 7.5C10.875 6.99 10.83 6.495 10.77 6H13.305C13.425 6.48 13.5 6.9825 13.5 7.5C13.5 8.0175 13.425 8.52 13.305 9H10.77Z" fill="#505050"/>
</svg>
<select class="small-only">
<option>Language</option>
<option>English</option>
<option>French</option>
</select>
<select class="large-only">
<option>English</option>
<option>French</option>
</select>
</div>
<div class="social flex">
<svg viewBox="0 0 30 31" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="0.442539" y="0.556064" width="29.1149" height="29.1149" rx="14.5575" stroke="#878787" stroke-width="0.885078"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.0355 15.6981H18.0198L18.3169 13.3278H16.0355V11.8145C16.0355 11.1283 16.2207 10.6606 17.1773 10.6606L18.3973 10.66V8.54007C18.1862 8.51129 17.462 8.44678 16.6196 8.44678C14.8606 8.44678 13.6564 9.55132 13.6564 11.5799V13.3279H11.667V15.6981H13.6564V21.7801L16.0355 21.78V15.6981Z" fill="#505050"/>
</svg>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16 31C24.2843 31 31 24.2843 31 16C31 7.71573 24.2843 1 16 1C7.71573 1 1 7.71573 1 16C1 24.2843 7.71573 31 16 31Z" stroke="#878787" stroke-width="0.885078"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.7325 11.6776C22.3679 11.2967 22.8558 10.6937 23.0856 9.97506C22.491 10.3277 21.8324 10.5838 21.1314 10.7219C20.57 10.1238 19.7702 9.75 18.8851 9.75C17.1855 9.75 15.8076 11.1279 15.8076 12.8274C15.8076 13.0686 15.8349 13.3034 15.8873 13.5287C13.3296 13.4003 11.0621 12.1752 9.54422 10.3133C9.27933 10.7678 9.12757 11.2965 9.12757 11.8604C9.12757 12.9281 9.67091 13.87 10.4967 14.4219C9.99215 14.4059 9.51767 14.2675 9.10271 14.037C9.10249 14.0498 9.10249 14.0627 9.10249 14.0757C9.10249 15.5667 10.1633 16.8106 11.5711 17.0932C11.3128 17.1636 11.041 17.2012 10.7603 17.2012C10.562 17.2012 10.3692 17.1819 10.1813 17.146C10.5729 18.3686 11.7094 19.2583 13.0561 19.2832C12.0029 20.1086 10.6759 20.6005 9.23412 20.6005C8.98573 20.6005 8.74075 20.586 8.5 20.5576C9.8619 21.4307 11.4795 21.9402 13.2174 21.9402C18.8779 21.9402 21.9733 17.2509 21.9733 13.1842C21.9733 13.0508 21.9703 12.9181 21.9644 12.7861C22.5656 12.3522 23.0874 11.8102 23.5 11.193C22.9481 11.4378 22.355 11.6032 21.7325 11.6776Z" fill="#505050"/>
</svg>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16 31C24.2843 31 31 24.2843 31 16C31 7.71573 24.2843 1 16 1C7.71573 1 1 7.71573 1 16C1 24.2843 7.71573 31 16 31Z" stroke="#878787" stroke-width="0.885078"/>
<rect x="8.91602" y="8.91675" width="14.1667" height="14.1667" rx="4.02711" stroke="#505050" stroke-width="1.54889"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.0196 19.4691C17.8901 19.4691 19.4064 17.9438 19.4064 16.0624C19.4064 14.181 17.8901 12.6558 16.0196 12.6558C14.1491 12.6558 12.6328 14.181 12.6328 16.0624C12.6328 17.9438 14.1491 19.4691 16.0196 19.4691Z" stroke="#505050" stroke-width="1.54889"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.1709 12.8219C20.7184 12.8219 21.1622 12.3755 21.1622 11.8248C21.1622 11.2742 20.7184 10.8278 20.1709 10.8278C19.6235 10.8278 19.1797 11.2742 19.1797 11.8248C19.1797 12.3755 19.6235 12.8219 20.1709 12.8219Z" fill="#505050"/>
</svg>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16 31C24.2843 31 31 24.2843 31 16C31 7.71573 24.2843 1 16 1C7.71573 1 1 7.71573 1 16C1 24.2843 7.71573 31 16 31Z" stroke="#878787" stroke-width="0.885078"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.2637 22.4584H9.53906V13.6986H12.2637V22.4584ZM10.916 12.4974C10.4863 12.4974 10.1152 12.3412 9.80273 12.0287C9.49023 11.7162 9.33398 11.3451 9.33398 10.9154C9.33398 10.4857 9.49023 10.1146 9.80273 9.80212C10.1152 9.48962 10.4863 9.33337 10.916 9.33337C11.3457 9.33337 11.7168 9.48962 12.0293 9.80212C12.3418 10.1146 12.498 10.4857 12.498 10.9154C12.498 11.3451 12.3418 11.7162 12.0293 12.0287C11.7168 12.3412 11.3457 12.4974 10.916 12.4974ZM22.459 22.4584H19.7344V18.181C19.7344 17.4779 19.6758 16.9701 19.5586 16.6576C19.3437 16.1302 18.9238 15.8666 18.2988 15.8666C17.6738 15.8666 17.2344 16.1009 16.9805 16.5697C16.7851 16.9213 16.6875 17.4388 16.6875 18.1224V22.4584H13.9922V13.6986H16.5996V14.8998H16.6289C16.8242 14.5092 17.1367 14.1869 17.5664 13.933C18.0351 13.6205 18.582 13.4642 19.207 13.4642C20.4765 13.4642 21.3652 13.8646 21.873 14.6654C22.2637 15.3099 22.459 16.306 22.459 17.6537V22.4584Z" fill="#505050"/>
</svg>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16 31C24.2843 31 31 24.2843 31 16C31 7.71573 24.2843 1 16 1C7.71573 1 1 7.71573 1 16C1 24.2843 7.71573 31 16 31Z" stroke="#878787" stroke-width="0.885078"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M22.8483 12.5625C22.9698 13.0312 23.0566 13.743 23.1087 14.6979L23.1347 16L23.1087 17.3021C23.0566 18.2743 22.9698 18.9948 22.8483 19.4635C22.7615 19.7587 22.6052 20.0191 22.3795 20.2448C22.1538 20.4705 21.8847 20.6267 21.5722 20.7135C21.1208 20.835 20.0618 20.9219 18.3952 20.9739L16.0254 21L13.6556 20.9739C11.9889 20.9219 10.9299 20.835 10.4785 20.7135C10.166 20.6267 9.89692 20.4705 9.67122 20.2448C9.44553 20.0191 9.28928 19.7587 9.20247 19.4635C9.08095 18.9948 8.99414 18.2743 8.94206 17.3021L8.91602 16C8.91602 15.618 8.9247 15.184 8.94206 14.6979C8.99414 13.743 9.08095 13.0312 9.20247 12.5625C9.28928 12.25 9.44553 11.9809 9.67122 11.7552C9.89692 11.5295 10.166 11.3733 10.4785 11.2865C10.9299 11.1649 11.9889 11.0781 13.6556 11.026L16.0254 11L18.3952 11.026C20.0618 11.0781 21.1208 11.1649 21.5722 11.2865C21.8847 11.3733 22.1538 11.5295 22.3795 11.7552C22.6052 11.9809 22.7615 12.25 22.8483 12.5625ZM14.5664 18.1354L18.2904 16L14.5664 13.8906V18.1354Z" fill="#505050"/>
</svg>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16 31C24.2843 31 31 24.2843 31 16C31 7.71573 24.2843 1 16 1C7.71573 1 1 7.71573 1 16C1 24.2843 7.71573 31 16 31Z" stroke="#878787" stroke-width="0.885078"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.2604 13.0312C11.2604 12.875 11.1996 12.7361 11.0781 12.6146L9.90625 11.2083V11H13.5781L16.3906 17.1979L18.8646 11H22.3541V11.2083L21.3385 12.1719C21.2517 12.2413 21.217 12.3368 21.2343 12.4583V19.5416C21.217 19.6632 21.2517 19.7587 21.3385 19.8281L22.3281 20.7916V21H17.3802V20.7916L18.3958 19.8021C18.4479 19.75 18.4783 19.7109 18.487 19.6849C18.4956 19.6588 18.5 19.6024 18.5 19.5156V13.7865L15.6875 20.9739H15.2969L11.9896 13.7865V18.6041C11.9722 18.8125 12.033 18.9948 12.1719 19.151L13.5 20.7656V20.9739H9.75V20.7656L11.0781 19.151C11.2344 18.9948 11.2951 18.8125 11.2604 18.6041V13.0312Z" fill="#505050"/>
</svg>
</div>
<div class="footer-bottom small-only">
<a href="">Terms of Service</a>
<p>© 2018 Hopper Inc</p>
</div>
</div>
<div class="footer-right">
<div class="quick-links flex">
<div class="footer-menu large-only">
<div class="menu-head">
<h2>Hopper</h2>
<i class="fas fa-plus"></i>
<i class="fas fa-window-close"></i>
</div>
<ul>
<li><a href="">The app</a></li>
<li><a href="">Features</a></li>
<li><a href="">Deals</a></li>
<li><a href="">Privacy policy</a></li>
<li><a href="./termsofservice.html">Terms of service</a></li>
</ul>
</div>
<div class="footer-menu">
<div class="menu-head flex">
<h2>Company</h2>
<div class="open-close">
<i class="fas fa-plus"></i>
<i class="fas fa-window-close"></i>
</div>
</div>
<ul>
<li><a href="">About</a></li>
<li><a href="">The data</a></li>
<li><a href="">Investors</a></li>
<li><a href="">Locations</a></li>
<li><a href="">Departments</a></li>
</ul>
</div>
<div class="footer-menu">
<div class="menu-head flex">
<h2>People</h2>
<div class="open-close">
<i class="fas fa-plus"></i>
<i class="fas fa-window-close"></i>
</div>
</div>
<ul>
<li><a href="">Mission</a></li>
<li><a href="">Lifestyle</a></li>
<li><a href="">Values</a></li>
<li><a href="">Humans</a></li>
<li><a href="./careerList.html">Careers</a></li>
</ul>
</div>
<div class="footer-menu">
<div class="menu-head flex">
<div class="flex">
<h2>Support</h2>
<img class="large-only" src="./icons/Vector.svg" alt="">
</div>
<div class="open-close">
<i class="fas fa-plus"></i>
<i class="fas fa-window-close"></i>
</div>
</div>
<ul>
<li><a href="">Flights</a></li>
<li><a href="">Hotels</a></li>
<li><a href="">Predictions</a></li>
<li><a href="">Accounts</a></li>
<li><a href="">Contact us</a></li>
</ul>
</div>
<div class="footer-menu large-only">
<div class="menu-head flex">
<div class="flex">
<h2>Media</h2>
<img class="large-only" src="./icons/Vector.svg" alt="">
</div>
<div class="open-close">
<i class="fas fa-plus"></i>
<i class="fas fa-window-close"></i>
</div>
</div>
<ul>
<li><a href="./index.html">Home</a></li>
<li><a href="">Press kit</a></li>
<li><a href="">Research</a></li>
<li><a href="">Contact</a></li>
<li><a href="">Search</a></li>
</ul>
</div>
<div class="footer-menu small-only">
<div class="menu-head flex">
<h2>Insights</h2>
<div class="open-close">
<i class="fas fa-plus"></i>
<i class="fas fa-window-close"></i>
</div>
</div>
<ul>
<li><a href="./index.html">Home</a></li>
<li><a href="">Press kit</a></li>
<li><a href="">Research</a></li>
<li><a href="">Contact</a></li>
<li><a href="">Search</a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="./slick/slick.js"></script>
<script src="./js/people.js"></script>
</body>
</html>