-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
463 lines (438 loc) · 54.1 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
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Портфолио Сугоняева Даниила - front-end программиста</title>
<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="preload" as="font">
<link rel="shortcut icon" href="icon.ico" type="image/x-icon">
<style>
.wrapper {max-width: 1400px;margin: 9.375rem auto;text-align: center;padding: 0 10px;}.burger,aside {position: fixed;top: 0;left: 0;width: 160px;background: #372db4;z-index: 2;}aside {height: 94vh;margin-top: 60px;-webkit-box-shadow: 0 6px 20px rgba(0,0,0,.15);box-shadow: 0 6px 20px rgba(0,0,0,.15);}nav{height: 60vh}.cd-intro-content {margin-left: 260px;}.burger {height: 60px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;}.burger svg {fill: #fff;font-size: 1.25rem;}.avatar {height: 140px;background: #fff;position: relative;z-index: 11;}.avatar .ava {background: url(./img/img/vL1ng-ojrIc.jpg);width: 120px;height: 120px;background-size: cover;}.avatar,.name,.nav_item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.name {background: #fff;font-size: 0.95rem;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;height: 40px;}.nav_item {width: 100%;height: 18%;min-height: 70px;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;border-bottom: 1px solid #493fc8;}.nav_item:focus,.nav_item:hover {background-color: #493fc8;color: #fff;}.nav_item:focus svg,.nav_item:focus span,.nav_item:hover svg,.nav_item:hover span,.social svg:focus,.social svg:hover {fill: #fff;color: #fff;}.nav_item span {fill: rgba(255,255,255,.65);color: rgba(255,255,255,.65);font-family: 'Ubuntu',sans-serif;font-size: .875rem;letter-spacing: .06875rem;font-weight: 400;line-height: 2.1875rem;text-transform: uppercase;}section {width: 100%;}.main,.main_text,.social {display: -webkit-box;display: -ms-flexbox;display: flex;}.main {-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;min-width: calc(100% - 160px);height: 100vh;background: url(./img/img/1.jpg);background-size: cover;}.main_text,.social {display: -ms-flex;}.main_text {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.main_text h1,.main_text span {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;color: #fff;}.main_text h1 {opacity: .2!important;font-family: 'Ubuntu',sans-serif;font-weight: 400;line-height: 15.175rem;font-size: 5.625rem;}@media (min-width:480px) {.main_text h1 {font-size: 12.5rem;}}@media (min-width:480px) and (max-width:1280px) {.main_text h1 {font-size: calc(5.625rem + (200 - 90)*((100vw - 30rem)/(1280 - 480)));}}.main_text span {font-weight: 700;line-height: 3.3rem;text-transform: uppercase;text-shadow: 1px 1px #372db4,1px -1px #372db4,-1px 1px #372db4,-1px -1px #372db4,3px 3px 6px rgba(0,0,0,.5);font-size: 1.5625rem;}@media (min-width:480px) {.main_text span {font-size: 3.125rem;}}@media (min-width:480px) and (max-width:1280px) {.main_text span {font-size: calc(1.5625rem + (50 - 25)*((100vw - 30rem)/(1280 - 480)));}}@media (max-width:750px) {.hidden-aside{display:block !important};.cd-intro-content,.panel {margin-left: 0!important;}.main_text h1 {line-height: 1.2;}.wrapper {margin: 6.375rem auto;}}.social {width: 100%;-ms-flex-pack: distribute;justify-content: space-around;position: absolute;bottom: 30px;}.nav_item svg,.social svg {fill: rgba(255,255,255,.65);}@media (max-width:750px) {#form_wrap::before,#form_wrap:after,.avatar,.name,aside {display: none;}.burger,aside {width: 140px;}.burger {border-bottom: 1px solid #493fc8;}.main_text {margin-left: 15px;}.panel {width: 100%;}.cd-intro-content,.panel {margin-left: 0;}.about_brif-left {margin-right: 0;}.social {bottom: 40px;}.about_text {margin-left: 10px;margin-right: 10px;}#form_wrap,#wrap,form {width: 100%;}form {position: initial;top: 0;height: 300px;}#form_wrap:focus,#form_wrap:hover {height: 446px;top: 0;}input[type=text],textarea {width: 310px;}.nav_item {height: 80px;}aside button {display: none !important;}}.panel {min-width: calc(100% - 160px);height: 100%;right: 0;overflow-y: auto;overflow-x: hidden;margin-top: -250%;position: absolute;background: #fff;-webkit-box-shadow: 0 4px 7px rgba(0,0,0,.6);box-shadow: 0 4px 7px rgba(0,0,0,.6);-webkit-transition: all .8s ease-in-out;transition: all .8s ease-in-out;will-change: margin-top;z-index: 1;margin-left: 260px;}.panel:target {margin-top: 0%;}button{background:none;border:none}
</style>
<script src="js/outdatedbrowser/outdatedbrowser.min.js" charset="utf-8"></script>
</head>
<body>
<template id="skill"><picture><source class="skill-img" srcset="img/img/skill/ name .webp" type="image/webp"><img class="skill-img" src="img/img/skill/ name .png" alt="name"></picture><h3></h3><div class="progress"><div class="loading-bar"><div class="amount" style=""><div class="loaded"></div><div class="lines"></div></div></div></div></template>
<template id="project">
<div class="work mix">
<picture>
<source lazySrcset="img/img/portfolio/ name .webp" srcset="" type="image/webp"><img lazySrc="img/img/portfolio/ name .jpg" src="img/img/no-photo.jpg" class="portfolio_works__img" alt="work"></picture>
<div class="tikets-wrap">
<a href="" target="_blank" class="tiket github"><img
src="img/img/skill/github.png" alt="hub"></a>
<a href="" target="_blank" class="tiket windows"><img
src="img/img/windows.png" alt="windows"></a>
<a href="" target="_blank" class="tiket mac"><img
src="img/img/mac.png" alt="mac"></a>
</div>
<a href="" target="_blank" class="project-link">
<div class="cover"></div>
<div class="work_text">
<h4></h4><span></span>
<div class="technology"></div>
</div>
</a>
</div>
</template>
<div class="burger">
<svg width="25px" height="25px">
<use xlink:href='#menu' />
</svg>
</div>
<aside>
<div class="avatar">
<div class="ava"></div>
</div>
<div class="name" id="tr-name">Сугоняев Даниил</div>
<nav>
<a href="#home" class="nav_item">
<svg width="25px" height="25px">
<use xlink:href='#home' />
</svg>
<span id="tr-main">Главная</span>
</a>
<a href="#about" class="nav_item">
<svg width="25px" height="25px">
<use xlink:href='#user' />
</svg>
<span id="tr-about">Обо мне</span>
</a>
<a href="#skill-p" class="nav_item">
<svg width="35px" height="30px">
<use xlink:href='#card' />
</svg>
<span id="tr-skills">Мои навыки</span>
</a>
<a href="#portfolio" class="nav_item">
<svg width="30px" height="30px">
<use xlink:href='#bag' />
</svg>
<span id="tr-works">Мои проекты</span>
</a>
<a href="#achievements" class="nav_item">
<svg width="35px" height="35px">
<use xlink:href='#priz' />
</svg>
<span id="tr-ach">Достижения</span>
</a>
</nav>
<div class="social">
<a href="https://vk.com/in_vino_veritas_1" target="_blank">
<svg width="25px" height="25px">
<use xlink:href='#vk' />
</svg>
</a>
<a href="https://t.me/coolswood" target="_blank">
<svg width="25px" height="25px">
<use xlink:href='#telegram' />
</svg>
</a>
<a href="https://api.whatsapp.com/send?phone=79997739470" target="_blank">
<svg width="25px" height="25px">
<use xlink:href='#whatsapp' />
</svg>
</a>
</div>
</aside>
<section class="main">
<div class="cd-intro-content mask-2">
<div class="content-wrapper">
<div class="main_text">
<h1 id="tr-hi">Привет</h1>
<span id="tr-my-name">Меня зовут Даниил, я веб разработчик</span>
</div>
</div>
</div>
</section>
<!-- About -->
<div id="about" class="panel">
<section class="about">
<div class="wrapper">
<h2 id="tr-about-page">Обо мне</h2>
<h3 id="tr-way">Путь в тысячу миль начинается с первого шага</h3>
<div class="line"></div>
<div class="about_wrap">
<div class="img-and-cont">
<picture>
<source lazySrcset="img/img/jV5Z766kh8g.webp" srcset="img/img/no-photo.jpg" type="image/webp"><img lazySrc="img/img/jV5Z766kh8g.jpg" src="img/img/no-photo.jpg" alt="name"></picture>
<div class="contact">
<div class="main-card">
<section>
<div class="content">
<div class="aside-card">
<h1 id="tr-info">Информация обо мне</h1>
</div><button class="niz"><span style="cursor:pointer;" id="tr-accounts">Мои аккаунты</span>
<svg width="48" height="48">
<use xlink:href='#down' />
</svg>
</button>
</div>
<div style="cursor:pointer;" class="title">
<p id="tr-write">Написать мне</p>
</div>
</section>
</div>
<div class="nav-card"><a href="https://hh.ru/applicant/resumes/view?resume=06913052ff033a719c0039ed1f746e5a65536a" target="_blank" class="gmail">
<div class="icons">
<svg width="48" height="48">
<use xlink:href='#hh' />
</svg>
</div>
<div class="content">
<h1>HeadHunter</h1>
</div>
<svg class="arrow" width="48" height="48">
<use xlink:href='#arr' />
</svg>
</a><a href="https://github.com/coolswood" target="_blank" class="facebook">
<div class="icon"><img src="img/img/skill/github.png" alt="git"></div>
<div class="content">
<h1>GitHub</h1>
</div><svg class="arrow" width="48" height="48">
<use xlink:href='#arr' />
</svg>
</a><a href="https://toster.ru/user/coolswood" target="_blank" class="twitter">
<div class="icon">T</div>
<div class="content">
<h1>Тостер</h1>
</div><svg class="arrow" width="48" height="48">
<use xlink:href='#arr' />
</svg>
</a><a href="https://www.codewars.com/users/coolswood" target="_blank" class="twitter">
<div class="icon"><img src="img/img/skill/codewars.png" alt="git"></div>
<div class="content">
<h1>codewars</h1>
</div><svg class="arrow" width="48" height="48">
<use xlink:href='#arr' />
</svg>
</a></div>
</div>
</div>
<div class="about_text">
<div class="about_brif">
<div class="about_brif-left">
<div class="brif-item">
<h5>ФИО:</h5>
<span>Сугоняев Даниил Олегович</span>
</div>
<div class="brif-item">
<h5>Возраст:</h5>
<span>24 года</span>
</div>
<div class="brif-item">
<h5>Мой опыт работы:</h5>
<span>3 года</span>
</div>
</div>
</div>
<div class="intend_text">
<div id="tr-description">
<span>Меня зовут Даниил и я веб программист со стажем работы более 3 лет. Мой технологический стек по большей части касается front-end разработки, в последнее время на личных проектах также использую back-end технологии.</span>
<span>Моя основная цель - развитие в JavaScript, это динамичный и богатый язык за которым будущее. На данном этапе он позволяет писать клиентские, серверные, десктопные кроссплатформенные, мобильные приложения, это открывает огромные возможности для развития.</span>
<span>На данный момент я специализируюсь на front-end разработке SPA приложений. Главный стек - React + Redux.</span>
<span>Имел опыт работы с SSR. Пока не планирую изменять свой основной стек, React является доминирующей js библиотекой и бурно развивается. Хотел бы добавить к стеку больше работы с node.js.</span>
<b>Немного о soft skills:</b>
<span>Я свободно чувствую себя в общении как с коллегами, так и руководством. Для руководителя могу презентовать проект, обосновать необходимость использования архитектуры и технологии. Не испытываю также проблем в коммуникации с коллегами. В формальной рабочей обстановке не стесняюсь спросить, если что-то мне непонятно у более опытного коллеги, с удовольствием сам делюсь знаниями с менее опытным. Вообще люблю и умею объяснять (мои навыки наставничества).</span>
<span>За дверями офиса веду активную социальную жизнь, в профессиональном плане - работа наставником, митапы, небольшой YouTube канал по технологиям.</span>
<span>В непрофессиональном - занятие боевыми искусствами, постановки в детском театре, английский клуб.</span>
<b>Подробно о hard skills:</b>
<span>Как я уже писал выше работаю со стеком React + Redux. Также имел опыт работы с Flux.</span>
<span>Активно изучаю серверный JavaScript - node.js, работы с базой данных mogodb. В моем портфолио вы можете увидеть примеры проектов, где были использованы эти технологии. В основном это создание API, чтение/запись в базу данных, парсинг информации со сторонних ресурсов.</span>
<span>Также имеются примеры созданных мной десктопных приложений на основе Electron.</span>
<span>Люблю и умею оптимизировать как классические сайты – оптимизация графических изображений, составление спрайтов, динамическая подгрузка контента, выделение критического css и тд., так и SPA приложения – правильная настройка webpack сборки, импорт только используемых функций из модулей, разделение сборки на бандлы и тд.</span>
</div>
<div id="tr-accordeon">
<section class="card accordeon">
<article>
<h1 data-accordion-element-trigger>АО «Открытие Брокер»</h1>
<div data-accordion-element-content class="content">
<p>
<span>Занимался развитием личного торгового кабинета пользователя. Личный кабинет – это SPA приложение без SSR. Впервые работал с большим проектом в связке с профессиональной командой, состоящей из аналитиков, разработчиков, тестировщиков, дизайнеров и все это в рамках взаимодействия с другими командами. Проект с большой историей, соответственно, пришлось столкнуться с поддержкой большого количества legacy кода. Специфика работы компании заставила обратить внимание на правильность работы с большими массивами данных, их получением, преобразованием и выводом в различных формах – создание таблиц, графиков. Для работы с графиками использовались следующие библиотеки - d3.js, c3.js, ECharts.</span>
<span>В то же время приходилось преобразовывать даты. Для этих целей на хорошем уровне освоил библиотеку – moment.js.</span>
<b>Стек технологий:</b>
<span>HTML, CSS, Stylus, Webpack, git, React, Redux, Flux, node.js, moment.js, d3.js, c3.js, ECharts</span>
</p>
</div>
</article>
<article>
<h1 data-accordion-element-trigger>Меховая фабрика «Каляев»</h1>
<div data-accordion-element-content class="content">
<p>
<span>Изначально устроился на условиях работы с более опытным front-end разработчиком под его началом, но спустя полтора месяца нашей совместной работы он уволился. Соответственно, после его ухода я стал ответственным за всю front-end разработку компании. Основная задача на проекте - постепенный перевод сайта на React + различные небольшие сторонние проекты компании. Данное место работы позволило мне набраться опыта серьезной разработки и работы в условиях сжатых сроков.</span>
<b>Стек технологий:</b>
<span>HTML, CSS, SCSS, Webpack, Postcss, REACT, Redux, node.js</span>
</p>
</div>
</article>
<article>
<h1 data-accordion-element-trigger>ООО «АСТРАЛ-М»</h1>
<div data-accordion-element-content class="content">
<p>
<span>Моя первая работа в команде. Был принят на должность верстальщика, подавляющая часть работы и касалась верстки, через некоторое время почувствовал необходимость дальнейшего роста и стал углубляться в изучение программирования. В этой компании я впервые попробовал работу с React, VUE приложениями.</span>
<b>Стек технологий:</b>
<span>HTML, CSS, Less, GULP, Postcss, Jquery, PHP, REACT, VUE, Redux, Webpack</span>
</p>
</div>
</article>
<article>
<h1 data-accordion-element-trigger>Веб студия MediaOnline</h1>
<div data-accordion-element-content class="content">
<p>
<span>Был единственным front-end специалистом, занимался в основном версткой, иногда приходилось оживлять страницы с помощью плагинов и собственного кода на jquery. Во время работы использовал средство автоматизации сборки – gulp. Верстал с использованием препроцессоров. В том числе были задачи по SEO сопровождению сайтов. SEO продвижение достигалось с помощью семантичной верстки, уменьшения веса страниц, оптимизации под мобильные устройства.</span>
<b>Стек технологий:</b>
<span>HTML, CSS, Stylus, GULP, Postcss, PUG, Jquery</span>
</p>
</div>
</article>
</section>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<!-- /About -->
<!-- skill -->
<div id="skill-p" class="panel">
<section class="about">
<div class="wrapper">
<h2 id="tr-main-tech">Основные технологии</h2>
<div class="line"></div>
<div class="skills">
<div class="skill html-skill"></div>
<div class="skill javascript-skill"></div>
<div class="skill php-skill"></div>
<div class="skill node-skill"></div>
</div>
<h2 id="tr-js-libs">Библиотеки JS</h2>
<div class="line"></div>
<div class="skills">
<div class="skill jquery-skill"></div>
<div class="skill react-skill"></div>
<div class="skill native-skill"></div>
<div class="skill vue-skill"></div>
<div class="skill electron-skill"></div>
</div>
<h2 id="tr-bd">Базы данных</h2>
<div class="line"></div>
<div class="skills">
<div class="skill mongodb-skill"></div>
</div>
<h2>CMS</h2>
<div class="line"></div>
<div class="skills">
<div class="skill wordpress-skill"></div>
<div class="skill opencart-skill"></div>
<div class="skill bitrix-skill"></div>
</div>
<h2 id="tr-builders">Cборщики проектов</h2>
<div class="line"></div>
<div class="skills">
<div class="skill webpack-skill"></div>
<div class="skill gulp-skill"></div>
</div>
<h2 id="tr-vers">Системы котроля версий</h2>
<div class="line"></div>
<div class="skills">
<div class="skill git-skill"></div>
</div>
<h2 id="tr-prepr">Препроцессоры</h2>
<div class="line"></div>
<div class="skills">
<div class="skill stylus-skill"></div>
<div class="skill less-skill"></div>
<div class="skill sass-skill"></div>
<div class="skill pug-skill"></div>
</div>
<h2 id="tr-design">Работа с графикой</h2>
<div class="line"></div>
<div class="skills">
<div class="skill photoshop-skill"></div>
<div class="skill xd-skill"></div>
<div class="skill avocode-skill"></div>
<div class="skill figma-skill"></div>
</div>
</div>
</section>
</div>
<!-- skill -->
<!-- Achievements -->
<div id="achievements" class="panel">
<section class="about">
<div class="wrapper">
<h2 id="tr-teacher">Наставничество в HTML академии</h2>
<div class="line"></div>
<div class="achievements skills">
<div class="achievement skill popaper" data-file="HTML&CSS_1">
<div class="achievement-img">
<img src="img/img/teacher.svg" alt="teacher">
</div>
<h3 id="tr-html_1">HTML и CSS, уровень 1</h3>
</div>
<div class="achievement skill popaper" data-file="HTML&CSS_2">
<div class="achievement-img">
<img src="img/img/teacher.svg" alt="teacher">
</div>
<h3 id="tr-html_1">HTML и CSS, уровень 2</h3>
</div>
</div>
<h2 id="tr-npm">NPM библиотеки</h2>
<div class="line"></div>
<div class="achievements skills npm">
<a href="https://www.npmjs.com/package/react-timer-simple" target="_blank" class="achievement skill">
<div class="npm-img">
<svg viewBox="0 0 780 250"><path fill="#231F20" d="M240,250h100v-50h100V0H240V250z M340,50h50v100h-50V50z M480,0v200h100V50h50v150h50V50h50v150h50V0H480z M0,200h100V50h50v150h50V0H0V200z"></path></svg>
</div>
<div class="npm-badges">
<img src="https://travis-ci.org/coolswood/react-timer-simple.svg?branch=master" alt="badges">
<img src="https://api.codeclimate.com/v1/badges/99a072a5ec6206373611/maintainability" alt="badges" />
<img src="https://img.shields.io/npm/dt/react-timer-simple.svg?style=flat" alt="NPM total downloads">
<img src="https://badge.fury.io/js/react-timer-simple.svg" alt="npm version" height="18">
<img src="https://img.shields.io/bundlephobia/minzip/react-timer-simple.svg" alt="Install Size">
</div>
<h3>react-timer-simple</h3>
</a>
</div>
</div>
</section>
</div>
<!-- Achievements -->
<!-- Portfolio -->
<div id="portfolio" class="panel">
<section class="about portfolios">
<div class="wrapper">
<h2 id="tr-projects">Мои проекты</h2>
<div class="line"></div>
<div class="portfolio">
<div class="portfolio-filter">
<button class="filter_item mixitup-control-active" data-filter="all">All (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".HTML">
HTML (<span class="count"></span>)
</button>
<button class="filter_item" data-filter=".javascript">JavaScript (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".node">Node.js (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".react">React (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".electron">Electron (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".vue">vue (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".jquery">JQUERY (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".wordpress">wordpress (<span class="count"></span>)</button>
<button class="filter_item" data-filter=".php">php (<span class="count"></span>)</button>
</div>
<div class="portfolio_works" id="container"></div>
</div>
</div>
</section>
</div>
<!-- svg спрайт -->
<svg display="none"><symbol id="down" viewBox="0 0 48 48"><g class="nc-icon-wrapper" fill="#c63535"><path d="M14.83 30.83L24 21.66l9.17 9.17L36 28 24 16 12 28z"></path></g></symbol><symbol id="hh" viewBox="0 0 48 48"><path d="M24 48c13.255 0 24-10.745 24-24S37.255 0 24 0 0 10.745 0 24s10.745 24 24 24" fill="#D6001C" /><path d="M13.65 13.169v8.164c1.243-1.482 2.733-2.228 4.461-2.228.89 0 1.687.17 2.402.507.717.335 1.253.765 1.615 1.287.364.527.61 1.104.743 1.74.132.633.198 1.618.198 2.954v8.729h-3.862V26.46c0-1.56-.07-2.548-.217-2.968a1.917 1.917 0 0 0-.775-1c-.372-.251-.835-.375-1.394-.375-.64 0-1.214.16-1.713.478-.51.32-.876.798-1.108 1.437-.236.64-.354 1.585-.35 2.836l-.004 7.454H9.789V13.169h3.862m15.206 0v8.164c1.244-1.482 2.733-2.228 4.46-2.228.887 0 1.69.17 2.406.507.714.335 1.25.765 1.61 1.287a4.69 4.69 0 0 1 .743 1.74c.133.633.199 1.618.199 2.954v8.729h-3.858V26.46c0-1.56-.073-2.548-.22-2.968a1.91 1.91 0 0 0-.777-1c-.368-.251-.835-.375-1.394-.375-.639 0-1.213.16-1.713.478-.503.32-.871.798-1.106 1.437-.232.64-.35 1.585-.35 2.836v7.454H25V13.169h3.857"fill="#FEFEFE" /></symbol><symbol id="arr" viewBox="0 0 48 48"><g class="nc-icon-wrapper" fill="#e6e6e6"><path d="M17.17 32.92l9.17-9.17-9.17-9.17L20 11.75l12 12-12 12z"></path></g></symbol><symbol id="vk" viewBox="0 -121 512 512"><path d="m457.742188 95.480469c52.980468-71.726563 41.230468-73.070313 54.257812-95.480469h-101.527344s-7.214844 25.050781-9.417968 29.535156c-19.5 39.660156-63.238282 99.167969-89.691407 105.25-26.046875 5.992188-22.589843-55.5625-20.984375-82.226562 1.511719-24.714844 1.253906-33.363282.527344-37.632813-1.0625-6.238281-6.296875-10.789062-12.578125-11.582031-12.949219-1.640625-36.445313-3.960938-62.757813-2.742188l-23.539062.78125c9.28125 20.761719 15.550781 14.398438 18.96875 38.417969 3.859375 28.121094 2.339844 96.546875-25.355469 96.546875-44.398437 0-94.234375-133.34375-95.820312-136.347656h-89.824219l8.21875 20.566406c66.238281 165.820313 149.082031 242.621094 262.429688 249.007813l14.75.425781 1.054687-14.324219c1.59375-22.121093 12.691406-53.964843 32.375-53.964843 29.082031 0 37.484375 8.46875 56.664063 32.167968 18.441406 22.722656 31.148437 36.121094 60.90625 36.121094h75.601562l-10.78125-21.679688c-16.835938-33.800781-50.605469-62.777343-63.792969-79.585937-4.777343-6.328125-9.480469-16.332031-4.613281-28.433594 3.980469-10.539062 15.832031-32.519531 24.929688-44.820312zm0 0"/></symbol><symbol id="whatsapp" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 90"><path d="M90 43.841c0 24.213-19.779 43.841-44.182 43.841a44.256 44.256 0 0 1-21.357-5.455L0 90l7.975-23.522a43.38 43.38 0 0 1-6.34-22.637C1.635 19.628 21.416 0 45.818 0 70.223 0 90 19.628 90 43.841zM45.818 6.982c-20.484 0-37.146 16.535-37.146 36.859 0 8.065 2.629 15.534 7.076 21.61L11.107 79.14l14.275-4.537A37.122 37.122 0 0 0 45.819 80.7c20.481 0 37.146-16.533 37.146-36.857S66.301 6.982 45.818 6.982zm22.311 46.956c-.273-.447-.994-.717-2.076-1.254-1.084-.537-6.41-3.138-7.4-3.495-.993-.358-1.717-.538-2.438.537-.721 1.076-2.797 3.495-3.43 4.212-.632.719-1.263.809-2.347.271-1.082-.537-4.571-1.673-8.708-5.333-3.219-2.848-5.393-6.364-6.025-7.441-.631-1.075-.066-1.656.475-2.191.488-.482 1.084-1.255 1.625-1.882.543-.628.723-1.075 1.082-1.793.363-.717.182-1.344-.09-1.883-.27-.537-2.438-5.825-3.34-7.977-.902-2.15-1.803-1.792-2.436-1.792-.631 0-1.354-.09-2.076-.09s-1.896.269-2.889 1.344c-.992 1.076-3.789 3.676-3.789 8.963 0 5.288 3.879 10.397 4.422 11.113.541.716 7.49 11.92 18.5 16.223C58.2 65.771 58.2 64.336 60.186 64.156c1.984-.179 6.406-2.599 7.312-5.107.9-2.512.9-4.663.631-5.111z"/></symbol><symbol id="telegram" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300"><path d="M5.299 144.645l69.126 25.8 26.756 86.047c1.712 5.511 8.451 7.548 12.924 3.891l38.532-31.412a11.496 11.496 0 0 1 14.013-.391l69.498 50.457c4.785 3.478 11.564.856 12.764-4.926L299.823 29.22c1.31-6.316-4.896-11.585-10.91-9.259L5.218 129.402c-7.001 2.7-6.94 12.612.081 15.243zm91.57 12.066l135.098-83.207c2.428-1.491 4.926 1.792 2.841 3.726L123.313 180.87a23.112 23.112 0 0 0-7.163 13.829l-3.798 28.146c-.503 3.758-5.782 4.131-6.819.494l-14.607-51.325c-1.673-5.854.765-12.107 5.943-15.303z"/></symbol><symbol id="home" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460.298 460.298"><path d="M230.149 120.939L65.986 256.274c0 .191-.048.472-.144.855-.094.38-.144.656-.144.852v137.041c0 4.948 1.809 9.236 5.426 12.847 3.616 3.613 7.898 5.431 12.847 5.431h109.63V303.664h73.097v109.64h109.629c4.948 0 9.236-1.814 12.847-5.435 3.617-3.607 5.432-7.898 5.432-12.847V257.981c0-.76-.104-1.334-.288-1.707L230.149 120.939z"/><path d="M457.122 225.438L394.6 173.476V56.989c0-2.663-.856-4.853-2.574-6.567-1.704-1.712-3.894-2.568-6.563-2.568h-54.816c-2.666 0-4.855.856-6.57 2.568-1.711 1.714-2.566 3.905-2.566 6.567v55.673l-69.662-58.245c-6.084-4.949-13.318-7.423-21.694-7.423-8.375 0-15.608 2.474-21.698 7.423L3.172 225.438c-1.903 1.52-2.946 3.566-3.14 6.136-.193 2.568.472 4.811 1.997 6.713l17.701 21.128c1.525 1.712 3.521 2.759 5.996 3.142 2.285.192 4.57-.476 6.855-1.998L230.149 95.817l197.57 164.741c1.526 1.328 3.521 1.991 5.996 1.991h.858c2.471-.376 4.463-1.43 5.996-3.138l17.703-21.125c1.522-1.906 2.189-4.145 1.991-6.716-.195-2.563-1.242-4.609-3.141-6.132z"/></symbol><symbol id="user" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 350 350"><path d="M175 171.173c38.914 0 70.463-38.318 70.463-85.586C245.463 38.318 235.105 0 175 0s-70.465 38.318-70.465 85.587c0 47.268 31.549 85.586 70.465 85.586zM41.909 301.853c-.012-2.882-.024-.812 0 0zM308.085 304.104c.038-.789.013-5.474 0 0z"/><path d="M307.935 298.397c-1.305-82.342-12.059-105.805-94.352-120.657 0 0-11.584 14.761-38.584 14.761s-38.586-14.761-38.586-14.761C55.018 192.43 43.61 215.545 42.11 295.722c-.123 6.547-.18 6.891-.202 6.131.005 1.424.011 4.058.011 8.651 0 0 19.592 39.496 133.08 39.496 113.486 0 133.08-39.496 133.08-39.496 0-2.951.002-5.003.005-6.399-.022.47-.066-.441-.149-5.708z"/></symbol><symbol id="card" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"><path d="M52.29 44.29c-.181.189-.29.45-.29.71s.1.52.29.71c.189.18.45.29.71.29s.52-.11.71-.29c.18-.19.29-.45.29-.71s-.11-.521-.29-.71c-.37-.36-1.04-.37-1.42 0zM23.642 42.265L20 40.405v-.387c1.628-.889 2.773-2.353 3.412-4.365A2.972 2.972 0 0 0 25 33.018v-1c0-.927-.431-1.786-1.151-2.35-.624-3.78-3.262-5.696-7.849-5.696-.217 0-.429.009-.636.025-1.206.099-2.364-.161-3.224-.741-.41-.276-.719-.544-.917-.796-.444-.563-1.368-.587-1.841-.059a1.202 1.202 0 0 0-.294.938c.042.372.105.808.2 1.285.193.975.193.975-.078 1.558-.102.221-.228.49-.376.853-.331.81-.566 1.697-.701 2.646A2.986 2.986 0 0 0 7 32.018v1c0 1.122.619 2.122 1.588 2.636.639 2.013 1.784 3.477 3.412 4.365v.376l-3.77 1.857A4.28 4.28 0 0 0 6 46.011v1.324c0 .803 0 2.683 10 2.683s10-1.88 10-2.683v-1.244a4.257 4.257 0 0 0-2.358-3.826zM31 29.018h10a1 1 0 1 0 0-2H31a1 1 0 1 0 0 2zM32 44.018h-1a1 1 0 1 0 0 2h1a1 1 0 1 0 0-2zM38 44.018h-2a1 1 0 1 0 0 2h2a1 1 0 1 0 0-2zM43 44.018h-1a1 1 0 1 0 0 2h1a1 1 0 1 0 0-2zM49 44.018h-2a1 1 0 1 0 0 2h2a1 1 0 1 0 0-2zM53 33.018H31a1 1 0 1 0 0 2h22a1 1 0 1 0 0-2zM53 39.018H31a1 1 0 1 0 0 2h22a1 1 0 1 0 0-2z"/><path d="M55.322 14H37V6.313A2.315 2.315 0 0 0 34.687 4h-9.375A2.315 2.315 0 0 0 23 6.313V14H4.678A4.684 4.684 0 0 0 0 18.678v32.645A4.684 4.684 0 0 0 4.678 56h50.645A4.684 4.684 0 0 0 60 51.322V18.678A4.684 4.684 0 0 0 55.322 14zM30 7c2.206 0 4 1.794 4 4s-1.794 4-4 4-4-1.794-4-4 1.794-4 4-4zm28 44.322A2.68 2.68 0 0 1 55.322 54H4.678A2.68 2.68 0 0 1 2 51.322V18.678A2.68 2.68 0 0 1 4.678 16H23v3.688A2.314 2.314 0 0 0 25.312 22h9.375A2.315 2.315 0 0 0 37 19.688V16h18.322A2.68 2.68 0 0 1 58 18.678v32.644z"/></symbol><symbol id="bag" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50.244 50.244"><path d="M27.587 29.787V28.67a2.464 2.464 0 0 0-4.927 0v1.117a2.464 2.464 0 0 0 4.927 0z"/><path d="M29.276 31.149c-.545 1.787-2.19 3.1-4.152 3.1-1.963 0-3.608-1.312-4.154-3.1H4.001a6.942 6.942 0 0 1-2.991-.681v11.267c0 2.2 1.8 4 4 4h40.226c2.2 0 4-1.8 4-4V30.469a6.94 6.94 0 0 1-2.99.681l-16.97-.001zM46.078 10.917h-9.602c-.579-3.626-3.722-6.408-7.508-6.408h-7.694c-3.787 0-6.927 2.782-7.508 6.408h-9.6c-2.292 0-4.167 1.8-4.167 4v9.233a4 4 0 0 0 4 4h16.78a4.344 4.344 0 0 1 1.332-2.933c.024-.022.052-.041.077-.063.173-.159.353-.309.55-.439.07-.047.15-.079.223-.121.162-.093.322-.19.497-.262.137-.057.285-.09.429-.133.124-.037.242-.086.371-.112a4.328 4.328 0 0 1 1.727 0c.128.026.247.075.372.112.144.043.29.076.429.134.174.072.333.168.495.261.073.043.153.075.225.122.197.129.376.279.549.438.025.023.056.041.078.065a4.338 4.338 0 0 1 1.332 2.933h16.78a4 4 0 0 0 4-4v-9.233c0-2.202-1.875-4.002-4.167-4.002zm-28.459 0c.51-1.541 1.947-2.664 3.657-2.664h7.694c1.709 0 3.146 1.123 3.656 2.664H17.619z"/></symbol><symbol id="menu" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M491.318 235.318H20.682C9.26 235.318 0 244.577 0 256s9.26 20.682 20.682 20.682h470.636c11.423 0 20.682-9.259 20.682-20.682 0-11.422-9.259-20.682-20.682-20.682zM491.318 78.439H20.682C9.26 78.439 0 87.699 0 99.121c0 11.422 9.26 20.682 20.682 20.682h470.636c11.423 0 20.682-9.26 20.682-20.682 0-11.422-9.259-20.682-20.682-20.682zM491.318 392.197H20.682C9.26 392.197 0 401.456 0 412.879s9.26 20.682 20.682 20.682h470.636c11.423 0 20.682-9.259 20.682-20.682s-9.259-20.682-20.682-20.682z"/></symbol><symbol id="close" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47.971 47.971"><path d="M28.228 23.986L47.092 5.122a2.998 2.998 0 0 0 0-4.242 2.998 2.998 0 0 0-4.242 0L23.986 19.744 5.121.88a2.998 2.998 0 0 0-4.242 0 2.998 2.998 0 0 0 0 4.242l18.865 18.864L.879 42.85a2.998 2.998 0 1 0 4.242 4.241l18.865-18.864L42.85 47.091c.586.586 1.354.879 2.121.879s1.535-.293 2.121-.879a2.998 2.998 0 0 0 0-4.242L28.228 23.986z"/></symbol><symbol id="priz" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512.001 512.001"><path d="M397.667 173.7c-4.557-34.01-21.311-65.298-47.176-88.102C324.39 62.586 290.833 49.913 256 49.913c-34.827 0-68.38 12.669-94.478 35.674-25.863 22.796-42.619 54.077-47.183 88.079a7.499 7.499 0 0 0 6.434 8.43c4.098.543 7.879-2.33 8.43-6.435C137.678 112.524 192.189 64.912 256 64.912c63.827 0 118.339 47.625 126.801 110.78a7.5 7.5 0 0 0 14.866-1.992zM391.328 202.216c-4.098-.49-7.854 2.412-8.364 6.522C375.058 272.62 320.475 320.793 256 320.793c-64.522 0-119.11-48.213-126.976-112.147a7.5 7.5 0 1 0-14.886 1.832c8.79 71.44 69.777 125.314 141.863 125.314 72.032 0 133.014-53.829 141.849-125.212a7.5 7.5 0 0 0-6.522-8.364z"/><path d="M459.383 429.099l-67.57-105.692a32.287 32.287 0 0 0 19.185-12.125 32.277 32.277 0 0 0 5.959-25.322c-1.404-7.518 2.396-15.151 9.242-18.562a32.277 32.277 0 0 0 16.616-20.014 32.278 32.278 0 0 0-3.591-25.762c-4.025-6.504-3.238-14.995 1.914-20.648a32.28 32.28 0 0 0 8.263-24.664 32.281 32.281 0 0 0-12.655-22.727c-6.103-4.61-8.436-12.811-5.674-19.944a32.278 32.278 0 0 0-1.204-25.984 32.282 32.282 0 0 0-20.011-16.622c-7.356-2.094-12.494-8.898-12.496-16.546a32.279 32.279 0 0 0-10.51-23.795 32.277 32.277 0 0 0-24.662-8.269c-7.62.69-14.865-3.784-17.629-10.916a32.28 32.28 0 0 0-18.396-18.392 32.28 32.28 0 0 0-25.985 1.199c-6.848 3.411-15.228 1.841-20.381-3.81h-.001A32.279 32.279 0 0 0 256 0a32.279 32.279 0 0 0-23.797 10.504c-5.154 5.65-13.535 7.218-20.383 3.811a32.27 32.27 0 0 0-25.984-1.2 32.275 32.275 0 0 0-18.396 18.392c-2.764 7.132-10.015 11.61-17.629 10.916a32.247 32.247 0 0 0-24.663 8.269 32.277 32.277 0 0 0-10.509 23.796c-.001 7.648-5.14 14.452-12.496 16.546a32.273 32.273 0 0 0-20.011 16.621 32.278 32.278 0 0 0-1.204 25.984c2.762 7.132.428 15.334-5.674 19.944a32.276 32.276 0 0 0-12.655 22.727 32.276 32.276 0 0 0 8.263 24.663c5.151 5.655 5.938 14.145 1.913 20.649a32.278 32.278 0 0 0-3.591 25.763A32.278 32.278 0 0 0 85.8 267.398c6.846 3.411 10.647 11.044 9.243 18.562a32.274 32.274 0 0 0 5.958 25.321 32.28 32.28 0 0 0 19.187 12.126l-67.57 105.692a11.946 11.946 0 0 0-.152 12.71c2.392 3.948 6.738 6.158 11.337 5.746l65.948-5.803 22.414 62.293a11.946 11.946 0 0 0 9.974 7.879c.46.052.917.077 1.371.077 4.079 0 7.863-2.049 10.1-5.549L256 377.575l82.39 128.876c2.238 3.501 6.022 5.549 10.101 5.549.454 0 .912-.025 1.372-.077a11.951 11.951 0 0 0 9.973-7.879l22.414-62.293 65.948 5.803a11.945 11.945 0 0 0 11.338-5.746 11.95 11.95 0 0 0-.153-12.709zm-390.872 2.985l65.878-103.047c2.344 2.383 4.016 5.439 4.658 8.873a32.263 32.263 0 0 0 9 16.945l-46.914 74.358-32.622 2.871zm77.425 10.351l-2.849-7.917c-1.847-5.134-6.942-8.393-12.369-7.909l-10.808.951 40.961-64.921a32.27 32.27 0 0 0 18.642.325c5.19-1.475 10.67-.367 14.866 2.691l-48.443 76.78zm18.293 50.841l-11.852-32.94 52.314-82.916a32.255 32.255 0 0 0 15.62 7.734c1.956.365 3.928.545 5.893.545 2.482 0 4.947-.3 7.351-.862l-69.326 108.439zm96.449-132.162a7.534 7.534 0 0 0-1.475-.175 32.524 32.524 0 0 0-6.409 0c-.496.01-.99.068-1.473.175-5.236.76-10.319 2.789-14.726 6.116-3.909 2.95-8.715 4.081-13.529 3.18-4.815-.899-8.888-3.689-11.467-7.853a31.461 31.461 0 0 0-1.511-2.202 7.596 7.596 0 0 0-.48-.627c-6.152-7.874-15.638-12.405-25.468-12.405-2.906 0-5.842.395-8.728 1.216-4.712 1.339-9.602.655-13.766-1.923-4.165-2.578-6.954-6.65-7.855-11.464-1.921-10.265-8.728-18.744-17.798-23.104a7.498 7.498 0 0 0-1.431-.647 31.86 31.86 0 0 0-9.451-2.395c-4.877-.453-9.189-2.855-12.141-6.764-2.952-3.91-4.083-8.714-3.184-13.53 2.627-14.07-4.486-28.356-17.298-34.739-4.384-2.184-7.537-5.982-8.878-10.693-1.34-4.712-.659-9.601 1.919-13.765 7.533-12.171 6.061-28.062-3.581-38.643-3.299-3.62-4.867-8.3-4.415-13.178.452-4.878 2.853-9.19 6.762-12.143 11.421-8.629 15.789-23.978 10.62-37.327-1.768-4.568-1.54-9.498.643-13.884 2.183-4.386 5.981-7.539 10.692-8.88 13.767-3.92 23.385-16.655 23.387-30.969.001-4.899 1.995-9.414 5.615-12.715 3.62-3.3 8.298-4.869 13.178-4.419 14.246 1.331 27.822-7.081 32.995-20.429 1.77-4.568 5.261-8.058 9.829-9.827 4.566-1.768 9.498-1.543 13.884.642 12.816 6.377 28.501 3.444 38.147-7.132 3.301-3.619 7.816-5.612 12.715-5.612s9.414 1.993 12.714 5.612c9.648 10.577 25.333 13.511 38.147 7.131 4.386-2.182 9.318-2.409 13.884-.641 4.568 1.769 8.059 5.259 9.829 9.826 5.172 13.347 18.731 21.747 32.995 20.43 4.883-.451 9.558 1.119 13.177 4.419 3.621 3.3 5.615 7.816 5.616 12.715.004 14.315 9.621 27.049 23.387 30.968 4.712 1.342 8.509 4.496 10.692 8.881s2.412 9.316.643 13.884c-5.169 13.349-.801 28.699 10.62 37.327 3.909 2.953 6.31 7.265 6.762 12.143.452 4.878-1.116 9.558-4.416 13.178-9.641 10.58-11.113 26.47-3.581 38.643 2.578 4.166 3.259 9.054 1.919 13.765-1.34 4.711-4.493 8.509-8.878 10.693-12.812 6.383-19.925 20.669-17.298 34.739.899 4.816-.231 9.62-3.183 13.53-2.952 3.909-7.264 6.311-12.142 6.764a31.862 31.862 0 0 0-9.45 2.395 7.517 7.517 0 0 0-1.427.645c-9.072 4.359-15.881 12.838-17.802 23.105-.901 4.815-3.691 8.887-7.856 11.466-4.166 2.579-9.054 3.261-13.765 1.922-12.617-3.59-26.155.972-34.134 11.125a7.794 7.794 0 0 0-.294.364c-.62.813-1.214 1.65-1.76 2.531-2.579 4.164-6.652 6.953-11.467 7.853-4.815.899-9.62-.229-13.53-3.181-4.405-3.328-9.488-5.357-14.724-6.117zm87.092 132.162l-69.316-108.424a32.214 32.214 0 0 0 13.236.302 32.255 32.255 0 0 0 15.617-7.732l52.315 82.916-11.852 32.938zm33.509-66.667c-5.419-.464-10.519 2.775-12.366 7.909l-2.85 7.922-48.444-76.781c4.196-3.059 9.677-4.169 14.867-2.693a32.262 32.262 0 0 0 18.64-.325l40.96 64.92-10.807-.952zm29.584 2.604l-46.913-74.355a32.28 32.28 0 0 0 9.002-16.947c.643-3.434 2.315-6.49 4.658-8.873l65.879 103.047-32.626-2.872z"/><path d="M350.236 165.814a9.943 9.943 0 0 0-8.181-7.162l-53.264-7.741-23.82-48.264a9.942 9.942 0 0 0-8.972-5.579 9.945 9.945 0 0 0-8.971 5.577l-23.821 48.265-53.228 7.736a7.499 7.499 0 0 0-.526.093c-.311.06-.622.133-.934.224a8.323 8.323 0 0 0-.607.207 8.883 8.883 0 0 0-.689.278 7.703 7.703 0 0 0-.602.304 8.802 8.802 0 0 0-1.024.634 9.494 9.494 0 0 0-.963.774 9.912 9.912 0 0 0-.85.879l-.104.125a9.992 9.992 0 0 0-1.815 3.307 9.946 9.946 0 0 0 2.535 10.244l38.543 37.569-9.101 53.062c-.038.22-.064.437-.084.655-.03.264-.05.534-.058.853-.002.136 0 .286.006.436a9.232 9.232 0 0 0 .131 1.395c.055.329.123.652.208.967a6.13 6.13 0 0 0 .088.297 9.997 9.997 0 0 0 2.642 4.292l.035.033c.308.293.642.572 1.024.852a9.974 9.974 0 0 0 5.86 1.913c1.59 0 3.188-.384 4.665-1.159L256 251.835l47.643 25.048a9.966 9.966 0 0 0 2.539.926c.071.016.143.03.215.045a9.818 9.818 0 0 0 1.404.169c.336.017.671.014 1.005-.004a9.266 9.266 0 0 0 1.404-.172c.117-.021.234-.046.35-.072a10.027 10.027 0 0 0 2.332-.862c.059-.029.116-.06.174-.091a9.95 9.95 0 0 0 .747-.452l.116-.076a9.947 9.947 0 0 0 4.229-9.958l-9.099-53.05 38.555-37.581c.352-.346.68-.717.982-1.113.117-.155.225-.31.327-.467.146-.215.286-.434.412-.655.022-.039.045-.079.066-.119a9.88 9.88 0 0 0 .442-.921 6.74 6.74 0 0 0 .158-.394c.098-.265.181-.53.255-.8a8.721 8.721 0 0 0 .294-1.476 9.937 9.937 0 0 0-.314-3.946zm-54.471 39.483a7.5 7.5 0 0 0-2.156 6.638l8.054 46.961-42.173-22.172a7.5 7.5 0 0 0-6.98 0l-42.173 22.172 8.055-46.961a7.5 7.5 0 0 0-2.157-6.638l-34.119-33.257 47.151-6.852a7.495 7.495 0 0 0 5.646-4.102L256 118.36l21.087 42.726a7.496 7.496 0 0 0 5.647 4.102l47.15 6.852-34.119 33.257z"/></symbol></svg>
<link href="css/main.css" rel="stylesheet">
<script defer type="text/javascript" src="js/js.js"></script>
<script defer type="text/javascript" src="js/main.js"></script>
<!-- Yandex.Metrika counter -->
<script type="text/javascript" >
!function(e,t,a){(t[a]=t[a]||[]).push(function(){try{t.yaCounter48184841=new Ya.Metrika({id:48184841,clickmap:!0,trackLinks:!0,accurateTrackBounce:!0,webvisor:!0})}catch(e){}});var c=e.getElementsByTagName("script")[0],n=e.createElement("script"),r=function(){c.parentNode.insertBefore(n,c)};n.type="text/javascript",n.async=!0,n.src="https://mc.yandex.ru/metrika/watch.js","[object Opera]"==t.opera?e.addEventListener("DOMContentLoaded",r,!1):r()}(document,window,"yandex_metrika_callbacks");
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/48184841" style="position:absolute; left:-9999px;" alt="pic" /></div></noscript>
<!-- /Yandex.Metrika counter -->
<div class="popap-wrap hidden"></div>
<div class="content-popap hidden">
<div class="students">
<button class="close">
<svg width="25px" height="25px">
<use xlink:href='#close' />
</svg>
</button>
<h3 id="tr-students">Студенты</h3>
<div class="table-include-place">
<div id="cube-loader">
<div class="caption">
<div class="cube-loader">
<div class="cube loader-1"></div>
<div class="cube loader-2"></div>
<div class="cube loader-4"></div>
<div class="cube loader-3"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="outdated">
<h6>Ваш браузер устарел!</h6>
<p>Обновите ваш браузер для правильного отображения этого сайта. <a id="btnUpdateBrowser" href="http://outdatedbrowser.com/ru">Обновить мой браузер</a></p>
<p class="last"><button id="btnCloseUpdateBrowser" title="Закрыть" aria-label="Закрыть">×</button></p>
</div>
<script type="text/javascript" src="js/translate.js" rel="preload" as="script"></script>
<link rel="stylesheet" href="js/outdatedbrowser/outdatedbrowser.min.css">
<script type="text/javascript">
outdatedBrowser({
bgColor: '#eb1717',
color: '#ffffff',
lowerThan: 'grid',
languagePath: ''
})
</script>
</body>
</html>