-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
467 lines (446 loc) · 53.8 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
<!DOCTYPE html>
<html class="page" lang="ru">
<head>
<meta charset="utf-8">
<title>«Девайс» интернет-магазин гаджетов c оригинальным дизайном</title>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400&display=swap" rel="stylesheet">
<link href="css/normalize.css" rel="stylesheet">
<link href="css/style.min.css" rel="stylesheet">
</head>
<body class="page-body">
<header class="main-header">
<nav class="main-navigation">
<a class="main-header-logo">
<span class="visually-hidden">Черный логотип «Девайс»</span>
<svg width="163" height="35" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M-.151.702v33.6h13.532a15.721 15.721 0 0011.72-4.824 16.459 16.459 0 004.712-11.976 16.457 16.457 0 00-4.712-11.976A15.724 15.724 0 0013.381.702H-.151zM7.582 26.91V8.091h5.8a8.646 8.646 0 016.5 2.568 9.408 9.408 0 012.489 6.84 9.406 9.406 0 01-2.489 6.84 8.642 8.642 0 01-6.5 2.568h-5.8v.003zm34.8-5.952h12.082v-7.3H42.378V8.091h13.291V.702H34.645v33.6H55.91V26.91H42.378v-5.952h.004zm36.343 13.344L89.744.702h-8.458l-7.491 24.72L66.304.702h-8.457l11.019 33.6h9.859zm14.4 0h7.733V.702h-7.733v33.6zm38.615-1.416a15.508 15.508 0 006.041-5.688l-6.67-3.84a7.481 7.481 0 01-3.165 3.024 9.873 9.873 0 01-4.664 1.1 9.594 9.594 0 01-7.177-2.736 9.911 9.911 0 01-2.682-7.248 9.91 9.91 0 012.682-7.248 9.593 9.593 0 017.177-2.736 9.897 9.897 0 014.639 1.08 7.589 7.589 0 013.19 3.048l6.67-3.84a15.874 15.874 0 00-6.09-5.688 17.42 17.42 0 00-8.409-2.088c-9.779-.272-17.797 7.691-17.591 17.472-.208 9.781 7.809 17.747 17.588 17.476 2.95.027 5.859-.691 8.458-2.088h.003zm17.881-11.928h12.082v-7.3h-12.085V8.091h13.29V.702h-21.023v33.6h21.265V26.91h-13.532v-5.952h.003z" fill="#000"/>
</svg>
</a>
<div class="navigation-wrapper">
<form class="main-header-search" action="https://echo.htmlacademy.ru" method="post">
<label class="visually-hidden" for="search">Поиск по сайту</label>
<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.667 12a5.301 5.301 0 003.264-1.125l2.931 2.93.943-.942-2.931-2.931A5.3 5.3 0 0012 6.667a5.34 5.34 0 00-5.333-5.334 5.34 5.34 0 00-5.334 5.334A5.34 5.34 0 006.667 12zm0-9.333c2.206 0 4 1.794 4 4s-1.794 4-4 4-4-1.794-4-4 1.794-4 4-4z" fill="#000"/>
</svg>
<input class="search-field" id="search" type="search" name="header-search" placeholder="Поиск по сайту">
<button class="search-find" type="submit">Найти</button>
</form>
<ul class="user-navigation">
<li class="header-enter">
<a href="#">
<svg width="9" height="10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4.5.333c1.197 0 2.167 1.044 2.167 2.334C6.667 3.956 5.697 5 4.5 5 3.303 5 2.333 3.956 2.333 2.667c0-1.29.97-2.334 2.167-2.334zm0 9.334s4.333 0 4.333-1.167c0-1.4-2.112-2.917-4.333-2.917C2.28 5.583.167 7.1.167 8.5.167 9.667 4.5 9.667 4.5 9.667z" fill="#000"/>
</svg>
<span>Войти</span>
</a>
</li>
<li class="header-compare">
<a href="#">
<svg width="10" height="10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M.917 3.367h1.75v5.716H.917V3.367zM4.183.917h1.634v8.166H4.183V.917zM7.45 5.583h1.633v3.5H7.45v-3.5z" fill="#000"/>
</svg>
<span>Сравнить</span>
</a>
</li>
<li class="header-cart">
<a href="#">
<svg width="10" height="10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.862 2.522a.358.358 0 00-.273-.129H7.658V3.42c0 .471-.404.855-.901.855s-.901-.384-.901-.855V2.393H4.054V3.42c0 .471-.404.855-.9.855-.498 0-.902-.384-.902-.855V2.393H.321a.358.358 0 00-.273.129.397.397 0 00-.09.3l.648 5.963C.618 9.457 1.142 10 1.784 10h6.342c.642 0 1.166-.543 1.178-1.215l.649-5.964a.398.398 0 00-.09-.3z" fill="#231F20"/>
<path d="M3.153 3.76c.2 0 .36-.153.36-.341v-1.88c0-.528.562-.855 1.082-.855h.9c.548 0 .902.335.902.854v1.88c0 .19.161.343.36.343.199 0 .36-.154.36-.342v-1.88C7.117.646 6.435 0 5.496 0h-.901C3.6 0 2.793.69 2.793 1.538v1.88c0 .19.162.343.36.343z" fill="#231F20"/>
</svg>
<span>Корзина</span>
</a>
</li>
</ul>
</div>
<ul class="site-navigation">
<li class="catalog-navigation">
<a>
<span>Каталог товаров</span>
<svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.7 6.9v2.2H9.1v6.6H6.9V9.1H.3V6.9h6.6V.3h2.2v6.6h6.6z" fill="#000" fill-opacity=".3"/>
</svg>
</a>
<ul class="dropdown-catalog-navigation">
<li><a href="#">Виртуальная реальность</a></li>
<li><a href="#">Фитнес-браслеты</a></li>
<li><a href="#">Квадрокоптер</a></li>
<li><a href="catalog.html">Моноподы для селфи</a></li>
<li><a href="#">Умные часы</a></li>
<li><a href="#">Экшн-камеры</a></li>
</ul>
</li>
<li><a href="#">Доставка</a></li>
<li><a href="#">Гарантия</a></li>
<li><a href="#">Контакты</a></li>
</ul>
</nav>
</header>
<main class="main-container">
<h1 class="visually-hidden">«Девайс» интернет-магазин гаджетов</h1>
<section class="main-promo-slider">
<h2 class="visually-hidden">Cлайдер с популярными товарами</h2>
<ul class="promo-slider-list">
<li class="promo-slider-item promo-slider-first">
<h3 class="visually-hidden">Восьмиметровая палка для селфи</h3>
<div class="promo-slider-image">
<img src="img/longest-monopod.png" width="384" height="486" alt="Стильная длинная палка для селфи 8 метров длиной и весом 5 килограмм">
</div>
<div class="slider-right-column">
<div class="promo-slider-text">
<p class="promo-slider-slogan">
Делай селфи,
<br>как Бен Стиллер!
</p>
<p class="promo-slider-desc">Самая длинная палка для селфи доступна в нашем магазине. <br>Восемь (Восемь, Карл!) метров длиной и весом всего 5 килограмм.</p>
</div>
<a class="button slider-button" href="#">Подробнее</a>
<dl class="slider-specification">
<div>
<dt>Длина палки</dt>
<dd>8,5 м</dd>
</div>
<div>
<dt>Вес палки</dt>
<dd>5 кг</dd>
</div>
<div>
<dt>Материал</dt>
<dd>Карбон</dd>
</div>
</dl>
<span class="slider-number">01</span>
</div>
</li>
<li class="promo-slider-item promo-slider-second hide-slide">
<h3 class="visually-hidden">Мотивирующий фитнес-браслет</h3>
<div class="promo-slider-image">
<img src="img/fitness-band.png" width="345" height="485" alt="Черный мотивирующий фитнес-браслет">
</div>
<div class="slider-right-column">
<div class="promo-slider-text">
<p class="promo-slider-slogan">Худеем правильно!</p>
<p class="promo-slider-desc">Мотивирующие фитнес-браслеты помогут найти в себе силы не пропускать занятия и соблюдать диету.</p>
</div>
<a class="button slider-button" href="#">Подробнее</a>
<dl class="slider-specification">
<div>
<dt>Без подзарядки</dt>
<dd>48 часов</dd>
</div>
</dl>
<span class="slider-number">02</span>
</div>
</li>
<li class="promo-slider-item promo-slider-third hide-slide">
<h3 class="visually-hidden">Квадрокоптер с мощным лазером</h3>
<div class="promo-slider-image">
<img src="img/quadrocopter.png" width="526" height="334" alt="Черно-белый квадрокоптер с лазером замаскированным под камеру">
</div>
<div class="slider-right-column">
<div class="promo-slider-text">
<p class="promo-slider-slogan">Порхает как бабочка, жалит как пчела!</p>
<p class="promo-slider-desc">Этот обычный, на первый взгляд, квадрокоптер оснащен мощным лазером, замаскированным под стандартную камеру.</p>
</div>
<a class="button slider-button" href="#">Подробнее</a>
<dl class="slider-specification">
<div>
<dt>Дальность полета</dt>
<dd>800 м</dd>
</div>
<div>
<dt>Радиус поражения</dt>
<dd>50 м</dd>
</div>
</dl>
<span class="slider-number">03</span>
</div>
</li>
</ul>
<div class="promo-slider-controls">
<button class="promo-slider-button-first promo-slider-button-active" type="button">
<span class="visually-hidden">Первый слайд</span>
<svg width="12" height="12" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="6" cy="6" r="5.5" stroke="#000"/>
</svg>
</button>
<button class="promo-slider-button-second" type="button">
<span class="visually-hidden">Второй слайд</span>
<svg width="12" height="12" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="6" cy="6" r="5.5" stroke="#000"/>
</svg>
</button>
<button class="promo-slider-button-third" type="button">
<span class="visually-hidden">Третий слайд</span>
<svg width="12" height="12" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="6" cy="6" r="5.5" stroke="#000"/>
</svg>
</button>
</div>
</section>
<section class="main-product-groups">
<h2 class="visually-hidden">Разделы товаров</h2>
<ul class="product-groups-list">
<li class="product-group">
<a href="#">
<svg width="97" height="55" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M84.131 32.639V20.003c0-1.309 1.045-2.37 2.335-2.37l8.326 1.581V11.02c0-2.355-1.708-3.43-4.202-4.265L67.403.175c1.616 1.391 1.89 2.04 1.89 4.396V49.78c0 2.356-.45 4.066-1.968 5.21l23.265-7.065c2.401-.833 4.202-4.216 4.202-6.572V33.44l-8.326 1.567c-1.29.002-2.335-1.06-2.335-2.368z" fill="#363636"/>
<path d="M95.129 20.979l-7.598-1.444c-1.008 0-1.824.829-1.824 1.851v9.868c0 1.023.816 1.852 1.824 1.852l7.598-1.431c1.154-.419 1.824-.829 1.824-1.852V22.83c0-1.022-.766-1.507-1.824-1.851zM67.17 4.483c0-5.08-4.232-4.459-4.232-4.459S5.832 4.738 2.838 5.145C-.156 5.552.001 9.532.001 9.532L0 45.812c0 3.743 2.599 3.753 2.599 3.753l16.477 1.403L27.212 39.3s1.109-1.828 2.505-1.828c1.397 0 2.432 1.861 2.432 1.861l9.061 13.521s18.895 1.909 22.521 1.909c3.626-.001 3.439-5.024 3.439-5.024V4.483zM12.982 37.192c-3.698 0-6.696-4.601-6.696-10.275s2.998-10.275 6.696-10.275c3.698 0 6.696 4.601 6.696 10.275s-2.998 10.275-6.696 10.275zm36.158 1.426c-4.662 0-8.44-5.239-8.44-11.701 0-6.463 3.779-11.702 8.44-11.702 4.662 0 8.442 5.239 8.442 11.702 0 6.462-3.78 11.701-8.442 11.701z" fill="#363636"/>
</svg>
<span class="product-group-name">Виртуальная реальность</span>
</a>
</li>
<li class="product-group">
<a href="catalog.html">
<svg width="86" height="117" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M82.821 4.011H3.33A3.188 3.188 0 00.142 7.199v46.413a3.187 3.187 0 003.188 3.189h79.492a3.188 3.188 0 003.189-3.189V7.199a3.189 3.189 0 00-3.19-3.188zM8.392 37.236h-.226a3.19 3.19 0 01-3.189-3.189v-7.283a3.188 3.188 0 013.189-3.188h.226v13.66zm61.231 15.172H13.341V8.402h56.282v44.006zM78.4 34.552a4.146 4.146 0 01-4.146-4.147 4.146 4.146 0 114.146 4.147zM54.654 0H31.497v2.758h23.157V0zM46.608 64.861v-2.973h8.046V59.13H31.498v2.758h8.045v35.246a6.068 6.068 0 00-3.635 5.559V117h14.335v-14.307a6.062 6.062 0 00-3.636-5.557v-27.99h4.796l5.05 1.213v-6.711l-5.05 1.213h-4.795z" fill="#363636"/>
</svg>
<span class="product-group-name">Моноподы для селфи</span>
</a>
</li>
<li class="product-group">
<a href="#">
<svg width="71" height="87" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M53.349 1.49c0-.736-.578-1.49-1.311-1.49H9.053C8.32 0 7.672.754 7.672 1.49v3.522h45.676V1.49h.001zM54.202 81.809h-9.597V71.426h-6.958v2.507H18.774c-.537-1.254-1.757-2.148-3.181-2.148H3.559C1.642 71.784 0 73.387 0 75.311v3.018c0 1.924 1.642 3.48 3.559 3.48h12.035c1.511 0 2.792-.896 3.269-2.326h18.785v2.326H28.13c-.533 0-1.01.437-1.01.972v3.172c0 .535.478 1.048 1.01 1.048h26.072c.533 0 .93-.513.93-1.048V82.78c0-.535-.397-.971-.93-.971zM60.666 12.39a7.037 7.037 0 00-6.771-5.05H7.148C3.25 7.34 0 10.449 0 14.361v46.9c0 3.912 3.25 7.121 7.148 7.121h46.747c3.898 0 7.126-3.209 7.126-7.121V50.915a23.228 23.228 0 0010.001-19.164c-.001-8.079-4.132-15.181-10.356-19.361zM12.238 62.151c-3.259 0-5.901-2.65-5.901-5.921 0-3.27 2.642-5.922 5.901-5.922s5.902 2.652 5.902 5.922c0 3.271-2.643 5.921-5.902 5.921zm5.961-32.605a1.42 1.42 0 01-1.418 1.422h-8.94a1.42 1.42 0 01-1.418-1.422v-14.16a1.42 1.42 0 011.418-1.423h8.939a1.42 1.42 0 011.418 1.423v14.16h.001zm29.563 22.312c-11.076 0-20.057-9.01-20.057-20.123 0-11.113 8.98-20.124 20.057-20.124 11.077 0 20.058 9.01 20.058 20.124 0 11.114-8.981 20.123-20.058 20.123z" fill="#363636"/><path d="M47.762 43.964c6.731 0 12.188-5.475 12.188-12.229s-5.457-12.229-12.188-12.229c-6.731 0-12.188 5.475-12.188 12.229s5.457 12.229 12.188 12.229zM31.562 33.171a1.435 1.435 0 100-2.87 1.435 1.435 0 000 2.87zM63.963 33.171a1.435 1.435 0 100-2.87 1.435 1.435 0 000 2.87zM39.109 19.429a1.435 1.435 0 100-2.87 1.435 1.435 0 000 2.87zM56.415 46.912c.79 0 1.43-.643 1.43-1.436 0-.793-.64-1.436-1.43-1.436-.79 0-1.43.643-1.43 1.436 0 .793.64 1.436 1.43 1.436zM55.697 19a1.435 1.435 0 100-2.87 1.435 1.435 0 000 2.87zM39.828 47.341a1.435 1.435 0 100-2.87 1.435 1.435 0 000 2.87z" fill="#363636"/>
</svg>
<span class="product-group-name">Экшн-камеры</span>
</a>
</li>
<li class="product-group">
<a href="#">
<svg width="107" height="65" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)" fill="#363636">
<path d="M98.967 4.074c.752 1.441 1.209 3.08 1.209 4.818v21.102c0 4.616-3.092 8.527-7.246 9.9-1.325 3.987-3.778 7.854-8.051 10.432-8.676 5.231-31.124 4.837-31.198 4.837-.078 0-22.513.395-31.189-4.837-4.216-2.545-6.708-6.347-8.042-10.279-4.418-1.209-7.756-5.251-7.756-10.053V8.893c0-1.688.427-3.282 1.139-4.693C4.17 5.109 0 6.918 0 10.434v29.983C0 50.668 11.839 64.85 53.657 64.85c41.82 0 53.657-14.182 53.657-24.433V10.434c-.001-3.684-4.576-5.494-8.347-6.36z"/>
<path d="M20.561 38.459h65.523c5.564 0 10.074-4.513 10.074-10.077V9.935c0-5.563-4.51-10.075-10.074-10.075H20.561c-5.564 0-10.075 4.511-10.075 10.075v18.447c0 5.564 4.511 10.077 10.075 10.077zM83.695 9.468a1.57 1.57 0 110 3.139 1.57 1.57 0 010-3.139zm0 4.039a1.569 1.569 0 110 3.138 1.569 1.569 0 010-3.138zm0 4.039a1.568 1.568 0 11.001 3.137 1.568 1.568 0 01-.001-3.137zm0 3.827a1.57 1.57 0 11-.001 3.14 1.57 1.57 0 01.001-3.14zm0 4.039a1.568 1.568 0 11.001 3.137 1.568 1.568 0 01-.001-3.137zM79.656 9.468c.867 0 1.568.703 1.568 1.57a1.568 1.568 0 11-3.136 0c0-.868.703-1.57 1.568-1.57zm0 15.944a1.568 1.568 0 110 3.135 1.568 1.568 0 010-3.135zM75.619 9.468a1.57 1.57 0 11-.003 3.14 1.57 1.57 0 01.003-3.14zm0 4.039a1.57 1.57 0 11-.003 3.139 1.57 1.57 0 01.003-3.139zm0 4.039a1.569 1.569 0 11-.002 3.138 1.569 1.569 0 01.002-3.138zm0 3.827a1.568 1.568 0 110 3.138 1.568 1.568 0 010-3.138zm0 4.039a1.569 1.569 0 11-.002 3.138 1.569 1.569 0 01.002-3.138zM67.965 9.468c.867 0 1.568.703 1.568 1.57a1.568 1.568 0 11-3.136 0 1.568 1.568 0 011.568-1.57zm0 8.078a1.568 1.568 0 110 3.14 1.568 1.568 0 010-3.14zm0 3.881a1.569 1.569 0 11-.002 3.136 1.569 1.569 0 01.002-3.136zm0 3.985a1.568 1.568 0 110 3.135 1.568 1.568 0 010-3.135zM63.926 9.468a1.57 1.57 0 110 3.14 1.57 1.57 0 010-3.14zm0 8.078a1.57 1.57 0 11.001 3.139 1.57 1.57 0 01-.001-3.139zm0 7.866a1.57 1.57 0 11.001 3.139 1.57 1.57 0 01-.001-3.139zM59.888 9.468a1.57 1.57 0 010 3.139 1.568 1.568 0 01-1.568-1.569 1.567 1.567 0 011.568-1.57zm0 4.039a1.57 1.57 0 11-.001 3.135 1.57 1.57 0 01.001-3.135zm0 4.039a1.57 1.57 0 11-.001 3.14 1.57 1.57 0 01.001-3.14zm0 7.866a1.57 1.57 0 010 3.137 1.569 1.569 0 010-3.137zm-8.29-15.944a1.57 1.57 0 110 3.139 1.57 1.57 0 010-3.139zm0 4.039a1.569 1.569 0 110 3.138 1.569 1.569 0 010-3.138zm0 4.039a1.568 1.568 0 11.001 3.137 1.568 1.568 0 01-.001-3.137zm0 3.881a1.568 1.568 0 110 3.137 1.569 1.569 0 010-3.137zm0 3.985a1.568 1.568 0 11.001 3.137 1.568 1.568 0 01-.001-3.137zm-4.039-11.905a1.568 1.568 0 110 3.136 1.568 1.568 0 010-3.136zm-8.502-.212a1.57 1.57 0 11-.001 3.135 1.57 1.57 0 01.001-3.135zm0 4.038a1.57 1.57 0 11-.003 3.141 1.57 1.57 0 01.003-3.141zm-4.039-8.078a1.57 1.57 0 11-.003 3.14 1.57 1.57 0 01.003-3.14zm0 4.04a1.57 1.57 0 11-.003 3.139 1.57 1.57 0 01.003-3.139zm0 4.038a1.57 1.57 0 11-.003 3.14 1.57 1.57 0 01.003-3.14zm0 4.04a1.569 1.569 0 11-.001 3.137 1.569 1.569 0 01.001-3.137zm-4.254-8.078a1.569 1.569 0 110 3.138 1.569 1.569 0 010-3.138zm0 4.038a1.57 1.57 0 110 3.139 1.57 1.57 0 010-3.139zm0 4.04a1.57 1.57 0 11-.001 3.14 1.57 1.57 0 01.001-3.14zm0 4.039a1.568 1.568 0 11.001 3.137 1.568 1.568 0 01-.001-3.137zM26.3 9.255a1.57 1.57 0 11.002 3.136 1.57 1.57 0 01-.002-3.136zm0 4.04a1.57 1.57 0 011.571 1.568 1.57 1.57 0 01-3.14 0 1.57 1.57 0 011.569-1.568zm0 4.038a1.571 1.571 0 110 3.14 1.571 1.571 0 010-3.14zm0 4.04a1.57 1.57 0 11.003 3.135 1.57 1.57 0 01-.003-3.135zm-4.037-8.078a1.57 1.57 0 11-.001 3.135 1.57 1.57 0 01.001-3.135zm0 4.038a1.57 1.57 0 010 3.14 1.57 1.57 0 010-3.14z"/>
</g>
<defs>
<clipPath id="clip0">
<path fill="#fff" d="M0 0h107v65H0z"/>
</clipPath>
</defs>
</svg>
<span class="product-group-name">Фитнес-браслеты</span>
</a>
</li>
<li class="product-group">
<a href="#">
<svg width="56" height="98" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M54.494 32.197h-1.515v-4.64c0-5.052-4.087-9.186-9.082-9.186H9.082C4.086 18.372 0 22.505 0 27.557v42.868c0 5.052 4.087 9.185 9.083 9.185h34.815c4.995 0 9.082-4.133 9.082-9.185V67.01h1.515a.764.764 0 00.757-.764V52.467a.765.765 0 00-.757-.766H52.98v-8.788h1.515c.832 0 1.514-.688 1.514-1.531v-7.654a1.529 1.529 0 00-1.515-1.531zm-20.412-3.109c2.926 0 5.299 2.398 5.299 5.358 0 2.96-2.373 5.358-5.299 5.358s-5.298-2.398-5.298-5.358c0-2.96 2.372-5.358 5.298-5.358zm-15.137 0c2.925 0 5.298 2.398 5.298 5.358 0 2.96-2.373 5.358-5.298 5.358-2.926 0-5.298-2.398-5.298-5.358 0-2.96 2.372-5.358 5.298-5.358zM5.297 49.397c0-2.959 2.371-5.358 5.298-5.358 2.926 0 5.298 2.399 5.298 5.358 0 2.959-2.373 5.358-5.298 5.358-2.927.001-5.298-2.399-5.298-5.358zm13.648 19.497c-2.926 0-5.298-2.398-5.298-5.358 0-2.96 2.372-5.358 5.298-5.358 2.925 0 5.298 2.398 5.298 5.358 0 2.96-2.373 5.358-5.298 5.358zm1.49-19.903c0-3.382 2.711-6.124 6.055-6.124s6.055 2.742 6.055 6.124c0 3.382-2.711 6.124-6.055 6.124-3.344-.001-6.055-2.742-6.055-6.124zm13.647 19.903c-2.926 0-5.298-2.398-5.298-5.358 0-2.96 2.372-5.358 5.298-5.358s5.299 2.398 5.299 5.358c0 2.96-2.373 5.358-5.299 5.358zm8.302-14.138c-2.927 0-5.298-2.399-5.298-5.358 0-2.959 2.371-5.358 5.298-5.358 2.926 0 5.298 2.399 5.298 5.358 0 2.958-2.372 5.358-5.298 5.358zM9.646 15.31h33.687c.843 0 1.432-.681 1.306-1.514L43.023 3.028l-.002-.002C42.771 1.362 41.189 0 39.506 0H13.474c-1.686 0-3.268 1.362-3.517 3.028L8.342 13.795c-.125.833.461 1.515 1.304 1.515zM43.333 82.671H9.646c-.843 0-1.429.683-1.304 1.516l1.615 10.767c.25 1.666 1.832 3.028 3.516 3.028h26.032c1.684 0 3.266-1.362 3.517-3.026v-.002l1.615-10.767c.128-.833-.461-1.516-1.304-1.516z" fill="#363636"/>
</svg>
<span class="product-group-name">Умные часы</span>
</a>
</li>
<li class="product-group">
<a href="#">
<svg width="132" height="69" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.052.258C6.507.745 1.838 1.85.575 2.93c-.722.616-.722.616-.232 1.156.644.72 3.713 1.645 7.247 2.237 3.998.668 12.51.693 13.724.051 1.212-.668 1.624-1.414 1.624-2.981 0-1.619-.62-2.416-2.218-2.853C19.274.154 14.942 0 12.052.258zM25.774.488c-.129.283-.258 2.108-.258 4.112 0 4.061.155 3.778-2.192 3.933l-1.03.077-.13 2.545-.129 2.544-1.186.283c-2.58.668-4 2.595-3.792 5.294.128 1.927 1.03 3.341 2.579 4.087 1.109.513 1.47.538 11.246.538 5.545 0 10.137.079 10.188.18.051.13-1.11 9.408-2.58 20.64-1.444 11.23-2.682 20.997-2.708 21.666-.051 1.617.826 2.62 2.348 2.62 1.237 0 2.012-.64 2.321-1.9.13-.514 1.496-10.334 3.018-21.822 1.522-11.463 2.863-20.869 2.94-20.869.104 0 1.084 1.413 2.193 3.136 2.94 4.626 2.399 4.317 7.635 4.317h4.359v5.63l-5.133.077c-4.72.077-5.21.127-5.881.615-1.573 1.157-1.625 1.415-1.625 10.977 0 9.534.026 9.792 1.522 11.05l.851.695H81.695l.851-.696c1.496-1.257 1.52-1.515 1.52-11.05 0-9.56-.05-9.819-1.622-10.976-.671-.488-1.162-.538-5.882-.615l-5.132-.077v-5.63h4.36c5.234 0 4.693.309 7.633-4.317 1.11-1.723 2.09-3.136 2.194-3.136.076 0 1.418 9.406 2.94 20.869 1.522 11.488 2.889 21.308 3.018 21.821.31 1.26 1.082 1.902 2.321 1.902 1.522 0 2.4-1.004 2.347-2.621-.026-.67-1.264-10.436-2.71-21.666-1.468-11.232-2.63-20.51-2.577-20.64.05-.101 4.641-.18 10.189-.18 9.775 0 10.136-.025 11.244-.538 1.548-.746 2.45-2.16 2.579-4.087.207-2.699-1.211-4.626-3.791-5.294l-1.187-.283-.127-2.544-.129-2.545-1.032-.077c-2.347-.155-2.194.128-2.194-3.933 0-2.004-.128-3.829-.257-4.112-.206-.36-.543-.488-1.367-.488-.619 0-1.238.128-1.42.309-.206.205-.309 1.465-.309 3.932 0 2.467-.103 3.727-.31 3.932-.18.18-.901.308-1.649.308-1.626 0-1.652.052-1.652 3.11v2.287H32.48v-2.287c0-3.058-.024-3.11-1.65-3.11-.748 0-1.47-.129-1.65-.308-.207-.205-.31-1.465-.31-3.932 0-2.467-.103-3.727-.31-3.932-.18-.18-.8-.309-1.418-.309-.825 0-1.16.128-1.368.488zm42.843 40.12c2.889.899 5.392 3.393 6.166 6.168.439 1.543.31 4.216-.284 5.784-.696 1.875-2.685 4.01-4.565 4.935-1.29.642-1.754.719-3.921.719s-2.631-.077-3.92-.719c-1.885-.926-3.87-3.06-4.567-4.935-.592-1.568-.722-4.24-.283-5.784.748-2.723 3.25-5.27 6.061-6.168 2.012-.642 3.3-.642 5.313 0z" fill="#363636"/><path d="M63.794 44.438c-2.036.925-3.507 3.649-3.069 5.73.774 3.677 4.824 5.553 7.996 3.702 1.985-1.158 2.991-3.547 2.451-5.783-.568-2.39-2.734-4.138-5.16-4.138-.645 0-1.625.232-2.218.489zM36.092.154c-3.92.668-4.513 1.131-4.513 3.444 0 1.825.463 2.416 2.268 2.956 1.55.462 7.172.514 10.5.128 6.86-.822 11.322-2.544 9.698-3.752-1.265-.9-4.902-1.876-9.054-2.39-2.475-.308-7.996-.54-8.9-.386zM89.484.258C83.165.848 77.62 2.339 77.62 3.444c0 1.722 7.84 3.47 15.63 3.495 5.804 0 7.196-.642 7.196-3.34 0-1.825-.619-2.622-2.373-3.085C96.423.103 92.398 0 89.484.258zM112.777.283c-1.781.231-3.019.77-3.431 1.491-.387.77-.31 2.904.154 3.572.928 1.31 1.652 1.465 7.069 1.465 3.661 0 5.801-.129 7.866-.488 3.534-.592 6.603-1.517 7.248-2.237.49-.54.49-.54-.233-1.156-1.34-1.13-5.958-2.185-11.916-2.672-3.481-.283-4.488-.283-6.757.025z" fill="#363636"/>
</svg>
<span class="product-group-name">Квадрокоптеры</span>
</a>
</li>
</ul>
</section>
<section class="main-services-slider">
<h2 class="visually-hidden">Дополнительные услуги</h2>
<div class="services-slider-controls">
<button class="service-slider-button-first button current-service-btn" type="button">Доставка</button>
<button class="service-slider-button-second button" type="button">Гарантия</button>
<button class="service-slider-button-third button" type="button">Кредит</button>
</div>
<ul class="services-slider-list">
<li class="service-slider-first services-slider-item">
<h3>Доставка</h3>
<p>Мы с удовольствием доставим ваш товар прямо к вашему <br>подъезду совершенно бесплатно! Ведь мы неплохо <br>заработаем, поднимая его на ваш этаж.</p>
<svg width="136" height="164" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M93.133 38.767c8.121 0 14.945-5.542 16.9-13.049l5.467.814a2.159 2.159 0 002.451-1.816 2.157 2.157 0 00-1.816-2.451l-5.541-.825c.002-.046.004-.091.004-.138 0-.182-.006-.362-.014-.542 0 0-.451-6.518-1.074-9.237-.621-2.719-2.535-3.296-2.535-3.296-9.77-2.212-19.772-2.438-22.375-2.438-2.603 0-3.158 1.332-3.158 1.332l-3.15 4.996-.01-.003c-.076.122-.146.245-.219.368l-.027.043a17.387 17.387 0 00-2.367 8.777c-.001 9.646 7.819 17.465 17.464 17.465zM131.535 78.076v-.002l-26.742-2.168-9.246-21.112s-.461-2.774-6.008-8.476c-5.55-5.702-16.8-3.39-16.8-3.39s-23.885 4.469-31.744 6.318c-7.86 1.85-8.168 9.863-8.168 9.863l-.632 4.519-15.178-2.941a3.012 3.012 0 00-3.516 2.374L6.09 101.303a3.008 3.008 0 002.375 3.516l51.196 9.923c.115.022.23.024.346.033h.002c-.728.104-1.291-.035-1.291-.035l-9.4-1.849-3.082 17.105-23.56 20.363a7.43 7.43 0 109.857 11.086s27.725-22.05 29.575-23.591c1.85-1.54 2.773-3.853 2.773-3.853s4.541-13.948 5.779-16.874c.848-2.004 4.932-1.079 4.932-1.079l22.885 8.631 7.615 29.062c.082.63.242 1.234.473 1.804h.002a7.428 7.428 0 0014.112-4.512c-.842-4.965-4.604-27.046-5.561-31.826-1.078-5.394-4.621-6.934-4.621-6.934s-21.268-11.558-22.654-12.329c-1.387-.77-1.078-2.774-1.078-2.774l3.93-14.331 2.773 5.856s1.619 3.274 4.084 3.391l33.357.82a7.43 7.43 0 007.43-7.431 7.43 7.43 0 00-6.804-7.399zM60.104 62.807l-1.79 5.88 9.899 1.919-20.214-3.917.548-2.496 11.557-1.386zm-2.25 45.473l-45.303-8.781 6.27-32.353 12.542 2.431-1.618 11.567-.64 4.406c-.005.026-.008.056-.012.082l-.018.127h.002a7.43 7.43 0 007.367 8.38 7.428 7.428 0 007.368-8.366l2.9-13.223 17.414 3.374-6.271 32.356zM25.05 17.008h38.027c1.1 0 2-.896 2-1.99 0-1.094-.9-1.99-2-1.99H25.05c-1.1 0-2 .896-2 1.99 0 1.094.9 1.99 2 1.99zM38.08 23.025c-1.1 0-2 .896-2 1.99 0 1.094.9 1.99 2 1.99h22.959c1.1 0 2-.896 2-1.99a2 2 0 00-2-1.99h-22.96z" fill="#fff"/>
<path d="M87.098 32.732c8.121 0 14.945-5.542 16.9-13.049l5.467.814a2.159 2.159 0 002.451-1.816 2.157 2.157 0 00-1.816-2.451l-5.541-.825c.002-.046.004-.091.004-.138 0-.182-.006-.362-.014-.542 0 0-.451-6.518-1.074-9.237-.621-2.719-2.535-3.296-2.535-3.296C91.17-.02 81.168-.246 78.564-.246c-2.604 0-3.158 1.332-3.158 1.332l-3.15 4.996-.01-.003c-.076.121-.146.245-.219.368L72 6.49a17.387 17.387 0 00-2.367 8.777c0 9.646 7.82 17.465 17.465 17.465zM125.5 72.041v-.002l-26.742-2.168-9.246-21.112s-.461-2.774-6.008-8.476c-5.55-5.702-16.8-3.39-16.8-3.39S42.82 41.362 34.96 43.21c-7.86 1.85-8.168 9.863-8.168 9.863L23.71 75.109l-.64 4.406c-.005.026-.008.056-.012.082l-.018.127h.002a7.43 7.43 0 007.367 8.38 7.428 7.428 0 007.368-8.366l4.734-21.581 11.557-1.386-1.79 5.88 9.899 1.919a3.01 3.01 0 012.375 3.517L57.14 106.33a3.012 3.012 0 01-2.948 2.43c-.072 0-.146-.016-.22-.021-.728.104-1.291-.035-1.291-.035l-9.4-1.849-3.082 17.105-23.56 20.363a7.43 7.43 0 109.857 11.086s27.725-22.05 29.575-23.591c1.85-1.54 2.773-3.853 2.773-3.853s4.54-13.948 5.779-16.874c.848-2.004 4.932-1.079 4.932-1.079l22.885 8.631 7.615 29.062c.082.63.242 1.234.473 1.804h.002a7.428 7.428 0 0014.112-4.512c-.842-4.965-4.604-27.046-5.561-31.826-1.078-5.394-4.621-6.934-4.621-6.934S83.193 94.682 81.807 93.91c-1.387-.77-1.078-2.774-1.078-2.774l3.93-14.331 2.773 5.856s1.619 3.274 4.084 3.391l33.357.82a7.43 7.43 0 00.627-14.831z" fill="#3A3A3A"/>
<path d="M53.971 108.739h.002c.073.006.147.021.22.021 1.407 0 2.671-1 2.948-2.43l7.412-38.243a3.01 3.01 0 00-2.375-3.517l-20.214-3.917-1.286 5.862 17.413 3.374-6.271 32.354-45.304-8.779 6.27-32.353 12.542 2.431.832-5.95-15.178-2.942a3.012 3.012 0 00-3.516 2.374L.055 95.268a3.008 3.008 0 002.375 3.516l51.196 9.923c.114.022.229.023.345.032z" fill="#F0C42E"/>
<path d="M59.042 8.982a2 2 0 01-2 1.99H19.015c-1.1 0-2-.896-2-1.99 0-1.094.9-1.99 2-1.99h38.027c1.1.001 2 .896 2 1.99zM57.004 18.98c0 1.094-.9 1.99-2 1.99h-22.96c-1.1 0-2-.896-2-1.99a2 2 0 012-1.99h22.959c1.1 0 2 .896 2 1.99z" fill="#F0C52E"/>
</svg>
</li>
<li class="service-slider-second services-slider-item hide-slide">
<h3>Гарантия</h3>
<p>Если из-за возгорания купленного у нас товара у вас сгорит дом — не переживайте, мы выдадим вам новый. <br>Товар, не дом, конечно же.</p>
<svg width="171" height="194" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M77.694 174.636c-.104-.13-10.495-12.996-12.609-15.76-1.32-1.727-3.307-2.678-5.593-2.678-2.56 0-4.836 1.17-5.512 1.553l-5.486 2.743c-1.773-.479-5.587-1.95-9.28-6.268-3.284-3.839-3.26-8.986-3.086-11.099l5.893-5.893c3.093-2.717 2.452-6.516 1.246-8.431l-.219-.311s-12.862-16.221-14.666-18.498c-.989-1.249-2.475-1.938-4.184-1.938-2.849 0-5.879 1.975-6.756 2.592-10.885 7.749-11.586 14.562-11.63 15.313l-.025.414.074.409c6.412 35.726 26.026 51.137 35.453 58.543 1.148.901 2.14 1.681 2.854 2.306C50.731 193.38 57.93 194 60.721 194c2.375-.001 4.48-.405 6.09-1.171 4.365-2.078 9.424-8.01 10.871-9.778 2.501-3.059 1.283-6.599.168-8.208l-.156-.207zm-13.893 11.873c-.499.237-1.57.491-3.08.491-1.56 0-7.033-.334-11.945-4.632-.854-.747-1.913-1.579-3.139-2.543-8.694-6.83-26.729-21.001-32.78-53.684.29-.979 1.83-4.938 8.62-9.771a11.385 11.385 0 012.12-1.142c2.83 3.572 11.41 14.392 13.501 17.03l-7.528 7.527-.203 1.055c-.08.422-1.91 10.409 4.527 17.937 6.286 7.349 13.25 8.667 14.583 8.856l1.082.154 7.644-3.823.218-.118c.281-.167 1.335-.648 2.071-.648.036 0 .065.001.088.003 2.15 2.8 11.105 13.897 12.5 15.624a.03.03 0 00.004.01c-2.562 3.095-6.173 6.669-8.283 7.674zM137.85 65.824c5.512-5.177 7.156-11.975 5.033-20.783a2.502 2.502 0 00-4.103-1.272l-8.221 7.403c-1.438-.795-3.676-2.451-4.465-5.33l6.803-6.729a2.502 2.502 0 00.104-3.446l-.186-.207a2.473 2.473 0 00-.678-.533c-.16-.086-3.988-2.116-8.824-2.116-4.709 0-8.859 1.921-12.002 5.556-6 6.938-4.557 15.042-3.543 18.471l-3.488 3.488-10.284-9.236 4.717-3.266L78.671 34.1l-10.6 10.603 13.723 20.041 3.266-4.717 9.237 10.282-3.295 3.294c-1.5-.478-3.883-1.052-6.663-1.052-5.429 0-10.236 2.174-13.962 6.359-.27.329-6.599 8.165-2.75 18.621a2.501 2.501 0 003.992 1.019l8.295-7.259c1.323.567 3.622 2.08 4.66 5.925l-7.385 7.516a2.498 2.498 0 001.218 4.187c.11.025 2.724.623 6.175.623 6.84 0 12.112-2.271 15.245-6.567 3.363-4.613 4.094-9.433 3.994-13.088l16.217 16.217.172.158c1.521 1.26 4.318 2.725 7.451 2.725 2.227 0 4.625-.741 6.852-2.824l5.518-5.516.102-.104c5.012-5.358 2.258-11.698.1-14.302l-16.945-16.959c1.027.106 2.148.181 3.322.181 4.888-.001 8.669-1.225 11.24-3.639zM84.551 51.978l-2.734 3.949-7.276-10.625 4.731-4.732 10.625 7.276-3.95 2.734 14.792 13.286-4.094 4.093 1.191-1.192-13.285-14.789zm13.562 33.524c.11.313 2.615 7.746-2.328 14.527-2.77 3.798-7.748 4.526-11.4 4.512l4.703-4.787c.566-.576.82-1.391.68-2.187-1.79-10.147-9.745-11.484-10.083-11.536a2.513 2.513 0 00-2.027.589l-6.204 5.428c-.522-5.56 2.413-9.489 2.76-9.932 2.72-3.03 6.126-4.566 10.124-4.566 3.515 0 6.231 1.211 6.25 1.22a2.501 2.501 0 002.817-.501l19-19a2.493 2.493 0 00.527-2.756c-.035-.083-3.494-8.34 2.158-14.876 2.195-2.539 4.961-3.826 8.221-3.826 1.23 0 2.383.183 3.365.421l-5.047 4.993a2.5 2.5 0 00-.725 2.08c1.012 8.3 8.969 11.077 9.307 11.191a2.503 2.503 0 002.473-.511l6.049-5.447c.373 4.864-1.02 8.554-4.309 11.642-2.008 1.887-5.359 2.283-7.818 2.283-3.689 0-6.951-.865-6.982-.873a2.502 2.502 0 00-2.43.653l-18.5 18.667a2.521 2.521 0 00-.58 2.592zm5.502 1.842v0zm-.181-1.121zm33.091 10.856l-5.479 5.476c-3.248 2.98-6.9.432-7.576-.087l-18.643-18.645 14.941-15.075-2.035 2.053 18.707 18.706c.46.592 3.097 4.287.085 7.572zm-15.209-28.054zm-.843-.143l.066.012a4.19 4.19 0 01-.066-.012z" fill="#fff"/>
<path d="M104.162 6.002c-36.408 0-65.922 29.514-65.922 65.922 0 33.517 25.02 61.172 57.398 65.354v26.224s57.439-21.243 71.969-73.622c.078-.283.139-.538.211-.812.113-.424.225-.85.33-1.277.064-.263.119-.514.178-.769a66.07 66.07 0 001.758-15.098c0-36.408-29.514-65.922-65.922-65.922zm57.348 79.422l-.006.027-.006.027-.029.13c-.039.17-.076.339-.119.515-.094.376-.191.751-.301 1.161l-.104.4a9.602 9.602 0 01-.082.324c-5.564 20.056-18.52 37.7-38.506 52.442-7.373 5.438-14.408 9.464-19.719 12.175V131.123l-6.104-.788c-29.243-3.777-51.295-28.889-51.295-58.412 0-32.49 26.432-58.922 58.922-58.922 32.488 0 58.922 26.432 58.922 58.922a59.082 59.082 0 01-1.573 13.501z" fill="#fff"/>
<path d="M54.583 187.998c-2.791 0-9.99-.62-16.554-6.364-.714-.625-1.706-1.404-2.854-2.306-9.426-7.406-29.041-22.817-35.453-58.543l-.074-.409.024-.414c.044-.752.746-7.564 11.63-15.313.878-.617 3.908-2.592 6.757-2.592 1.708 0 3.194.688 4.184 1.938 1.804 2.277 14.666 18.498 14.666 18.498l.219.311c1.206 1.915 1.847 5.714-1.246 8.431l-5.893 5.893c-.175 2.112-.198 7.26 3.086 11.099 3.692 4.317 7.507 5.789 9.28 6.268l5.486-2.743c.676-.383 2.952-1.553 5.512-1.553 2.286 0 4.272.951 5.593 2.678 2.114 2.764 12.504 15.63 12.609 15.76l.155.207c1.115 1.609 2.333 5.149-.168 8.208-1.447 1.769-6.505 7.7-10.872 9.778-1.607.763-3.712 1.167-6.087 1.168zM6.72 120.14c6.05 32.683 24.086 46.854 32.78 53.684 1.226.964 2.285 1.796 3.139 2.543 4.912 4.298 10.384 4.632 11.944 4.632 1.511 0 2.582-.254 3.081-.491 2.11-1.005 5.722-4.579 8.284-7.674l-.004-.01C64.55 171.097 55.593 160 53.444 157.2a1.065 1.065 0 00-.088-.003c-.736 0-1.79.481-2.071.648l-.218.118-7.644 3.823-1.082-.154c-1.333-.189-8.297-1.508-14.583-8.856-6.438-7.527-4.608-17.515-4.527-17.937l.203-1.055 7.528-7.527-13.502-17.03c-.611.237-1.467.688-2.12 1.142-6.792 4.833-8.332 8.792-8.62 9.771z" fill="#3A3A3A"/>
<path d="M78.443 103.54c-3.452 0-6.065-.598-6.175-.623a2.5 2.5 0 01-1.218-4.187l7.384-7.516c-1.037-3.845-3.336-5.357-4.659-5.925l-8.295 7.259a2.503 2.503 0 01-3.993-1.018c-3.848-10.457 2.48-18.293 2.751-18.622 3.726-4.185 8.533-6.359 13.962-6.359 2.78 0 5.162.574 6.663 1.052l16.766-16.765c-1.013-3.43-2.457-11.534 3.543-18.471 3.143-3.634 7.293-5.556 12.002-5.556 4.837 0 8.664 2.029 8.825 2.116.255.137.484.317.677.533l.186.207c.89.993.845 2.508-.104 3.446l-6.803 6.729c.789 2.879 3.028 4.535 4.465 5.33l8.222-7.403a2.5 2.5 0 014.103 1.272c2.123 8.809.478 15.606-5.033 20.783-2.57 2.414-6.353 3.638-11.242 3.638-2.789 0-5.324-.407-6.839-.714L97.127 79.399c.729 3.181 1.631 10.62-3.439 17.574-3.133 4.296-8.405 6.567-15.245 6.567zm-.196-5.001c3.651.015 8.631-.714 11.4-4.512 4.944-6.781 2.438-14.214 2.329-14.527a2.518 2.518 0 01.582-2.593l18.5-18.667a2.501 2.501 0 012.43-.653c.03.008 3.293.873 6.982.873 2.458 0 5.811-.396 7.818-2.283 3.288-3.088 4.681-6.778 4.309-11.642l-6.049 5.447a2.505 2.505 0 01-2.473.511c-.338-.114-8.295-2.891-9.307-11.191a2.496 2.496 0 01.724-2.08l5.047-4.993a14.37 14.37 0 00-3.365-.421c-3.259 0-6.024 1.288-8.221 3.826-5.651 6.536-2.192 14.793-2.157 14.876.405.94.196 2.033-.528 2.756l-19 19a2.5 2.5 0 01-2.817.501c-.018-.008-2.735-1.22-6.25-1.22-3.998 0-7.404 1.536-10.125 4.566-.347.442-3.282 4.372-2.759 9.932l6.204-5.428a2.506 2.506 0 012.027-.589c.337.052 8.291 1.389 10.082 11.536a2.498 2.498 0 01-.679 2.187l-4.704 4.788z" fill="#F0C42E"/>
<path d="M78.92 54.025l9.238 10.282 3.54-3.541-13.285-14.79-2.735 3.949-7.276-10.624 4.732-4.732 10.625 7.276-3.95 2.734 14.79 13.286 3.542-3.541-10.283-9.236 4.717-3.266-20.042-13.724-10.601 10.603 13.724 20.041 3.265-4.717zM117.147 63.28a37.19 37.19 0 01-3.517-.534l-2.034 2.053 18.706 18.706c.46.592 3.097 4.287.084 7.572l-5.478 5.476c-3.248 2.98-6.901.432-7.576-.087L98.69 77.821l-1.563 1.578c.245 1.07.505 2.63.555 4.485l16.217 16.218.173.158c1.521 1.26 4.318 2.725 7.45 2.725 2.228 0 4.625-.741 6.853-2.824l5.518-5.516.102-.103c5.012-5.358 2.257-11.699.099-14.303L117.147 63.28z" fill="#3A3A3A"/>
<path d="M98.023 7c32.489 0 58.922 26.432 58.922 58.922 0 4.508-.529 9.05-1.573 13.5l-.006.027-.007.027-.029.13c-.038.17-.076.339-.118.515-.094.376-.191.751-.302 1.161l-.103.4c-.026.108-.054.216-.083.324-5.564 20.056-18.52 37.7-38.506 52.442-7.373 5.438-14.408 9.464-19.719 12.175V125.121l-6.104-.788c-29.243-3.777-51.294-28.889-51.294-58.412C39.102 33.432 65.534 7 98.023 7zm0-7c-36.407 0-65.92 29.514-65.92 65.922 0 33.517 25.02 61.172 57.397 65.354V157.5s57.439-21.243 71.97-73.622c.078-.283.138-.538.21-.812.114-.424.225-.85.331-1.277.063-.263.119-.514.177-.769a66.014 66.014 0 001.758-15.098C163.945 29.514 134.432 0 98.023 0z" fill="#3A3A3A"/>
</svg>
</li>
<li class="service-slider-third services-slider-item hide-slide">
<h3>Кредит</h3>
<p>Залезть в долговую яму стало проще! Кредитные консультанты подберут для вас наиболее выгодные <br>условия кредита. Выгодные для нашего банка, разумеется.</p>
<svg width="156" height="186" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M141.25 83.627c8.146 0 14.75-6.604 14.75-14.75s-6.604-14.75-14.75-14.75-14.75 6.604-14.75 14.75 6.604 14.75 14.75 14.75zM89.113 139.544l-7.074 17.875-22.824 14.917a7.16 7.16 0 00-3.634 6.23 7.167 7.167 0 007.167 7.167 7.121 7.121 0 004.121-1.31c3.761-2.371 22.351-14.084 25.495-15.88 3.5-2 4.125-5.125 4.125-5.125l4.875-16-5.75-2.625c-5.75-2.625-6.5-5.249-6.5-5.249z" fill="#fff"/>
<path d="M139.321 141.462s-1.158-3.834-4.579-5.167c-3.421-1.333-18.087-7.75-18.087-7.75l15.416-25.584s3.834-9-.333-13.417-13.75-9.75-13.75-9.75h-7.521l15.799-26.801c3.354-5.686 1.443-13.081-4.242-16.432L72.634 7.447c-5.687-3.352-13.08-1.442-16.432 4.244L9.144 91.519c-3.35 5.685-1.442 13.08 4.244 16.432l49.39 29.113c5.686 3.352 13.081 1.441 16.432-4.242l22.934-38.903h8.096l-14.75 26.209s-5.134 9.214-.334 14.25c4.21 4.416 12.667 6.916 12.667 6.916l17.25 6.501 5.101 31.291.009-.001c.549 3.413 3.499 6.023 7.067 6.023a7.166 7.166 0 007.166-7.167c0-.189-.014-.375-.028-.56l.028-.004-5.095-35.915zM17.958 100.198c-1.4-.826-1.887-2.708-1.06-4.108l47.058-79.829c.826-1.401 2.707-1.888 4.107-1.062l11.521 6.792-50.104 84.998-11.522-6.791zm53.498 28.054c-.826 1.4-2.707 1.887-4.107 1.061l-30.116-17.754L87.34 26.563l30.113 17.753c1.402.826 1.887 2.707 1.062 4.107l-18.493 31.372h-8.783L71.323 94.222a7.155 7.155 0 00-1.23.891l-.03.022.001.003a7.142 7.142 0 00-2.358 5.304 7.167 7.167 0 007.167 7.167 7.121 7.121 0 004.15-1.331l.001.003.071-.058c.182-.133.356-.273.524-.423l9.66-7.784-17.823 30.236z" fill="#fff"/>
<path d="M49.219 5.943L2.16 85.772c-3.351 5.685-1.442 13.08 4.244 16.432l49.39 29.113c5.686 3.352 13.08 1.441 16.432-4.242l47.057-79.829c3.354-5.686 1.443-13.081-4.242-16.432L65.65 1.7C59.965-1.652 52.57.258 49.219 5.943zm-39.305 84.4l47.059-79.829c.826-1.401 2.707-1.888 4.107-1.062l11.52 6.792-50.104 84.998-11.522-6.791c-1.4-.826-1.886-2.708-1.06-4.108zM111.53 42.676l-47.06 79.829c-.825 1.4-2.706 1.887-4.106 1.061l-30.116-17.754 50.106-84.996 30.113 17.753c1.403.825 1.887 2.706 1.063 4.107z" fill="#F0C42E"/>
<path d="M135.25 77.833c8.146 0 14.75-6.604 14.75-14.75s-6.604-14.75-14.75-14.75-14.75 6.604-14.75 14.75 6.604 14.75 14.75 14.75zM81.875 133.75l-7.074 17.875-22.825 14.917a7.16 7.16 0 00-3.634 6.23 7.167 7.167 0 007.167 7.167 7.121 7.121 0 004.121-1.31c3.761-2.371 22.351-14.084 25.495-15.88 3.5-2 4.125-5.125 4.125-5.125l4.875-16-5.75-2.625c-5.75-2.625-6.5-5.249-6.5-5.249zM132.083 135.668s-1.158-3.834-4.579-5.167c-3.421-1.333-18.087-7.75-18.087-7.75l15.416-25.584s3.834-9-.333-13.417S110.75 74 110.75 74H84L64.085 88.427a7.208 7.208 0 00-1.23.891l-.031.022.002.003a7.14 7.14 0 00-2.358 5.303 7.167 7.167 0 007.167 7.167 7.121 7.121 0 004.149-1.331l.002.003.071-.058c.182-.133.357-.273.525-.423l14.743-11.881H103l-14.75 26.209s-5.134 9.214-.334 14.25c4.209 4.416 12.667 6.916 12.667 6.916l17.25 6.501 5.101 31.291.009-.001c.549 3.413 3.499 6.023 7.067 6.023a7.166 7.166 0 007.166-7.167c0-.189-.014-.375-.028-.56l.028-.004-5.093-35.913z" fill="#3A3A3A"/>
</svg>
</li>
</ul>
</section>
<section class="main-brands">
<h2 class="visually-hidden">Мы официальные дилеры</h2>
<ul class="main-brand-list">
<li class="main-brand-item">
<a class="brand-section" href="#">
<span class="visually-hidden">Товары DJI</span>
<img src="img/dji.png" width="260" height="100" alt="Логотип DJI">
</a>
</li>
<li class="main-brand-item">
<a class="brand-section" href="#">
<span class="visually-hidden">Товары SP Gadgets</span>
<img src="img/sp-gadjets.png" width="260" height="100" alt="Логотип SP Gadgets">
</a>
</li>
<li class="main-brand-item">
<a class="brand-section" href="#">
<span class="visually-hidden">Товары GoPro</span>
<img src="img/gopro.png" width="260" height="100" alt="Логотип GoPro">
</a>
</li>
<li class="main-brand-item">
<a class="brand-section" href="#">
<span class="visually-hidden">Товары Vive</span>
<img src="img/vive.png" width="260" height="100" alt="Логотип Vive">
</a>
</li>
</ul>
</section>
<div class="index-columns">
<section class="about-us">
<h2>О нас</h2>
<p>Огромный выбор гаджетов не оставит равнодушным гика, <br>который есть в каждом из нас.</p>
<p>Мы можем доставить ваш товар в самые отдаленные точки России! DEVICE работает со многими транспортными компаниями:</p>
<ul class="delivery-services-list">
<li>Деловые линии</li>
<li>Автотрейдинг</li>
<li>ЖелДорЭкспедиция</li>
</ul>
<a class="button more-about-us" href="#">Подробнее о нас</a>
</section>
<section class="main-contacts">
<h2>Контакты</h2>
<p>Вы можете забрать товар сами, заехав в наш офис. Заодно, вы сможете проверить работоспособность покупки. Всякое бывает.</p>
<a class="map-popup-link" href="https://goo.gl/maps/Pe5CtGadJK3zzcXz7">
<img class="map-mini" src="img/map-mini.png" width="560" height="222" alt="Карта расположения интернет-магазина «Девайс» по адресу Москва, улица Строителей 15">
</a>
<a class="button write-us-btn" href="#">Напишите нам</a>
</section>
</div>
</main>
<footer class="footer">
<div class="footer-wrapper-row">
<a class="main-footer-logo">
<span class="visually-hidden">Желтый логотип «Девайс»</span>
<svg width="163" height="35" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M-.151.702v33.6h13.532a15.721 15.721 0 0011.72-4.824 16.458 16.458 0 004.712-11.976 16.457 16.457 0 00-4.712-11.976A15.724 15.724 0 0013.381.702H-.151zM7.582 26.91V8.091h5.8a8.646 8.646 0 016.5 2.568 9.408 9.408 0 012.489 6.84 9.406 9.406 0 01-2.489 6.84 8.642 8.642 0 01-6.5 2.568h-5.8v.003zm34.8-5.952h12.082v-7.3H42.378V8.091h13.291V.702H34.645v33.6H55.91V26.91H42.378v-5.952h.004zm36.343 13.344L89.744.702h-8.458l-7.491 24.72L66.304.702h-8.457l11.019 33.6h9.859zm14.4 0h7.733V.702h-7.733v33.6zm38.615-1.416a15.51 15.51 0 006.041-5.688l-6.67-3.84a7.482 7.482 0 01-3.165 3.024 9.873 9.873 0 01-4.664 1.1 9.596 9.596 0 01-7.177-2.736 9.911 9.911 0 01-2.682-7.248 9.91 9.91 0 012.682-7.248 9.592 9.592 0 017.177-2.736 9.897 9.897 0 014.639 1.08 7.589 7.589 0 013.19 3.048l6.67-3.84a15.874 15.874 0 00-6.09-5.688 17.42 17.42 0 00-8.409-2.088c-9.779-.272-17.797 7.691-17.591 17.472-.208 9.781 7.809 17.747 17.588 17.476 2.95.027 5.859-.69 8.458-2.088h.003zm17.881-11.928h12.082v-7.3h-12.085V8.091h13.29V.702h-21.023v33.6h21.265V26.91h-13.532v-5.952h.003z" fill="#F0C52E"/>
</svg>
</a>
<ul class="footer-user-navigation">
<li class="footer-enter">
<a href="#">
<svg width="9" height="10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4.5.333c1.197 0 2.167 1.044 2.167 2.334C6.667 3.956 5.697 5 4.5 5 3.303 5 2.333 3.956 2.333 2.667c0-1.29.97-2.334 2.167-2.334zm0 9.334s4.333 0 4.333-1.167c0-1.4-2.112-2.917-4.333-2.917C2.28 5.583.167 7.1.167 8.5.167 9.667 4.5 9.667 4.5 9.667z" fill="#FFC600"/>
</svg>
<span>Войти</span>
</a>
</li>
<li class="footer-compare">
<a href="#">
<svg width="10" height="10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M.917 3.367h1.75v5.716H.917V3.367zM4.183.917h1.634v8.166H4.183V.917zM7.45 5.583h1.633v3.5H7.45v-3.5z" fill="#FFC600"/>
</svg>
<span>Сравнить</span>
</a>
</li>
<li class="footer-cart">
<a href="#">
<svg width="10" height="10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.862 2.522a.358.358 0 00-.273-.129H7.658V3.42c0 .471-.404.855-.901.855s-.901-.384-.901-.855V2.393H4.054V3.42c0 .471-.404.855-.9.855-.498 0-.902-.384-.902-.855V2.393H.321a.358.358 0 00-.273.129.397.397 0 00-.09.3l.648 5.963C.618 9.457 1.142 10 1.784 10h6.342c.642 0 1.166-.543 1.178-1.215l.649-5.964a.398.398 0 00-.09-.3z" fill="#FFC600"/>
<path d="M3.153 3.76c.2 0 .36-.153.36-.341v-1.88c0-.528.562-.855 1.082-.855h.9c.548 0 .902.335.902.854v1.88c0 .19.161.343.36.343.199 0 .36-.154.36-.342v-1.88C7.117.646 6.435 0 5.496 0h-.901C3.6 0 2.793.69 2.793 1.538v1.88c0 .19.162.343.36.343z" fill="#FFC600"/>
</svg>
<span>Корзина</span>
</a>
</li>
</ul>
</div>
<div class="footer-wrapper-middle">
<p class="footer-addres">г. Москва, ул. Строителей, 15</p>
<ul class="footer-services-list">
<li><a href="#">Доставка</a></li>
<li><a href="#">Гарантия</a></li>
<li><a href="#">Контакты</a></li>
</ul>
<span class="footer-telephone-number">Тел.: <a href="tel:+74954959595">+7 (495) 495-95-95</a></span>
</div>
<div class="footer-wrapper-row last-footer-wrapper">
<ul class="footer-social">
<li class="social-button">
<a href="#">
<span class="visually-hidden">Фейсбук</span>
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M31.997 16c0-8.837-7.162-16-15.998-16C7.163 0 0 7.163 0 16c0 7.984 5.85 14.603 13.499 15.803V20.624H9.437v-4.625H13.5v-3.524c0-4.011 2.389-6.226 6.042-6.226 1.751 0 3.582.312 3.582.312V10.5h-2.016c-1.987 0-2.607 1.233-2.607 2.498V16h4.437l-.709 4.625H18.5v11.179c7.648-1.2 13.499-7.819 13.499-15.804h-.002z"/>
</svg>
</a>
</li>
<li class="social-button">
<a class="social-button" href="#">
<span class="visually-hidden">Инстаграмм</span>
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M21 16a5 5 0 11-10 0c0-.285.03-.563.082-.833H9.333v6.661c0 .464.375.839.839.839H21.83a.838.838 0 00.837-.839v-6.661h-1.749c.052.27.082.548.082.833zm-5 3.333a3.334 3.334 0 10-.001-6.667A3.334 3.334 0 0016 19.333zm4-6.833h1.998a.502.502 0 00.502-.5v-1.998a.502.502 0 00-.502-.502H20a.501.501 0 00-.502.502V12c.002.275.227.5.502.5zM16 0a16 16 0 100 32 16 16 0 000-32zm8.333 22.482a1.857 1.857 0 01-1.851 1.851H9.518a1.857 1.857 0 01-1.851-1.851V9.518c0-1.018.833-1.851 1.851-1.851h12.964c1.018 0 1.851.833 1.851 1.851v12.964z"/>
</svg>
</a>
</li>
<li class="social-button">
<a class="social-button" href="#">
<span class="visually-hidden">Твиттер</span>
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16 32c-2.167 0-4.24-.422-6.219-1.266-1.979-.843-3.682-1.979-5.11-3.406-1.426-1.427-2.562-3.13-3.405-5.11A15.697 15.697 0 010 16c0-2.167.422-4.24 1.266-6.219.843-1.979 1.979-3.682 3.406-5.11 1.427-1.426 3.13-2.562 5.11-3.405A15.696 15.696 0 0116 0c2.167 0 4.24.422 6.219 1.266 1.979.843 3.682 1.979 5.11 3.406 1.426 1.427 2.562 3.13 3.405 5.11A15.697 15.697 0 0132 16c0 2.167-.422 4.24-1.266 6.219-.843 1.979-1.979 3.682-3.406 5.11-1.427 1.426-3.13 2.562-5.11 3.405A15.698 15.698 0 0116 32zm9.406-24a5.912 5.912 0 00-.562.344l-.61.406-.578.313L23 9.28C22.23 8.427 21.281 8 20.156 8 17.72 8 16.5 9.02 16.5 11.063v1.843c-3.354-.166-5.927-1.396-7.719-3.687C8.261 9.76 8 10.354 8 11c0 1.375.51 2.417 1.531 3.125-.125 0-.302.01-.531.031-.23.021-.411.021-.547 0A1.566 1.566 0 018 14c0 .958.255 1.755.766 2.39.51.636 1.213 1.047 2.109 1.235-.208.25-.5.375-.875.375-.333 0-.625-.094-.875-.281 0 .812.39 1.442 1.172 1.89.781.448 1.661.683 2.64.703-.374.563-.921.985-1.64 1.266A6.246 6.246 0 019 22c-.292 0-.693-.073-1.203-.219A16.21 16.21 0 007 21.563c.333.666 1.016 1.24 2.047 1.718 1.031.48 2.338.719 3.922.719 1.396 0 2.698-.245 3.906-.734 1.208-.49 2.24-1.141 3.094-1.953a12.776 12.776 0 002.203-2.782 13.08 13.08 0 001.375-3.234C23.849 14.182 24 13.083 24 12c0-.042.125-.13.375-.266.25-.135.542-.317.875-.546.333-.23.583-.47.75-.72-1.125 0-1.875.022-2.25.063.73-.437 1.281-1.281 1.656-2.531z"/>
</svg>
</a>
</li>
</ul>
<div class="developer">
<a class="dev-link" href="https://htmlacademy.ru/intensive/htmlcss">
<span class="visually-hidden">Разработано HTML Academy</span>
<svg width="27" height="34" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13.62.017L13.472 0 0 1.408v24.596L13.473 34l13.43-7.969.042-.025V1.408L13.62.017zm11.399 12.078L13.495 5.32l-.001-.104-.087.05-.088-.056v.109L1.925 12.086V3.139l11.548-1.21L25.02 3.14v8.956h-.001zM13.405 6.769l11.518 6.695-4.479 2.633-7.093-4.21-.014 1.412 5.904 3.503-.86.506-5.03-2.984-.014 1.411 3.827 2.27-.782.521-3.031-1.782-.014 1.409 1.853 1.088-1.8 1.078-11.356-6.733 11.371-6.817zm-11.48 8.318l11.411 6.773.016 1.041-7.942-4.715-.015 1.412 7.979 4.783.018 1.073-7.973-4.728-.013 1.41 8.021 4.81.046.025 8.143-4.86-.011-5.163 3.415-2.03v9.994l-11.548 6.854-11.547-6.853v-9.826z"/>
</svg>
</a>
</div>
</div>
</footer>
<section class="modal-map">
<h2 class="visually-hidden">Как до нас добраться</h2>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1337.338973190063!2d37.528739948470516!3d55.686778042281944!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x46b54cf65f5c8955%3A0x694710ccd55501e!2z0YPQuy4g0KHRgtGA0L7QuNGC0LXQu9C10LksIDE1LCDQnNC-0YHQutCy0LAsIDExOTMxMQ!5e0!3m2!1sru!2sru!4v1594590169343!5m2!1sru!2sru" width="958" height="553" allowfullscreen title="Интернет-магазин «Девайс» по адресу Москва, улица Строителей 15"></iframe>
<button class="modal-close" type="button" aria-label="Закрыть"></button>
</section>
<section class="write-us">
<h2 class="visually-hidden">Напишите нам</h2>
<form class="form-write-us" action="https://echo.htmlacademy.ru" method="post">
<div class="write-us-row-wrapper">
<p>
<label for="name-field">Ваше имя:</label>
<input id="name-field" type="text" name="name" placeholder="Имя Фамилия">
</p>
<p>
<label for="email-field">Ваш e-mail:</label>
<input id="email-field" type="email" name="email" placeholder="email@example.com">
</p>
</div>
<p class="write-us-text-wrapper">
<label for="text-field">Текст письма:</label>
<textarea id="text-field" name="text" rows="8" placeholder="В свободной форме"></textarea>
</p>
<button class="button send" type="submit">Отправить</button>
</form>
<button class="modal-close" type="button" aria-label="Закрыть"></button>
</section>
<script src="js/script.min.js"></script>
</body>
</html>