-
Notifications
You must be signed in to change notification settings - Fork 5
Expand file tree
/
Copy pathcompany.html
More file actions
680 lines (651 loc) · 31.4 KB
/
Copy pathcompany.html
File metadata and controls
680 lines (651 loc) · 31.4 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
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title></title>
<link rel="stylesheet" href="style.css" />
<link
href="https://fonts.googleapis.com/css2?family=Raleway&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="https://unpkg.com/swiper/css/swiper.min.css" />
<link rel="stylesheet" type="text/css" href="./fontawesome/css/all.min.css">
<link rel="stylesheet" href="./css/company.css" />
</head>
<body>
<section class="top-section">
<div class="top-div">
<a href="./index.html"><img class="logo-img" src="./images/company/company-logo.png" /></a>
<div class="navigation">
<p class="nav"><a class="company anchors" href="#">COMPANY</a></p>
<p class="nav"><a class="people anchors" href="./people.html">PEOPLE </a></p>
<p class="nav">
<a class="anchors" href="#">SUPPORT</a>
<img class="arrow-img" src="./images/company/arrow.png" />
</p>
<p class="send-phone nav">
<a class="anchors" href="./cta-modal.html">Send app to your phone</a>
</p>
</div>
</div>
<div class="top-image-div">
<img src="./images/company/Company-Hero 2@3x.png" />
</div>
<div class="main-top-text-div">
<h2 class="main-top-text">The world is amazing.</h2>
<h2 class="main-top-text lower">We help you see more of it.</h2>
<div class="browse-div">
<a href="#">Browse Careers<span class="large-only">21</span></a>
</div>
</div>
</section>
<div class="grey-bg"></div>
<section class="top-2-section">
<div class="text-div">
<div>
<h3 class="bunny">Behind the bunny</h3>
<p class="hopper-text">
Hopper is made up of hundreds of smart, creative, and inspired
humans working to fundamentally change how the world books travel.
</p>
</div>
<div class="curved-bg">
<img src="./images/company/curved.png" />
</div>
</div>
<div class="images">
<div class="person">
<img class="person-img" src="./images/company/man-1.png" />
</div>
<div class="person">
<img class="person-img" src="./images/company/woman-1.png" />
</div>
<div class="ceo">
<img class="person-img" src="./images/company/ceo.png" />
</div>
<div class="person">
<img class="person-img" src="/images/company/woman-2.png" />
</div>
<div class="person last-person">
<img class="person-img" src="./images/company/man-2 (2).png" />
</div>
</div>
</section>
<div class="container">
<section class="line-div">
<p>1/5</p>
<div class="dark-line"></div>
<div class="light-line"></div>
<img class="left-arrow" src="./images/company/left-arrow.png" />
<img src="./images/company/right-arrow.png" />
</section>
<section class="top-middle">
<div class="top-middle-1">
<div class="top-middle-text">
<h2>We've got the numbers</h2>
<p class="top-mid-text">
Call us nerds, we don’t mind. At the heart of the Hopper app is a
prediction algorithm that processes trillions of data points,
allowing us to make precise and personalized travel
recommendations.
</p>
</div>
<div class="data-sketch">
<img
class="data-sketch-img"
src="./images/company/Website - Data Sketch - V01.jpg"
/>
</div>
</div>
<div class="numbers-div">
<div>
<h2 class="numbers-text">2,100,037</h2>
<p class="number-letters">APP INSTALLS</p>
</div>
<div>
<h2 class="numbers-text">360,002,999</h2>
<p class="number-letters">Dollars saved</p>
</div>
<div>
<h2 class="numbers-text">3,600,029,991</h2>
<p class="number-letters">notifications sent</p>
</div>
<div>
<h2 class="numbers-text">21,100,037</h2>
<p class="number-letters">planned trips</p>
</div>
</div>
<div class="graph-div">
<img src="./images/company/graph.png" />
</div>
</section>
<section class="lower-middle">
<div class="top-lower-middle">
<div class="low-mid-text">
<h2>We’re backed by some of the world’s leading investors</h2>
<p class="para">
Hopper has raised over $83M. Our investors believe in our product
and support our mobile-only mission to change the way the world
travels.
</p>
<a class="learn-more" href="#">Learn more</a>
</div>
<div class="carrot">
<img class="carrot-img" src="/images/company/carrot-use.png" />
</div>
</div>
<div class="icons">
<img class="icon" src="./images/company/Brightspark Ventures.png" />
<img class="icon" src="./images/company/OMERS Ventures.png" />
<img class="icon" src="./images/company/Accomplice.png" />
<img class="icon" src="./images/company/CDPQ.png" />
<img class="icon" src="./images/company/Investissement Québec.png" />
<img src="./images/company/BDC Capital.png" />
</div>
</section>
</div>
<section class="welcome-image">
<div class="bottom-section">
<p class="top-text">BOSTON</p>
<p class="top-text">MONTREAL</p>
<p class="white">NYC</p>
<p class="top-text">SOFIA</p>
</div>
<pre class="heading">
Welcome
to New York</pre
>
<pre class="main-text">
In Union Square surrounded by tons of
delicious restaurants and a gorgeous park,
you’ll never have a sad desk salad for lunch.
</pre>
<div class="bottom-div">
<p class="watch">Watch the short film</p>
<img class="play-img imag" src="/images/company/play-1.png" />
<p class="watch location">Location</p>
<img class="imag" src="./images/company/location-1.png" />
</div>
</section>
<div class="container">
<section class="line-div second-line-div">
<p>1/3</p>
<div class="light-line-1"></div>
<div class="dark-line-1"></div>
<div class="light-line-2"></div>
<img class="left-arrow" src="./images/company/left-arrow.png" />
<img src="./images/company/right-arrow.png" />
</section>
<section class="bottom-1-sect">
<h1 class="perks-heading">Perks and Benefits</h1>
<div class="perks-div">
<div class="stay-healthy">
<img src="./images/company/Stay healthy illo.jpg" />
<h3 class="benefit-text">Stay healthy</h3>
<p class="perks-text">
Full medical, dental, and vision benefits. Life insurance. Long
and short-term disability plans. All on us.
</p>
</div>
<div class="stay-healthy">
<img src="/images/company/Get paid illo.jpg" />
<h3 class="benefit-text">Get paid</h3>
<p class="perks-text">
Competitive salary. Company stock options. Commuter benefits.
401(k) retirement savings plan.
</p>
</div>
<div class="stay-healthy-1">
<img src="/images/company/Take off illo.jpg" />
<h3 class="benefit-text">Take off</h3>
<p class="perks-text">
Flexible work schedule and vacation plan. Emergency travel
assistance. Travel insurance. IATA card.
</p>
</div>
</div>
<div class="line-3"></div>
<div class="gains-div">
<div class="gains">
<img src="./images/company/food.png" />
<h4 class="gain-heading">We take food seriously</h4>
<p class="gain-text">
Catered lunches, Montreal bagels, kombucha on tap, craft beer,
endless snacks, espresso machine
</p>
</div>
<div class="gains">
<img src="./images/company/learn.png" />
<h4 class="gain-heading">Learn something new</h4>
<p class="gain-text">
At-work French classes, book clubs, board game nights, forensic
Fridays, lunchtime debates, table time
</p>
</div>
<div class="gains">
<img src="./images/company/learn.png" />
<h4 class="gain-heading">Be yourself</h4>
<p class="gain-text">
Casual work environment, loft-like workspaces, slack channels for
every interest group
</p>
</div>
</div>
</section>
<section>
<h1 class="different-heading">
We don’t want to do it like everybody else — there’s an edge in being
different
</h1>
<div class="card-div">
<div class="card border-right-card border-bottom-card special-card">
<img src="./images/company/Profile-01.png" />
<h5 class="card-heading special-card-heading">Creative and Design</h5>
<p class="card-text">Montreal, Boston</p>
<p class="card-text-small special-card-small">21 positions</p>
</div>
<div class="card border-right-card border-bottom-card">
<img src="./images/company/Profile-02.png" />
<h5 class="card-heading">Creative and Design</h5>
<p class="card-text">Montreal, Boston</p>
<p class="card-text-small">21 positions</p>
</div>
<div class="card border-right-card border-bottom-card">
<img src="./images/company/Profile-03.png" />
<h5 class="card-heading">Creative and Design</h5>
<p class="card-text">Montreal, Boston</p>
<p class="card-text-small">21 positions</p>
</div>
<div class="card border-bottom-card">
<img src="./images/company/Profile-04.png" />
<h5 class="card-heading">Creative and Design</h5>
<p class="card-text">Montreal, Boston</p>
<p class="card-text-small">21 positions</p>
</div>
<div class="card border-right-card">
<img src="./images/company/Profile-05.png" />
<h5 class="card-heading">Creative and Design</h5>
<p class="card-text">Montreal, Boston</p>
<p class="card-text-small">21 positions</p>
</div>
<div class="card border-right-card">
<img src="./images/company/Profile-06.png" />
<h5 class="card-heading">Creative and Design</h5>
<p class="card-text">Montreal, Boston</p>
<p class="card-text-small">21 positions</p>
</div>
<div class="card border-right-card">
<img src="images/company/Profile-07.png" />
<h5 class="card-heading">Creative and Design</h5>
<p class="card-text">Montreal, Boston</p>
<p class="card-text-small">21 positions</p>
</div>
<div class="card career-card">
<img src="./images/company/search-icon.png" />
<h5 class="card-heading">See all careers</h5>
<p class="card-text">Montreal, Boston, New York, Sofia</p>
<p class="card-text-small">21 positions</p>
</div>
</div>
</section>
</div>
<!-- copied footer-->
<!-- <div class="footer">
<div class="container">
<div class="footer-mobile">
<div class="logo title">
<img src="./icons/logo - Copy.svg" alt="" />
</div>
<div class="footer-mobile-options">
<div class="option-container">
<div class="hooper">
<div>
<p>Hooper</p>
<p class="notification"></p>
</div>
<p class="plus-btn">+</p>
</div>
<div class="hide">
<a href="#">The app</a>
<a href="#">Feature</a>
<a href="#">Deals</a>
<a href="#">Privacy policy</a>
<a href="#">Terms of service</a>
</div>
</div>
<div class="option-container">
<div class="company">
<div>
<p>Company</p>
<p class="notification"></p>
</div>
<p class="plus-btn">+</p>
</div>
<div class="hide">
<a href="#">About</a>
<a href="#">The data</a>
<a href="#">Investors</a>
<a href="#">Locations</a>
<a href="#">Departments</a>
</div>
</div>
<div class="option-container">
<div class="people">
<div>
<p>People</p>
<p class="notification"></p>
</div>
<p class="options plus-btn">+</p>
</div>
<div class="hide">
<a href="#">Mission</a>
<a href="#">Lifestyle</a>
<a href="#">Values</a>
<a href="#">Humans</a>
<a href="./careerList.html">Careers</a>
</div>
</div>
<div class="option-container">
<div class="support">
<div>
<p>Support</p>
<p class="notification"></p>
</div>
<p class="options plus-btn">+</p>
</div>
<div class="hide">
<a href="#">Flights</a>
<a href="#">Hotels</a>
<a href="#">Predictions</a>
<a href="#">Account</a>
<a href="#">Contact us</a>
</div>
</div>
<div class="option-container">
<div class="media">
<p>Media</p>
<p class="notification"></p>
<p class="options plus-btn">+</p>
</div>
<div class="hide">
<a href="#">Home</a>
<a href="#">Press kit</a>
<a href="#">Research</a>
<a href="#">Contact</a>
<a href="#">Search</a>
</div>
</div>
</div>
<div class="language">
<select name="language" id="language">
<option value="" placeholder>Language</option>
<option value="english">English</option>
<option value="french">French</option>
</select>
</div>
<div class="social">
<a href="#"><img src="./icons/Facebook (1).svg" alt="" /></a>
<a href="#"><img src="./icons/Twitter (1).svg" alt="" /></a>
<a href="#"><img src="./icons/Instagram (3).svg" alt="" /></a>
<a href="#"><img src="./icons/LinkedIn.svg" alt="" /></a>
<a href="#"><img src="./icons/Youtube.svg" alt="" /></a>
<a href="#"><img src="./icons/Medium (1).svg" alt="" /></a>
</div>
<hr />
<div class="footer-bottom">
<p>© 2018 Hopper Inc.</p>
</div>
</div>
<div class="footer-large">
<div class="footer-large-first">
<div class="logo left">
<img src="./icons/Vector1.svg" alt="" />
</div>
<div class="option-title right">
<div class="option"><h4 class="selected">Hooper</h4></div>
<div class="option"><h4>Company</h4></div>
<div class="option"><h4>People</h4></div>
<div class="option">
<h4>Support <img src="./icons/Vector.svg" alt="" /></h4>
</div>
<div class="option">
<h4>Media <img src="./icons/Vector.svg" alt="" /></h4>
</div>
</div>
<div class="footer-large-second">
<div class="language left">
<img src="./icons/web.svg" alt="" />
<select name="language" id="language">
<option value="english">English</option>
<option value="french">French</option>
</select>
</div>
<div class="options right">
<div class="hooper">
<a href="#">The app</a>
<a href="#">Feature</a>
<a href="#">Deals</a>
<a href="#">Privacy policy</a>
<a href="#">Terms of service</a>
</div>
<div class="company">
<a href="#">About</a>
<a href="#">The data</a>
<a href="#">Investors</a>
<a href="#">Locations</a>
<a href="#">Departments</a>
</div>
<div class="people">
<a href="#">Mission</a>
<a href="#">Lifestyle</a>
<a href="#">Values</a>
<a href="#">Humans</a>
<a href="./careerList.html">Careers</a>
</div>
<div class="support">
<a href="#">Flights</a>
<a href="#">Hotels</a>
<a href="#">Predictions</a>
<a href="#">Account</a>
<a href="#">Contact us</a>
</div>
<div class="media">
<a href="#">Home</a>
<a href="#">Press kit</a>
<a href="#">Research</a>
<a href="#">Contact</a>
<a href="#">Search</a>
</div>
</div>
</div>
<div class="footer-large-social">
<a href="#"
><img src="./icons/Facebook (2)n0border.svg" alt=""
/></a>
<a href="#"
><img src="./icons/Twitter (1)-n0border.svg" alt=""
/></a>
<a href="#"
><img src="./icons/Instagram (3)n0border.svg" alt=""
/></a>
<a href="#"><img src="./icons/LinkedInn0border.svg" alt="" /></a>
<a href="#"><img src="./icons/Youtuben0border.svg" alt="" /></a>
<a href="#"
><img src="./icons/Medium (1)n0border.svg" alt=""
/></a>
</div>
</div>
<hr />
</div>
</div>
</div> -->
<footer id="footer" class="">
<div class="flex wrapper">
<img class="small-only" src="./images/logo-grey.png">
</div>
<div class="line large-only flex">
<hr />
</div>
<div class="wrapper flex">
<!-- <img class="small-only" src="./images/logo.png"> -->
<div class="footer-left flex">
<img class="large-only" src="./images/logo-text.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://unpkg.com/swiper/js/swiper.min.js"></script>
<script src="./js/sectionv/swiper.js"></script>
<script src="./js/company.js"></script>
</body>
</html>