-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
571 lines (528 loc) · 29.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
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
<!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="shortcut icon" href="img/intro/R.svg" type="image/svg">
<link rel="stylesheet" href="css/style.css" />
<title>Relvise Tim-dev Edu Project</title>
</head>
<body>
<div class="wrapper">
<!-- Header -->
<header class="header" id="header">
<div class="header__container _container">
<div class="header__logo">
<a class="header__link" href="#">Relvise</a>
</div>
<nav class="header__menu menu">
<ul class="menu__list">
<li class="menu__item">
<a href="#" class="menu__link">Home</a>
</li>
<li class="menu__item">
<a href="#" class="menu__link">Product</a>
</li>
<li class="menu__item">
<a href="#" class="menu__link">Pricing</a>
</li>
<li class="menu__item">
<a href="#" class="menu__link">Contact</a>
</li>
</ul>
</nav>
<div class="header__burger-button burger-button" id="burger-button">
<span class="burger-button__span"></span>
<span class="burger-button__span"></span>
<span class="burger-button__span"></span>
</div>
</div>
</header>
<!-- Popup menu -->
<div class="popup" id="popup">
<nav class="popup__menu popup-menu">
<ul class="popup-menu__list">
<li class="popup-menu__item">
<a href="#" class="popup-menu__link">Home</a>
</li>
<li class="popup-menu__item">
<a href="#" class="popup-menu__link">Product</a>
</li>
<li class="popup-menu__item">
<a href="#" class="popup-menu__link">Pricing</a>
</li>
<li class="popup-menu__item">
<a href="#" class="popup-menu__link">Contact</a>
</li>
</ul>
</nav>
</div>
<main class="main">
<!-- Intro section -->
<section class="main__intro intro">
<div class="intro__container _container">
<div class="intro__body">
<h1 class="intro__title">Finance and Consultancy Solution</h1>
<p class="intro__sub-title">
We know how large objects will act,<br />but things on a small
scale.
</p>
<div class="intro__buttons">
<button class="intro__button">Get Quote Now</button>
<button class="intro__button intro__button_transparent">
Learn More
</button>
</div>
</div>
</div>
<div class="intro__background _ibg">
<img class="intro__img-background" src="img/intro/intro-background.jpg"
srcset="img/intro/[email protected] 2x" alt="error" />
</div>
</section>
<!-- Services -->
<section class="services">
<div class="services__container _container">
<div class="services__services-card services-card">
<div class="services-card__wrapper">
<svg class="services-card__ico"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="#0D5C63">
<path
d="M42.5886 8.52554H37.519V3.45592c0-.89637-.3561-1.75602-.9899-2.38984-.6338-.633829-1.4935-.9899081-2.3898-.9899081H13.8608c-.8964 0-1.756.3560791-2.3899.9899081-.6338.63382-.9899 1.49347-.9899 2.38984v5.06962H5.41142c-1.34455 0-2.63403.53412-3.58477 1.48486-.950734.9507-1.484853 2.2402-1.484853 3.5848v23.6582c0 .8963.356079 1.756.989903 2.3898.63383.6339 1.49348.9899 2.38984.9899H44.2785c.8964 0 1.756-.356 2.3898-.9899.6339-.6338.99-1.4935.99-2.3898V13.5952c0-1.3446-.5342-2.6341-1.4849-3.5848-.9507-.95074-2.2402-1.48486-3.5848-1.48486ZM13.8608 3.45592h20.2785v5.06962H13.8608V3.45592ZM44.2785 37.2534H3.72154V22.0445H17.2405v8.4494h13.519v-8.4494h13.519v15.2089ZM20.6203 22.0445h6.7595v5.0696h-6.7595v-5.0696ZM3.72154 18.6648v-5.0696c0-.4482.17804-.878.49496-1.195.31691-.3169.74673-.4949 1.19492-.4949H42.5886c.4482 0 .878.178 1.195.4949.3169.317.4949.7468.4949 1.195v5.0696H3.72154Z" />
</svg>
<h3 class="services-card__title">Environmental Consulting</h3>
<p class="services-card__sub-title">
We focus on ergonomics and meeting you where you work.
</p>
</div>
</div>
<div class="services__services-card services-card">
<div class="services-card__wrapper">
<svg class="services-card__ico"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" fill="#0D5C63">
<path
d="M43.6503 13.75H4.35031c-.018 0-.03.0119-.03.0296v5.4053c0 3.5442 2.94 6.4188 6.55799 6.4188 2.442 0 4.572-1.3039 5.706-3.242.174-.3023.504-.4919.858-.4919s.678.1896.858.4919c1.128 1.9381 3.258 3.242 5.7 3.242 2.448 0 4.584-1.3099 5.706-3.2539.174-.2963.492-.48.834-.48h.036c.348 0 .66.1837.834.48 1.128 1.944 3.264 3.2539 5.712 3.2539 3.618 0 6.558-2.8746 6.558-6.4188v-5.4053c0-.0177-.012-.0296-.03-.0296Z"
opacity=".15" />
<path
d="M46.2 9.48885V1.89659C46.2.847537 45.342 0 44.28 0H3.72003C2.65804 0 1.80004.847537 1.80004 1.89659v7.59226C.798037 9.54812.00003718 10.372.00003718 11.3795v7.8056C-.00380525 20.6197.290253 22.0398.864037 23.3576c.258003.6046.576003 1.1735.936003 1.7129V45.518c0 1.0432.858 1.8966 1.91999 1.8966H44.28c1.062 0 1.92-.8475 1.92-1.8966V25.0705c.3657-.5407.679-1.1142.936-1.7129.57-1.3216.864-2.7263.864-4.1725v-7.8056c0-1.0075-.798-1.83138-1.8-1.89065ZM6.12003 4.26732H41.88v5.21561H6.12003V4.26732ZM27.84 43.1532h-7.68v-6.1698h7.68v6.1698Zm14.064 0H31.68v-8.0664c0-1.049-.858-1.8966-1.92-1.8966H18.24c-1.062 0-1.92.8476-1.92 1.8966v8.0664H6.12003V28.7985c.174.0829.354.1659.54.237 1.338.5572 2.76.8357 4.22397.8357 1.464 0 2.88-.2785 4.224-.8357.828-.3437 1.608-.7823 2.322-1.3098.012-.0059.024-.0059.036 0 .7162.5297 1.4962.9697 2.322 1.3098 1.338.5572 2.76.8357 4.224.8357 1.464 0 2.88-.2785 4.224-.8357.828-.3437 1.608-.7823 2.322-1.3098.012-.0059.024-.0059.036 0 .7162.5297 1.4962.9697 2.322 1.3098 1.338.5572 2.76.8357 4.224.8357 1.464 0 2.88-.2785 4.224-.8357.18-.077.36-.1541.54-.237v14.3547Zm1.776-23.9681c0 3.5443-2.94 6.4188-6.558 6.4188-2.448 0-4.584-1.3098-5.712-3.2538-.174-.2964-.486-.4801-.834-.4801h-.036c-.342 0-.66.1837-.834.4801-.5756.9916-1.4068 1.8151-2.409 2.3866-1.0022.5715-2.1398.8707-3.297.8672-2.442 0-4.572-1.3039-5.7-3.242-.18-.3022-.504-.4919-.858-.4919s-.684.1897-.858.4919c-.579.9879-1.4112 1.8076-2.4129 2.3768-1.0017.5691-2.1375.8675-3.2931.8652-3.61797 0-6.55797-2.8745-6.55797-6.4188v-5.4052c0-.0178.012-.0297.03-.0297H43.65c.018 0 .03.0119.03.0297v5.4052Z" />
<defs>
<clipPath id="a">
<path fill="#fff" d="M0 0h48v47.4146H0z" />
</clipPath>
</defs>
</svg>
<h3 class="services-card__title">Finance and consultancy</h3>
<p class="services-card__sub-title">
Just type what's on your mind, and we'll get you there.
</p>
</div>
</div>
<div class="services__services-card services-card">
<div class="services-card__wrapper">
<svg class="services-card__ico"
xmlns="http://www.w3.org/2000/svg" fill="#0D5C63" viewBox="0 0 48 48">
<path
d="M29.1416 13.624h11.9979v3.4453H29.1416V13.624Zm0 8.6133h11.9979v3.4453H29.1416v-3.4453Zm0 8.6133h11.9979v3.4453H29.1416v-3.4453Z" />
<path
d="M44.5674 5.01123H3.43187c-.90888.00091-1.78026.36419-2.42294 1.01012C.366264 6.66727.00481376 7.54307.00390625 8.45655V39.4644c.00090751.9135.36235775 1.7893 1.00502375 2.4352.64268.6459 1.51406 1.0092 2.42294 1.0101H44.5674c.9087-.0013 1.7798-.3648 2.4224-1.0106.6426-.6458 1.0042-1.5214 1.0055-2.4347V8.45655c-.0009-.91348-.3623-1.78928-1.005-2.4352-.6426-.64593-1.514-1.00921-2.4229-1.01012ZM3.43187 8.45655H22.2856V39.4644H3.43187V8.45655ZM25.7136 39.4644V8.45655h18.8538l.0034 31.00785H25.7136Z" />
<defs>
<clipPath id="a">
<path d="M0 5h48v37.92H0z" />
</clipPath>
</defs>
</svg>
<h3 class="services-card__title">
Financial Services Consulting
</h3>
<p class="services-card__sub-title">
the quick fox jumps over the lazy dog
</p>
</div>
</div>
</div>
</section>
<!-- Experience -->
<section class="experience">
<div class="experience__container _container">
<div class="experience__short-table experience-short-table">
<h2 class="experience-short-table__title _standard-h2">
Designing Better Experience
</h2>
<p class="experience-short-table__sub-title _standard-subTitle">
Problems trying to resolve the conflict between the two major
realms of Classical physics: Newtonian mechanics
</p>
</div>
<div class="experience__cards-wrapper">
<div class="experience__experience-card experience-card">
<svg class="experience-card__ico"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="-2 -5 55 55"
fill="#0D5C63">
<path fill="#0D5C63"
d="M24.8406 22.8025c4.3042 0 7.6519-3.4954 7.6519-7.7852 0-4.2897-3.5071-7.62619-7.8113-7.62619s-7.6519 3.49539-7.6519 7.62619c0 4.2898 3.5071 7.7852 7.8113 7.7852Zm-.1594-12.2338c.1594 0 .1594 0 0 0 2.5506 0 4.623 2.0655 4.623 4.6075 0 2.5421-2.0724 4.4487-4.623 4.4487s-4.4636-2.0655-4.4636-4.4487c0-2.542 2.0724-4.6075 4.4636-4.6075Zm23.7523 11.28c-3.0289-2.701-7.0142-4.1309-11.159-3.972h-1.2753c-.3188 1.271-.7971 2.3832-1.4347 3.3365.9564-.1589 1.7535-.1589 2.71-.1589 3.0289-.1589 6.0578.7944 8.449 2.5421v11.4393h3.1883V22.3253l-.4783-.4766ZM33.6088 7.70826c.797-1.90656 3.0288-2.85984 5.1012-2.06544 1.913.7944 2.8695 3.01872 2.0724 5.08418-.6376 1.4299-2.0724 2.3832-3.5071 2.3832-.3188 0-.7971 0-1.1159-.1589.1594.7944.1594 1.5888.1594 2.2243v.9533c.3188 0 .6377.1589.9565.1589 3.9854 0 7.1737-3.1776 7.1737-6.99074 0-3.972-3.1883-7.1496-7.0143-7.1496-2.5506 0-4.7824 1.27104-6.0577 3.49536.797.47664 1.5941 1.11216 2.2318 2.06544ZM15.4352 21.3724c-.6377-.9533-1.1159-2.0655-1.4347-3.3365h-1.2753c-4.14483-.1589-8.13019 1.271-11.15907 3.8131l-.47824.4767v12.7104h3.18829V23.5967c2.55063-1.7477 5.4201-2.701 8.44902-2.5421.9564 0 1.9129.1589 2.71.3178Zm-2.7106-5.2429c.3189 0 .6377 0 .9565-.1589v-.9532c0-.7944 0-1.5888.1594-2.2244-.3188.1589-.797.1589-1.1159.1589-2.0724 0-3.82591-1.7477-3.82591-3.8131 0-2.06544 1.75351-3.81312 3.82591-3.81312 1.5942 0 3.0289.95328 3.6666 2.3832.6376-.7944 1.5941-1.5888 2.3912-2.22432-2.0724-3.33647-6.3766-4.44863-9.7243-2.3832C5.7104 5.1668 4.59449 9.45656 6.66688 12.793c1.27532 2.0655 3.50712 3.3365 6.05772 3.3365Zm25.1882 15.2522-.3188-.4766c-3.1883-3.4954-7.6519-5.5608-12.4344-5.4019-4.7824-.1589-9.4054 1.9065-12.5937 5.4019l-.3188.4766v12.0749c0 1.4299 1.1159 2.701 2.71 2.701h20.4051c1.4347 0 2.71-1.2711 2.71-2.701V31.3817h-.1594ZM34.7245 42.98H15.4354V32.4939c2.5506-2.5421 6.0577-3.8131 9.7242-3.8131 3.5072-.1589 7.0143 1.271 9.5649 3.8131V42.98Z" />
<defs>
<clipPath id="a">
<path fill="#fff" d="M.5 0h48v48H.5z" />
</clipPath>
<clipPath id="b">
<path fill="#fff" d="M1 2h48v44.2105H1z" />
</clipPath>
</defs>
</svg>
<h3 class="experience-card__title">972 +</h3>
<p class="experience-card__sub-title">Consumer Products</p>
</div>
<div class="experience__experience-card experience-card">
<svg class="experience-card__ico"
xmlns="http://www.w3.org/2000/svg" fill="#0D5C63" viewBox="-5 -5 60 57">
<path
d="M43.6506 22.2819c-.5755.0042-1.1456.114-1.6828.3242l-5.7403-4.7847c.1412-.5216.2417-1.0627.2417-1.6331 0-3.3783-2.6666-6.0936-5.9844-6.0936s-5.9845 2.7153-5.9845 6.0936c0 .9653.2394 1.8647.6272 2.6739l-6.9635 8.3799c-.2788-.0531-.5615-.0816-.845-.0853-.4285 0-.8331.0732-1.2256.1804L9.9581 21.09c.1077-.3973.1795-.8092.1795-1.2455 0-2.7007-2.13522-4.8749-4.78754-4.8749-2.65231 0-4.78756 2.1742-4.78756 4.8749 0 2.7007 2.13525 4.8749 4.78756 4.8749.42849 0 .83304-.0731 1.22562-.1804l6.13522 6.2472c-.115.4049-.1754.824-.1795 1.2455 0 2.7007 2.1353 4.8749 4.7876 4.8749 2.6523 0 4.7875-2.1742 4.7875-4.8749 0-.5777-.1149-1.1212-.2944-1.6355l6.9731-8.3897c.5434.1609 1.1059.2754 1.6996.2754.9447-.0053 1.8745-.2401 2.7121-.6849l5.7427 4.7847c-.045.256-.0706.5151-.0766.7751 0 2.7007 2.1353 4.8749 4.7876 4.8749 2.6523 0 4.7875-2.1742 4.7875-4.8749 0-2.7007-2.1352-4.8749-4.7875-4.8749Z" />
<defs>
<clipPath id="a">
<path fill="#fff" d="M.5 10h48v27.0968H.5z" />
</clipPath>
</defs>
</svg>
<h3 class="experience-card__title">181 +</h3>
<p class="experience-card__sub-title">Financial Services</p>
</div>
<div class="experience__experience-card experience-card">
<svg class="experience-card__ico"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 -6 50 60">
<path fill="#0D5C63"
d="M16.0637 33.9949c-.811-.8147-.3882-.585-2.3445-1.111-.8876-.239-1.6679-.6984-2.3735-1.2487L7.11121 42.0639c-.40974 1.0097.3556 2.1066 1.44013 2.0653l4.91776-.1884 3.3824 3.5888c.7466.7912 2.057.5446 2.4668-.465l4.858-11.9644c-1.0118.5662-2.1346.8981-3.2956.8981-1.82 0-3.5299-.7116-4.817-2.0034Zm26.6635 8.069-4.2345-10.4287c-.7056.5512-1.4859 1.0097-2.3735 1.2487-1.9665.5288-1.5353.2982-2.3445 1.111-1.2871 1.2918-2.9979 2.0034-4.8179 2.0034-1.1611 0-2.2839-.3328-3.2956-.8981l4.858 11.9644c.4097 1.0096 1.7211 1.2562 2.4668.465l3.3833-3.5888 4.9178.1884c1.0845.0413 1.8498-1.0565 1.4401-2.0653ZM31.5459 31.8733c1.4261-1.4578 1.5894-1.3322 3.6204-1.8881 1.2964-.3553 2.31-1.3913 2.6572-2.7169.6981-2.6625.517-2.3409 2.422-4.2891.9492-.9703 1.3197-2.385.9725-3.7106-.6972-2.6606-.6981-2.2894 0-4.9528.3472-1.3256-.0233-2.7403-.9725-3.7106-1.905-1.94814-1.7239-1.62751-2.422-4.28907-.3472-1.32563-1.3608-2.36157-2.6572-2.71688-2.6022-.71344-2.2886-.52687-4.1954-2.47594-.9492-.970308-2.3333-1.349995-3.6297-.994683-2.6012.7125-2.2381.713437-4.844 0-1.2964-.355312-2.6805.023438-3.6297.994683-1.905 1.94813-1.5914 1.7625-4.1944 2.47594-1.2964.35531-2.31 1.39125-2.6572 2.71688-.6972 2.66156-.5171 2.34093-2.42203 4.28907-.9492.9703-1.32066 2.385-.97253 3.7106.6972 2.6588.69813 2.2875 0 4.9519-.3472 1.3256.02333 2.7403.97253 3.7115 1.90493 1.9482 1.72383 1.6266 2.42203 4.2891.3472 1.3256 1.3608 2.3616 2.6572 2.7169 2.0888.5719 2.2446.4819 3.6194 1.8881 1.2348 1.2628 3.1584 1.4888 4.6424.5456.5935-.3784 1.2819-.5793 1.9848-.5793.7029 0 1.3913.2009 1.9847.5793 1.4831.9432 3.4067.7172 4.6415-.5456ZM16.1141 16.4946c0-4.9716 3.9424-9.00191 8.8051-9.00191 4.8627 0 8.8051 4.03031 8.8051 9.00191 0 4.9715-3.9424 9.0018-8.8051 9.0018-4.8627 0-8.8051-4.0303-8.8051-9.0018Z" />
<defs>
<clipPath id="a">
<path fill="#fff" d="M7 0h35.84v48H7z" />
</clipPath>
</defs>
</svg>
<h3 class="experience-card__title">98%</h3>
<p class="experience-card__sub-title">Environmental</p>
</div>
<div class="experience__experience-card experience-card">
<svg class="experience-card__ico"
xmlns="http://www.w3.org/2000/svg" viewBox="-5 -10 60 60"
fill="#0D5C63">
<path
d="M42.5886 8.52554H37.519V3.45592c0-.89637-.3561-1.75602-.9899-2.38984-.6338-.633829-1.4935-.9899081-2.3898-.9899081H13.8608c-.8964 0-1.756.3560791-2.3899.9899081-.6338.63382-.9899 1.49347-.9899 2.38984v5.06962H5.41142c-1.34455 0-2.63403.53412-3.58477 1.48486-.950734.9507-1.484853 2.2402-1.484853 3.5848v23.6582c0 .8963.356079 1.756.989903 2.3898.63383.6339 1.49348.9899 2.38984.9899H44.2785c.8964 0 1.756-.356 2.3898-.9899.6339-.6338.99-1.4935.99-2.3898V13.5952c0-1.3446-.5342-2.6341-1.4849-3.5848-.9507-.95074-2.2402-1.48486-3.5848-1.48486ZM13.8608 3.45592h20.2785v5.06962H13.8608V3.45592ZM44.2785 37.2534H3.72154V22.0445H17.2405v8.4494h13.519v-8.4494h13.519v15.2089ZM20.6203 22.0445h6.7595v5.0696h-6.7595v-5.0696ZM3.72154 18.6648v-5.0696c0-.4482.17804-.878.49496-1.195.31691-.3169.74673-.4949 1.19492-.4949H42.5886c.4482 0 .878.178 1.195.4949.3169.317.4949.7468.4949 1.195v5.0696H3.72154Z" />
</svg>
<h3 class="experience-card__title">746 +</h3>
<p class="experience-card__sub-title">Business & Finance</p>
</div>
</div>
</div>
</section>
<!-- Advices -->
<section class="advices">
<div class="advices__container _container">
<div class="advices__short-table-wrapper">
<h3 class="advices__title _standard-h2">
Practice Advice
</h3>
<p class="advices__sub-title _standard-subTitle">
Problems trying to resolve the conflict between the two major realms of Classical physics: Newtonian mechanics
</p>
</div>
<div class="advices__cards-wrapper advices-cards">
<div class="advices-cards__card">
<div class="advices-cards__info-wrapper">
<div class="advices-cards__title">
A single source of truth
</div>
<div class="advices-cards__sub-title">
Newton thought that light was made up of particles, but then it was discovered
</div>
</div>
<div class="advices-cards__ico">
<img src="img/advices-section/advices-card__ico-1.jpg" srcset="img/advices-section/[email protected] 2x" alt="#9aa48d">
</div>
</div>
<div class="advices-cards__card">
<div class="advices-cards__info-wrapper">
<div class="advices-cards__title">
Fastest way to organize
</div>
<div class="advices-cards__sub-title">
“Quantum mechanics” is the description of the behaviour of matter
</div>
</div>
<div class="advices-cards__ico">
<img src="img/advices-section/advices-card__ico-2.jpg" srcset="img/advices-section/[email protected] 2x" alt="#9aa48d">
</div>
</div>
<div class="advices-cards__card">
<div class="advices-cards__info-wrapper">
<div class="advices-cards__title">
Fastest way to take action
</div>
<div class="advices-cards__sub-title">
They describe a universe consisting of bodies moving
</div>
</div>
<div class="advices-cards__ico">
<img src="img/advices-section/advices-card__ico-3.jpg" srcset="img/advices-section/[email protected] 2x" alt="#9aa48d">
</div>
</div>
<div class="advices-cards__card">
<div class="advices-cards__info-wrapper">
<div class="advices-cards__title">
Work better together
</div>
<div class="advices-cards__sub-title">
They finally obtained a consistent description of the behaviour
</div>
</div>
<div class="advices-cards__ico">
<img src="img/advices-section/advices-card__ico-4.jpg" srcset="img/advices-section/[email protected] 2x" alt="">
</div>
</div>
</div>
</div>
</section>
<!-- VideoInfo -->
<section class="videoInfo">
<div class="videoInfo__container _container">
<div class="videoInfo__short-table-wrapper">
<h2 class="videoInfo__title _standard-h2">
Who We Are
</h2>
<div class="videoInfo__sub-title">
Problems trying to resolve the conflict between the two major realms of Classical physics: Newtonian mechanics
</div>
</div>
<div class="videoInfo__wrapper videoInfo-wrapper">
<div class="videoInfo-wrapper__video">
<iframe width="560" height="315" src="https://www.youtube.com/embed/WZSNmlfPP84?controls=0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
<div class="videoInfo-wrapper__info">
<h2 class="videoInfo-wrapper__title _standard-h2">
Most trusted in our field
</h2>
<p class="videoInfo-wrapper__sub-title _standard-subTitle">
Most calendars are designed for teams. Slate is designed for freelancers who want a simple way to plan their schedule.
</p>
<div class="videoInfo-wrapper__item videoInfo-wrapper-item">
<h2 class="videoInfo-wrapper-item__title">
The quick fox jumps over the lazy dog
</h2>
<p class="videoInfo-wrapper--item__sub-title">
Things on a very small scale ...
</p>
</div>
<div class="videoInfo-wrapper__item videoInfo-wrapper-item">
<h2 class="videoInfo-wrapper-item__title">
The quick fox jumps over the lazy dog
</h2>
<p class="videoInfo-wrapper--item__sub-title">
Things on a very small scale ...
</p>
</div>
</div>
</div>
</div>
</section>
<!-- Labels -->
<section class="labels">
<div class="labels__container _container">
<div class="labels__wrapper">
<object class="labels__ico" data="img/labels-section/ico-1.svg" type="image/svg+xml"></object>
<object class="labels__ico" data="img/labels-section/ico-2.svg" type="image/svg+xml"></object>
<object class="labels__ico" data="img/labels-section/ico-3.svg" type="image/svg+xml"></object>
<object class="labels__ico" data="img/labels-section/ico-4.svg" type="image/svg+xml"></object>
<object class="labels__ico" data="img/labels-section/ico-5.svg" type="image/svg+xml"></object>
<object class="labels__ico" data="img/labels-section/ico-6.svg" type="image/svg+xml"></object>
</div>
</div>
</section>
<!-- Subscribe -->
<section class="subscribe">
<div class="subscribe__container _container">
<div class="subscribe__item subscribe-item">
<div class="subscribe-item__wrapper">
<div class="subscribe-item__title">
Subscribe For Latest Newsletter
</div>
<form class="subscribe-item__form" action="" method="get">
<div class="subscribe-item__form-wrapper">
<input type="email" name="email" size="30" placeholder="Your Email">
<button type="button">Subscribe</button>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- Support -->
<section class="support">
<div class="support__container _container">
<div class="support__short-table-wrapper">
<h2 class="support__title _standard-h2">
Get In Touch
</h2>
<p class="support__sub-title _standard-subTitle">
Problems trying to resolve the conflict between <br> the two major realms of Classical physics: Newtonian mechanics
</p>
</div>
<div class="support__cards-wrapper">
<div class="support__support-card support-card"
id="supportCard1">
<div class="support-card__wrapper">
<svg class="support-card__ico"
xmlns="http://www.w3.org/2000/svg"
fill="#0D5C63"
viewBox="0 0 72 72">
<path d="M55.929 38.9947c-.3515-.3521-.769-.6315-1.2286-.8221-.4596-.1906-.9522-.2887-1.4498-.2887-.4975 0-.9902.0981-1.4498.2887-.4595.1906-.877.47-1.2286.8221l-6.0387 6.0387c-2.7996-.8335-8.0238-2.7277-11.3348-6.0387-3.3111-3.3111-5.2053-8.5353-6.0387-11.3349l6.0387-6.0387c.3521-.3515.6314-.769.822-1.2286.1906-.4596.2887-.9522.2887-1.4498 0-.4975-.0981-.9902-.2887-1.4498s-.4699-.877-.822-1.2286L18.0451 1.11076c-.3515-.352114-.769-.631462-1.2286-.822059C16.3569.0981045 15.8642 0 15.3667 0c-.4975 0-.9902.0981045-1.4498.288701-.4596.190597-.8771.469945-1.2286.822059L2.41418 11.3849C.97459 12.8245.163873 14.802.19418 16.8212c.087133 5.3947 1.51536 24.1321 16.28252 38.8992C31.2439 70.4876 49.9813 71.912 55.3797 72.003h.1061c2.0003 0 3.8907-.788 5.3227-2.22l10.2741-10.2742c.3521-.3515.6315-.769.8221-1.2286.1906-.4595.2887-.9522.2887-1.4498 0-.4975-.0981-.9902-.2887-1.4497-.1906-.4596-.47-.8771-.8221-1.2286L55.929 38.9947Zm-.4811 25.4277c-4.7279-.0796-20.9044-1.3487-33.6144-14.0625C9.08175 37.6081 7.84674 21.3749 7.77097 16.7417l7.59573-7.59576 9.7968 9.79676-4.8984 4.8984c-.4453.445-.7727.9939-.9526 1.5971-.1799.6032-.2067 1.2418-.0779 1.8579.091.4357 2.3148 10.7666 8.6035 17.0554 6.2887 6.2887 16.6197 8.5125 17.0553 8.6034.6158.1325 1.255.1078 1.8588-.0716.6038-.1794 1.1527-.5078 1.5963-.955l4.9021-4.8984 9.7968 9.7968-7.5995 7.5957Z"/>
</svg>
<div class="support-card__info">
<p>[email protected]</p>
<p>[email protected]</p>
</div>
<h3 class="support-card__title">
Get Support
</h3>
<button class="support-card__button">
Submit Request
</button>
</div>
</div>
<div class="support__support-card support-card support-card_center" id="supportCardCenter">
<div class="support-card__wrapper">
<svg class="support-card__ico"
xmlns="http://www.w3.org/2000/svg" fill="#0D5C63" viewBox="0 0 57 71">
<path fill-rule="evenodd" d="M28.5 71c-.7409 0-1.4633-.2307-2.0662-.6597C25.3508 69.577-.102998 51.2624.00031362 28.3825.00031362 12.7411 12.786 0 28.5 0s28.4997 12.7411 28.4997 28.4002c.1033 22.8622-25.3505 41.1768-26.4335 41.9401-.6029.429-1.3253.6597-2.0662.6597Zm21.3748-42.582c0-11.7648-9.5866-21.31794-21.3748-21.31794S7.12524 16.6532 7.12524 28.4002C7.05042 44.1659 22.7609 58.3163 28.5 62.9598c5.7427-4.6399 21.4496-18.7868 21.3748-34.5418ZM43 28c0 7.721-6.5033 14-14.5 14S14 35.721 14 28s6.5033-14 14.5-14S43 20.279 43 28Zm-7.25 0c0-3.8605-3.2516-7-7.25-7s-7.25 3.1395-7.25 7 3.2516 7 7.25 7 7.25-3.1395 7.25-7Z" clip-rule="evenodd"/>
</svg>
<div class="support-card__info">
<p>[email protected]</p>
<p>[email protected]</p>
</div>
<h3 class="support-card__title">
Get Support
</h3>
<button class="support-card__button">
Submit Request
</button>
</div>
</div>
<div class="support__support-card support-card"
id="supportCard3">
<div class="support-card__wrapper">
<svg class="support-card__ico"
xmlns="http://www.w3.org/2000/svg" fill="#0D5C63" viewBox="0 0 70 71">
<path d="M68.3484 1.16199c-.3892-.402961-.881-.681955-1.4176-.804181-.5365-.122225-1.0954-.082601-1.611.114215L1.8615 24.4708c-.54728.2159-1.01845.5998-1.35094 1.1008C.178071 26.0726 0 26.6669 0 27.2756c0 .6088.178071 1.2031.51056 1.7041.33249.501.80366.8849 1.35094 1.1008l27.6909 11.5194 11.0763 28.7985c.2081.5442.5648 1.0131 1.0262 1.3489.4613.3359 1.007.5239 1.5699.541.5829-.0124 1.1485-.2083 1.6222-.5617.4737-.3534.8334-.8479 1.0315-1.4182L68.9542 4.31183c.1965-.53075.2439-1.10866.1367-1.66635-.1073-.55769-.3648-1.07218-.7425-1.48349ZM43.2248 60.8889 35.1771 39.89l13.8166-14.3693-4.0671-4.2297-13.932 14.4892-20.0759-8.4896L61.4834 8.30162 43.2248 60.8889Z"/>
</svg>
<div class="support-card__info">
<p>[email protected]</p>
<p>[email protected]</p>
</div>
<h3 class="support-card__title">
Get Support
</h3>
<button class="support-card__button">
Submit Request
</button>
</div>
</div>
</div>
</div>
</section>
<!-- Contact -->
<section class="contact">
<div class="contact__container _container">
<div class="contact__wrapper">
<div class="contact__info">
<h3 class="contact__title">
Consulting Agency For Your Business
</h3>
<div class="contact__sub-title">
the quick fox jumps over the lazy dog
</div>
</div>
<button class="contact__button">
Contact Us
</button>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="footer__container _container">
<div class="footer__wrapper">
<div class="footer__column footer-column">
<h3 class="footer-column__title">
Company Info
</h3>
<ul class="footer-column__list">
<li><a href="">About Us</a></li>
<li><a href="">Carrier</a></li>
<li><a href="">We are hiring</a></li>
<li><a href="">Blog</a></li>
</ul>
</div>
<div class="footer__column footer-column">
<h3 class="footer-column__title">
Legal
</h3>
<ul class="footer-column__list">
<li><a href="">About Us</a></li>
<li><a href="">Carrier</a></li>
<li><a href="">We are hiring</a></li>
<li><a href="">Blog</a></li>
</ul>
</div>
<div class="footer__column footer-column">
<h3 class="footer-column__title">
Features
</h3>
<ul class="footer-column__list">
<li><a href="">Business Marketing</a></li>
<li><a href="">User Analytic</a></li>
<li><a href="">Live Chat</a></li>
<li><a href="">Unlimited Support</a></li>
</ul>
</div>
<div class="footer__column footer-column">
<h3 class="footer-column__title">
Resources
</h3>
<ul class="footer-column__list">
<li><a href="">IOS & Android</a></li>
<li><a href="">Watch a Demo</a></li>
<li><a href="">Customers</a></li>
<li><a href="">API</a></li>
</ul>
</div>
<div class="footer__column footer-column footer-column_last">
<h3 class="footer-column__title">
Get In Touch
</h3>
<ul class="footer-column__list">
<li><a href="">(480) 555-0103</a></li>
<li><a href="">4517 Washington Ave.</a></li>
<li><a href="">[email protected]</a></li>
</ul>
</div>
</div>
</div>
</footer>
<!-- Love -->
<section class="love">
<div class="love__container _container">
<div class="love__wrapper">
<div class="love__title">
Coded with love ♥ by <a href="https://github.com/TimTheHedge/-Edu-Relvise">Tim-dev</a> for training purposes. Designed by <a href="https://www.captain-design.com/">Captain-design</a>
</div>
<div class="love__icons">
<a href="https://www.instagram.com/timfromkrim/" target="_blank"><img src="img/footer-section/inst.svg" alt=""></a>
<a href="https://github.com/TimTheHedge" target="_blank"><img src="img/footer-section/github.svg" alt=""></a>
</div>
</div>
</div>
</section>
</main>
</div>
<script src="js/header.js"></script>
<script src="js/support-section.js"></script>
</body>
</html>