Commit a64ad713e6ca00a6f52fc15b747464079c31a734

Authored by Сергей П
1 parent e814e46c72
Exists in master

Изменения для анкеты работника

Showing 2 changed files with 24 additions and 1 deletions Inline Diff

public/css/style_may2024.css
1 /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ 1 /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
2 /* Document 2 /* Document
3 ========================================================================== */ 3 ========================================================================== */
4 /** 4 /**
5 * 1. Correct the line height in all browsers. 5 * 1. Correct the line height in all browsers.
6 * 2. Prevent adjustments of font size after orientation changes in iOS. 6 * 2. Prevent adjustments of font size after orientation changes in iOS.
7 */ 7 */
8 @import url(fonts.css); 8 @import url(fonts.css);
9 @import url(jquery.fancybox.css); 9 @import url(jquery.fancybox.css);
10 @import url(jquery.select2.css); 10 @import url(jquery.select2.css);
11 @import url(star-rating.min.css); 11 @import url(star-rating.min.css);
12 @import url(swiper.css); 12 @import url(swiper.css);
13 html { 13 html {
14 line-height: 1.15; /* 1 */ 14 line-height: 1.15; /* 1 */
15 -webkit-text-size-adjust: 100%; /* 2 */ 15 -webkit-text-size-adjust: 100%; /* 2 */
16 } 16 }
17 17
18 /* Sections 18 /* Sections
19 ========================================================================== */ 19 ========================================================================== */
20 /** 20 /**
21 * Remove the margin in all browsers. 21 * Remove the margin in all browsers.
22 */ 22 */
23 body { 23 body {
24 margin: 0; 24 margin: 0;
25 } 25 }
26 26
27 /** 27 /**
28 * Render the `main` element consistently in IE. 28 * Render the `main` element consistently in IE.
29 */ 29 */
30 main { 30 main {
31 display: block; 31 display: block;
32 } 32 }
33 33
34 /** 34 /**
35 * Correct the font size and margin on `h1` elements within `section` and 35 * Correct the font size and margin on `h1` elements within `section` and
36 * `article` contexts in Chrome, Firefox, and Safari. 36 * `article` contexts in Chrome, Firefox, and Safari.
37 */ 37 */
38 h1 { 38 h1 {
39 font-size: 2em; 39 font-size: 2em;
40 margin: 0.67em 0; 40 margin: 0.67em 0;
41 } 41 }
42 42
43 /* Grouping content 43 /* Grouping content
44 ========================================================================== */ 44 ========================================================================== */
45 /** 45 /**
46 * 1. Add the correct box sizing in Firefox. 46 * 1. Add the correct box sizing in Firefox.
47 * 2. Show the overflow in Edge and IE. 47 * 2. Show the overflow in Edge and IE.
48 */ 48 */
49 hr { 49 hr {
50 -webkit-box-sizing: content-box; 50 -webkit-box-sizing: content-box;
51 box-sizing: content-box; /* 1 */ 51 box-sizing: content-box; /* 1 */
52 height: 0; /* 1 */ 52 height: 0; /* 1 */
53 overflow: visible; /* 2 */ 53 overflow: visible; /* 2 */
54 } 54 }
55 55
56 /** 56 /**
57 * 1. Correct the inheritance and scaling of font size in all browsers. 57 * 1. Correct the inheritance and scaling of font size in all browsers.
58 * 2. Correct the odd `em` font sizing in all browsers. 58 * 2. Correct the odd `em` font sizing in all browsers.
59 */ 59 */
60 pre { 60 pre {
61 font-family: monospace, monospace; /* 1 */ 61 font-family: monospace, monospace; /* 1 */
62 font-size: 1em; /* 2 */ 62 font-size: 1em; /* 2 */
63 } 63 }
64 64
65 /* Text-level semantics 65 /* Text-level semantics
66 ========================================================================== */ 66 ========================================================================== */
67 /** 67 /**
68 * Remove the gray background on active links in IE 10. 68 * Remove the gray background on active links in IE 10.
69 */ 69 */
70 a { 70 a {
71 background-color: transparent; 71 background-color: transparent;
72 } 72 }
73 73
74 /** 74 /**
75 * 1. Remove the bottom border in Chrome 57- 75 * 1. Remove the bottom border in Chrome 57-
76 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 76 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
77 */ 77 */
78 abbr[title] { 78 abbr[title] {
79 border-bottom: none; /* 1 */ 79 border-bottom: none; /* 1 */
80 text-decoration: underline; /* 2 */ 80 text-decoration: underline; /* 2 */
81 -webkit-text-decoration: underline dotted; 81 -webkit-text-decoration: underline dotted;
82 text-decoration: underline dotted; /* 2 */ 82 text-decoration: underline dotted; /* 2 */
83 } 83 }
84 84
85 /** 85 /**
86 * Add the correct font weight in Chrome, Edge, and Safari. 86 * Add the correct font weight in Chrome, Edge, and Safari.
87 */ 87 */
88 b, 88 b,
89 strong { 89 strong {
90 font-weight: bolder; 90 font-weight: bolder;
91 } 91 }
92 92
93 /** 93 /**
94 * 1. Correct the inheritance and scaling of font size in all browsers. 94 * 1. Correct the inheritance and scaling of font size in all browsers.
95 * 2. Correct the odd `em` font sizing in all browsers. 95 * 2. Correct the odd `em` font sizing in all browsers.
96 */ 96 */
97 code, 97 code,
98 kbd, 98 kbd,
99 samp { 99 samp {
100 font-family: monospace, monospace; /* 1 */ 100 font-family: monospace, monospace; /* 1 */
101 font-size: 1em; /* 2 */ 101 font-size: 1em; /* 2 */
102 } 102 }
103 103
104 /** 104 /**
105 * Add the correct font size in all browsers. 105 * Add the correct font size in all browsers.
106 */ 106 */
107 small { 107 small {
108 font-size: 80%; 108 font-size: 80%;
109 } 109 }
110 110
111 /** 111 /**
112 * Prevent `sub` and `sup` elements from affecting the line height in 112 * Prevent `sub` and `sup` elements from affecting the line height in
113 * all browsers. 113 * all browsers.
114 */ 114 */
115 sub, 115 sub,
116 sup { 116 sup {
117 font-size: 75%; 117 font-size: 75%;
118 line-height: 0; 118 line-height: 0;
119 position: relative; 119 position: relative;
120 vertical-align: baseline; 120 vertical-align: baseline;
121 } 121 }
122 122
123 sub { 123 sub {
124 bottom: -0.25em; 124 bottom: -0.25em;
125 } 125 }
126 126
127 sup { 127 sup {
128 top: -0.5em; 128 top: -0.5em;
129 } 129 }
130 130
131 /* Embedded content 131 /* Embedded content
132 ========================================================================== */ 132 ========================================================================== */
133 /** 133 /**
134 * Remove the border on images inside links in IE 10. 134 * Remove the border on images inside links in IE 10.
135 */ 135 */
136 img { 136 img {
137 border-style: none; 137 border-style: none;
138 } 138 }
139 139
140 /* Forms 140 /* Forms
141 ========================================================================== */ 141 ========================================================================== */
142 /** 142 /**
143 * 1. Change the font styles in all browsers. 143 * 1. Change the font styles in all browsers.
144 * 2. Remove the margin in Firefox and Safari. 144 * 2. Remove the margin in Firefox and Safari.
145 */ 145 */
146 button, 146 button,
147 input, 147 input,
148 optgroup, 148 optgroup,
149 select, 149 select,
150 textarea { 150 textarea {
151 font-family: inherit; /* 1 */ 151 font-family: inherit; /* 1 */
152 font-size: 100%; /* 1 */ 152 font-size: 100%; /* 1 */
153 line-height: 1.15; /* 1 */ 153 line-height: 1.15; /* 1 */
154 margin: 0; /* 2 */ 154 margin: 0; /* 2 */
155 } 155 }
156 156
157 /** 157 /**
158 * Show the overflow in IE. 158 * Show the overflow in IE.
159 * 1. Show the overflow in Edge. 159 * 1. Show the overflow in Edge.
160 */ 160 */
161 button, 161 button,
162 input { /* 1 */ 162 input { /* 1 */
163 overflow: visible; 163 overflow: visible;
164 } 164 }
165 165
166 /** 166 /**
167 * Remove the inheritance of text transform in Edge, Firefox, and IE. 167 * Remove the inheritance of text transform in Edge, Firefox, and IE.
168 * 1. Remove the inheritance of text transform in Firefox. 168 * 1. Remove the inheritance of text transform in Firefox.
169 */ 169 */
170 button, 170 button,
171 select { /* 1 */ 171 select { /* 1 */
172 text-transform: none; 172 text-transform: none;
173 } 173 }
174 174
175 /** 175 /**
176 * Correct the inability to style clickable types in iOS and Safari. 176 * Correct the inability to style clickable types in iOS and Safari.
177 */ 177 */
178 button, 178 button,
179 [type=button], 179 [type=button],
180 [type=reset], 180 [type=reset],
181 [type=submit] { 181 [type=submit] {
182 -webkit-appearance: button; 182 -webkit-appearance: button;
183 } 183 }
184 184
185 /** 185 /**
186 * Remove the inner border and padding in Firefox. 186 * Remove the inner border and padding in Firefox.
187 */ 187 */
188 button::-moz-focus-inner, 188 button::-moz-focus-inner,
189 [type=button]::-moz-focus-inner, 189 [type=button]::-moz-focus-inner,
190 [type=reset]::-moz-focus-inner, 190 [type=reset]::-moz-focus-inner,
191 [type=submit]::-moz-focus-inner { 191 [type=submit]::-moz-focus-inner {
192 border-style: none; 192 border-style: none;
193 padding: 0; 193 padding: 0;
194 } 194 }
195 195
196 /** 196 /**
197 * Restore the focus styles unset by the previous rule. 197 * Restore the focus styles unset by the previous rule.
198 */ 198 */
199 button:-moz-focusring, 199 button:-moz-focusring,
200 [type=button]:-moz-focusring, 200 [type=button]:-moz-focusring,
201 [type=reset]:-moz-focusring, 201 [type=reset]:-moz-focusring,
202 [type=submit]:-moz-focusring { 202 [type=submit]:-moz-focusring {
203 outline: 1px dotted ButtonText; 203 outline: 1px dotted ButtonText;
204 } 204 }
205 205
206 /** 206 /**
207 * Correct the padding in Firefox. 207 * Correct the padding in Firefox.
208 */ 208 */
209 fieldset { 209 fieldset {
210 padding: 0.35em 0.75em 0.625em; 210 padding: 0.35em 0.75em 0.625em;
211 } 211 }
212 212
213 /** 213 /**
214 * 1. Correct the text wrapping in Edge and IE. 214 * 1. Correct the text wrapping in Edge and IE.
215 * 2. Correct the color inheritance from `fieldset` elements in IE. 215 * 2. Correct the color inheritance from `fieldset` elements in IE.
216 * 3. Remove the padding so developers are not caught out when they zero out 216 * 3. Remove the padding so developers are not caught out when they zero out
217 * `fieldset` elements in all browsers. 217 * `fieldset` elements in all browsers.
218 */ 218 */
219 legend { 219 legend {
220 -webkit-box-sizing: border-box; 220 -webkit-box-sizing: border-box;
221 box-sizing: border-box; /* 1 */ 221 box-sizing: border-box; /* 1 */
222 color: inherit; /* 2 */ 222 color: inherit; /* 2 */
223 display: table; /* 1 */ 223 display: table; /* 1 */
224 max-width: 100%; /* 1 */ 224 max-width: 100%; /* 1 */
225 padding: 0; /* 3 */ 225 padding: 0; /* 3 */
226 white-space: normal; /* 1 */ 226 white-space: normal; /* 1 */
227 } 227 }
228 228
229 /** 229 /**
230 * Add the correct vertical alignment in Chrome, Firefox, and Opera. 230 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
231 */ 231 */
232 progress { 232 progress {
233 vertical-align: baseline; 233 vertical-align: baseline;
234 } 234 }
235 235
236 /** 236 /**
237 * Remove the default vertical scrollbar in IE 10+. 237 * Remove the default vertical scrollbar in IE 10+.
238 */ 238 */
239 textarea { 239 textarea {
240 overflow: auto; 240 overflow: auto;
241 } 241 }
242 242
243 /** 243 /**
244 * 1. Add the correct box sizing in IE 10. 244 * 1. Add the correct box sizing in IE 10.
245 * 2. Remove the padding in IE 10. 245 * 2. Remove the padding in IE 10.
246 */ 246 */
247 [type=checkbox], 247 [type=checkbox],
248 [type=radio] { 248 [type=radio] {
249 -webkit-box-sizing: border-box; 249 -webkit-box-sizing: border-box;
250 box-sizing: border-box; /* 1 */ 250 box-sizing: border-box; /* 1 */
251 padding: 0; /* 2 */ 251 padding: 0; /* 2 */
252 } 252 }
253 253
254 /** 254 /**
255 * Correct the cursor style of increment and decrement buttons in Chrome. 255 * Correct the cursor style of increment and decrement buttons in Chrome.
256 */ 256 */
257 [type=number]::-webkit-inner-spin-button, 257 [type=number]::-webkit-inner-spin-button,
258 [type=number]::-webkit-outer-spin-button { 258 [type=number]::-webkit-outer-spin-button {
259 height: auto; 259 height: auto;
260 } 260 }
261 261
262 /** 262 /**
263 * 1. Correct the odd appearance in Chrome and Safari. 263 * 1. Correct the odd appearance in Chrome and Safari.
264 * 2. Correct the outline style in Safari. 264 * 2. Correct the outline style in Safari.
265 */ 265 */
266 [type=search] { 266 [type=search] {
267 -webkit-appearance: textfield; /* 1 */ 267 -webkit-appearance: textfield; /* 1 */
268 outline-offset: -2px; /* 2 */ 268 outline-offset: -2px; /* 2 */
269 } 269 }
270 270
271 /** 271 /**
272 * Remove the inner padding in Chrome and Safari on macOS. 272 * Remove the inner padding in Chrome and Safari on macOS.
273 */ 273 */
274 [type=search]::-webkit-search-decoration { 274 [type=search]::-webkit-search-decoration {
275 -webkit-appearance: none; 275 -webkit-appearance: none;
276 } 276 }
277 277
278 /** 278 /**
279 * 1. Correct the inability to style clickable types in iOS and Safari. 279 * 1. Correct the inability to style clickable types in iOS and Safari.
280 * 2. Change font properties to `inherit` in Safari. 280 * 2. Change font properties to `inherit` in Safari.
281 */ 281 */
282 ::-webkit-file-upload-button { 282 ::-webkit-file-upload-button {
283 -webkit-appearance: button; /* 1 */ 283 -webkit-appearance: button; /* 1 */
284 font: inherit; /* 2 */ 284 font: inherit; /* 2 */
285 } 285 }
286 286
287 /* Interactive 287 /* Interactive
288 ========================================================================== */ 288 ========================================================================== */
289 /* 289 /*
290 * Add the correct display in Edge, IE 10+, and Firefox. 290 * Add the correct display in Edge, IE 10+, and Firefox.
291 */ 291 */
292 details { 292 details {
293 display: block; 293 display: block;
294 } 294 }
295 295
296 /* 296 /*
297 * Add the correct display in all browsers. 297 * Add the correct display in all browsers.
298 */ 298 */
299 summary { 299 summary {
300 display: list-item; 300 display: list-item;
301 } 301 }
302 302
303 /* Misc 303 /* Misc
304 ========================================================================== */ 304 ========================================================================== */
305 /** 305 /**
306 * Add the correct display in IE 10+. 306 * Add the correct display in IE 10+.
307 */ 307 */
308 template { 308 template {
309 display: none; 309 display: none;
310 } 310 }
311 311
312 /** 312 /**
313 * Add the correct display in IE 10. 313 * Add the correct display in IE 10.
314 */ 314 */
315 [hidden] { 315 [hidden] {
316 display: none; 316 display: none;
317 } 317 }
318 318
319 .green { 319 .green {
320 color: #377d87; 320 color: #377d87;
321 } 321 }
322 322
323 .red { 323 .red {
324 color: #eb5757; 324 color: #eb5757;
325 } 325 }
326 326
327 .rotate180 { 327 .rotate180 {
328 -webkit-transform: rotate(180deg); 328 -webkit-transform: rotate(180deg);
329 -ms-transform: rotate(180deg); 329 -ms-transform: rotate(180deg);
330 transform: rotate(180deg); 330 transform: rotate(180deg);
331 } 331 }
332 332
333 ::-moz-selection { 333 ::-moz-selection {
334 color: #000; 334 color: #000;
335 background: #acc0e6; 335 background: #acc0e6;
336 } 336 }
337 337
338 ::selection { 338 ::selection {
339 color: #000; 339 color: #000;
340 background: #acc0e6; 340 background: #acc0e6;
341 } 341 }
342 342
343 ::-webkit-scrollbar { 343 ::-webkit-scrollbar {
344 width: 8px; 344 width: 8px;
345 height: 8px; 345 height: 8px;
346 } 346 }
347 347
348 ::-webkit-scrollbar-track { 348 ::-webkit-scrollbar-track {
349 border-radius: 999px; 349 border-radius: 999px;
350 background-color: #fff; 350 background-color: #fff;
351 } 351 }
352 352
353 ::-webkit-scrollbar-thumb { 353 ::-webkit-scrollbar-thumb {
354 border-radius: 999px; 354 border-radius: 999px;
355 background-color: #377d87; 355 background-color: #377d87;
356 } 356 }
357 357
358 ::-webkit-input-placeholder { 358 ::-webkit-input-placeholder {
359 color: #9c9d9d; 359 color: #9c9d9d;
360 opacity: 1; 360 opacity: 1;
361 } 361 }
362 362
363 :focus::-webkit-input-placeholder { 363 :focus::-webkit-input-placeholder {
364 color: transparent; 364 color: transparent;
365 } 365 }
366 366
367 :-ms-input-placeholder { 367 :-ms-input-placeholder {
368 color: #9c9d9d; 368 color: #9c9d9d;
369 opacity: 1; 369 opacity: 1;
370 } 370 }
371 371
372 :focus:-ms-input-placeholder { 372 :focus:-ms-input-placeholder {
373 color: transparent; 373 color: transparent;
374 } 374 }
375 375
376 ::-ms-input-placeholder { 376 ::-ms-input-placeholder {
377 color: #9c9d9d; 377 color: #9c9d9d;
378 opacity: 1; 378 opacity: 1;
379 } 379 }
380 380
381 :focus::-ms-input-placeholder { 381 :focus::-ms-input-placeholder {
382 color: transparent; 382 color: transparent;
383 } 383 }
384 384
385 ::-moz-placeholder { 385 ::-moz-placeholder {
386 color: #9c9d9d; 386 color: #9c9d9d;
387 opacity: 1; 387 opacity: 1;
388 } 388 }
389 389
390 :focus::-moz-placeholder { 390 :focus::-moz-placeholder {
391 color: transparent; 391 color: transparent;
392 } 392 }
393 393
394 ::-webkit-input-placeholder { 394 ::-webkit-input-placeholder {
395 color: #9c9d9d; 395 color: #9c9d9d;
396 opacity: 1; 396 opacity: 1;
397 } 397 }
398 398
399 ::-moz-placeholder { 399 ::-moz-placeholder {
400 color: #9c9d9d; 400 color: #9c9d9d;
401 opacity: 1; 401 opacity: 1;
402 } 402 }
403 403
404 :-ms-input-placeholder { 404 :-ms-input-placeholder {
405 color: #9c9d9d; 405 color: #9c9d9d;
406 opacity: 1; 406 opacity: 1;
407 } 407 }
408 408
409 ::-ms-input-placeholder { 409 ::-ms-input-placeholder {
410 color: #9c9d9d; 410 color: #9c9d9d;
411 opacity: 1; 411 opacity: 1;
412 } 412 }
413 413
414 ::placeholder { 414 ::placeholder {
415 color: #9c9d9d; 415 color: #9c9d9d;
416 opacity: 1; 416 opacity: 1;
417 } 417 }
418 418
419 :focus::-webkit-input-placeholder { 419 :focus::-webkit-input-placeholder {
420 color: transparent; 420 color: transparent;
421 } 421 }
422 422
423 :focus::-moz-placeholder { 423 :focus::-moz-placeholder {
424 color: transparent; 424 color: transparent;
425 } 425 }
426 426
427 :focus:-ms-input-placeholder { 427 :focus:-ms-input-placeholder {
428 color: transparent; 428 color: transparent;
429 } 429 }
430 430
431 :focus::-ms-input-placeholder { 431 :focus::-ms-input-placeholder {
432 color: transparent; 432 color: transparent;
433 } 433 }
434 434
435 :focus::placeholder { 435 :focus::placeholder {
436 color: transparent; 436 color: transparent;
437 } 437 }
438 438
439 *, 439 *,
440 *:before, 440 *:before,
441 *:after { 441 *:after {
442 -webkit-box-sizing: border-box; 442 -webkit-box-sizing: border-box;
443 box-sizing: border-box; 443 box-sizing: border-box;
444 -webkit-appearance: none; 444 -webkit-appearance: none;
445 -moz-appearance: none; 445 -moz-appearance: none;
446 appearance: none; 446 appearance: none;
447 outline: none; 447 outline: none;
448 -webkit-box-shadow: none; 448 -webkit-box-shadow: none;
449 box-shadow: none; 449 box-shadow: none;
450 } 450 }
451 451
452 a, 452 a,
453 button, 453 button,
454 select { 454 select {
455 color: inherit; 455 color: inherit;
456 } 456 }
457 457
458 a { 458 a {
459 text-decoration: none; 459 text-decoration: none;
460 } 460 }
461 461
462 a, 462 a,
463 input[type=button], 463 input[type=button],
464 input[type=submit], 464 input[type=submit],
465 button { 465 button {
466 -webkit-user-select: none; 466 -webkit-user-select: none;
467 -moz-user-select: none; 467 -moz-user-select: none;
468 -ms-user-select: none; 468 -ms-user-select: none;
469 user-select: none; 469 user-select: none;
470 -webkit-transition: 0.3s; 470 -webkit-transition: 0.3s;
471 transition: 0.3s; 471 transition: 0.3s;
472 cursor: pointer; 472 cursor: pointer;
473 } 473 }
474 474
475 [type=tel] { 475 [type=tel] {
476 letter-spacing: 1px; 476 letter-spacing: 1px;
477 } 477 }
478 478
479 .br, 479 .br,
480 img, 480 img,
481 svg { 481 svg {
482 display: block; 482 display: block;
483 } 483 }
484 484
485 .float-left { 485 .float-left {
486 float: left; 486 float: left;
487 } 487 }
488 488
489 .float-right { 489 .float-right {
490 float: right; 490 float: right;
491 } 491 }
492 492
493 .clear-both:after { 493 .clear-both:after {
494 content: ""; 494 content: "";
495 display: block; 495 display: block;
496 clear: both; 496 clear: both;
497 } 497 }
498 498
499 h1, 499 h1,
500 h2, 500 h2,
501 h3, 501 h3,
502 h4, 502 h4,
503 h5, 503 h5,
504 h6 { 504 h6 {
505 margin: 0; 505 margin: 0;
506 } 506 }
507 507
508 #body { 508 #body {
509 font-family: "Circe", sans-serif; 509 font-family: "Circe", sans-serif;
510 color: #000; 510 color: #000;
511 background: #fff; 511 background: #fff;
512 display: -webkit-box; 512 display: -webkit-box;
513 display: -ms-flexbox; 513 display: -ms-flexbox;
514 display: flex; 514 display: flex;
515 -webkit-box-orient: vertical; 515 -webkit-box-orient: vertical;
516 -webkit-box-direction: normal; 516 -webkit-box-direction: normal;
517 -ms-flex-direction: column; 517 -ms-flex-direction: column;
518 flex-direction: column; 518 flex-direction: column;
519 -webkit-box-pack: justify; 519 -webkit-box-pack: justify;
520 -ms-flex-pack: justify; 520 -ms-flex-pack: justify;
521 justify-content: space-between; 521 justify-content: space-between;
522 gap: 50px; 522 gap: 50px;
523 min-width: 320px; 523 min-width: 320px;
524 min-height: 100vh; 524 min-height: 100vh;
525 line-height: 1.25; 525 line-height: 1.25;
526 } 526 }
527 @media (min-width: 768px) { 527 @media (min-width: 768px) {
528 #body { 528 #body {
529 gap: 60px; 529 gap: 60px;
530 } 530 }
531 } 531 }
532 #body.pdf { 532 #body.pdf {
533 gap: 0; 533 gap: 0;
534 } 534 }
535 535
536 .container { 536 .container {
537 width: 100%; 537 width: 100%;
538 max-width: 1280px; 538 max-width: 1280px;
539 margin-left: auto; 539 margin-left: auto;
540 margin-right: auto; 540 margin-right: auto;
541 padding-left: 10px; 541 padding-left: 10px;
542 padding-right: 10px; 542 padding-right: 10px;
543 } 543 }
544 @media (min-width: 768px) { 544 @media (min-width: 768px) {
545 .container { 545 .container {
546 padding-left: 20px; 546 padding-left: 20px;
547 padding-right: 20px; 547 padding-right: 20px;
548 } 548 }
549 } 549 }
550 550
551 .to-top { 551 .to-top {
552 position: fixed; 552 position: fixed;
553 right: 10px; 553 right: 10px;
554 bottom: 10px; 554 bottom: 10px;
555 border-radius: 999px; 555 border-radius: 999px;
556 display: -webkit-box; 556 display: -webkit-box;
557 display: -ms-flexbox; 557 display: -ms-flexbox;
558 display: flex; 558 display: flex;
559 -webkit-box-pack: center; 559 -webkit-box-pack: center;
560 -ms-flex-pack: center; 560 -ms-flex-pack: center;
561 justify-content: center; 561 justify-content: center;
562 -webkit-box-align: center; 562 -webkit-box-align: center;
563 -ms-flex-align: center; 563 -ms-flex-align: center;
564 align-items: center; 564 align-items: center;
565 color: #fff; 565 color: #fff;
566 background: #377d87; 566 background: #377d87;
567 width: 40px; 567 width: 40px;
568 height: 40px; 568 height: 40px;
569 -webkit-transition: 0.3s; 569 -webkit-transition: 0.3s;
570 transition: 0.3s; 570 transition: 0.3s;
571 margin-right: -100px; 571 margin-right: -100px;
572 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 572 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
573 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 573 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
574 z-index: 99; 574 z-index: 99;
575 border: 1px solid #377d87; 575 border: 1px solid #377d87;
576 } 576 }
577 .to-top:hover { 577 .to-top:hover {
578 background: #fff; 578 background: #fff;
579 color: #377d87; 579 color: #377d87;
580 } 580 }
581 .to-top svg { 581 .to-top svg {
582 width: 10px; 582 width: 10px;
583 height: 10px; 583 height: 10px;
584 } 584 }
585 @media (min-width: 768px) { 585 @media (min-width: 768px) {
586 .to-top { 586 .to-top {
587 width: 50px; 587 width: 50px;
588 height: 50px; 588 height: 50px;
589 right: 20px; 589 right: 20px;
590 bottom: 20px; 590 bottom: 20px;
591 } 591 }
592 .to-top svg { 592 .to-top svg {
593 width: 12px; 593 width: 12px;
594 height: 12px; 594 height: 12px;
595 } 595 }
596 } 596 }
597 597
598 .begin .to-top { 598 .begin .to-top {
599 margin-right: 0; 599 margin-right: 0;
600 } 600 }
601 601
602 .socials { 602 .socials {
603 display: -webkit-box; 603 display: -webkit-box;
604 display: -ms-flexbox; 604 display: -ms-flexbox;
605 display: flex; 605 display: flex;
606 -webkit-box-align: center; 606 -webkit-box-align: center;
607 -ms-flex-align: center; 607 -ms-flex-align: center;
608 align-items: center; 608 align-items: center;
609 -webkit-box-pack: center; 609 -webkit-box-pack: center;
610 -ms-flex-pack: center; 610 -ms-flex-pack: center;
611 justify-content: center; 611 justify-content: center;
612 gap: 8px; 612 gap: 8px;
613 } 613 }
614 .socials a { 614 .socials a {
615 display: -webkit-box; 615 display: -webkit-box;
616 display: -ms-flexbox; 616 display: -ms-flexbox;
617 display: flex; 617 display: flex;
618 -webkit-box-align: center; 618 -webkit-box-align: center;
619 -ms-flex-align: center; 619 -ms-flex-align: center;
620 align-items: center; 620 align-items: center;
621 -webkit-box-pack: center; 621 -webkit-box-pack: center;
622 -ms-flex-pack: center; 622 -ms-flex-pack: center;
623 justify-content: center; 623 justify-content: center;
624 border: 1px solid #377d87; 624 border: 1px solid #377d87;
625 color: #377d87; 625 color: #377d87;
626 border-radius: 999px; 626 border-radius: 999px;
627 width: 38px; 627 width: 38px;
628 height: 38px; 628 height: 38px;
629 } 629 }
630 .socials a:hover { 630 .socials a:hover {
631 background: #377d87; 631 background: #377d87;
632 color: #fff; 632 color: #fff;
633 } 633 }
634 .socials svg { 634 .socials svg {
635 width: 12px; 635 width: 12px;
636 height: 12px; 636 height: 12px;
637 } 637 }
638 638
639 .nls { 639 .nls {
640 display: -webkit-box; 640 display: -webkit-box;
641 display: -ms-flexbox; 641 display: -ms-flexbox;
642 display: flex; 642 display: flex;
643 color: #000; 643 color: #000;
644 text-align: left; 644 text-align: left;
645 } 645 }
646 .nls:hover { 646 .nls:hover {
647 color: #377d87; 647 color: #377d87;
648 } 648 }
649 .nls svg { 649 .nls svg {
650 width: 30px; 650 width: 30px;
651 height: 40px; 651 height: 40px;
652 } 652 }
653 @media (min-width: 768px) { 653 @media (min-width: 768px) {
654 .nls svg { 654 .nls svg {
655 width: 24px; 655 width: 24px;
656 height: 31px; 656 height: 31px;
657 } 657 }
658 } 658 }
659 .nls span { 659 .nls span {
660 width: calc(100% - 30px); 660 width: calc(100% - 30px);
661 padding-left: 12px; 661 padding-left: 12px;
662 display: -webkit-box; 662 display: -webkit-box;
663 display: -ms-flexbox; 663 display: -ms-flexbox;
664 display: flex; 664 display: flex;
665 -webkit-box-orient: vertical; 665 -webkit-box-orient: vertical;
666 -webkit-box-direction: normal; 666 -webkit-box-direction: normal;
667 -ms-flex-direction: column; 667 -ms-flex-direction: column;
668 flex-direction: column; 668 flex-direction: column;
669 -webkit-box-pack: center; 669 -webkit-box-pack: center;
670 -ms-flex-pack: center; 670 -ms-flex-pack: center;
671 justify-content: center; 671 justify-content: center;
672 font-size: 12px; 672 font-size: 12px;
673 line-height: 1.4; 673 line-height: 1.4;
674 } 674 }
675 @media (min-width: 768px) { 675 @media (min-width: 768px) {
676 .nls span { 676 .nls span {
677 width: calc(100% - 24px); 677 width: calc(100% - 24px);
678 } 678 }
679 } 679 }
680 .nls b { 680 .nls b {
681 font-weight: 400; 681 font-weight: 400;
682 } 682 }
683 683
684 .title, 684 .title,
685 h1 { 685 h1 {
686 margin: 0; 686 margin: 0;
687 font-weight: 700; 687 font-weight: 700;
688 font-size: 32px; 688 font-size: 32px;
689 } 689 }
690 @media (min-width: 768px) { 690 @media (min-width: 768px) {
691 .title, 691 .title,
692 h1 { 692 h1 {
693 font-size: 40px; 693 font-size: 40px;
694 } 694 }
695 } 695 }
696 @media (min-width: 992px) { 696 @media (min-width: 992px) {
697 .title, 697 .title,
698 h1 { 698 h1 {
699 font-size: 48px; 699 font-size: 48px;
700 } 700 }
701 } 701 }
702 @media (min-width: 1280px) { 702 @media (min-width: 1280px) {
703 .title, 703 .title,
704 h1 { 704 h1 {
705 font-size: 64px; 705 font-size: 64px;
706 } 706 }
707 } 707 }
708 708
709 .swiper-pagination { 709 .swiper-pagination {
710 display: -webkit-box; 710 display: -webkit-box;
711 display: -ms-flexbox; 711 display: -ms-flexbox;
712 display: flex; 712 display: flex;
713 -webkit-box-pack: center; 713 -webkit-box-pack: center;
714 -ms-flex-pack: center; 714 -ms-flex-pack: center;
715 justify-content: center; 715 justify-content: center;
716 -webkit-box-align: center; 716 -webkit-box-align: center;
717 -ms-flex-align: center; 717 -ms-flex-align: center;
718 align-items: center; 718 align-items: center;
719 position: static; 719 position: static;
720 margin-top: 20px; 720 margin-top: 20px;
721 gap: 8px; 721 gap: 8px;
722 } 722 }
723 @media (min-width: 768px) { 723 @media (min-width: 768px) {
724 .swiper-pagination { 724 .swiper-pagination {
725 margin-top: 30px; 725 margin-top: 30px;
726 } 726 }
727 } 727 }
728 .swiper-pagination-bullet { 728 .swiper-pagination-bullet {
729 width: 16px; 729 width: 16px;
730 height: 16px; 730 height: 16px;
731 opacity: 1; 731 opacity: 1;
732 border: 1px solid #cdcece; 732 border: 1px solid #cdcece;
733 -webkit-transition: 0.3s; 733 -webkit-transition: 0.3s;
734 transition: 0.3s; 734 transition: 0.3s;
735 background: transparent; 735 background: transparent;
736 display: -webkit-box; 736 display: -webkit-box;
737 display: -ms-flexbox; 737 display: -ms-flexbox;
738 display: flex; 738 display: flex;
739 -webkit-box-pack: center; 739 -webkit-box-pack: center;
740 -ms-flex-pack: center; 740 -ms-flex-pack: center;
741 justify-content: center; 741 justify-content: center;
742 -webkit-box-align: center; 742 -webkit-box-align: center;
743 -ms-flex-align: center; 743 -ms-flex-align: center;
744 align-items: center; 744 align-items: center;
745 margin: 0 !important; 745 margin: 0 !important;
746 } 746 }
747 .swiper-pagination-bullet:before { 747 .swiper-pagination-bullet:before {
748 content: ""; 748 content: "";
749 width: 6px; 749 width: 6px;
750 height: 6px; 750 height: 6px;
751 border-radius: 999px; 751 border-radius: 999px;
752 background: #377d87; 752 background: #377d87;
753 opacity: 0; 753 opacity: 0;
754 -webkit-transition: 0.3s; 754 -webkit-transition: 0.3s;
755 transition: 0.3s; 755 transition: 0.3s;
756 } 756 }
757 .swiper-pagination-bullet:hover { 757 .swiper-pagination-bullet:hover {
758 border-color: #377d87; 758 border-color: #377d87;
759 } 759 }
760 .swiper-pagination-bullet-active { 760 .swiper-pagination-bullet-active {
761 border-color: #377d87; 761 border-color: #377d87;
762 } 762 }
763 .swiper-pagination-bullet-active:before { 763 .swiper-pagination-bullet-active:before {
764 opacity: 1; 764 opacity: 1;
765 } 765 }
766 766
767 .navs { 767 .navs {
768 display: -webkit-box; 768 display: -webkit-box;
769 display: -ms-flexbox; 769 display: -ms-flexbox;
770 display: flex; 770 display: flex;
771 -webkit-box-align: center; 771 -webkit-box-align: center;
772 -ms-flex-align: center; 772 -ms-flex-align: center;
773 align-items: center; 773 align-items: center;
774 -webkit-box-pack: justify; 774 -webkit-box-pack: justify;
775 -ms-flex-pack: justify; 775 -ms-flex-pack: justify;
776 justify-content: space-between; 776 justify-content: space-between;
777 gap: 20px; 777 gap: 20px;
778 width: 80px; 778 width: 80px;
779 } 779 }
780 .navs button { 780 .navs button {
781 color: #377d87; 781 color: #377d87;
782 background: none; 782 background: none;
783 border: none; 783 border: none;
784 padding: 0; 784 padding: 0;
785 } 785 }
786 .navs button[disabled] { 786 .navs button[disabled] {
787 cursor: not-allowed; 787 cursor: not-allowed;
788 color: #cddee1; 788 color: #cddee1;
789 } 789 }
790 .navs svg { 790 .navs svg {
791 width: 14px; 791 width: 14px;
792 height: 28px; 792 height: 28px;
793 } 793 }
794 794
795 .select { 795 .select {
796 position: relative; 796 position: relative;
797 } 797 }
798 .select2 { 798 .select2 {
799 width: 100% !important; 799 width: 100% !important;
800 } 800 }
801 .select2-container { 801 .select2-container {
802 font-size: 12px; 802 font-size: 12px;
803 } 803 }
804 @media (min-width: 768px) { 804 @media (min-width: 768px) {
805 .select2-container { 805 .select2-container {
806 font-size: 16px; 806 font-size: 16px;
807 } 807 }
808 } 808 }
809 .select2-container--open .select2-selection { 809 .select2-container--open .select2-selection {
810 border-color: #377d87 !important; 810 border-color: #377d87 !important;
811 } 811 }
812 .select2-container--open .select2-selection__arrow svg { 812 .select2-container--open .select2-selection__arrow svg {
813 -webkit-transform: rotate(180deg); 813 -webkit-transform: rotate(180deg);
814 -ms-transform: rotate(180deg); 814 -ms-transform: rotate(180deg);
815 transform: rotate(180deg); 815 transform: rotate(180deg);
816 } 816 }
817 .select2-selection { 817 .select2-selection {
818 min-height: 30px !important; 818 min-height: 30px !important;
819 border-radius: 8px !important; 819 border-radius: 8px !important;
820 border-color: #e7e7e7 !important; 820 border-color: #e7e7e7 !important;
821 -webkit-transition: 0.3s; 821 -webkit-transition: 0.3s;
822 transition: 0.3s; 822 transition: 0.3s;
823 } 823 }
824 @media (min-width: 768px) { 824 @media (min-width: 768px) {
825 .select2-selection { 825 .select2-selection {
826 min-height: 50px !important; 826 min-height: 50px !important;
827 } 827 }
828 } 828 }
829 .select2-selection__rendered { 829 .select2-selection__rendered {
830 line-height: 28px !important; 830 line-height: 28px !important;
831 padding: 0 30px 0 10px !important; 831 padding: 0 30px 0 10px !important;
832 } 832 }
833 @media (min-width: 768px) { 833 @media (min-width: 768px) {
834 .select2-selection__rendered { 834 .select2-selection__rendered {
835 line-height: 48px !important; 835 line-height: 48px !important;
836 padding: 0 46px 0 20px !important; 836 padding: 0 46px 0 20px !important;
837 } 837 }
838 } 838 }
839 .select2-selection--multiple .select2-selection__rendered { 839 .select2-selection--multiple .select2-selection__rendered {
840 display: -webkit-box !important; 840 display: -webkit-box !important;
841 display: -ms-flexbox !important; 841 display: -ms-flexbox !important;
842 display: flex !important; 842 display: flex !important;
843 -webkit-box-align: center; 843 -webkit-box-align: center;
844 -ms-flex-align: center; 844 -ms-flex-align: center;
845 align-items: center; 845 align-items: center;
846 -ms-flex-wrap: wrap; 846 -ms-flex-wrap: wrap;
847 flex-wrap: wrap; 847 flex-wrap: wrap;
848 gap: 10px; 848 gap: 10px;
849 padding-top: 10px !important; 849 padding-top: 10px !important;
850 padding-bottom: 10px !important; 850 padding-bottom: 10px !important;
851 } 851 }
852 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice { 852 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
853 margin: 0; 853 margin: 0;
854 } 854 }
855 .select2-selection__arrow { 855 .select2-selection__arrow {
856 top: 0 !important; 856 top: 0 !important;
857 right: 0 !important; 857 right: 0 !important;
858 width: 30px !important; 858 width: 30px !important;
859 height: 100% !important; 859 height: 100% !important;
860 display: -webkit-box; 860 display: -webkit-box;
861 display: -ms-flexbox; 861 display: -ms-flexbox;
862 display: flex; 862 display: flex;
863 -webkit-box-pack: center; 863 -webkit-box-pack: center;
864 -ms-flex-pack: center; 864 -ms-flex-pack: center;
865 justify-content: center; 865 justify-content: center;
866 -webkit-box-align: center; 866 -webkit-box-align: center;
867 -ms-flex-align: center; 867 -ms-flex-align: center;
868 align-items: center; 868 align-items: center;
869 color: #377d87; 869 color: #377d87;
870 } 870 }
871 @media (min-width: 768px) { 871 @media (min-width: 768px) {
872 .select2-selection__arrow { 872 .select2-selection__arrow {
873 width: 50px !important; 873 width: 50px !important;
874 } 874 }
875 } 875 }
876 .select2-selection__arrow svg { 876 .select2-selection__arrow svg {
877 width: 12px; 877 width: 12px;
878 height: 12px; 878 height: 12px;
879 -webkit-transition: 0.3s; 879 -webkit-transition: 0.3s;
880 transition: 0.3s; 880 transition: 0.3s;
881 } 881 }
882 @media (min-width: 768px) { 882 @media (min-width: 768px) {
883 .select2-selection__arrow svg { 883 .select2-selection__arrow svg {
884 width: 14px; 884 width: 14px;
885 height: 14px; 885 height: 14px;
886 } 886 }
887 } 887 }
888 .select2-selection__choice { 888 .select2-selection__choice {
889 display: -webkit-box; 889 display: -webkit-box;
890 display: -ms-flexbox; 890 display: -ms-flexbox;
891 display: flex; 891 display: flex;
892 -webkit-box-orient: horizontal; 892 -webkit-box-orient: horizontal;
893 -webkit-box-direction: reverse; 893 -webkit-box-direction: reverse;
894 -ms-flex-direction: row-reverse; 894 -ms-flex-direction: row-reverse;
895 flex-direction: row-reverse; 895 flex-direction: row-reverse;
896 -webkit-box-align: center; 896 -webkit-box-align: center;
897 -ms-flex-align: center; 897 -ms-flex-align: center;
898 align-items: center; 898 align-items: center;
899 -webkit-box-pack: center; 899 -webkit-box-pack: center;
900 -ms-flex-pack: center; 900 -ms-flex-pack: center;
901 justify-content: center; 901 justify-content: center;
902 gap: 4px; 902 gap: 4px;
903 padding: 0 4px 0 6px !important; 903 padding: 0 4px 0 6px !important;
904 background: #377d87 !important; 904 background: #377d87 !important;
905 border: none !important; 905 border: none !important;
906 border-radius: 6px !important; 906 border-radius: 6px !important;
907 line-height: 1 !important; 907 line-height: 1 !important;
908 color: #fff; 908 color: #fff;
909 height: 24px; 909 height: 24px;
910 } 910 }
911 @media (min-width: 768px) { 911 @media (min-width: 768px) {
912 .select2-selection__choice { 912 .select2-selection__choice {
913 height: 32px; 913 height: 32px;
914 gap: 6px; 914 gap: 6px;
915 padding: 0 6px 0 10px !important; 915 padding: 0 6px 0 10px !important;
916 border-radius: 8px !important; 916 border-radius: 8px !important;
917 } 917 }
918 } 918 }
919 .select2-selection__choice__remove { 919 .select2-selection__choice__remove {
920 width: 14px; 920 width: 14px;
921 height: 14px; 921 height: 14px;
922 padding-top: 4px; 922 padding-top: 4px;
923 display: -webkit-box !important; 923 display: -webkit-box !important;
924 display: -ms-flexbox !important; 924 display: -ms-flexbox !important;
925 display: flex !important; 925 display: flex !important;
926 -webkit-box-pack: center; 926 -webkit-box-pack: center;
927 -ms-flex-pack: center; 927 -ms-flex-pack: center;
928 justify-content: center; 928 justify-content: center;
929 -webkit-box-align: center; 929 -webkit-box-align: center;
930 -ms-flex-align: center; 930 -ms-flex-align: center;
931 align-items: center; 931 align-items: center;
932 color: #fff !important; 932 color: #fff !important;
933 font-weight: 400 !important; 933 font-weight: 400 !important;
934 font-size: 26px; 934 font-size: 26px;
935 } 935 }
936 .select2-search { 936 .select2-search {
937 display: none; 937 display: none;
938 } 938 }
939 .select2-dropdown { 939 .select2-dropdown {
940 z-index: 99999; 940 z-index: 99999;
941 border: none; 941 border: none;
942 border-radius: 0; 942 border-radius: 0;
943 background: none; 943 background: none;
944 padding: 5px 0; 944 padding: 5px 0;
945 } 945 }
946 @media (min-width: 768px) { 946 @media (min-width: 768px) {
947 .select2-dropdown { 947 .select2-dropdown {
948 padding: 10px 0; 948 padding: 10px 0;
949 } 949 }
950 } 950 }
951 .select2-results { 951 .select2-results {
952 background: #fff; 952 background: #fff;
953 border-radius: 8px; 953 border-radius: 8px;
954 border: 1px solid #377d87; 954 border: 1px solid #377d87;
955 overflow: hidden; 955 overflow: hidden;
956 } 956 }
957 @media (min-width: 768px) { 957 @media (min-width: 768px) {
958 .select2-results__option { 958 .select2-results__option {
959 padding: 10px 14px; 959 padding: 10px 14px;
960 } 960 }
961 } 961 }
962 .select2-results__option--highlighted { 962 .select2-results__option--highlighted {
963 background: #377d87 !important; 963 background: #377d87 !important;
964 } 964 }
965 @media (min-width: 768px) { 965 @media (min-width: 768px) {
966 .select_search .select2-selection__rendered { 966 .select_search .select2-selection__rendered {
967 padding-left: 60px !important; 967 padding-left: 60px !important;
968 } 968 }
969 } 969 }
970 .select_search .select__icon { 970 .select_search .select__icon {
971 display: none; 971 display: none;
972 height: 28px; 972 height: 28px;
973 -webkit-box-align: center; 973 -webkit-box-align: center;
974 -ms-flex-align: center; 974 -ms-flex-align: center;
975 align-items: center; 975 align-items: center;
976 padding-right: 12px; 976 padding-right: 12px;
977 z-index: 2; 977 z-index: 2;
978 position: absolute; 978 position: absolute;
979 top: 50%; 979 top: 50%;
980 left: 15px; 980 left: 15px;
981 margin-top: -14px; 981 margin-top: -14px;
982 } 982 }
983 @media (min-width: 768px) { 983 @media (min-width: 768px) {
984 .select_search .select__icon { 984 .select_search .select__icon {
985 display: -webkit-box; 985 display: -webkit-box;
986 display: -ms-flexbox; 986 display: -ms-flexbox;
987 display: flex; 987 display: flex;
988 } 988 }
989 } 989 }
990 .select_search .select__icon:after { 990 .select_search .select__icon:after {
991 content: ""; 991 content: "";
992 width: 1px; 992 width: 1px;
993 height: 100%; 993 height: 100%;
994 border-radius: 999px; 994 border-radius: 999px;
995 position: absolute; 995 position: absolute;
996 top: 0; 996 top: 0;
997 right: 0; 997 right: 0;
998 background: #cecece; 998 background: #cecece;
999 } 999 }
1000 .select_search .select__icon svg { 1000 .select_search .select__icon svg {
1001 color: #9c9d9d; 1001 color: #9c9d9d;
1002 width: 20px; 1002 width: 20px;
1003 height: 20px; 1003 height: 20px;
1004 } 1004 }
1005 1005
1006 .form-group { 1006 .form-group {
1007 display: -webkit-box; 1007 display: -webkit-box;
1008 display: -ms-flexbox; 1008 display: -ms-flexbox;
1009 display: flex; 1009 display: flex;
1010 -webkit-box-orient: vertical; 1010 -webkit-box-orient: vertical;
1011 -webkit-box-direction: normal; 1011 -webkit-box-direction: normal;
1012 -ms-flex-direction: column; 1012 -ms-flex-direction: column;
1013 flex-direction: column; 1013 flex-direction: column;
1014 gap: 4px; 1014 gap: 4px;
1015 } 1015 }
1016 .form-group__label { 1016 .form-group__label {
1017 font-size: 12px; 1017 font-size: 12px;
1018 } 1018 }
1019 @media (min-width: 768px) { 1019 @media (min-width: 768px) {
1020 .form-group__label { 1020 .form-group__label {
1021 font-size: 16px; 1021 font-size: 16px;
1022 } 1022 }
1023 } 1023 }
1024 .form-group__item { 1024 .form-group__item {
1025 display: -webkit-box; 1025 display: -webkit-box;
1026 display: -ms-flexbox; 1026 display: -ms-flexbox;
1027 display: flex; 1027 display: flex;
1028 -webkit-box-orient: vertical; 1028 -webkit-box-orient: vertical;
1029 -webkit-box-direction: normal; 1029 -webkit-box-direction: normal;
1030 -ms-flex-direction: column; 1030 -ms-flex-direction: column;
1031 flex-direction: column; 1031 flex-direction: column;
1032 position: relative; 1032 position: relative;
1033 } 1033 }
1034 1034
1035 .input { 1035 .input {
1036 display: block; 1036 display: block;
1037 height: 30px; 1037 height: 30px;
1038 border: 1px solid #cecece; 1038 border: 1px solid #cecece;
1039 background: #fff; 1039 background: #fff;
1040 font-size: 12px; 1040 font-size: 12px;
1041 border-radius: 8px; 1041 border-radius: 8px;
1042 padding: 0 10px; 1042 padding: 0 10px;
1043 color: #000; 1043 color: #000;
1044 -webkit-transition: 0.3s; 1044 -webkit-transition: 0.3s;
1045 transition: 0.3s; 1045 transition: 0.3s;
1046 position: relative; 1046 position: relative;
1047 z-index: 1; 1047 z-index: 1;
1048 } 1048 }
1049 @media (min-width: 768px) { 1049 @media (min-width: 768px) {
1050 .input { 1050 .input {
1051 padding: 0 20px; 1051 padding: 0 20px;
1052 height: 44px; 1052 height: 44px;
1053 font-size: 16px; 1053 font-size: 16px;
1054 } 1054 }
1055 } 1055 }
1056 .input:focus { 1056 .input:focus {
1057 border-color: #377d87; 1057 border-color: #377d87;
1058 } 1058 }
1059 .input[disabled] { 1059 .input[disabled] {
1060 color: #9c9d9d; 1060 color: #9c9d9d;
1061 background: #e7e7e7; 1061 background: #e7e7e7;
1062 } 1062 }
1063 .input[type=date] { 1063 .input[type=date] {
1064 text-transform: uppercase; 1064 text-transform: uppercase;
1065 } 1065 }
1066 1066
1067 .textarea { 1067 .textarea {
1068 resize: none; 1068 resize: none;
1069 display: block; 1069 display: block;
1070 width: 100%; 1070 width: 100%;
1071 border-radius: 8px; 1071 border-radius: 8px;
1072 border: 1px solid #cecece; 1072 border: 1px solid #cecece;
1073 background: #fff; 1073 background: #fff;
1074 -webkit-transition: 0.3s; 1074 -webkit-transition: 0.3s;
1075 transition: 0.3s; 1075 transition: 0.3s;
1076 font-size: 12px; 1076 font-size: 12px;
1077 line-height: 1.4; 1077 line-height: 1.4;
1078 padding: 10px; 1078 padding: 10px;
1079 aspect-ratio: 8/3; 1079 aspect-ratio: 8/3;
1080 max-height: 250px; 1080 max-height: 250px;
1081 } 1081 }
1082 @media (min-width: 768px) { 1082 @media (min-width: 768px) {
1083 .textarea { 1083 .textarea {
1084 padding: 20px; 1084 padding: 20px;
1085 font-size: 16px; 1085 font-size: 16px;
1086 height: 280px; 1086 height: 280px;
1087 } 1087 }
1088 } 1088 }
1089 .textarea:focus { 1089 .textarea:focus {
1090 border-color: #377d87; 1090 border-color: #377d87;
1091 } 1091 }
1092 1092
1093 .button { 1093 .button {
1094 display: -webkit-box; 1094 display: -webkit-box;
1095 display: -ms-flexbox; 1095 display: -ms-flexbox;
1096 display: flex; 1096 display: flex;
1097 -webkit-box-pack: center; 1097 -webkit-box-pack: center;
1098 -ms-flex-pack: center; 1098 -ms-flex-pack: center;
1099 justify-content: center; 1099 justify-content: center;
1100 -webkit-box-align: center; 1100 -webkit-box-align: center;
1101 -ms-flex-align: center; 1101 -ms-flex-align: center;
1102 align-items: center; 1102 align-items: center;
1103 color: #fff; 1103 color: #fff;
1104 background: #377d87; 1104 background: #377d87;
1105 height: 30px; 1105 height: 30px;
1106 border-radius: 8px; 1106 border-radius: 8px;
1107 padding: 0 12px; 1107 padding: 0 12px;
1108 border: 1px solid #377d87; 1108 border: 1px solid #377d87;
1109 font-weight: 700; 1109 font-weight: 700;
1110 font-size: 12px; 1110 font-size: 12px;
1111 text-align: center; 1111 text-align: center;
1112 line-height: 1; 1112 line-height: 1;
1113 gap: 6px; 1113 gap: 6px;
1114 -webkit-transition: 0.3s; 1114 -webkit-transition: 0.3s;
1115 transition: 0.3s; 1115 transition: 0.3s;
1116 cursor: pointer; 1116 cursor: pointer;
1117 } 1117 }
1118 @media (min-width: 768px) { 1118 @media (min-width: 768px) {
1119 .button { 1119 .button {
1120 padding: 0 24px; 1120 padding: 0 24px;
1121 font-size: 16px; 1121 font-size: 16px;
1122 height: 44px; 1122 height: 44px;
1123 gap: 12px; 1123 gap: 12px;
1124 } 1124 }
1125 } 1125 }
1126 @media (min-width: 992px) { 1126 @media (min-width: 992px) {
1127 .button { 1127 .button {
1128 padding: 0 36px; 1128 padding: 0 36px;
1129 } 1129 }
1130 } 1130 }
1131 .button:hover { 1131 .button:hover {
1132 background: transparent; 1132 background: transparent;
1133 color: #377d87; 1133 color: #377d87;
1134 } 1134 }
1135 .button img, 1135 .button img,
1136 .button svg { 1136 .button svg {
1137 width: 12px; 1137 width: 12px;
1138 height: 12px; 1138 height: 12px;
1139 } 1139 }
1140 @media (min-width: 768px) { 1140 @media (min-width: 768px) {
1141 .button img, 1141 .button img,
1142 .button svg { 1142 .button svg {
1143 width: 18px; 1143 width: 18px;
1144 height: 18px; 1144 height: 18px;
1145 } 1145 }
1146 } 1146 }
1147 .button_more span + span { 1147 .button_more span + span {
1148 display: none; 1148 display: none;
1149 } 1149 }
1150 .button_more.active span { 1150 .button_more.active span {
1151 display: none; 1151 display: none;
1152 } 1152 }
1153 .button_more.active span + span { 1153 .button_more.active span + span {
1154 display: block; 1154 display: block;
1155 } 1155 }
1156 .button_light { 1156 .button_light {
1157 background: transparent; 1157 background: transparent;
1158 color: #377d87; 1158 color: #377d87;
1159 } 1159 }
1160 .button_light:hover { 1160 .button_light:hover {
1161 background: #377d87; 1161 background: #377d87;
1162 color: #fff; 1162 color: #fff;
1163 } 1163 }
1164 .button_whited { 1164 .button_whited {
1165 background: #fff; 1165 background: #fff;
1166 color: #377d87; 1166 color: #377d87;
1167 border-color: #fff; 1167 border-color: #fff;
1168 } 1168 }
1169 .button_whited:hover { 1169 .button_whited:hover {
1170 background: #377d87; 1170 background: #377d87;
1171 color: #fff; 1171 color: #fff;
1172 } 1172 }
1173 1173
1174 .search { 1174 .search {
1175 width: 100%; 1175 width: 100%;
1176 position: relative; 1176 position: relative;
1177 background: #fff; 1177 background: #fff;
1178 border-radius: 8px; 1178 border-radius: 8px;
1179 } 1179 }
1180 .search span { 1180 .search span {
1181 display: none; 1181 display: none;
1182 height: 28px; 1182 height: 28px;
1183 -webkit-box-align: center; 1183 -webkit-box-align: center;
1184 -ms-flex-align: center; 1184 -ms-flex-align: center;
1185 align-items: center; 1185 align-items: center;
1186 padding-right: 12px; 1186 padding-right: 12px;
1187 z-index: 1; 1187 z-index: 1;
1188 position: absolute; 1188 position: absolute;
1189 top: 50%; 1189 top: 50%;
1190 left: 15px; 1190 left: 15px;
1191 margin-top: -14px; 1191 margin-top: -14px;
1192 } 1192 }
1193 @media (min-width: 768px) { 1193 @media (min-width: 768px) {
1194 .search span { 1194 .search span {
1195 display: -webkit-box; 1195 display: -webkit-box;
1196 display: -ms-flexbox; 1196 display: -ms-flexbox;
1197 display: flex; 1197 display: flex;
1198 } 1198 }
1199 } 1199 }
1200 .search span:after { 1200 .search span:after {
1201 content: ""; 1201 content: "";
1202 width: 1px; 1202 width: 1px;
1203 height: 100%; 1203 height: 100%;
1204 border-radius: 999px; 1204 border-radius: 999px;
1205 position: absolute; 1205 position: absolute;
1206 top: 0; 1206 top: 0;
1207 right: 0; 1207 right: 0;
1208 background: #cecece; 1208 background: #cecece;
1209 } 1209 }
1210 .search span svg { 1210 .search span svg {
1211 color: #9c9d9d; 1211 color: #9c9d9d;
1212 width: 20px; 1212 width: 20px;
1213 height: 20px; 1213 height: 20px;
1214 } 1214 }
1215 .search input { 1215 .search input {
1216 width: 100%; 1216 width: 100%;
1217 padding-right: 150px; 1217 padding-right: 150px;
1218 position: relative; 1218 position: relative;
1219 z-index: 2; 1219 z-index: 2;
1220 background: none; 1220 background: none;
1221 } 1221 }
1222 @media (min-width: 768px) { 1222 @media (min-width: 768px) {
1223 .search input { 1223 .search input {
1224 padding-left: 60px; 1224 padding-left: 60px;
1225 padding-right: 220px; 1225 padding-right: 220px;
1226 } 1226 }
1227 } 1227 }
1228 .search button { 1228 .search button {
1229 width: 140px; 1229 width: 140px;
1230 position: absolute; 1230 position: absolute;
1231 padding: 0; 1231 padding: 0;
1232 top: 0; 1232 top: 0;
1233 right: 0; 1233 right: 0;
1234 z-index: 3; 1234 z-index: 3;
1235 } 1235 }
1236 @media (min-width: 768px) { 1236 @media (min-width: 768px) {
1237 .search button { 1237 .search button {
1238 width: 200px; 1238 width: 200px;
1239 } 1239 }
1240 } 1240 }
1241 1241
1242 .breadcrumbs { 1242 .breadcrumbs {
1243 display: -webkit-box; 1243 display: -webkit-box;
1244 display: -ms-flexbox; 1244 display: -ms-flexbox;
1245 display: flex; 1245 display: flex;
1246 -webkit-box-align: center; 1246 -webkit-box-align: center;
1247 -ms-flex-align: center; 1247 -ms-flex-align: center;
1248 align-items: center; 1248 align-items: center;
1249 -ms-flex-wrap: wrap; 1249 -ms-flex-wrap: wrap;
1250 flex-wrap: wrap; 1250 flex-wrap: wrap;
1251 gap: 12px 6px; 1251 gap: 12px 6px;
1252 margin: 0; 1252 margin: 0;
1253 padding: 0; 1253 padding: 0;
1254 font-size: 11px; 1254 font-size: 11px;
1255 color: #cecece; 1255 color: #cecece;
1256 line-height: 1; 1256 line-height: 1;
1257 } 1257 }
1258 @media (min-width: 992px) { 1258 @media (min-width: 992px) {
1259 .breadcrumbs { 1259 .breadcrumbs {
1260 font-size: 13px; 1260 font-size: 13px;
1261 } 1261 }
1262 } 1262 }
1263 @media (min-width: 1280px) { 1263 @media (min-width: 1280px) {
1264 .breadcrumbs { 1264 .breadcrumbs {
1265 font-size: 16px; 1265 font-size: 16px;
1266 } 1266 }
1267 } 1267 }
1268 .breadcrumbs li { 1268 .breadcrumbs li {
1269 display: -webkit-box; 1269 display: -webkit-box;
1270 display: -ms-flexbox; 1270 display: -ms-flexbox;
1271 display: flex; 1271 display: flex;
1272 -webkit-box-align: center; 1272 -webkit-box-align: center;
1273 -ms-flex-align: center; 1273 -ms-flex-align: center;
1274 align-items: center; 1274 align-items: center;
1275 gap: 6px; 1275 gap: 6px;
1276 } 1276 }
1277 .breadcrumbs li:before { 1277 .breadcrumbs li:before {
1278 content: ""; 1278 content: "";
1279 width: 4px; 1279 width: 4px;
1280 height: 4px; 1280 height: 4px;
1281 background: #cecece; 1281 background: #cecece;
1282 border-radius: 999px; 1282 border-radius: 999px;
1283 position: relative; 1283 position: relative;
1284 top: -1px; 1284 top: -1px;
1285 } 1285 }
1286 .breadcrumbs li:first-child:before { 1286 .breadcrumbs li:first-child:before {
1287 display: none; 1287 display: none;
1288 } 1288 }
1289 .breadcrumbs li:last-child:before { 1289 .breadcrumbs li:last-child:before {
1290 background: #377d87; 1290 background: #377d87;
1291 } 1291 }
1292 .breadcrumbs a:hover { 1292 .breadcrumbs a:hover {
1293 color: #377d87; 1293 color: #377d87;
1294 } 1294 }
1295 .breadcrumbs b { 1295 .breadcrumbs b {
1296 color: #377d87; 1296 color: #377d87;
1297 font-weight: 700; 1297 font-weight: 700;
1298 } 1298 }
1299 1299
1300 .pagination { 1300 .pagination {
1301 display: -webkit-box; 1301 display: -webkit-box;
1302 display: -ms-flexbox; 1302 display: -ms-flexbox;
1303 display: flex; 1303 display: flex;
1304 -webkit-box-align: center; 1304 -webkit-box-align: center;
1305 -ms-flex-align: center; 1305 -ms-flex-align: center;
1306 align-items: center; 1306 align-items: center;
1307 -webkit-box-pack: center; 1307 -webkit-box-pack: center;
1308 -ms-flex-pack: center; 1308 -ms-flex-pack: center;
1309 justify-content: center; 1309 justify-content: center;
1310 -ms-flex-wrap: wrap; 1310 -ms-flex-wrap: wrap;
1311 flex-wrap: wrap; 1311 flex-wrap: wrap;
1312 line-height: 1; 1312 line-height: 1;
1313 color: #000; 1313 color: #000;
1314 font-size: 12px; 1314 font-size: 12px;
1315 margin: 0 auto; 1315 margin: 0 auto;
1316 } 1316 }
1317 @media (min-width: 768px) { 1317 @media (min-width: 768px) {
1318 .pagination { 1318 .pagination {
1319 font-size: 14px; 1319 font-size: 14px;
1320 gap: 3px; 1320 gap: 3px;
1321 } 1321 }
1322 } 1322 }
1323 .pagination__item { 1323 .pagination__item {
1324 width: 40px; 1324 width: 40px;
1325 height: 40px; 1325 height: 40px;
1326 display: -webkit-box; 1326 display: -webkit-box;
1327 display: -ms-flexbox; 1327 display: -ms-flexbox;
1328 display: flex; 1328 display: flex;
1329 -webkit-box-pack: center; 1329 -webkit-box-pack: center;
1330 -ms-flex-pack: center; 1330 -ms-flex-pack: center;
1331 justify-content: center; 1331 justify-content: center;
1332 -webkit-box-align: center; 1332 -webkit-box-align: center;
1333 -ms-flex-align: center; 1333 -ms-flex-align: center;
1334 align-items: center; 1334 align-items: center;
1335 background: none; 1335 background: none;
1336 padding: 0; 1336 padding: 0;
1337 border: 1px solid transparent; 1337 border: 1px solid transparent;
1338 border-radius: 8px; 1338 border-radius: 8px;
1339 } 1339 }
1340 .pagination__item:hover { 1340 .pagination__item:hover {
1341 -webkit-transition: 0s; 1341 -webkit-transition: 0s;
1342 transition: 0s; 1342 transition: 0s;
1343 color: #377d87; 1343 color: #377d87;
1344 font-weight: 700; 1344 font-weight: 700;
1345 } 1345 }
1346 .pagination__item.active { 1346 .pagination__item.active {
1347 font-weight: 700; 1347 font-weight: 700;
1348 color: #fff; 1348 color: #fff;
1349 background: #377d87; 1349 background: #377d87;
1350 border-color: #377d87; 1350 border-color: #377d87;
1351 } 1351 }
1352 .pagination__dots { 1352 .pagination__dots {
1353 width: 40px; 1353 width: 40px;
1354 height: 40px; 1354 height: 40px;
1355 display: -webkit-box; 1355 display: -webkit-box;
1356 display: -ms-flexbox; 1356 display: -ms-flexbox;
1357 display: flex; 1357 display: flex;
1358 -webkit-box-pack: center; 1358 -webkit-box-pack: center;
1359 -ms-flex-pack: center; 1359 -ms-flex-pack: center;
1360 justify-content: center; 1360 justify-content: center;
1361 -webkit-box-align: center; 1361 -webkit-box-align: center;
1362 -ms-flex-align: center; 1362 -ms-flex-align: center;
1363 align-items: center; 1363 align-items: center;
1364 } 1364 }
1365 .pagination__dots svg { 1365 .pagination__dots svg {
1366 width: 15px; 1366 width: 15px;
1367 height: 15px; 1367 height: 15px;
1368 } 1368 }
1369 .pagination__nav { 1369 .pagination__nav {
1370 width: 40px; 1370 width: 40px;
1371 height: 40px; 1371 height: 40px;
1372 display: none; 1372 display: none;
1373 -webkit-box-pack: center; 1373 -webkit-box-pack: center;
1374 -ms-flex-pack: center; 1374 -ms-flex-pack: center;
1375 justify-content: center; 1375 justify-content: center;
1376 -webkit-box-align: center; 1376 -webkit-box-align: center;
1377 -ms-flex-align: center; 1377 -ms-flex-align: center;
1378 align-items: center; 1378 align-items: center;
1379 background: none; 1379 background: none;
1380 padding: 0; 1380 padding: 0;
1381 border: 1px solid #cddee1; 1381 border: 1px solid #cddee1;
1382 color: #377d87; 1382 color: #377d87;
1383 border-radius: 8px; 1383 border-radius: 8px;
1384 } 1384 }
1385 @media (min-width: 768px) { 1385 @media (min-width: 768px) {
1386 .pagination__nav { 1386 .pagination__nav {
1387 display: -webkit-box; 1387 display: -webkit-box;
1388 display: -ms-flexbox; 1388 display: -ms-flexbox;
1389 display: flex; 1389 display: flex;
1390 } 1390 }
1391 } 1391 }
1392 .pagination__nav:hover { 1392 .pagination__nav:hover {
1393 border-color: #377d87; 1393 border-color: #377d87;
1394 background: #377d87; 1394 background: #377d87;
1395 color: #fff; 1395 color: #fff;
1396 } 1396 }
1397 .pagination__nav svg { 1397 .pagination__nav svg {
1398 width: 10px; 1398 width: 10px;
1399 height: 10px; 1399 height: 10px;
1400 } 1400 }
1401 .pagination__nav_prev { 1401 .pagination__nav_prev {
1402 margin-right: 37px; 1402 margin-right: 37px;
1403 } 1403 }
1404 .pagination__nav_prev svg { 1404 .pagination__nav_prev svg {
1405 -webkit-transform: rotate(180deg); 1405 -webkit-transform: rotate(180deg);
1406 -ms-transform: rotate(180deg); 1406 -ms-transform: rotate(180deg);
1407 transform: rotate(180deg); 1407 transform: rotate(180deg);
1408 } 1408 }
1409 .pagination__nav_next { 1409 .pagination__nav_next {
1410 margin-left: 37px; 1410 margin-left: 37px;
1411 } 1411 }
1412 1412
1413 .filters { 1413 .filters {
1414 display: -webkit-box; 1414 display: -webkit-box;
1415 display: -ms-flexbox; 1415 display: -ms-flexbox;
1416 display: flex; 1416 display: flex;
1417 -webkit-box-orient: vertical; 1417 -webkit-box-orient: vertical;
1418 -webkit-box-direction: normal; 1418 -webkit-box-direction: normal;
1419 -ms-flex-direction: column; 1419 -ms-flex-direction: column;
1420 flex-direction: column; 1420 flex-direction: column;
1421 gap: 10px; 1421 gap: 10px;
1422 } 1422 }
1423 @media (min-width: 768px) { 1423 @media (min-width: 768px) {
1424 .filters { 1424 .filters {
1425 -webkit-box-orient: horizontal; 1425 -webkit-box-orient: horizontal;
1426 -webkit-box-direction: normal; 1426 -webkit-box-direction: normal;
1427 -ms-flex-direction: row; 1427 -ms-flex-direction: row;
1428 flex-direction: row; 1428 flex-direction: row;
1429 -webkit-box-align: center; 1429 -webkit-box-align: center;
1430 -ms-flex-align: center; 1430 -ms-flex-align: center;
1431 align-items: center; 1431 align-items: center;
1432 -webkit-box-pack: justify; 1432 -webkit-box-pack: justify;
1433 -ms-flex-pack: justify; 1433 -ms-flex-pack: justify;
1434 justify-content: space-between; 1434 justify-content: space-between;
1435 } 1435 }
1436 } 1436 }
1437 .filters__label { 1437 .filters__label {
1438 color: #377d87; 1438 color: #377d87;
1439 font-size: 12px; 1439 font-size: 12px;
1440 font-weight: 700; 1440 font-weight: 700;
1441 } 1441 }
1442 @media (min-width: 768px) { 1442 @media (min-width: 768px) {
1443 .filters__label { 1443 .filters__label {
1444 font-size: 16px; 1444 font-size: 16px;
1445 } 1445 }
1446 } 1446 }
1447 @media (min-width: 992px) { 1447 @media (min-width: 992px) {
1448 .filters__label { 1448 .filters__label {
1449 font-size: 18px; 1449 font-size: 18px;
1450 } 1450 }
1451 } 1451 }
1452 .filters__body { 1452 .filters__body {
1453 display: -webkit-box; 1453 display: -webkit-box;
1454 display: -ms-flexbox; 1454 display: -ms-flexbox;
1455 display: flex; 1455 display: flex;
1456 -webkit-box-orient: vertical; 1456 -webkit-box-orient: vertical;
1457 -webkit-box-direction: normal; 1457 -webkit-box-direction: normal;
1458 -ms-flex-direction: column; 1458 -ms-flex-direction: column;
1459 flex-direction: column; 1459 flex-direction: column;
1460 } 1460 }
1461 @media (min-width: 768px) { 1461 @media (min-width: 768px) {
1462 .filters__body { 1462 .filters__body {
1463 -webkit-box-orient: horizontal; 1463 -webkit-box-orient: horizontal;
1464 -webkit-box-direction: normal; 1464 -webkit-box-direction: normal;
1465 -ms-flex-direction: row; 1465 -ms-flex-direction: row;
1466 flex-direction: row; 1466 flex-direction: row;
1467 -webkit-box-align: center; 1467 -webkit-box-align: center;
1468 -ms-flex-align: center; 1468 -ms-flex-align: center;
1469 align-items: center; 1469 align-items: center;
1470 } 1470 }
1471 } 1471 }
1472 @media (min-width: 768px) { 1472 @media (min-width: 768px) {
1473 .filters__select { 1473 .filters__select {
1474 width: 250px; 1474 width: 250px;
1475 } 1475 }
1476 } 1476 }
1477 @media (min-width: 992px) { 1477 @media (min-width: 992px) {
1478 .filters__select { 1478 .filters__select {
1479 width: 310px; 1479 width: 310px;
1480 } 1480 }
1481 } 1481 }
1482 .filters__item { 1482 .filters__item {
1483 display: none; 1483 display: none;
1484 -webkit-box-pack: center; 1484 -webkit-box-pack: center;
1485 -ms-flex-pack: center; 1485 -ms-flex-pack: center;
1486 justify-content: center; 1486 justify-content: center;
1487 -webkit-box-align: center; 1487 -webkit-box-align: center;
1488 -ms-flex-align: center; 1488 -ms-flex-align: center;
1489 align-items: center; 1489 align-items: center;
1490 width: 50px; 1490 width: 50px;
1491 height: 50px; 1491 height: 50px;
1492 padding: 0; 1492 padding: 0;
1493 background: #fff; 1493 background: #fff;
1494 border: 1px solid #377d87; 1494 border: 1px solid #377d87;
1495 color: #377d87; 1495 color: #377d87;
1496 border-radius: 8px; 1496 border-radius: 8px;
1497 margin-left: 20px; 1497 margin-left: 20px;
1498 } 1498 }
1499 @media (min-width: 768px) { 1499 @media (min-width: 768px) {
1500 .filters__item { 1500 .filters__item {
1501 display: -webkit-box; 1501 display: -webkit-box;
1502 display: -ms-flexbox; 1502 display: -ms-flexbox;
1503 display: flex; 1503 display: flex;
1504 } 1504 }
1505 } 1505 }
1506 .filters__item svg { 1506 .filters__item svg {
1507 width: 24px; 1507 width: 24px;
1508 height: 24px; 1508 height: 24px;
1509 } 1509 }
1510 .filters__item.active { 1510 .filters__item.active {
1511 background: #377d87; 1511 background: #377d87;
1512 color: #fff; 1512 color: #fff;
1513 } 1513 }
1514 .filters__item + .filters__item { 1514 .filters__item + .filters__item {
1515 margin-left: 8px; 1515 margin-left: 8px;
1516 } 1516 }
1517 1517
1518 .like, 1518 .like,
1519 .chat { 1519 .chat {
1520 width: 30px; 1520 width: 30px;
1521 height: 30px; 1521 height: 30px;
1522 display: -webkit-box; 1522 display: -webkit-box;
1523 display: -ms-flexbox; 1523 display: -ms-flexbox;
1524 display: flex; 1524 display: flex;
1525 -webkit-box-pack: center; 1525 -webkit-box-pack: center;
1526 -ms-flex-pack: center; 1526 -ms-flex-pack: center;
1527 justify-content: center; 1527 justify-content: center;
1528 -webkit-box-align: center; 1528 -webkit-box-align: center;
1529 -ms-flex-align: center; 1529 -ms-flex-align: center;
1530 align-items: center; 1530 align-items: center;
1531 background: none; 1531 background: none;
1532 border: 1px solid #377d87; 1532 border: 1px solid #377d87;
1533 padding: 0; 1533 padding: 0;
1534 color: #377d87; 1534 color: #377d87;
1535 border-radius: 6px; 1535 border-radius: 6px;
1536 } 1536 }
1537 @media (min-width: 768px) { 1537 @media (min-width: 768px) {
1538 .like, 1538 .like,
1539 .chat { 1539 .chat {
1540 width: 44px; 1540 width: 44px;
1541 height: 44px; 1541 height: 44px;
1542 } 1542 }
1543 } 1543 }
1544 .like.active, 1544 .like.active,
1545 .chat.active { 1545 .chat.active {
1546 background: #377d87; 1546 background: #377d87;
1547 color: #fff; 1547 color: #fff;
1548 } 1548 }
1549 .like svg, 1549 .like svg,
1550 .chat svg { 1550 .chat svg {
1551 width: 14px; 1551 width: 14px;
1552 height: 14px; 1552 height: 14px;
1553 } 1553 }
1554 @media (min-width: 768px) { 1554 @media (min-width: 768px) {
1555 .like svg, 1555 .like svg,
1556 .chat svg { 1556 .chat svg {
1557 width: 20px; 1557 width: 20px;
1558 height: 20px; 1558 height: 20px;
1559 } 1559 }
1560 } 1560 }
1561 1561
1562 .like.active { 1562 .like.active {
1563 background: #eb5757; 1563 background: #eb5757;
1564 border-color: #eb5757; 1564 border-color: #eb5757;
1565 } 1565 }
1566 1566
1567 .checkbox { 1567 .checkbox {
1568 display: -webkit-box; 1568 display: -webkit-box;
1569 display: -ms-flexbox; 1569 display: -ms-flexbox;
1570 display: flex; 1570 display: flex;
1571 -webkit-box-align: start; 1571 -webkit-box-align: start;
1572 -ms-flex-align: start; 1572 -ms-flex-align: start;
1573 align-items: flex-start; 1573 align-items: flex-start;
1574 cursor: pointer; 1574 cursor: pointer;
1575 position: relative; 1575 position: relative;
1576 } 1576 }
1577 .checkbox__input { 1577 .checkbox__input {
1578 position: absolute; 1578 position: absolute;
1579 z-index: 1; 1579 z-index: 1;
1580 width: 14px; 1580 width: 14px;
1581 height: 14px; 1581 height: 14px;
1582 padding: 0; 1582 padding: 0;
1583 background: none; 1583 background: none;
1584 border: none; 1584 border: none;
1585 opacity: 0; 1585 opacity: 0;
1586 } 1586 }
1587 @media (min-width: 768px) { 1587 @media (min-width: 768px) {
1588 .checkbox__input { 1588 .checkbox__input {
1589 width: 20px; 1589 width: 20px;
1590 height: 20px; 1590 height: 20px;
1591 } 1591 }
1592 } 1592 }
1593 .checkbox__icon { 1593 .checkbox__icon {
1594 width: 14px; 1594 width: 14px;
1595 height: 14px; 1595 height: 14px;
1596 border: 1px solid #cfcfcf; 1596 border: 1px solid #cfcfcf;
1597 background: #fff; 1597 background: #fff;
1598 color: #fff; 1598 color: #fff;
1599 display: -webkit-box; 1599 display: -webkit-box;
1600 display: -ms-flexbox; 1600 display: -ms-flexbox;
1601 display: flex; 1601 display: flex;
1602 -webkit-box-pack: center; 1602 -webkit-box-pack: center;
1603 -ms-flex-pack: center; 1603 -ms-flex-pack: center;
1604 justify-content: center; 1604 justify-content: center;
1605 -webkit-box-align: center; 1605 -webkit-box-align: center;
1606 -ms-flex-align: center; 1606 -ms-flex-align: center;
1607 align-items: center; 1607 align-items: center;
1608 border-radius: 4px; 1608 border-radius: 4px;
1609 -webkit-transition: 0.3s; 1609 -webkit-transition: 0.3s;
1610 transition: 0.3s; 1610 transition: 0.3s;
1611 position: relative; 1611 position: relative;
1612 z-index: 2; 1612 z-index: 2;
1613 } 1613 }
1614 @media (min-width: 768px) { 1614 @media (min-width: 768px) {
1615 .checkbox__icon { 1615 .checkbox__icon {
1616 width: 20px; 1616 width: 20px;
1617 height: 20px; 1617 height: 20px;
1618 } 1618 }
1619 } 1619 }
1620 .checkbox__icon svg { 1620 .checkbox__icon svg {
1621 width: 8px; 1621 width: 8px;
1622 height: 8px; 1622 height: 8px;
1623 opacity: 0; 1623 opacity: 0;
1624 } 1624 }
1625 @media (min-width: 768px) { 1625 @media (min-width: 768px) {
1626 .checkbox__icon svg { 1626 .checkbox__icon svg {
1627 width: 10px; 1627 width: 10px;
1628 height: 10px; 1628 height: 10px;
1629 } 1629 }
1630 } 1630 }
1631 .checkbox__input:checked + .checkbox__icon { 1631 .checkbox__input:checked + .checkbox__icon {
1632 border-color: #377d87; 1632 border-color: #377d87;
1633 background: #377d87; 1633 background: #377d87;
1634 } 1634 }
1635 .checkbox__input:checked + .checkbox__icon svg { 1635 .checkbox__input:checked + .checkbox__icon svg {
1636 opacity: 1; 1636 opacity: 1;
1637 } 1637 }
1638 .checkbox__text { 1638 .checkbox__text {
1639 width: calc(100% - 14px); 1639 width: calc(100% - 14px);
1640 padding-left: 6px; 1640 padding-left: 6px;
1641 font-size: 12px; 1641 font-size: 12px;
1642 line-height: 1; 1642 line-height: 1;
1643 display: -webkit-box; 1643 display: -webkit-box;
1644 display: -ms-flexbox; 1644 display: -ms-flexbox;
1645 display: flex; 1645 display: flex;
1646 -webkit-box-align: center; 1646 -webkit-box-align: center;
1647 -ms-flex-align: center; 1647 -ms-flex-align: center;
1648 align-items: center; 1648 align-items: center;
1649 min-height: 14px; 1649 min-height: 14px;
1650 } 1650 }
1651 @media (min-width: 768px) { 1651 @media (min-width: 768px) {
1652 .checkbox__text { 1652 .checkbox__text {
1653 width: calc(100% - 20px); 1653 width: calc(100% - 20px);
1654 padding-left: 12px; 1654 padding-left: 12px;
1655 font-size: 15px; 1655 font-size: 15px;
1656 min-height: 20px; 1656 min-height: 20px;
1657 } 1657 }
1658 } 1658 }
1659 .checkbox__text a { 1659 .checkbox__text a {
1660 color: #377d87; 1660 color: #377d87;
1661 text-decoration: underline; 1661 text-decoration: underline;
1662 } 1662 }
1663 1663
1664 .file { 1664 .file {
1665 display: -webkit-box; 1665 display: -webkit-box;
1666 display: -ms-flexbox; 1666 display: -ms-flexbox;
1667 display: flex; 1667 display: flex;
1668 -webkit-box-orient: vertical; 1668 -webkit-box-orient: vertical;
1669 -webkit-box-direction: normal; 1669 -webkit-box-direction: normal;
1670 -ms-flex-direction: column; 1670 -ms-flex-direction: column;
1671 flex-direction: column; 1671 flex-direction: column;
1672 } 1672 }
1673 .file__input input { 1673 .file__input input {
1674 display: none; 1674 display: none;
1675 } 1675 }
1676 .file__list { 1676 .file__list {
1677 display: -webkit-box; 1677 display: -webkit-box;
1678 display: -ms-flexbox; 1678 display: -ms-flexbox;
1679 display: flex; 1679 display: flex;
1680 -webkit-box-orient: vertical; 1680 -webkit-box-orient: vertical;
1681 -webkit-box-direction: normal; 1681 -webkit-box-direction: normal;
1682 -ms-flex-direction: column; 1682 -ms-flex-direction: column;
1683 flex-direction: column; 1683 flex-direction: column;
1684 } 1684 }
1685 .file__list-item { 1685 .file__list-item {
1686 display: -webkit-box; 1686 display: -webkit-box;
1687 display: -ms-flexbox; 1687 display: -ms-flexbox;
1688 display: flex; 1688 display: flex;
1689 -webkit-box-align: start; 1689 -webkit-box-align: start;
1690 -ms-flex-align: start; 1690 -ms-flex-align: start;
1691 align-items: flex-start; 1691 align-items: flex-start;
1692 margin-top: 16px; 1692 margin-top: 16px;
1693 } 1693 }
1694 .file__list-item-left { 1694 .file__list-item-left {
1695 width: calc(100% - 16px); 1695 width: calc(100% - 16px);
1696 min-height: 16px; 1696 min-height: 16px;
1697 color: #9c9d9d; 1697 color: #9c9d9d;
1698 font-size: 12px; 1698 font-size: 12px;
1699 display: -webkit-box; 1699 display: -webkit-box;
1700 display: -ms-flexbox; 1700 display: -ms-flexbox;
1701 display: flex; 1701 display: flex;
1702 -webkit-box-align: start; 1702 -webkit-box-align: start;
1703 -ms-flex-align: start; 1703 -ms-flex-align: start;
1704 align-items: flex-start; 1704 align-items: flex-start;
1705 } 1705 }
1706 @media (min-width: 768px) { 1706 @media (min-width: 768px) {
1707 .file__list-item-left { 1707 .file__list-item-left {
1708 width: auto; 1708 width: auto;
1709 max-width: calc(100% - 16px); 1709 max-width: calc(100% - 16px);
1710 font-size: 16px; 1710 font-size: 16px;
1711 } 1711 }
1712 } 1712 }
1713 .file__list-item-left svg { 1713 .file__list-item-left svg {
1714 width: 16px; 1714 width: 16px;
1715 height: 16px; 1715 height: 16px;
1716 } 1716 }
1717 .file__list-item-left span { 1717 .file__list-item-left span {
1718 width: calc(100% - 16px); 1718 width: calc(100% - 16px);
1719 min-height: 16px; 1719 min-height: 16px;
1720 display: -webkit-box; 1720 display: -webkit-box;
1721 display: -ms-flexbox; 1721 display: -ms-flexbox;
1722 display: flex; 1722 display: flex;
1723 -webkit-box-align: center; 1723 -webkit-box-align: center;
1724 -ms-flex-align: center; 1724 -ms-flex-align: center;
1725 align-items: center; 1725 align-items: center;
1726 padding: 0 8px; 1726 padding: 0 8px;
1727 } 1727 }
1728 .file__list-item-right { 1728 .file__list-item-right {
1729 display: -webkit-box; 1729 display: -webkit-box;
1730 display: -ms-flexbox; 1730 display: -ms-flexbox;
1731 display: flex; 1731 display: flex;
1732 -webkit-box-pack: center; 1732 -webkit-box-pack: center;
1733 -ms-flex-pack: center; 1733 -ms-flex-pack: center;
1734 justify-content: center; 1734 justify-content: center;
1735 -webkit-box-align: center; 1735 -webkit-box-align: center;
1736 -ms-flex-align: center; 1736 -ms-flex-align: center;
1737 align-items: center; 1737 align-items: center;
1738 padding: 0; 1738 padding: 0;
1739 background: none; 1739 background: none;
1740 border: none; 1740 border: none;
1741 width: 16px; 1741 width: 16px;
1742 height: 16px; 1742 height: 16px;
1743 color: #377d87; 1743 color: #377d87;
1744 } 1744 }
1745 .file__list-item-right:hover { 1745 .file__list-item-right:hover {
1746 color: #000; 1746 color: #000;
1747 } 1747 }
1748 .file__list-item-right svg { 1748 .file__list-item-right svg {
1749 width: 10px; 1749 width: 10px;
1750 height: 10px; 1750 height: 10px;
1751 } 1751 }
1752 .file__list-item + .file__list-item { 1752 .file__list-item + .file__list-item {
1753 margin-top: 10px; 1753 margin-top: 10px;
1754 } 1754 }
1755 1755
1756 .rate { 1756 .rate {
1757 display: -webkit-box; 1757 display: -webkit-box;
1758 display: -ms-flexbox; 1758 display: -ms-flexbox;
1759 display: flex; 1759 display: flex;
1760 -webkit-box-align: center; 1760 -webkit-box-align: center;
1761 -ms-flex-align: center; 1761 -ms-flex-align: center;
1762 align-items: center; 1762 align-items: center;
1763 gap: 10px; 1763 gap: 10px;
1764 } 1764 }
1765 @media (min-width: 768px) { 1765 @media (min-width: 768px) {
1766 .rate { 1766 .rate {
1767 gap: 20px; 1767 gap: 20px;
1768 } 1768 }
1769 } 1769 }
1770 .rate__label { 1770 .rate__label {
1771 font-size: 12px; 1771 font-size: 12px;
1772 font-weight: 700; 1772 font-weight: 700;
1773 line-height: 1; 1773 line-height: 1;
1774 } 1774 }
1775 @media (min-width: 768px) { 1775 @media (min-width: 768px) {
1776 .rate__label { 1776 .rate__label {
1777 font-size: 18px; 1777 font-size: 18px;
1778 } 1778 }
1779 } 1779 }
1780 .rate__stars { 1780 .rate__stars {
1781 display: -webkit-box; 1781 display: -webkit-box;
1782 display: -ms-flexbox; 1782 display: -ms-flexbox;
1783 display: flex; 1783 display: flex;
1784 -webkit-box-orient: vertical; 1784 -webkit-box-orient: vertical;
1785 -webkit-box-direction: normal; 1785 -webkit-box-direction: normal;
1786 -ms-flex-direction: column; 1786 -ms-flex-direction: column;
1787 flex-direction: column; 1787 flex-direction: column;
1788 } 1788 }
1789 1789
1790 .back { 1790 .back {
1791 display: -webkit-box; 1791 display: -webkit-box;
1792 display: -ms-flexbox; 1792 display: -ms-flexbox;
1793 display: flex; 1793 display: flex;
1794 -webkit-box-align: center; 1794 -webkit-box-align: center;
1795 -ms-flex-align: center; 1795 -ms-flex-align: center;
1796 align-items: center; 1796 align-items: center;
1797 font-size: 14px; 1797 font-size: 14px;
1798 color: #377d87; 1798 color: #377d87;
1799 font-weight: 700; 1799 font-weight: 700;
1800 } 1800 }
1801 @media (min-width: 768px) { 1801 @media (min-width: 768px) {
1802 .back { 1802 .back {
1803 font-size: 18px; 1803 font-size: 18px;
1804 } 1804 }
1805 } 1805 }
1806 .back:hover { 1806 .back:hover {
1807 color: #4d88d9; 1807 color: #4d88d9;
1808 } 1808 }
1809 .back svg { 1809 .back svg {
1810 width: 16px; 1810 width: 16px;
1811 height: 16px; 1811 height: 16px;
1812 } 1812 }
1813 @media (min-width: 768px) { 1813 @media (min-width: 768px) {
1814 .back svg { 1814 .back svg {
1815 width: 26px; 1815 width: 26px;
1816 height: 26px; 1816 height: 26px;
1817 } 1817 }
1818 } 1818 }
1819 .back span { 1819 .back span {
1820 width: calc(100% - 16px); 1820 width: calc(100% - 16px);
1821 padding-left: 10px; 1821 padding-left: 10px;
1822 } 1822 }
1823 @media (min-width: 768px) { 1823 @media (min-width: 768px) {
1824 .back span { 1824 .back span {
1825 width: calc(100% - 26px); 1825 width: calc(100% - 26px);
1826 padding-left: 20px; 1826 padding-left: 20px;
1827 } 1827 }
1828 } 1828 }
1829 1829
1830 .callback { 1830 .callback {
1831 display: -webkit-box; 1831 display: -webkit-box;
1832 display: -ms-flexbox; 1832 display: -ms-flexbox;
1833 display: flex; 1833 display: flex;
1834 -webkit-box-orient: vertical; 1834 -webkit-box-orient: vertical;
1835 -webkit-box-direction: normal; 1835 -webkit-box-direction: normal;
1836 -ms-flex-direction: column; 1836 -ms-flex-direction: column;
1837 flex-direction: column; 1837 flex-direction: column;
1838 gap: 16px; 1838 gap: 16px;
1839 } 1839 }
1840 @media (min-width: 992px) { 1840 @media (min-width: 992px) {
1841 .callback { 1841 .callback {
1842 -webkit-box-orient: horizontal; 1842 -webkit-box-orient: horizontal;
1843 -webkit-box-direction: normal; 1843 -webkit-box-direction: normal;
1844 -ms-flex-direction: row; 1844 -ms-flex-direction: row;
1845 flex-direction: row; 1845 flex-direction: row;
1846 -webkit-box-pack: justify; 1846 -webkit-box-pack: justify;
1847 -ms-flex-pack: justify; 1847 -ms-flex-pack: justify;
1848 justify-content: space-between; 1848 justify-content: space-between;
1849 -ms-flex-wrap: wrap; 1849 -ms-flex-wrap: wrap;
1850 flex-wrap: wrap; 1850 flex-wrap: wrap;
1851 gap: 20px 0; 1851 gap: 20px 0;
1852 } 1852 }
1853 } 1853 }
1854 .callback__body { 1854 .callback__body {
1855 display: -webkit-box; 1855 display: -webkit-box;
1856 display: -ms-flexbox; 1856 display: -ms-flexbox;
1857 display: flex; 1857 display: flex;
1858 -webkit-box-orient: vertical; 1858 -webkit-box-orient: vertical;
1859 -webkit-box-direction: normal; 1859 -webkit-box-direction: normal;
1860 -ms-flex-direction: column; 1860 -ms-flex-direction: column;
1861 flex-direction: column; 1861 flex-direction: column;
1862 gap: 16px; 1862 gap: 16px;
1863 } 1863 }
1864 @media (min-width: 992px) { 1864 @media (min-width: 992px) {
1865 .callback__body { 1865 .callback__body {
1866 width: calc(50% - 10px); 1866 width: calc(50% - 10px);
1867 gap: 10px; 1867 gap: 10px;
1868 } 1868 }
1869 } 1869 }
1870 @media (min-width: 992px) { 1870 @media (min-width: 992px) {
1871 .callback__textarea { 1871 .callback__textarea {
1872 width: calc(50% - 10px); 1872 width: calc(50% - 10px);
1873 height: auto; 1873 height: auto;
1874 } 1874 }
1875 } 1875 }
1876 .callback__bottom { 1876 .callback__bottom {
1877 display: -webkit-box; 1877 display: -webkit-box;
1878 display: -ms-flexbox; 1878 display: -ms-flexbox;
1879 display: flex; 1879 display: flex;
1880 -webkit-box-orient: vertical; 1880 -webkit-box-orient: vertical;
1881 -webkit-box-direction: normal; 1881 -webkit-box-direction: normal;
1882 -ms-flex-direction: column; 1882 -ms-flex-direction: column;
1883 flex-direction: column; 1883 flex-direction: column;
1884 gap: 16px; 1884 gap: 16px;
1885 } 1885 }
1886 @media (min-width: 768px) { 1886 @media (min-width: 768px) {
1887 .callback__bottom { 1887 .callback__bottom {
1888 -webkit-box-align: start; 1888 -webkit-box-align: start;
1889 -ms-flex-align: start; 1889 -ms-flex-align: start;
1890 align-items: flex-start; 1890 align-items: flex-start;
1891 } 1891 }
1892 } 1892 }
1893 @media (min-width: 992px) { 1893 @media (min-width: 992px) {
1894 .callback__bottom { 1894 .callback__bottom {
1895 width: 100%; 1895 width: 100%;
1896 gap: 20px; 1896 gap: 20px;
1897 } 1897 }
1898 } 1898 }
1899 1899
1900 .error .input, 1900 .error .input,
1901 .error .textarea { 1901 .error .textarea {
1902 border-color: #eb5757; 1902 border-color: #eb5757;
1903 } 1903 }
1904 .error label { 1904 .error label {
1905 display: block; 1905 display: block;
1906 } 1906 }
1907 1907
1908 .eye { 1908 .eye {
1909 position: absolute; 1909 position: absolute;
1910 z-index: 2; 1910 z-index: 2;
1911 top: 50%; 1911 top: 50%;
1912 -webkit-transform: translate(0, -50%); 1912 -webkit-transform: translate(0, -50%);
1913 -ms-transform: translate(0, -50%); 1913 -ms-transform: translate(0, -50%);
1914 transform: translate(0, -50%); 1914 transform: translate(0, -50%);
1915 right: 10px; 1915 right: 10px;
1916 aspect-ratio: 1/1; 1916 aspect-ratio: 1/1;
1917 width: 16px; 1917 width: 16px;
1918 padding: 0; 1918 padding: 0;
1919 border: none; 1919 border: none;
1920 background: none; 1920 background: none;
1921 color: #9c9d9d; 1921 color: #9c9d9d;
1922 } 1922 }
1923 @media (min-width: 768px) { 1923 @media (min-width: 768px) {
1924 .eye { 1924 .eye {
1925 width: 24px; 1925 width: 24px;
1926 right: 20px; 1926 right: 20px;
1927 } 1927 }
1928 } 1928 }
1929 .eye svg { 1929 .eye svg {
1930 position: absolute; 1930 position: absolute;
1931 top: 0; 1931 top: 0;
1932 left: 0; 1932 left: 0;
1933 width: 100%; 1933 width: 100%;
1934 height: 100%; 1934 height: 100%;
1935 } 1935 }
1936 .eye svg + svg { 1936 .eye svg + svg {
1937 display: none; 1937 display: none;
1938 } 1938 }
1939 .eye.active { 1939 .eye.active {
1940 color: #377d87; 1940 color: #377d87;
1941 } 1941 }
1942 .eye.active svg { 1942 .eye.active svg {
1943 display: none; 1943 display: none;
1944 } 1944 }
1945 .eye.active svg + svg { 1945 .eye.active svg + svg {
1946 display: block; 1946 display: block;
1947 } 1947 }
1948 1948
1949 .del { 1949 .del {
1950 width: 32px; 1950 width: 32px;
1951 aspect-ratio: 1/1; 1951 aspect-ratio: 1/1;
1952 background: #377d87; 1952 background: #377d87;
1953 color: #fff; 1953 color: #fff;
1954 display: -webkit-box; 1954 display: -webkit-box;
1955 display: -ms-flexbox; 1955 display: -ms-flexbox;
1956 display: flex; 1956 display: flex;
1957 -webkit-box-pack: center; 1957 -webkit-box-pack: center;
1958 -ms-flex-pack: center; 1958 -ms-flex-pack: center;
1959 justify-content: center; 1959 justify-content: center;
1960 -webkit-box-align: center; 1960 -webkit-box-align: center;
1961 -ms-flex-align: center; 1961 -ms-flex-align: center;
1962 align-items: center; 1962 align-items: center;
1963 border-radius: 8px; 1963 border-radius: 8px;
1964 padding: 0; 1964 padding: 0;
1965 border: 1px solid #377d87; 1965 border: 1px solid #377d87;
1966 } 1966 }
1967 .del:hover { 1967 .del:hover {
1968 background: #fff; 1968 background: #fff;
1969 color: #377d87; 1969 color: #377d87;
1970 } 1970 }
1971 .del svg { 1971 .del svg {
1972 width: 50%; 1972 width: 50%;
1973 aspect-ratio: 1/1; 1973 aspect-ratio: 1/1;
1974 } 1974 }
1975 1975
1976 .notify { 1976 .notify {
1977 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 1977 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
1978 padding: 6px 12px; 1978 padding: 6px 12px;
1979 border-radius: 8px; 1979 border-radius: 8px;
1980 display: -webkit-box; 1980 display: -webkit-box;
1981 display: -ms-flexbox; 1981 display: -ms-flexbox;
1982 display: flex; 1982 display: flex;
1983 -webkit-box-align: start; 1983 -webkit-box-align: start;
1984 -ms-flex-align: start; 1984 -ms-flex-align: start;
1985 align-items: flex-start; 1985 align-items: flex-start;
1986 } 1986 }
1987 @media (min-width: 768px) { 1987 @media (min-width: 768px) {
1988 .notify { 1988 .notify {
1989 padding: 12px 20px; 1989 padding: 12px 20px;
1990 } 1990 }
1991 } 1991 }
1992 .notify_red { 1992 .notify_red {
1993 background: #f9cdcd; 1993 background: #f9cdcd;
1994 } 1994 }
1995 .notify svg { 1995 .notify svg {
1996 color: #4d88d9; 1996 color: #4d88d9;
1997 width: 20px; 1997 width: 20px;
1998 aspect-ratio: 1/1; 1998 aspect-ratio: 1/1;
1999 } 1999 }
2000 .notify span { 2000 .notify span {
2001 font-size: 12px; 2001 font-size: 12px;
2002 padding-left: 10px; 2002 padding-left: 10px;
2003 min-height: 20px; 2003 min-height: 20px;
2004 display: -webkit-box; 2004 display: -webkit-box;
2005 display: -ms-flexbox; 2005 display: -ms-flexbox;
2006 display: flex; 2006 display: flex;
2007 -webkit-box-align: center; 2007 -webkit-box-align: center;
2008 -ms-flex-align: center; 2008 -ms-flex-align: center;
2009 align-items: center; 2009 align-items: center;
2010 } 2010 }
2011 @media (min-width: 768px) { 2011 @media (min-width: 768px) {
2012 .notify span { 2012 .notify span {
2013 font-size: 16px; 2013 font-size: 16px;
2014 } 2014 }
2015 } 2015 }
2016 2016
2017 .table { 2017 .table {
2018 margin: 0 -10px; 2018 margin: 0 -10px;
2019 display: -webkit-box; 2019 display: -webkit-box;
2020 display: -ms-flexbox; 2020 display: -ms-flexbox;
2021 display: flex; 2021 display: flex;
2022 -webkit-box-orient: vertical; 2022 -webkit-box-orient: vertical;
2023 -webkit-box-direction: reverse; 2023 -webkit-box-direction: reverse;
2024 -ms-flex-direction: column-reverse; 2024 -ms-flex-direction: column-reverse;
2025 flex-direction: column-reverse; 2025 flex-direction: column-reverse;
2026 -webkit-box-align: center; 2026 -webkit-box-align: center;
2027 -ms-flex-align: center; 2027 -ms-flex-align: center;
2028 align-items: center; 2028 align-items: center;
2029 gap: 20px; 2029 gap: 20px;
2030 } 2030 }
2031 @media (min-width: 768px) { 2031 @media (min-width: 768px) {
2032 .table { 2032 .table {
2033 margin: 0; 2033 margin: 0;
2034 gap: 30px; 2034 gap: 30px;
2035 } 2035 }
2036 } 2036 }
2037 .table__button { 2037 .table__button {
2038 display: none; 2038 display: none;
2039 } 2039 }
2040 .table_spoiler .table__button { 2040 .table_spoiler .table__button {
2041 display: -webkit-box; 2041 display: -webkit-box;
2042 display: -ms-flexbox; 2042 display: -ms-flexbox;
2043 display: flex; 2043 display: flex;
2044 } 2044 }
2045 .table__scroll { 2045 .table__scroll {
2046 overflow: hidden; 2046 overflow: hidden;
2047 overflow-x: auto; 2047 overflow-x: auto;
2048 padding: 0 10px; 2048 padding: 0 10px;
2049 width: 100%; 2049 width: 100%;
2050 } 2050 }
2051 @media (min-width: 768px) { 2051 @media (min-width: 768px) {
2052 .table__scroll { 2052 .table__scroll {
2053 padding: 0; 2053 padding: 0;
2054 } 2054 }
2055 } 2055 }
2056 .table__body { 2056 .table__body {
2057 border-radius: 8px; 2057 border-radius: 8px;
2058 overflow: hidden; 2058 overflow: hidden;
2059 } 2059 }
2060 .table__body_min-width { 2060 .table__body_min-width {
2061 min-width: 580px; 2061 min-width: 580px;
2062 } 2062 }
2063 .table table { 2063 .table table {
2064 border-collapse: collapse; 2064 border-collapse: collapse;
2065 width: 100%; 2065 width: 100%;
2066 font-size: 12px; 2066 font-size: 12px;
2067 border-radius: 8px; 2067 border-radius: 8px;
2068 } 2068 }
2069 @media (min-width: 768px) { 2069 @media (min-width: 768px) {
2070 .table table { 2070 .table table {
2071 font-size: 14px; 2071 font-size: 14px;
2072 } 2072 }
2073 } 2073 }
2074 @media (min-width: 1280px) { 2074 @media (min-width: 1280px) {
2075 .table table { 2075 .table table {
2076 font-size: 16px; 2076 font-size: 16px;
2077 } 2077 }
2078 } 2078 }
2079 .table thead tr th, 2079 .table thead tr th,
2080 .table thead tr td { 2080 .table thead tr td {
2081 background: #377d87; 2081 background: #377d87;
2082 color: #fff; 2082 color: #fff;
2083 font-weight: 700; 2083 font-weight: 700;
2084 border-top-color: #377d87; 2084 border-top-color: #377d87;
2085 } 2085 }
2086 .table thead tr th:first-child, 2086 .table thead tr th:first-child,
2087 .table thead tr td:first-child { 2087 .table thead tr td:first-child {
2088 border-left-color: #377d87; 2088 border-left-color: #377d87;
2089 } 2089 }
2090 .table thead tr th:last-child, 2090 .table thead tr th:last-child,
2091 .table thead tr td:last-child { 2091 .table thead tr td:last-child {
2092 border-right-color: #377d87; 2092 border-right-color: #377d87;
2093 } 2093 }
2094 .table_spoiler tr { 2094 .table_spoiler tr {
2095 display: none; 2095 display: none;
2096 } 2096 }
2097 .table_spoiler tr:nth-of-type(1), .table_spoiler tr:nth-of-type(2), .table_spoiler tr:nth-of-type(3), .table_spoiler tr:nth-of-type(4), .table_spoiler tr:nth-of-type(5), .table_spoiler tr:nth-of-type(6) { 2097 .table_spoiler tr:nth-of-type(1), .table_spoiler tr:nth-of-type(2), .table_spoiler tr:nth-of-type(3), .table_spoiler tr:nth-of-type(4), .table_spoiler tr:nth-of-type(5), .table_spoiler tr:nth-of-type(6) {
2098 display: table-row; 2098 display: table-row;
2099 } 2099 }
2100 .table_spoiler.active tr { 2100 .table_spoiler.active tr {
2101 display: table-row; 2101 display: table-row;
2102 } 2102 }
2103 .table th, 2103 .table th,
2104 .table td { 2104 .table td {
2105 text-align: left; 2105 text-align: left;
2106 padding: 10px; 2106 padding: 10px;
2107 border: 1px solid #cecece; 2107 border: 1px solid #cecece;
2108 } 2108 }
2109 @media (min-width: 768px) { 2109 @media (min-width: 768px) {
2110 .table td { 2110 .table td {
2111 padding: 14px 10px; 2111 padding: 14px 10px;
2112 } 2112 }
2113 } 2113 }
2114 .table__status { 2114 .table__status {
2115 color: #9c9d9d; 2115 color: #9c9d9d;
2116 display: -webkit-box; 2116 display: -webkit-box;
2117 display: -ms-flexbox; 2117 display: -ms-flexbox;
2118 display: flex; 2118 display: flex;
2119 -webkit-box-align: center; 2119 -webkit-box-align: center;
2120 -ms-flex-align: center; 2120 -ms-flex-align: center;
2121 align-items: center; 2121 align-items: center;
2122 gap: 6px; 2122 gap: 6px;
2123 position: relative; 2123 position: relative;
2124 padding-left: 14px; 2124 padding-left: 14px;
2125 } 2125 }
2126 .table__status i { 2126 .table__status i {
2127 background: #9c9d9d; 2127 background: #9c9d9d;
2128 width: 8px; 2128 width: 8px;
2129 aspect-ratio: 1/1; 2129 aspect-ratio: 1/1;
2130 border-radius: 999px; 2130 border-radius: 999px;
2131 position: absolute; 2131 position: absolute;
2132 top: 4px; 2132 top: 4px;
2133 left: 0; 2133 left: 0;
2134 } 2134 }
2135 .table__status.green { 2135 .table__status.green {
2136 color: #377d87; 2136 color: #377d87;
2137 } 2137 }
2138 .table__status.green i { 2138 .table__status.green i {
2139 background: #377d87; 2139 background: #377d87;
2140 } 2140 }
2141 .table__link { 2141 .table__link {
2142 display: -webkit-box; 2142 display: -webkit-box;
2143 display: -ms-flexbox; 2143 display: -ms-flexbox;
2144 display: flex; 2144 display: flex;
2145 -webkit-box-align: center; 2145 -webkit-box-align: center;
2146 -ms-flex-align: center; 2146 -ms-flex-align: center;
2147 align-items: center; 2147 align-items: center;
2148 gap: 4px; 2148 gap: 4px;
2149 color: #4d88d9; 2149 color: #4d88d9;
2150 } 2150 }
2151 @media (min-width: 768px) { 2151 @media (min-width: 768px) {
2152 .table__link { 2152 .table__link {
2153 gap: 6px; 2153 gap: 6px;
2154 } 2154 }
2155 } 2155 }
2156 .table__link:hover { 2156 .table__link:hover {
2157 color: #000; 2157 color: #000;
2158 } 2158 }
2159 .table__link svg { 2159 .table__link svg {
2160 width: 12px; 2160 width: 12px;
2161 aspect-ratio: 1/1; 2161 aspect-ratio: 1/1;
2162 } 2162 }
2163 @media (min-width: 768px) { 2163 @media (min-width: 768px) {
2164 .table__link svg { 2164 .table__link svg {
2165 width: 16px; 2165 width: 16px;
2166 } 2166 }
2167 } 2167 }
2168 .table__controls { 2168 .table__controls {
2169 display: -webkit-box; 2169 display: -webkit-box;
2170 display: -ms-flexbox; 2170 display: -ms-flexbox;
2171 display: flex; 2171 display: flex;
2172 -webkit-box-align: center; 2172 -webkit-box-align: center;
2173 -ms-flex-align: center; 2173 -ms-flex-align: center;
2174 align-items: center; 2174 align-items: center;
2175 gap: 8px; 2175 gap: 8px;
2176 } 2176 }
2177 @media (min-width: 1280px) { 2177 @media (min-width: 1280px) {
2178 .table__controls { 2178 .table__controls {
2179 gap: 12px; 2179 gap: 12px;
2180 } 2180 }
2181 } 2181 }
2182 .table__controls-item { 2182 .table__controls-item {
2183 width: 24px; 2183 width: 24px;
2184 aspect-ratio: 1/1; 2184 aspect-ratio: 1/1;
2185 display: -webkit-box; 2185 display: -webkit-box;
2186 display: -ms-flexbox; 2186 display: -ms-flexbox;
2187 display: flex; 2187 display: flex;
2188 -webkit-box-pack: center; 2188 -webkit-box-pack: center;
2189 -ms-flex-pack: center; 2189 -ms-flex-pack: center;
2190 justify-content: center; 2190 justify-content: center;
2191 -webkit-box-align: center; 2191 -webkit-box-align: center;
2192 -ms-flex-align: center; 2192 -ms-flex-align: center;
2193 align-items: center; 2193 align-items: center;
2194 border: 1px solid #377d87; 2194 border: 1px solid #377d87;
2195 border-radius: 8px; 2195 border-radius: 8px;
2196 color: #377d87; 2196 color: #377d87;
2197 background: none; 2197 background: none;
2198 padding: 0; 2198 padding: 0;
2199 } 2199 }
2200 @media (min-width: 1280px) { 2200 @media (min-width: 1280px) {
2201 .table__controls-item { 2201 .table__controls-item {
2202 width: 30px; 2202 width: 30px;
2203 } 2203 }
2204 } 2204 }
2205 .table__controls-item:hover { 2205 .table__controls-item:hover {
2206 background: #377d87; 2206 background: #377d87;
2207 color: #fff; 2207 color: #fff;
2208 } 2208 }
2209 .table__controls-item svg { 2209 .table__controls-item svg {
2210 width: 60%; 2210 width: 60%;
2211 aspect-ratio: 1/1; 2211 aspect-ratio: 1/1;
2212 } 2212 }
2213 .table__controls-item:nth-of-type(4) svg { 2213 .table__controls-item:nth-of-type(4) svg {
2214 width: 80%; 2214 width: 80%;
2215 } 2215 }
2216 2216
2217 .gl-star-rating--stars:before, .gl-star-rating--stars:after { 2217 .gl-star-rating--stars:before, .gl-star-rating--stars:after {
2218 display: none; 2218 display: none;
2219 } 2219 }
2220 .gl-star-rating--stars span { 2220 .gl-star-rating--stars span {
2221 width: 22px !important; 2221 width: 22px !important;
2222 height: 22px !important; 2222 height: 22px !important;
2223 background-size: 22px 22px !important; 2223 background-size: 22px 22px !important;
2224 } 2224 }
2225 @media (min-width: 768px) { 2225 @media (min-width: 768px) {
2226 .gl-star-rating--stars span { 2226 .gl-star-rating--stars span {
2227 width: 30px !important; 2227 width: 30px !important;
2228 height: 30px !important; 2228 height: 30px !important;
2229 background-size: 30px 30px !important; 2229 background-size: 30px 30px !important;
2230 } 2230 }
2231 } 2231 }
2232 2232
2233 .more { 2233 .more {
2234 display: -webkit-box; 2234 display: -webkit-box;
2235 display: -ms-flexbox; 2235 display: -ms-flexbox;
2236 display: flex; 2236 display: flex;
2237 -webkit-box-orient: vertical; 2237 -webkit-box-orient: vertical;
2238 -webkit-box-direction: normal; 2238 -webkit-box-direction: normal;
2239 -ms-flex-direction: column; 2239 -ms-flex-direction: column;
2240 flex-direction: column; 2240 flex-direction: column;
2241 -webkit-box-align: center; 2241 -webkit-box-align: center;
2242 -ms-flex-align: center; 2242 -ms-flex-align: center;
2243 align-items: center; 2243 align-items: center;
2244 } 2244 }
2245 .more_mt { 2245 .more_mt {
2246 margin-top: 20px; 2246 margin-top: 20px;
2247 } 2247 }
2248 .more .button { 2248 .more .button {
2249 min-width: 100px; 2249 min-width: 100px;
2250 padding: 0; 2250 padding: 0;
2251 } 2251 }
2252 @media (min-width: 768px) { 2252 @media (min-width: 768px) {
2253 .more .button { 2253 .more .button {
2254 min-width: 180px; 2254 min-width: 180px;
2255 } 2255 }
2256 } 2256 }
2257 2257
2258 .header { 2258 .header {
2259 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 2259 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
2260 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 2260 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
2261 background: #fff; 2261 background: #fff;
2262 position: relative; 2262 position: relative;
2263 z-index: 5; 2263 z-index: 5;
2264 overflow: hidden; 2264 overflow: hidden;
2265 } 2265 }
2266 @media (min-width: 768px) { 2266 @media (min-width: 768px) {
2267 .header { 2267 .header {
2268 -webkit-box-shadow: none; 2268 -webkit-box-shadow: none;
2269 box-shadow: none; 2269 box-shadow: none;
2270 } 2270 }
2271 } 2271 }
2272 .header__body { 2272 .header__body {
2273 height: 42px; 2273 height: 42px;
2274 display: -webkit-box; 2274 display: -webkit-box;
2275 display: -ms-flexbox; 2275 display: -ms-flexbox;
2276 display: flex; 2276 display: flex;
2277 -webkit-box-pack: justify; 2277 -webkit-box-pack: justify;
2278 -ms-flex-pack: justify; 2278 -ms-flex-pack: justify;
2279 justify-content: space-between; 2279 justify-content: space-between;
2280 -webkit-box-align: center; 2280 -webkit-box-align: center;
2281 -ms-flex-align: center; 2281 -ms-flex-align: center;
2282 align-items: center; 2282 align-items: center;
2283 } 2283 }
2284 @media (min-width: 768px) { 2284 @media (min-width: 768px) {
2285 .header__body { 2285 .header__body {
2286 height: 70px; 2286 height: 70px;
2287 } 2287 }
2288 } 2288 }
2289 .header__left { 2289 .header__left {
2290 display: -webkit-box; 2290 display: -webkit-box;
2291 display: -ms-flexbox; 2291 display: -ms-flexbox;
2292 display: flex; 2292 display: flex;
2293 -webkit-box-align: center; 2293 -webkit-box-align: center;
2294 -ms-flex-align: center; 2294 -ms-flex-align: center;
2295 align-items: center; 2295 align-items: center;
2296 gap: 40px; 2296 gap: 40px;
2297 } 2297 }
2298 .header__right { 2298 .header__right {
2299 display: -webkit-box; 2299 display: -webkit-box;
2300 display: -ms-flexbox; 2300 display: -ms-flexbox;
2301 display: flex; 2301 display: flex;
2302 -webkit-box-align: center; 2302 -webkit-box-align: center;
2303 -ms-flex-align: center; 2303 -ms-flex-align: center;
2304 align-items: center; 2304 align-items: center;
2305 gap: 14px; 2305 gap: 14px;
2306 } 2306 }
2307 @media (min-width: 768px) { 2307 @media (min-width: 768px) {
2308 .header__right { 2308 .header__right {
2309 gap: 20px; 2309 gap: 20px;
2310 } 2310 }
2311 } 2311 }
2312 .header__right-line { 2312 .header__right-line {
2313 width: 1px; 2313 width: 1px;
2314 height: 32px; 2314 height: 32px;
2315 background: #e6e7e7; 2315 background: #e6e7e7;
2316 border-radius: 999px; 2316 border-radius: 999px;
2317 } 2317 }
2318 @media (min-width: 992px) { 2318 @media (min-width: 992px) {
2319 .header__right-line { 2319 .header__right-line {
2320 display: none; 2320 display: none;
2321 } 2321 }
2322 } 2322 }
2323 .header__logo { 2323 .header__logo {
2324 display: -webkit-box; 2324 display: -webkit-box;
2325 display: -ms-flexbox; 2325 display: -ms-flexbox;
2326 display: flex; 2326 display: flex;
2327 -webkit-box-align: center; 2327 -webkit-box-align: center;
2328 -ms-flex-align: center; 2328 -ms-flex-align: center;
2329 align-items: center; 2329 align-items: center;
2330 -webkit-box-pack: center; 2330 -webkit-box-pack: center;
2331 -ms-flex-pack: center; 2331 -ms-flex-pack: center;
2332 justify-content: center; 2332 justify-content: center;
2333 color: #377d87; 2333 color: #377d87;
2334 } 2334 }
2335 .header__logo svg { 2335 .header__logo svg {
2336 width: 105px; 2336 width: 105px;
2337 height: 31px; 2337 height: 31px;
2338 } 2338 }
2339 @media (min-width: 768px) { 2339 @media (min-width: 768px) {
2340 .header__logo svg { 2340 .header__logo svg {
2341 width: 182px; 2341 width: 182px;
2342 height: 54px; 2342 height: 54px;
2343 } 2343 }
2344 } 2344 }
2345 .header__menu { 2345 .header__menu {
2346 display: none; 2346 display: none;
2347 -webkit-box-align: center; 2347 -webkit-box-align: center;
2348 -ms-flex-align: center; 2348 -ms-flex-align: center;
2349 align-items: center; 2349 align-items: center;
2350 gap: 20px; 2350 gap: 20px;
2351 } 2351 }
2352 @media (min-width: 768px) { 2352 @media (min-width: 768px) {
2353 .header__menu { 2353 .header__menu {
2354 display: -webkit-box; 2354 display: -webkit-box;
2355 display: -ms-flexbox; 2355 display: -ms-flexbox;
2356 display: flex; 2356 display: flex;
2357 } 2357 }
2358 } 2358 }
2359 .header__menu-item:hover { 2359 .header__menu-item:hover {
2360 color: #377d87; 2360 color: #377d87;
2361 } 2361 }
2362 .header__notifs { 2362 .header__notifs {
2363 display: -webkit-box; 2363 display: -webkit-box;
2364 display: -ms-flexbox; 2364 display: -ms-flexbox;
2365 display: flex; 2365 display: flex;
2366 -webkit-box-align: center; 2366 -webkit-box-align: center;
2367 -ms-flex-align: center; 2367 -ms-flex-align: center;
2368 align-items: center; 2368 align-items: center;
2369 -webkit-box-pack: center; 2369 -webkit-box-pack: center;
2370 -ms-flex-pack: center; 2370 -ms-flex-pack: center;
2371 justify-content: center; 2371 justify-content: center;
2372 color: #377d87; 2372 color: #377d87;
2373 padding: 0; 2373 padding: 0;
2374 border: none; 2374 border: none;
2375 background: none; 2375 background: none;
2376 width: 24px; 2376 width: 24px;
2377 height: 24px; 2377 height: 24px;
2378 } 2378 }
2379 @media (min-width: 992px) { 2379 @media (min-width: 992px) {
2380 .header__notifs { 2380 .header__notifs {
2381 width: auto; 2381 width: auto;
2382 height: auto; 2382 height: auto;
2383 color: #000; 2383 color: #000;
2384 line-height: 1.4; 2384 line-height: 1.4;
2385 } 2385 }
2386 } 2386 }
2387 @media (min-width: 992px) { 2387 @media (min-width: 992px) {
2388 .header__notifs:hover { 2388 .header__notifs:hover {
2389 color: #377d87; 2389 color: #377d87;
2390 } 2390 }
2391 } 2391 }
2392 .header__notifs svg { 2392 .header__notifs svg {
2393 width: 20px; 2393 width: 20px;
2394 height: 20px; 2394 height: 20px;
2395 } 2395 }
2396 @media (min-width: 992px) { 2396 @media (min-width: 992px) {
2397 .header__notifs svg { 2397 .header__notifs svg {
2398 display: none; 2398 display: none;
2399 } 2399 }
2400 } 2400 }
2401 .header__notifs span { 2401 .header__notifs span {
2402 display: none; 2402 display: none;
2403 } 2403 }
2404 @media (min-width: 992px) { 2404 @media (min-width: 992px) {
2405 .header__notifs span { 2405 .header__notifs span {
2406 display: inline; 2406 display: inline;
2407 } 2407 }
2408 } 2408 }
2409 .header__notifs_actived { 2409 .header__notifs_actived {
2410 position: relative; 2410 position: relative;
2411 } 2411 }
2412 @media (min-width: 992px) { 2412 @media (min-width: 992px) {
2413 .header__notifs_actived { 2413 .header__notifs_actived {
2414 padding-right: 12px; 2414 padding-right: 12px;
2415 } 2415 }
2416 } 2416 }
2417 .header__notifs_actived:after { 2417 .header__notifs_actived:after {
2418 content: ""; 2418 content: "";
2419 border: 1px solid #fff; 2419 border: 1px solid #fff;
2420 background: #377d87; 2420 background: #377d87;
2421 border-radius: 999px; 2421 border-radius: 999px;
2422 width: 10px; 2422 width: 10px;
2423 height: 10px; 2423 height: 10px;
2424 position: absolute; 2424 position: absolute;
2425 z-index: 1; 2425 z-index: 1;
2426 top: 0; 2426 top: 0;
2427 right: 0; 2427 right: 0;
2428 } 2428 }
2429 @media (min-width: 992px) { 2429 @media (min-width: 992px) {
2430 .header__notifs_actived:after { 2430 .header__notifs_actived:after {
2431 width: 8px; 2431 width: 8px;
2432 height: 8px; 2432 height: 8px;
2433 border: none; 2433 border: none;
2434 } 2434 }
2435 } 2435 }
2436 .header__burger { 2436 .header__burger {
2437 display: -webkit-box; 2437 display: -webkit-box;
2438 display: -ms-flexbox; 2438 display: -ms-flexbox;
2439 display: flex; 2439 display: flex;
2440 -webkit-box-align: center; 2440 -webkit-box-align: center;
2441 -ms-flex-align: center; 2441 -ms-flex-align: center;
2442 align-items: center; 2442 align-items: center;
2443 -webkit-box-pack: center; 2443 -webkit-box-pack: center;
2444 -ms-flex-pack: center; 2444 -ms-flex-pack: center;
2445 justify-content: center; 2445 justify-content: center;
2446 width: 24px; 2446 width: 24px;
2447 height: 24px; 2447 height: 24px;
2448 color: #377d87; 2448 color: #377d87;
2449 padding: 0; 2449 padding: 0;
2450 border: none; 2450 border: none;
2451 background: none; 2451 background: none;
2452 } 2452 }
2453 @media (min-width: 992px) { 2453 @media (min-width: 992px) {
2454 .header__burger { 2454 .header__burger {
2455 display: none; 2455 display: none;
2456 } 2456 }
2457 } 2457 }
2458 .header__burger svg { 2458 .header__burger svg {
2459 width: 20px; 2459 width: 20px;
2460 height: 20px; 2460 height: 20px;
2461 } 2461 }
2462 .header__burger svg + svg { 2462 .header__burger svg + svg {
2463 display: none; 2463 display: none;
2464 } 2464 }
2465 .header__sign { 2465 .header__sign {
2466 display: none; 2466 display: none;
2467 } 2467 }
2468 @media (min-width: 992px) { 2468 @media (min-width: 992px) {
2469 .header__sign { 2469 .header__sign {
2470 display: -webkit-box; 2470 display: -webkit-box;
2471 display: -ms-flexbox; 2471 display: -ms-flexbox;
2472 display: flex; 2472 display: flex;
2473 } 2473 }
2474 } 2474 }
2475 2475
2476 .mob-menu { 2476 .mob-menu {
2477 display: none; 2477 display: none;
2478 position: fixed; 2478 position: fixed;
2479 bottom: 0; 2479 bottom: 0;
2480 left: 0; 2480 left: 0;
2481 width: 100vw; 2481 width: 100vw;
2482 height: calc(100vh - 42px); 2482 height: calc(100vh - 42px);
2483 z-index: 4; 2483 z-index: 4;
2484 background: #fff; 2484 background: #fff;
2485 overflow: hidden; 2485 overflow: hidden;
2486 overflow-y: auto; 2486 overflow-y: auto;
2487 padding: 50px 0; 2487 padding: 50px 0;
2488 } 2488 }
2489 .mob-menu__bottom { 2489 .mob-menu__bottom {
2490 display: -webkit-box; 2490 display: -webkit-box;
2491 display: -ms-flexbox; 2491 display: -ms-flexbox;
2492 display: flex; 2492 display: flex;
2493 -webkit-box-orient: vertical; 2493 -webkit-box-orient: vertical;
2494 -webkit-box-direction: normal; 2494 -webkit-box-direction: normal;
2495 -ms-flex-direction: column; 2495 -ms-flex-direction: column;
2496 flex-direction: column; 2496 flex-direction: column;
2497 -webkit-box-align: center; 2497 -webkit-box-align: center;
2498 -ms-flex-align: center; 2498 -ms-flex-align: center;
2499 align-items: center; 2499 align-items: center;
2500 margin-top: 80px; 2500 margin-top: 80px;
2501 } 2501 }
2502 .mob-menu__bottom .button { 2502 .mob-menu__bottom .button {
2503 min-width: 120px; 2503 min-width: 120px;
2504 } 2504 }
2505 .mob-menu__bottom-link { 2505 .mob-menu__bottom-link {
2506 text-decoration: underline; 2506 text-decoration: underline;
2507 margin-top: 50px; 2507 margin-top: 50px;
2508 } 2508 }
2509 .mob-menu__bottom-link:hover { 2509 .mob-menu__bottom-link:hover {
2510 color: #377d87; 2510 color: #377d87;
2511 } 2511 }
2512 .mob-menu__bottom-link + .mob-menu__bottom-link { 2512 .mob-menu__bottom-link + .mob-menu__bottom-link {
2513 margin-top: 10px; 2513 margin-top: 10px;
2514 } 2514 }
2515 .mob-menu__bottom .socials { 2515 .mob-menu__bottom .socials {
2516 margin-top: 35px; 2516 margin-top: 35px;
2517 } 2517 }
2518 .mob-menu .footer__mobile-menu { 2518 .mob-menu .footer__mobile-menu {
2519 opacity: 1; 2519 opacity: 1;
2520 height: auto; 2520 height: auto;
2521 overflow: visible; 2521 overflow: visible;
2522 } 2522 }
2523 .mob-menu .footer__mobile-menu-item button { 2523 .mob-menu .footer__mobile-menu-item button {
2524 -webkit-box-align: center; 2524 -webkit-box-align: center;
2525 -ms-flex-align: center; 2525 -ms-flex-align: center;
2526 align-items: center; 2526 align-items: center;
2527 } 2527 }
2528 .mob-menu .footer__mobile-menu-item div { 2528 .mob-menu .footer__mobile-menu-item div {
2529 font-size: 20px; 2529 font-size: 20px;
2530 } 2530 }
2531 .mob-menu .footer__mobile-contacts a { 2531 .mob-menu .footer__mobile-contacts a {
2532 font-size: 20px; 2532 font-size: 20px;
2533 font-weight: 700; 2533 font-weight: 700;
2534 color: #000; 2534 color: #000;
2535 text-decoration: none; 2535 text-decoration: none;
2536 } 2536 }
2537 .mob-menu .footer__mobile-contacts a:hover { 2537 .mob-menu .footer__mobile-contacts a:hover {
2538 color: #377d87; 2538 color: #377d87;
2539 } 2539 }
2540 .mob-menu .footer__mobile-menu-item button b, 2540 .mob-menu .footer__mobile-menu-item button b,
2541 .mob-menu .footer__mobile-contacts a { 2541 .mob-menu .footer__mobile-contacts a {
2542 font-size: 30px; 2542 font-size: 30px;
2543 } 2543 }
2544 2544
2545 .menu-is-actived { 2545 .menu-is-actived {
2546 overflow: hidden; 2546 overflow: hidden;
2547 } 2547 }
2548 @media (min-width: 992px) { 2548 @media (min-width: 992px) {
2549 .menu-is-actived { 2549 .menu-is-actived {
2550 overflow: auto; 2550 overflow: auto;
2551 } 2551 }
2552 } 2552 }
2553 .menu-is-actived .header__burger svg { 2553 .menu-is-actived .header__burger svg {
2554 display: none; 2554 display: none;
2555 } 2555 }
2556 .menu-is-actived .header__burger svg + svg { 2556 .menu-is-actived .header__burger svg + svg {
2557 display: block; 2557 display: block;
2558 } 2558 }
2559 .menu-is-actived .mob-menu { 2559 .menu-is-actived .mob-menu {
2560 display: block; 2560 display: block;
2561 } 2561 }
2562 @media (min-width: 992px) { 2562 @media (min-width: 992px) {
2563 .menu-is-actived .mob-menu { 2563 .menu-is-actived .mob-menu {
2564 display: none; 2564 display: none;
2565 } 2565 }
2566 } 2566 }
2567 2567
2568 .footer { 2568 .footer {
2569 -webkit-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25); 2569 -webkit-box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
2570 box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25); 2570 box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
2571 background: #fff; 2571 background: #fff;
2572 position: relative; 2572 position: relative;
2573 z-index: 1; 2573 z-index: 1;
2574 overflow: hidden; 2574 overflow: hidden;
2575 } 2575 }
2576 .footer__mobile { 2576 .footer__mobile {
2577 display: -webkit-box; 2577 display: -webkit-box;
2578 display: -ms-flexbox; 2578 display: -ms-flexbox;
2579 display: flex; 2579 display: flex;
2580 -webkit-box-orient: vertical; 2580 -webkit-box-orient: vertical;
2581 -webkit-box-direction: normal; 2581 -webkit-box-direction: normal;
2582 -ms-flex-direction: column; 2582 -ms-flex-direction: column;
2583 flex-direction: column; 2583 flex-direction: column;
2584 padding: 25px 0 30px 0; 2584 padding: 25px 0 30px 0;
2585 } 2585 }
2586 @media (min-width: 768px) { 2586 @media (min-width: 768px) {
2587 .footer__mobile { 2587 .footer__mobile {
2588 padding: 30px 0; 2588 padding: 30px 0;
2589 } 2589 }
2590 } 2590 }
2591 @media (min-width: 992px) { 2591 @media (min-width: 992px) {
2592 .footer__mobile { 2592 .footer__mobile {
2593 display: none; 2593 display: none;
2594 } 2594 }
2595 } 2595 }
2596 .footer__mobile-toper { 2596 .footer__mobile-toper {
2597 display: -webkit-box; 2597 display: -webkit-box;
2598 display: -ms-flexbox; 2598 display: -ms-flexbox;
2599 display: flex; 2599 display: flex;
2600 -webkit-box-pack: justify; 2600 -webkit-box-pack: justify;
2601 -ms-flex-pack: justify; 2601 -ms-flex-pack: justify;
2602 justify-content: space-between; 2602 justify-content: space-between;
2603 -webkit-box-align: center; 2603 -webkit-box-align: center;
2604 -ms-flex-align: center; 2604 -ms-flex-align: center;
2605 align-items: center; 2605 align-items: center;
2606 padding: 0; 2606 padding: 0;
2607 border: none; 2607 border: none;
2608 background: none; 2608 background: none;
2609 } 2609 }
2610 .footer__mobile-toper a, 2610 .footer__mobile-toper a,
2611 .footer__mobile-toper b { 2611 .footer__mobile-toper b {
2612 display: -webkit-box; 2612 display: -webkit-box;
2613 display: -ms-flexbox; 2613 display: -ms-flexbox;
2614 display: flex; 2614 display: flex;
2615 -webkit-box-pack: center; 2615 -webkit-box-pack: center;
2616 -ms-flex-pack: center; 2616 -ms-flex-pack: center;
2617 justify-content: center; 2617 justify-content: center;
2618 -webkit-box-align: center; 2618 -webkit-box-align: center;
2619 -ms-flex-align: center; 2619 -ms-flex-align: center;
2620 align-items: center; 2620 align-items: center;
2621 color: #377d87; 2621 color: #377d87;
2622 } 2622 }
2623 .footer__mobile-toper a svg, 2623 .footer__mobile-toper a svg,
2624 .footer__mobile-toper b svg { 2624 .footer__mobile-toper b svg {
2625 width: 137px; 2625 width: 137px;
2626 height: 40px; 2626 height: 40px;
2627 } 2627 }
2628 .footer__mobile-toper span { 2628 .footer__mobile-toper span {
2629 width: 40px; 2629 width: 40px;
2630 height: 40px; 2630 height: 40px;
2631 display: -webkit-box; 2631 display: -webkit-box;
2632 display: -ms-flexbox; 2632 display: -ms-flexbox;
2633 display: flex; 2633 display: flex;
2634 -webkit-box-pack: center; 2634 -webkit-box-pack: center;
2635 -ms-flex-pack: center; 2635 -ms-flex-pack: center;
2636 justify-content: center; 2636 justify-content: center;
2637 -webkit-box-align: center; 2637 -webkit-box-align: center;
2638 -ms-flex-align: center; 2638 -ms-flex-align: center;
2639 align-items: center; 2639 align-items: center;
2640 background: #377d87; 2640 background: #377d87;
2641 color: #fff; 2641 color: #fff;
2642 border-radius: 999px; 2642 border-radius: 999px;
2643 } 2643 }
2644 .footer__mobile-toper span svg { 2644 .footer__mobile-toper span svg {
2645 width: 10px; 2645 width: 10px;
2646 height: 10px; 2646 height: 10px;
2647 -webkit-transition: 0.3s; 2647 -webkit-transition: 0.3s;
2648 transition: 0.3s; 2648 transition: 0.3s;
2649 } 2649 }
2650 .footer__mobile-toper.active span svg { 2650 .footer__mobile-toper.active span svg {
2651 -webkit-transform: rotate(180deg); 2651 -webkit-transform: rotate(180deg);
2652 -ms-transform: rotate(180deg); 2652 -ms-transform: rotate(180deg);
2653 transform: rotate(180deg); 2653 transform: rotate(180deg);
2654 } 2654 }
2655 .footer__mobile-menu { 2655 .footer__mobile-menu {
2656 height: 0; 2656 height: 0;
2657 opacity: 0; 2657 opacity: 0;
2658 overflow: hidden; 2658 overflow: hidden;
2659 -webkit-transition: 0.3s; 2659 -webkit-transition: 0.3s;
2660 transition: 0.3s; 2660 transition: 0.3s;
2661 display: -webkit-box; 2661 display: -webkit-box;
2662 display: -ms-flexbox; 2662 display: -ms-flexbox;
2663 display: flex; 2663 display: flex;
2664 -webkit-box-orient: vertical; 2664 -webkit-box-orient: vertical;
2665 -webkit-box-direction: normal; 2665 -webkit-box-direction: normal;
2666 -ms-flex-direction: column; 2666 -ms-flex-direction: column;
2667 flex-direction: column; 2667 flex-direction: column;
2668 gap: 30px; 2668 gap: 30px;
2669 } 2669 }
2670 @media (min-width: 768px) { 2670 @media (min-width: 768px) {
2671 .footer__mobile-menu { 2671 .footer__mobile-menu {
2672 display: grid; 2672 display: grid;
2673 grid-template-columns: 1fr 1fr; 2673 grid-template-columns: 1fr 1fr;
2674 gap: 100px; 2674 gap: 100px;
2675 } 2675 }
2676 } 2676 }
2677 .footer__mobile-menu-item { 2677 .footer__mobile-menu-item {
2678 display: -webkit-box; 2678 display: -webkit-box;
2679 display: -ms-flexbox; 2679 display: -ms-flexbox;
2680 display: flex; 2680 display: flex;
2681 -webkit-box-orient: vertical; 2681 -webkit-box-orient: vertical;
2682 -webkit-box-direction: normal; 2682 -webkit-box-direction: normal;
2683 -ms-flex-direction: column; 2683 -ms-flex-direction: column;
2684 flex-direction: column; 2684 flex-direction: column;
2685 } 2685 }
2686 .footer__mobile-menu-item button { 2686 .footer__mobile-menu-item button {
2687 display: -webkit-box; 2687 display: -webkit-box;
2688 display: -ms-flexbox; 2688 display: -ms-flexbox;
2689 display: flex; 2689 display: flex;
2690 -webkit-box-align: start; 2690 -webkit-box-align: start;
2691 -ms-flex-align: start; 2691 -ms-flex-align: start;
2692 align-items: flex-start; 2692 align-items: flex-start;
2693 padding: 0; 2693 padding: 0;
2694 border: none; 2694 border: none;
2695 background: none; 2695 background: none;
2696 } 2696 }
2697 .footer__mobile-menu-item button.active { 2697 .footer__mobile-menu-item button.active {
2698 color: #377d87; 2698 color: #377d87;
2699 } 2699 }
2700 .footer__mobile-menu-item button b { 2700 .footer__mobile-menu-item button b {
2701 width: calc(100% - 24px); 2701 width: calc(100% - 24px);
2702 padding-right: 12px; 2702 padding-right: 12px;
2703 min-height: 24px; 2703 min-height: 24px;
2704 display: -webkit-box; 2704 display: -webkit-box;
2705 display: -ms-flexbox; 2705 display: -ms-flexbox;
2706 display: flex; 2706 display: flex;
2707 -webkit-box-align: center; 2707 -webkit-box-align: center;
2708 -ms-flex-align: center; 2708 -ms-flex-align: center;
2709 align-items: center; 2709 align-items: center;
2710 font-size: 20px; 2710 font-size: 20px;
2711 font-weight: 700; 2711 font-weight: 700;
2712 } 2712 }
2713 .footer__mobile-menu-item button span { 2713 .footer__mobile-menu-item button span {
2714 width: 24px; 2714 width: 24px;
2715 height: 24px; 2715 height: 24px;
2716 display: -webkit-box; 2716 display: -webkit-box;
2717 display: -ms-flexbox; 2717 display: -ms-flexbox;
2718 display: flex; 2718 display: flex;
2719 -webkit-box-pack: center; 2719 -webkit-box-pack: center;
2720 -ms-flex-pack: center; 2720 -ms-flex-pack: center;
2721 justify-content: center; 2721 justify-content: center;
2722 -webkit-box-align: center; 2722 -webkit-box-align: center;
2723 -ms-flex-align: center; 2723 -ms-flex-align: center;
2724 align-items: center; 2724 align-items: center;
2725 padding: 0; 2725 padding: 0;
2726 border: none; 2726 border: none;
2727 background: none; 2727 background: none;
2728 } 2728 }
2729 .footer__mobile-menu-item button svg { 2729 .footer__mobile-menu-item button svg {
2730 width: 12px; 2730 width: 12px;
2731 height: 12px; 2731 height: 12px;
2732 -webkit-transition: 0.3s; 2732 -webkit-transition: 0.3s;
2733 transition: 0.3s; 2733 transition: 0.3s;
2734 -webkit-transform: rotate(180deg); 2734 -webkit-transform: rotate(180deg);
2735 -ms-transform: rotate(180deg); 2735 -ms-transform: rotate(180deg);
2736 transform: rotate(180deg); 2736 transform: rotate(180deg);
2737 } 2737 }
2738 .footer__mobile-menu-item button.active svg { 2738 .footer__mobile-menu-item button.active svg {
2739 -webkit-transform: rotate(0deg); 2739 -webkit-transform: rotate(0deg);
2740 -ms-transform: rotate(0deg); 2740 -ms-transform: rotate(0deg);
2741 transform: rotate(0deg); 2741 transform: rotate(0deg);
2742 } 2742 }
2743 .footer__mobile-menu-item div { 2743 .footer__mobile-menu-item div {
2744 height: 0; 2744 height: 0;
2745 opacity: 0; 2745 opacity: 0;
2746 overflow: hidden; 2746 overflow: hidden;
2747 -webkit-transition: 0.3s; 2747 -webkit-transition: 0.3s;
2748 transition: 0.3s; 2748 transition: 0.3s;
2749 display: -webkit-box; 2749 display: -webkit-box;
2750 display: -ms-flexbox; 2750 display: -ms-flexbox;
2751 display: flex; 2751 display: flex;
2752 -webkit-box-orient: vertical; 2752 -webkit-box-orient: vertical;
2753 -webkit-box-direction: normal; 2753 -webkit-box-direction: normal;
2754 -ms-flex-direction: column; 2754 -ms-flex-direction: column;
2755 flex-direction: column; 2755 flex-direction: column;
2756 gap: 15px; 2756 gap: 15px;
2757 } 2757 }
2758 .footer__mobile-menu-item div a:hover { 2758 .footer__mobile-menu-item div a:hover {
2759 color: #377d87; 2759 color: #377d87;
2760 } 2760 }
2761 .footer__mobile-menu-item .active + div { 2761 .footer__mobile-menu-item .active + div {
2762 opacity: 1; 2762 opacity: 1;
2763 height: auto; 2763 height: auto;
2764 overflow: visible; 2764 overflow: visible;
2765 padding-top: 15px; 2765 padding-top: 15px;
2766 } 2766 }
2767 .active + .footer__mobile-menu { 2767 .active + .footer__mobile-menu {
2768 opacity: 1; 2768 opacity: 1;
2769 height: auto; 2769 height: auto;
2770 overflow: visible; 2770 overflow: visible;
2771 padding-top: 35px; 2771 padding-top: 35px;
2772 } 2772 }
2773 .footer__mobile-contacts { 2773 .footer__mobile-contacts {
2774 display: -webkit-box; 2774 display: -webkit-box;
2775 display: -ms-flexbox; 2775 display: -ms-flexbox;
2776 display: flex; 2776 display: flex;
2777 -webkit-box-pack: justify; 2777 -webkit-box-pack: justify;
2778 -ms-flex-pack: justify; 2778 -ms-flex-pack: justify;
2779 justify-content: space-between; 2779 justify-content: space-between;
2780 -webkit-box-align: start; 2780 -webkit-box-align: start;
2781 -ms-flex-align: start; 2781 -ms-flex-align: start;
2782 align-items: flex-start; 2782 align-items: flex-start;
2783 -ms-flex-wrap: wrap; 2783 -ms-flex-wrap: wrap;
2784 flex-wrap: wrap; 2784 flex-wrap: wrap;
2785 margin-top: 30px; 2785 margin-top: 30px;
2786 } 2786 }
2787 .footer__mobile-contacts b { 2787 .footer__mobile-contacts b {
2788 font-size: 20px; 2788 font-size: 20px;
2789 font-weight: 700; 2789 font-weight: 700;
2790 width: 100%; 2790 width: 100%;
2791 margin-bottom: 20px; 2791 margin-bottom: 20px;
2792 } 2792 }
2793 .footer__mobile-contacts a { 2793 .footer__mobile-contacts a {
2794 color: #377d87; 2794 color: #377d87;
2795 text-decoration: underline; 2795 text-decoration: underline;
2796 } 2796 }
2797 .footer__mobile-contacts a + a { 2797 .footer__mobile-contacts a + a {
2798 color: #000; 2798 color: #000;
2799 } 2799 }
2800 .footer__mobile-bottom { 2800 .footer__mobile-bottom {
2801 display: -webkit-box; 2801 display: -webkit-box;
2802 display: -ms-flexbox; 2802 display: -ms-flexbox;
2803 display: flex; 2803 display: flex;
2804 -webkit-box-orient: vertical; 2804 -webkit-box-orient: vertical;
2805 -webkit-box-direction: normal; 2805 -webkit-box-direction: normal;
2806 -ms-flex-direction: column; 2806 -ms-flex-direction: column;
2807 flex-direction: column; 2807 flex-direction: column;
2808 -webkit-box-align: center; 2808 -webkit-box-align: center;
2809 -ms-flex-align: center; 2809 -ms-flex-align: center;
2810 align-items: center; 2810 align-items: center;
2811 text-align: center; 2811 text-align: center;
2812 gap: 20px; 2812 gap: 20px;
2813 margin-top: 100px; 2813 margin-top: 100px;
2814 } 2814 }
2815 .footer__mobile-links { 2815 .footer__mobile-links {
2816 display: -webkit-box; 2816 display: -webkit-box;
2817 display: -ms-flexbox; 2817 display: -ms-flexbox;
2818 display: flex; 2818 display: flex;
2819 -webkit-box-orient: vertical; 2819 -webkit-box-orient: vertical;
2820 -webkit-box-direction: normal; 2820 -webkit-box-direction: normal;
2821 -ms-flex-direction: column; 2821 -ms-flex-direction: column;
2822 flex-direction: column; 2822 flex-direction: column;
2823 -webkit-box-align: center; 2823 -webkit-box-align: center;
2824 -ms-flex-align: center; 2824 -ms-flex-align: center;
2825 align-items: center; 2825 align-items: center;
2826 gap: 10px; 2826 gap: 10px;
2827 } 2827 }
2828 .footer__mobile-links a:hover { 2828 .footer__mobile-links a:hover {
2829 color: #377d87; 2829 color: #377d87;
2830 } 2830 }
2831 .footer__mobile-links span { 2831 .footer__mobile-links span {
2832 width: 60px; 2832 width: 60px;
2833 height: 1px; 2833 height: 1px;
2834 background: #377d87; 2834 background: #377d87;
2835 } 2835 }
2836 .footer__main { 2836 .footer__main {
2837 display: none; 2837 display: none;
2838 padding: 55px 0 20px 0; 2838 padding: 55px 0 20px 0;
2839 -webkit-box-orient: vertical; 2839 -webkit-box-orient: vertical;
2840 -webkit-box-direction: normal; 2840 -webkit-box-direction: normal;
2841 -ms-flex-direction: column; 2841 -ms-flex-direction: column;
2842 flex-direction: column; 2842 flex-direction: column;
2843 gap: 70px; 2843 gap: 70px;
2844 } 2844 }
2845 @media (min-width: 992px) { 2845 @media (min-width: 992px) {
2846 .footer__main { 2846 .footer__main {
2847 display: -webkit-box; 2847 display: -webkit-box;
2848 display: -ms-flexbox; 2848 display: -ms-flexbox;
2849 display: flex; 2849 display: flex;
2850 } 2850 }
2851 } 2851 }
2852 .footer__main-body { 2852 .footer__main-body {
2853 display: -webkit-box; 2853 display: -webkit-box;
2854 display: -ms-flexbox; 2854 display: -ms-flexbox;
2855 display: flex; 2855 display: flex;
2856 -webkit-box-pack: justify; 2856 -webkit-box-pack: justify;
2857 -ms-flex-pack: justify; 2857 -ms-flex-pack: justify;
2858 justify-content: space-between; 2858 justify-content: space-between;
2859 -webkit-box-align: start; 2859 -webkit-box-align: start;
2860 -ms-flex-align: start; 2860 -ms-flex-align: start;
2861 align-items: flex-start; 2861 align-items: flex-start;
2862 } 2862 }
2863 .footer__main-logo { 2863 .footer__main-logo {
2864 display: -webkit-box; 2864 display: -webkit-box;
2865 display: -ms-flexbox; 2865 display: -ms-flexbox;
2866 display: flex; 2866 display: flex;
2867 -webkit-box-pack: center; 2867 -webkit-box-pack: center;
2868 -ms-flex-pack: center; 2868 -ms-flex-pack: center;
2869 justify-content: center; 2869 justify-content: center;
2870 -webkit-box-align: center; 2870 -webkit-box-align: center;
2871 -ms-flex-align: center; 2871 -ms-flex-align: center;
2872 align-items: center; 2872 align-items: center;
2873 color: #377d87; 2873 color: #377d87;
2874 } 2874 }
2875 .footer__main-logo svg { 2875 .footer__main-logo svg {
2876 width: 182px; 2876 width: 182px;
2877 height: 54px; 2877 height: 54px;
2878 } 2878 }
2879 .footer__main-title { 2879 .footer__main-title {
2880 font-size: 20px; 2880 font-size: 20px;
2881 font-weight: 700; 2881 font-weight: 700;
2882 margin-bottom: 16px; 2882 margin-bottom: 16px;
2883 } 2883 }
2884 .footer__main-col { 2884 .footer__main-col {
2885 display: -webkit-box; 2885 display: -webkit-box;
2886 display: -ms-flexbox; 2886 display: -ms-flexbox;
2887 display: flex; 2887 display: flex;
2888 -webkit-box-orient: vertical; 2888 -webkit-box-orient: vertical;
2889 -webkit-box-direction: normal; 2889 -webkit-box-direction: normal;
2890 -ms-flex-direction: column; 2890 -ms-flex-direction: column;
2891 flex-direction: column; 2891 flex-direction: column;
2892 -webkit-box-align: start; 2892 -webkit-box-align: start;
2893 -ms-flex-align: start; 2893 -ms-flex-align: start;
2894 align-items: flex-start; 2894 align-items: flex-start;
2895 } 2895 }
2896 .footer__main-col nav { 2896 .footer__main-col nav {
2897 display: -webkit-box; 2897 display: -webkit-box;
2898 display: -ms-flexbox; 2898 display: -ms-flexbox;
2899 display: flex; 2899 display: flex;
2900 -webkit-box-orient: vertical; 2900 -webkit-box-orient: vertical;
2901 -webkit-box-direction: normal; 2901 -webkit-box-direction: normal;
2902 -ms-flex-direction: column; 2902 -ms-flex-direction: column;
2903 flex-direction: column; 2903 flex-direction: column;
2904 -webkit-box-align: start; 2904 -webkit-box-align: start;
2905 -ms-flex-align: start; 2905 -ms-flex-align: start;
2906 align-items: flex-start; 2906 align-items: flex-start;
2907 gap: 8px; 2907 gap: 8px;
2908 } 2908 }
2909 .footer__main-col nav a:hover { 2909 .footer__main-col nav a:hover {
2910 color: #377d87; 2910 color: #377d87;
2911 } 2911 }
2912 .footer__main-contacts { 2912 .footer__main-contacts {
2913 display: -webkit-box; 2913 display: -webkit-box;
2914 display: -ms-flexbox; 2914 display: -ms-flexbox;
2915 display: flex; 2915 display: flex;
2916 -webkit-box-orient: vertical; 2916 -webkit-box-orient: vertical;
2917 -webkit-box-direction: normal; 2917 -webkit-box-direction: normal;
2918 -ms-flex-direction: column; 2918 -ms-flex-direction: column;
2919 flex-direction: column; 2919 flex-direction: column;
2920 -webkit-box-align: start; 2920 -webkit-box-align: start;
2921 -ms-flex-align: start; 2921 -ms-flex-align: start;
2922 align-items: flex-start; 2922 align-items: flex-start;
2923 gap: 16px; 2923 gap: 16px;
2924 margin-bottom: 16px; 2924 margin-bottom: 16px;
2925 } 2925 }
2926 .footer__main-contacts a { 2926 .footer__main-contacts a {
2927 color: #377d87; 2927 color: #377d87;
2928 text-decoration: underline; 2928 text-decoration: underline;
2929 } 2929 }
2930 .footer__main-contacts a + a { 2930 .footer__main-contacts a + a {
2931 color: #000; 2931 color: #000;
2932 } 2932 }
2933 .footer__main-copy { 2933 .footer__main-copy {
2934 display: -webkit-box; 2934 display: -webkit-box;
2935 display: -ms-flexbox; 2935 display: -ms-flexbox;
2936 display: flex; 2936 display: flex;
2937 -webkit-box-pack: justify; 2937 -webkit-box-pack: justify;
2938 -ms-flex-pack: justify; 2938 -ms-flex-pack: justify;
2939 justify-content: space-between; 2939 justify-content: space-between;
2940 -webkit-box-align: center; 2940 -webkit-box-align: center;
2941 -ms-flex-align: center; 2941 -ms-flex-align: center;
2942 align-items: center; 2942 align-items: center;
2943 font-size: 14px; 2943 font-size: 14px;
2944 line-height: 1.4; 2944 line-height: 1.4;
2945 } 2945 }
2946 .footer__main-copy nav { 2946 .footer__main-copy nav {
2947 display: -webkit-box; 2947 display: -webkit-box;
2948 display: -ms-flexbox; 2948 display: -ms-flexbox;
2949 display: flex; 2949 display: flex;
2950 -webkit-box-align: center; 2950 -webkit-box-align: center;
2951 -ms-flex-align: center; 2951 -ms-flex-align: center;
2952 align-items: center; 2952 align-items: center;
2953 gap: 10px; 2953 gap: 10px;
2954 } 2954 }
2955 .footer__main-copy nav a:hover { 2955 .footer__main-copy nav a:hover {
2956 color: #377d87; 2956 color: #377d87;
2957 } 2957 }
2958 .footer__main-copy nav span { 2958 .footer__main-copy nav span {
2959 width: 1px; 2959 width: 1px;
2960 height: 20px; 2960 height: 20px;
2961 background: #000; 2961 background: #000;
2962 } 2962 }
2963 2963
2964 .main { 2964 .main {
2965 position: relative; 2965 position: relative;
2966 overflow: hidden; 2966 overflow: hidden;
2967 padding: 30px 0; 2967 padding: 30px 0;
2968 } 2968 }
2969 @media (min-width: 768px) { 2969 @media (min-width: 768px) {
2970 .main { 2970 .main {
2971 padding: 40px 0; 2971 padding: 40px 0;
2972 } 2972 }
2973 } 2973 }
2974 @media (min-width: 992px) { 2974 @media (min-width: 992px) {
2975 .main { 2975 .main {
2976 padding: 50px 0; 2976 padding: 50px 0;
2977 } 2977 }
2978 } 2978 }
2979 @media (min-width: 1280px) { 2979 @media (min-width: 1280px) {
2980 .main { 2980 .main {
2981 padding: 60px 0; 2981 padding: 60px 0;
2982 } 2982 }
2983 } 2983 }
2984 .main h2 { 2984 .main h2 {
2985 margin: 0; 2985 margin: 0;
2986 font-weight: 700; 2986 font-weight: 700;
2987 font-size: 30px; 2987 font-size: 30px;
2988 } 2988 }
2989 @media (min-width: 768px) { 2989 @media (min-width: 768px) {
2990 .main h2 { 2990 .main h2 {
2991 font-size: 44px; 2991 font-size: 44px;
2992 } 2992 }
2993 } 2993 }
2994 .main h3 { 2994 .main h3 {
2995 margin: 0; 2995 margin: 0;
2996 font-weight: 700; 2996 font-weight: 700;
2997 font-size: 22px; 2997 font-size: 22px;
2998 } 2998 }
2999 @media (min-width: 768px) { 2999 @media (min-width: 768px) {
3000 .main h3 { 3000 .main h3 {
3001 font-size: 28px; 3001 font-size: 28px;
3002 } 3002 }
3003 } 3003 }
3004 .main p { 3004 .main p {
3005 margin: 0; 3005 margin: 0;
3006 font-size: 14px; 3006 font-size: 14px;
3007 line-height: 1.4; 3007 line-height: 1.4;
3008 } 3008 }
3009 @media (min-width: 768px) { 3009 @media (min-width: 768px) {
3010 .main p { 3010 .main p {
3011 font-size: 18px; 3011 font-size: 18px;
3012 } 3012 }
3013 } 3013 }
3014 .main p a { 3014 .main p a {
3015 color: #4d88d9; 3015 color: #4d88d9;
3016 } 3016 }
3017 .main p a:hover { 3017 .main p a:hover {
3018 color: #377d87; 3018 color: #377d87;
3019 } 3019 }
3020 .main__breadcrumbs { 3020 .main__breadcrumbs {
3021 margin-bottom: 20px; 3021 margin-bottom: 20px;
3022 } 3022 }
3023 @media (min-width: 768px) { 3023 @media (min-width: 768px) {
3024 .main__breadcrumbs { 3024 .main__breadcrumbs {
3025 margin-bottom: 40px; 3025 margin-bottom: 40px;
3026 } 3026 }
3027 } 3027 }
3028 .main__content { 3028 .main__content {
3029 display: -webkit-box; 3029 display: -webkit-box;
3030 display: -ms-flexbox; 3030 display: -ms-flexbox;
3031 display: flex; 3031 display: flex;
3032 -webkit-box-orient: vertical; 3032 -webkit-box-orient: vertical;
3033 -webkit-box-direction: normal; 3033 -webkit-box-direction: normal;
3034 -ms-flex-direction: column; 3034 -ms-flex-direction: column;
3035 flex-direction: column; 3035 flex-direction: column;
3036 gap: 20px; 3036 gap: 20px;
3037 font-size: 14px; 3037 font-size: 14px;
3038 } 3038 }
3039 @media (min-width: 992px) { 3039 @media (min-width: 992px) {
3040 .main__content { 3040 .main__content {
3041 font-size: 18px; 3041 font-size: 18px;
3042 gap: 32px; 3042 gap: 32px;
3043 } 3043 }
3044 } 3044 }
3045 .main__content-item { 3045 .main__content-item {
3046 display: -webkit-box; 3046 display: -webkit-box;
3047 display: -ms-flexbox; 3047 display: -ms-flexbox;
3048 display: flex; 3048 display: flex;
3049 -webkit-box-orient: vertical; 3049 -webkit-box-orient: vertical;
3050 -webkit-box-direction: normal; 3050 -webkit-box-direction: normal;
3051 -ms-flex-direction: column; 3051 -ms-flex-direction: column;
3052 flex-direction: column; 3052 flex-direction: column;
3053 gap: 16px; 3053 gap: 16px;
3054 } 3054 }
3055 .main__content h1, 3055 .main__content h1,
3056 .main__content h2, 3056 .main__content h2,
3057 .main__content h3, 3057 .main__content h3,
3058 .main__content h4, 3058 .main__content h4,
3059 .main__content h5, 3059 .main__content h5,
3060 .main__content h6 { 3060 .main__content h6 {
3061 color: #000; 3061 color: #000;
3062 } 3062 }
3063 .main__content ul, 3063 .main__content ul,
3064 .main__content ol { 3064 .main__content ol {
3065 padding: 0; 3065 padding: 0;
3066 margin: 0; 3066 margin: 0;
3067 padding-left: 20px; 3067 padding-left: 20px;
3068 display: -webkit-box; 3068 display: -webkit-box;
3069 display: -ms-flexbox; 3069 display: -ms-flexbox;
3070 display: flex; 3070 display: flex;
3071 -webkit-box-orient: vertical; 3071 -webkit-box-orient: vertical;
3072 -webkit-box-direction: normal; 3072 -webkit-box-direction: normal;
3073 -ms-flex-direction: column; 3073 -ms-flex-direction: column;
3074 flex-direction: column; 3074 flex-direction: column;
3075 gap: 8px; 3075 gap: 8px;
3076 } 3076 }
3077 @media (min-width: 992px) { 3077 @media (min-width: 992px) {
3078 .main__content ul, 3078 .main__content ul,
3079 .main__content ol { 3079 .main__content ol {
3080 gap: 16px; 3080 gap: 16px;
3081 padding-left: 30px; 3081 padding-left: 30px;
3082 } 3082 }
3083 } 3083 }
3084 .main__content li ul, 3084 .main__content li ul,
3085 .main__content li ol { 3085 .main__content li ol {
3086 margin-top: 8px; 3086 margin-top: 8px;
3087 } 3087 }
3088 @media (min-width: 992px) { 3088 @media (min-width: 992px) {
3089 .main__content li ul, 3089 .main__content li ul,
3090 .main__content li ol { 3090 .main__content li ol {
3091 margin-top: 16px; 3091 margin-top: 16px;
3092 } 3092 }
3093 } 3093 }
3094 .main__content li ul li, 3094 .main__content li ul li,
3095 .main__content li ol li { 3095 .main__content li ol li {
3096 list-style-type: disc; 3096 list-style-type: disc;
3097 } 3097 }
3098 .main__gallery { 3098 .main__gallery {
3099 display: -webkit-box; 3099 display: -webkit-box;
3100 display: -ms-flexbox; 3100 display: -ms-flexbox;
3101 display: flex; 3101 display: flex;
3102 -webkit-box-orient: vertical; 3102 -webkit-box-orient: vertical;
3103 -webkit-box-direction: normal; 3103 -webkit-box-direction: normal;
3104 -ms-flex-direction: column; 3104 -ms-flex-direction: column;
3105 flex-direction: column; 3105 flex-direction: column;
3106 gap: 20px; 3106 gap: 20px;
3107 } 3107 }
3108 @media (min-width: 768px) { 3108 @media (min-width: 768px) {
3109 .main__gallery { 3109 .main__gallery {
3110 display: grid; 3110 display: grid;
3111 grid-template-columns: repeat(2, 1fr); 3111 grid-template-columns: repeat(2, 1fr);
3112 } 3112 }
3113 } 3113 }
3114 @media (min-width: 992px) { 3114 @media (min-width: 992px) {
3115 .main__gallery { 3115 .main__gallery {
3116 grid-template-columns: repeat(3, 1fr); 3116 grid-template-columns: repeat(3, 1fr);
3117 } 3117 }
3118 } 3118 }
3119 .main__gallery-item { 3119 .main__gallery-item {
3120 width: 100%; 3120 width: 100%;
3121 aspect-ratio: 400/224; 3121 aspect-ratio: 400/224;
3122 border-radius: 30px; 3122 border-radius: 30px;
3123 position: relative; 3123 position: relative;
3124 overflow: hidden; 3124 overflow: hidden;
3125 } 3125 }
3126 .main__gallery-item:hover { 3126 .main__gallery-item:hover {
3127 -webkit-filter: brightness(1.1); 3127 -webkit-filter: brightness(1.1);
3128 filter: brightness(1.1); 3128 filter: brightness(1.1);
3129 } 3129 }
3130 .main__gallery-item img { 3130 .main__gallery-item img {
3131 position: absolute; 3131 position: absolute;
3132 top: 0; 3132 top: 0;
3133 left: 0; 3133 left: 0;
3134 width: 100%; 3134 width: 100%;
3135 height: 100%; 3135 height: 100%;
3136 -o-object-fit: cover; 3136 -o-object-fit: cover;
3137 object-fit: cover; 3137 object-fit: cover;
3138 } 3138 }
3139 .main__employers { 3139 .main__employers {
3140 display: -webkit-box; 3140 display: -webkit-box;
3141 display: -ms-flexbox; 3141 display: -ms-flexbox;
3142 display: flex; 3142 display: flex;
3143 -webkit-box-orient: vertical; 3143 -webkit-box-orient: vertical;
3144 -webkit-box-direction: normal; 3144 -webkit-box-direction: normal;
3145 -ms-flex-direction: column; 3145 -ms-flex-direction: column;
3146 flex-direction: column; 3146 flex-direction: column;
3147 gap: 10px; 3147 gap: 10px;
3148 } 3148 }
3149 @media (min-width: 768px) { 3149 @media (min-width: 768px) {
3150 .main__employers { 3150 .main__employers {
3151 gap: 30px; 3151 gap: 30px;
3152 } 3152 }
3153 } 3153 }
3154 .main__employers-body { 3154 .main__employers-body {
3155 display: none; 3155 display: none;
3156 -webkit-box-orient: vertical; 3156 -webkit-box-orient: vertical;
3157 -webkit-box-direction: normal; 3157 -webkit-box-direction: normal;
3158 -ms-flex-direction: column; 3158 -ms-flex-direction: column;
3159 flex-direction: column; 3159 flex-direction: column;
3160 gap: 20px; 3160 gap: 20px;
3161 } 3161 }
3162 @media (min-width: 992px) { 3162 @media (min-width: 992px) {
3163 .main__employers-body { 3163 .main__employers-body {
3164 gap: 30px; 3164 gap: 30px;
3165 } 3165 }
3166 } 3166 }
3167 .main__employers-body.showed { 3167 .main__employers-body.showed {
3168 display: -webkit-box; 3168 display: -webkit-box;
3169 display: -ms-flexbox; 3169 display: -ms-flexbox;
3170 display: flex; 3170 display: flex;
3171 } 3171 }
3172 .main__employers-item { 3172 .main__employers-item {
3173 display: -webkit-box; 3173 display: -webkit-box;
3174 display: -ms-flexbox; 3174 display: -ms-flexbox;
3175 display: flex; 3175 display: flex;
3176 -webkit-box-orient: vertical; 3176 -webkit-box-orient: vertical;
3177 -webkit-box-direction: normal; 3177 -webkit-box-direction: normal;
3178 -ms-flex-direction: column; 3178 -ms-flex-direction: column;
3179 flex-direction: column; 3179 flex-direction: column;
3180 border: 1px solid #cecece; 3180 border: 1px solid #cecece;
3181 border-radius: 8px; 3181 border-radius: 8px;
3182 position: relative; 3182 position: relative;
3183 overflow: hidden; 3183 overflow: hidden;
3184 padding: 10px; 3184 padding: 10px;
3185 padding-top: 50px; 3185 padding-top: 50px;
3186 padding-bottom: 30px; 3186 padding-bottom: 30px;
3187 } 3187 }
3188 @media (min-width: 768px) { 3188 @media (min-width: 768px) {
3189 .main__employers-item { 3189 .main__employers-item {
3190 -webkit-box-orient: horizontal; 3190 -webkit-box-orient: horizontal;
3191 -webkit-box-direction: normal; 3191 -webkit-box-direction: normal;
3192 -ms-flex-direction: row; 3192 -ms-flex-direction: row;
3193 flex-direction: row; 3193 flex-direction: row;
3194 -webkit-box-align: center; 3194 -webkit-box-align: center;
3195 -ms-flex-align: center; 3195 -ms-flex-align: center;
3196 align-items: center; 3196 align-items: center;
3197 -webkit-box-pack: justify; 3197 -webkit-box-pack: justify;
3198 -ms-flex-pack: justify; 3198 -ms-flex-pack: justify;
3199 justify-content: space-between; 3199 justify-content: space-between;
3200 padding: 55px 20px; 3200 padding: 55px 20px;
3201 } 3201 }
3202 } 3202 }
3203 @media (min-width: 1280px) { 3203 @media (min-width: 1280px) {
3204 .main__employers-item { 3204 .main__employers-item {
3205 padding-left: 55px; 3205 padding-left: 55px;
3206 } 3206 }
3207 } 3207 }
3208 .main__employers-item-inner { 3208 .main__employers-item-inner {
3209 display: -webkit-box; 3209 display: -webkit-box;
3210 display: -ms-flexbox; 3210 display: -ms-flexbox;
3211 display: flex; 3211 display: flex;
3212 -webkit-box-orient: vertical; 3212 -webkit-box-orient: vertical;
3213 -webkit-box-direction: normal; 3213 -webkit-box-direction: normal;
3214 -ms-flex-direction: column; 3214 -ms-flex-direction: column;
3215 flex-direction: column; 3215 flex-direction: column;
3216 } 3216 }
3217 @media (min-width: 768px) { 3217 @media (min-width: 768px) {
3218 .main__employers-item-inner { 3218 .main__employers-item-inner {
3219 width: calc(100% - 200px); 3219 width: calc(100% - 200px);
3220 padding-right: 40px; 3220 padding-right: 40px;
3221 } 3221 }
3222 } 3222 }
3223 @media (min-width: 992px) { 3223 @media (min-width: 992px) {
3224 .main__employers-item-inner { 3224 .main__employers-item-inner {
3225 -webkit-box-orient: horizontal; 3225 -webkit-box-orient: horizontal;
3226 -webkit-box-direction: normal; 3226 -webkit-box-direction: normal;
3227 -ms-flex-direction: row; 3227 -ms-flex-direction: row;
3228 flex-direction: row; 3228 flex-direction: row;
3229 -webkit-box-align: center; 3229 -webkit-box-align: center;
3230 -ms-flex-align: center; 3230 -ms-flex-align: center;
3231 align-items: center; 3231 align-items: center;
3232 } 3232 }
3233 } 3233 }
3234 .main__employers-item-pic { 3234 .main__employers-item-pic {
3235 height: 30px; 3235 height: 30px;
3236 position: absolute; 3236 position: absolute;
3237 top: 10px; 3237 top: 10px;
3238 left: 10px; 3238 left: 10px;
3239 } 3239 }
3240 @media (min-width: 768px) { 3240 @media (min-width: 768px) {
3241 .main__employers-item-pic { 3241 .main__employers-item-pic {
3242 position: static; 3242 position: static;
3243 width: 150px; 3243 width: 150px;
3244 height: auto; 3244 height: auto;
3245 max-height: 150px; 3245 max-height: 150px;
3246 -o-object-fit: contain; 3246 -o-object-fit: contain;
3247 object-fit: contain; 3247 object-fit: contain;
3248 } 3248 }
3249 } 3249 }
3250 .main__employers-item-body { 3250 .main__employers-item-body {
3251 font-size: 12px; 3251 font-size: 12px;
3252 display: -webkit-box; 3252 display: -webkit-box;
3253 display: -ms-flexbox; 3253 display: -ms-flexbox;
3254 display: flex; 3254 display: flex;
3255 -webkit-box-orient: vertical; 3255 -webkit-box-orient: vertical;
3256 -webkit-box-direction: normal; 3256 -webkit-box-direction: normal;
3257 -ms-flex-direction: column; 3257 -ms-flex-direction: column;
3258 flex-direction: column; 3258 flex-direction: column;
3259 gap: 10px; 3259 gap: 10px;
3260 } 3260 }
3261 @media (min-width: 768px) { 3261 @media (min-width: 768px) {
3262 .main__employers-item-body { 3262 .main__employers-item-body {
3263 font-size: 16px; 3263 font-size: 16px;
3264 padding-top: 20px; 3264 padding-top: 20px;
3265 } 3265 }
3266 } 3266 }
3267 @media (min-width: 992px) { 3267 @media (min-width: 992px) {
3268 .main__employers-item-body { 3268 .main__employers-item-body {
3269 width: calc(100% - 150px); 3269 width: calc(100% - 150px);
3270 padding: 0; 3270 padding: 0;
3271 padding-left: 40px; 3271 padding-left: 40px;
3272 } 3272 }
3273 } 3273 }
3274 .main__employers-item-body b { 3274 .main__employers-item-body b {
3275 font-weight: 700; 3275 font-weight: 700;
3276 } 3276 }
3277 @media (min-width: 768px) { 3277 @media (min-width: 768px) {
3278 .main__employers-item-body b { 3278 .main__employers-item-body b {
3279 font-size: 20px; 3279 font-size: 20px;
3280 } 3280 }
3281 } 3281 }
3282 .main__employers-item-body i { 3282 .main__employers-item-body i {
3283 font-style: normal; 3283 font-style: normal;
3284 color: #000; 3284 color: #000;
3285 } 3285 }
3286 .main__employers-item-more { 3286 .main__employers-item-more {
3287 position: absolute; 3287 position: absolute;
3288 top: 10px; 3288 top: 10px;
3289 right: 10px; 3289 right: 10px;
3290 } 3290 }
3291 @media (min-width: 768px) { 3291 @media (min-width: 768px) {
3292 .main__employers-item-more { 3292 .main__employers-item-more {
3293 width: 200px; 3293 width: 200px;
3294 padding: 0; 3294 padding: 0;
3295 position: static; 3295 position: static;
3296 } 3296 }
3297 } 3297 }
3298 .main__employers-item-label { 3298 .main__employers-item-label {
3299 background: #4d88d9; 3299 background: #4d88d9;
3300 color: #fff; 3300 color: #fff;
3301 border-radius: 6px; 3301 border-radius: 6px;
3302 width: 100%; 3302 width: 100%;
3303 height: 20px; 3303 height: 20px;
3304 display: -webkit-box; 3304 display: -webkit-box;
3305 display: -ms-flexbox; 3305 display: -ms-flexbox;
3306 display: flex; 3306 display: flex;
3307 -webkit-box-align: center; 3307 -webkit-box-align: center;
3308 -ms-flex-align: center; 3308 -ms-flex-align: center;
3309 align-items: center; 3309 align-items: center;
3310 padding: 0 12px; 3310 padding: 0 12px;
3311 position: absolute; 3311 position: absolute;
3312 bottom: 0; 3312 bottom: 0;
3313 left: 0; 3313 left: 0;
3314 font-size: 12px; 3314 font-size: 12px;
3315 line-height: 1; 3315 line-height: 1;
3316 } 3316 }
3317 @media (min-width: 768px) { 3317 @media (min-width: 768px) {
3318 .main__employers-item-label { 3318 .main__employers-item-label {
3319 max-width: 350px; 3319 max-width: 350px;
3320 height: 30px; 3320 height: 30px;
3321 font-size: 15px; 3321 font-size: 15px;
3322 } 3322 }
3323 } 3323 }
3324 .main__employers-item-label svg { 3324 .main__employers-item-label svg {
3325 width: 8px; 3325 width: 8px;
3326 height: 8px; 3326 height: 8px;
3327 } 3327 }
3328 @media (min-width: 768px) { 3328 @media (min-width: 768px) {
3329 .main__employers-item-label svg { 3329 .main__employers-item-label svg {
3330 width: 12px; 3330 width: 12px;
3331 height: 12px; 3331 height: 12px;
3332 } 3332 }
3333 } 3333 }
3334 .main__employers-item-label span { 3334 .main__employers-item-label span {
3335 overflow: hidden; 3335 overflow: hidden;
3336 display: -webkit-box; 3336 display: -webkit-box;
3337 -webkit-box-orient: vertical; 3337 -webkit-box-orient: vertical;
3338 -webkit-line-clamp: 1; 3338 -webkit-line-clamp: 1;
3339 width: calc(100% - 8px); 3339 width: calc(100% - 8px);
3340 padding-left: 6px; 3340 padding-left: 6px;
3341 } 3341 }
3342 .main__employers-one { 3342 .main__employers-one {
3343 display: -webkit-box; 3343 display: -webkit-box;
3344 display: -ms-flexbox; 3344 display: -ms-flexbox;
3345 display: flex; 3345 display: flex;
3346 -webkit-box-orient: vertical; 3346 -webkit-box-orient: vertical;
3347 -webkit-box-direction: normal; 3347 -webkit-box-direction: normal;
3348 -ms-flex-direction: column; 3348 -ms-flex-direction: column;
3349 flex-direction: column; 3349 flex-direction: column;
3350 gap: 20px; 3350 gap: 20px;
3351 } 3351 }
3352 .main__employers-two { 3352 .main__employers-two {
3353 display: -webkit-box; 3353 display: -webkit-box;
3354 display: -ms-flexbox; 3354 display: -ms-flexbox;
3355 display: flex; 3355 display: flex;
3356 -webkit-box-orient: vertical; 3356 -webkit-box-orient: vertical;
3357 -webkit-box-direction: normal; 3357 -webkit-box-direction: normal;
3358 -ms-flex-direction: column; 3358 -ms-flex-direction: column;
3359 flex-direction: column; 3359 flex-direction: column;
3360 gap: 20px; 3360 gap: 20px;
3361 } 3361 }
3362 @media (min-width: 768px) { 3362 @media (min-width: 768px) {
3363 .main__employers-two { 3363 .main__employers-two {
3364 -webkit-box-orient: horizontal; 3364 -webkit-box-orient: horizontal;
3365 -webkit-box-direction: normal; 3365 -webkit-box-direction: normal;
3366 -ms-flex-direction: row; 3366 -ms-flex-direction: row;
3367 flex-direction: row; 3367 flex-direction: row;
3368 -ms-flex-wrap: wrap; 3368 -ms-flex-wrap: wrap;
3369 flex-wrap: wrap; 3369 flex-wrap: wrap;
3370 -webkit-box-align: start; 3370 -webkit-box-align: start;
3371 -ms-flex-align: start; 3371 -ms-flex-align: start;
3372 align-items: flex-start; 3372 align-items: flex-start;
3373 -webkit-box-pack: justify; 3373 -webkit-box-pack: justify;
3374 -ms-flex-pack: justify; 3374 -ms-flex-pack: justify;
3375 justify-content: space-between; 3375 justify-content: space-between;
3376 gap: 20px 0; 3376 gap: 20px 0;
3377 } 3377 }
3378 } 3378 }
3379 .main__employers-two .main__employers-item { 3379 .main__employers-two .main__employers-item {
3380 width: calc(50% - 10px); 3380 width: calc(50% - 10px);
3381 -webkit-box-orient: vertical; 3381 -webkit-box-orient: vertical;
3382 -webkit-box-direction: normal; 3382 -webkit-box-direction: normal;
3383 -ms-flex-direction: column; 3383 -ms-flex-direction: column;
3384 flex-direction: column; 3384 flex-direction: column;
3385 -webkit-box-align: stretch; 3385 -webkit-box-align: stretch;
3386 -ms-flex-align: stretch; 3386 -ms-flex-align: stretch;
3387 align-items: stretch; 3387 align-items: stretch;
3388 padding-top: 30px; 3388 padding-top: 30px;
3389 } 3389 }
3390 .main__employers-two .main__employers-item-inner { 3390 .main__employers-two .main__employers-item-inner {
3391 width: 100%; 3391 width: 100%;
3392 padding: 0; 3392 padding: 0;
3393 } 3393 }
3394 .main__employers-two .main__employers-item-more { 3394 .main__employers-two .main__employers-item-more {
3395 position: static; 3395 position: static;
3396 margin-top: 20px; 3396 margin-top: 20px;
3397 } 3397 }
3398 @media (min-width: 992px) { 3398 @media (min-width: 992px) {
3399 .main__employers-two .main__employers-item-more { 3399 .main__employers-two .main__employers-item-more {
3400 margin-left: 190px; 3400 margin-left: 190px;
3401 } 3401 }
3402 } 3402 }
3403 .main__employers-two .main__employers-item-label { 3403 .main__employers-two .main__employers-item-label {
3404 max-width: none; 3404 max-width: none;
3405 } 3405 }
3406 .main__employer-page { 3406 .main__employer-page {
3407 display: -webkit-box; 3407 display: -webkit-box;
3408 display: -ms-flexbox; 3408 display: -ms-flexbox;
3409 display: flex; 3409 display: flex;
3410 -webkit-box-orient: vertical; 3410 -webkit-box-orient: vertical;
3411 -webkit-box-direction: normal; 3411 -webkit-box-direction: normal;
3412 -ms-flex-direction: column; 3412 -ms-flex-direction: column;
3413 flex-direction: column; 3413 flex-direction: column;
3414 gap: 20px; 3414 gap: 20px;
3415 } 3415 }
3416 @media (min-width: 768px) { 3416 @media (min-width: 768px) {
3417 .main__employer-page { 3417 .main__employer-page {
3418 gap: 30px; 3418 gap: 30px;
3419 } 3419 }
3420 } 3420 }
3421 .main__employer-page-title { 3421 .main__employer-page-title {
3422 color: #000; 3422 color: #000;
3423 margin: 0; 3423 margin: 0;
3424 font-size: 30px; 3424 font-size: 30px;
3425 } 3425 }
3426 @media (min-width: 768px) { 3426 @media (min-width: 768px) {
3427 .main__employer-page-title { 3427 .main__employer-page-title {
3428 font-size: 36px; 3428 font-size: 36px;
3429 } 3429 }
3430 } 3430 }
3431 @media (min-width: 992px) { 3431 @media (min-width: 992px) {
3432 .main__employer-page-title { 3432 .main__employer-page-title {
3433 font-size: 44px; 3433 font-size: 44px;
3434 } 3434 }
3435 } 3435 }
3436 .main__employer-page-item { 3436 .main__employer-page-item {
3437 display: -webkit-box; 3437 display: -webkit-box;
3438 display: -ms-flexbox; 3438 display: -ms-flexbox;
3439 display: flex; 3439 display: flex;
3440 -webkit-box-orient: vertical; 3440 -webkit-box-orient: vertical;
3441 -webkit-box-direction: normal; 3441 -webkit-box-direction: normal;
3442 -ms-flex-direction: column; 3442 -ms-flex-direction: column;
3443 flex-direction: column; 3443 flex-direction: column;
3444 gap: 4px; 3444 gap: 4px;
3445 font-size: 12px; 3445 font-size: 12px;
3446 line-height: 1.4; 3446 line-height: 1.4;
3447 } 3447 }
3448 @media (min-width: 768px) { 3448 @media (min-width: 768px) {
3449 .main__employer-page-item { 3449 .main__employer-page-item {
3450 font-size: 18px; 3450 font-size: 18px;
3451 gap: 8px; 3451 gap: 8px;
3452 } 3452 }
3453 } 3453 }
3454 .main__employer-page-item b { 3454 .main__employer-page-item b {
3455 color: #377d87; 3455 color: #377d87;
3456 font-size: 14px; 3456 font-size: 14px;
3457 } 3457 }
3458 @media (min-width: 768px) { 3458 @media (min-width: 768px) {
3459 .main__employer-page-item b { 3459 .main__employer-page-item b {
3460 font-size: 18px; 3460 font-size: 18px;
3461 } 3461 }
3462 } 3462 }
3463 .main__employer-page-item span { 3463 .main__employer-page-item span {
3464 color: #000; 3464 color: #000;
3465 } 3465 }
3466 .main__employer-page-info { 3466 .main__employer-page-info {
3467 display: -webkit-box; 3467 display: -webkit-box;
3468 display: -ms-flexbox; 3468 display: -ms-flexbox;
3469 display: flex; 3469 display: flex;
3470 -webkit-box-orient: vertical; 3470 -webkit-box-orient: vertical;
3471 -webkit-box-direction: normal; 3471 -webkit-box-direction: normal;
3472 -ms-flex-direction: column; 3472 -ms-flex-direction: column;
3473 flex-direction: column; 3473 flex-direction: column;
3474 gap: 20px; 3474 gap: 20px;
3475 } 3475 }
3476 .main__employer-page-info.row2{ 3476 .main__employer-page-info.row2{
3477 justify-content: flex-start; 3477 justify-content: flex-start;
3478 } 3478 }
3479 .main__employer-page-info.row2 .main__employer-page-item{ 3479 .main__employer-page-info.row2 .main__employer-page-item{
3480 width: 25%; 3480 width: 25%;
3481 } 3481 }
3482 @media (min-width: 768px) { 3482 @media (min-width: 768px) {
3483 .main__employer-page-info { 3483 .main__employer-page-info {
3484 display: grid; 3484 display: grid;
3485 grid-template-columns: repeat(2, 1fr); 3485 grid-template-columns: repeat(2, 1fr);
3486 gap: 30px 40px; 3486 gap: 30px 40px;
3487 } 3487 }
3488 } 3488 }
3489 @media (min-width: 1280px) { 3489 @media (min-width: 1280px) {
3490 .main__employer-page-info { 3490 .main__employer-page-info {
3491 display: -webkit-box; 3491 display: -webkit-box;
3492 display: -ms-flexbox; 3492 display: -ms-flexbox;
3493 display: flex; 3493 display: flex;
3494 -webkit-box-orient: horizontal; 3494 -webkit-box-orient: horizontal;
3495 -webkit-box-direction: normal; 3495 -webkit-box-direction: normal;
3496 -ms-flex-direction: row; 3496 -ms-flex-direction: row;
3497 flex-direction: row; 3497 flex-direction: row;
3498 -webkit-box-align: start; 3498 -webkit-box-align: start;
3499 -ms-flex-align: start; 3499 -ms-flex-align: start;
3500 align-items: flex-start; 3500 align-items: flex-start;
3501 -webkit-box-pack: justify; 3501 -webkit-box-pack: justify;
3502 -ms-flex-pack: justify; 3502 -ms-flex-pack: justify;
3503 justify-content: space-between; 3503 justify-content: space-between;
3504 padding-right: 160px; 3504 padding-right: 160px;
3505 } 3505 }
3506 } 3506 }
3507 @media (min-width: 768px) { 3507 @media (min-width: 768px) {
3508 .main__employer-page-info .main__employer-page-item b, 3508 .main__employer-page-info .main__employer-page-item b,
3509 .main__employer-page-info .main__employer-page-item span { 3509 .main__employer-page-info .main__employer-page-item span {
3510 max-width: 300px; 3510 max-width: 300px;
3511 } 3511 }
3512 } 3512 }
3513 .main__employer-page-tabs { 3513 .main__employer-page-tabs {
3514 display: -webkit-box; 3514 display: -webkit-box;
3515 display: -ms-flexbox; 3515 display: -ms-flexbox;
3516 display: flex; 3516 display: flex;
3517 -webkit-box-align: center; 3517 -webkit-box-align: center;
3518 -ms-flex-align: center; 3518 -ms-flex-align: center;
3519 align-items: center; 3519 align-items: center;
3520 gap: 20px; 3520 gap: 20px;
3521 } 3521 }
3522 @media (min-width: 768px) { 3522 @media (min-width: 768px) {
3523 .main__employer-page-tabs { 3523 .main__employer-page-tabs {
3524 margin-top: 20px; 3524 margin-top: 20px;
3525 } 3525 }
3526 } 3526 }
3527 .main__employer-page-tabs-item { 3527 .main__employer-page-tabs-item {
3528 font-size: 22px; 3528 font-size: 22px;
3529 font-weight: 700; 3529 font-weight: 700;
3530 border: none; 3530 border: none;
3531 background: none; 3531 background: none;
3532 padding: 0; 3532 padding: 0;
3533 color: #9c9d9d; 3533 color: #9c9d9d;
3534 text-decoration: underline; 3534 text-decoration: underline;
3535 text-decoration-thickness: 1px; 3535 text-decoration-thickness: 1px;
3536 } 3536 }
3537 @media (min-width: 768px) { 3537 @media (min-width: 768px) {
3538 .main__employer-page-tabs-item { 3538 .main__employer-page-tabs-item {
3539 font-size: 24px; 3539 font-size: 24px;
3540 } 3540 }
3541 } 3541 }
3542 .main__employer-page-tabs-item.active { 3542 .main__employer-page-tabs-item.active {
3543 color: #377d87; 3543 color: #377d87;
3544 } 3544 }
3545 .main__employer-page-body { 3545 .main__employer-page-body {
3546 display: -webkit-box; 3546 display: -webkit-box;
3547 display: -ms-flexbox; 3547 display: -ms-flexbox;
3548 display: flex; 3548 display: flex;
3549 -webkit-box-orient: vertical; 3549 -webkit-box-orient: vertical;
3550 -webkit-box-direction: normal; 3550 -webkit-box-direction: normal;
3551 -ms-flex-direction: column; 3551 -ms-flex-direction: column;
3552 flex-direction: column; 3552 flex-direction: column;
3553 margin-top: 10px; 3553 margin-top: 10px;
3554 } 3554 }
3555 @media (min-width: 768px) { 3555 @media (min-width: 768px) {
3556 .main__employer-page-body { 3556 .main__employer-page-body {
3557 margin-top: 30px; 3557 margin-top: 30px;
3558 } 3558 }
3559 } 3559 }
3560 .main__employer-page-body-item { 3560 .main__employer-page-body-item {
3561 display: none; 3561 display: none;
3562 -webkit-box-orient: vertical; 3562 -webkit-box-orient: vertical;
3563 -webkit-box-direction: normal; 3563 -webkit-box-direction: normal;
3564 -ms-flex-direction: column; 3564 -ms-flex-direction: column;
3565 flex-direction: column; 3565 flex-direction: column;
3566 gap: 20px; 3566 gap: 20px;
3567 } 3567 }
3568 .main__employer-page-body-item.showed { 3568 .main__employer-page-body-item.showed {
3569 display: -webkit-box; 3569 display: -webkit-box;
3570 display: -ms-flexbox; 3570 display: -ms-flexbox;
3571 display: flex; 3571 display: flex;
3572 } 3572 }
3573 .main__employer-page-one { 3573 .main__employer-page-one {
3574 display: -webkit-box; 3574 display: -webkit-box;
3575 display: -ms-flexbox; 3575 display: -ms-flexbox;
3576 display: flex; 3576 display: flex;
3577 -webkit-box-orient: vertical; 3577 -webkit-box-orient: vertical;
3578 -webkit-box-direction: normal; 3578 -webkit-box-direction: normal;
3579 -ms-flex-direction: column; 3579 -ms-flex-direction: column;
3580 flex-direction: column; 3580 flex-direction: column;
3581 gap: 20px; 3581 gap: 20px;
3582 } 3582 }
3583 @media (min-width: 768px) { 3583 @media (min-width: 768px) {
3584 .main__employer-page-one { 3584 .main__employer-page-one {
3585 display: grid; 3585 display: grid;
3586 grid-template-columns: repeat(2, 1fr); 3586 grid-template-columns: repeat(2, 1fr);
3587 } 3587 }
3588 } 3588 }
3589 @media (min-width: 992px) { 3589 @media (min-width: 992px) {
3590 .main__employer-page-one { 3590 .main__employer-page-one {
3591 grid-template-columns: repeat(3, 1fr); 3591 grid-template-columns: repeat(3, 1fr);
3592 } 3592 }
3593 } 3593 }
3594 @media (min-width: 1280px) { 3594 @media (min-width: 1280px) {
3595 .main__employer-page-one { 3595 .main__employer-page-one {
3596 grid-template-columns: repeat(4, 1fr); 3596 grid-template-columns: repeat(4, 1fr);
3597 gap: 30px 20px; 3597 gap: 30px 20px;
3598 } 3598 }
3599 } 3599 }
3600 .main__employer-page-one-item { 3600 .main__employer-page-one-item {
3601 display: -webkit-box; 3601 display: -webkit-box;
3602 display: -ms-flexbox; 3602 display: -ms-flexbox;
3603 display: flex; 3603 display: flex;
3604 -webkit-box-orient: vertical; 3604 -webkit-box-orient: vertical;
3605 -webkit-box-direction: normal; 3605 -webkit-box-direction: normal;
3606 -ms-flex-direction: column; 3606 -ms-flex-direction: column;
3607 flex-direction: column; 3607 flex-direction: column;
3608 gap: 10px; 3608 gap: 10px;
3609 font-size: 12px; 3609 font-size: 12px;
3610 position: relative; 3610 position: relative;
3611 } 3611 }
3612 @media (min-width: 1280px) { 3612 @media (min-width: 1280px) {
3613 .main__employer-page-one-item { 3613 .main__employer-page-one-item {
3614 font-size: 18px; 3614 font-size: 18px;
3615 } 3615 }
3616 } 3616 }
3617 .main__employer-page-one-item img { 3617 .main__employer-page-one-item img {
3618 border-radius: 10px; 3618 border-radius: 10px;
3619 -o-object-fit: cover; 3619 -o-object-fit: cover;
3620 object-fit: cover; 3620 object-fit: cover;
3621 width: 100%; 3621 width: 100%;
3622 max-height: 250px; 3622 max-height: 250px;
3623 aspect-ratio: 247/174; 3623 aspect-ratio: 247/174;
3624 } 3624 }
3625 @media (min-width: 1280px) { 3625 @media (min-width: 1280px) {
3626 .main__employer-page-one-item img { 3626 .main__employer-page-one-item img {
3627 margin-bottom: 10px; 3627 margin-bottom: 10px;
3628 } 3628 }
3629 } 3629 }
3630 .main__employer-page-one-item b { 3630 .main__employer-page-one-item b {
3631 font-weight: 700; 3631 font-weight: 700;
3632 color: #377d87; 3632 color: #377d87;
3633 } 3633 }
3634 .main__employer-page-one-item span { 3634 .main__employer-page-one-item span {
3635 color: #000; 3635 color: #000;
3636 } 3636 }
3637 .main__employer-page-one-item i { 3637 .main__employer-page-one-item i {
3638 font-style: normal; 3638 font-style: normal;
3639 color: #377d87; 3639 color: #377d87;
3640 } 3640 }
3641 .main__employer-page-one-item .del { 3641 .main__employer-page-one-item .del {
3642 position: absolute; 3642 position: absolute;
3643 z-index: 1; 3643 z-index: 1;
3644 top: 8px; 3644 top: 8px;
3645 left: 8px; 3645 left: 8px;
3646 } 3646 }
3647 .main__employer-page-two { 3647 .main__employer-page-two {
3648 display: -webkit-box; 3648 display: -webkit-box;
3649 display: -ms-flexbox; 3649 display: -ms-flexbox;
3650 display: flex; 3650 display: flex;
3651 -webkit-box-orient: vertical; 3651 -webkit-box-orient: vertical;
3652 -webkit-box-direction: normal; 3652 -webkit-box-direction: normal;
3653 -ms-flex-direction: column; 3653 -ms-flex-direction: column;
3654 flex-direction: column; 3654 flex-direction: column;
3655 -webkit-box-align: center; 3655 -webkit-box-align: center;
3656 -ms-flex-align: center; 3656 -ms-flex-align: center;
3657 align-items: center; 3657 align-items: center;
3658 gap: 20px; 3658 gap: 20px;
3659 } 3659 }
3660 .main__employer-page-two-item { 3660 .main__employer-page-two-item {
3661 width: 100%; 3661 width: 100%;
3662 display: -webkit-box; 3662 display: -webkit-box;
3663 display: -ms-flexbox; 3663 display: -ms-flexbox;
3664 display: flex; 3664 display: flex;
3665 -webkit-box-orient: vertical; 3665 -webkit-box-orient: vertical;
3666 -webkit-box-direction: normal; 3666 -webkit-box-direction: normal;
3667 -ms-flex-direction: column; 3667 -ms-flex-direction: column;
3668 flex-direction: column; 3668 flex-direction: column;
3669 gap: 16px; 3669 gap: 16px;
3670 padding: 20px 10px; 3670 padding: 20px 10px;
3671 border-radius: 12px; 3671 border-radius: 12px;
3672 border: 1px solid #cecece; 3672 border: 1px solid #cecece;
3673 position: relative; 3673 position: relative;
3674 overflow: hidden; 3674 overflow: hidden;
3675 font-size: 12px; 3675 font-size: 12px;
3676 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 3676 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
3677 } 3677 }
3678 @media (min-width: 768px) { 3678 @media (min-width: 768px) {
3679 .main__employer-page-two-item { 3679 .main__employer-page-two-item {
3680 font-size: 14px; 3680 font-size: 14px;
3681 padding: 20px; 3681 padding: 20px;
3682 gap: 24px; 3682 gap: 24px;
3683 padding-bottom: 35px; 3683 padding-bottom: 35px;
3684 } 3684 }
3685 } 3685 }
3686 @media (min-width: 992px) { 3686 @media (min-width: 992px) {
3687 .main__employer-page-two-item { 3687 .main__employer-page-two-item {
3688 font-size: 16px; 3688 font-size: 16px;
3689 } 3689 }
3690 } 3690 }
3691 @media (min-width: 1280px) { 3691 @media (min-width: 1280px) {
3692 .main__employer-page-two-item { 3692 .main__employer-page-two-item {
3693 font-size: 18px; 3693 font-size: 18px;
3694 } 3694 }
3695 } 3695 }
3696 .main__employer-page-two-item-toper { 3696 .main__employer-page-two-item-toper {
3697 display: -webkit-box; 3697 display: -webkit-box;
3698 display: -ms-flexbox; 3698 display: -ms-flexbox;
3699 display: flex; 3699 display: flex;
3700 -webkit-box-align: center; 3700 -webkit-box-align: center;
3701 -ms-flex-align: center; 3701 -ms-flex-align: center;
3702 align-items: center; 3702 align-items: center;
3703 font-size: 22px; 3703 font-size: 22px;
3704 font-weight: 700; 3704 font-weight: 700;
3705 color: #000; 3705 color: #000;
3706 } 3706 }
3707 @media (min-width: 768px) { 3707 @media (min-width: 768px) {
3708 .main__employer-page-two-item-toper { 3708 .main__employer-page-two-item-toper {
3709 font-size: 30px; 3709 font-size: 30px;
3710 } 3710 }
3711 } 3711 }
3712 .main__employer-page-two-item-toper img { 3712 .main__employer-page-two-item-toper img {
3713 width: 60px; 3713 width: 60px;
3714 aspect-ratio: 1/1; 3714 aspect-ratio: 1/1;
3715 -o-object-fit: contain; 3715 -o-object-fit: contain;
3716 object-fit: contain; 3716 object-fit: contain;
3717 } 3717 }
3718 .main__employer-page-two-item-toper span { 3718 .main__employer-page-two-item-toper span {
3719 width: calc(100% - 60px); 3719 width: calc(100% - 60px);
3720 padding-left: 10px; 3720 padding-left: 10px;
3721 } 3721 }
3722 @media (min-width: 768px) { 3722 @media (min-width: 768px) {
3723 .main__employer-page-two-item-toper span { 3723 .main__employer-page-two-item-toper span {
3724 padding-left: 20px; 3724 padding-left: 20px;
3725 } 3725 }
3726 } 3726 }
3727 .main__employer-page-two-item-title { 3727 .main__employer-page-two-item-title {
3728 font-size: 18px; 3728 font-size: 18px;
3729 font-weight: 700; 3729 font-weight: 700;
3730 color: #377d87; 3730 color: #377d87;
3731 } 3731 }
3732 @media (min-width: 768px) { 3732 @media (min-width: 768px) {
3733 .main__employer-page-two-item-title { 3733 .main__employer-page-two-item-title {
3734 font-size: 24px; 3734 font-size: 24px;
3735 } 3735 }
3736 } 3736 }
3737 .main__employer-page-two-item-text { 3737 .main__employer-page-two-item-text {
3738 display: -webkit-box; 3738 display: -webkit-box;
3739 display: -ms-flexbox; 3739 display: -ms-flexbox;
3740 display: flex; 3740 display: flex;
3741 -webkit-box-orient: vertical; 3741 -webkit-box-orient: vertical;
3742 -webkit-box-direction: normal; 3742 -webkit-box-direction: normal;
3743 -ms-flex-direction: column; 3743 -ms-flex-direction: column;
3744 flex-direction: column; 3744 flex-direction: column;
3745 gap: 10px; 3745 gap: 10px;
3746 } 3746 }
3747 .main__employer-page-two-item-text-name { 3747 .main__employer-page-two-item-text-name {
3748 font-weight: 700; 3748 font-weight: 700;
3749 } 3749 }
3750 .main__employer-page-two-item-text-body { 3750 .main__employer-page-two-item-text-body {
3751 color: #000; 3751 color: #000;
3752 display: -webkit-box; 3752 display: -webkit-box;
3753 display: -ms-flexbox; 3753 display: -ms-flexbox;
3754 display: flex; 3754 display: flex;
3755 -webkit-box-orient: vertical; 3755 -webkit-box-orient: vertical;
3756 -webkit-box-direction: normal; 3756 -webkit-box-direction: normal;
3757 -ms-flex-direction: column; 3757 -ms-flex-direction: column;
3758 flex-direction: column; 3758 flex-direction: column;
3759 gap: 6px; 3759 gap: 6px;
3760 padding: 0 10px; 3760 padding: 0 10px;
3761 } 3761 }
3762 .main__employer-page-two-item-text-body p { 3762 .main__employer-page-two-item-text-body p {
3763 margin: 0; 3763 margin: 0;
3764 } 3764 }
3765 .main__employer-page-two-item-text-body ul { 3765 .main__employer-page-two-item-text-body ul {
3766 margin: 0; 3766 margin: 0;
3767 padding: 0; 3767 padding: 0;
3768 padding-left: 16px; 3768 padding-left: 16px;
3769 display: -webkit-box; 3769 display: -webkit-box;
3770 display: -ms-flexbox; 3770 display: -ms-flexbox;
3771 display: flex; 3771 display: flex;
3772 -webkit-box-orient: vertical; 3772 -webkit-box-orient: vertical;
3773 -webkit-box-direction: normal; 3773 -webkit-box-direction: normal;
3774 -ms-flex-direction: column; 3774 -ms-flex-direction: column;
3775 flex-direction: column; 3775 flex-direction: column;
3776 gap: 6px; 3776 gap: 6px;
3777 } 3777 }
3778 @media (min-width: 768px) { 3778 @media (min-width: 768px) {
3779 .main__employer-page-two-item-text-body ul { 3779 .main__employer-page-two-item-text-body ul {
3780 margin: 0 5px; 3780 margin: 0 5px;
3781 } 3781 }
3782 } 3782 }
3783 .main__employer-page-two-item-text-body ul span, 3783 .main__employer-page-two-item-text-body ul span,
3784 .main__employer-page-two-item-text-body ul a { 3784 .main__employer-page-two-item-text-body ul a {
3785 color: #000; 3785 color: #000;
3786 position: relative; 3786 position: relative;
3787 } 3787 }
3788 .main__employer-page-two-item-text-body ul a:hover { 3788 .main__employer-page-two-item-text-body ul a:hover {
3789 color: #377d87; 3789 color: #377d87;
3790 } 3790 }
3791 .main__employer-page-two-item-text-body p + ul { 3791 .main__employer-page-two-item-text-body p + ul {
3792 margin-top: 10px; 3792 margin-top: 10px;
3793 } 3793 }
3794 .main__employer-page-two-item-text-links { 3794 .main__employer-page-two-item-text-links {
3795 display: -webkit-box; 3795 display: -webkit-box;
3796 display: -ms-flexbox; 3796 display: -ms-flexbox;
3797 display: flex; 3797 display: flex;
3798 -webkit-box-orient: vertical; 3798 -webkit-box-orient: vertical;
3799 -webkit-box-direction: normal; 3799 -webkit-box-direction: normal;
3800 -ms-flex-direction: column; 3800 -ms-flex-direction: column;
3801 flex-direction: column; 3801 flex-direction: column;
3802 -webkit-box-align: start; 3802 -webkit-box-align: start;
3803 -ms-flex-align: start; 3803 -ms-flex-align: start;
3804 align-items: flex-start; 3804 align-items: flex-start;
3805 gap: 10px; 3805 gap: 10px;
3806 padding: 0 10px; 3806 padding: 0 10px;
3807 font-weight: 700; 3807 font-weight: 700;
3808 margin-top: 5px; 3808 margin-top: 5px;
3809 } 3809 }
3810 @media (min-width: 768px) { 3810 @media (min-width: 768px) {
3811 .main__employer-page-two-item-text-links { 3811 .main__employer-page-two-item-text-links {
3812 gap: 20px; 3812 gap: 20px;
3813 } 3813 }
3814 } 3814 }
3815 .main__employer-page-two-item-text-links a { 3815 .main__employer-page-two-item-text-links a {
3816 color: #4d88d9; 3816 color: #4d88d9;
3817 } 3817 }
3818 .main__employer-page-two-item-text-links a:hover { 3818 .main__employer-page-two-item-text-links a:hover {
3819 color: #377d87; 3819 color: #377d87;
3820 } 3820 }
3821 .main__employer-page-two-item-tags { 3821 .main__employer-page-two-item-tags {
3822 color: #4d88d9; 3822 color: #4d88d9;
3823 font-weight: 500; 3823 font-weight: 500;
3824 display: -webkit-box; 3824 display: -webkit-box;
3825 display: -ms-flexbox; 3825 display: -ms-flexbox;
3826 display: flex; 3826 display: flex;
3827 -webkit-box-align: center; 3827 -webkit-box-align: center;
3828 -ms-flex-align: center; 3828 -ms-flex-align: center;
3829 align-items: center; 3829 align-items: center;
3830 -ms-flex-wrap: wrap; 3830 -ms-flex-wrap: wrap;
3831 flex-wrap: wrap; 3831 flex-wrap: wrap;
3832 gap: 10px 20px; 3832 gap: 10px 20px;
3833 } 3833 }
3834 @media (min-width: 768px) { 3834 @media (min-width: 768px) {
3835 .main__employer-page-two-item-tags { 3835 .main__employer-page-two-item-tags {
3836 font-size: 14px; 3836 font-size: 14px;
3837 } 3837 }
3838 } 3838 }
3839 .main__employer-page-two-item-buttons { 3839 .main__employer-page-two-item-buttons {
3840 display: grid; 3840 display: grid;
3841 grid-template-columns: repeat(2, 1fr); 3841 grid-template-columns: repeat(2, 1fr);
3842 gap: 20px; 3842 gap: 20px;
3843 } 3843 }
3844 @media (min-width: 768px) { 3844 @media (min-width: 768px) {
3845 .main__employer-page-two-item-button { 3845 .main__employer-page-two-item-button {
3846 position: absolute; 3846 position: absolute;
3847 bottom: 20px; 3847 bottom: 20px;
3848 left: 20px; 3848 left: 20px;
3849 width: 200px; 3849 width: 200px;
3850 padding: 0; 3850 padding: 0;
3851 } 3851 }
3852 } 3852 }
3853 @media (min-width: 768px) { 3853 @media (min-width: 768px) {
3854 .main__employer-page-two-item-button + .main__employer-page-two-item-button { 3854 .main__employer-page-two-item-button + .main__employer-page-two-item-button {
3855 left: auto; 3855 left: auto;
3856 right: 20px; 3856 right: 20px;
3857 } 3857 }
3858 } 3858 }
3859 .main__employer-page-two-item-bottom { 3859 .main__employer-page-two-item-bottom {
3860 display: -webkit-box; 3860 display: -webkit-box;
3861 display: -ms-flexbox; 3861 display: -ms-flexbox;
3862 display: flex; 3862 display: flex;
3863 -webkit-box-align: center; 3863 -webkit-box-align: center;
3864 -ms-flex-align: center; 3864 -ms-flex-align: center;
3865 align-items: center; 3865 align-items: center;
3866 -webkit-box-pack: justify; 3866 -webkit-box-pack: justify;
3867 -ms-flex-pack: justify; 3867 -ms-flex-pack: justify;
3868 justify-content: space-between; 3868 justify-content: space-between;
3869 } 3869 }
3870 .main__employer-page-two-item-bottom-date { 3870 .main__employer-page-two-item-bottom-date {
3871 color: #000; 3871 color: #000;
3872 } 3872 }
3873 @media (min-width: 768px) { 3873 @media (min-width: 768px) {
3874 .main__employer-page-two-item-bottom-date { 3874 .main__employer-page-two-item-bottom-date {
3875 position: absolute; 3875 position: absolute;
3876 bottom: 20px; 3876 bottom: 20px;
3877 right: 240px; 3877 right: 240px;
3878 height: 42px; 3878 height: 42px;
3879 display: -webkit-box; 3879 display: -webkit-box;
3880 display: -ms-flexbox; 3880 display: -ms-flexbox;
3881 display: flex; 3881 display: flex;
3882 -webkit-box-align: center; 3882 -webkit-box-align: center;
3883 -ms-flex-align: center; 3883 -ms-flex-align: center;
3884 align-items: center; 3884 align-items: center;
3885 } 3885 }
3886 } 3886 }
3887 @media (min-width: 992px) { 3887 @media (min-width: 992px) {
3888 .main__employer-page-two-item-bottom-date { 3888 .main__employer-page-two-item-bottom-date {
3889 font-size: 16px; 3889 font-size: 16px;
3890 } 3890 }
3891 } 3891 }
3892 @media (min-width: 768px) { 3892 @media (min-width: 768px) {
3893 .main__employer-page-two-item-bottom-like { 3893 .main__employer-page-two-item-bottom-like {
3894 position: absolute; 3894 position: absolute;
3895 bottom: 20px; 3895 bottom: 20px;
3896 left: 240px; 3896 left: 240px;
3897 } 3897 }
3898 } 3898 }
3899 @media (min-width: 768px) { 3899 @media (min-width: 768px) {
3900 .main__employer-page-two-more { 3900 .main__employer-page-two-more {
3901 margin-top: 10px; 3901 margin-top: 10px;
3902 padding: 0; 3902 padding: 0;
3903 width: 200px; 3903 width: 200px;
3904 } 3904 }
3905 } 3905 }
3906 .main__employer-page-two .main__employer-page-two-item { 3906 .main__employer-page-two .main__employer-page-two-item {
3907 /*display: none;*/ 3907 /*display: none;*/
3908 } 3908 }
3909 .main__employer-page-two .main__employer-page-two-item:nth-of-type(1), .main__employer-page-two .main__employer-page-two-item:nth-of-type(2) { 3909 .main__employer-page-two .main__employer-page-two-item:nth-of-type(1), .main__employer-page-two .main__employer-page-two-item:nth-of-type(2) {
3910 display: -webkit-box; 3910 display: -webkit-box;
3911 display: -ms-flexbox; 3911 display: -ms-flexbox;
3912 display: flex; 3912 display: flex;
3913 } 3913 }
3914 .main__employer-page-two.active .main__employer-page-two-item { 3914 .main__employer-page-two.active .main__employer-page-two-item {
3915 display: -webkit-box; 3915 display: -webkit-box;
3916 display: -ms-flexbox; 3916 display: -ms-flexbox;
3917 display: flex; 3917 display: flex;
3918 } 3918 }
3919 .main__resume-base { 3919 .main__resume-base {
3920 display: -webkit-box; 3920 display: -webkit-box;
3921 display: -ms-flexbox; 3921 display: -ms-flexbox;
3922 display: flex; 3922 display: flex;
3923 -webkit-box-orient: vertical; 3923 -webkit-box-orient: vertical;
3924 -webkit-box-direction: normal; 3924 -webkit-box-direction: normal;
3925 -ms-flex-direction: column; 3925 -ms-flex-direction: column;
3926 flex-direction: column; 3926 flex-direction: column;
3927 color: #000; 3927 color: #000;
3928 } 3928 }
3929 .main__resume-base-body { 3929 .main__resume-base-body {
3930 display: none; 3930 display: none;
3931 -webkit-box-orient: vertical; 3931 -webkit-box-orient: vertical;
3932 -webkit-box-direction: normal; 3932 -webkit-box-direction: normal;
3933 -ms-flex-direction: column; 3933 -ms-flex-direction: column;
3934 flex-direction: column; 3934 flex-direction: column;
3935 margin-top: 10px; 3935 margin-top: 10px;
3936 } 3936 }
3937 @media (min-width: 768px) { 3937 @media (min-width: 768px) {
3938 .main__resume-base-body { 3938 .main__resume-base-body {
3939 margin-top: 30px; 3939 margin-top: 30px;
3940 } 3940 }
3941 } 3941 }
3942 .main__resume-base-body.showed { 3942 .main__resume-base-body.showed {
3943 display: -webkit-box; 3943 display: -webkit-box;
3944 display: -ms-flexbox; 3944 display: -ms-flexbox;
3945 display: flex; 3945 display: flex;
3946 } 3946 }
3947 .main__resume-base-body-one { 3947 .main__resume-base-body-one {
3948 display: -webkit-box; 3948 display: -webkit-box;
3949 display: -ms-flexbox; 3949 display: -ms-flexbox;
3950 display: flex; 3950 display: flex;
3951 -webkit-box-orient: vertical; 3951 -webkit-box-orient: vertical;
3952 -webkit-box-direction: normal; 3952 -webkit-box-direction: normal;
3953 -ms-flex-direction: column; 3953 -ms-flex-direction: column;
3954 flex-direction: column; 3954 flex-direction: column;
3955 -webkit-box-align: center; 3955 -webkit-box-align: center;
3956 -ms-flex-align: center; 3956 -ms-flex-align: center;
3957 align-items: center; 3957 align-items: center;
3958 gap: 20px; 3958 gap: 20px;
3959 } 3959 }
3960 @media (min-width: 768px) { 3960 @media (min-width: 768px) {
3961 .main__resume-base-body-one { 3961 .main__resume-base-body-one {
3962 gap: 30px; 3962 gap: 30px;
3963 } 3963 }
3964 } 3964 }
3965 .main__resume-base-body-two { 3965 .main__resume-base-body-two {
3966 display: -webkit-box; 3966 display: -webkit-box;
3967 display: -ms-flexbox; 3967 display: -ms-flexbox;
3968 display: flex; 3968 display: flex;
3969 -webkit-box-orient: vertical; 3969 -webkit-box-orient: vertical;
3970 -webkit-box-direction: normal; 3970 -webkit-box-direction: normal;
3971 -ms-flex-direction: column; 3971 -ms-flex-direction: column;
3972 flex-direction: column; 3972 flex-direction: column;
3973 gap: 20px; 3973 gap: 20px;
3974 } 3974 }
3975 @media (min-width: 768px) { 3975 @media (min-width: 768px) {
3976 .main__resume-base-body-two { 3976 .main__resume-base-body-two {
3977 -webkit-box-orient: horizontal; 3977 -webkit-box-orient: horizontal;
3978 -webkit-box-direction: normal; 3978 -webkit-box-direction: normal;
3979 -ms-flex-direction: row; 3979 -ms-flex-direction: row;
3980 flex-direction: row; 3980 flex-direction: row;
3981 -webkit-box-pack: justify; 3981 -webkit-box-pack: justify;
3982 -ms-flex-pack: justify; 3982 -ms-flex-pack: justify;
3983 justify-content: space-between; 3983 justify-content: space-between;
3984 -webkit-box-align: start; 3984 -webkit-box-align: start;
3985 -ms-flex-align: start; 3985 -ms-flex-align: start;
3986 align-items: flex-start; 3986 align-items: flex-start;
3987 -ms-flex-wrap: wrap; 3987 -ms-flex-wrap: wrap;
3988 flex-wrap: wrap; 3988 flex-wrap: wrap;
3989 gap: 30px 0; 3989 gap: 30px 0;
3990 } 3990 }
3991 } 3991 }
3992 @media (min-width: 768px) { 3992 @media (min-width: 768px) {
3993 .main__resume-base-body-two .main__resume-base-body-item { 3993 .main__resume-base-body-two .main__resume-base-body-item {
3994 width: calc(50% - 10px); 3994 width: calc(50% - 10px);
3995 } 3995 }
3996 } 3996 }
3997 .main__resume-base-body-two .main__resume-base-body-item-wrapper { 3997 .main__resume-base-body-two .main__resume-base-body-item-wrapper {
3998 -webkit-box-orient: vertical; 3998 -webkit-box-orient: vertical;
3999 -webkit-box-direction: normal; 3999 -webkit-box-direction: normal;
4000 -ms-flex-direction: column; 4000 -ms-flex-direction: column;
4001 flex-direction: column; 4001 flex-direction: column;
4002 } 4002 }
4003 .main__resume-base-body-item { 4003 .main__resume-base-body-item {
4004 width: 100%; 4004 width: 100%;
4005 display: -webkit-box; 4005 display: -webkit-box;
4006 display: -ms-flexbox; 4006 display: -ms-flexbox;
4007 display: flex; 4007 display: flex;
4008 -webkit-box-orient: vertical; 4008 -webkit-box-orient: vertical;
4009 -webkit-box-direction: normal; 4009 -webkit-box-direction: normal;
4010 -ms-flex-direction: column; 4010 -ms-flex-direction: column;
4011 flex-direction: column; 4011 flex-direction: column;
4012 gap: 20px; 4012 gap: 20px;
4013 position: relative; 4013 position: relative;
4014 border: 1px solid #377d87; 4014 border: 1px solid #377d87;
4015 border-radius: 8px; 4015 border-radius: 8px;
4016 padding: 10px; 4016 padding: 10px;
4017 -webkit-box-align: center; 4017 -webkit-box-align: center;
4018 -ms-flex-align: center; 4018 -ms-flex-align: center;
4019 align-items: center; 4019 align-items: center;
4020 } 4020 }
4021 @media (min-width: 768px) { 4021 @media (min-width: 768px) {
4022 .main__resume-base-body-item { 4022 .main__resume-base-body-item {
4023 padding: 20px; 4023 padding: 20px;
4024 } 4024 }
4025 } 4025 }
4026 .main__resume-base-body-item-buttons { 4026 .main__resume-base-body-item-buttons {
4027 display: -webkit-box; 4027 display: -webkit-box;
4028 display: -ms-flexbox; 4028 display: -ms-flexbox;
4029 display: flex; 4029 display: flex;
4030 -webkit-box-orient: vertical; 4030 -webkit-box-orient: vertical;
4031 -webkit-box-direction: normal; 4031 -webkit-box-direction: normal;
4032 -ms-flex-direction: column; 4032 -ms-flex-direction: column;
4033 flex-direction: column; 4033 flex-direction: column;
4034 -webkit-box-align: start; 4034 -webkit-box-align: start;
4035 -ms-flex-align: start; 4035 -ms-flex-align: start;
4036 align-items: flex-start; 4036 align-items: flex-start;
4037 gap: 10px; 4037 gap: 10px;
4038 position: absolute; 4038 position: absolute;
4039 top: 10px; 4039 top: 10px;
4040 right: 10px; 4040 right: 10px;
4041 } 4041 }
4042 @media (min-width: 768px) { 4042 @media (min-width: 768px) {
4043 .main__resume-base-body-item-buttons { 4043 .main__resume-base-body-item-buttons {
4044 top: 20px; 4044 top: 20px;
4045 right: 20px; 4045 right: 20px;
4046 } 4046 }
4047 } 4047 }
4048 .main__resume-base-body-item-wrapper { 4048 .main__resume-base-body-item-wrapper {
4049 display: -webkit-box; 4049 display: -webkit-box;
4050 display: -ms-flexbox; 4050 display: -ms-flexbox;
4051 display: flex; 4051 display: flex;
4052 -webkit-box-orient: vertical; 4052 -webkit-box-orient: vertical;
4053 -webkit-box-direction: normal; 4053 -webkit-box-direction: normal;
4054 -ms-flex-direction: column; 4054 -ms-flex-direction: column;
4055 flex-direction: column; 4055 flex-direction: column;
4056 -webkit-box-align: start; 4056 -webkit-box-align: start;
4057 -ms-flex-align: start; 4057 -ms-flex-align: start;
4058 align-items: flex-start; 4058 align-items: flex-start;
4059 gap: 20px; 4059 gap: 20px;
4060 width: 100%; 4060 width: 100%;
4061 } 4061 }
4062 @media (min-width: 768px) { 4062 @media (min-width: 768px) {
4063 .main__resume-base-body-item-wrapper { 4063 .main__resume-base-body-item-wrapper {
4064 -webkit-box-orient: horizontal; 4064 -webkit-box-orient: horizontal;
4065 -webkit-box-direction: normal; 4065 -webkit-box-direction: normal;
4066 -ms-flex-direction: row; 4066 -ms-flex-direction: row;
4067 flex-direction: row; 4067 flex-direction: row;
4068 } 4068 }
4069 } 4069 }
4070 .main__resume-base-body-item-photo { 4070 .main__resume-base-body-item-photo {
4071 width: 180px; 4071 width: 180px;
4072 aspect-ratio: 1/1; 4072 aspect-ratio: 1/1;
4073 -o-object-fit: cover; 4073 -o-object-fit: cover;
4074 object-fit: cover; 4074 object-fit: cover;
4075 border-radius: 8px; 4075 border-radius: 8px;
4076 } 4076 }
4077 @media (min-width: 768px) { 4077 @media (min-width: 768px) {
4078 .main__resume-base-body-item-photo { 4078 .main__resume-base-body-item-photo {
4079 width: 210px; 4079 width: 210px;
4080 } 4080 }
4081 } 4081 }
4082 .main__resume-base-body-item-inner { 4082 .main__resume-base-body-item-inner {
4083 display: -webkit-box; 4083 display: -webkit-box;
4084 display: -ms-flexbox; 4084 display: -ms-flexbox;
4085 display: flex; 4085 display: flex;
4086 -webkit-box-orient: vertical; 4086 -webkit-box-orient: vertical;
4087 -webkit-box-direction: normal; 4087 -webkit-box-direction: normal;
4088 -ms-flex-direction: column; 4088 -ms-flex-direction: column;
4089 flex-direction: column; 4089 flex-direction: column;
4090 gap: 10px; 4090 gap: 10px;
4091 width: 100%; 4091 width: 100%;
4092 } 4092 }
4093 @media (min-width: 768px) { 4093 @media (min-width: 768px) {
4094 .main__resume-base-body-item-inner { 4094 .main__resume-base-body-item-inner {
4095 gap: 16px; 4095 gap: 16px;
4096 padding-right: 50px; 4096 padding-right: 50px;
4097 } 4097 }
4098 } 4098 }
4099 @media (min-width: 992px) { 4099 @media (min-width: 992px) {
4100 .main__resume-base-body-item-inner { 4100 .main__resume-base-body-item-inner {
4101 display: grid; 4101 display: grid;
4102 grid-template-columns: repeat(2, 1fr); 4102 grid-template-columns: repeat(2, 1fr);
4103 gap: 30px; 4103 gap: 30px;
4104 } 4104 }
4105 } 4105 }
4106 .main__resume-base-body-item-inner div { 4106 .main__resume-base-body-item-inner div {
4107 display: -webkit-box; 4107 display: -webkit-box;
4108 display: -ms-flexbox; 4108 display: -ms-flexbox;
4109 display: flex; 4109 display: flex;
4110 -webkit-box-orient: vertical; 4110 -webkit-box-orient: vertical;
4111 -webkit-box-direction: normal; 4111 -webkit-box-direction: normal;
4112 -ms-flex-direction: column; 4112 -ms-flex-direction: column;
4113 flex-direction: column; 4113 flex-direction: column;
4114 gap: 4px; 4114 gap: 4px;
4115 font-size: 12px; 4115 font-size: 12px;
4116 } 4116 }
4117 @media (min-width: 768px) { 4117 @media (min-width: 768px) {
4118 .main__resume-base-body-item-inner div { 4118 .main__resume-base-body-item-inner div {
4119 font-size: 16px; 4119 font-size: 16px;
4120 } 4120 }
4121 } 4121 }
4122 .main__resume-base-body-item-inner b { 4122 .main__resume-base-body-item-inner b {
4123 color: #377d87; 4123 color: #377d87;
4124 font-size: 14px; 4124 font-size: 14px;
4125 } 4125 }
4126 @media (min-width: 768px) { 4126 @media (min-width: 768px) {
4127 .main__resume-base-body-item-inner b { 4127 .main__resume-base-body-item-inner b {
4128 font-size: 18px; 4128 font-size: 18px;
4129 } 4129 }
4130 } 4130 }
4131 .main__resume-base-body-item-link { 4131 .main__resume-base-body-item-link {
4132 width: 100%; 4132 width: 100%;
4133 padding: 0; 4133 padding: 0;
4134 } 4134 }
4135 @media (min-width: 768px) { 4135 @media (min-width: 768px) {
4136 .main__resume-base-body-item-link { 4136 .main__resume-base-body-item-link {
4137 width: 200px; 4137 width: 200px;
4138 } 4138 }
4139 } 4139 }
4140 .main__spoiler { 4140 .main__spoiler {
4141 overflow: hidden; 4141 overflow: hidden;
4142 border-radius: 8px; 4142 border-radius: 8px;
4143 display: -webkit-box; 4143 display: -webkit-box;
4144 display: -ms-flexbox; 4144 display: -ms-flexbox;
4145 display: flex; 4145 display: flex;
4146 -webkit-box-orient: vertical; 4146 -webkit-box-orient: vertical;
4147 -webkit-box-direction: normal; 4147 -webkit-box-direction: normal;
4148 -ms-flex-direction: column; 4148 -ms-flex-direction: column;
4149 flex-direction: column; 4149 flex-direction: column;
4150 } 4150 }
4151 .main__spoiler-toper { 4151 .main__spoiler-toper {
4152 background: #377d87; 4152 background: #377d87;
4153 height: 30px; 4153 height: 30px;
4154 display: -webkit-box; 4154 display: -webkit-box;
4155 display: -ms-flexbox; 4155 display: -ms-flexbox;
4156 display: flex; 4156 display: flex;
4157 -webkit-box-align: center; 4157 -webkit-box-align: center;
4158 -ms-flex-align: center; 4158 -ms-flex-align: center;
4159 align-items: center; 4159 align-items: center;
4160 -webkit-box-pack: center; 4160 -webkit-box-pack: center;
4161 -ms-flex-pack: center; 4161 -ms-flex-pack: center;
4162 justify-content: center; 4162 justify-content: center;
4163 color: #fff; 4163 color: #fff;
4164 font-size: 12px; 4164 font-size: 12px;
4165 font-weight: 700; 4165 font-weight: 700;
4166 padding: 0 30px; 4166 padding: 0 30px;
4167 border: none; 4167 border: none;
4168 position: relative; 4168 position: relative;
4169 } 4169 }
4170 @media (min-width: 768px) { 4170 @media (min-width: 768px) {
4171 .main__spoiler-toper { 4171 .main__spoiler-toper {
4172 font-size: 18px; 4172 font-size: 18px;
4173 height: 50px; 4173 height: 50px;
4174 padding: 0 60px; 4174 padding: 0 60px;
4175 } 4175 }
4176 } 4176 }
4177 .main__spoiler-toper:before, .main__spoiler-toper:after { 4177 .main__spoiler-toper:before, .main__spoiler-toper:after {
4178 content: ""; 4178 content: "";
4179 background: #fff; 4179 background: #fff;
4180 border-radius: 999px; 4180 border-radius: 999px;
4181 width: 10px; 4181 width: 10px;
4182 height: 1px; 4182 height: 1px;
4183 position: absolute; 4183 position: absolute;
4184 top: 50%; 4184 top: 50%;
4185 right: 10px; 4185 right: 10px;
4186 -webkit-transition: 0.3s; 4186 -webkit-transition: 0.3s;
4187 transition: 0.3s; 4187 transition: 0.3s;
4188 -webkit-transform: translate(0, -50%); 4188 -webkit-transform: translate(0, -50%);
4189 -ms-transform: translate(0, -50%); 4189 -ms-transform: translate(0, -50%);
4190 transform: translate(0, -50%); 4190 transform: translate(0, -50%);
4191 } 4191 }
4192 @media (min-width: 768px) { 4192 @media (min-width: 768px) {
4193 .main__spoiler-toper:before, .main__spoiler-toper:after { 4193 .main__spoiler-toper:before, .main__spoiler-toper:after {
4194 width: 20px; 4194 width: 20px;
4195 height: 2px; 4195 height: 2px;
4196 right: 20px; 4196 right: 20px;
4197 } 4197 }
4198 } 4198 }
4199 .main__spoiler-toper:after { 4199 .main__spoiler-toper:after {
4200 -webkit-transform: rotate(90deg); 4200 -webkit-transform: rotate(90deg);
4201 -ms-transform: rotate(90deg); 4201 -ms-transform: rotate(90deg);
4202 transform: rotate(90deg); 4202 transform: rotate(90deg);
4203 } 4203 }
4204 .main__spoiler-toper.active:after { 4204 .main__spoiler-toper.active:after {
4205 -webkit-transform: rotate(0deg); 4205 -webkit-transform: rotate(0deg);
4206 -ms-transform: rotate(0deg); 4206 -ms-transform: rotate(0deg);
4207 transform: rotate(0deg); 4207 transform: rotate(0deg);
4208 } 4208 }
4209 .main__spoiler-body { 4209 .main__spoiler-body {
4210 opacity: 0; 4210 opacity: 0;
4211 height: 0; 4211 height: 0;
4212 overflow: hidden; 4212 overflow: hidden;
4213 border-radius: 0 0 8px 8px; 4213 border-radius: 0 0 8px 8px;
4214 background: #fff; 4214 background: #fff;
4215 } 4215 }
4216 .main__spoiler-body table { 4216 .main__spoiler-body table {
4217 width: calc(100% + 2px); 4217 width: calc(100% + 2px);
4218 margin-left: -1px; 4218 margin-left: -1px;
4219 margin-bottom: -1px; 4219 margin-bottom: -1px;
4220 } 4220 }
4221 @media (min-width: 992px) { 4221 @media (min-width: 992px) {
4222 .main__spoiler-body table td { 4222 .main__spoiler-body table td {
4223 width: 40%; 4223 width: 40%;
4224 } 4224 }
4225 } 4225 }
4226 @media (min-width: 992px) { 4226 @media (min-width: 992px) {
4227 .main__spoiler-body table td + td { 4227 .main__spoiler-body table td + td {
4228 width: 60%; 4228 width: 60%;
4229 } 4229 }
4230 } 4230 }
4231 .active + .main__spoiler-body { 4231 .active + .main__spoiler-body {
4232 -webkit-transition: 0.3s; 4232 -webkit-transition: 0.3s;
4233 transition: 0.3s; 4233 transition: 0.3s;
4234 opacity: 1; 4234 opacity: 1;
4235 height: auto; 4235 height: auto;
4236 border: 1px solid #cecece; 4236 border: 1px solid #cecece;
4237 border-top: none; 4237 border-top: none;
4238 } 4238 }
4239 .main__table { 4239 .main__table {
4240 border-collapse: collapse; 4240 border-collapse: collapse;
4241 table-layout: fixed; 4241 table-layout: fixed;
4242 font-size: 12px; 4242 font-size: 12px;
4243 width: 100%; 4243 width: 100%;
4244 background: #fff; 4244 background: #fff;
4245 } 4245 }
4246 @media (min-width: 768px) { 4246 @media (min-width: 768px) {
4247 .main__table { 4247 .main__table {
4248 font-size: 16px; 4248 font-size: 16px;
4249 } 4249 }
4250 } 4250 }
4251 .main__table td { 4251 .main__table td {
4252 border: 1px solid #cecece; 4252 border: 1px solid #cecece;
4253 padding: 4px 8px; 4253 padding: 4px 8px;
4254 vertical-align: top; 4254 vertical-align: top;
4255 } 4255 }
4256 @media (min-width: 768px) { 4256 @media (min-width: 768px) {
4257 .main__table td { 4257 .main__table td {
4258 padding: 8px 16px; 4258 padding: 8px 16px;
4259 } 4259 }
4260 } 4260 }
4261 .main__table td b { 4261 .main__table td b {
4262 font-weight: 700; 4262 font-weight: 700;
4263 } 4263 }
4264 .main__table_three { 4264 .main__table_three {
4265 table-layout: auto; 4265 table-layout: auto;
4266 } 4266 }
4267 .main__table_three td { 4267 .main__table_three td {
4268 width: 25% !important; 4268 width: 25% !important;
4269 } 4269 }
4270 .main__table_three td:last-child { 4270 .main__table_three td:last-child {
4271 width: 50% !important; 4271 width: 50% !important;
4272 } 4272 }
4273 .main__table b { 4273 .main__table b {
4274 display: block; 4274 display: block;
4275 } 4275 }
4276 .main__table a { 4276 .main__table a {
4277 color: #377d87; 4277 color: #377d87;
4278 text-decoration: underline; 4278 text-decoration: underline;
4279 } 4279 }
4280 .main__table a:hover { 4280 .main__table a:hover {
4281 color: #000; 4281 color: #000;
4282 } 4282 }
4283 .main__resume-profile-about { 4283 .main__resume-profile-about {
4284 padding-top: 20px; 4284 padding-top: 20px;
4285 padding-bottom: 30px; 4285 padding-bottom: 30px;
4286 position: relative; 4286 position: relative;
4287 margin-top: 30px; 4287 margin-top: 30px;
4288 display: -webkit-box; 4288 display: -webkit-box;
4289 display: -ms-flexbox; 4289 display: -ms-flexbox;
4290 display: flex; 4290 display: flex;
4291 -webkit-box-orient: vertical; 4291 -webkit-box-orient: vertical;
4292 -webkit-box-direction: normal; 4292 -webkit-box-direction: normal;
4293 -ms-flex-direction: column; 4293 -ms-flex-direction: column;
4294 flex-direction: column; 4294 flex-direction: column;
4295 -webkit-box-align: start; 4295 -webkit-box-align: start;
4296 -ms-flex-align: start; 4296 -ms-flex-align: start;
4297 align-items: flex-start; 4297 align-items: flex-start;
4298 gap: 10px; 4298 gap: 10px;
4299 } 4299 }
4300 @media (min-width: 992px) { 4300 @media (min-width: 992px) {
4301 .main__resume-profile-about { 4301 .main__resume-profile-about {
4302 padding: 50px 0; 4302 padding: 50px 0;
4303 } 4303 }
4304 } 4304 }
4305 .main__resume-profile-about:before { 4305 .main__resume-profile-about:before {
4306 content: ""; 4306 content: "";
4307 position: absolute; 4307 position: absolute;
4308 z-index: 1; 4308 z-index: 1;
4309 top: 0; 4309 top: 0;
4310 left: 50%; 4310 left: 50%;
4311 width: 20000px; 4311 width: 20000px;
4312 height: 100%; 4312 height: 100%;
4313 margin-left: -10000px; 4313 margin-left: -10000px;
4314 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 4314 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
4315 } 4315 }
4316 .main__resume-profile-about-title { 4316 .main__resume-profile-about-title {
4317 position: relative; 4317 position: relative;
4318 z-index: 2; 4318 z-index: 2;
4319 color: #000; 4319 color: #000;
4320 } 4320 }
4321 .main__resume-profile-about-text { 4321 .main__resume-profile-about-text {
4322 position: relative; 4322 position: relative;
4323 z-index: 2; 4323 z-index: 2;
4324 } 4324 }
4325 .main__resume-profile-about-button { 4325 .main__resume-profile-about-button {
4326 position: relative; 4326 position: relative;
4327 z-index: 2; 4327 z-index: 2;
4328 margin-top: 10px; 4328 margin-top: 10px;
4329 } 4329 }
4330 .main__resume-profile-info { 4330 .main__resume-profile-info {
4331 display: -webkit-box; 4331 display: -webkit-box;
4332 display: -ms-flexbox; 4332 display: -ms-flexbox;
4333 display: flex; 4333 display: flex;
4334 -webkit-box-orient: vertical; 4334 -webkit-box-orient: vertical;
4335 -webkit-box-direction: normal; 4335 -webkit-box-direction: normal;
4336 -ms-flex-direction: column; 4336 -ms-flex-direction: column;
4337 flex-direction: column; 4337 flex-direction: column;
4338 gap: 20px; 4338 gap: 20px;
4339 margin-top: 30px; 4339 margin-top: 30px;
4340 } 4340 }
4341 @media (min-width: 992px) { 4341 @media (min-width: 992px) {
4342 .main__resume-profile-info { 4342 .main__resume-profile-info {
4343 margin-top: 50px; 4343 margin-top: 50px;
4344 gap: 30px; 4344 gap: 30px;
4345 } 4345 }
4346 } 4346 }
4347 .main__resume-profile-info-title { 4347 .main__resume-profile-info-title {
4348 color: #000; 4348 color: #000;
4349 } 4349 }
4350 .main__resume-profile-info-body { 4350 .main__resume-profile-info-body {
4351 display: -webkit-box; 4351 display: -webkit-box;
4352 display: -ms-flexbox; 4352 display: -ms-flexbox;
4353 display: flex; 4353 display: flex;
4354 -webkit-box-orient: vertical; 4354 -webkit-box-orient: vertical;
4355 -webkit-box-direction: normal; 4355 -webkit-box-direction: normal;
4356 -ms-flex-direction: column; 4356 -ms-flex-direction: column;
4357 flex-direction: column; 4357 flex-direction: column;
4358 gap: 20px; 4358 gap: 20px;
4359 } 4359 }
4360 @media (min-width: 992px) { 4360 @media (min-width: 992px) {
4361 .main__resume-profile-info-body { 4361 .main__resume-profile-info-body {
4362 gap: 30px; 4362 gap: 30px;
4363 } 4363 }
4364 } 4364 }
4365 .main__resume-profile-info-body-item { 4365 .main__resume-profile-info-body-item {
4366 display: -webkit-box; 4366 display: -webkit-box;
4367 display: -ms-flexbox; 4367 display: -ms-flexbox;
4368 display: flex; 4368 display: flex;
4369 -webkit-box-orient: vertical; 4369 -webkit-box-orient: vertical;
4370 -webkit-box-direction: normal; 4370 -webkit-box-direction: normal;
4371 -ms-flex-direction: column; 4371 -ms-flex-direction: column;
4372 flex-direction: column; 4372 flex-direction: column;
4373 gap: 10px; 4373 gap: 10px;
4374 } 4374 }
4375 @media (min-width: 768px) { 4375 @media (min-width: 768px) {
4376 .main__resume-profile-info-body-item { 4376 .main__resume-profile-info-body-item {
4377 gap: 20px; 4377 gap: 20px;
4378 } 4378 }
4379 } 4379 }
4380 .main__resume-profile-info-body-subtitle { 4380 .main__resume-profile-info-body-subtitle {
4381 color: #4d88d9; 4381 color: #4d88d9;
4382 } 4382 }
4383 .main__resume-profile-info-body-inner { 4383 .main__resume-profile-info-body-inner {
4384 display: -webkit-box; 4384 display: -webkit-box;
4385 display: -ms-flexbox; 4385 display: -ms-flexbox;
4386 display: flex; 4386 display: flex;
4387 -webkit-box-orient: vertical; 4387 -webkit-box-orient: vertical;
4388 -webkit-box-direction: normal; 4388 -webkit-box-direction: normal;
4389 -ms-flex-direction: column; 4389 -ms-flex-direction: column;
4390 flex-direction: column; 4390 flex-direction: column;
4391 gap: 20px; 4391 gap: 20px;
4392 margin: 0; 4392 margin: 0;
4393 padding: 0; 4393 padding: 0;
4394 font-size: 12px; 4394 font-size: 12px;
4395 } 4395 }
4396 @media (min-width: 768px) { 4396 @media (min-width: 768px) {
4397 .main__resume-profile-info-body-inner { 4397 .main__resume-profile-info-body-inner {
4398 display: grid; 4398 display: grid;
4399 grid-template-columns: repeat(2, 1fr); 4399 grid-template-columns: repeat(2, 1fr);
4400 } 4400 }
4401 } 4401 }
4402 @media (min-width: 992px) { 4402 @media (min-width: 992px) {
4403 .main__resume-profile-info-body-inner { 4403 .main__resume-profile-info-body-inner {
4404 grid-template-columns: repeat(3, 1fr); 4404 grid-template-columns: repeat(3, 1fr);
4405 font-size: 16px; 4405 font-size: 16px;
4406 } 4406 }
4407 } 4407 }
4408 .main__resume-profile-info-body-inner li { 4408 .main__resume-profile-info-body-inner li {
4409 display: -webkit-box; 4409 display: -webkit-box;
4410 display: -ms-flexbox; 4410 display: -ms-flexbox;
4411 display: flex; 4411 display: flex;
4412 -webkit-box-orient: vertical; 4412 -webkit-box-orient: vertical;
4413 -webkit-box-direction: normal; 4413 -webkit-box-direction: normal;
4414 -ms-flex-direction: column; 4414 -ms-flex-direction: column;
4415 flex-direction: column; 4415 flex-direction: column;
4416 gap: 6px; 4416 gap: 6px;
4417 } 4417 }
4418 @media (min-width: 992px) { 4418 @media (min-width: 992px) {
4419 .main__resume-profile-info-body-inner li { 4419 .main__resume-profile-info-body-inner li {
4420 gap: 8px; 4420 gap: 8px;
4421 } 4421 }
4422 } 4422 }
4423 .main__resume-profile-info-body-inner b { 4423 .main__resume-profile-info-body-inner b {
4424 color: #377d87; 4424 color: #377d87;
4425 font-size: 14px; 4425 font-size: 14px;
4426 } 4426 }
4427 @media (min-width: 992px) { 4427 @media (min-width: 992px) {
4428 .main__resume-profile-info-body-inner b { 4428 .main__resume-profile-info-body-inner b {
4429 font-size: 18px; 4429 font-size: 18px;
4430 } 4430 }
4431 } 4431 }
4432 .main__resume-profile-info-body-inner span { 4432 .main__resume-profile-info-body-inner span {
4433 display: -webkit-box; 4433 display: -webkit-box;
4434 display: -ms-flexbox; 4434 display: -ms-flexbox;
4435 display: flex; 4435 display: flex;
4436 -webkit-box-orient: vertical; 4436 -webkit-box-orient: vertical;
4437 -webkit-box-direction: normal; 4437 -webkit-box-direction: normal;
4438 -ms-flex-direction: column; 4438 -ms-flex-direction: column;
4439 flex-direction: column; 4439 flex-direction: column;
4440 gap: 4px; 4440 gap: 4px;
4441 } 4441 }
4442 @media (min-width: 992px) { 4442 @media (min-width: 992px) {
4443 .main__resume-profile-info-body-inner span { 4443 .main__resume-profile-info-body-inner span {
4444 gap: 6px; 4444 gap: 6px;
4445 } 4445 }
4446 } 4446 }
4447 .main__resume-profile-review { 4447 .main__resume-profile-review {
4448 display: -webkit-box; 4448 display: -webkit-box;
4449 display: -ms-flexbox; 4449 display: -ms-flexbox;
4450 display: flex; 4450 display: flex;
4451 -webkit-box-orient: vertical; 4451 -webkit-box-orient: vertical;
4452 -webkit-box-direction: normal; 4452 -webkit-box-direction: normal;
4453 -ms-flex-direction: column; 4453 -ms-flex-direction: column;
4454 flex-direction: column; 4454 flex-direction: column;
4455 gap: 20px; 4455 gap: 20px;
4456 padding: 20px 10px; 4456 padding: 20px 10px;
4457 margin-top: 30px; 4457 margin-top: 30px;
4458 border-radius: 16px; 4458 border-radius: 16px;
4459 border: 1px solid #cecece; 4459 border: 1px solid #cecece;
4460 background: #fff; 4460 background: #fff;
4461 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4461 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4462 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4462 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4463 } 4463 }
4464 @media (min-width: 992px) { 4464 @media (min-width: 992px) {
4465 .main__resume-profile-review { 4465 .main__resume-profile-review {
4466 margin-top: 50px; 4466 margin-top: 50px;
4467 padding: 50px 40px; 4467 padding: 50px 40px;
4468 gap: 30px; 4468 gap: 30px;
4469 } 4469 }
4470 } 4470 }
4471 .main__resume-profile-review-title { 4471 .main__resume-profile-review-title {
4472 color: #000; 4472 color: #000;
4473 } 4473 }
4474 .main__resume-profile-review-body { 4474 .main__resume-profile-review-body {
4475 display: -webkit-box; 4475 display: -webkit-box;
4476 display: -ms-flexbox; 4476 display: -ms-flexbox;
4477 display: flex; 4477 display: flex;
4478 -webkit-box-orient: vertical; 4478 -webkit-box-orient: vertical;
4479 -webkit-box-direction: normal; 4479 -webkit-box-direction: normal;
4480 -ms-flex-direction: column; 4480 -ms-flex-direction: column;
4481 flex-direction: column; 4481 flex-direction: column;
4482 -webkit-box-align: start; 4482 -webkit-box-align: start;
4483 -ms-flex-align: start; 4483 -ms-flex-align: start;
4484 align-items: flex-start; 4484 align-items: flex-start;
4485 gap: 10px; 4485 gap: 10px;
4486 } 4486 }
4487 .main__resume-profile-review-body .textarea { 4487 .main__resume-profile-review-body .textarea {
4488 width: 100%; 4488 width: 100%;
4489 } 4489 }
4490 .main__resume-profile-review-body .button { 4490 .main__resume-profile-review-body .button {
4491 margin-top: 10px; 4491 margin-top: 10px;
4492 } 4492 }
4493 .main__vacancies { 4493 .main__vacancies {
4494 display: -webkit-box; 4494 display: -webkit-box;
4495 display: -ms-flexbox; 4495 display: -ms-flexbox;
4496 display: flex; 4496 display: flex;
4497 -webkit-box-orient: vertical; 4497 -webkit-box-orient: vertical;
4498 -webkit-box-direction: normal; 4498 -webkit-box-direction: normal;
4499 -ms-flex-direction: column; 4499 -ms-flex-direction: column;
4500 flex-direction: column; 4500 flex-direction: column;
4501 -webkit-box-align: center; 4501 -webkit-box-align: center;
4502 -ms-flex-align: center; 4502 -ms-flex-align: center;
4503 align-items: center; 4503 align-items: center;
4504 gap: 20px; 4504 gap: 20px;
4505 } 4505 }
4506 @media (min-width: 768px) { 4506 @media (min-width: 768px) {
4507 .main__vacancies { 4507 .main__vacancies {
4508 gap: 30px; 4508 gap: 30px;
4509 } 4509 }
4510 } 4510 }
4511 .main__vacancies-title { 4511 .main__vacancies-title {
4512 color: #000; 4512 color: #000;
4513 width: 100%; 4513 width: 100%;
4514 } 4514 }
4515 .main__vacancies-filters { 4515 .main__vacancies-filters {
4516 width: 100%; 4516 width: 100%;
4517 } 4517 }
4518 .main__vacancies-item { 4518 .main__vacancies-item {
4519 width: 100%; 4519 width: 100%;
4520 background: none; 4520 background: none;
4521 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4521 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4522 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4522 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4523 } 4523 }
4524 .main__vacancies-item-page { 4524 .main__vacancies-item-page {
4525 border: none; 4525 border: none;
4526 -webkit-box-shadow: none; 4526 -webkit-box-shadow: none;
4527 box-shadow: none; 4527 box-shadow: none;
4528 background: none; 4528 background: none;
4529 margin: 0 -10px; 4529 margin: 0 -10px;
4530 } 4530 }
4531 @media (min-width: 768px) { 4531 @media (min-width: 768px) {
4532 .main__vacancies-item-page { 4532 .main__vacancies-item-page {
4533 margin: 0 -20px; 4533 margin: 0 -20px;
4534 } 4534 }
4535 } 4535 }
4536 .main__vacancies-thing { 4536 .main__vacancies-thing {
4537 width: 100%; 4537 width: 100%;
4538 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 4538 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
4539 padding: 20px 10px; 4539 padding: 20px 10px;
4540 padding-bottom: 30px; 4540 padding-bottom: 30px;
4541 display: -webkit-box; 4541 display: -webkit-box;
4542 display: -ms-flexbox; 4542 display: -ms-flexbox;
4543 display: flex; 4543 display: flex;
4544 -webkit-box-orient: vertical; 4544 -webkit-box-orient: vertical;
4545 -webkit-box-direction: normal; 4545 -webkit-box-direction: normal;
4546 -ms-flex-direction: column; 4546 -ms-flex-direction: column;
4547 flex-direction: column; 4547 flex-direction: column;
4548 gap: 24px; 4548 gap: 24px;
4549 border-radius: 12px; 4549 border-radius: 12px;
4550 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4550 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4551 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4551 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4552 } 4552 }
4553 @media (min-width: 992px) { 4553 @media (min-width: 992px) {
4554 .main__vacancies-thing { 4554 .main__vacancies-thing {
4555 padding: 30px 20px; 4555 padding: 30px 20px;
4556 -webkit-box-orient: horizontal; 4556 -webkit-box-orient: horizontal;
4557 -webkit-box-direction: normal; 4557 -webkit-box-direction: normal;
4558 -ms-flex-direction: row; 4558 -ms-flex-direction: row;
4559 flex-direction: row; 4559 flex-direction: row;
4560 -webkit-box-align: start; 4560 -webkit-box-align: start;
4561 -ms-flex-align: start; 4561 -ms-flex-align: start;
4562 align-items: flex-start; 4562 align-items: flex-start;
4563 gap: 0; 4563 gap: 0;
4564 } 4564 }
4565 } 4565 }
4566 @media (min-width: 1280px) { 4566 @media (min-width: 1280px) {
4567 .main__vacancies-thing { 4567 .main__vacancies-thing {
4568 padding: 50px 20px; 4568 padding: 50px 20px;
4569 } 4569 }
4570 } 4570 }
4571 .main__vacancies-thing-pic { 4571 .main__vacancies-thing-pic {
4572 position: relative; 4572 position: relative;
4573 z-index: 2; 4573 z-index: 2;
4574 width: 100%; 4574 width: 100%;
4575 aspect-ratio: 42/34; 4575 aspect-ratio: 42/34;
4576 -o-object-fit: cover; 4576 -o-object-fit: cover;
4577 object-fit: cover; 4577 object-fit: cover;
4578 border-radius: 8px; 4578 border-radius: 8px;
4579 max-height: 340px; 4579 max-height: 340px;
4580 } 4580 }
4581 @media (min-width: 992px) { 4581 @media (min-width: 992px) {
4582 .main__vacancies-thing-pic { 4582 .main__vacancies-thing-pic {
4583 width: 380px; 4583 width: 380px;
4584 } 4584 }
4585 } 4585 }
4586 @media (min-width: 1280px) { 4586 @media (min-width: 1280px) {
4587 .main__vacancies-thing-pic { 4587 .main__vacancies-thing-pic {
4588 width: 420px; 4588 width: 420px;
4589 } 4589 }
4590 } 4590 }
4591 .main__vacancies-thing-body { 4591 .main__vacancies-thing-body {
4592 display: -webkit-box; 4592 display: -webkit-box;
4593 display: -ms-flexbox; 4593 display: -ms-flexbox;
4594 display: flex; 4594 display: flex;
4595 -webkit-box-orient: vertical; 4595 -webkit-box-orient: vertical;
4596 -webkit-box-direction: normal; 4596 -webkit-box-direction: normal;
4597 -ms-flex-direction: column; 4597 -ms-flex-direction: column;
4598 flex-direction: column; 4598 flex-direction: column;
4599 -webkit-box-align: start; 4599 -webkit-box-align: start;
4600 -ms-flex-align: start; 4600 -ms-flex-align: start;
4601 align-items: flex-start; 4601 align-items: flex-start;
4602 gap: 16px; 4602 gap: 16px;
4603 color: #000; 4603 color: #000;
4604 } 4604 }
4605 @media (min-width: 992px) { 4605 @media (min-width: 992px) {
4606 .main__vacancies-thing-body { 4606 .main__vacancies-thing-body {
4607 width: calc(100% - 380px); 4607 width: calc(100% - 380px);
4608 padding-left: 20px; 4608 padding-left: 20px;
4609 } 4609 }
4610 } 4610 }
4611 @media (min-width: 1280px) { 4611 @media (min-width: 1280px) {
4612 .main__vacancies-thing-body { 4612 .main__vacancies-thing-body {
4613 width: calc(100% - 420px); 4613 width: calc(100% - 420px);
4614 gap: 20px; 4614 gap: 20px;
4615 } 4615 }
4616 } 4616 }
4617 .main__vacancies-thing-body > * { 4617 .main__vacancies-thing-body > * {
4618 width: 100%; 4618 width: 100%;
4619 } 4619 }
4620 .main__vacancies-thing-body .button { 4620 .main__vacancies-thing-body .button {
4621 width: auto; 4621 width: auto;
4622 } 4622 }
4623 @media (min-width: 768px) { 4623 @media (min-width: 768px) {
4624 .main__vacancies-thing-body .button { 4624 .main__vacancies-thing-body .button {
4625 min-width: 200px; 4625 min-width: 200px;
4626 } 4626 }
4627 } 4627 }
4628 .main__vacancies-thing-scroll { 4628 .main__vacancies-thing-scroll {
4629 display: -webkit-box; 4629 display: -webkit-box;
4630 display: -ms-flexbox; 4630 display: -ms-flexbox;
4631 display: flex; 4631 display: flex;
4632 -webkit-box-orient: vertical; 4632 -webkit-box-orient: vertical;
4633 -webkit-box-direction: normal; 4633 -webkit-box-direction: normal;
4634 -ms-flex-direction: column; 4634 -ms-flex-direction: column;
4635 flex-direction: column; 4635 flex-direction: column;
4636 -webkit-box-align: start; 4636 -webkit-box-align: start;
4637 -ms-flex-align: start; 4637 -ms-flex-align: start;
4638 align-items: flex-start; 4638 align-items: flex-start;
4639 gap: 16px; 4639 gap: 16px;
4640 overflow: hidden; 4640 overflow: hidden;
4641 overflow-y: auto; 4641 overflow-y: auto;
4642 max-height: 180px; 4642 max-height: 180px;
4643 padding-right: 10px; 4643 padding-right: 10px;
4644 } 4644 }
4645 @media (min-width: 768px) { 4645 @media (min-width: 768px) {
4646 .main__vacancies-thing-scroll { 4646 .main__vacancies-thing-scroll {
4647 max-height: 210px; 4647 max-height: 210px;
4648 padding-right: 20px; 4648 padding-right: 20px;
4649 } 4649 }
4650 } 4650 }
4651 @media (min-width: 992px) { 4651 @media (min-width: 992px) {
4652 .main__vacancies-thing-scroll { 4652 .main__vacancies-thing-scroll {
4653 max-height: 175px; 4653 max-height: 175px;
4654 } 4654 }
4655 } 4655 }
4656 @media (min-width: 1280px) { 4656 @media (min-width: 1280px) {
4657 .main__vacancies-thing-scroll { 4657 .main__vacancies-thing-scroll {
4658 max-height: 200px; 4658 max-height: 200px;
4659 gap: 20px; 4659 gap: 20px;
4660 } 4660 }
4661 } 4661 }
4662 .main__cond { 4662 .main__cond {
4663 display: -webkit-box; 4663 display: -webkit-box;
4664 display: -ms-flexbox; 4664 display: -ms-flexbox;
4665 display: flex; 4665 display: flex;
4666 -webkit-box-orient: vertical; 4666 -webkit-box-orient: vertical;
4667 -webkit-box-direction: normal; 4667 -webkit-box-direction: normal;
4668 -ms-flex-direction: column; 4668 -ms-flex-direction: column;
4669 flex-direction: column; 4669 flex-direction: column;
4670 gap: 50px; 4670 gap: 50px;
4671 } 4671 }
4672 .main__cond > div { 4672 .main__cond > div {
4673 display: -webkit-box; 4673 display: -webkit-box;
4674 display: -ms-flexbox; 4674 display: -ms-flexbox;
4675 display: flex; 4675 display: flex;
4676 -webkit-box-orient: vertical; 4676 -webkit-box-orient: vertical;
4677 -webkit-box-direction: normal; 4677 -webkit-box-direction: normal;
4678 -ms-flex-direction: column; 4678 -ms-flex-direction: column;
4679 flex-direction: column; 4679 flex-direction: column;
4680 gap: 10px; 4680 gap: 10px;
4681 } 4681 }
4682 .main__cond-label { 4682 .main__cond-label {
4683 border-radius: 16px; 4683 border-radius: 16px;
4684 border: 1px solid #cecece; 4684 border: 1px solid #cecece;
4685 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4685 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4686 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 4686 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
4687 padding: 30px 20px; 4687 padding: 30px 20px;
4688 font-weight: 700; 4688 font-weight: 700;
4689 color: #000; 4689 color: #000;
4690 line-height: 2; 4690 line-height: 2;
4691 text-align: center; 4691 text-align: center;
4692 } 4692 }
4693 @media (min-width: 992px) { 4693 @media (min-width: 992px) {
4694 .main__cond-label { 4694 .main__cond-label {
4695 font-size: 30px; 4695 font-size: 30px;
4696 } 4696 }
4697 } 4697 }
4698 .main__cond-icons { 4698 .main__cond-icons {
4699 padding: 0; 4699 padding: 0;
4700 margin: 0; 4700 margin: 0;
4701 display: -webkit-box; 4701 display: -webkit-box;
4702 display: -ms-flexbox; 4702 display: -ms-flexbox;
4703 display: flex; 4703 display: flex;
4704 -webkit-box-orient: vertical; 4704 -webkit-box-orient: vertical;
4705 -webkit-box-direction: normal; 4705 -webkit-box-direction: normal;
4706 -ms-flex-direction: column; 4706 -ms-flex-direction: column;
4707 flex-direction: column; 4707 flex-direction: column;
4708 gap: 25px; 4708 gap: 25px;
4709 margin-top: 10px; 4709 margin-top: 10px;
4710 } 4710 }
4711 @media (min-width: 768px) { 4711 @media (min-width: 768px) {
4712 .main__cond-icons { 4712 .main__cond-icons {
4713 display: grid; 4713 display: grid;
4714 grid-template-columns: repeat(2, 1fr); 4714 grid-template-columns: repeat(2, 1fr);
4715 gap: 60px; 4715 gap: 60px;
4716 margin-top: 20px; 4716 margin-top: 20px;
4717 } 4717 }
4718 } 4718 }
4719 @media (min-width: 1280px) { 4719 @media (min-width: 1280px) {
4720 .main__cond-icons { 4720 .main__cond-icons {
4721 grid-template-columns: repeat(3, 1fr); 4721 grid-template-columns: repeat(3, 1fr);
4722 } 4722 }
4723 } 4723 }
4724 .main__cond-icons li { 4724 .main__cond-icons li {
4725 display: -webkit-box; 4725 display: -webkit-box;
4726 display: -ms-flexbox; 4726 display: -ms-flexbox;
4727 display: flex; 4727 display: flex;
4728 -webkit-box-orient: vertical; 4728 -webkit-box-orient: vertical;
4729 -webkit-box-direction: normal; 4729 -webkit-box-direction: normal;
4730 -ms-flex-direction: column; 4730 -ms-flex-direction: column;
4731 flex-direction: column; 4731 flex-direction: column;
4732 -webkit-box-align: start; 4732 -webkit-box-align: start;
4733 -ms-flex-align: start; 4733 -ms-flex-align: start;
4734 align-items: flex-start; 4734 align-items: flex-start;
4735 gap: 20px; 4735 gap: 20px;
4736 font-size: 12px; 4736 font-size: 12px;
4737 line-height: 1.4; 4737 line-height: 1.4;
4738 color: #000; 4738 color: #000;
4739 } 4739 }
4740 @media (min-width: 768px) { 4740 @media (min-width: 768px) {
4741 .main__cond-icons li { 4741 .main__cond-icons li {
4742 font-size: 14px; 4742 font-size: 14px;
4743 } 4743 }
4744 } 4744 }
4745 @media (min-width: 992px) { 4745 @media (min-width: 992px) {
4746 .main__cond-icons li { 4746 .main__cond-icons li {
4747 font-size: 16px; 4747 font-size: 16px;
4748 line-height: 1.6; 4748 line-height: 1.6;
4749 } 4749 }
4750 } 4750 }
4751 @media (min-width: 1280px) { 4751 @media (min-width: 1280px) {
4752 .main__cond-icons li { 4752 .main__cond-icons li {
4753 font-size: 18px; 4753 font-size: 18px;
4754 } 4754 }
4755 } 4755 }
4756 .main__cond-icons li span { 4756 .main__cond-icons li span {
4757 width: 48px; 4757 width: 48px;
4758 height: 48px; 4758 height: 48px;
4759 display: -webkit-box; 4759 display: -webkit-box;
4760 display: -ms-flexbox; 4760 display: -ms-flexbox;
4761 display: flex; 4761 display: flex;
4762 -webkit-box-align: center; 4762 -webkit-box-align: center;
4763 -ms-flex-align: center; 4763 -ms-flex-align: center;
4764 align-items: center; 4764 align-items: center;
4765 } 4765 }
4766 .main__cond-icons li span img { 4766 .main__cond-icons li span img {
4767 max-width: 48px; 4767 max-width: 48px;
4768 } 4768 }
4769 .main__cond-callback { 4769 .main__cond-callback {
4770 margin-top: 10px; 4770 margin-top: 10px;
4771 } 4771 }
4772 .main__ads { 4772 .main__ads {
4773 display: -webkit-box; 4773 display: -webkit-box;
4774 display: -ms-flexbox; 4774 display: -ms-flexbox;
4775 display: flex; 4775 display: flex;
4776 -webkit-box-orient: vertical; 4776 -webkit-box-orient: vertical;
4777 -webkit-box-direction: normal; 4777 -webkit-box-direction: normal;
4778 -ms-flex-direction: column; 4778 -ms-flex-direction: column;
4779 flex-direction: column; 4779 flex-direction: column;
4780 gap: 30px; 4780 gap: 30px;
4781 margin: 30px 0; 4781 margin: 30px 0;
4782 } 4782 }
4783 @media (min-width: 992px) { 4783 @media (min-width: 992px) {
4784 .main__ads { 4784 .main__ads {
4785 margin: 60px 0; 4785 margin: 60px 0;
4786 } 4786 }
4787 } 4787 }
4788 .main__ads-item { 4788 .main__ads-item {
4789 display: -webkit-box; 4789 display: -webkit-box;
4790 display: -ms-flexbox; 4790 display: -ms-flexbox;
4791 display: flex; 4791 display: flex;
4792 -webkit-box-orient: vertical; 4792 -webkit-box-orient: vertical;
4793 -webkit-box-direction: normal; 4793 -webkit-box-direction: normal;
4794 -ms-flex-direction: column; 4794 -ms-flex-direction: column;
4795 flex-direction: column; 4795 flex-direction: column;
4796 gap: 16px; 4796 gap: 16px;
4797 } 4797 }
4798 @media (min-width: 992px) { 4798 @media (min-width: 992px) {
4799 .main__ads-item { 4799 .main__ads-item {
4800 -webkit-box-orient: horizontal; 4800 -webkit-box-orient: horizontal;
4801 -webkit-box-direction: normal; 4801 -webkit-box-direction: normal;
4802 -ms-flex-direction: row; 4802 -ms-flex-direction: row;
4803 flex-direction: row; 4803 flex-direction: row;
4804 gap: 0; 4804 gap: 0;
4805 } 4805 }
4806 } 4806 }
4807 .main__ads-item-pic { 4807 .main__ads-item-pic {
4808 width: 100%; 4808 width: 100%;
4809 max-width: 440px; 4809 max-width: 440px;
4810 max-height: 200px; 4810 max-height: 200px;
4811 aspect-ratio: 3/2; 4811 aspect-ratio: 3/2;
4812 position: relative; 4812 position: relative;
4813 overflow: hidden; 4813 overflow: hidden;
4814 border-radius: 12px; 4814 border-radius: 12px;
4815 } 4815 }
4816 @media (min-width: 992px) { 4816 @media (min-width: 992px) {
4817 .main__ads-item-pic { 4817 .main__ads-item-pic {
4818 width: 200px; 4818 width: 200px;
4819 aspect-ratio: 1/1; 4819 aspect-ratio: 1/1;
4820 } 4820 }
4821 } 4821 }
4822 .main__ads-item-pic img { 4822 .main__ads-item-pic img {
4823 z-index: 1; 4823 z-index: 1;
4824 position: absolute; 4824 position: absolute;
4825 top: 0; 4825 top: 0;
4826 left: 0; 4826 left: 0;
4827 width: 100%; 4827 width: 100%;
4828 height: 100%; 4828 height: 100%;
4829 -o-object-fit: cover; 4829 -o-object-fit: cover;
4830 object-fit: cover; 4830 object-fit: cover;
4831 } 4831 }
4832 .main__ads-item-pic span { 4832 .main__ads-item-pic span {
4833 z-index: 2; 4833 z-index: 2;
4834 width: 30px; 4834 width: 30px;
4835 height: 30px; 4835 height: 30px;
4836 border-radius: 6px; 4836 border-radius: 6px;
4837 background: #4d88d9; 4837 background: #4d88d9;
4838 display: -webkit-box; 4838 display: -webkit-box;
4839 display: -ms-flexbox; 4839 display: -ms-flexbox;
4840 display: flex; 4840 display: flex;
4841 -webkit-box-pack: center; 4841 -webkit-box-pack: center;
4842 -ms-flex-pack: center; 4842 -ms-flex-pack: center;
4843 justify-content: center; 4843 justify-content: center;
4844 -webkit-box-align: center; 4844 -webkit-box-align: center;
4845 -ms-flex-align: center; 4845 -ms-flex-align: center;
4846 align-items: center; 4846 align-items: center;
4847 position: absolute; 4847 position: absolute;
4848 top: 10px; 4848 top: 10px;
4849 left: 10px; 4849 left: 10px;
4850 color: #fff; 4850 color: #fff;
4851 } 4851 }
4852 @media (min-width: 992px) { 4852 @media (min-width: 992px) {
4853 .main__ads-item-pic span { 4853 .main__ads-item-pic span {
4854 width: 42px; 4854 width: 42px;
4855 height: 42px; 4855 height: 42px;
4856 } 4856 }
4857 } 4857 }
4858 .main__ads-item-pic span svg { 4858 .main__ads-item-pic span svg {
4859 width: 12px; 4859 width: 12px;
4860 height: 12px; 4860 height: 12px;
4861 } 4861 }
4862 @media (min-width: 992px) { 4862 @media (min-width: 992px) {
4863 .main__ads-item-pic span svg { 4863 .main__ads-item-pic span svg {
4864 width: 20px; 4864 width: 20px;
4865 height: 20px; 4865 height: 20px;
4866 } 4866 }
4867 } 4867 }
4868 .main__ads-item-body { 4868 .main__ads-item-body {
4869 display: -webkit-box; 4869 display: -webkit-box;
4870 display: -ms-flexbox; 4870 display: -ms-flexbox;
4871 display: flex; 4871 display: flex;
4872 -webkit-box-orient: vertical; 4872 -webkit-box-orient: vertical;
4873 -webkit-box-direction: normal; 4873 -webkit-box-direction: normal;
4874 -ms-flex-direction: column; 4874 -ms-flex-direction: column;
4875 flex-direction: column; 4875 flex-direction: column;
4876 -webkit-box-align: start; 4876 -webkit-box-align: start;
4877 -ms-flex-align: start; 4877 -ms-flex-align: start;
4878 align-items: flex-start; 4878 align-items: flex-start;
4879 gap: 10px; 4879 gap: 10px;
4880 font-size: 12px; 4880 font-size: 12px;
4881 } 4881 }
4882 @media (min-width: 992px) { 4882 @media (min-width: 992px) {
4883 .main__ads-item-body { 4883 .main__ads-item-body {
4884 width: calc(100% - 200px); 4884 width: calc(100% - 200px);
4885 padding-left: 40px; 4885 padding-left: 40px;
4886 -webkit-box-pack: center; 4886 -webkit-box-pack: center;
4887 -ms-flex-pack: center; 4887 -ms-flex-pack: center;
4888 justify-content: center; 4888 justify-content: center;
4889 font-size: 16px; 4889 font-size: 16px;
4890 gap: 20px; 4890 gap: 20px;
4891 } 4891 }
4892 } 4892 }
4893 .main__ads-item-body b { 4893 .main__ads-item-body b {
4894 width: 100%; 4894 width: 100%;
4895 font-weight: 700; 4895 font-weight: 700;
4896 font-size: 14px; 4896 font-size: 14px;
4897 } 4897 }
4898 @media (min-width: 992px) { 4898 @media (min-width: 992px) {
4899 .main__ads-item-body b { 4899 .main__ads-item-body b {
4900 font-size: 20px; 4900 font-size: 20px;
4901 } 4901 }
4902 } 4902 }
4903 .main__ads-item-body span { 4903 .main__ads-item-body span {
4904 width: 100%; 4904 width: 100%;
4905 } 4905 }
4906 4906
4907 .work { 4907 .work {
4908 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 4908 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
4909 color: #000; 4909 color: #000;
4910 padding-top: 70px; 4910 padding-top: 70px;
4911 padding-bottom: 10px; 4911 padding-bottom: 10px;
4912 position: relative; 4912 position: relative;
4913 overflow: hidden; 4913 overflow: hidden;
4914 } 4914 }
4915 @media (min-width: 768px) { 4915 @media (min-width: 768px) {
4916 .work { 4916 .work {
4917 padding-bottom: 25px; 4917 padding-bottom: 25px;
4918 } 4918 }
4919 } 4919 }
4920 @media (min-width: 1280px) { 4920 @media (min-width: 1280px) {
4921 .work { 4921 .work {
4922 padding-top: 80px; 4922 padding-top: 80px;
4923 padding-bottom: 25px; 4923 padding-bottom: 25px;
4924 } 4924 }
4925 } 4925 }
4926 .work__pic { 4926 .work__pic {
4927 position: absolute; 4927 position: absolute;
4928 height: calc(100% - 40px); 4928 height: calc(100% - 40px);
4929 z-index: 1; 4929 z-index: 1;
4930 display: none; 4930 display: none;
4931 bottom: 0; 4931 bottom: 0;
4932 left: 50%; 4932 left: 50%;
4933 margin-left: 40px; 4933 margin-left: 40px;
4934 } 4934 }
4935 @media (min-width: 992px) { 4935 @media (min-width: 992px) {
4936 .work__pic { 4936 .work__pic {
4937 display: block; 4937 display: block;
4938 } 4938 }
4939 } 4939 }
4940 @media (min-width: 1280px) { 4940 @media (min-width: 1280px) {
4941 .work__pic { 4941 .work__pic {
4942 margin-left: 80px; 4942 margin-left: 80px;
4943 } 4943 }
4944 } 4944 }
4945 .work__body { 4945 .work__body {
4946 position: relative; 4946 position: relative;
4947 z-index: 2; 4947 z-index: 2;
4948 display: -webkit-box; 4948 display: -webkit-box;
4949 display: -ms-flexbox; 4949 display: -ms-flexbox;
4950 display: flex; 4950 display: flex;
4951 -webkit-box-orient: vertical; 4951 -webkit-box-orient: vertical;
4952 -webkit-box-direction: normal; 4952 -webkit-box-direction: normal;
4953 -ms-flex-direction: column; 4953 -ms-flex-direction: column;
4954 flex-direction: column; 4954 flex-direction: column;
4955 -webkit-box-align: center; 4955 -webkit-box-align: center;
4956 -ms-flex-align: center; 4956 -ms-flex-align: center;
4957 align-items: center; 4957 align-items: center;
4958 } 4958 }
4959 @media (min-width: 768px) { 4959 @media (min-width: 768px) {
4960 .work__body { 4960 .work__body {
4961 -webkit-box-align: start; 4961 -webkit-box-align: start;
4962 -ms-flex-align: start; 4962 -ms-flex-align: start;
4963 align-items: flex-start; 4963 align-items: flex-start;
4964 } 4964 }
4965 } 4965 }
4966 @media (min-width: 992px) { 4966 @media (min-width: 992px) {
4967 .work__body { 4967 .work__body {
4968 max-width: 600px; 4968 max-width: 600px;
4969 } 4969 }
4970 } 4970 }
4971 .work__title { 4971 .work__title {
4972 width: 100%; 4972 width: 100%;
4973 font-size: 40px; 4973 font-size: 40px;
4974 font-weight: 700; 4974 font-weight: 700;
4975 line-height: 1; 4975 line-height: 1;
4976 } 4976 }
4977 @media (min-width: 768px) { 4977 @media (min-width: 768px) {
4978 .work__title { 4978 .work__title {
4979 font-size: 64px; 4979 font-size: 64px;
4980 line-height: 94px; 4980 line-height: 94px;
4981 } 4981 }
4982 } 4982 }
4983 .work__text { 4983 .work__text {
4984 width: 100%; 4984 width: 100%;
4985 font-size: 12px; 4985 font-size: 12px;
4986 margin-top: 10px; 4986 margin-top: 10px;
4987 } 4987 }
4988 @media (min-width: 768px) { 4988 @media (min-width: 768px) {
4989 .work__text { 4989 .work__text {
4990 font-size: 18px; 4990 font-size: 18px;
4991 margin-top: 20px; 4991 margin-top: 20px;
4992 line-height: 1.4; 4992 line-height: 1.4;
4993 } 4993 }
4994 } 4994 }
4995 .work__list { 4995 .work__list {
4996 width: 100%; 4996 width: 100%;
4997 display: -webkit-box; 4997 display: -webkit-box;
4998 display: -ms-flexbox; 4998 display: -ms-flexbox;
4999 display: flex; 4999 display: flex;
5000 -webkit-box-orient: vertical; 5000 -webkit-box-orient: vertical;
5001 -webkit-box-direction: normal; 5001 -webkit-box-direction: normal;
5002 -ms-flex-direction: column; 5002 -ms-flex-direction: column;
5003 flex-direction: column; 5003 flex-direction: column;
5004 gap: 5px; 5004 gap: 5px;
5005 font-size: 14px; 5005 font-size: 14px;
5006 font-weight: 700; 5006 font-weight: 700;
5007 margin-top: 15px; 5007 margin-top: 15px;
5008 } 5008 }
5009 @media (min-width: 768px) { 5009 @media (min-width: 768px) {
5010 .work__list { 5010 .work__list {
5011 font-size: 18px; 5011 font-size: 18px;
5012 gap: 8px; 5012 gap: 8px;
5013 margin-top: 30px; 5013 margin-top: 30px;
5014 } 5014 }
5015 } 5015 }
5016 .work__list div { 5016 .work__list div {
5017 position: relative; 5017 position: relative;
5018 padding-left: 10px; 5018 padding-left: 10px;
5019 } 5019 }
5020 @media (min-width: 768px) { 5020 @media (min-width: 768px) {
5021 .work__list div { 5021 .work__list div {
5022 padding-left: 16px; 5022 padding-left: 16px;
5023 } 5023 }
5024 } 5024 }
5025 .work__list div:before { 5025 .work__list div:before {
5026 content: ""; 5026 content: "";
5027 width: 4px; 5027 width: 4px;
5028 height: 4px; 5028 height: 4px;
5029 background: #000; 5029 background: #000;
5030 border-radius: 999px; 5030 border-radius: 999px;
5031 position: absolute; 5031 position: absolute;
5032 top: 5px; 5032 top: 5px;
5033 left: 0; 5033 left: 0;
5034 } 5034 }
5035 @media (min-width: 768px) { 5035 @media (min-width: 768px) {
5036 .work__list div:before { 5036 .work__list div:before {
5037 top: 8px; 5037 top: 8px;
5038 } 5038 }
5039 } 5039 }
5040 .work__form { 5040 .work__form {
5041 margin-top: 20px; 5041 margin-top: 20px;
5042 } 5042 }
5043 @media (min-width: 768px) { 5043 @media (min-width: 768px) {
5044 .work__form { 5044 .work__form {
5045 margin-top: 30px; 5045 margin-top: 30px;
5046 } 5046 }
5047 } 5047 }
5048 .work__search { 5048 .work__search {
5049 width: 100%; 5049 width: 100%;
5050 max-width: 180px; 5050 max-width: 180px;
5051 margin-top: 20px; 5051 margin-top: 20px;
5052 } 5052 }
5053 @media (min-width: 768px) { 5053 @media (min-width: 768px) {
5054 .work__search { 5054 .work__search {
5055 max-width: 270px; 5055 max-width: 270px;
5056 margin-top: 50px; 5056 margin-top: 50px;
5057 } 5057 }
5058 } 5058 }
5059 .work__get { 5059 .work__get {
5060 width: 100%; 5060 width: 100%;
5061 display: -webkit-box; 5061 display: -webkit-box;
5062 display: -ms-flexbox; 5062 display: -ms-flexbox;
5063 display: flex; 5063 display: flex;
5064 -webkit-box-align: start; 5064 -webkit-box-align: start;
5065 -ms-flex-align: start; 5065 -ms-flex-align: start;
5066 align-items: flex-start; 5066 align-items: flex-start;
5067 -ms-flex-wrap: wrap; 5067 -ms-flex-wrap: wrap;
5068 flex-wrap: wrap; 5068 flex-wrap: wrap;
5069 margin-top: 48px; 5069 margin-top: 48px;
5070 } 5070 }
5071 .work__get b { 5071 .work__get b {
5072 width: 100%; 5072 width: 100%;
5073 margin-bottom: 10px; 5073 margin-bottom: 10px;
5074 font-size: 14px; 5074 font-size: 14px;
5075 } 5075 }
5076 @media (min-width: 768px) { 5076 @media (min-width: 768px) {
5077 .work__get b { 5077 .work__get b {
5078 font-size: 18px; 5078 font-size: 18px;
5079 } 5079 }
5080 } 5080 }
5081 .work__get a { 5081 .work__get a {
5082 display: -webkit-box; 5082 display: -webkit-box;
5083 display: -ms-flexbox; 5083 display: -ms-flexbox;
5084 display: flex; 5084 display: flex;
5085 -webkit-box-align: center; 5085 -webkit-box-align: center;
5086 -ms-flex-align: center; 5086 -ms-flex-align: center;
5087 align-items: center; 5087 align-items: center;
5088 -webkit-box-pack: center; 5088 -webkit-box-pack: center;
5089 -ms-flex-pack: center; 5089 -ms-flex-pack: center;
5090 justify-content: center; 5090 justify-content: center;
5091 margin-right: 20px; 5091 margin-right: 20px;
5092 } 5092 }
5093 .work__get a img { 5093 .work__get a img {
5094 -webkit-transition: 0.3s; 5094 -webkit-transition: 0.3s;
5095 transition: 0.3s; 5095 transition: 0.3s;
5096 width: 111px; 5096 width: 111px;
5097 } 5097 }
5098 @media (min-width: 768px) { 5098 @media (min-width: 768px) {
5099 .work__get a img { 5099 .work__get a img {
5100 width: 131px; 5100 width: 131px;
5101 } 5101 }
5102 } 5102 }
5103 .work__get a:hover img { 5103 .work__get a:hover img {
5104 -webkit-transform: scale(1.1); 5104 -webkit-transform: scale(1.1);
5105 -ms-transform: scale(1.1); 5105 -ms-transform: scale(1.1);
5106 transform: scale(1.1); 5106 transform: scale(1.1);
5107 } 5107 }
5108 .work__get a + a { 5108 .work__get a + a {
5109 margin-right: 0; 5109 margin-right: 0;
5110 } 5110 }
5111 5111
5112 .numbers { 5112 .numbers {
5113 padding: 30px 0; 5113 padding: 30px 0;
5114 background: #377d87 url("../images/bg.svg") no-repeat 100% calc(100% + 80px); 5114 background: #377d87 url("../images/bg.svg") no-repeat 100% calc(100% + 80px);
5115 color: #fff; 5115 color: #fff;
5116 } 5116 }
5117 @media (min-width: 1280px) { 5117 @media (min-width: 1280px) {
5118 .numbers { 5118 .numbers {
5119 padding: 100px 0; 5119 padding: 100px 0;
5120 background-position: 100% 100%; 5120 background-position: 100% 100%;
5121 background-size: auto 500px; 5121 background-size: auto 500px;
5122 } 5122 }
5123 } 5123 }
5124 .numbers__body { 5124 .numbers__body {
5125 display: -webkit-box; 5125 display: -webkit-box;
5126 display: -ms-flexbox; 5126 display: -ms-flexbox;
5127 display: flex; 5127 display: flex;
5128 -webkit-box-orient: vertical; 5128 -webkit-box-orient: vertical;
5129 -webkit-box-direction: normal; 5129 -webkit-box-direction: normal;
5130 -ms-flex-direction: column; 5130 -ms-flex-direction: column;
5131 flex-direction: column; 5131 flex-direction: column;
5132 gap: 30px; 5132 gap: 30px;
5133 } 5133 }
5134 @media (min-width: 768px) { 5134 @media (min-width: 768px) {
5135 .numbers__body { 5135 .numbers__body {
5136 display: grid; 5136 display: grid;
5137 grid-template-columns: 1fr 1fr 1fr; 5137 grid-template-columns: 1fr 1fr 1fr;
5138 } 5138 }
5139 } 5139 }
5140 .numbers__item { 5140 .numbers__item {
5141 font-size: 12px; 5141 font-size: 12px;
5142 display: -webkit-box; 5142 display: -webkit-box;
5143 display: -ms-flexbox; 5143 display: -ms-flexbox;
5144 display: flex; 5144 display: flex;
5145 -webkit-box-orient: vertical; 5145 -webkit-box-orient: vertical;
5146 -webkit-box-direction: normal; 5146 -webkit-box-direction: normal;
5147 -ms-flex-direction: column; 5147 -ms-flex-direction: column;
5148 flex-direction: column; 5148 flex-direction: column;
5149 line-height: 1.4; 5149 line-height: 1.4;
5150 } 5150 }
5151 @media (min-width: 1280px) { 5151 @media (min-width: 1280px) {
5152 .numbers__item { 5152 .numbers__item {
5153 font-size: 16px; 5153 font-size: 16px;
5154 line-height: 20px; 5154 line-height: 20px;
5155 } 5155 }
5156 } 5156 }
5157 .numbers__item b { 5157 .numbers__item b {
5158 font-size: 40px; 5158 font-size: 40px;
5159 font-weight: 700; 5159 font-weight: 700;
5160 border-bottom: 1px solid #fff; 5160 border-bottom: 1px solid #fff;
5161 line-height: 1; 5161 line-height: 1;
5162 } 5162 }
5163 @media (min-width: 1280px) { 5163 @media (min-width: 1280px) {
5164 .numbers__item b { 5164 .numbers__item b {
5165 font-size: 100px; 5165 font-size: 100px;
5166 line-height: 147px; 5166 line-height: 147px;
5167 } 5167 }
5168 } 5168 }
5169 .numbers__item span { 5169 .numbers__item span {
5170 font-weight: 700; 5170 font-weight: 700;
5171 font-size: 14px; 5171 font-size: 14px;
5172 margin: 10px 0; 5172 margin: 10px 0;
5173 line-height: 1; 5173 line-height: 1;
5174 } 5174 }
5175 @media (min-width: 1280px) { 5175 @media (min-width: 1280px) {
5176 .numbers__item span { 5176 .numbers__item span {
5177 font-size: 24px; 5177 font-size: 24px;
5178 margin-top: 30px; 5178 margin-top: 30px;
5179 } 5179 }
5180 } 5180 }
5181 5181
5182 .vacancies { 5182 .vacancies {
5183 padding: 50px 0; 5183 padding: 50px 0;
5184 } 5184 }
5185 @media (min-width: 1280px) { 5185 @media (min-width: 1280px) {
5186 .vacancies { 5186 .vacancies {
5187 padding: 100px 0; 5187 padding: 100px 0;
5188 } 5188 }
5189 } 5189 }
5190 .vacancies__body { 5190 .vacancies__body {
5191 display: -webkit-box; 5191 display: -webkit-box;
5192 display: -ms-flexbox; 5192 display: -ms-flexbox;
5193 display: flex; 5193 display: flex;
5194 -webkit-box-orient: vertical; 5194 -webkit-box-orient: vertical;
5195 -webkit-box-direction: reverse; 5195 -webkit-box-direction: reverse;
5196 -ms-flex-direction: column-reverse; 5196 -ms-flex-direction: column-reverse;
5197 flex-direction: column-reverse; 5197 flex-direction: column-reverse;
5198 gap: 20px; 5198 gap: 20px;
5199 width: 100%; 5199 width: 100%;
5200 margin-top: 20px; 5200 margin-top: 20px;
5201 } 5201 }
5202 @media (min-width: 992px) { 5202 @media (min-width: 992px) {
5203 .vacancies__body { 5203 .vacancies__body {
5204 margin-top: 30px; 5204 margin-top: 30px;
5205 gap: 30px; 5205 gap: 30px;
5206 } 5206 }
5207 } 5207 }
5208 .vacancies__more { 5208 .vacancies__more {
5209 width: 100%; 5209 width: 100%;
5210 } 5210 }
5211 @media (min-width: 768px) { 5211 @media (min-width: 768px) {
5212 .vacancies__more { 5212 .vacancies__more {
5213 width: auto; 5213 width: auto;
5214 margin: 0 auto; 5214 margin: 0 auto;
5215 } 5215 }
5216 } 5216 }
5217 .vacancies__list { 5217 .vacancies__list {
5218 display: -webkit-box; 5218 display: -webkit-box;
5219 display: -ms-flexbox; 5219 display: -ms-flexbox;
5220 display: flex; 5220 display: flex;
5221 -webkit-box-orient: vertical; 5221 -webkit-box-orient: vertical;
5222 -webkit-box-direction: normal; 5222 -webkit-box-direction: normal;
5223 -ms-flex-direction: column; 5223 -ms-flex-direction: column;
5224 flex-direction: column; 5224 flex-direction: column;
5225 gap: 15px; 5225 gap: 15px;
5226 } 5226 }
5227 @media (min-width: 768px) { 5227 @media (min-width: 768px) {
5228 .vacancies__list { 5228 .vacancies__list {
5229 display: grid; 5229 display: grid;
5230 grid-template-columns: repeat(2, 1fr); 5230 grid-template-columns: repeat(2, 1fr);
5231 } 5231 }
5232 } 5232 }
5233 @media (min-width: 992px) { 5233 @media (min-width: 992px) {
5234 .vacancies__list { 5234 .vacancies__list {
5235 display: grid; 5235 display: grid;
5236 grid-template-columns: repeat(3, 1fr); 5236 grid-template-columns: repeat(3, 1fr);
5237 gap: 20px; 5237 gap: 20px;
5238 } 5238 }
5239 } 5239 }
5240 @media (min-width: 1280px) { 5240 @media (min-width: 1280px) {
5241 .vacancies__list { 5241 .vacancies__list {
5242 grid-template-columns: repeat(4, 1fr); 5242 grid-template-columns: repeat(4, 1fr);
5243 } 5243 }
5244 } 5244 }
5245 .vacancies__list-label { 5245 .vacancies__list-label {
5246 font-weight: 700; 5246 font-weight: 700;
5247 font-size: 22px; 5247 font-size: 22px;
5248 } 5248 }
5249 .vacancies__list-col { 5249 .vacancies__list-col {
5250 display: -webkit-box; 5250 display: -webkit-box;
5251 display: -ms-flexbox; 5251 display: -ms-flexbox;
5252 display: flex; 5252 display: flex;
5253 -webkit-box-orient: vertical; 5253 -webkit-box-orient: vertical;
5254 -webkit-box-direction: normal; 5254 -webkit-box-direction: normal;
5255 -ms-flex-direction: column; 5255 -ms-flex-direction: column;
5256 flex-direction: column; 5256 flex-direction: column;
5257 gap: 15px; 5257 gap: 15px;
5258 margin-top: 15px; 5258 margin-top: 15px;
5259 } 5259 }
5260 @media (min-width: 768px) { 5260 @media (min-width: 768px) {
5261 .vacancies__list-col { 5261 .vacancies__list-col {
5262 margin-top: 0; 5262 margin-top: 0;
5263 } 5263 }
5264 } 5264 }
5265 .vacancies__list-col:first-child { 5265 .vacancies__list-col:first-child {
5266 margin-top: 0; 5266 margin-top: 0;
5267 } 5267 }
5268 .vacancies__item { 5268 .vacancies__item {
5269 display: none; 5269 display: none;
5270 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 5270 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
5271 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 5271 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
5272 border-radius: 12px; 5272 border-radius: 12px;
5273 background: #fff; 5273 background: #fff;
5274 border: 1px solid #e6e7e7; 5274 border: 1px solid #e6e7e7;
5275 overflow: hidden; 5275 overflow: hidden;
5276 } 5276 }
5277 .vacancies__item:nth-of-type(1), .vacancies__item:nth-of-type(2), .vacancies__item:nth-of-type(3), .vacancies__item:nth-of-type(4), .vacancies__item:nth-of-type(5), .vacancies__item:nth-of-type(6), .vacancies__item:nth-of-type(7), .vacancies__item:nth-of-type(8) { 5277 .vacancies__item:nth-of-type(1), .vacancies__item:nth-of-type(2), .vacancies__item:nth-of-type(3), .vacancies__item:nth-of-type(4), .vacancies__item:nth-of-type(5), .vacancies__item:nth-of-type(6), .vacancies__item:nth-of-type(7), .vacancies__item:nth-of-type(8) {
5278 display: -webkit-box; 5278 display: -webkit-box;
5279 display: -ms-flexbox; 5279 display: -ms-flexbox;
5280 display: flex; 5280 display: flex;
5281 } 5281 }
5282 .vacancies__item > span { 5282 .vacancies__item > span {
5283 border-left: 10px solid #377d87; 5283 border-left: 10px solid #377d87;
5284 padding: 20px 14px; 5284 padding: 20px 14px;
5285 display: -webkit-box; 5285 display: -webkit-box;
5286 display: -ms-flexbox; 5286 display: -ms-flexbox;
5287 display: flex; 5287 display: flex;
5288 -webkit-box-orient: vertical; 5288 -webkit-box-orient: vertical;
5289 -webkit-box-direction: normal; 5289 -webkit-box-direction: normal;
5290 -ms-flex-direction: column; 5290 -ms-flex-direction: column;
5291 flex-direction: column; 5291 flex-direction: column;
5292 -webkit-box-align: start; 5292 -webkit-box-align: start;
5293 -ms-flex-align: start; 5293 -ms-flex-align: start;
5294 align-items: flex-start; 5294 align-items: flex-start;
5295 gap: 5px; 5295 gap: 5px;
5296 -webkit-box-pack: justify; 5296 -webkit-box-pack: justify;
5297 -ms-flex-pack: justify; 5297 -ms-flex-pack: justify;
5298 justify-content: space-between; 5298 justify-content: space-between;
5299 } 5299 }
5300 @media (min-width: 992px) { 5300 @media (min-width: 992px) {
5301 .vacancies__item > span { 5301 .vacancies__item > span {
5302 gap: 10px; 5302 gap: 10px;
5303 } 5303 }
5304 } 5304 }
5305 .vacancies__item b { 5305 .vacancies__item b {
5306 font-weight: 700; 5306 font-weight: 700;
5307 font-size: 14px; 5307 font-size: 14px;
5308 } 5308 }
5309 @media (min-width: 992px) { 5309 @media (min-width: 992px) {
5310 .vacancies__item b { 5310 .vacancies__item b {
5311 font-size: 20px; 5311 font-size: 20px;
5312 } 5312 }
5313 } 5313 }
5314 .vacancies__item:hover b { 5314 .vacancies__item:hover b {
5315 color: #377d87; 5315 color: #377d87;
5316 } 5316 }
5317 .vacancies__item u { 5317 .vacancies__item u {
5318 text-decoration: none; 5318 text-decoration: none;
5319 font-size: 14px; 5319 font-size: 14px;
5320 } 5320 }
5321 @media (min-width: 992px) { 5321 @media (min-width: 992px) {
5322 .vacancies__item u { 5322 .vacancies__item u {
5323 font-size: 18px; 5323 font-size: 18px;
5324 } 5324 }
5325 } 5325 }
5326 .vacancies__item i { 5326 .vacancies__item i {
5327 font-size: 12px; 5327 font-size: 12px;
5328 font-style: normal; 5328 font-style: normal;
5329 border-bottom: 1px dashed #377d87; 5329 border-bottom: 1px dashed #377d87;
5330 } 5330 }
5331 @media (min-width: 992px) { 5331 @media (min-width: 992px) {
5332 .vacancies__item i { 5332 .vacancies__item i {
5333 font-size: 16px; 5333 font-size: 16px;
5334 } 5334 }
5335 } 5335 }
5336 .vacancies__item i span { 5336 .vacancies__item i span {
5337 font-weight: 700; 5337 font-weight: 700;
5338 color: #377d87; 5338 color: #377d87;
5339 } 5339 }
5340 .vacancies__body.active .vacancies__list .vacancies__item { 5340 .vacancies__body.active .vacancies__list .vacancies__item {
5341 display: -webkit-box; 5341 display: -webkit-box;
5342 display: -ms-flexbox; 5342 display: -ms-flexbox;
5343 display: flex; 5343 display: flex;
5344 } 5344 }
5345 5345
5346 .employer { 5346 .employer {
5347 padding-bottom: 50px; 5347 padding-bottom: 50px;
5348 } 5348 }
5349 @media (min-width: 768px) { 5349 @media (min-width: 768px) {
5350 .employer { 5350 .employer {
5351 padding-bottom: 100px; 5351 padding-bottom: 100px;
5352 } 5352 }
5353 } 5353 }
5354 .employer .swiper { 5354 .employer .swiper {
5355 margin: 20px 0; 5355 margin: 20px 0;
5356 } 5356 }
5357 @media (min-width: 768px) { 5357 @media (min-width: 768px) {
5358 .employer .swiper { 5358 .employer .swiper {
5359 display: none; 5359 display: none;
5360 } 5360 }
5361 } 5361 }
5362 .employer__item { 5362 .employer__item {
5363 display: -webkit-box; 5363 display: -webkit-box;
5364 display: -ms-flexbox; 5364 display: -ms-flexbox;
5365 display: flex; 5365 display: flex;
5366 -webkit-box-orient: vertical; 5366 -webkit-box-orient: vertical;
5367 -webkit-box-direction: normal; 5367 -webkit-box-direction: normal;
5368 -ms-flex-direction: column; 5368 -ms-flex-direction: column;
5369 flex-direction: column; 5369 flex-direction: column;
5370 gap: 30px; 5370 gap: 30px;
5371 } 5371 }
5372 .employer__item a { 5372 .employer__item a {
5373 display: -webkit-box; 5373 display: -webkit-box;
5374 display: -ms-flexbox; 5374 display: -ms-flexbox;
5375 display: flex; 5375 display: flex;
5376 -webkit-box-orient: vertical; 5376 -webkit-box-orient: vertical;
5377 -webkit-box-direction: normal; 5377 -webkit-box-direction: normal;
5378 -ms-flex-direction: column; 5378 -ms-flex-direction: column;
5379 flex-direction: column; 5379 flex-direction: column;
5380 -webkit-box-align: center; 5380 -webkit-box-align: center;
5381 -ms-flex-align: center; 5381 -ms-flex-align: center;
5382 align-items: center; 5382 align-items: center;
5383 } 5383 }
5384 .employer__item img { 5384 .employer__item img {
5385 width: 100%; 5385 width: 100%;
5386 aspect-ratio: 295/98; 5386 aspect-ratio: 295/98;
5387 -o-object-fit: contain; 5387 -o-object-fit: contain;
5388 object-fit: contain; 5388 object-fit: contain;
5389 } 5389 }
5390 .employer__body { 5390 .employer__body {
5391 display: none; 5391 display: none;
5392 grid-template-columns: 1fr 1fr; 5392 grid-template-columns: 1fr 1fr;
5393 gap: 30px; 5393 gap: 30px;
5394 margin-top: 30px; 5394 margin-top: 30px;
5395 margin-bottom: 40px; 5395 margin-bottom: 40px;
5396 } 5396 }
5397 @media (min-width: 768px) { 5397 @media (min-width: 768px) {
5398 .employer__body { 5398 .employer__body {
5399 display: grid; 5399 display: grid;
5400 } 5400 }
5401 } 5401 }
5402 @media (min-width: 992px) { 5402 @media (min-width: 992px) {
5403 .employer__body { 5403 .employer__body {
5404 grid-template-columns: 1fr 1fr 1fr; 5404 grid-template-columns: 1fr 1fr 1fr;
5405 } 5405 }
5406 } 5406 }
5407 @media (min-width: 1280px) { 5407 @media (min-width: 1280px) {
5408 .employer__body { 5408 .employer__body {
5409 grid-template-columns: 1fr 1fr 1fr 1fr; 5409 grid-template-columns: 1fr 1fr 1fr 1fr;
5410 } 5410 }
5411 } 5411 }
5412 .employer__body a { 5412 .employer__body a {
5413 display: -webkit-box; 5413 display: -webkit-box;
5414 display: -ms-flexbox; 5414 display: -ms-flexbox;
5415 display: flex; 5415 display: flex;
5416 -webkit-box-pack: center; 5416 -webkit-box-pack: center;
5417 -ms-flex-pack: center; 5417 -ms-flex-pack: center;
5418 justify-content: center; 5418 justify-content: center;
5419 -webkit-box-align: center; 5419 -webkit-box-align: center;
5420 -ms-flex-align: center; 5420 -ms-flex-align: center;
5421 align-items: center; 5421 align-items: center;
5422 height: 98px; 5422 height: 98px;
5423 } 5423 }
5424 .employer__body img { 5424 .employer__body img {
5425 max-width: 100%; 5425 max-width: 100%;
5426 max-height: 98px; 5426 max-height: 98px;
5427 -o-object-fit: contain; 5427 -o-object-fit: contain;
5428 object-fit: contain; 5428 object-fit: contain;
5429 } 5429 }
5430 .employer__more { 5430 .employer__more {
5431 height: 38px; 5431 height: 38px;
5432 } 5432 }
5433 @media (min-width: 768px) { 5433 @media (min-width: 768px) {
5434 .employer__more { 5434 .employer__more {
5435 width: 250px; 5435 width: 250px;
5436 margin: 0 auto; 5436 margin: 0 auto;
5437 height: 44px; 5437 height: 44px;
5438 } 5438 }
5439 } 5439 }
5440 5440
5441 .about { 5441 .about {
5442 background: #acc0e6 url("../images/space.svg") no-repeat 0 0; 5442 background: #acc0e6 url("../images/space.svg") no-repeat 0 0;
5443 background-size: cover; 5443 background-size: cover;
5444 padding: 30px 0; 5444 padding: 30px 0;
5445 padding-bottom: 70px; 5445 padding-bottom: 70px;
5446 } 5446 }
5447 @media (min-width: 768px) { 5447 @media (min-width: 768px) {
5448 .about { 5448 .about {
5449 padding-top: 40px; 5449 padding-top: 40px;
5450 background-size: auto calc(100% - 10px); 5450 background-size: auto calc(100% - 10px);
5451 } 5451 }
5452 } 5452 }
5453 @media (min-width: 1280px) { 5453 @media (min-width: 1280px) {
5454 .about { 5454 .about {
5455 padding: 100px 0; 5455 padding: 100px 0;
5456 } 5456 }
5457 } 5457 }
5458 .about__wrapper { 5458 .about__wrapper {
5459 display: -webkit-box; 5459 display: -webkit-box;
5460 display: -ms-flexbox; 5460 display: -ms-flexbox;
5461 display: flex; 5461 display: flex;
5462 -webkit-box-orient: vertical; 5462 -webkit-box-orient: vertical;
5463 -webkit-box-direction: normal; 5463 -webkit-box-direction: normal;
5464 -ms-flex-direction: column; 5464 -ms-flex-direction: column;
5465 flex-direction: column; 5465 flex-direction: column;
5466 position: relative; 5466 position: relative;
5467 } 5467 }
5468 .about__title { 5468 .about__title {
5469 color: #fff; 5469 color: #fff;
5470 line-height: 1.2; 5470 line-height: 1.2;
5471 } 5471 }
5472 @media (min-width: 1280px) { 5472 @media (min-width: 1280px) {
5473 .about__title { 5473 .about__title {
5474 position: absolute; 5474 position: absolute;
5475 top: -45px; 5475 top: -45px;
5476 left: 0; 5476 left: 0;
5477 } 5477 }
5478 } 5478 }
5479 .about__body { 5479 .about__body {
5480 display: -webkit-box; 5480 display: -webkit-box;
5481 display: -ms-flexbox; 5481 display: -ms-flexbox;
5482 display: flex; 5482 display: flex;
5483 -webkit-box-orient: vertical; 5483 -webkit-box-orient: vertical;
5484 -webkit-box-direction: normal; 5484 -webkit-box-direction: normal;
5485 -ms-flex-direction: column; 5485 -ms-flex-direction: column;
5486 flex-direction: column; 5486 flex-direction: column;
5487 } 5487 }
5488 @media (min-width: 1280px) { 5488 @media (min-width: 1280px) {
5489 .about__body { 5489 .about__body {
5490 padding-left: 495px; 5490 padding-left: 495px;
5491 } 5491 }
5492 } 5492 }
5493 .about__line { 5493 .about__line {
5494 background: #fff; 5494 background: #fff;
5495 width: 100%; 5495 width: 100%;
5496 height: 1px; 5496 height: 1px;
5497 max-width: 400px; 5497 max-width: 400px;
5498 margin-top: 10px; 5498 margin-top: 10px;
5499 } 5499 }
5500 .about__item { 5500 .about__item {
5501 display: -webkit-box; 5501 display: -webkit-box;
5502 display: -ms-flexbox; 5502 display: -ms-flexbox;
5503 display: flex; 5503 display: flex;
5504 -webkit-box-orient: vertical; 5504 -webkit-box-orient: vertical;
5505 -webkit-box-direction: normal; 5505 -webkit-box-direction: normal;
5506 -ms-flex-direction: column; 5506 -ms-flex-direction: column;
5507 flex-direction: column; 5507 flex-direction: column;
5508 margin-top: 10px; 5508 margin-top: 10px;
5509 max-width: 600px; 5509 max-width: 600px;
5510 } 5510 }
5511 @media (min-width: 768px) { 5511 @media (min-width: 768px) {
5512 .about__item { 5512 .about__item {
5513 margin-top: 20px; 5513 margin-top: 20px;
5514 } 5514 }
5515 } 5515 }
5516 @media (min-width: 1280px) { 5516 @media (min-width: 1280px) {
5517 .about__item { 5517 .about__item {
5518 margin-top: 30px; 5518 margin-top: 30px;
5519 } 5519 }
5520 } 5520 }
5521 .about__item b { 5521 .about__item b {
5522 font-size: 20px; 5522 font-size: 20px;
5523 font-weight: 700; 5523 font-weight: 700;
5524 } 5524 }
5525 .about__item span { 5525 .about__item span {
5526 font-size: 13px; 5526 font-size: 13px;
5527 line-height: 1.4; 5527 line-height: 1.4;
5528 margin-top: 6px; 5528 margin-top: 6px;
5529 } 5529 }
5530 @media (min-width: 1280px) { 5530 @media (min-width: 1280px) {
5531 .about__item span { 5531 .about__item span {
5532 font-size: 16px; 5532 font-size: 16px;
5533 margin-top: 12px; 5533 margin-top: 12px;
5534 } 5534 }
5535 } 5535 }
5536 .about__item a { 5536 .about__item a {
5537 text-decoration: underline; 5537 text-decoration: underline;
5538 } 5538 }
5539 .about__item + .about__item { 5539 .about__item + .about__item {
5540 margin-top: 30px; 5540 margin-top: 30px;
5541 } 5541 }
5542 @media (min-width: 992px) { 5542 @media (min-width: 992px) {
5543 .about__item + .about__item { 5543 .about__item + .about__item {
5544 margin-top: 40px; 5544 margin-top: 40px;
5545 } 5545 }
5546 } 5546 }
5547 .about__button { 5547 .about__button {
5548 margin-top: 20px; 5548 margin-top: 20px;
5549 height: 38px; 5549 height: 38px;
5550 padding: 0; 5550 padding: 0;
5551 } 5551 }
5552 @media (min-width: 768px) { 5552 @media (min-width: 768px) {
5553 .about__button { 5553 .about__button {
5554 max-width: 200px; 5554 max-width: 200px;
5555 height: 42px; 5555 height: 42px;
5556 margin-top: 30px; 5556 margin-top: 30px;
5557 } 5557 }
5558 } 5558 }
5559 5559
5560 .news { 5560 .news {
5561 padding: 50px 0; 5561 padding: 50px 0;
5562 overflow: hidden; 5562 overflow: hidden;
5563 } 5563 }
5564 @media (min-width: 1280px) { 5564 @media (min-width: 1280px) {
5565 .news { 5565 .news {
5566 padding: 100px 0; 5566 padding: 100px 0;
5567 padding-bottom: 0; 5567 padding-bottom: 0;
5568 } 5568 }
5569 } 5569 }
5570 .news__toper { 5570 .news__toper {
5571 display: -webkit-box; 5571 display: -webkit-box;
5572 display: -ms-flexbox; 5572 display: -ms-flexbox;
5573 display: flex; 5573 display: flex;
5574 -webkit-box-pack: justify; 5574 -webkit-box-pack: justify;
5575 -ms-flex-pack: justify; 5575 -ms-flex-pack: justify;
5576 justify-content: space-between; 5576 justify-content: space-between;
5577 -webkit-box-align: center; 5577 -webkit-box-align: center;
5578 -ms-flex-align: center; 5578 -ms-flex-align: center;
5579 align-items: center; 5579 align-items: center;
5580 } 5580 }
5581 @media (min-width: 1280px) { 5581 @media (min-width: 1280px) {
5582 .news__toper .title { 5582 .news__toper .title {
5583 width: calc(100% - 160px); 5583 width: calc(100% - 160px);
5584 } 5584 }
5585 } 5585 }
5586 .news__toper .navs { 5586 .news__toper .navs {
5587 display: none; 5587 display: none;
5588 } 5588 }
5589 @media (min-width: 1280px) { 5589 @media (min-width: 1280px) {
5590 .news__toper .navs { 5590 .news__toper .navs {
5591 display: -webkit-box; 5591 display: -webkit-box;
5592 display: -ms-flexbox; 5592 display: -ms-flexbox;
5593 display: flex; 5593 display: flex;
5594 } 5594 }
5595 } 5595 }
5596 .news .swiper { 5596 .news .swiper {
5597 margin-top: 20px; 5597 margin-top: 20px;
5598 } 5598 }
5599 @media (min-width: 768px) { 5599 @media (min-width: 768px) {
5600 .news .swiper { 5600 .news .swiper {
5601 overflow: visible; 5601 overflow: visible;
5602 } 5602 }
5603 } 5603 }
5604 @media (min-width: 992px) { 5604 @media (min-width: 992px) {
5605 .news .swiper { 5605 .news .swiper {
5606 margin-top: 40px; 5606 margin-top: 40px;
5607 } 5607 }
5608 } 5608 }
5609 .news__item { 5609 .news__item {
5610 display: -webkit-box; 5610 display: -webkit-box;
5611 display: -ms-flexbox; 5611 display: -ms-flexbox;
5612 display: flex; 5612 display: flex;
5613 -webkit-box-orient: vertical; 5613 -webkit-box-orient: vertical;
5614 -webkit-box-direction: normal; 5614 -webkit-box-direction: normal;
5615 -ms-flex-direction: column; 5615 -ms-flex-direction: column;
5616 flex-direction: column; 5616 flex-direction: column;
5617 line-height: 1.4; 5617 line-height: 1.4;
5618 } 5618 }
5619 .news__item-pic { 5619 .news__item-pic {
5620 width: 100%; 5620 width: 100%;
5621 aspect-ratio: 3/2; 5621 aspect-ratio: 3/2;
5622 border-radius: 12px; 5622 border-radius: 12px;
5623 border: 1px solid #e6e7e7; 5623 border: 1px solid #e6e7e7;
5624 -o-object-fit: cover; 5624 -o-object-fit: cover;
5625 object-fit: cover; 5625 object-fit: cover;
5626 min-height: 200px; 5626 min-height: 200px;
5627 } 5627 }
5628 @media (min-width: 1280px) { 5628 @media (min-width: 1280px) {
5629 .news__item-pic { 5629 .news__item-pic {
5630 aspect-ratio: 4/2; 5630 aspect-ratio: 4/2;
5631 } 5631 }
5632 } 5632 }
5633 .news__item-body { 5633 .news__item-body {
5634 display: -webkit-box; 5634 display: -webkit-box;
5635 display: -ms-flexbox; 5635 display: -ms-flexbox;
5636 display: flex; 5636 display: flex;
5637 -webkit-box-orient: vertical; 5637 -webkit-box-orient: vertical;
5638 -webkit-box-direction: normal; 5638 -webkit-box-direction: normal;
5639 -ms-flex-direction: column; 5639 -ms-flex-direction: column;
5640 flex-direction: column; 5640 flex-direction: column;
5641 padding-top: 15px; 5641 padding-top: 15px;
5642 } 5642 }
5643 @media (min-width: 768px) { 5643 @media (min-width: 768px) {
5644 .news__item-body { 5644 .news__item-body {
5645 padding: 20px; 5645 padding: 20px;
5646 padding-top: 30px; 5646 padding-top: 30px;
5647 margin-top: -15px; 5647 margin-top: -15px;
5648 border-radius: 0 0 12px 12px; 5648 border-radius: 0 0 12px 12px;
5649 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15); 5649 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
5650 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15); 5650 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
5651 } 5651 }
5652 } 5652 }
5653 .news__item-date { 5653 .news__item-date {
5654 font-size: 14px; 5654 font-size: 14px;
5655 font-weight: 700; 5655 font-weight: 700;
5656 color: #377d87; 5656 color: #377d87;
5657 } 5657 }
5658 .news__item-title { 5658 .news__item-title {
5659 font-size: 20px; 5659 font-size: 20px;
5660 font-weight: 700; 5660 font-weight: 700;
5661 line-height: 1.2; 5661 line-height: 1.2;
5662 margin-top: 5px; 5662 margin-top: 5px;
5663 } 5663 }
5664 .news__item-text { 5664 .news__item-text {
5665 color: #000; 5665 color: #000;
5666 font-size: 13px; 5666 font-size: 13px;
5667 margin-top: 10px; 5667 margin-top: 10px;
5668 overflow: hidden; 5668 overflow: hidden;
5669 display: -webkit-box; 5669 display: -webkit-box;
5670 -webkit-box-orient: vertical; 5670 -webkit-box-orient: vertical;
5671 -webkit-line-clamp: 4; 5671 -webkit-line-clamp: 4;
5672 } 5672 }
5673 @media (min-width: 1280px) { 5673 @media (min-width: 1280px) {
5674 .news__item-text { 5674 .news__item-text {
5675 font-size: 16px; 5675 font-size: 16px;
5676 } 5676 }
5677 } 5677 }
5678 .news__item-more { 5678 .news__item-more {
5679 height: 42px; 5679 height: 42px;
5680 margin-top: 20px; 5680 margin-top: 20px;
5681 } 5681 }
5682 @media (min-width: 1280px) { 5682 @media (min-width: 1280px) {
5683 .news__item-more { 5683 .news__item-more {
5684 height: 44px; 5684 height: 44px;
5685 max-width: 190px; 5685 max-width: 190px;
5686 } 5686 }
5687 } 5687 }
5688 .news__all { 5688 .news__all {
5689 height: 42px; 5689 height: 42px;
5690 margin: 0 auto; 5690 margin: 0 auto;
5691 margin-top: 20px; 5691 margin-top: 20px;
5692 padding: 0; 5692 padding: 0;
5693 display: none; 5693 display: none;
5694 } 5694 }
5695 @media (min-width: 768px) { 5695 @media (min-width: 768px) {
5696 .news__all { 5696 .news__all {
5697 max-width: 170px; 5697 max-width: 170px;
5698 margin-top: 30px; 5698 margin-top: 30px;
5699 display: -webkit-box; 5699 display: -webkit-box;
5700 display: -ms-flexbox; 5700 display: -ms-flexbox;
5701 display: flex; 5701 display: flex;
5702 } 5702 }
5703 } 5703 }
5704 @media (min-width: 1280px) { 5704 @media (min-width: 1280px) {
5705 .news__all { 5705 .news__all {
5706 height: 44px; 5706 height: 44px;
5707 } 5707 }
5708 } 5708 }
5709 .news__items { 5709 .news__items {
5710 display: grid; 5710 display: grid;
5711 gap: 20px; 5711 gap: 20px;
5712 margin-bottom: 10px; 5712 margin-bottom: 10px;
5713 } 5713 }
5714 @media (min-width: 768px) { 5714 @media (min-width: 768px) {
5715 .news__items { 5715 .news__items {
5716 grid-template-columns: 1fr 1fr; 5716 grid-template-columns: 1fr 1fr;
5717 } 5717 }
5718 } 5718 }
5719 @media (min-width: 992px) { 5719 @media (min-width: 992px) {
5720 .news__items { 5720 .news__items {
5721 grid-template-columns: 1fr 1fr 1fr; 5721 grid-template-columns: 1fr 1fr 1fr;
5722 } 5722 }
5723 } 5723 }
5724 5724
5725 main + .news { 5725 main + .news {
5726 padding: 0; 5726 padding: 0;
5727 } 5727 }
5728 5728
5729 .info { 5729 .info {
5730 position: relative; 5730 position: relative;
5731 overflow: hidden; 5731 overflow: hidden;
5732 } 5732 }
5733 @media (min-width: 1280px) { 5733 @media (min-width: 1280px) {
5734 .info { 5734 .info {
5735 margin-bottom: -25px; 5735 margin-bottom: -25px;
5736 } 5736 }
5737 } 5737 }
5738 .info__pic { 5738 .info__pic {
5739 display: none; 5739 display: none;
5740 z-index: 1; 5740 z-index: 1;
5741 position: absolute; 5741 position: absolute;
5742 top: 0; 5742 top: 0;
5743 left: 50%; 5743 left: 50%;
5744 height: 100%; 5744 height: 100%;
5745 margin-left: 130px; 5745 margin-left: 130px;
5746 } 5746 }
5747 @media (min-width: 992px) { 5747 @media (min-width: 992px) {
5748 .info__pic { 5748 .info__pic {
5749 display: block; 5749 display: block;
5750 } 5750 }
5751 } 5751 }
5752 @media (min-width: 1280px) { 5752 @media (min-width: 1280px) {
5753 .info__pic { 5753 .info__pic {
5754 width: 610px; 5754 width: 610px;
5755 height: auto; 5755 height: auto;
5756 margin-left: 10px; 5756 margin-left: 10px;
5757 } 5757 }
5758 } 5758 }
5759 .info__body { 5759 .info__body {
5760 z-index: 2; 5760 z-index: 2;
5761 position: relative; 5761 position: relative;
5762 display: -webkit-box; 5762 display: -webkit-box;
5763 display: -ms-flexbox; 5763 display: -ms-flexbox;
5764 display: flex; 5764 display: flex;
5765 -webkit-box-orient: vertical; 5765 -webkit-box-orient: vertical;
5766 -webkit-box-direction: normal; 5766 -webkit-box-direction: normal;
5767 -ms-flex-direction: column; 5767 -ms-flex-direction: column;
5768 flex-direction: column; 5768 flex-direction: column;
5769 } 5769 }
5770 @media (min-width: 1280px) { 5770 @media (min-width: 1280px) {
5771 .info__body { 5771 .info__body {
5772 padding-top: 100px; 5772 padding-top: 100px;
5773 min-height: 600px; 5773 min-height: 600px;
5774 } 5774 }
5775 } 5775 }
5776 @media (min-width: 1280px) { 5776 @media (min-width: 1280px) {
5777 .info__title { 5777 .info__title {
5778 max-width: 520px; 5778 max-width: 520px;
5779 line-height: 1; 5779 line-height: 1;
5780 } 5780 }
5781 } 5781 }
5782 .info__item { 5782 .info__item {
5783 margin-top: 20px; 5783 margin-top: 20px;
5784 display: -webkit-box; 5784 display: -webkit-box;
5785 display: -ms-flexbox; 5785 display: -ms-flexbox;
5786 display: flex; 5786 display: flex;
5787 -webkit-box-orient: vertical; 5787 -webkit-box-orient: vertical;
5788 -webkit-box-direction: normal; 5788 -webkit-box-direction: normal;
5789 -ms-flex-direction: column; 5789 -ms-flex-direction: column;
5790 flex-direction: column; 5790 flex-direction: column;
5791 gap: 20px; 5791 gap: 20px;
5792 } 5792 }
5793 @media (min-width: 992px) { 5793 @media (min-width: 992px) {
5794 .info__item { 5794 .info__item {
5795 max-width: 610px; 5795 max-width: 610px;
5796 } 5796 }
5797 } 5797 }
5798 .info__item + .info__item { 5798 .info__item + .info__item {
5799 margin-top: 60px; 5799 margin-top: 60px;
5800 } 5800 }
5801 .info__text { 5801 .info__text {
5802 color: #000; 5802 color: #000;
5803 font-size: 13px; 5803 font-size: 13px;
5804 line-height: 1.4; 5804 line-height: 1.4;
5805 } 5805 }
5806 @media (min-width: 768px) { 5806 @media (min-width: 768px) {
5807 .info__text { 5807 .info__text {
5808 font-size: 16px; 5808 font-size: 16px;
5809 } 5809 }
5810 } 5810 }
5811 @media (min-width: 1280px) { 5811 @media (min-width: 1280px) {
5812 .info__text { 5812 .info__text {
5813 font-size: 18px; 5813 font-size: 18px;
5814 } 5814 }
5815 } 5815 }
5816 .info__link { 5816 .info__link {
5817 border-radius: 8px; 5817 border-radius: 8px;
5818 display: -webkit-box; 5818 display: -webkit-box;
5819 display: -ms-flexbox; 5819 display: -ms-flexbox;
5820 display: flex; 5820 display: flex;
5821 -webkit-box-pack: center; 5821 -webkit-box-pack: center;
5822 -ms-flex-pack: center; 5822 -ms-flex-pack: center;
5823 justify-content: center; 5823 justify-content: center;
5824 -webkit-box-align: center; 5824 -webkit-box-align: center;
5825 -ms-flex-align: center; 5825 -ms-flex-align: center;
5826 align-items: center; 5826 align-items: center;
5827 line-height: 1; 5827 line-height: 1;
5828 height: 40px; 5828 height: 40px;
5829 font-size: 12px; 5829 font-size: 12px;
5830 font-weight: 700; 5830 font-weight: 700;
5831 gap: 8px; 5831 gap: 8px;
5832 color: #fff; 5832 color: #fff;
5833 background: #377d87; 5833 background: #377d87;
5834 } 5834 }
5835 .info__link:hover { 5835 .info__link:hover {
5836 -webkit-filter: grayscale(50%); 5836 -webkit-filter: grayscale(50%);
5837 filter: grayscale(50%); 5837 filter: grayscale(50%);
5838 } 5838 }
5839 @media (min-width: 768px) { 5839 @media (min-width: 768px) {
5840 .info__link { 5840 .info__link {
5841 height: 44px; 5841 height: 44px;
5842 font-size: 16px; 5842 font-size: 16px;
5843 gap: 10px; 5843 gap: 10px;
5844 max-width: 300px; 5844 max-width: 300px;
5845 } 5845 }
5846 } 5846 }
5847 @media (min-width: 992px) { 5847 @media (min-width: 992px) {
5848 .info__link { 5848 .info__link {
5849 max-width: 210px; 5849 max-width: 210px;
5850 } 5850 }
5851 } 5851 }
5852 .info__link svg { 5852 .info__link svg {
5853 width: 16px; 5853 width: 16px;
5854 height: 16px; 5854 height: 16px;
5855 } 5855 }
5856 @media (min-width: 768px) { 5856 @media (min-width: 768px) {
5857 .info__link svg { 5857 .info__link svg {
5858 width: 20px; 5858 width: 20px;
5859 height: 20px; 5859 height: 20px;
5860 } 5860 }
5861 } 5861 }
5862 5862
5863 .thing { 5863 .thing {
5864 padding-top: 15px; 5864 padding-top: 15px;
5865 padding-bottom: 30px; 5865 padding-bottom: 30px;
5866 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 5866 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
5867 color: #000; 5867 color: #000;
5868 overflow: hidden; 5868 overflow: hidden;
5869 position: relative; 5869 position: relative;
5870 } 5870 }
5871 @media (min-width: 992px) { 5871 @media (min-width: 992px) {
5872 .thing { 5872 .thing {
5873 padding-top: 20px; 5873 padding-top: 20px;
5874 padding-bottom: 60px; 5874 padding-bottom: 60px;
5875 } 5875 }
5876 } 5876 }
5877 @media (min-width: 1280px) { 5877 @media (min-width: 1280px) {
5878 .thing { 5878 .thing {
5879 padding-bottom: 90px; 5879 padding-bottom: 90px;
5880 } 5880 }
5881 } 5881 }
5882 .thing_pdf { 5882 .thing_pdf {
5883 padding: 30px 0; 5883 padding: 30px 0;
5884 } 5884 }
5885 @media (min-width: 992px) { 5885 @media (min-width: 992px) {
5886 .thing_pdf { 5886 .thing_pdf {
5887 padding: 60px 0; 5887 padding: 60px 0;
5888 } 5888 }
5889 } 5889 }
5890 @media (min-width: 1280px) { 5890 @media (min-width: 1280px) {
5891 .thing_pdf { 5891 .thing_pdf {
5892 padding: 90px 0; 5892 padding: 90px 0;
5893 } 5893 }
5894 } 5894 }
5895 .thing__body { 5895 .thing__body {
5896 display: -webkit-box; 5896 display: -webkit-box;
5897 display: -ms-flexbox; 5897 display: -ms-flexbox;
5898 display: flex; 5898 display: flex;
5899 -webkit-box-orient: vertical; 5899 -webkit-box-orient: vertical;
5900 -webkit-box-direction: normal; 5900 -webkit-box-direction: normal;
5901 -ms-flex-direction: column; 5901 -ms-flex-direction: column;
5902 flex-direction: column; 5902 flex-direction: column;
5903 -webkit-box-align: start; 5903 -webkit-box-align: start;
5904 -ms-flex-align: start; 5904 -ms-flex-align: start;
5905 align-items: flex-start; 5905 align-items: flex-start;
5906 } 5906 }
5907 .thing__breadcrumbs { 5907 .thing__breadcrumbs {
5908 width: 100%; 5908 width: 100%;
5909 margin-bottom: 40px; 5909 margin-bottom: 40px;
5910 position: relative; 5910 position: relative;
5911 z-index: 2; 5911 z-index: 2;
5912 } 5912 }
5913 @media (min-width: 768px) { 5913 @media (min-width: 768px) {
5914 .thing__breadcrumbs { 5914 .thing__breadcrumbs {
5915 margin-bottom: 60px; 5915 margin-bottom: 60px;
5916 } 5916 }
5917 } 5917 }
5918 .thing__date { 5918 .thing__date {
5919 color: #000; 5919 color: #000;
5920 font-size: 14px; 5920 font-size: 14px;
5921 font-weight: 700; 5921 font-weight: 700;
5922 line-height: 21px; 5922 line-height: 21px;
5923 margin-bottom: 10px; 5923 margin-bottom: 10px;
5924 } 5924 }
5925 @media (min-width: 768px) { 5925 @media (min-width: 768px) {
5926 .thing__date { 5926 .thing__date {
5927 font-size: 18px; 5927 font-size: 18px;
5928 line-height: 27px; 5928 line-height: 27px;
5929 } 5929 }
5930 } 5930 }
5931 .thing__title { 5931 .thing__title {
5932 width: 100%; 5932 width: 100%;
5933 font-size: 32px; 5933 font-size: 32px;
5934 font-weight: 700; 5934 font-weight: 700;
5935 margin: 0; 5935 margin: 0;
5936 max-width: 780px; 5936 max-width: 780px;
5937 position: relative; 5937 position: relative;
5938 z-index: 2; 5938 z-index: 2;
5939 line-height: 1.1; 5939 line-height: 1.1;
5940 } 5940 }
5941 @media (min-width: 768px) { 5941 @media (min-width: 768px) {
5942 .thing__title { 5942 .thing__title {
5943 font-size: 40px; 5943 font-size: 40px;
5944 } 5944 }
5945 } 5945 }
5946 @media (min-width: 1280px) { 5946 @media (min-width: 1280px) {
5947 .thing__title { 5947 .thing__title {
5948 font-size: 64px; 5948 font-size: 64px;
5949 } 5949 }
5950 } 5950 }
5951 .thing__text { 5951 .thing__text {
5952 width: 100%; 5952 width: 100%;
5953 font-weight: 700; 5953 font-weight: 700;
5954 font-size: 14px; 5954 font-size: 14px;
5955 line-height: 1.4; 5955 line-height: 1.4;
5956 margin: 15px 0 0 0; 5956 margin: 15px 0 0 0;
5957 max-width: 780px; 5957 max-width: 780px;
5958 position: relative; 5958 position: relative;
5959 z-index: 2; 5959 z-index: 2;
5960 } 5960 }
5961 @media (min-width: 768px) { 5961 @media (min-width: 768px) {
5962 .thing__text { 5962 .thing__text {
5963 margin-top: 15px; 5963 margin-top: 15px;
5964 } 5964 }
5965 } 5965 }
5966 @media (min-width: 992px) { 5966 @media (min-width: 992px) {
5967 .thing__text { 5967 .thing__text {
5968 font-weight: 400; 5968 font-weight: 400;
5969 font-size: 18px; 5969 font-size: 18px;
5970 } 5970 }
5971 } 5971 }
5972 .thing__search { 5972 .thing__search {
5973 width: 100%; 5973 width: 100%;
5974 max-width: 640px; 5974 max-width: 640px;
5975 margin-top: 20px; 5975 margin-top: 20px;
5976 position: relative; 5976 position: relative;
5977 z-index: 2; 5977 z-index: 2;
5978 } 5978 }
5979 @media (min-width: 768px) { 5979 @media (min-width: 768px) {
5980 .thing__search { 5980 .thing__search {
5981 margin-top: 30px; 5981 margin-top: 30px;
5982 } 5982 }
5983 } 5983 }
5984 .thing__badge { 5984 .thing__badge {
5985 position: relative; 5985 position: relative;
5986 z-index: 2; 5986 z-index: 2;
5987 display: -webkit-box; 5987 display: -webkit-box;
5988 display: -ms-flexbox; 5988 display: -ms-flexbox;
5989 display: flex; 5989 display: flex;
5990 -webkit-box-align: center; 5990 -webkit-box-align: center;
5991 -ms-flex-align: center; 5991 -ms-flex-align: center;
5992 align-items: center; 5992 align-items: center;
5993 gap: 5px; 5993 gap: 5px;
5994 padding: 0 12px; 5994 padding: 0 12px;
5995 background: #4d88d9; 5995 background: #4d88d9;
5996 color: #fff; 5996 color: #fff;
5997 font-size: 12px; 5997 font-size: 12px;
5998 line-height: 1; 5998 line-height: 1;
5999 height: 26px; 5999 height: 26px;
6000 border-radius: 999px; 6000 border-radius: 999px;
6001 margin-bottom: 20px; 6001 margin-bottom: 20px;
6002 } 6002 }
6003 @media (min-width: 992px) { 6003 @media (min-width: 992px) {
6004 .thing__badge { 6004 .thing__badge {
6005 font-size: 16px; 6005 font-size: 16px;
6006 gap: 10px; 6006 gap: 10px;
6007 padding: 0 24px; 6007 padding: 0 24px;
6008 height: 42px; 6008 height: 42px;
6009 margin-bottom: 30px; 6009 margin-bottom: 30px;
6010 } 6010 }
6011 } 6011 }
6012 .thing__badge svg { 6012 .thing__badge svg {
6013 width: 12px; 6013 width: 12px;
6014 height: 12px; 6014 height: 12px;
6015 } 6015 }
6016 @media (min-width: 992px) { 6016 @media (min-width: 992px) {
6017 .thing__badge svg { 6017 .thing__badge svg {
6018 width: 20px; 6018 width: 20px;
6019 height: 20px; 6019 height: 20px;
6020 } 6020 }
6021 } 6021 }
6022 .thing__pic { 6022 .thing__pic {
6023 width: 60px; 6023 width: 60px;
6024 aspect-ratio: 1/1; 6024 aspect-ratio: 1/1;
6025 -o-object-fit: contain; 6025 -o-object-fit: contain;
6026 object-fit: contain; 6026 object-fit: contain;
6027 position: relative; 6027 position: relative;
6028 z-index: 1; 6028 z-index: 1;
6029 margin-bottom: 15px; 6029 margin-bottom: 15px;
6030 } 6030 }
6031 @media (min-width: 768px) { 6031 @media (min-width: 768px) {
6032 .thing__pic { 6032 .thing__pic {
6033 width: 160px; 6033 width: 160px;
6034 position: absolute; 6034 position: absolute;
6035 top: 15px; 6035 top: 15px;
6036 right: 20px; 6036 right: 20px;
6037 } 6037 }
6038 } 6038 }
6039 @media (min-width: 992px) { 6039 @media (min-width: 992px) {
6040 .thing__pic { 6040 .thing__pic {
6041 width: 330px; 6041 width: 330px;
6042 top: 50%; 6042 top: 50%;
6043 -webkit-transform: translate(0, -50%); 6043 -webkit-transform: translate(0, -50%);
6044 -ms-transform: translate(0, -50%); 6044 -ms-transform: translate(0, -50%);
6045 transform: translate(0, -50%); 6045 transform: translate(0, -50%);
6046 } 6046 }
6047 } 6047 }
6048 @media (min-width: 1280px) { 6048 @media (min-width: 1280px) {
6049 .thing__pic { 6049 .thing__pic {
6050 right: auto; 6050 right: auto;
6051 left: 50%; 6051 left: 50%;
6052 margin-left: 200px; 6052 margin-left: 200px;
6053 } 6053 }
6054 } 6054 }
6055 .thing__pic_two { 6055 .thing__pic_two {
6056 -o-object-fit: cover; 6056 -o-object-fit: cover;
6057 object-fit: cover; 6057 object-fit: cover;
6058 border-radius: 30px; 6058 border-radius: 30px;
6059 aspect-ratio: 44/37; 6059 aspect-ratio: 44/37;
6060 width: 100%; 6060 width: 100%;
6061 max-width: 440px; 6061 max-width: 440px;
6062 } 6062 }
6063 @media (min-width: 768px) { 6063 @media (min-width: 768px) {
6064 .thing__pic_two { 6064 .thing__pic_two {
6065 position: static; 6065 position: static;
6066 -webkit-transform: translate(0, 0); 6066 -webkit-transform: translate(0, 0);
6067 -ms-transform: translate(0, 0); 6067 -ms-transform: translate(0, 0);
6068 transform: translate(0, 0); 6068 transform: translate(0, 0);
6069 } 6069 }
6070 } 6070 }
6071 @media (min-width: 1280px) { 6071 @media (min-width: 1280px) {
6072 .thing__pic_two { 6072 .thing__pic_two {
6073 position: absolute; 6073 position: absolute;
6074 -webkit-transform: translate(0, -50%); 6074 -webkit-transform: translate(0, -50%);
6075 -ms-transform: translate(0, -50%); 6075 -ms-transform: translate(0, -50%);
6076 transform: translate(0, -50%); 6076 transform: translate(0, -50%);
6077 } 6077 }
6078 } 6078 }
6079 .thing__buttons { 6079 .thing__buttons {
6080 width: 100%; 6080 width: 100%;
6081 position: relative; 6081 position: relative;
6082 z-index: 2; 6082 z-index: 2;
6083 display: -webkit-box; 6083 display: -webkit-box;
6084 display: -ms-flexbox; 6084 display: -ms-flexbox;
6085 display: flex; 6085 display: flex;
6086 -webkit-box-align: center; 6086 -webkit-box-align: center;
6087 -ms-flex-align: center; 6087 -ms-flex-align: center;
6088 align-items: center; 6088 align-items: center;
6089 gap: 20px; 6089 gap: 20px;
6090 margin-top: 15px; 6090 margin-top: 15px;
6091 } 6091 }
6092 @media (min-width: 992px) { 6092 @media (min-width: 992px) {
6093 .thing__buttons { 6093 .thing__buttons {
6094 margin-top: 30px; 6094 margin-top: 30px;
6095 gap: 30px; 6095 gap: 30px;
6096 } 6096 }
6097 } 6097 }
6098 @media (min-width: 992px) { 6098 @media (min-width: 992px) {
6099 .thing__buttons .button { 6099 .thing__buttons .button {
6100 padding: 0 22px; 6100 padding: 0 22px;
6101 } 6101 }
6102 } 6102 }
6103 .thing__checkbox { 6103 .thing__checkbox {
6104 margin-top: 20px; 6104 margin-top: 20px;
6105 } 6105 }
6106 .thing__checkbox .checkbox__icon { 6106 .thing__checkbox .checkbox__icon {
6107 border-color: #377d87; 6107 border-color: #377d87;
6108 } 6108 }
6109 .thing__checkbox .checkbox__text { 6109 .thing__checkbox .checkbox__text {
6110 color: #377d87; 6110 color: #377d87;
6111 } 6111 }
6112 .thing__profile { 6112 .thing__profile {
6113 display: -webkit-box; 6113 display: -webkit-box;
6114 display: -ms-flexbox; 6114 display: -ms-flexbox;
6115 display: flex; 6115 display: flex;
6116 -webkit-box-orient: vertical; 6116 -webkit-box-orient: vertical;
6117 -webkit-box-direction: normal; 6117 -webkit-box-direction: normal;
6118 -ms-flex-direction: column; 6118 -ms-flex-direction: column;
6119 flex-direction: column; 6119 flex-direction: column;
6120 } 6120 }
6121 @media (min-width: 768px) { 6121 @media (min-width: 768px) {
6122 .thing__profile { 6122 .thing__profile {
6123 -webkit-box-orient: horizontal; 6123 -webkit-box-orient: horizontal;
6124 -webkit-box-direction: normal; 6124 -webkit-box-direction: normal;
6125 -ms-flex-direction: row; 6125 -ms-flex-direction: row;
6126 flex-direction: row; 6126 flex-direction: row;
6127 -webkit-box-align: start; 6127 -webkit-box-align: start;
6128 -ms-flex-align: start; 6128 -ms-flex-align: start;
6129 align-items: flex-start; 6129 align-items: flex-start;
6130 } 6130 }
6131 } 6131 }
6132 .thing__profile-photo { 6132 .thing__profile-photo {
6133 width: 210px; 6133 width: 210px;
6134 border-radius: 8px; 6134 border-radius: 8px;
6135 aspect-ratio: 1/1; 6135 aspect-ratio: 1/1;
6136 } 6136 }
6137 .thing__profile-body { 6137 .thing__profile-body {
6138 display: -webkit-box; 6138 display: -webkit-box;
6139 display: -ms-flexbox; 6139 display: -ms-flexbox;
6140 display: flex; 6140 display: flex;
6141 -webkit-box-orient: vertical; 6141 -webkit-box-orient: vertical;
6142 -webkit-box-direction: normal; 6142 -webkit-box-direction: normal;
6143 -ms-flex-direction: column; 6143 -ms-flex-direction: column;
6144 flex-direction: column; 6144 flex-direction: column;
6145 margin-top: 15px; 6145 margin-top: 15px;
6146 } 6146 }
6147 @media (min-width: 768px) { 6147 @media (min-width: 768px) {
6148 .thing__profile-body { 6148 .thing__profile-body {
6149 width: calc(100% - 210px); 6149 width: calc(100% - 210px);
6150 padding-left: 35px; 6150 padding-left: 35px;
6151 } 6151 }
6152 } 6152 }
6153 .thing__profile .thing__title { 6153 .thing__profile .thing__title {
6154 max-width: none; 6154 max-width: none;
6155 } 6155 }
6156 @media (min-width: 768px) { 6156 @media (min-width: 768px) {
6157 .thing__profile .thing__title { 6157 .thing__profile .thing__title {
6158 margin-top: -20px; 6158 margin-top: -20px;
6159 } 6159 }
6160 } 6160 }
6161 .thing__profile .thing__text { 6161 .thing__profile .thing__text {
6162 max-width: none; 6162 max-width: none;
6163 } 6163 }
6164 .thing__bottom { 6164 .thing__bottom {
6165 display: -webkit-box; 6165 display: -webkit-box;
6166 display: -ms-flexbox; 6166 display: -ms-flexbox;
6167 display: flex; 6167 display: flex;
6168 -webkit-box-align: center; 6168 -webkit-box-align: center;
6169 -ms-flex-align: center; 6169 -ms-flex-align: center;
6170 align-items: center; 6170 align-items: center;
6171 gap: 15px; 6171 gap: 15px;
6172 margin-top: 15px; 6172 margin-top: 15px;
6173 } 6173 }
6174 @media (min-width: 768px) { 6174 @media (min-width: 768px) {
6175 .thing__bottom { 6175 .thing__bottom {
6176 margin-top: 30px; 6176 margin-top: 30px;
6177 } 6177 }
6178 } 6178 }
6179 .thing__select { 6179 .thing__select {
6180 width: 100%; 6180 width: 100%;
6181 max-width: 640px; 6181 max-width: 640px;
6182 margin-top: 20px; 6182 margin-top: 20px;
6183 } 6183 }
6184 @media (min-width: 768px) { 6184 @media (min-width: 768px) {
6185 .thing__select { 6185 .thing__select {
6186 margin-top: 30px; 6186 margin-top: 30px;
6187 } 6187 }
6188 } 6188 }
6189 6189
6190 .page-404 { 6190 .page-404 {
6191 background: url(../images/bg-3.svg) no-repeat 100%/cover; 6191 background: url(../images/bg-3.svg) no-repeat 100%/cover;
6192 overflow: hidden; 6192 overflow: hidden;
6193 } 6193 }
6194 .page-404__body { 6194 .page-404__body {
6195 display: -webkit-box; 6195 display: -webkit-box;
6196 display: -ms-flexbox; 6196 display: -ms-flexbox;
6197 display: flex; 6197 display: flex;
6198 -webkit-box-orient: vertical; 6198 -webkit-box-orient: vertical;
6199 -webkit-box-direction: normal; 6199 -webkit-box-direction: normal;
6200 -ms-flex-direction: column; 6200 -ms-flex-direction: column;
6201 flex-direction: column; 6201 flex-direction: column;
6202 -webkit-box-align: center; 6202 -webkit-box-align: center;
6203 -ms-flex-align: center; 6203 -ms-flex-align: center;
6204 align-items: center; 6204 align-items: center;
6205 -webkit-box-pack: center; 6205 -webkit-box-pack: center;
6206 -ms-flex-pack: center; 6206 -ms-flex-pack: center;
6207 justify-content: center; 6207 justify-content: center;
6208 text-align: center; 6208 text-align: center;
6209 padding: 60px 0; 6209 padding: 60px 0;
6210 color: #000; 6210 color: #000;
6211 font-size: 12px; 6211 font-size: 12px;
6212 gap: 10px; 6212 gap: 10px;
6213 line-height: 1.4; 6213 line-height: 1.4;
6214 } 6214 }
6215 @media (min-width: 768px) { 6215 @media (min-width: 768px) {
6216 .page-404__body { 6216 .page-404__body {
6217 font-size: 18px; 6217 font-size: 18px;
6218 padding: 120px 0; 6218 padding: 120px 0;
6219 gap: 20px; 6219 gap: 20px;
6220 } 6220 }
6221 } 6221 }
6222 @media (min-width: 1280px) { 6222 @media (min-width: 1280px) {
6223 .page-404__body { 6223 .page-404__body {
6224 padding: 180px 0; 6224 padding: 180px 0;
6225 text-align: left; 6225 text-align: left;
6226 } 6226 }
6227 } 6227 }
6228 .page-404__numb { 6228 .page-404__numb {
6229 font-size: 114px; 6229 font-size: 114px;
6230 line-height: 1; 6230 line-height: 1;
6231 color: #377d87; 6231 color: #377d87;
6232 font-weight: 700; 6232 font-weight: 700;
6233 } 6233 }
6234 @media (min-width: 768px) { 6234 @media (min-width: 768px) {
6235 .page-404__numb { 6235 .page-404__numb {
6236 font-size: 184px; 6236 font-size: 184px;
6237 } 6237 }
6238 } 6238 }
6239 @media (min-width: 768px) { 6239 @media (min-width: 768px) {
6240 .page-404__title { 6240 .page-404__title {
6241 font-weight: 700; 6241 font-weight: 700;
6242 font-size: 44px; 6242 font-size: 44px;
6243 } 6243 }
6244 } 6244 }
6245 @media (min-width: 1280px) { 6245 @media (min-width: 1280px) {
6246 .page-404__title { 6246 .page-404__title {
6247 width: 710px; 6247 width: 710px;
6248 position: relative; 6248 position: relative;
6249 left: 200px; 6249 left: 200px;
6250 } 6250 }
6251 } 6251 }
6252 @media (min-width: 1280px) { 6252 @media (min-width: 1280px) {
6253 .page-404__subtitle { 6253 .page-404__subtitle {
6254 width: 710px; 6254 width: 710px;
6255 position: relative; 6255 position: relative;
6256 left: 200px; 6256 left: 200px;
6257 } 6257 }
6258 } 6258 }
6259 .page-404__button { 6259 .page-404__button {
6260 margin-top: 10px; 6260 margin-top: 10px;
6261 } 6261 }
6262 @media (min-width: 1280px) { 6262 @media (min-width: 1280px) {
6263 .page-404__button { 6263 .page-404__button {
6264 position: relative; 6264 position: relative;
6265 left: -45px; 6265 left: -45px;
6266 } 6266 }
6267 } 6267 }
6268 6268
6269 .cookies { 6269 .cookies {
6270 display: none; 6270 display: none;
6271 -webkit-box-align: end; 6271 -webkit-box-align: end;
6272 -ms-flex-align: end; 6272 -ms-flex-align: end;
6273 align-items: flex-end; 6273 align-items: flex-end;
6274 padding: 10px; 6274 padding: 10px;
6275 padding-top: 0; 6275 padding-top: 0;
6276 height: 0; 6276 height: 0;
6277 position: fixed; 6277 position: fixed;
6278 z-index: 999; 6278 z-index: 999;
6279 bottom: 0; 6279 bottom: 0;
6280 left: 0; 6280 left: 0;
6281 width: 100%; 6281 width: 100%;
6282 } 6282 }
6283 .cookies-is-actived .cookies { 6283 .cookies-is-actived .cookies {
6284 display: -webkit-box; 6284 display: -webkit-box;
6285 display: -ms-flexbox; 6285 display: -ms-flexbox;
6286 display: flex; 6286 display: flex;
6287 } 6287 }
6288 .cookies__body { 6288 .cookies__body {
6289 border-radius: 6px; 6289 border-radius: 6px;
6290 border: 1px solid #377d87; 6290 border: 1px solid #377d87;
6291 background: #fff; 6291 background: #fff;
6292 padding: 15px; 6292 padding: 15px;
6293 padding-right: 50px; 6293 padding-right: 50px;
6294 position: relative; 6294 position: relative;
6295 max-width: 940px; 6295 max-width: 940px;
6296 margin: 0 auto; 6296 margin: 0 auto;
6297 } 6297 }
6298 @media (min-width: 768px) { 6298 @media (min-width: 768px) {
6299 .cookies__body { 6299 .cookies__body {
6300 padding: 25px; 6300 padding: 25px;
6301 padding-right: 50px; 6301 padding-right: 50px;
6302 border-radius: 12px; 6302 border-radius: 12px;
6303 } 6303 }
6304 } 6304 }
6305 @media (min-width: 992px) { 6305 @media (min-width: 992px) {
6306 .cookies__body { 6306 .cookies__body {
6307 padding: 40px 60px; 6307 padding: 40px 60px;
6308 } 6308 }
6309 } 6309 }
6310 .cookies__close { 6310 .cookies__close {
6311 display: -webkit-box; 6311 display: -webkit-box;
6312 display: -ms-flexbox; 6312 display: -ms-flexbox;
6313 display: flex; 6313 display: flex;
6314 -webkit-box-pack: center; 6314 -webkit-box-pack: center;
6315 -ms-flex-pack: center; 6315 -ms-flex-pack: center;
6316 justify-content: center; 6316 justify-content: center;
6317 -webkit-box-align: center; 6317 -webkit-box-align: center;
6318 -ms-flex-align: center; 6318 -ms-flex-align: center;
6319 align-items: center; 6319 align-items: center;
6320 color: #377d87; 6320 color: #377d87;
6321 padding: 0; 6321 padding: 0;
6322 border: none; 6322 border: none;
6323 background: none; 6323 background: none;
6324 position: absolute; 6324 position: absolute;
6325 top: 15px; 6325 top: 15px;
6326 right: 15px; 6326 right: 15px;
6327 } 6327 }
6328 .cookies__close:hover { 6328 .cookies__close:hover {
6329 color: #000; 6329 color: #000;
6330 } 6330 }
6331 .cookies__close svg { 6331 .cookies__close svg {
6332 width: 16px; 6332 width: 16px;
6333 height: 16px; 6333 height: 16px;
6334 } 6334 }
6335 .cookies__text { 6335 .cookies__text {
6336 font-size: 12px; 6336 font-size: 12px;
6337 color: #377d87; 6337 color: #377d87;
6338 line-height: 1.4; 6338 line-height: 1.4;
6339 } 6339 }
6340 @media (min-width: 768px) { 6340 @media (min-width: 768px) {
6341 .cookies__text { 6341 .cookies__text {
6342 font-size: 16px; 6342 font-size: 16px;
6343 font-weight: 700; 6343 font-weight: 700;
6344 } 6344 }
6345 } 6345 }
6346 6346
6347 .fancybox-active { 6347 .fancybox-active {
6348 overflow: hidden; 6348 overflow: hidden;
6349 } 6349 }
6350 .fancybox-is-open .fancybox-bg { 6350 .fancybox-is-open .fancybox-bg {
6351 background: #080b0b; 6351 background: #080b0b;
6352 opacity: 0.6; 6352 opacity: 0.6;
6353 z-index: 9999; 6353 z-index: 9999;
6354 } 6354 }
6355 .fancybox-slide { 6355 .fancybox-slide {
6356 padding: 0; 6356 padding: 0;
6357 } 6357 }
6358 @media (min-width: 992px) { 6358 @media (min-width: 992px) {
6359 .fancybox-slide { 6359 .fancybox-slide {
6360 padding: 30px; 6360 padding: 30px;
6361 } 6361 }
6362 } 6362 }
6363 .fancybox-slide--html .fancybox-close-small { 6363 .fancybox-slide--html .fancybox-close-small {
6364 padding: 0; 6364 padding: 0;
6365 opacity: 1; 6365 opacity: 1;
6366 color: #377d87; 6366 color: #377d87;
6367 } 6367 }
6368 @media (min-width: 768px) { 6368 @media (min-width: 768px) {
6369 .fancybox-slide--html .fancybox-close-small { 6369 .fancybox-slide--html .fancybox-close-small {
6370 top: 10px; 6370 top: 10px;
6371 right: 10px; 6371 right: 10px;
6372 } 6372 }
6373 } 6373 }
6374 .fancybox-slide--html .fancybox-close-small:hover { 6374 .fancybox-slide--html .fancybox-close-small:hover {
6375 color: #000; 6375 color: #000;
6376 } 6376 }
6377 6377
6378 .modal { 6378 .modal {
6379 width: 100%; 6379 width: 100%;
6380 max-width: 820px; 6380 max-width: 820px;
6381 padding: 0; 6381 padding: 0;
6382 background: #fff; 6382 background: #fff;
6383 z-index: 99999; 6383 z-index: 99999;
6384 } 6384 }
6385 @media (min-width: 992px) { 6385 @media (min-width: 992px) {
6386 .modal { 6386 .modal {
6387 border-radius: 10px; 6387 border-radius: 10px;
6388 border: 1px solid #377d87; 6388 border: 1px solid #377d87;
6389 } 6389 }
6390 } 6390 }
6391 .modal_bg { 6391 .modal_bg {
6392 background: #fff url(../images/bg-4.svg) no-repeat calc(50% + 100px) 100%; 6392 background: #fff url(../images/bg-4.svg) no-repeat calc(50% + 100px) 100%;
6393 } 6393 }
6394 @media (min-width: 768px) { 6394 @media (min-width: 768px) {
6395 .modal_bg { 6395 .modal_bg {
6396 background-position: 100% 100%; 6396 background-position: 100% 100%;
6397 } 6397 }
6398 } 6398 }
6399 .modal__body { 6399 .modal__body {
6400 padding: 40px 15px; 6400 padding: 40px 15px;
6401 padding-bottom: 30px; 6401 padding-bottom: 30px;
6402 display: -webkit-box; 6402 display: -webkit-box;
6403 display: -ms-flexbox; 6403 display: -ms-flexbox;
6404 display: flex; 6404 display: flex;
6405 -webkit-box-orient: vertical; 6405 -webkit-box-orient: vertical;
6406 -webkit-box-direction: normal; 6406 -webkit-box-direction: normal;
6407 -ms-flex-direction: column; 6407 -ms-flex-direction: column;
6408 flex-direction: column; 6408 flex-direction: column;
6409 -webkit-box-align: center; 6409 -webkit-box-align: center;
6410 -ms-flex-align: center; 6410 -ms-flex-align: center;
6411 align-items: center; 6411 align-items: center;
6412 -webkit-box-pack: center; 6412 -webkit-box-pack: center;
6413 -ms-flex-pack: center; 6413 -ms-flex-pack: center;
6414 justify-content: center; 6414 justify-content: center;
6415 width: 100%; 6415 width: 100%;
6416 min-height: 100vh; 6416 min-height: 100vh;
6417 overflow: hidden; 6417 overflow: hidden;
6418 font-size: 12px; 6418 font-size: 12px;
6419 } 6419 }
6420 @media (min-width: 768px) { 6420 @media (min-width: 768px) {
6421 .modal__body { 6421 .modal__body {
6422 font-size: 16px; 6422 font-size: 16px;
6423 padding-left: 22px; 6423 padding-left: 22px;
6424 padding-right: 22px; 6424 padding-right: 22px;
6425 } 6425 }
6426 } 6426 }
6427 @media (min-width: 992px) { 6427 @media (min-width: 992px) {
6428 .modal__body { 6428 .modal__body {
6429 min-height: 450px; 6429 min-height: 450px;
6430 padding: 60px 80px; 6430 padding: 60px 80px;
6431 padding-bottom: 40px; 6431 padding-bottom: 40px;
6432 } 6432 }
6433 } 6433 }
6434 @media (min-width: 768px) { 6434 @media (min-width: 768px) {
6435 .modal__body .left { 6435 .modal__body .left {
6436 text-align: left; 6436 text-align: left;
6437 } 6437 }
6438 } 6438 }
6439 .modal__title { 6439 .modal__title {
6440 width: 100%; 6440 width: 100%;
6441 font-size: 22px; 6441 font-size: 22px;
6442 font-weight: 700; 6442 font-weight: 700;
6443 text-align: center; 6443 text-align: center;
6444 color: #000; 6444 color: #000;
6445 } 6445 }
6446 @media (min-width: 768px) { 6446 @media (min-width: 768px) {
6447 .modal__title { 6447 .modal__title {
6448 font-size: 32px; 6448 font-size: 32px;
6449 } 6449 }
6450 } 6450 }
6451 @media (min-width: 992px) { 6451 @media (min-width: 992px) {
6452 .modal__title { 6452 .modal__title {
6453 font-size: 44px; 6453 font-size: 44px;
6454 } 6454 }
6455 } 6455 }
6456 .modal__text { 6456 .modal__text {
6457 width: 100%; 6457 width: 100%;
6458 text-align: center; 6458 text-align: center;
6459 margin-top: 10px; 6459 margin-top: 10px;
6460 color: #000; 6460 color: #000;
6461 } 6461 }
6462 @media (min-width: 768px) { 6462 @media (min-width: 768px) {
6463 .modal__text { 6463 .modal__text {
6464 margin-top: 20px; 6464 margin-top: 20px;
6465 } 6465 }
6466 } 6466 }
6467 .modal__text span { 6467 .modal__text span {
6468 color: #9c9d9d; 6468 color: #9c9d9d;
6469 } 6469 }
6470 .modal__text a { 6470 .modal__text a {
6471 font-weight: 700; 6471 font-weight: 700;
6472 color: #377d87; 6472 color: #377d87;
6473 } 6473 }
6474 .modal__text a:hover { 6474 .modal__text a:hover {
6475 color: #000; 6475 color: #000;
6476 } 6476 }
6477 .modal__button { 6477 .modal__button {
6478 margin-top: 20px; 6478 margin-top: 20px;
6479 } 6479 }
6480 @media (min-width: 768px) { 6480 @media (min-width: 768px) {
6481 .modal__button { 6481 .modal__button {
6482 min-width: 200px; 6482 min-width: 200px;
6483 margin-top: 30px; 6483 margin-top: 30px;
6484 } 6484 }
6485 } 6485 }
6486 .modal__buttons { 6486 .modal__buttons {
6487 display: grid; 6487 display: grid;
6488 grid-template-columns: repeat(2, 1fr); 6488 grid-template-columns: repeat(2, 1fr);
6489 gap: 20px; 6489 gap: 20px;
6490 margin-top: 20px; 6490 margin-top: 20px;
6491 } 6491 }
6492 @media (min-width: 768px) { 6492 @media (min-width: 768px) {
6493 .modal__buttons { 6493 .modal__buttons {
6494 gap: 30px; 6494 gap: 30px;
6495 margin-top: 30px; 6495 margin-top: 30px;
6496 } 6496 }
6497 } 6497 }
6498 .modal__form { 6498 .modal__form {
6499 width: 100%; 6499 width: 100%;
6500 display: -webkit-box; 6500 display: -webkit-box;
6501 display: -ms-flexbox; 6501 display: -ms-flexbox;
6502 display: flex; 6502 display: flex;
6503 -webkit-box-orient: vertical; 6503 -webkit-box-orient: vertical;
6504 -webkit-box-direction: normal; 6504 -webkit-box-direction: normal;
6505 -ms-flex-direction: column; 6505 -ms-flex-direction: column;
6506 flex-direction: column; 6506 flex-direction: column;
6507 gap: 16px; 6507 gap: 16px;
6508 margin-top: 10px; 6508 margin-top: 10px;
6509 } 6509 }
6510 @media (min-width: 768px) { 6510 @media (min-width: 768px) {
6511 .modal__form { 6511 .modal__form {
6512 margin-top: 20px; 6512 margin-top: 20px;
6513 } 6513 }
6514 } 6514 }
6515 .modal__form-item { 6515 .modal__form-item {
6516 display: -webkit-box; 6516 display: -webkit-box;
6517 display: -ms-flexbox; 6517 display: -ms-flexbox;
6518 display: flex; 6518 display: flex;
6519 -webkit-box-orient: vertical; 6519 -webkit-box-orient: vertical;
6520 -webkit-box-direction: normal; 6520 -webkit-box-direction: normal;
6521 -ms-flex-direction: column; 6521 -ms-flex-direction: column;
6522 flex-direction: column; 6522 flex-direction: column;
6523 -webkit-box-align: center; 6523 -webkit-box-align: center;
6524 -ms-flex-align: center; 6524 -ms-flex-align: center;
6525 align-items: center; 6525 align-items: center;
6526 gap: 4px; 6526 gap: 4px;
6527 } 6527 }
6528 .modal__form-item > .input { 6528 .modal__form-item > .input {
6529 width: 100%; 6529 width: 100%;
6530 } 6530 }
6531 .modal__form-item > .textarea { 6531 .modal__form-item > .textarea {
6532 width: 100%; 6532 width: 100%;
6533 height: 175px; 6533 height: 175px;
6534 } 6534 }
6535 @media (min-width: 768px) { 6535 @media (min-width: 768px) {
6536 .modal__form-item > .textarea { 6536 .modal__form-item > .textarea {
6537 height: 195px; 6537 height: 195px;
6538 } 6538 }
6539 } 6539 }
6540 .modal__form-item > .file { 6540 .modal__form-item > .file {
6541 width: 100%; 6541 width: 100%;
6542 } 6542 }
6543 .modal__form-item > .button { 6543 .modal__form-item > .button {
6544 min-width: 120px; 6544 min-width: 120px;
6545 } 6545 }
6546 .modal__form-item > label { 6546 .modal__form-item > label {
6547 width: 100%; 6547 width: 100%;
6548 display: none; 6548 display: none;
6549 color: #eb5757; 6549 color: #eb5757;
6550 padding: 0 10px; 6550 padding: 0 10px;
6551 font-size: 12px; 6551 font-size: 12px;
6552 } 6552 }
6553 @media (min-width: 768px) { 6553 @media (min-width: 768px) {
6554 .modal__form-item > label { 6554 .modal__form-item > label {
6555 padding: 0 20px; 6555 padding: 0 20px;
6556 font-size: 16px; 6556 font-size: 16px;
6557 } 6557 }
6558 } 6558 }
6559 .modal__sign { 6559 .modal__sign {
6560 display: -webkit-box; 6560 display: -webkit-box;
6561 display: -ms-flexbox; 6561 display: -ms-flexbox;
6562 display: flex; 6562 display: flex;
6563 -webkit-box-orient: vertical; 6563 -webkit-box-orient: vertical;
6564 -webkit-box-direction: normal; 6564 -webkit-box-direction: normal;
6565 -ms-flex-direction: column; 6565 -ms-flex-direction: column;
6566 flex-direction: column; 6566 flex-direction: column;
6567 gap: 20px; 6567 gap: 20px;
6568 margin-top: 10px; 6568 margin-top: 10px;
6569 margin-bottom: 20px; 6569 margin-bottom: 20px;
6570 width: 100%; 6570 width: 100%;
6571 } 6571 }
6572 @media (min-width: 768px) { 6572 @media (min-width: 768px) {
6573 .modal__sign { 6573 .modal__sign {
6574 margin-top: 20px; 6574 margin-top: 20px;
6575 margin-bottom: 40px; 6575 margin-bottom: 40px;
6576 } 6576 }
6577 } 6577 }
6578 .modal__sign-item { 6578 .modal__sign-item {
6579 display: -webkit-box; 6579 display: -webkit-box;
6580 display: -ms-flexbox; 6580 display: -ms-flexbox;
6581 display: flex; 6581 display: flex;
6582 -webkit-box-orient: vertical; 6582 -webkit-box-orient: vertical;
6583 -webkit-box-direction: normal; 6583 -webkit-box-direction: normal;
6584 -ms-flex-direction: column; 6584 -ms-flex-direction: column;
6585 flex-direction: column; 6585 flex-direction: column;
6586 -webkit-box-align: center; 6586 -webkit-box-align: center;
6587 -ms-flex-align: center; 6587 -ms-flex-align: center;
6588 align-items: center; 6588 align-items: center;
6589 position: relative; 6589 position: relative;
6590 } 6590 }
6591 .modal__sign-item > .input { 6591 .modal__sign-item > .input {
6592 width: 100%; 6592 width: 100%;
6593 padding-right: 36px; 6593 padding-right: 36px;
6594 position: relative; 6594 position: relative;
6595 z-index: 1; 6595 z-index: 1;
6596 } 6596 }
6597 @media (min-width: 768px) { 6597 @media (min-width: 768px) {
6598 .modal__sign-item > .input { 6598 .modal__sign-item > .input {
6599 height: 52px; 6599 height: 52px;
6600 padding-right: 60px; 6600 padding-right: 60px;
6601 } 6601 }
6602 } 6602 }
6603 .modal__sign-item > .textarea { 6603 .modal__sign-item > .textarea {
6604 width: 100%; 6604 width: 100%;
6605 } 6605 }
6606 .modal__sign-bottom { 6606 .modal__sign-bottom {
6607 display: -webkit-box; 6607 display: -webkit-box;
6608 display: -ms-flexbox; 6608 display: -ms-flexbox;
6609 display: flex; 6609 display: flex;
6610 -webkit-box-pack: justify; 6610 -webkit-box-pack: justify;
6611 -ms-flex-pack: justify; 6611 -ms-flex-pack: justify;
6612 justify-content: space-between; 6612 justify-content: space-between;
6613 -webkit-box-align: center; 6613 -webkit-box-align: center;
6614 -ms-flex-align: center; 6614 -ms-flex-align: center;
6615 align-items: center; 6615 align-items: center;
6616 width: 100%; 6616 width: 100%;
6617 } 6617 }
6618 .modal__sign-bottom-link { 6618 .modal__sign-bottom-link {
6619 font-weight: 700; 6619 font-weight: 700;
6620 color: #377d87; 6620 color: #377d87;
6621 } 6621 }
6622 .modal__tabs { 6622 .modal__tabs {
6623 width: 100%; 6623 width: 100%;
6624 display: grid; 6624 display: grid;
6625 grid-template-columns: repeat(2, 1fr); 6625 grid-template-columns: repeat(2, 1fr);
6626 gap: 16px; 6626 gap: 16px;
6627 margin-top: 10px; 6627 margin-top: 10px;
6628 } 6628 }
6629 @media (min-width: 768px) { 6629 @media (min-width: 768px) {
6630 .modal__tabs { 6630 .modal__tabs {
6631 gap: 24px; 6631 gap: 24px;
6632 margin-top: 20px; 6632 margin-top: 20px;
6633 } 6633 }
6634 } 6634 }
6635 .modal__tabs-item.active { 6635 .modal__tabs-item.active {
6636 background: #377d87; 6636 background: #377d87;
6637 color: #fff; 6637 color: #fff;
6638 } 6638 }
6639 .modal__reg { 6639 .modal__reg {
6640 display: none; 6640 display: none;
6641 -webkit-box-orient: vertical; 6641 -webkit-box-orient: vertical;
6642 -webkit-box-direction: normal; 6642 -webkit-box-direction: normal;
6643 -ms-flex-direction: column; 6643 -ms-flex-direction: column;
6644 flex-direction: column; 6644 flex-direction: column;
6645 -webkit-box-align: center; 6645 -webkit-box-align: center;
6646 -ms-flex-align: center; 6646 -ms-flex-align: center;
6647 align-items: center; 6647 align-items: center;
6648 gap: 10px; 6648 gap: 10px;
6649 width: 100%; 6649 width: 100%;
6650 margin-top: 10px; 6650 margin-top: 10px;
6651 margin-bottom: 20px; 6651 margin-bottom: 20px;
6652 } 6652 }
6653 @media (min-width: 768px) { 6653 @media (min-width: 768px) {
6654 .modal__reg { 6654 .modal__reg {
6655 margin-top: 20px; 6655 margin-top: 20px;
6656 margin-bottom: 30px; 6656 margin-bottom: 30px;
6657 gap: 20px; 6657 gap: 20px;
6658 } 6658 }
6659 } 6659 }
6660 .modal__reg.showed { 6660 .modal__reg.showed {
6661 display: -webkit-box; 6661 display: -webkit-box;
6662 display: -ms-flexbox; 6662 display: -ms-flexbox;
6663 display: flex; 6663 display: flex;
6664 } 6664 }
6665 .modal__reg-item { 6665 .modal__reg-item {
6666 width: 100%; 6666 width: 100%;
6667 display: -webkit-box; 6667 display: -webkit-box;
6668 display: -ms-flexbox; 6668 display: -ms-flexbox;
6669 display: flex; 6669 display: flex;
6670 -webkit-box-orient: vertical; 6670 -webkit-box-orient: vertical;
6671 -webkit-box-direction: normal; 6671 -webkit-box-direction: normal;
6672 -ms-flex-direction: column; 6672 -ms-flex-direction: column;
6673 flex-direction: column; 6673 flex-direction: column;
6674 } 6674 }
6675 .modal__reg-item > .captcha { 6675 .modal__reg-item > .captcha {
6676 width: 100%; 6676 width: 100%;
6677 max-width: 300px; 6677 max-width: 300px;
6678 } 6678 }
6679 6679
6680 .messages { 6680 .messages {
6681 display: -webkit-box; 6681 display: -webkit-box;
6682 display: -ms-flexbox; 6682 display: -ms-flexbox;
6683 display: flex; 6683 display: flex;
6684 -webkit-box-orient: vertical; 6684 -webkit-box-orient: vertical;
6685 -webkit-box-direction: reverse; 6685 -webkit-box-direction: reverse;
6686 -ms-flex-direction: column-reverse; 6686 -ms-flex-direction: column-reverse;
6687 flex-direction: column-reverse; 6687 flex-direction: column-reverse;
6688 -webkit-box-align: center; 6688 -webkit-box-align: center;
6689 -ms-flex-align: center; 6689 -ms-flex-align: center;
6690 align-items: center; 6690 align-items: center;
6691 gap: 20px; 6691 gap: 20px;
6692 } 6692 }
6693 .messages__body { 6693 .messages__body {
6694 display: -webkit-box; 6694 display: -webkit-box;
6695 display: -ms-flexbox; 6695 display: -ms-flexbox;
6696 display: flex; 6696 display: flex;
6697 -webkit-box-orient: vertical; 6697 -webkit-box-orient: vertical;
6698 -webkit-box-direction: normal; 6698 -webkit-box-direction: normal;
6699 -ms-flex-direction: column; 6699 -ms-flex-direction: column;
6700 flex-direction: column; 6700 flex-direction: column;
6701 gap: 10px; 6701 gap: 10px;
6702 width: 100%; 6702 width: 100%;
6703 } 6703 }
6704 @media (min-width: 768px) { 6704 @media (min-width: 768px) {
6705 .messages__body { 6705 .messages__body {
6706 gap: 20px; 6706 gap: 20px;
6707 } 6707 }
6708 } 6708 }
6709 .messages__item { 6709 .messages__item {
6710 display: none; 6710 display: none;
6711 -webkit-box-align: center; 6711 -webkit-box-align: center;
6712 -ms-flex-align: center; 6712 -ms-flex-align: center;
6713 align-items: center; 6713 align-items: center;
6714 border-radius: 8px; 6714 border-radius: 8px;
6715 border: 1px solid #e7e7e7; 6715 border: 1px solid #e7e7e7;
6716 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 6716 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
6717 padding: 10px; 6717 padding: 10px;
6718 font-size: 12px; 6718 font-size: 12px;
6719 } 6719 }
6720 @media (min-width: 768px) { 6720 @media (min-width: 768px) {
6721 .messages__item { 6721 .messages__item {
6722 padding: 20px; 6722 padding: 20px;
6723 font-size: 16px; 6723 font-size: 16px;
6724 } 6724 }
6725 } 6725 }
6726 .messages__item:nth-of-type(1), .messages__item:nth-of-type(2), .messages__item:nth-of-type(3), .messages__item:nth-of-type(4), .messages__item:nth-of-type(5), .messages__item:nth-of-type(6) { 6726 .messages__item:nth-of-type(1), .messages__item:nth-of-type(2), .messages__item:nth-of-type(3), .messages__item:nth-of-type(4), .messages__item:nth-of-type(5), .messages__item:nth-of-type(6) {
6727 display: -webkit-box; 6727 display: -webkit-box;
6728 display: -ms-flexbox; 6728 display: -ms-flexbox;
6729 display: flex; 6729 display: flex;
6730 } 6730 }
6731 .messages__item-info { 6731 .messages__item-info {
6732 display: -webkit-box; 6732 display: -webkit-box;
6733 display: -ms-flexbox; 6733 display: -ms-flexbox;
6734 display: flex; 6734 display: flex;
6735 -webkit-box-align: center; 6735 -webkit-box-align: center;
6736 -ms-flex-align: center; 6736 -ms-flex-align: center;
6737 align-items: center; 6737 align-items: center;
6738 width: calc(100% - 90px); 6738 width: calc(100% - 90px);
6739 } 6739 }
6740 @media (min-width: 768px) { 6740 @media (min-width: 768px) {
6741 .messages__item-info { 6741 .messages__item-info {
6742 width: calc(100% - 150px); 6742 width: calc(100% - 150px);
6743 } 6743 }
6744 } 6744 }
6745 .messages__item-photo { 6745 .messages__item-photo {
6746 position: relative; 6746 position: relative;
6747 aspect-ratio: 1/1; 6747 aspect-ratio: 1/1;
6748 overflow: hidden; 6748 overflow: hidden;
6749 background: #9c9d9d; 6749 background: #9c9d9d;
6750 color: #fff; 6750 color: #fff;
6751 width: 36px; 6751 width: 36px;
6752 border-radius: 6px; 6752 border-radius: 6px;
6753 display: -webkit-box; 6753 display: -webkit-box;
6754 display: -ms-flexbox; 6754 display: -ms-flexbox;
6755 display: flex; 6755 display: flex;
6756 -webkit-box-pack: center; 6756 -webkit-box-pack: center;
6757 -ms-flex-pack: center; 6757 -ms-flex-pack: center;
6758 justify-content: center; 6758 justify-content: center;
6759 -webkit-box-align: center; 6759 -webkit-box-align: center;
6760 -ms-flex-align: center; 6760 -ms-flex-align: center;
6761 align-items: center; 6761 align-items: center;
6762 } 6762 }
6763 @media (min-width: 768px) { 6763 @media (min-width: 768px) {
6764 .messages__item-photo { 6764 .messages__item-photo {
6765 width: 52px; 6765 width: 52px;
6766 } 6766 }
6767 } 6767 }
6768 .messages__item-photo svg { 6768 .messages__item-photo svg {
6769 width: 50%; 6769 width: 50%;
6770 position: relative; 6770 position: relative;
6771 z-index: 1; 6771 z-index: 1;
6772 } 6772 }
6773 .messages__item-photo img { 6773 .messages__item-photo img {
6774 position: absolute; 6774 position: absolute;
6775 z-index: 2; 6775 z-index: 2;
6776 top: 0; 6776 top: 0;
6777 left: 0; 6777 left: 0;
6778 width: 100%; 6778 width: 100%;
6779 height: 100%; 6779 height: 100%;
6780 -o-object-fit: cover; 6780 -o-object-fit: cover;
6781 object-fit: cover; 6781 object-fit: cover;
6782 } 6782 }
6783 .messages__item-text { 6783 .messages__item-text {
6784 width: calc(100% - 36px); 6784 width: calc(100% - 36px);
6785 padding-left: 6px; 6785 padding-left: 6px;
6786 color: #000; 6786 color: #000;
6787 display: -webkit-box; 6787 display: -webkit-box;
6788 display: -ms-flexbox; 6788 display: -ms-flexbox;
6789 display: flex; 6789 display: flex;
6790 -webkit-box-orient: vertical; 6790 -webkit-box-orient: vertical;
6791 -webkit-box-direction: normal; 6791 -webkit-box-direction: normal;
6792 -ms-flex-direction: column; 6792 -ms-flex-direction: column;
6793 flex-direction: column; 6793 flex-direction: column;
6794 gap: 4px; 6794 gap: 4px;
6795 } 6795 }
6796 @media (min-width: 768px) { 6796 @media (min-width: 768px) {
6797 .messages__item-text { 6797 .messages__item-text {
6798 padding-left: 20px; 6798 padding-left: 20px;
6799 width: calc(100% - 52px); 6799 width: calc(100% - 52px);
6800 gap: 8px; 6800 gap: 8px;
6801 } 6801 }
6802 } 6802 }
6803 .messages__item-text span { 6803 .messages__item-text span {
6804 color: #000; 6804 color: #000;
6805 } 6805 }
6806 .messages__item-date { 6806 .messages__item-date {
6807 color: #000; 6807 color: #000;
6808 width: 90px; 6808 width: 90px;
6809 text-align: right; 6809 text-align: right;
6810 } 6810 }
6811 @media (min-width: 768px) { 6811 @media (min-width: 768px) {
6812 .messages__item-date { 6812 .messages__item-date {
6813 width: 150px; 6813 width: 150px;
6814 } 6814 }
6815 } 6815 }
6816 .messages.active .messages__item { 6816 .messages.active .messages__item {
6817 display: -webkit-box; 6817 display: -webkit-box;
6818 display: -ms-flexbox; 6818 display: -ms-flexbox;
6819 display: flex; 6819 display: flex;
6820 } 6820 }
6821 6821
6822 .responses { 6822 .responses {
6823 display: -webkit-box; 6823 display: -webkit-box;
6824 display: -ms-flexbox; 6824 display: -ms-flexbox;
6825 display: flex; 6825 display: flex;
6826 -webkit-box-orient: vertical; 6826 -webkit-box-orient: vertical;
6827 -webkit-box-direction: reverse; 6827 -webkit-box-direction: reverse;
6828 -ms-flex-direction: column-reverse; 6828 -ms-flex-direction: column-reverse;
6829 flex-direction: column-reverse; 6829 flex-direction: column-reverse;
6830 -webkit-box-align: center; 6830 -webkit-box-align: center;
6831 -ms-flex-align: center; 6831 -ms-flex-align: center;
6832 align-items: center; 6832 align-items: center;
6833 gap: 20px; 6833 gap: 20px;
6834 } 6834 }
6835 .responses__body { 6835 .responses__body {
6836 width: 100%; 6836 width: 100%;
6837 display: -webkit-box; 6837 display: -webkit-box;
6838 display: -ms-flexbox; 6838 display: -ms-flexbox;
6839 display: flex; 6839 display: flex;
6840 -webkit-box-orient: vertical; 6840 -webkit-box-orient: vertical;
6841 -webkit-box-direction: normal; 6841 -webkit-box-direction: normal;
6842 -ms-flex-direction: column; 6842 -ms-flex-direction: column;
6843 flex-direction: column; 6843 flex-direction: column;
6844 gap: 20px; 6844 gap: 20px;
6845 } 6845 }
6846 .responses__item { 6846 .responses__item {
6847 display: none; 6847 display: none;
6848 -webkit-box-orient: vertical; 6848 -webkit-box-orient: vertical;
6849 -webkit-box-direction: normal; 6849 -webkit-box-direction: normal;
6850 -ms-flex-direction: column; 6850 -ms-flex-direction: column;
6851 flex-direction: column; 6851 flex-direction: column;
6852 gap: 20px; 6852 gap: 20px;
6853 border-radius: 8px; 6853 border-radius: 8px;
6854 border: 1px solid #e7e7e7; 6854 border: 1px solid #e7e7e7;
6855 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 6855 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
6856 padding: 20px 10px; 6856 padding: 20px 10px;
6857 font-size: 12px; 6857 font-size: 12px;
6858 position: relative; 6858 position: relative;
6859 } 6859 }
6860 @media (min-width: 768px) { 6860 @media (min-width: 768px) {
6861 .responses__item { 6861 .responses__item {
6862 padding: 20px; 6862 padding: 20px;
6863 font-size: 16px; 6863 font-size: 16px;
6864 } 6864 }
6865 } 6865 }
6866 .responses__item:nth-of-type(1), .responses__item:nth-of-type(2), .responses__item:nth-of-type(3), .responses__item:nth-of-type(4), .responses__item:nth-of-type(5), .responses__item:nth-of-type(6) { 6866 .responses__item:nth-of-type(1), .responses__item:nth-of-type(2), .responses__item:nth-of-type(3), .responses__item:nth-of-type(4), .responses__item:nth-of-type(5), .responses__item:nth-of-type(6) {
6867 display: -webkit-box; 6867 display: -webkit-box;
6868 display: -ms-flexbox; 6868 display: -ms-flexbox;
6869 display: flex; 6869 display: flex;
6870 } 6870 }
6871 .responses__item-date { 6871 .responses__item-date {
6872 color: #000; 6872 color: #000;
6873 } 6873 }
6874 @media (min-width: 992px) { 6874 @media (min-width: 992px) {
6875 .responses__item-date { 6875 .responses__item-date {
6876 position: absolute; 6876 position: absolute;
6877 top: 20px; 6877 top: 20px;
6878 right: 20px; 6878 right: 20px;
6879 } 6879 }
6880 } 6880 }
6881 .responses__item-wrapper { 6881 .responses__item-wrapper {
6882 display: -webkit-box; 6882 display: -webkit-box;
6883 display: -ms-flexbox; 6883 display: -ms-flexbox;
6884 display: flex; 6884 display: flex;
6885 -webkit-box-orient: vertical; 6885 -webkit-box-orient: vertical;
6886 -webkit-box-direction: normal; 6886 -webkit-box-direction: normal;
6887 -ms-flex-direction: column; 6887 -ms-flex-direction: column;
6888 flex-direction: column; 6888 flex-direction: column;
6889 gap: 20px; 6889 gap: 20px;
6890 } 6890 }
6891 .responses__item-inner { 6891 .responses__item-inner {
6892 display: -webkit-box; 6892 display: -webkit-box;
6893 display: -ms-flexbox; 6893 display: -ms-flexbox;
6894 display: flex; 6894 display: flex;
6895 -webkit-box-orient: vertical; 6895 -webkit-box-orient: vertical;
6896 -webkit-box-direction: normal; 6896 -webkit-box-direction: normal;
6897 -ms-flex-direction: column; 6897 -ms-flex-direction: column;
6898 flex-direction: column; 6898 flex-direction: column;
6899 gap: 10px; 6899 gap: 10px;
6900 } 6900 }
6901 @media (min-width: 768px) { 6901 @media (min-width: 768px) {
6902 .responses__item-inner { 6902 .responses__item-inner {
6903 gap: 20px; 6903 gap: 20px;
6904 } 6904 }
6905 } 6905 }
6906 @media (min-width: 1280px) { 6906 @media (min-width: 1280px) {
6907 .responses__item-inner { 6907 .responses__item-inner {
6908 width: calc(100% - 150px); 6908 width: calc(100% - 150px);
6909 } 6909 }
6910 } 6910 }
6911 .responses__item-row { 6911 .responses__item-row {
6912 display: grid; 6912 display: grid;
6913 grid-template-columns: 1fr 1fr; 6913 grid-template-columns: 1fr 1fr;
6914 gap: 20px; 6914 gap: 20px;
6915 color: #000; 6915 color: #000;
6916 text-align: right; 6916 text-align: right;
6917 } 6917 }
6918 @media (min-width: 992px) { 6918 @media (min-width: 992px) {
6919 .responses__item-row { 6919 .responses__item-row {
6920 display: -webkit-box; 6920 display: -webkit-box;
6921 display: -ms-flexbox; 6921 display: -ms-flexbox;
6922 display: flex; 6922 display: flex;
6923 -webkit-box-orient: vertical; 6923 -webkit-box-orient: vertical;
6924 -webkit-box-direction: normal; 6924 -webkit-box-direction: normal;
6925 -ms-flex-direction: column; 6925 -ms-flex-direction: column;
6926 flex-direction: column; 6926 flex-direction: column;
6927 gap: 6px; 6927 gap: 6px;
6928 text-align: left; 6928 text-align: left;
6929 } 6929 }
6930 } 6930 }
6931 .responses__item-row span { 6931 .responses__item-row span {
6932 color: #000; 6932 color: #000;
6933 text-align: left; 6933 text-align: left;
6934 } 6934 }
6935 .responses__item-buttons { 6935 .responses__item-buttons {
6936 display: -webkit-box; 6936 display: -webkit-box;
6937 display: -ms-flexbox; 6937 display: -ms-flexbox;
6938 display: flex; 6938 display: flex;
6939 -webkit-box-orient: vertical; 6939 -webkit-box-orient: vertical;
6940 -webkit-box-direction: normal; 6940 -webkit-box-direction: normal;
6941 -ms-flex-direction: column; 6941 -ms-flex-direction: column;
6942 flex-direction: column; 6942 flex-direction: column;
6943 gap: 10px; 6943 gap: 10px;
6944 } 6944 }
6945 @media (min-width: 768px) { 6945 @media (min-width: 768px) {
6946 .responses__item-buttons { 6946 .responses__item-buttons {
6947 display: grid; 6947 display: grid;
6948 grid-template-columns: 1fr 1fr; 6948 grid-template-columns: 1fr 1fr;
6949 } 6949 }
6950 } 6950 }
6951 @media (min-width: 1280px) { 6951 @media (min-width: 1280px) {
6952 .responses__item-buttons { 6952 .responses__item-buttons {
6953 grid-template-columns: 1fr 1fr 1fr 1fr; 6953 grid-template-columns: 1fr 1fr 1fr 1fr;
6954 } 6954 }
6955 } 6955 }
6956 .responses__item-buttons .button.active { 6956 .responses__item-buttons .button.active {
6957 background: #377d87; 6957 background: #377d87;
6958 color: #fff; 6958 color: #fff;
6959 } 6959 }
6960 .responses.active .responses__item { 6960 .responses.active .responses__item {
6961 display: -webkit-box; 6961 display: -webkit-box;
6962 display: -ms-flexbox; 6962 display: -ms-flexbox;
6963 display: flex; 6963 display: flex;
6964 } 6964 }
6965 6965
6966 .chatbox { 6966 .chatbox {
6967 display: -webkit-box; 6967 display: -webkit-box;
6968 display: -ms-flexbox; 6968 display: -ms-flexbox;
6969 display: flex; 6969 display: flex;
6970 -webkit-box-orient: vertical; 6970 -webkit-box-orient: vertical;
6971 -webkit-box-direction: normal; 6971 -webkit-box-direction: normal;
6972 -ms-flex-direction: column; 6972 -ms-flex-direction: column;
6973 flex-direction: column; 6973 flex-direction: column;
6974 gap: 20px; 6974 gap: 20px;
6975 } 6975 }
6976 @media (min-width: 768px) { 6976 @media (min-width: 768px) {
6977 .chatbox { 6977 .chatbox {
6978 gap: 30px; 6978 gap: 30px;
6979 } 6979 }
6980 } 6980 }
6981 @media (min-width: 1280px) { 6981 @media (min-width: 1280px) {
6982 .chatbox { 6982 .chatbox {
6983 gap: 40px; 6983 gap: 40px;
6984 } 6984 }
6985 } 6985 }
6986 .chatbox__toper { 6986 .chatbox__toper {
6987 display: -webkit-box; 6987 display: -webkit-box;
6988 display: -ms-flexbox; 6988 display: -ms-flexbox;
6989 display: flex; 6989 display: flex;
6990 -webkit-box-orient: vertical; 6990 -webkit-box-orient: vertical;
6991 -webkit-box-direction: normal; 6991 -webkit-box-direction: normal;
6992 -ms-flex-direction: column; 6992 -ms-flex-direction: column;
6993 flex-direction: column; 6993 flex-direction: column;
6994 gap: 10px; 6994 gap: 10px;
6995 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 6995 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
6996 border: 1px solid #e7e7e7; 6996 border: 1px solid #e7e7e7;
6997 border-radius: 8px; 6997 border-radius: 8px;
6998 padding: 10px; 6998 padding: 10px;
6999 } 6999 }
7000 @media (min-width: 768px) { 7000 @media (min-width: 768px) {
7001 .chatbox__toper { 7001 .chatbox__toper {
7002 padding: 20px; 7002 padding: 20px;
7003 -webkit-box-orient: horizontal; 7003 -webkit-box-orient: horizontal;
7004 -webkit-box-direction: normal; 7004 -webkit-box-direction: normal;
7005 -ms-flex-direction: row; 7005 -ms-flex-direction: row;
7006 flex-direction: row; 7006 flex-direction: row;
7007 -webkit-box-align: center; 7007 -webkit-box-align: center;
7008 -ms-flex-align: center; 7008 -ms-flex-align: center;
7009 align-items: center; 7009 align-items: center;
7010 -webkit-box-pack: justify; 7010 -webkit-box-pack: justify;
7011 -ms-flex-pack: justify; 7011 -ms-flex-pack: justify;
7012 justify-content: space-between; 7012 justify-content: space-between;
7013 } 7013 }
7014 } 7014 }
7015 .chatbox__toper-info { 7015 .chatbox__toper-info {
7016 font-size: 12px; 7016 font-size: 12px;
7017 } 7017 }
7018 @media (min-width: 768px) { 7018 @media (min-width: 768px) {
7019 .chatbox__toper-info { 7019 .chatbox__toper-info {
7020 font-size: 16px; 7020 font-size: 16px;
7021 width: calc(100% - 230px); 7021 width: calc(100% - 230px);
7022 } 7022 }
7023 } 7023 }
7024 @media (min-width: 768px) { 7024 @media (min-width: 768px) {
7025 .chatbox__toper-button { 7025 .chatbox__toper-button {
7026 width: 210px; 7026 width: 210px;
7027 padding: 0; 7027 padding: 0;
7028 } 7028 }
7029 } 7029 }
7030 .chatbox__list { 7030 .chatbox__list {
7031 display: -webkit-box; 7031 display: -webkit-box;
7032 display: -ms-flexbox; 7032 display: -ms-flexbox;
7033 display: flex; 7033 display: flex;
7034 -webkit-box-orient: vertical; 7034 -webkit-box-orient: vertical;
7035 -webkit-box-direction: normal; 7035 -webkit-box-direction: normal;
7036 -ms-flex-direction: column; 7036 -ms-flex-direction: column;
7037 flex-direction: column; 7037 flex-direction: column;
7038 gap: 10px; 7038 gap: 10px;
7039 } 7039 }
7040 @media (min-width: 768px) { 7040 @media (min-width: 768px) {
7041 .chatbox__list { 7041 .chatbox__list {
7042 gap: 20px; 7042 gap: 20px;
7043 } 7043 }
7044 } 7044 }
7045 @media (min-width: 1280px) { 7045 @media (min-width: 1280px) {
7046 .chatbox__list { 7046 .chatbox__list {
7047 gap: 40px; 7047 gap: 40px;
7048 } 7048 }
7049 } 7049 }
7050 .chatbox__item { 7050 .chatbox__item {
7051 display: -webkit-box; 7051 display: -webkit-box;
7052 display: -ms-flexbox; 7052 display: -ms-flexbox;
7053 display: flex; 7053 display: flex;
7054 -webkit-box-align: start; 7054 -webkit-box-align: start;
7055 -ms-flex-align: start; 7055 -ms-flex-align: start;
7056 align-items: flex-start; 7056 align-items: flex-start;
7057 -webkit-box-pack: justify; 7057 -webkit-box-pack: justify;
7058 -ms-flex-pack: justify; 7058 -ms-flex-pack: justify;
7059 justify-content: space-between; 7059 justify-content: space-between;
7060 -ms-flex-wrap: wrap; 7060 -ms-flex-wrap: wrap;
7061 flex-wrap: wrap; 7061 flex-wrap: wrap;
7062 color: #000; 7062 color: #000;
7063 font-size: 12px; 7063 font-size: 12px;
7064 } 7064 }
7065 @media (min-width: 768px) { 7065 @media (min-width: 768px) {
7066 .chatbox__item { 7066 .chatbox__item {
7067 font-size: 16px; 7067 font-size: 16px;
7068 } 7068 }
7069 } 7069 }
7070 .chatbox__item_reverse { 7070 .chatbox__item_reverse {
7071 -webkit-box-orient: horizontal; 7071 -webkit-box-orient: horizontal;
7072 -webkit-box-direction: reverse; 7072 -webkit-box-direction: reverse;
7073 -ms-flex-direction: row-reverse; 7073 -ms-flex-direction: row-reverse;
7074 flex-direction: row-reverse; 7074 flex-direction: row-reverse;
7075 } 7075 }
7076 .chatbox__item-photo { 7076 .chatbox__item-photo {
7077 position: relative; 7077 position: relative;
7078 aspect-ratio: 1/1; 7078 aspect-ratio: 1/1;
7079 overflow: hidden; 7079 overflow: hidden;
7080 background: #9c9d9d; 7080 background: #9c9d9d;
7081 color: #fff; 7081 color: #fff;
7082 width: 44px; 7082 width: 44px;
7083 border-radius: 6px; 7083 border-radius: 6px;
7084 display: -webkit-box; 7084 display: -webkit-box;
7085 display: -ms-flexbox; 7085 display: -ms-flexbox;
7086 display: flex; 7086 display: flex;
7087 -webkit-box-pack: center; 7087 -webkit-box-pack: center;
7088 -ms-flex-pack: center; 7088 -ms-flex-pack: center;
7089 justify-content: center; 7089 justify-content: center;
7090 -webkit-box-align: center; 7090 -webkit-box-align: center;
7091 -ms-flex-align: center; 7091 -ms-flex-align: center;
7092 align-items: center; 7092 align-items: center;
7093 } 7093 }
7094 .chatbox__item-photo svg { 7094 .chatbox__item-photo svg {
7095 width: 50%; 7095 width: 50%;
7096 position: relative; 7096 position: relative;
7097 z-index: 1; 7097 z-index: 1;
7098 } 7098 }
7099 .chatbox__item-photo img { 7099 .chatbox__item-photo img {
7100 position: absolute; 7100 position: absolute;
7101 z-index: 2; 7101 z-index: 2;
7102 top: 0; 7102 top: 0;
7103 left: 0; 7103 left: 0;
7104 width: 100%; 7104 width: 100%;
7105 height: 100%; 7105 height: 100%;
7106 -o-object-fit: cover; 7106 -o-object-fit: cover;
7107 object-fit: cover; 7107 object-fit: cover;
7108 } 7108 }
7109 .chatbox__item-body { 7109 .chatbox__item-body {
7110 width: calc(100% - 54px); 7110 width: calc(100% - 54px);
7111 display: -webkit-box; 7111 display: -webkit-box;
7112 display: -ms-flexbox; 7112 display: -ms-flexbox;
7113 display: flex; 7113 display: flex;
7114 -webkit-box-orient: vertical; 7114 -webkit-box-orient: vertical;
7115 -webkit-box-direction: normal; 7115 -webkit-box-direction: normal;
7116 -ms-flex-direction: column; 7116 -ms-flex-direction: column;
7117 flex-direction: column; 7117 flex-direction: column;
7118 -webkit-box-align: start; 7118 -webkit-box-align: start;
7119 -ms-flex-align: start; 7119 -ms-flex-align: start;
7120 align-items: flex-start; 7120 align-items: flex-start;
7121 } 7121 }
7122 @media (min-width: 768px) { 7122 @media (min-width: 768px) {
7123 .chatbox__item-body { 7123 .chatbox__item-body {
7124 width: calc(100% - 60px); 7124 width: calc(100% - 60px);
7125 } 7125 }
7126 } 7126 }
7127 .chatbox__item_reverse .chatbox__item-body { 7127 .chatbox__item_reverse .chatbox__item-body {
7128 -webkit-box-align: end; 7128 -webkit-box-align: end;
7129 -ms-flex-align: end; 7129 -ms-flex-align: end;
7130 align-items: flex-end; 7130 align-items: flex-end;
7131 } 7131 }
7132 .chatbox__item-text { 7132 .chatbox__item-text {
7133 border-radius: 8px; 7133 border-radius: 8px;
7134 background: #fff; 7134 background: #fff;
7135 -webkit-box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2); 7135 -webkit-box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2);
7136 box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2); 7136 box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2);
7137 padding: 10px; 7137 padding: 10px;
7138 line-height: 1.6; 7138 line-height: 1.6;
7139 } 7139 }
7140 .chatbox__item-time { 7140 .chatbox__item-time {
7141 width: 100%; 7141 width: 100%;
7142 padding-left: 54px; 7142 padding-left: 54px;
7143 margin-top: 10px; 7143 margin-top: 10px;
7144 color: #9c9d9d; 7144 color: #9c9d9d;
7145 } 7145 }
7146 .chatbox__item_reverse .chatbox__item-time { 7146 .chatbox__item_reverse .chatbox__item-time {
7147 text-align: right; 7147 text-align: right;
7148 } 7148 }
7149 .chatbox__bottom { 7149 .chatbox__bottom {
7150 background: #4d88d9; 7150 background: #4d88d9;
7151 padding: 10px; 7151 padding: 10px;
7152 border-radius: 8px; 7152 border-radius: 8px;
7153 display: -webkit-box; 7153 display: -webkit-box;
7154 display: -ms-flexbox; 7154 display: -ms-flexbox;
7155 display: flex; 7155 display: flex;
7156 -webkit-box-align: center; 7156 -webkit-box-align: center;
7157 -ms-flex-align: center; 7157 -ms-flex-align: center;
7158 align-items: center; 7158 align-items: center;
7159 -webkit-box-pack: justify; 7159 -webkit-box-pack: justify;
7160 -ms-flex-pack: justify; 7160 -ms-flex-pack: justify;
7161 justify-content: space-between; 7161 justify-content: space-between;
7162 } 7162 }
7163 @media (min-width: 768px) { 7163 @media (min-width: 768px) {
7164 .chatbox__bottom { 7164 .chatbox__bottom {
7165 padding: 16px 20px; 7165 padding: 16px 20px;
7166 } 7166 }
7167 } 7167 }
7168 .chatbox__bottom-file { 7168 .chatbox__bottom-file {
7169 width: 20px; 7169 width: 20px;
7170 aspect-ratio: 1/1; 7170 aspect-ratio: 1/1;
7171 display: -webkit-box; 7171 display: -webkit-box;
7172 display: -ms-flexbox; 7172 display: -ms-flexbox;
7173 display: flex; 7173 display: flex;
7174 -webkit-box-pack: center; 7174 -webkit-box-pack: center;
7175 -ms-flex-pack: center; 7175 -ms-flex-pack: center;
7176 justify-content: center; 7176 justify-content: center;
7177 -webkit-box-align: center; 7177 -webkit-box-align: center;
7178 -ms-flex-align: center; 7178 -ms-flex-align: center;
7179 align-items: center; 7179 align-items: center;
7180 background: #fff; 7180 background: #fff;
7181 color: #4d88d9; 7181 color: #4d88d9;
7182 border-radius: 8px; 7182 border-radius: 8px;
7183 } 7183 }
7184 @media (min-width: 768px) { 7184 @media (min-width: 768px) {
7185 .chatbox__bottom-file { 7185 .chatbox__bottom-file {
7186 width: 48px; 7186 width: 48px;
7187 } 7187 }
7188 } 7188 }
7189 .chatbox__bottom-file:hover { 7189 .chatbox__bottom-file:hover {
7190 color: #377d87; 7190 color: #377d87;
7191 } 7191 }
7192 .chatbox__bottom-file input { 7192 .chatbox__bottom-file input {
7193 display: none; 7193 display: none;
7194 } 7194 }
7195 .chatbox__bottom-file svg { 7195 .chatbox__bottom-file svg {
7196 width: 50%; 7196 width: 50%;
7197 aspect-ratio: 1/1; 7197 aspect-ratio: 1/1;
7198 } 7198 }
7199 @media (min-width: 768px) { 7199 @media (min-width: 768px) {
7200 .chatbox__bottom-file svg { 7200 .chatbox__bottom-file svg {
7201 width: 40%; 7201 width: 40%;
7202 } 7202 }
7203 } 7203 }
7204 .chatbox__bottom-text { 7204 .chatbox__bottom-text {
7205 width: calc(100% - 60px); 7205 width: calc(100% - 60px);
7206 height: 20px; 7206 height: 20px;
7207 border-color: #fff; 7207 border-color: #fff;
7208 } 7208 }
7209 @media (min-width: 768px) { 7209 @media (min-width: 768px) {
7210 .chatbox__bottom-text { 7210 .chatbox__bottom-text {
7211 width: calc(100% - 128px); 7211 width: calc(100% - 128px);
7212 height: 48px; 7212 height: 48px;
7213 } 7213 }
7214 } 7214 }
7215 .chatbox__bottom-text:focus { 7215 .chatbox__bottom-text:focus {
7216 border-color: #fff; 7216 border-color: #fff;
7217 } 7217 }
7218 .chatbox__bottom-send { 7218 .chatbox__bottom-send {
7219 width: 20px; 7219 width: 20px;
7220 aspect-ratio: 1/1; 7220 aspect-ratio: 1/1;
7221 display: -webkit-box; 7221 display: -webkit-box;
7222 display: -ms-flexbox; 7222 display: -ms-flexbox;
7223 display: flex; 7223 display: flex;
7224 -webkit-box-pack: center; 7224 -webkit-box-pack: center;
7225 -ms-flex-pack: center; 7225 -ms-flex-pack: center;
7226 justify-content: center; 7226 justify-content: center;
7227 -webkit-box-align: center; 7227 -webkit-box-align: center;
7228 -ms-flex-align: center; 7228 -ms-flex-align: center;
7229 align-items: center; 7229 align-items: center;
7230 padding: 0; 7230 padding: 0;
7231 background: #fff; 7231 background: #fff;
7232 border: none; 7232 border: none;
7233 color: #4d88d9; 7233 color: #4d88d9;
7234 border-radius: 999px; 7234 border-radius: 999px;
7235 } 7235 }
7236 @media (min-width: 768px) { 7236 @media (min-width: 768px) {
7237 .chatbox__bottom-send { 7237 .chatbox__bottom-send {
7238 width: 48px; 7238 width: 48px;
7239 } 7239 }
7240 } 7240 }
7241 .chatbox__bottom-send:hover { 7241 .chatbox__bottom-send:hover {
7242 color: #377d87; 7242 color: #377d87;
7243 } 7243 }
7244 .chatbox__bottom-send svg { 7244 .chatbox__bottom-send svg {
7245 width: 50%; 7245 width: 50%;
7246 aspect-ratio: 1/1; 7246 aspect-ratio: 1/1;
7247 position: relative; 7247 position: relative;
7248 left: 1px; 7248 left: 1px;
7249 } 7249 }
7250 @media (min-width: 768px) { 7250 @media (min-width: 768px) {
7251 .chatbox__bottom-send svg { 7251 .chatbox__bottom-send svg {
7252 width: 40%; 7252 width: 40%;
7253 left: 2px; 7253 left: 2px;
7254 } 7254 }
7255 } 7255 }
7256 7256
7257 .cvs { 7257 .cvs {
7258 display: -webkit-box; 7258 display: -webkit-box;
7259 display: -ms-flexbox; 7259 display: -ms-flexbox;
7260 display: flex; 7260 display: flex;
7261 -webkit-box-orient: vertical; 7261 -webkit-box-orient: vertical;
7262 -webkit-box-direction: reverse; 7262 -webkit-box-direction: reverse;
7263 -ms-flex-direction: column-reverse; 7263 -ms-flex-direction: column-reverse;
7264 flex-direction: column-reverse; 7264 flex-direction: column-reverse;
7265 -webkit-box-align: center; 7265 -webkit-box-align: center;
7266 -ms-flex-align: center; 7266 -ms-flex-align: center;
7267 align-items: center; 7267 align-items: center;
7268 gap: 20px; 7268 gap: 20px;
7269 } 7269 }
7270 .cvs__body { 7270 .cvs__body {
7271 display: -webkit-box; 7271 display: -webkit-box;
7272 display: -ms-flexbox; 7272 display: -ms-flexbox;
7273 display: flex; 7273 display: flex;
7274 -webkit-box-orient: vertical; 7274 -webkit-box-orient: vertical;
7275 -webkit-box-direction: normal; 7275 -webkit-box-direction: normal;
7276 -ms-flex-direction: column; 7276 -ms-flex-direction: column;
7277 flex-direction: column; 7277 flex-direction: column;
7278 gap: 20px; 7278 gap: 20px;
7279 width: 100%; 7279 width: 100%;
7280 } 7280 }
7281 @media (min-width: 768px) { 7281 @media (min-width: 768px) {
7282 .cvs__body { 7282 .cvs__body {
7283 gap: 30px; 7283 gap: 30px;
7284 } 7284 }
7285 } 7285 }
7286 .cvs__item { 7286 .cvs__item {
7287 display: none; 7287 display: none;
7288 -webkit-box-orient: vertical; 7288 -webkit-box-orient: vertical;
7289 -webkit-box-direction: normal; 7289 -webkit-box-direction: normal;
7290 -ms-flex-direction: column; 7290 -ms-flex-direction: column;
7291 flex-direction: column; 7291 flex-direction: column;
7292 gap: 10px; 7292 gap: 10px;
7293 border-radius: 8px; 7293 border-radius: 8px;
7294 border: 1px solid #e7e7e7; 7294 border: 1px solid #e7e7e7;
7295 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 7295 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
7296 padding: 10px; 7296 padding: 10px;
7297 font-size: 12px; 7297 font-size: 12px;
7298 position: relative; 7298 position: relative;
7299 } 7299 }
7300 @media (min-width: 768px) { 7300 @media (min-width: 768px) {
7301 .cvs__item { 7301 .cvs__item {
7302 gap: 0; 7302 gap: 0;
7303 padding: 20px; 7303 padding: 20px;
7304 font-size: 16px; 7304 font-size: 16px;
7305 -webkit-box-orient: horizontal; 7305 -webkit-box-orient: horizontal;
7306 -webkit-box-direction: normal; 7306 -webkit-box-direction: normal;
7307 -ms-flex-direction: row; 7307 -ms-flex-direction: row;
7308 flex-direction: row; 7308 flex-direction: row;
7309 -webkit-box-align: start; 7309 -webkit-box-align: start;
7310 -ms-flex-align: start; 7310 -ms-flex-align: start;
7311 align-items: flex-start; 7311 align-items: flex-start;
7312 -ms-flex-wrap: wrap; 7312 -ms-flex-wrap: wrap;
7313 flex-wrap: wrap; 7313 flex-wrap: wrap;
7314 } 7314 }
7315 } 7315 }
7316 .cvs__item:nth-of-type(1), .cvs__item:nth-of-type(2), .cvs__item:nth-of-type(3), .cvs__item:nth-of-type(4), .cvs__item:nth-of-type(5), .cvs__item:nth-of-type(6) { 7316 .cvs__item:nth-of-type(1), .cvs__item:nth-of-type(2), .cvs__item:nth-of-type(3), .cvs__item:nth-of-type(4), .cvs__item:nth-of-type(5), .cvs__item:nth-of-type(6) {
7317 display: -webkit-box; 7317 display: -webkit-box;
7318 display: -ms-flexbox; 7318 display: -ms-flexbox;
7319 display: flex; 7319 display: flex;
7320 } 7320 }
7321 .cvs__item-like { 7321 .cvs__item-like {
7322 position: absolute; 7322 position: absolute;
7323 top: 10px; 7323 top: 10px;
7324 right: 10px; 7324 right: 10px;
7325 } 7325 }
7326 @media (min-width: 768px) { 7326 @media (min-width: 768px) {
7327 .cvs__item-like { 7327 .cvs__item-like {
7328 top: 20px; 7328 top: 20px;
7329 right: 20px; 7329 right: 20px;
7330 } 7330 }
7331 } 7331 }
7332 .cvs__item-photo { 7332 .cvs__item-photo {
7333 position: relative; 7333 position: relative;
7334 aspect-ratio: 1/1; 7334 aspect-ratio: 1/1;
7335 overflow: hidden; 7335 overflow: hidden;
7336 background: #9c9d9d; 7336 background: #9c9d9d;
7337 color: #fff; 7337 color: #fff;
7338 width: 36px; 7338 width: 36px;
7339 border-radius: 6px; 7339 border-radius: 6px;
7340 display: -webkit-box; 7340 display: -webkit-box;
7341 display: -ms-flexbox; 7341 display: -ms-flexbox;
7342 display: flex; 7342 display: flex;
7343 -webkit-box-pack: center; 7343 -webkit-box-pack: center;
7344 -ms-flex-pack: center; 7344 -ms-flex-pack: center;
7345 justify-content: center; 7345 justify-content: center;
7346 -webkit-box-align: center; 7346 -webkit-box-align: center;
7347 -ms-flex-align: center; 7347 -ms-flex-align: center;
7348 align-items: center; 7348 align-items: center;
7349 } 7349 }
7350 @media (min-width: 768px) { 7350 @media (min-width: 768px) {
7351 .cvs__item-photo { 7351 .cvs__item-photo {
7352 width: 68px; 7352 width: 68px;
7353 } 7353 }
7354 } 7354 }
7355 .cvs__item-photo svg { 7355 .cvs__item-photo svg {
7356 width: 50%; 7356 width: 50%;
7357 position: relative; 7357 position: relative;
7358 z-index: 1; 7358 z-index: 1;
7359 } 7359 }
7360 .cvs__item-photo img { 7360 .cvs__item-photo img {
7361 position: absolute; 7361 position: absolute;
7362 z-index: 2; 7362 z-index: 2;
7363 top: 0; 7363 top: 0;
7364 left: 0; 7364 left: 0;
7365 width: 100%; 7365 width: 100%;
7366 height: 100%; 7366 height: 100%;
7367 -o-object-fit: cover; 7367 -o-object-fit: cover;
7368 object-fit: cover; 7368 object-fit: cover;
7369 } 7369 }
7370 .cvs__item-text { 7370 .cvs__item-text {
7371 display: -webkit-box; 7371 display: -webkit-box;
7372 display: -ms-flexbox; 7372 display: -ms-flexbox;
7373 display: flex; 7373 display: flex;
7374 -webkit-box-orient: vertical; 7374 -webkit-box-orient: vertical;
7375 -webkit-box-direction: normal; 7375 -webkit-box-direction: normal;
7376 -ms-flex-direction: column; 7376 -ms-flex-direction: column;
7377 flex-direction: column; 7377 flex-direction: column;
7378 gap: 10px; 7378 gap: 10px;
7379 } 7379 }
7380 @media (min-width: 768px) { 7380 @media (min-width: 768px) {
7381 .cvs__item-text { 7381 .cvs__item-text {
7382 gap: 20px; 7382 gap: 20px;
7383 width: calc(100% - 68px); 7383 width: calc(100% - 68px);
7384 padding-left: 20px; 7384 padding-left: 20px;
7385 padding-right: 60px; 7385 padding-right: 60px;
7386 } 7386 }
7387 } 7387 }
7388 .cvs__item-text div { 7388 .cvs__item-text div {
7389 display: -webkit-box; 7389 display: -webkit-box;
7390 display: -ms-flexbox; 7390 display: -ms-flexbox;
7391 display: flex; 7391 display: flex;
7392 -webkit-box-align: center; 7392 -webkit-box-align: center;
7393 -ms-flex-align: center; 7393 -ms-flex-align: center;
7394 align-items: center; 7394 align-items: center;
7395 -webkit-box-pack: justify; 7395 -webkit-box-pack: justify;
7396 -ms-flex-pack: justify; 7396 -ms-flex-pack: justify;
7397 justify-content: space-between; 7397 justify-content: space-between;
7398 } 7398 }
7399 @media (min-width: 768px) { 7399 @media (min-width: 768px) {
7400 .cvs__item-text div { 7400 .cvs__item-text div {
7401 -webkit-box-orient: vertical; 7401 -webkit-box-orient: vertical;
7402 -webkit-box-direction: normal; 7402 -webkit-box-direction: normal;
7403 -ms-flex-direction: column; 7403 -ms-flex-direction: column;
7404 flex-direction: column; 7404 flex-direction: column;
7405 -webkit-box-pack: start; 7405 -webkit-box-pack: start;
7406 -ms-flex-pack: start; 7406 -ms-flex-pack: start;
7407 justify-content: flex-start; 7407 justify-content: flex-start;
7408 -webkit-box-align: start; 7408 -webkit-box-align: start;
7409 -ms-flex-align: start; 7409 -ms-flex-align: start;
7410 align-items: flex-start; 7410 align-items: flex-start;
7411 } 7411 }
7412 } 7412 }
7413 .cvs__item-text span, 7413 .cvs__item-text span,
7414 .cvs__item-text a { 7414 .cvs__item-text a {
7415 color: #000; 7415 color: #000;
7416 } 7416 }
7417 .cvs__item-button { 7417 .cvs__item-button {
7418 display: -webkit-box; 7418 display: -webkit-box;
7419 display: -ms-flexbox; 7419 display: -ms-flexbox;
7420 display: flex; 7420 display: flex;
7421 -webkit-box-orient: vertical; 7421 -webkit-box-orient: vertical;
7422 -webkit-box-direction: normal; 7422 -webkit-box-direction: normal;
7423 -ms-flex-direction: column; 7423 -ms-flex-direction: column;
7424 flex-direction: column; 7424 flex-direction: column;
7425 -webkit-box-align: center; 7425 -webkit-box-align: center;
7426 -ms-flex-align: center; 7426 -ms-flex-align: center;
7427 align-items: center; 7427 align-items: center;
7428 } 7428 }
7429 @media (min-width: 768px) { 7429 @media (min-width: 768px) {
7430 .cvs__item-button { 7430 .cvs__item-button {
7431 -webkit-box-align: end; 7431 -webkit-box-align: end;
7432 -ms-flex-align: end; 7432 -ms-flex-align: end;
7433 align-items: flex-end; 7433 align-items: flex-end;
7434 width: 100%; 7434 width: 100%;
7435 padding-top: 20px; 7435 padding-top: 20px;
7436 } 7436 }
7437 } 7437 }
7438 .cvs.active .cvs__item { 7438 .cvs.active .cvs__item {
7439 display: -webkit-box; 7439 display: -webkit-box;
7440 display: -ms-flexbox; 7440 display: -ms-flexbox;
7441 display: flex; 7441 display: flex;
7442 } 7442 }
7443 7443
7444 .faqs { 7444 .faqs {
7445 display: -webkit-box; 7445 display: -webkit-box;
7446 display: -ms-flexbox; 7446 display: -ms-flexbox;
7447 display: flex; 7447 display: flex;
7448 -webkit-box-orient: vertical; 7448 -webkit-box-orient: vertical;
7449 -webkit-box-direction: reverse; 7449 -webkit-box-direction: reverse;
7450 -ms-flex-direction: column-reverse; 7450 -ms-flex-direction: column-reverse;
7451 flex-direction: column-reverse; 7451 flex-direction: column-reverse;
7452 -webkit-box-align: center; 7452 -webkit-box-align: center;
7453 -ms-flex-align: center; 7453 -ms-flex-align: center;
7454 align-items: center; 7454 align-items: center;
7455 gap: 20px; 7455 gap: 20px;
7456 } 7456 }
7457 .faqs__body { 7457 .faqs__body {
7458 display: -webkit-box; 7458 display: -webkit-box;
7459 display: -ms-flexbox; 7459 display: -ms-flexbox;
7460 display: flex; 7460 display: flex;
7461 -webkit-box-orient: vertical; 7461 -webkit-box-orient: vertical;
7462 -webkit-box-direction: normal; 7462 -webkit-box-direction: normal;
7463 -ms-flex-direction: column; 7463 -ms-flex-direction: column;
7464 flex-direction: column; 7464 flex-direction: column;
7465 gap: 20px; 7465 gap: 20px;
7466 width: 100%; 7466 width: 100%;
7467 } 7467 }
7468 .faqs__item { 7468 .faqs__item {
7469 display: none; 7469 display: none;
7470 -webkit-box-orient: vertical; 7470 -webkit-box-orient: vertical;
7471 -webkit-box-direction: normal; 7471 -webkit-box-direction: normal;
7472 -ms-flex-direction: column; 7472 -ms-flex-direction: column;
7473 flex-direction: column; 7473 flex-direction: column;
7474 border-radius: 8px; 7474 border-radius: 8px;
7475 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 7475 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
7476 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 7476 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
7477 background: #fff; 7477 background: #fff;
7478 padding: 10px; 7478 padding: 10px;
7479 font-size: 12px; 7479 font-size: 12px;
7480 } 7480 }
7481 @media (min-width: 768px) { 7481 @media (min-width: 768px) {
7482 .faqs__item { 7482 .faqs__item {
7483 padding: 20px; 7483 padding: 20px;
7484 font-size: 16px; 7484 font-size: 16px;
7485 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 7485 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
7486 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 7486 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
7487 } 7487 }
7488 } 7488 }
7489 .faqs__item:nth-of-type(1), .faqs__item:nth-of-type(2), .faqs__item:nth-of-type(3), .faqs__item:nth-of-type(4), .faqs__item:nth-of-type(5), .faqs__item:nth-of-type(6) { 7489 .faqs__item:nth-of-type(1), .faqs__item:nth-of-type(2), .faqs__item:nth-of-type(3), .faqs__item:nth-of-type(4), .faqs__item:nth-of-type(5), .faqs__item:nth-of-type(6) {
7490 display: -webkit-box; 7490 display: -webkit-box;
7491 display: -ms-flexbox; 7491 display: -ms-flexbox;
7492 display: flex; 7492 display: flex;
7493 } 7493 }
7494 .faqs__item-button { 7494 .faqs__item-button {
7495 background: none; 7495 background: none;
7496 padding: 0; 7496 padding: 0;
7497 border: none; 7497 border: none;
7498 display: -webkit-box; 7498 display: -webkit-box;
7499 display: -ms-flexbox; 7499 display: -ms-flexbox;
7500 display: flex; 7500 display: flex;
7501 -webkit-box-align: center; 7501 -webkit-box-align: center;
7502 -ms-flex-align: center; 7502 -ms-flex-align: center;
7503 align-items: center; 7503 align-items: center;
7504 color: #000; 7504 color: #000;
7505 text-align: left; 7505 text-align: left;
7506 font-size: 14px; 7506 font-size: 14px;
7507 font-weight: 700; 7507 font-weight: 700;
7508 } 7508 }
7509 @media (min-width: 768px) { 7509 @media (min-width: 768px) {
7510 .faqs__item-button { 7510 .faqs__item-button {
7511 font-size: 20px; 7511 font-size: 20px;
7512 } 7512 }
7513 } 7513 }
7514 .faqs__item-button span { 7514 .faqs__item-button span {
7515 width: calc(100% - 16px); 7515 width: calc(100% - 16px);
7516 padding-right: 16px; 7516 padding-right: 16px;
7517 } 7517 }
7518 .faqs__item-button i { 7518 .faqs__item-button i {
7519 display: -webkit-box; 7519 display: -webkit-box;
7520 display: -ms-flexbox; 7520 display: -ms-flexbox;
7521 display: flex; 7521 display: flex;
7522 -webkit-box-pack: center; 7522 -webkit-box-pack: center;
7523 -ms-flex-pack: center; 7523 -ms-flex-pack: center;
7524 justify-content: center; 7524 justify-content: center;
7525 -webkit-box-align: center; 7525 -webkit-box-align: center;
7526 -ms-flex-align: center; 7526 -ms-flex-align: center;
7527 align-items: center; 7527 align-items: center;
7528 width: 16px; 7528 width: 16px;
7529 aspect-ratio: 1/1; 7529 aspect-ratio: 1/1;
7530 color: #377d87; 7530 color: #377d87;
7531 -webkit-transition: 0.3s; 7531 -webkit-transition: 0.3s;
7532 transition: 0.3s; 7532 transition: 0.3s;
7533 } 7533 }
7534 .faqs__item-button i svg { 7534 .faqs__item-button i svg {
7535 width: 16px; 7535 width: 16px;
7536 aspect-ratio: 1/1; 7536 aspect-ratio: 1/1;
7537 -webkit-transform: rotate(90deg); 7537 -webkit-transform: rotate(90deg);
7538 -ms-transform: rotate(90deg); 7538 -ms-transform: rotate(90deg);
7539 transform: rotate(90deg); 7539 transform: rotate(90deg);
7540 } 7540 }
7541 .faqs__item-button.active i { 7541 .faqs__item-button.active i {
7542 -webkit-transform: rotate(180deg); 7542 -webkit-transform: rotate(180deg);
7543 -ms-transform: rotate(180deg); 7543 -ms-transform: rotate(180deg);
7544 transform: rotate(180deg); 7544 transform: rotate(180deg);
7545 } 7545 }
7546 .faqs__item-body { 7546 .faqs__item-body {
7547 display: -webkit-box; 7547 display: -webkit-box;
7548 display: -ms-flexbox; 7548 display: -ms-flexbox;
7549 display: flex; 7549 display: flex;
7550 -webkit-box-orient: vertical; 7550 -webkit-box-orient: vertical;
7551 -webkit-box-direction: normal; 7551 -webkit-box-direction: normal;
7552 -ms-flex-direction: column; 7552 -ms-flex-direction: column;
7553 flex-direction: column; 7553 flex-direction: column;
7554 gap: 10px; 7554 gap: 10px;
7555 opacity: 0; 7555 opacity: 0;
7556 height: 0; 7556 height: 0;
7557 overflow: hidden; 7557 overflow: hidden;
7558 font-size: 12px; 7558 font-size: 12px;
7559 line-height: 1.4; 7559 line-height: 1.4;
7560 } 7560 }
7561 @media (min-width: 768px) { 7561 @media (min-width: 768px) {
7562 .faqs__item-body { 7562 .faqs__item-body {
7563 font-size: 16px; 7563 font-size: 16px;
7564 gap: 20px; 7564 gap: 20px;
7565 } 7565 }
7566 } 7566 }
7567 .faqs__item-body p { 7567 .faqs__item-body p {
7568 margin: 0; 7568 margin: 0;
7569 } 7569 }
7570 .active + .faqs__item-body { 7570 .active + .faqs__item-body {
7571 opacity: 1; 7571 opacity: 1;
7572 height: auto; 7572 height: auto;
7573 -webkit-transition: 0.3s; 7573 -webkit-transition: 0.3s;
7574 transition: 0.3s; 7574 transition: 0.3s;
7575 padding-top: 10px; 7575 padding-top: 10px;
7576 } 7576 }
7577 @media (min-width: 768px) { 7577 @media (min-width: 768px) {
7578 .active + .faqs__item-body { 7578 .active + .faqs__item-body {
7579 padding-top: 20px; 7579 padding-top: 20px;
7580 } 7580 }
7581 } 7581 }
7582 .faqs.active .faqs__item { 7582 .faqs.active .faqs__item {
7583 display: -webkit-box; 7583 display: -webkit-box;
7584 display: -ms-flexbox; 7584 display: -ms-flexbox;
7585 display: flex; 7585 display: flex;
7586 } 7586 }
7587 7587
7588 .cabinet { 7588 .cabinet {
7589 padding: 20px 0; 7589 padding: 20px 0;
7590 padding-bottom: 40px; 7590 padding-bottom: 40px;
7591 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 7591 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
7592 } 7592 }
7593 @media (min-width: 992px) { 7593 @media (min-width: 992px) {
7594 .cabinet { 7594 .cabinet {
7595 padding: 30px 0; 7595 padding: 30px 0;
7596 padding-bottom: 60px; 7596 padding-bottom: 60px;
7597 } 7597 }
7598 } 7598 }
7599 .cabinet__breadcrumbs { 7599 .cabinet__breadcrumbs {
7600 margin-bottom: 50px; 7600 margin-bottom: 50px;
7601 } 7601 }
7602 .cabinet__wrapper { 7602 .cabinet__wrapper {
7603 display: -webkit-box; 7603 display: -webkit-box;
7604 display: -ms-flexbox; 7604 display: -ms-flexbox;
7605 display: flex; 7605 display: flex;
7606 -webkit-box-orient: vertical; 7606 -webkit-box-orient: vertical;
7607 -webkit-box-direction: normal; 7607 -webkit-box-direction: normal;
7608 -ms-flex-direction: column; 7608 -ms-flex-direction: column;
7609 flex-direction: column; 7609 flex-direction: column;
7610 } 7610 }
7611 @media (min-width: 992px) { 7611 @media (min-width: 992px) {
7612 .cabinet__wrapper { 7612 .cabinet__wrapper {
7613 -webkit-box-orient: horizontal; 7613 -webkit-box-orient: horizontal;
7614 -webkit-box-direction: normal; 7614 -webkit-box-direction: normal;
7615 -ms-flex-direction: row; 7615 -ms-flex-direction: row;
7616 flex-direction: row; 7616 flex-direction: row;
7617 -webkit-box-align: start; 7617 -webkit-box-align: start;
7618 -ms-flex-align: start; 7618 -ms-flex-align: start;
7619 align-items: flex-start; 7619 align-items: flex-start;
7620 -webkit-box-pack: justify; 7620 -webkit-box-pack: justify;
7621 -ms-flex-pack: justify; 7621 -ms-flex-pack: justify;
7622 justify-content: space-between; 7622 justify-content: space-between;
7623 } 7623 }
7624 } 7624 }
7625 .cabinet__side { 7625 .cabinet__side {
7626 border-radius: 8px; 7626 border-radius: 8px;
7627 background: #fff; 7627 background: #fff;
7628 padding: 20px 10px; 7628 padding: 20px 10px;
7629 display: -webkit-box; 7629 display: -webkit-box;
7630 display: -ms-flexbox; 7630 display: -ms-flexbox;
7631 display: flex; 7631 display: flex;
7632 -webkit-box-orient: vertical; 7632 -webkit-box-orient: vertical;
7633 -webkit-box-direction: normal; 7633 -webkit-box-direction: normal;
7634 -ms-flex-direction: column; 7634 -ms-flex-direction: column;
7635 flex-direction: column; 7635 flex-direction: column;
7636 gap: 30px; 7636 gap: 30px;
7637 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 7637 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
7638 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 7638 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
7639 } 7639 }
7640 @media (min-width: 768px) { 7640 @media (min-width: 768px) {
7641 .cabinet__side { 7641 .cabinet__side {
7642 padding: 30px 20px; 7642 padding: 30px 20px;
7643 margin-bottom: 50px; 7643 margin-bottom: 50px;
7644 } 7644 }
7645 } 7645 }
7646 @media (min-width: 992px) { 7646 @media (min-width: 992px) {
7647 .cabinet__side { 7647 .cabinet__side {
7648 width: 340px; 7648 width: 340px;
7649 margin: 0; 7649 margin: 0;
7650 position: sticky; 7650 position: sticky;
7651 top: 6px; 7651 top: 6px;
7652 } 7652 }
7653 } 7653 }
7654 @media (min-width: 1280px) { 7654 @media (min-width: 1280px) {
7655 .cabinet__side { 7655 .cabinet__side {
7656 width: 400px; 7656 width: 400px;
7657 } 7657 }
7658 } 7658 }
7659 .cabinet__side-item { 7659 .cabinet__side-item {
7660 display: -webkit-box; 7660 display: -webkit-box;
7661 display: -ms-flexbox; 7661 display: -ms-flexbox;
7662 display: flex; 7662 display: flex;
7663 -webkit-box-orient: vertical; 7663 -webkit-box-orient: vertical;
7664 -webkit-box-direction: normal; 7664 -webkit-box-direction: normal;
7665 -ms-flex-direction: column; 7665 -ms-flex-direction: column;
7666 flex-direction: column; 7666 flex-direction: column;
7667 gap: 20px; 7667 gap: 20px;
7668 } 7668 }
7669 .cabinet__side-toper { 7669 .cabinet__side-toper {
7670 display: -webkit-box; 7670 display: -webkit-box;
7671 display: -ms-flexbox; 7671 display: -ms-flexbox;
7672 display: flex; 7672 display: flex;
7673 -webkit-box-align: center; 7673 -webkit-box-align: center;
7674 -ms-flex-align: center; 7674 -ms-flex-align: center;
7675 align-items: center; 7675 align-items: center;
7676 } 7676 }
7677 .cabinet__side-toper-pic { 7677 .cabinet__side-toper-pic {
7678 width: 70px; 7678 width: 70px;
7679 aspect-ratio: 1/1; 7679 aspect-ratio: 1/1;
7680 overflow: hidden; 7680 overflow: hidden;
7681 border-radius: 8px; 7681 border-radius: 8px;
7682 color: #fff; 7682 color: #fff;
7683 background: #9c9d9d; 7683 background: #9c9d9d;
7684 display: -webkit-box; 7684 display: -webkit-box;
7685 display: -ms-flexbox; 7685 display: -ms-flexbox;
7686 display: flex; 7686 display: flex;
7687 -webkit-box-align: center; 7687 -webkit-box-align: center;
7688 -ms-flex-align: center; 7688 -ms-flex-align: center;
7689 align-items: center; 7689 align-items: center;
7690 -webkit-box-pack: center; 7690 -webkit-box-pack: center;
7691 -ms-flex-pack: center; 7691 -ms-flex-pack: center;
7692 justify-content: center; 7692 justify-content: center;
7693 position: relative; 7693 position: relative;
7694 } 7694 }
7695 .cabinet__side-toper-pic img { 7695 .cabinet__side-toper-pic img {
7696 width: 100%; 7696 width: 100%;
7697 height: 100%; 7697 height: 100%;
7698 -o-object-fit: cover; 7698 -o-object-fit: cover;
7699 object-fit: cover; 7699 object-fit: cover;
7700 position: absolute; 7700 position: absolute;
7701 z-index: 2; 7701 z-index: 2;
7702 top: 0; 7702 top: 0;
7703 left: 0; 7703 left: 0;
7704 aspect-ratio: 1/1; 7704 aspect-ratio: 1/1;
7705 -o-object-fit: contain; 7705 -o-object-fit: contain;
7706 object-fit: contain; 7706 object-fit: contain;
7707 } 7707 }
7708 .cabinet__side-toper-pic svg { 7708 .cabinet__side-toper-pic svg {
7709 width: 50%; 7709 width: 50%;
7710 aspect-ratio: 1/1; 7710 aspect-ratio: 1/1;
7711 } 7711 }
7712 .cabinet__side-toper b { 7712 .cabinet__side-toper b {
7713 width: calc(100% - 70px); 7713 width: calc(100% - 70px);
7714 font-size: 14px; 7714 font-size: 14px;
7715 font-weight: 700; 7715 font-weight: 700;
7716 padding-left: 16px; 7716 padding-left: 16px;
7717 } 7717 }
7718 @media (min-width: 768px) { 7718 @media (min-width: 768px) {
7719 .cabinet__side-toper b { 7719 .cabinet__side-toper b {
7720 font-size: 20px; 7720 font-size: 20px;
7721 } 7721 }
7722 } 7722 }
7723 .cabinet__menu { 7723 .cabinet__menu {
7724 display: -webkit-box; 7724 display: -webkit-box;
7725 display: -ms-flexbox; 7725 display: -ms-flexbox;
7726 display: flex; 7726 display: flex;
7727 -webkit-box-orient: vertical; 7727 -webkit-box-orient: vertical;
7728 -webkit-box-direction: normal; 7728 -webkit-box-direction: normal;
7729 -ms-flex-direction: column; 7729 -ms-flex-direction: column;
7730 flex-direction: column; 7730 flex-direction: column;
7731 } 7731 }
7732 .cabinet__menu-toper { 7732 .cabinet__menu-toper {
7733 display: -webkit-box; 7733 display: -webkit-box;
7734 display: -ms-flexbox; 7734 display: -ms-flexbox;
7735 display: flex; 7735 display: flex;
7736 -webkit-box-align: center; 7736 -webkit-box-align: center;
7737 -ms-flex-align: center; 7737 -ms-flex-align: center;
7738 align-items: center; 7738 align-items: center;
7739 -webkit-box-pack: justify; 7739 -webkit-box-pack: justify;
7740 -ms-flex-pack: justify; 7740 -ms-flex-pack: justify;
7741 justify-content: space-between; 7741 justify-content: space-between;
7742 padding: 0 16px; 7742 padding: 0 16px;
7743 padding-right: 12px; 7743 padding-right: 12px;
7744 border: none; 7744 border: none;
7745 border-radius: 8px; 7745 border-radius: 8px;
7746 background: #377d87; 7746 background: #377d87;
7747 color: #fff; 7747 color: #fff;
7748 } 7748 }
7749 @media (min-width: 768px) { 7749 @media (min-width: 768px) {
7750 .cabinet__menu-toper { 7750 .cabinet__menu-toper {
7751 padding: 0 20px; 7751 padding: 0 20px;
7752 } 7752 }
7753 } 7753 }
7754 @media (min-width: 992px) { 7754 @media (min-width: 992px) {
7755 .cabinet__menu-toper { 7755 .cabinet__menu-toper {
7756 display: none; 7756 display: none;
7757 } 7757 }
7758 } 7758 }
7759 .cabinet__menu-toper-text { 7759 .cabinet__menu-toper-text {
7760 width: calc(100% - 16px); 7760 width: calc(100% - 16px);
7761 display: -webkit-box; 7761 display: -webkit-box;
7762 display: -ms-flexbox; 7762 display: -ms-flexbox;
7763 display: flex; 7763 display: flex;
7764 -webkit-box-align: center; 7764 -webkit-box-align: center;
7765 -ms-flex-align: center; 7765 -ms-flex-align: center;
7766 align-items: center; 7766 align-items: center;
7767 } 7767 }
7768 @media (min-width: 768px) { 7768 @media (min-width: 768px) {
7769 .cabinet__menu-toper-text { 7769 .cabinet__menu-toper-text {
7770 width: calc(100% - 20px); 7770 width: calc(100% - 20px);
7771 } 7771 }
7772 } 7772 }
7773 .cabinet__menu-toper-text i { 7773 .cabinet__menu-toper-text i {
7774 width: 16px; 7774 width: 16px;
7775 height: 16px; 7775 height: 16px;
7776 display: -webkit-box; 7776 display: -webkit-box;
7777 display: -ms-flexbox; 7777 display: -ms-flexbox;
7778 display: flex; 7778 display: flex;
7779 -webkit-box-align: center; 7779 -webkit-box-align: center;
7780 -ms-flex-align: center; 7780 -ms-flex-align: center;
7781 align-items: center; 7781 align-items: center;
7782 -webkit-box-pack: center; 7782 -webkit-box-pack: center;
7783 -ms-flex-pack: center; 7783 -ms-flex-pack: center;
7784 justify-content: center; 7784 justify-content: center;
7785 } 7785 }
7786 @media (min-width: 768px) { 7786 @media (min-width: 768px) {
7787 .cabinet__menu-toper-text i { 7787 .cabinet__menu-toper-text i {
7788 width: 22px; 7788 width: 22px;
7789 height: 22px; 7789 height: 22px;
7790 } 7790 }
7791 } 7791 }
7792 .cabinet__menu-toper-text svg { 7792 .cabinet__menu-toper-text svg {
7793 width: 16px; 7793 width: 16px;
7794 height: 16px; 7794 height: 16px;
7795 } 7795 }
7796 @media (min-width: 768px) { 7796 @media (min-width: 768px) {
7797 .cabinet__menu-toper-text svg { 7797 .cabinet__menu-toper-text svg {
7798 width: 22px; 7798 width: 22px;
7799 height: 22px; 7799 height: 22px;
7800 } 7800 }
7801 } 7801 }
7802 .cabinet__menu-toper-text span { 7802 .cabinet__menu-toper-text span {
7803 display: -webkit-box; 7803 display: -webkit-box;
7804 display: -ms-flexbox; 7804 display: -ms-flexbox;
7805 display: flex; 7805 display: flex;
7806 -webkit-box-align: center; 7806 -webkit-box-align: center;
7807 -ms-flex-align: center; 7807 -ms-flex-align: center;
7808 align-items: center; 7808 align-items: center;
7809 padding: 0 10px; 7809 padding: 0 10px;
7810 min-height: 30px; 7810 min-height: 30px;
7811 font-size: 12px; 7811 font-size: 12px;
7812 width: calc(100% - 16px); 7812 width: calc(100% - 16px);
7813 } 7813 }
7814 @media (min-width: 768px) { 7814 @media (min-width: 768px) {
7815 .cabinet__menu-toper-text span { 7815 .cabinet__menu-toper-text span {
7816 width: calc(100% - 22px); 7816 width: calc(100% - 22px);
7817 font-size: 20px; 7817 font-size: 20px;
7818 min-height: 52px; 7818 min-height: 52px;
7819 padding: 0 16px; 7819 padding: 0 16px;
7820 } 7820 }
7821 } 7821 }
7822 .cabinet__menu-toper-arrow { 7822 .cabinet__menu-toper-arrow {
7823 width: 16px; 7823 width: 16px;
7824 height: 16px; 7824 height: 16px;
7825 display: -webkit-box; 7825 display: -webkit-box;
7826 display: -ms-flexbox; 7826 display: -ms-flexbox;
7827 display: flex; 7827 display: flex;
7828 -webkit-box-pack: center; 7828 -webkit-box-pack: center;
7829 -ms-flex-pack: center; 7829 -ms-flex-pack: center;
7830 justify-content: center; 7830 justify-content: center;
7831 -webkit-box-align: center; 7831 -webkit-box-align: center;
7832 -ms-flex-align: center; 7832 -ms-flex-align: center;
7833 align-items: center; 7833 align-items: center;
7834 -webkit-transition: 0.3s; 7834 -webkit-transition: 0.3s;
7835 transition: 0.3s; 7835 transition: 0.3s;
7836 } 7836 }
7837 @media (min-width: 768px) { 7837 @media (min-width: 768px) {
7838 .cabinet__menu-toper-arrow { 7838 .cabinet__menu-toper-arrow {
7839 width: 20px; 7839 width: 20px;
7840 height: 20px; 7840 height: 20px;
7841 } 7841 }
7842 } 7842 }
7843 .cabinet__menu-toper-arrow svg { 7843 .cabinet__menu-toper-arrow svg {
7844 width: 12px; 7844 width: 12px;
7845 height: 12px; 7845 height: 12px;
7846 -webkit-transform: rotate(90deg); 7846 -webkit-transform: rotate(90deg);
7847 -ms-transform: rotate(90deg); 7847 -ms-transform: rotate(90deg);
7848 transform: rotate(90deg); 7848 transform: rotate(90deg);
7849 } 7849 }
7850 @media (min-width: 768px) { 7850 @media (min-width: 768px) {
7851 .cabinet__menu-toper-arrow svg { 7851 .cabinet__menu-toper-arrow svg {
7852 width: 20px; 7852 width: 20px;
7853 height: 20px; 7853 height: 20px;
7854 } 7854 }
7855 } 7855 }
7856 .cabinet__menu-toper.active .cabinet__menu-toper-arrow { 7856 .cabinet__menu-toper.active .cabinet__menu-toper-arrow {
7857 -webkit-transform: rotate(180deg); 7857 -webkit-transform: rotate(180deg);
7858 -ms-transform: rotate(180deg); 7858 -ms-transform: rotate(180deg);
7859 transform: rotate(180deg); 7859 transform: rotate(180deg);
7860 } 7860 }
7861 .cabinet__menu-body { 7861 .cabinet__menu-body {
7862 opacity: 0; 7862 opacity: 0;
7863 height: 0; 7863 height: 0;
7864 overflow: hidden; 7864 overflow: hidden;
7865 display: -webkit-box; 7865 display: -webkit-box;
7866 display: -ms-flexbox; 7866 display: -ms-flexbox;
7867 display: flex; 7867 display: flex;
7868 -webkit-box-orient: vertical; 7868 -webkit-box-orient: vertical;
7869 -webkit-box-direction: normal; 7869 -webkit-box-direction: normal;
7870 -ms-flex-direction: column; 7870 -ms-flex-direction: column;
7871 flex-direction: column; 7871 flex-direction: column;
7872 } 7872 }
7873 @media (min-width: 992px) { 7873 @media (min-width: 992px) {
7874 .cabinet__menu-body { 7874 .cabinet__menu-body {
7875 opacity: 1; 7875 opacity: 1;
7876 height: auto; 7876 height: auto;
7877 } 7877 }
7878 } 7878 }
7879 .active + .cabinet__menu-body { 7879 .active + .cabinet__menu-body {
7880 opacity: 1; 7880 opacity: 1;
7881 height: auto; 7881 height: auto;
7882 -webkit-transition: 0.3s; 7882 -webkit-transition: 0.3s;
7883 transition: 0.3s; 7883 transition: 0.3s;
7884 } 7884 }
7885 .cabinet__menu-items { 7885 .cabinet__menu-items {
7886 display: -webkit-box; 7886 display: -webkit-box;
7887 display: -ms-flexbox; 7887 display: -ms-flexbox;
7888 display: flex; 7888 display: flex;
7889 -webkit-box-orient: vertical; 7889 -webkit-box-orient: vertical;
7890 -webkit-box-direction: normal; 7890 -webkit-box-direction: normal;
7891 -ms-flex-direction: column; 7891 -ms-flex-direction: column;
7892 flex-direction: column; 7892 flex-direction: column;
7893 } 7893 }
7894 .cabinet__menu-item { 7894 .cabinet__menu-item {
7895 padding: 8px 16px; 7895 padding: 8px 16px;
7896 border-radius: 8px; 7896 border-radius: 8px;
7897 display: -webkit-box; 7897 display: -webkit-box;
7898 display: -ms-flexbox; 7898 display: -ms-flexbox;
7899 display: flex; 7899 display: flex;
7900 -webkit-box-align: center; 7900 -webkit-box-align: center;
7901 -ms-flex-align: center; 7901 -ms-flex-align: center;
7902 align-items: center; 7902 align-items: center;
7903 } 7903 }
7904 @media (min-width: 768px) { 7904 @media (min-width: 768px) {
7905 .cabinet__menu-item { 7905 .cabinet__menu-item {
7906 padding: 14px 20px; 7906 padding: 14px 20px;
7907 } 7907 }
7908 } 7908 }
7909 .cabinet__menu-item:hover { 7909 .cabinet__menu-item:hover {
7910 color: #377d87; 7910 color: #377d87;
7911 } 7911 }
7912 @media (min-width: 992px) { 7912 @media (min-width: 992px) {
7913 .cabinet__menu-item.active { 7913 .cabinet__menu-item.active {
7914 background: #377d87; 7914 background: #377d87;
7915 color: #fff; 7915 color: #fff;
7916 } 7916 }
7917 } 7917 }
7918 @media (min-width: 992px) { 7918 @media (min-width: 992px) {
7919 .cabinet__menu-item.active svg { 7919 .cabinet__menu-item.active svg {
7920 color: #fff; 7920 color: #fff;
7921 } 7921 }
7922 } 7922 }
7923 @media (min-width: 992px) { 7923 @media (min-width: 992px) {
7924 .cabinet__menu-item.active.red { 7924 .cabinet__menu-item.active.red {
7925 background: #eb5757; 7925 background: #eb5757;
7926 } 7926 }
7927 } 7927 }
7928 .cabinet__menu-item i { 7928 .cabinet__menu-item i {
7929 width: 16px; 7929 width: 16px;
7930 height: 16px; 7930 height: 16px;
7931 color: #377d87; 7931 color: #377d87;
7932 } 7932 }
7933 @media (min-width: 768px) { 7933 @media (min-width: 768px) {
7934 .cabinet__menu-item i { 7934 .cabinet__menu-item i {
7935 width: 22px; 7935 width: 22px;
7936 height: 22px; 7936 height: 22px;
7937 } 7937 }
7938 } 7938 }
7939 .cabinet__menu-item svg { 7939 .cabinet__menu-item svg {
7940 width: 16px; 7940 width: 16px;
7941 height: 16px; 7941 height: 16px;
7942 } 7942 }
7943 @media (min-width: 768px) { 7943 @media (min-width: 768px) {
7944 .cabinet__menu-item svg { 7944 .cabinet__menu-item svg {
7945 width: 22px; 7945 width: 22px;
7946 height: 22px; 7946 height: 22px;
7947 } 7947 }
7948 } 7948 }
7949 .cabinet__menu-item span { 7949 .cabinet__menu-item span {
7950 width: calc(100% - 16px); 7950 width: calc(100% - 16px);
7951 font-size: 12px; 7951 font-size: 12px;
7952 padding-left: 10px; 7952 padding-left: 10px;
7953 } 7953 }
7954 @media (min-width: 768px) { 7954 @media (min-width: 768px) {
7955 .cabinet__menu-item span { 7955 .cabinet__menu-item span {
7956 font-size: 20px; 7956 font-size: 20px;
7957 width: calc(100% - 22px); 7957 width: calc(100% - 22px);
7958 padding-left: 16px; 7958 padding-left: 16px;
7959 } 7959 }
7960 } 7960 }
7961 .cabinet__menu-bottom { 7961 .cabinet__menu-bottom {
7962 display: -webkit-box; 7962 display: -webkit-box;
7963 display: -ms-flexbox; 7963 display: -ms-flexbox;
7964 display: flex; 7964 display: flex;
7965 -webkit-box-orient: vertical; 7965 -webkit-box-orient: vertical;
7966 -webkit-box-direction: normal; 7966 -webkit-box-direction: normal;
7967 -ms-flex-direction: column; 7967 -ms-flex-direction: column;
7968 flex-direction: column; 7968 flex-direction: column;
7969 gap: 10px; 7969 gap: 10px;
7970 margin-top: 10px; 7970 margin-top: 10px;
7971 } 7971 }
7972 @media (min-width: 768px) { 7972 @media (min-width: 768px) {
7973 .cabinet__menu-bottom { 7973 .cabinet__menu-bottom {
7974 gap: 20px; 7974 gap: 20px;
7975 margin-top: 20px; 7975 margin-top: 20px;
7976 } 7976 }
7977 } 7977 }
7978 .cabinet__menu-copy { 7978 .cabinet__menu-copy {
7979 color: #9c9d9d; 7979 color: #9c9d9d;
7980 text-align: center; 7980 text-align: center;
7981 font-size: 12px; 7981 font-size: 12px;
7982 } 7982 }
7983 @media (min-width: 768px) { 7983 @media (min-width: 768px) {
7984 .cabinet__menu-copy { 7984 .cabinet__menu-copy {
7985 font-size: 16px; 7985 font-size: 16px;
7986 } 7986 }
7987 } 7987 }
7988 .cabinet__body { 7988 .cabinet__body {
7989 margin: 0 -10px; 7989 margin: 0 -10px;
7990 margin-top: 50px; 7990 margin-top: 50px;
7991 background: #fff; 7991 background: #fff;
7992 padding: 20px 10px; 7992 padding: 20px 10px;
7993 display: -webkit-box; 7993 display: -webkit-box;
7994 display: -ms-flexbox; 7994 display: -ms-flexbox;
7995 display: flex; 7995 display: flex;
7996 -webkit-box-orient: vertical; 7996 -webkit-box-orient: vertical;
7997 -webkit-box-direction: normal; 7997 -webkit-box-direction: normal;
7998 -ms-flex-direction: column; 7998 -ms-flex-direction: column;
7999 flex-direction: column; 7999 flex-direction: column;
8000 gap: 30px; 8000 gap: 30px;
8001 color: #000; 8001 color: #000;
8002 } 8002 }
8003 @media (min-width: 768px) { 8003 @media (min-width: 768px) {
8004 .cabinet__body { 8004 .cabinet__body {
8005 padding: 30px 20px; 8005 padding: 30px 20px;
8006 margin: 0; 8006 margin: 0;
8007 border-radius: 8px; 8007 border-radius: 8px;
8008 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 8008 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
8009 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 8009 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
8010 } 8010 }
8011 } 8011 }
8012 @media (min-width: 992px) { 8012 @media (min-width: 992px) {
8013 .cabinet__body { 8013 .cabinet__body {
8014 width: calc(100% - 360px); 8014 width: calc(100% - 360px);
8015 } 8015 }
8016 } 8016 }
8017 @media (min-width: 1280px) { 8017 @media (min-width: 1280px) {
8018 .cabinet__body { 8018 .cabinet__body {
8019 width: calc(100% - 420px); 8019 width: calc(100% - 420px);
8020 } 8020 }
8021 } 8021 }
8022 .cabinet__body-item { 8022 .cabinet__body-item {
8023 display: -webkit-box; 8023 display: -webkit-box;
8024 display: -ms-flexbox; 8024 display: -ms-flexbox;
8025 display: flex; 8025 display: flex;
8026 -webkit-box-orient: vertical; 8026 -webkit-box-orient: vertical;
8027 -webkit-box-direction: normal; 8027 -webkit-box-direction: normal;
8028 -ms-flex-direction: column; 8028 -ms-flex-direction: column;
8029 flex-direction: column; 8029 flex-direction: column;
8030 gap: 20px; 8030 gap: 20px;
8031 } 8031 }
8032 .cabinet__title { 8032 .cabinet__title {
8033 font-size: 24px; 8033 font-size: 24px;
8034 } 8034 }
8035 @media (min-width: 768px) { 8035 @media (min-width: 768px) {
8036 .cabinet__title { 8036 .cabinet__title {
8037 font-size: 32px; 8037 font-size: 32px;
8038 } 8038 }
8039 } 8039 }
8040 @media (min-width: 992px) { 8040 @media (min-width: 992px) {
8041 .cabinet__title { 8041 .cabinet__title {
8042 font-size: 40px; 8042 font-size: 40px;
8043 } 8043 }
8044 } 8044 }
8045 @media (min-width: 1280px) { 8045 @media (min-width: 1280px) {
8046 .cabinet__title { 8046 .cabinet__title {
8047 font-size: 48px; 8047 font-size: 48px;
8048 } 8048 }
8049 } 8049 }
8050 .cabinet__subtitle { 8050 .cabinet__subtitle {
8051 font-size: 22px; 8051 font-size: 22px;
8052 margin: 0; 8052 margin: 0;
8053 font-weight: 700; 8053 font-weight: 700;
8054 color: #000; 8054 color: #000;
8055 } 8055 }
8056 @media (min-width: 768px) { 8056 @media (min-width: 768px) {
8057 .cabinet__subtitle { 8057 .cabinet__subtitle {
8058 font-size: 24px; 8058 font-size: 24px;
8059 } 8059 }
8060 } 8060 }
8061 .cabinet__h4 { 8061 .cabinet__h4 {
8062 font-size: 20px; 8062 font-size: 20px;
8063 margin: 0; 8063 margin: 0;
8064 font-weight: 700; 8064 font-weight: 700;
8065 color: #000; 8065 color: #000;
8066 } 8066 }
8067 @media (min-width: 768px) { 8067 @media (min-width: 768px) {
8068 .cabinet__h4 { 8068 .cabinet__h4 {
8069 font-size: 22px; 8069 font-size: 22px;
8070 } 8070 }
8071 } 8071 }
8072 .cabinet__text { 8072 .cabinet__text {
8073 margin: 0; 8073 margin: 0;
8074 font-size: 14px; 8074 font-size: 14px;
8075 } 8075 }
8076 @media (min-width: 768px) { 8076 @media (min-width: 768px) {
8077 .cabinet__text { 8077 .cabinet__text {
8078 font-size: 16px; 8078 font-size: 16px;
8079 } 8079 }
8080 } 8080 }
8081 .cabinet__text b { 8081 .cabinet__text b {
8082 color: #000; 8082 color: #000;
8083 font-size: 18px; 8083 font-size: 18px;
8084 } 8084 }
8085 @media (min-width: 768px) { 8085 @media (min-width: 768px) {
8086 .cabinet__text b { 8086 .cabinet__text b {
8087 font-size: 24px; 8087 font-size: 24px;
8088 } 8088 }
8089 } 8089 }
8090 .cabinet__descr { 8090 .cabinet__descr {
8091 display: -webkit-box; 8091 display: -webkit-box;
8092 display: -ms-flexbox; 8092 display: -ms-flexbox;
8093 display: flex; 8093 display: flex;
8094 -webkit-box-orient: vertical; 8094 -webkit-box-orient: vertical;
8095 -webkit-box-direction: normal; 8095 -webkit-box-direction: normal;
8096 -ms-flex-direction: column; 8096 -ms-flex-direction: column;
8097 flex-direction: column; 8097 flex-direction: column;
8098 gap: 6px; 8098 gap: 6px;
8099 } 8099 }
8100 @media (min-width: 768px) { 8100 @media (min-width: 768px) {
8101 .cabinet__descr { 8101 .cabinet__descr {
8102 gap: 12px; 8102 gap: 12px;
8103 } 8103 }
8104 } 8104 }
8105 .cabinet__avatar { 8105 .cabinet__avatar {
8106 display: -webkit-box; 8106 display: -webkit-box;
8107 display: -ms-flexbox; 8107 display: -ms-flexbox;
8108 display: flex; 8108 display: flex;
8109 -webkit-box-align: start; 8109 -webkit-box-align: start;
8110 -ms-flex-align: start; 8110 -ms-flex-align: start;
8111 align-items: flex-start; 8111 align-items: flex-start;
8112 } 8112 }
8113 @media (min-width: 768px) { 8113 @media (min-width: 768px) {
8114 .cabinet__avatar { 8114 .cabinet__avatar {
8115 -webkit-box-align: center; 8115 -webkit-box-align: center;
8116 -ms-flex-align: center; 8116 -ms-flex-align: center;
8117 align-items: center; 8117 align-items: center;
8118 } 8118 }
8119 } 8119 }
8120 .cabinet__avatar-pic { 8120 .cabinet__avatar-pic {
8121 width: 100px; 8121 width: 100px;
8122 aspect-ratio: 1/1; 8122 aspect-ratio: 1/1;
8123 position: relative; 8123 position: relative;
8124 display: -webkit-box; 8124 display: -webkit-box;
8125 display: -ms-flexbox; 8125 display: -ms-flexbox;
8126 display: flex; 8126 display: flex;
8127 -webkit-box-pack: center; 8127 -webkit-box-pack: center;
8128 -ms-flex-pack: center; 8128 -ms-flex-pack: center;
8129 justify-content: center; 8129 justify-content: center;
8130 -webkit-box-align: center; 8130 -webkit-box-align: center;
8131 -ms-flex-align: center; 8131 -ms-flex-align: center;
8132 align-items: center; 8132 align-items: center;
8133 overflow: hidden; 8133 overflow: hidden;
8134 border-radius: 8px; 8134 border-radius: 8px;
8135 color: #fff; 8135 color: #fff;
8136 background: #9c9d9d; 8136 background: #9c9d9d;
8137 } 8137 }
8138 .cabinet__avatar-pic svg { 8138 .cabinet__avatar-pic svg {
8139 width: 50%; 8139 width: 50%;
8140 aspect-ratio: 1/1; 8140 aspect-ratio: 1/1;
8141 z-index: 1; 8141 z-index: 1;
8142 position: relative; 8142 position: relative;
8143 } 8143 }
8144 .cabinet__avatar-pic img{
8145 max-width: 100%;
8146 max-height: 100%;
8147 }
8144 .cabinet__avatar-form { 8148 .cabinet__avatar-form {
8145 width: calc(100% - 100px); 8149 width: calc(100% - 100px);
8146 padding-left: 15px; 8150 padding-left: 15px;
8147 display: -webkit-box; 8151 display: -webkit-box;
8148 display: -ms-flexbox; 8152 display: -ms-flexbox;
8149 display: flex; 8153 display: flex;
8150 -webkit-box-orient: vertical; 8154 -webkit-box-orient: vertical;
8151 -webkit-box-direction: normal; 8155 -webkit-box-direction: normal;
8152 -ms-flex-direction: column; 8156 -ms-flex-direction: column;
8153 flex-direction: column; 8157 flex-direction: column;
8154 gap: 6px; 8158 gap: 6px;
8155 } 8159 }
8156 @media (min-width: 768px) { 8160 @media (min-width: 768px) {
8157 .cabinet__avatar-form { 8161 .cabinet__avatar-form {
8158 -webkit-box-align: start; 8162 -webkit-box-align: start;
8159 -ms-flex-align: start; 8163 -ms-flex-align: start;
8160 align-items: flex-start; 8164 align-items: flex-start;
8161 padding-left: 30px; 8165 padding-left: 30px;
8162 gap: 12px; 8166 gap: 12px;
8163 } 8167 }
8164 } 8168 }
8165 @media (min-width: 768px) { 8169 @media (min-width: 768px) {
8166 .cabinet__avatar-form .file { 8170 .cabinet__avatar-form .file {
8167 min-width: 215px; 8171 min-width: 215px;
8168 } 8172 }
8169 } 8173 }
8170 .cabinet__inputs { 8174 .cabinet__inputs {
8171 display: -webkit-box; 8175 display: -webkit-box;
8172 display: -ms-flexbox; 8176 display: -ms-flexbox;
8173 display: flex; 8177 display: flex;
8174 -webkit-box-orient: vertical; 8178 -webkit-box-orient: vertical;
8175 -webkit-box-direction: normal; 8179 -webkit-box-direction: normal;
8176 -ms-flex-direction: column; 8180 -ms-flex-direction: column;
8177 flex-direction: column; 8181 flex-direction: column;
8178 gap: 20px; 8182 gap: 20px;
8179 } 8183 }
8180 @media (min-width: 1280px) { 8184 @media (min-width: 1280px) {
8181 .cabinet__inputs { 8185 .cabinet__inputs {
8182 -webkit-box-orient: horizontal; 8186 -webkit-box-orient: horizontal;
8183 -webkit-box-direction: normal; 8187 -webkit-box-direction: normal;
8184 -ms-flex-direction: row; 8188 -ms-flex-direction: row;
8185 flex-direction: row; 8189 flex-direction: row;
8186 -webkit-box-align: start; 8190 -webkit-box-align: start;
8187 -ms-flex-align: start; 8191 -ms-flex-align: start;
8188 align-items: flex-start; 8192 align-items: flex-start;
8189 -webkit-box-pack: justify; 8193 -webkit-box-pack: justify;
8190 -ms-flex-pack: justify; 8194 -ms-flex-pack: justify;
8191 justify-content: space-between; 8195 justify-content: space-between;
8192 -ms-flex-wrap: wrap; 8196 -ms-flex-wrap: wrap;
8193 flex-wrap: wrap; 8197 flex-wrap: wrap;
8194 } 8198 }
8195 } 8199 }
8196 @media (min-width: 1280px) { 8200 @media (min-width: 1280px) {
8197 .cabinet__inputs-item { 8201 .cabinet__inputs-item {
8198 width: calc(50% - 10px); 8202 width: calc(50% - 10px);
8199 } 8203 }
8200 } 8204 }
8201 @media (min-width: 1280px) { 8205 @media (min-width: 1280px) {
8202 .cabinet__inputs-item_fullwidth { 8206 .cabinet__inputs-item_fullwidth {
8203 width: 100%; 8207 width: 100%;
8204 } 8208 }
8205 } 8209 }
8206 @media (min-width: 1280px) { 8210 @media (min-width: 1280px) {
8207 .cabinet__inputs-item_min { 8211 .cabinet__inputs-item_min {
8208 width: calc(15% - 10px); 8212 width: calc(15% - 10px);
8209 } 8213 }
8210 } 8214 }
8211 @media (min-width: 1280px) { 8215 @media (min-width: 1280px) {
8212 .cabinet__inputs-item_max { 8216 .cabinet__inputs-item_max {
8213 width: calc(85% - 10px); 8217 width: calc(85% - 10px);
8214 } 8218 }
8215 } 8219 }
8216 @media (min-width: 768px) { 8220 @media (min-width: 768px) {
8217 .cabinet__inputs-item .button { 8221 .cabinet__inputs-item .button {
8218 width: 100%; 8222 width: 100%;
8219 max-width: 215px; 8223 max-width: 215px;
8220 padding: 0; 8224 padding: 0;
8221 } 8225 }
8222 } 8226 }
8223 .cabinet__inputs-item .buttons { 8227 .cabinet__inputs-item .buttons {
8224 display: grid; 8228 display: grid;
8225 grid-template-columns: 1fr 1fr; 8229 grid-template-columns: 1fr 1fr;
8226 gap: 10px; 8230 gap: 10px;
8227 } 8231 }
8228 @media (min-width: 768px) { 8232 @media (min-width: 768px) {
8229 .cabinet__inputs-item .buttons { 8233 .cabinet__inputs-item .buttons {
8230 gap: 20px; 8234 gap: 20px;
8231 max-width: 470px; 8235 max-width: 470px;
8232 } 8236 }
8233 } 8237 }
8234 @media (min-width: 992px) { 8238 @media (min-width: 992px) {
8235 .cabinet__inputs-item .buttons { 8239 .cabinet__inputs-item .buttons {
8236 max-width: none; 8240 max-width: none;
8237 } 8241 }
8238 } 8242 }
8239 @media (min-width: 1280px) { 8243 @media (min-width: 1280px) {
8240 .cabinet__inputs-item .buttons { 8244 .cabinet__inputs-item .buttons {
8241 max-width: 470px; 8245 max-width: 470px;
8242 } 8246 }
8243 } 8247 }
8244 .cabinet__inputs-item .buttons .button { 8248 .cabinet__inputs-item .buttons .button {
8245 max-width: none; 8249 max-width: none;
8246 } 8250 }
8247 .cabinet__inputs > .button { 8251 .cabinet__inputs > .button {
8248 padding: 0; 8252 padding: 0;
8249 width: 100%; 8253 width: 100%;
8250 max-width: 140px; 8254 max-width: 140px;
8251 } 8255 }
8252 @media (min-width: 768px) { 8256 @media (min-width: 768px) {
8253 .cabinet__inputs > .button { 8257 .cabinet__inputs > .button {
8254 max-width: 190px; 8258 max-width: 190px;
8255 } 8259 }
8256 } 8260 }
8257 .cabinet__add { 8261 .cabinet__add {
8258 display: -webkit-box; 8262 display: -webkit-box;
8259 display: -ms-flexbox; 8263 display: -ms-flexbox;
8260 display: flex; 8264 display: flex;
8261 -webkit-box-orient: vertical; 8265 -webkit-box-orient: vertical;
8262 -webkit-box-direction: normal; 8266 -webkit-box-direction: normal;
8263 -ms-flex-direction: column; 8267 -ms-flex-direction: column;
8264 flex-direction: column; 8268 flex-direction: column;
8265 gap: 10px; 8269 gap: 10px;
8266 } 8270 }
8267 @media (min-width: 768px) { 8271 @media (min-width: 768px) {
8268 .cabinet__add { 8272 .cabinet__add {
8269 gap: 0; 8273 gap: 0;
8270 -webkit-box-orient: horizontal; 8274 -webkit-box-orient: horizontal;
8271 -webkit-box-direction: normal; 8275 -webkit-box-direction: normal;
8272 -ms-flex-direction: row; 8276 -ms-flex-direction: row;
8273 flex-direction: row; 8277 flex-direction: row;
8274 -webkit-box-align: end; 8278 -webkit-box-align: end;
8275 -ms-flex-align: end; 8279 -ms-flex-align: end;
8276 align-items: flex-end; 8280 align-items: flex-end;
8277 } 8281 }
8278 } 8282 }
8279 .cabinet__add-pic { 8283 .cabinet__add-pic {
8280 border-radius: 4px; 8284 border-radius: 4px;
8281 position: relative; 8285 position: relative;
8282 overflow: hidden; 8286 overflow: hidden;
8283 background: #9c9d9d; 8287 background: #9c9d9d;
8284 color: #fff; 8288 color: #fff;
8285 width: 100px; 8289 width: 100px;
8286 aspect-ratio: 1/1; 8290 aspect-ratio: 1/1;
8287 -webkit-transition: 0.3s; 8291 -webkit-transition: 0.3s;
8288 transition: 0.3s; 8292 transition: 0.3s;
8289 } 8293 }
8290 @media (min-width: 768px) { 8294 @media (min-width: 768px) {
8291 .cabinet__add-pic { 8295 .cabinet__add-pic {
8292 width: 220px; 8296 width: 220px;
8293 border-radius: 8px; 8297 border-radius: 8px;
8294 } 8298 }
8295 } 8299 }
8296 .cabinet__add-pic:hover { 8300 .cabinet__add-pic:hover {
8297 background: #000; 8301 background: #000;
8298 } 8302 }
8299 .cabinet__add-pic input { 8303 .cabinet__add-pic input {
8300 display: none; 8304 display: none;
8301 } 8305 }
8302 .cabinet__add-pic > svg { 8306 .cabinet__add-pic > svg {
8303 width: 20px; 8307 width: 20px;
8304 position: absolute; 8308 position: absolute;
8305 top: 50%; 8309 top: 50%;
8306 left: 50%; 8310 left: 50%;
8307 -webkit-transform: translate(-50%, -50%); 8311 -webkit-transform: translate(-50%, -50%);
8308 -ms-transform: translate(-50%, -50%); 8312 -ms-transform: translate(-50%, -50%);
8309 transform: translate(-50%, -50%); 8313 transform: translate(-50%, -50%);
8310 z-index: 1; 8314 z-index: 1;
8311 } 8315 }
8312 @media (min-width: 768px) { 8316 @media (min-width: 768px) {
8313 .cabinet__add-pic > svg { 8317 .cabinet__add-pic > svg {
8314 width: 50px; 8318 width: 50px;
8315 } 8319 }
8316 } 8320 }
8317 .cabinet__add-pic span { 8321 .cabinet__add-pic span {
8318 display: -webkit-box; 8322 display: -webkit-box;
8319 display: -ms-flexbox; 8323 display: -ms-flexbox;
8320 display: flex; 8324 display: flex;
8321 -webkit-box-align: center; 8325 -webkit-box-align: center;
8322 -ms-flex-align: center; 8326 -ms-flex-align: center;
8323 align-items: center; 8327 align-items: center;
8324 -webkit-box-pack: center; 8328 -webkit-box-pack: center;
8325 -ms-flex-pack: center; 8329 -ms-flex-pack: center;
8326 justify-content: center; 8330 justify-content: center;
8327 width: 100%; 8331 width: 100%;
8328 gap: 4px; 8332 gap: 4px;
8329 font-weight: 700; 8333 font-weight: 700;
8330 font-size: 8px; 8334 font-size: 8px;
8331 line-height: 1; 8335 line-height: 1;
8332 position: absolute; 8336 position: absolute;
8333 top: 50%; 8337 top: 50%;
8334 left: 50%; 8338 left: 50%;
8335 -webkit-transform: translate(-50%, -50%); 8339 -webkit-transform: translate(-50%, -50%);
8336 -ms-transform: translate(-50%, -50%); 8340 -ms-transform: translate(-50%, -50%);
8337 transform: translate(-50%, -50%); 8341 transform: translate(-50%, -50%);
8338 margin-top: 25px; 8342 margin-top: 25px;
8339 } 8343 }
8340 @media (min-width: 768px) { 8344 @media (min-width: 768px) {
8341 .cabinet__add-pic span { 8345 .cabinet__add-pic span {
8342 font-size: 16px; 8346 font-size: 16px;
8343 margin-top: 60px; 8347 margin-top: 60px;
8344 } 8348 }
8345 } 8349 }
8346 .cabinet__add-pic span svg { 8350 .cabinet__add-pic span svg {
8347 width: 7px; 8351 width: 7px;
8348 aspect-ratio: 1/1; 8352 aspect-ratio: 1/1;
8349 } 8353 }
8350 @media (min-width: 768px) { 8354 @media (min-width: 768px) {
8351 .cabinet__add-pic span svg { 8355 .cabinet__add-pic span svg {
8352 width: 16px; 8356 width: 16px;
8353 } 8357 }
8354 } 8358 }
8355 .cabinet__add-body { 8359 .cabinet__add-body {
8356 display: -webkit-box; 8360 display: -webkit-box;
8357 display: -ms-flexbox; 8361 display: -ms-flexbox;
8358 display: flex; 8362 display: flex;
8359 -webkit-box-orient: vertical; 8363 -webkit-box-orient: vertical;
8360 -webkit-box-direction: normal; 8364 -webkit-box-direction: normal;
8361 -ms-flex-direction: column; 8365 -ms-flex-direction: column;
8362 flex-direction: column; 8366 flex-direction: column;
8363 gap: 10px; 8367 gap: 10px;
8364 } 8368 }
8365 @media (min-width: 768px) { 8369 @media (min-width: 768px) {
8366 .cabinet__add-body { 8370 .cabinet__add-body {
8367 gap: 20px; 8371 gap: 20px;
8368 width: calc(100% - 220px); 8372 width: calc(100% - 220px);
8369 padding-left: 20px; 8373 padding-left: 20px;
8370 } 8374 }
8371 } 8375 }
8372 @media (min-width: 768px) { 8376 @media (min-width: 768px) {
8373 .cabinet__add-body .button { 8377 .cabinet__add-body .button {
8374 width: 215px; 8378 width: 215px;
8375 padding: 0; 8379 padding: 0;
8376 } 8380 }
8377 } 8381 }
8378 .cabinet__fleet { 8382 .cabinet__fleet {
8379 display: -webkit-box; 8383 display: -webkit-box;
8380 display: -ms-flexbox; 8384 display: -ms-flexbox;
8381 display: flex; 8385 display: flex;
8382 -webkit-box-orient: vertical; 8386 -webkit-box-orient: vertical;
8383 -webkit-box-direction: normal; 8387 -webkit-box-direction: normal;
8384 -ms-flex-direction: column; 8388 -ms-flex-direction: column;
8385 flex-direction: column; 8389 flex-direction: column;
8386 gap: 20px; 8390 gap: 20px;
8387 } 8391 }
8388 @media (min-width: 768px) { 8392 @media (min-width: 768px) {
8389 .cabinet__fleet { 8393 .cabinet__fleet {
8390 display: grid; 8394 display: grid;
8391 grid-template-columns: repeat(2, 1fr); 8395 grid-template-columns: repeat(2, 1fr);
8392 } 8396 }
8393 } 8397 }
8394 @media (min-width: 1280px) { 8398 @media (min-width: 1280px) {
8395 .cabinet__fleet { 8399 .cabinet__fleet {
8396 grid-template-columns: repeat(3, 1fr); 8400 grid-template-columns: repeat(3, 1fr);
8397 } 8401 }
8398 } 8402 }
8399 @media (min-width: 768px) { 8403 @media (min-width: 768px) {
8400 .cabinet__submit { 8404 .cabinet__submit {
8401 width: 215px; 8405 width: 215px;
8402 padding: 0; 8406 padding: 0;
8403 margin: 0 auto; 8407 margin: 0 auto;
8404 } 8408 }
8405 } 8409 }
8406 .cabinet__filters { 8410 .cabinet__filters {
8407 display: -webkit-box; 8411 display: -webkit-box;
8408 display: -ms-flexbox; 8412 display: -ms-flexbox;
8409 display: flex; 8413 display: flex;
8410 -webkit-box-orient: vertical; 8414 -webkit-box-orient: vertical;
8411 -webkit-box-direction: normal; 8415 -webkit-box-direction: normal;
8412 -ms-flex-direction: column; 8416 -ms-flex-direction: column;
8413 flex-direction: column; 8417 flex-direction: column;
8414 gap: 10px; 8418 gap: 10px;
8415 } 8419 }
8416 .cabinet__export-wrap{ 8420 .cabinet__export-wrap{
8417 padding: 10px; 8421 padding: 10px;
8418 border: 1px #cecece solid; 8422 border: 1px #cecece solid;
8419 border-radius: 8px; 8423 border-radius: 8px;
8420 width: 100%; 8424 width: 100%;
8421 } 8425 }
8422 .cabinet__export-button-wrap{ 8426 .cabinet__export-button-wrap{
8423 max-width: 200px; 8427 max-width: 200px;
8424 margin-bottom: 10px; 8428 margin-bottom: 10px;
8425 } 8429 }
8426 .cabinet__export-options-wrap{ 8430 .cabinet__export-options-wrap{
8427 display: flex; 8431 display: flex;
8428 justify-content: space-between; 8432 justify-content: space-between;
8429 } 8433 }
8430 .job-title-list-wrap{ 8434 .job-title-list-wrap{
8431 margin-top: 5px; 8435 margin-top: 5px;
8432 } 8436 }
8433 .cabinet__export-error{ 8437 .cabinet__export-error{
8434 color: red; 8438 color: red;
8435 } 8439 }
8436 .flot-image-wrap img{ 8440 .flot-image-wrap img{
8437 max-width: 100%; 8441 max-width: 100%;
8438 max-height: 100%; 8442 max-height: 100%;
8439 flex: 0 0 auto; 8443 flex: 0 0 auto;
8440 } 8444 }
8441 .flot-image-wrap{ 8445 .flot-image-wrap{
8442 width: 220px; 8446 width: 220px;
8443 height: 220px; 8447 height: 220px;
8444 display: flex; 8448 display: flex;
8445 justify-content: center; 8449 justify-content: center;
8446 align-items: center; 8450 align-items: center;
8447 } 8451 }
8448 @media (min-width: 768px) { 8452 @media (min-width: 768px) {
8449 .cabinet__filters { 8453 .cabinet__filters {
8450 gap: 20px; 8454 gap: 20px;
8451 } 8455 }
8452 } 8456 }
8453 @media (min-width: 1280px) { 8457 @media (min-width: 1280px) {
8454 .cabinet__filters { 8458 .cabinet__filters {
8455 -webkit-box-orient: horizontal; 8459 -webkit-box-orient: horizontal;
8456 -webkit-box-direction: normal; 8460 -webkit-box-direction: normal;
8457 -ms-flex-direction: row; 8461 -ms-flex-direction: row;
8458 flex-direction: row; 8462 flex-direction: row;
8459 -webkit-box-align: start; 8463 -webkit-box-align: start;
8460 -ms-flex-align: start; 8464 -ms-flex-align: start;
8461 align-items: flex-start; 8465 align-items: flex-start;
8462 -webkit-box-pack: justify; 8466 -webkit-box-pack: justify;
8463 -ms-flex-pack: justify; 8467 -ms-flex-pack: justify;
8464 justify-content: space-between; 8468 justify-content: space-between;
8465 } 8469 }
8466 } 8470 }
8467 .cabinet__filters-item { 8471 .cabinet__filters-item {
8468 display: -webkit-box; 8472 display: -webkit-box;
8469 display: -ms-flexbox; 8473 display: -ms-flexbox;
8470 display: flex; 8474 display: flex;
8471 -webkit-box-orient: vertical; 8475 -webkit-box-orient: vertical;
8472 -webkit-box-direction: normal; 8476 -webkit-box-direction: normal;
8473 -ms-flex-direction: column; 8477 -ms-flex-direction: column;
8474 flex-direction: column; 8478 flex-direction: column;
8475 -webkit-box-align: start; 8479 -webkit-box-align: start;
8476 -ms-flex-align: start; 8480 -ms-flex-align: start;
8477 align-items: flex-start; 8481 align-items: flex-start;
8478 gap: 10px; 8482 gap: 10px;
8479 } 8483 }
8480 @media (min-width: 768px) { 8484 @media (min-width: 768px) {
8481 .cabinet__filters-item { 8485 .cabinet__filters-item {
8482 gap: 20px; 8486 gap: 20px;
8483 } 8487 }
8484 } 8488 }
8485 @media (min-width: 1280px) { 8489 @media (min-width: 1280px) {
8486 .cabinet__filters-item { 8490 .cabinet__filters-item {
8487 width: calc(50% - 10px); 8491 width: calc(50% - 10px);
8488 max-width: 410px; 8492 max-width: 410px;
8489 } 8493 }
8490 } 8494 }
8491 .cabinet__filters-item .button, 8495 .cabinet__filters-item .button,
8492 .cabinet__filters-item .select { 8496 .cabinet__filters-item .select {
8493 width: 100%; 8497 width: 100%;
8494 } 8498 }
8495 @media (min-width: 1280px) { 8499 @media (min-width: 1280px) {
8496 .cabinet__filters-item .button, 8500 .cabinet__filters-item .button,
8497 .cabinet__filters-item .select { 8501 .cabinet__filters-item .select {
8498 width: auto; 8502 width: auto;
8499 } 8503 }
8500 } 8504 }
8501 .cabinet__filters-item + .cabinet__filters-item { 8505 .cabinet__filters-item + .cabinet__filters-item {
8502 -webkit-box-align: end; 8506 -webkit-box-align: end;
8503 -ms-flex-align: end; 8507 -ms-flex-align: end;
8504 align-items: flex-end; 8508 align-items: flex-end;
8505 } 8509 }
8506 @media (min-width: 1280px) { 8510 @media (min-width: 1280px) {
8507 .cabinet__filters-item + .cabinet__filters-item { 8511 .cabinet__filters-item + .cabinet__filters-item {
8508 max-width: 280px; 8512 max-width: 280px;
8509 } 8513 }
8510 } 8514 }
8511 .cabinet__filters .search input { 8515 .cabinet__filters .search input {
8512 padding-right: 135px; 8516 padding-right: 135px;
8513 } 8517 }
8514 .cabinet__filters .search button { 8518 .cabinet__filters .search button {
8515 width: 115px; 8519 width: 115px;
8516 } 8520 }
8517 .cabinet__filters-buttons { 8521 .cabinet__filters-buttons {
8518 display: grid; 8522 display: grid;
8519 grid-template-columns: 1fr 1fr; 8523 grid-template-columns: 1fr 1fr;
8520 gap: 10px; 8524 gap: 10px;
8521 width: 100%; 8525 width: 100%;
8522 } 8526 }
8523 @media (min-width: 768px) { 8527 @media (min-width: 768px) {
8524 .cabinet__filters-buttons { 8528 .cabinet__filters-buttons {
8525 gap: 20px; 8529 gap: 20px;
8526 } 8530 }
8527 } 8531 }
8528 .cabinet__filters-buttons .button { 8532 .cabinet__filters-buttons .button {
8529 padding: 0; 8533 padding: 0;
8530 gap: 5px; 8534 gap: 5px;
8531 } 8535 }
8532 .cabinet__filters-buttons .button.active { 8536 .cabinet__filters-buttons .button.active {
8533 background: #377d87; 8537 background: #377d87;
8534 color: #fff; 8538 color: #fff;
8535 } 8539 }
8536 .cabinet__filters-buttons .button.active:before { 8540 .cabinet__filters-buttons .button.active:before {
8537 content: ""; 8541 content: "";
8538 width: 6px; 8542 width: 6px;
8539 height: 6px; 8543 height: 6px;
8540 background: #fff; 8544 background: #fff;
8541 border-radius: 999px; 8545 border-radius: 999px;
8542 } 8546 }
8543 .cabinet__table-header { 8547 .cabinet__table-header {
8544 display: -webkit-box; 8548 display: -webkit-box;
8545 display: -ms-flexbox; 8549 display: -ms-flexbox;
8546 display: flex; 8550 display: flex;
8547 -webkit-box-pack: justify; 8551 -webkit-box-pack: justify;
8548 -ms-flex-pack: justify; 8552 -ms-flex-pack: justify;
8549 justify-content: space-between; 8553 justify-content: space-between;
8550 -webkit-box-align: center; 8554 -webkit-box-align: center;
8551 -ms-flex-align: center; 8555 -ms-flex-align: center;
8552 align-items: center; 8556 align-items: center;
8553 font-weight: 700; 8557 font-weight: 700;
8554 margin-bottom: -10px; 8558 margin-bottom: -10px;
8555 } 8559 }
8556 .cabinet__table-header div { 8560 .cabinet__table-header div {
8557 font-size: 18px; 8561 font-size: 18px;
8558 } 8562 }
8559 @media (min-width: 768px) { 8563 @media (min-width: 768px) {
8560 .cabinet__table-header div { 8564 .cabinet__table-header div {
8561 font-size: 24px; 8565 font-size: 24px;
8562 } 8566 }
8563 } 8567 }
8564 .cabinet__table-header span { 8568 .cabinet__table-header span {
8565 color: #000; 8569 color: #000;
8566 font-size: 14px; 8570 font-size: 14px;
8567 } 8571 }
8568 @media (min-width: 768px) { 8572 @media (min-width: 768px) {
8569 .cabinet__table-header span { 8573 .cabinet__table-header span {
8570 font-size: 18px; 8574 font-size: 18px;
8571 } 8575 }
8572 } 8576 }
8573 .cabinet__table-header span b { 8577 .cabinet__table-header span b {
8574 color: #377d87; 8578 color: #377d87;
8575 } 8579 }
8576 .cabinet__tabs { 8580 .cabinet__tabs {
8577 display: grid; 8581 display: grid;
8578 grid-template-columns: 1fr 1fr; 8582 grid-template-columns: 1fr 1fr;
8579 gap: 20px; 8583 gap: 20px;
8580 } 8584 }
8581 @media (min-width: 768px) { 8585 @media (min-width: 768px) {
8582 .cabinet__tabs { 8586 .cabinet__tabs {
8583 max-width: 420px; 8587 max-width: 420px;
8584 } 8588 }
8585 } 8589 }
8586 .cabinet__tabs .button.active { 8590 .cabinet__tabs .button.active {
8587 background: #377d87; 8591 background: #377d87;
8588 color: #fff; 8592 color: #fff;
8589 } 8593 }
8590 .cabinet__bodies { 8594 .cabinet__bodies {
8591 display: none; 8595 display: none;
8592 } 8596 }
8593 .cabinet__bodies.showed { 8597 .cabinet__bodies.showed {
8594 display: block; 8598 display: block;
8595 } 8599 }
8596 .cabinet__nots { 8600 .cabinet__nots {
8597 display: -webkit-box; 8601 display: -webkit-box;
8598 display: -ms-flexbox; 8602 display: -ms-flexbox;
8599 display: flex; 8603 display: flex;
8600 -webkit-box-orient: vertical; 8604 -webkit-box-orient: vertical;
8601 -webkit-box-direction: normal; 8605 -webkit-box-direction: normal;
8602 -ms-flex-direction: column; 8606 -ms-flex-direction: column;
8603 flex-direction: column; 8607 flex-direction: column;
8604 -webkit-box-align: start; 8608 -webkit-box-align: start;
8605 -ms-flex-align: start; 8609 -ms-flex-align: start;
8606 align-items: flex-start; 8610 align-items: flex-start;
8607 gap: 10px; 8611 gap: 10px;
8608 } 8612 }
8609 @media (min-width: 768px) { 8613 @media (min-width: 768px) {
8610 .cabinet__nots { 8614 .cabinet__nots {
8611 gap: 20px; 8615 gap: 20px;
8612 } 8616 }
8613 } 8617 }
8614 .cabinet__nots .input { 8618 .cabinet__nots .input {
8615 width: 100%; 8619 width: 100%;
8616 } 8620 }
8617 .cabinet__anketa { 8621 .cabinet__anketa {
8618 display: -webkit-box; 8622 display: -webkit-box;
8619 display: -ms-flexbox; 8623 display: -ms-flexbox;
8620 display: flex; 8624 display: flex;
8621 -webkit-box-orient: vertical; 8625 -webkit-box-orient: vertical;
8622 -webkit-box-direction: normal; 8626 -webkit-box-direction: normal;
8623 -ms-flex-direction: column; 8627 -ms-flex-direction: column;
8624 flex-direction: column; 8628 flex-direction: column;
8625 -webkit-box-pack: justify; 8629 -webkit-box-pack: justify;
8626 -ms-flex-pack: justify; 8630 -ms-flex-pack: justify;
8627 justify-content: space-between; 8631 justify-content: space-between;
8628 gap: 10px; 8632 gap: 10px;
8629 } 8633 }
8630 @media (min-width: 768px) { 8634 @media (min-width: 768px) {
8631 .cabinet__anketa { 8635 .cabinet__anketa {
8632 -webkit-box-orient: horizontal; 8636 -webkit-box-orient: horizontal;
8633 -webkit-box-direction: normal; 8637 -webkit-box-direction: normal;
8634 -ms-flex-direction: row; 8638 -ms-flex-direction: row;
8635 flex-direction: row; 8639 flex-direction: row;
8636 -webkit-box-align: center; 8640 -webkit-box-align: center;
8637 -ms-flex-align: center; 8641 -ms-flex-align: center;
8638 align-items: center; 8642 align-items: center;
8639 } 8643 }
8640 } 8644 }
8641 @media (min-width: 992px) { 8645 @media (min-width: 992px) {
8642 .cabinet__anketa { 8646 .cabinet__anketa {
8643 -webkit-box-orient: vertical; 8647 -webkit-box-orient: vertical;
8644 -webkit-box-direction: normal; 8648 -webkit-box-direction: normal;
8645 -ms-flex-direction: column; 8649 -ms-flex-direction: column;
8646 flex-direction: column; 8650 flex-direction: column;
8647 -webkit-box-align: stretch; 8651 -webkit-box-align: stretch;
8648 -ms-flex-align: stretch; 8652 -ms-flex-align: stretch;
8649 align-items: stretch; 8653 align-items: stretch;
8650 } 8654 }
8651 } 8655 }
8652 @media (min-width: 1280px) { 8656 @media (min-width: 1280px) {
8653 .cabinet__anketa { 8657 .cabinet__anketa {
8654 -webkit-box-orient: horizontal; 8658 -webkit-box-orient: horizontal;
8655 -webkit-box-direction: normal; 8659 -webkit-box-direction: normal;
8656 -ms-flex-direction: row; 8660 -ms-flex-direction: row;
8657 flex-direction: row; 8661 flex-direction: row;
8658 -webkit-box-align: center; 8662 -webkit-box-align: center;
8659 -ms-flex-align: center; 8663 -ms-flex-align: center;
8660 align-items: center; 8664 align-items: center;
8661 -webkit-box-pack: justify; 8665 -webkit-box-pack: justify;
8662 -ms-flex-pack: justify; 8666 -ms-flex-pack: justify;
8663 justify-content: space-between; 8667 justify-content: space-between;
8664 } 8668 }
8665 } 8669 }
8666 .cabinet__anketa-buttons { 8670 .cabinet__anketa-buttons {
8667 display: -webkit-box; 8671 display: -webkit-box;
8668 display: -ms-flexbox; 8672 display: -ms-flexbox;
8669 display: flex; 8673 display: flex;
8670 -webkit-box-orient: vertical; 8674 -webkit-box-orient: vertical;
8671 -webkit-box-direction: normal; 8675 -webkit-box-direction: normal;
8672 -ms-flex-direction: column; 8676 -ms-flex-direction: column;
8673 flex-direction: column; 8677 flex-direction: column;
8674 gap: 10px; 8678 gap: 10px;
8675 } 8679 }
8676 @media (min-width: 768px) { 8680 @media (min-width: 768px) {
8677 .cabinet__anketa-buttons { 8681 .cabinet__anketa-buttons {
8678 display: grid; 8682 display: grid;
8679 grid-template-columns: 1fr 1fr; 8683 grid-template-columns: 1fr 1fr;
8680 gap: 20px; 8684 gap: 20px;
8681 } 8685 }
8682 } 8686 }
8683 .cabinet__stats { 8687 .cabinet__stats {
8684 display: -webkit-box; 8688 display: -webkit-box;
8685 display: -ms-flexbox; 8689 display: -ms-flexbox;
8686 display: flex; 8690 display: flex;
8687 -webkit-box-orient: vertical; 8691 -webkit-box-orient: vertical;
8688 -webkit-box-direction: normal; 8692 -webkit-box-direction: normal;
8689 -ms-flex-direction: column; 8693 -ms-flex-direction: column;
8690 flex-direction: column; 8694 flex-direction: column;
8691 gap: 6px; 8695 gap: 6px;
8692 } 8696 }
8693 @media (min-width: 768px) { 8697 @media (min-width: 768px) {
8694 .cabinet__stats { 8698 .cabinet__stats {
8695 gap: 12px; 8699 gap: 12px;
8696 } 8700 }
8697 } 8701 }
8698 .cabinet__stats-title { 8702 .cabinet__stats-title {
8699 font-size: 14px; 8703 font-size: 14px;
8700 font-weight: 700; 8704 font-weight: 700;
8701 color: #000; 8705 color: #000;
8702 } 8706 }
8703 @media (min-width: 768px) { 8707 @media (min-width: 768px) {
8704 .cabinet__stats-title { 8708 .cabinet__stats-title {
8705 font-size: 24px; 8709 font-size: 24px;
8706 } 8710 }
8707 } 8711 }
8708 .cabinet__stats-body { 8712 .cabinet__stats-body {
8709 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%); 8713 background: linear-gradient(95deg, #f2f5fc 59.82%, #ebf2fc 99.99%);
8710 border-radius: 8px; 8714 border-radius: 8px;
8711 padding: 10px; 8715 padding: 10px;
8712 display: grid; 8716 display: grid;
8713 grid-template-columns: 1fr 1fr; 8717 grid-template-columns: 1fr 1fr;
8714 gap: 20px; 8718 gap: 20px;
8715 margin-bottom: 10px; 8719 margin-bottom: 10px;
8716 } 8720 }
8717 @media (min-width: 768px) { 8721 @media (min-width: 768px) {
8718 .cabinet__stats-body { 8722 .cabinet__stats-body {
8719 padding: 10px 20px; 8723 padding: 10px 20px;
8720 } 8724 }
8721 } 8725 }
8722 .cabinet__stats-item { 8726 .cabinet__stats-item {
8723 font-size: 12px; 8727 font-size: 12px;
8724 display: -webkit-box; 8728 display: -webkit-box;
8725 display: -ms-flexbox; 8729 display: -ms-flexbox;
8726 display: flex; 8730 display: flex;
8727 -webkit-box-align: center; 8731 -webkit-box-align: center;
8728 -ms-flex-align: center; 8732 -ms-flex-align: center;
8729 align-items: center; 8733 align-items: center;
8730 line-height: 1; 8734 line-height: 1;
8731 gap: 6px; 8735 gap: 6px;
8732 } 8736 }
8733 @media (min-width: 768px) { 8737 @media (min-width: 768px) {
8734 .cabinet__stats-item { 8738 .cabinet__stats-item {
8735 font-size: 20px; 8739 font-size: 20px;
8736 gap: 10px; 8740 gap: 10px;
8737 } 8741 }
8738 } 8742 }
8739 .cabinet__stats-item svg { 8743 .cabinet__stats-item svg {
8740 width: 20px; 8744 width: 20px;
8741 aspect-ratio: 1/1; 8745 aspect-ratio: 1/1;
8742 color: #377d87; 8746 color: #377d87;
8743 } 8747 }
8744 @media (min-width: 768px) { 8748 @media (min-width: 768px) {
8745 .cabinet__stats-item svg { 8749 .cabinet__stats-item svg {
8746 width: 40px; 8750 width: 40px;
8747 margin-right: 10px; 8751 margin-right: 10px;
8748 } 8752 }
8749 } 8753 }
8750 .cabinet__stats-item span { 8754 .cabinet__stats-item span {
8751 font-weight: 700; 8755 font-weight: 700;
8752 color: #000; 8756 color: #000;
8753 } 8757 }
8754 .cabinet__stats-item b { 8758 .cabinet__stats-item b {
8755 color: #377d87; 8759 color: #377d87;
8756 font-size: 14px; 8760 font-size: 14px;
8757 } 8761 }
8758 @media (min-width: 768px) { 8762 @media (min-width: 768px) {
8759 .cabinet__stats-item b { 8763 .cabinet__stats-item b {
8760 font-size: 24px; 8764 font-size: 24px;
8761 } 8765 }
8762 } 8766 }
8763 .cabinet__stats-subtitle { 8767 .cabinet__stats-subtitle {
8764 font-size: 14px; 8768 font-size: 14px;
8765 font-weight: 700; 8769 font-weight: 700;
8766 color: #377d87; 8770 color: #377d87;
8767 } 8771 }
8768 @media (min-width: 768px) { 8772 @media (min-width: 768px) {
8769 .cabinet__stats-subtitle { 8773 .cabinet__stats-subtitle {
8770 font-size: 18px; 8774 font-size: 18px;
8771 } 8775 }
8772 } 8776 }
8773 .cabinet__stats-line { 8777 .cabinet__stats-line {
8774 width: 100%; 8778 width: 100%;
8775 position: relative; 8779 position: relative;
8776 overflow: hidden; 8780 overflow: hidden;
8777 height: 8px; 8781 height: 8px;
8778 border-radius: 999px; 8782 border-radius: 999px;
8779 background: #cecece; 8783 background: #cecece;
8780 } 8784 }
8781 .cabinet__stats-line span { 8785 .cabinet__stats-line span {
8782 position: absolute; 8786 position: absolute;
8783 top: 0; 8787 top: 0;
8784 left: 0; 8788 left: 0;
8785 width: 100%; 8789 width: 100%;
8786 height: 100%; 8790 height: 100%;
8787 background: #377d87; 8791 background: #377d87;
8788 border-radius: 999px; 8792 border-radius: 999px;
8789 } 8793 }
8790 .cabinet__stats-bottom { 8794 .cabinet__stats-bottom {
8791 color: #000; 8795 color: #000;
8792 font-size: 12px; 8796 font-size: 12px;
8793 } 8797 }
8794 @media (min-width: 768px) { 8798 @media (min-width: 768px) {
8795 .cabinet__stats-bottom { 8799 .cabinet__stats-bottom {
8796 font-size: 16px; 8800 font-size: 16px;
8797 } 8801 }
8798 } 8802 }
8799 .cabinet__works { 8803 .cabinet__works {
8800 display: -webkit-box; 8804 display: -webkit-box;
8801 display: -ms-flexbox; 8805 display: -ms-flexbox;
8802 display: flex; 8806 display: flex;
8803 -webkit-box-orient: vertical; 8807 -webkit-box-orient: vertical;
8804 -webkit-box-direction: normal; 8808 -webkit-box-direction: normal;
8805 -ms-flex-direction: column; 8809 -ms-flex-direction: column;
8806 flex-direction: column; 8810 flex-direction: column;
8807 gap: 20px; 8811 gap: 20px;
8808 } 8812 }
8809 @media (min-width: 768px) { 8813 @media (min-width: 768px) {
8810 .cabinet__works { 8814 .cabinet__works {
8811 gap: 30px; 8815 gap: 30px;
8812 } 8816 }
8813 } 8817 }
8814 .cabinet__works-item { 8818 .cabinet__works-item {
8815 -webkit-box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2); 8819 -webkit-box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2);
8816 box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2); 8820 box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.2);
8817 padding: 10px; 8821 padding: 10px;
8818 border-radius: 4px; 8822 border-radius: 4px;
8819 } 8823 }
8820 @media (min-width: 768px) { 8824 @media (min-width: 768px) {
8821 .cabinet__works-item { 8825 .cabinet__works-item {
8822 padding: 20px; 8826 padding: 20px;
8823 border-radius: 8px; 8827 border-radius: 8px;
8824 } 8828 }
8825 } 8829 }
8826 .cabinet__works-spoiler { 8830 .cabinet__works-spoiler {
8827 display: -webkit-box; 8831 display: -webkit-box;
8828 display: -ms-flexbox; 8832 display: -ms-flexbox;
8829 display: flex; 8833 display: flex;
8830 -webkit-box-align: center; 8834 -webkit-box-align: center;
8831 -ms-flex-align: center; 8835 -ms-flex-align: center;
8832 align-items: center; 8836 align-items: center;
8833 -webkit-box-pack: justify; 8837 -webkit-box-pack: justify;
8834 -ms-flex-pack: justify; 8838 -ms-flex-pack: justify;
8835 justify-content: space-between; 8839 justify-content: space-between;
8836 } 8840 }
8837 .cabinet__works-spoiler-left { 8841 .cabinet__works-spoiler-left {
8838 display: -webkit-box; 8842 display: -webkit-box;
8839 display: -ms-flexbox; 8843 display: -ms-flexbox;
8840 display: flex; 8844 display: flex;
8841 -webkit-box-align: center; 8845 -webkit-box-align: center;
8842 -ms-flex-align: center; 8846 -ms-flex-align: center;
8843 align-items: center; 8847 align-items: center;
8844 width: calc(100% - 22px); 8848 width: calc(100% - 22px);
8845 } 8849 }
8846 .cabinet__works-spoiler-right { 8850 .cabinet__works-spoiler-right {
8847 width: 22px; 8851 width: 22px;
8848 height: 22px; 8852 height: 22px;
8849 display: -webkit-box; 8853 display: -webkit-box;
8850 display: -ms-flexbox; 8854 display: -ms-flexbox;
8851 display: flex; 8855 display: flex;
8852 -webkit-box-align: center; 8856 -webkit-box-align: center;
8853 -ms-flex-align: center; 8857 -ms-flex-align: center;
8854 align-items: center; 8858 align-items: center;
8855 -webkit-box-pack: center; 8859 -webkit-box-pack: center;
8856 -ms-flex-pack: center; 8860 -ms-flex-pack: center;
8857 justify-content: center; 8861 justify-content: center;
8858 color: #377d87; 8862 color: #377d87;
8859 padding: 0; 8863 padding: 0;
8860 background: none; 8864 background: none;
8861 border: none; 8865 border: none;
8862 } 8866 }
8863 .cabinet__works-spoiler-right svg { 8867 .cabinet__works-spoiler-right svg {
8864 width: 60%; 8868 width: 60%;
8865 aspect-ratio: 1/1; 8869 aspect-ratio: 1/1;
8866 -webkit-transform: rotate(90deg); 8870 -webkit-transform: rotate(90deg);
8867 -ms-transform: rotate(90deg); 8871 -ms-transform: rotate(90deg);
8868 transform: rotate(90deg); 8872 transform: rotate(90deg);
8869 -webkit-transition: 0.3s; 8873 -webkit-transition: 0.3s;
8870 transition: 0.3s; 8874 transition: 0.3s;
8871 } 8875 }
8872 .cabinet__works-spoiler.active .cabinet__works-spoiler-right svg { 8876 .cabinet__works-spoiler.active .cabinet__works-spoiler-right svg {
8873 -webkit-transform: rotate(-90deg); 8877 -webkit-transform: rotate(-90deg);
8874 -ms-transform: rotate(-90deg); 8878 -ms-transform: rotate(-90deg);
8875 transform: rotate(-90deg); 8879 transform: rotate(-90deg);
8876 } 8880 }
8877 .cabinet__works-spoiler-buttons { 8881 .cabinet__works-spoiler-buttons {
8878 display: -webkit-box; 8882 display: -webkit-box;
8879 display: -ms-flexbox; 8883 display: -ms-flexbox;
8880 display: flex; 8884 display: flex;
8881 -webkit-box-align: center; 8885 -webkit-box-align: center;
8882 -ms-flex-align: center; 8886 -ms-flex-align: center;
8883 align-items: center; 8887 align-items: center;
8884 -webkit-box-pack: justify; 8888 -webkit-box-pack: justify;
8885 -ms-flex-pack: justify; 8889 -ms-flex-pack: justify;
8886 justify-content: space-between; 8890 justify-content: space-between;
8887 width: 60px; 8891 width: 60px;
8888 } 8892 }
8889 @media (min-width: 768px) { 8893 @media (min-width: 768px) {
8890 .cabinet__works-spoiler-buttons { 8894 .cabinet__works-spoiler-buttons {
8891 width: 74px; 8895 width: 74px;
8892 } 8896 }
8893 } 8897 }
8894 .cabinet__works-spoiler-buttons .button { 8898 .cabinet__works-spoiler-buttons .button {
8895 width: 22px; 8899 width: 22px;
8896 height: 22px; 8900 height: 22px;
8897 padding: 0; 8901 padding: 0;
8898 } 8902 }
8899 @media (min-width: 768px) { 8903 @media (min-width: 768px) {
8900 .cabinet__works-spoiler-buttons .button { 8904 .cabinet__works-spoiler-buttons .button {
8901 width: 30px; 8905 width: 30px;
8902 height: 30px; 8906 height: 30px;
8903 } 8907 }
8904 } 8908 }
8905 .cabinet__works-spoiler-text { 8909 .cabinet__works-spoiler-text {
8906 width: calc(100% - 60px); 8910 width: calc(100% - 60px);
8907 padding-left: 20px; 8911 padding-left: 20px;
8908 font-size: 17px; 8912 font-size: 17px;
8909 font-weight: 700; 8913 font-weight: 700;
8910 color: #000; 8914 color: #000;
8911 } 8915 }
8912 @media (min-width: 768px) { 8916 @media (min-width: 768px) {
8913 .cabinet__works-spoiler-text { 8917 .cabinet__works-spoiler-text {
8914 width: calc(100% - 74px); 8918 width: calc(100% - 74px);
8915 font-size: 20px; 8919 font-size: 20px;
8916 } 8920 }
8917 } 8921 }
8918 .cabinet__works-body { 8922 .cabinet__works-body {
8919 opacity: 0; 8923 opacity: 0;
8920 height: 0; 8924 height: 0;
8921 overflow: hidden; 8925 overflow: hidden;
8922 } 8926 }
8923 .active + .cabinet__works-body { 8927 .active + .cabinet__works-body {
8924 -webkit-transition: 0.3s; 8928 -webkit-transition: 0.3s;
8925 transition: 0.3s; 8929 transition: 0.3s;
8926 opacity: 1; 8930 opacity: 1;
8927 height: auto; 8931 height: auto;
8928 padding-top: 20px; 8932 padding-top: 20px;
8929 } 8933 }
8930 .cabinet__works-add { 8934 .cabinet__works-add {
8931 padding: 0; 8935 padding: 0;
8932 width: 100%; 8936 width: 100%;
8933 max-width: 160px; 8937 max-width: 160px;
8934 } 8938 }
8935 @media (min-width: 768px) { 8939 @media (min-width: 768px) {
8936 .cabinet__works-add { 8940 .cabinet__works-add {
8937 max-width: 220px; 8941 max-width: 220px;
8938 } 8942 }
8939 } 8943 }
8940 .cabinet__buttons { 8944 .cabinet__buttons {
8941 display: -webkit-box; 8945 display: -webkit-box;
8942 display: -ms-flexbox; 8946 display: -ms-flexbox;
8943 display: flex; 8947 display: flex;
8944 -webkit-box-orient: vertical; 8948 -webkit-box-orient: vertical;
8945 -webkit-box-direction: normal; 8949 -webkit-box-direction: normal;
8946 -ms-flex-direction: column; 8950 -ms-flex-direction: column;
8947 flex-direction: column; 8951 flex-direction: column;
8948 -webkit-box-align: center; 8952 -webkit-box-align: center;
8949 -ms-flex-align: center; 8953 -ms-flex-align: center;
8950 align-items: center; 8954 align-items: center;
8951 gap: 10px; 8955 gap: 10px;
8952 } 8956 }
8953 @media (min-width: 768px) { 8957 @media (min-width: 768px) {
8954 .cabinet__buttons { 8958 .cabinet__buttons {
8955 display: grid; 8959 display: grid;
8956 grid-template-columns: 1fr 1fr; 8960 grid-template-columns: 1fr 1fr;
8957 gap: 20px; 8961 gap: 20px;
8958 } 8962 }
8959 } 8963 }
8960 .cabinet__buttons .button, 8964 .cabinet__buttons .button,
8961 .cabinet__buttons .file { 8965 .cabinet__buttons .file {
8962 padding: 0; 8966 padding: 0;
8963 width: 100%; 8967 width: 100%;
8964 max-width: 140px; 8968 max-width: 140px;
8965 } 8969 }
8966 @media (min-width: 768px) { 8970 @media (min-width: 768px) {
8967 .cabinet__buttons .button, 8971 .cabinet__buttons .button,
8968 .cabinet__buttons .file { 8972 .cabinet__buttons .file {
8969 max-width: none; 8973 max-width: none;
8970 } 8974 }
8971 } 8975 }
8972 @media (min-width: 768px) { 8976 @media (min-width: 768px) {
8973 .cabinet__buttons { 8977 .cabinet__buttons {
8974 gap: 20px; 8978 gap: 20px;
8975 } 8979 }
8976 } 8980 }
8977 @media (min-width: 1280px) { 8981 @media (min-width: 1280px) {
8978 .cabinet__buttons { 8982 .cabinet__buttons {
8979 max-width: 400px; 8983 max-width: 400px;
8980 } 8984 }
8981 } 8985 }
8982 .cabinet__vacs { 8986 .cabinet__vacs {
8983 display: -webkit-box; 8987 display: -webkit-box;
8984 display: -ms-flexbox; 8988 display: -ms-flexbox;
8985 display: flex; 8989 display: flex;
8986 -webkit-box-orient: vertical; 8990 -webkit-box-orient: vertical;
8987 -webkit-box-direction: reverse; 8991 -webkit-box-direction: reverse;
8988 -ms-flex-direction: column-reverse; 8992 -ms-flex-direction: column-reverse;
8989 flex-direction: column-reverse; 8993 flex-direction: column-reverse;
8990 -webkit-box-align: center; 8994 -webkit-box-align: center;
8991 -ms-flex-align: center; 8995 -ms-flex-align: center;
8992 align-items: center; 8996 align-items: center;
8993 gap: 20px; 8997 gap: 20px;
8994 } 8998 }
8995 .cabinet__vacs-body { 8999 .cabinet__vacs-body {
8996 display: -webkit-box; 9000 display: -webkit-box;
8997 display: -ms-flexbox; 9001 display: -ms-flexbox;
8998 display: flex; 9002 display: flex;
8999 -webkit-box-orient: vertical; 9003 -webkit-box-orient: vertical;
9000 -webkit-box-direction: normal; 9004 -webkit-box-direction: normal;
9001 -ms-flex-direction: column; 9005 -ms-flex-direction: column;
9002 flex-direction: column; 9006 flex-direction: column;
9003 gap: 20px; 9007 gap: 20px;
9004 width: 100%; 9008 width: 100%;
9005 } 9009 }
9006 @media (min-width: 768px) { 9010 @media (min-width: 768px) {
9007 .cabinet__vacs-body { 9011 .cabinet__vacs-body {
9008 gap: 30px; 9012 gap: 30px;
9009 } 9013 }
9010 } 9014 }
9011 .cabinet__vacs-item { 9015 .cabinet__vacs-item {
9012 display: none; 9016 display: none;
9013 background: #fff; 9017 background: #fff;
9014 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 9018 -webkit-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
9015 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2); 9019 box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2);
9016 } 9020 }
9017 .cabinet__vacs-item:nth-of-type(1), .cabinet__vacs-item:nth-of-type(2) { 9021 .cabinet__vacs-item:nth-of-type(1), .cabinet__vacs-item:nth-of-type(2) {
9018 display: -webkit-box; 9022 display: -webkit-box;
9019 display: -ms-flexbox; 9023 display: -ms-flexbox;
9020 display: flex; 9024 display: flex;
9021 } 9025 }
9022 .cabinet__vacs.active .cabinet__vacs-item { 9026 .cabinet__vacs.active .cabinet__vacs-item {
9023 display: -webkit-box; 9027 display: -webkit-box;
9024 display: -ms-flexbox; 9028 display: -ms-flexbox;
9025 display: flex; 9029 display: flex;
9026 } 9030 }
9027 9031
resources/views/workers/cabinet.blade.php
1 @extends('layout.frontend', ['title' => 'Моя анкета - РекаМоре']) 1 @extends('layout.frontend', ['title' => 'Моя анкета - РекаМоре'])
2 2
3 @section('scripts') 3 @section('scripts')
4 <script> 4 <script>
5 console.log('Test system'); 5 $(function() {
6 $('.cabinet__avatar-form [type="file"][name="photo"]').change(function (event) {
7 const file = event.target.files[0];
8
9 if (file) {
10 var img_wrap = $('.cabinet__avatar-pic');
11 var img = img_wrap.find('img');
12 const reader = new FileReader();
13
14 reader.onload = function(e) {
15 img.attr('src', e.target.result);
16 img_wrap.find('svg').remove();
17 img_wrap.append(img);
18 };
19
20 reader.readAsDataURL(file);
21 }
22 });
23 });
24
6 $(document).on('click', '#button_new_doc123', function() { 25 $(document).on('click', '#button_new_doc123', function() {
7 var this_ = $(this); 26 var this_ = $(this);
8 var val_ = this_.attr('data-val'); 27 var val_ = this_.attr('data-val');
9 var new_diplom = $('#new_diplom'); 28 var new_diplom = $('#new_diplom');
10 var new_diplom_val = new_diplom.val(); 29 var new_diplom_val = new_diplom.val();
11 var new_data_begin = $('#new_data_begin'); 30 var new_data_begin = $('#new_data_begin');
12 var new_data_begin_val = new_data_begin.val(); 31 var new_data_begin_val = new_data_begin.val();
13 var new_data_end = $('#new_data_end'); 32 var new_data_end = $('#new_data_end');
14 var new_data_end_val = new_data_end.val(); 33 var new_data_end_val = new_data_end.val();
15 var education = $('#education'); 34 var education = $('#education');
16 var education_val = education.val(); 35 var education_val = education.val();
17 var worker_id = $('#new_id'); 36 var worker_id = $('#new_id');
18 var worker_val = worker_id.val(); 37 var worker_val = worker_id.val();
19 38
20 console.log('sort items ' + val_); 39 console.log('sort items ' + val_);
21 40
22 if (new_diplom_val == '') { 41 if (new_diplom_val == '') {
23 new_diplom.addClass('err_red'); 42 new_diplom.addClass('err_red');
24 console.log('Border Up'); 43 console.log('Border Up');
25 } else { 44 } else {
26 $.ajax({ 45 $.ajax({
27 type: "GET", 46 type: "GET",
28 url: "{{ route('worker.add_serificate') }}", 47 url: "{{ route('worker.add_serificate') }}",
29 data: "worker_id="+worker_val+"&date_begin="+new_data_begin_val + "&end_begin=" + new_data_end_val + "&name=" + new_diplom_val + "&education="+education_val, 48 data: "worker_id="+worker_val+"&date_begin="+new_data_begin_val + "&end_begin=" + new_data_end_val + "&name=" + new_diplom_val + "&education="+education_val,
30 success: function (data) { 49 success: function (data) {
31 console.log('Блокировка...'); 50 console.log('Блокировка...');
32 console.log(data); 51 console.log(data);
33 $('#sertificate').html(data); 52 $('#sertificate').html(data);
34 if (new_diplom.hasClass('err_red')) new_diplom.removeClass('err_red'); 53 if (new_diplom.hasClass('err_red')) new_diplom.removeClass('err_red');
35 }, 54 },
36 headers: { 55 headers: {
37 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 56 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
38 }, 57 },
39 error: function (data) { 58 error: function (data) {
40 data = JSON.stringify(data); 59 data = JSON.stringify(data);
41 console.log('Error: ' + data); 60 console.log('Error: ' + data);
42 } 61 }
43 }); 62 });
44 } 63 }
45 }); 64 });
46 65
47 $(document).on('click', '#btn_new_diplom123', function() { 66 $(document).on('click', '#btn_new_diplom123', function() {
48 var this_ = $(this); 67 var this_ = $(this);
49 var val_ = this_.attr('data-val'); 68 var val_ = this_.attr('data-val');
50 var documents = $('#documents'); 69 var documents = $('#documents');
51 var doc_val = documents.val(); 70 var doc_val = documents.val();
52 var block = $('#ajax_dop_diplomi'); 71 var block = $('#ajax_dop_diplomi');
53 72
54 console.log('worker_id='+val_+'it_infoblock='+ doc_val); 73 console.log('worker_id='+val_+'it_infoblock='+ doc_val);
55 74
56 $.ajax({ 75 $.ajax({
57 type: "GET", 76 type: "GET",
58 url: "", 77 url: "",
59 data: "worker_id="+val_+"&infoblok_id="+doc_val, 78 data: "worker_id="+val_+"&infoblok_id="+doc_val,
60 success: function (data) { 79 success: function (data) {
61 location.url = data; 80 location.url = data;
62 console.log('Добавление документа-диплома'); 81 console.log('Добавление документа-диплома');
63 console.log(data); 82 console.log(data);
64 block.html(data); 83 block.html(data);
65 }, 84 },
66 headers: { 85 headers: {
67 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 86 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
68 }, 87 },
69 error: function (data) { 88 error: function (data) {
70 data = JSON.stringify(data); 89 data = JSON.stringify(data);
71 console.log('Error: ' + data); 90 console.log('Error: ' + data);
72 } 91 }
73 }); 92 });
74 }); 93 });
75 94
76 $(document).on('click', '#new_work', function() { 95 $(document).on('click', '#new_work', function() {
77 var this_ = $(this); 96 var this_ = $(this);
78 var val_ = this_.attr('data-val'); 97 var val_ = this_.attr('data-val');
79 var new_diplom = $('#new_diplom').val(); 98 var new_diplom = $('#new_diplom').val();
80 var new_data_begin = $('#new_data_begin').val(); 99 var new_data_begin = $('#new_data_begin').val();
81 var new_data_end = $('#new_data_end').val(); 100 var new_data_end = $('#new_data_end').val();
82 var new_job_title = $('#new_job_title').val(); 101 var new_job_title = $('#new_job_title').val();
83 var new_teplohod = $('#new_teplohod').val(); 102 var new_teplohod = $('#new_teplohod').val();
84 var new_GWT = $('#new_GWT').val(); 103 var new_GWT = $('#new_GWT').val();
85 var new_KBT = $('#new_KBT').val(); 104 var new_KBT = $('#new_KBT').val();
86 var new_Begin_work = $('#new_Begin_work').val(); 105 var new_Begin_work = $('#new_Begin_work').val();
87 var new_End_work = $('#new_End_work').val(); 106 var new_End_work = $('#new_End_work').val();
88 var new_name_company = $('#new_name_company').val(); 107 var new_name_company = $('#new_name_company').val();
89 108
90 console.log('worker_id='+val_+'it_infoblock='+ doc_val); 109 console.log('worker_id='+val_+'it_infoblock='+ doc_val);
91 110
92 $.ajax({ 111 $.ajax({
93 type: "GET", 112 type: "GET",
94 url: "", 113 url: "",
95 data: "worker_id="+val_+"&infoblok_id="+doc_val, 114 data: "worker_id="+val_+"&infoblok_id="+doc_val,
96 success: function (data) { 115 success: function (data) {
97 location.url = data; 116 location.url = data;
98 console.log('Добавление документа-диплома'); 117 console.log('Добавление документа-диплома');
99 console.log(data); 118 console.log(data);
100 block.html(data); 119 block.html(data);
101 }, 120 },
102 headers: { 121 headers: {
103 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 122 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
104 }, 123 },
105 error: function (data) { 124 error: function (data) {
106 data = JSON.stringify(data); 125 data = JSON.stringify(data);
107 console.log('Error: ' + data); 126 console.log('Error: ' + data);
108 } 127 }
109 }); 128 });
110 }); 129 });
111 130
112 $(document).on('click', '#old_year', function() { 131 $(document).on('click', '#old_year', function() {
113 var this_ = $(this); 132 var this_ = $(this);
114 var val = this_.val(); 133 var val = this_.val();
115 134
116 if (val < 0) 135 if (val < 0)
117 $('#old_year').val(0); 136 $('#old_year').val(0);
118 137
119 console.log('Возраст не может выполнить такую операцию'); 138 console.log('Возраст не может выполнить такую операцию');
120 }); 139 });
121 140
122 $(document).on('change', '.sertificates_js', function() { 141 $(document).on('change', '.sertificates_js', function() {
123 var this_ = $(this); 142 var this_ = $(this);
124 var infoblock_id = this_.attr('data-info'); 143 var infoblock_id = this_.attr('data-info');
125 var val = this_.val(); 144 var val = this_.val();
126 var block = $('#block_sertificate'); 145 var block = $('#block_sertificate');
127 146
128 console.log('infoblok='+infoblock_id); 147 console.log('infoblok='+infoblock_id);
129 console.log('val='+val); 148 console.log('val='+val);
130 149
131 $.ajax({ 150 $.ajax({
132 type: "GET", 151 type: "GET",
133 url: "{{ route('worker.delete_add_diplom', ['worker' => $Worker[0]->id]) }}", 152 url: "{{ route('worker.delete_add_diplom', ['worker' => $Worker[0]->id]) }}",
134 data: "&infoblok_id=" + infoblock_id+"&val="+val, 153 data: "&infoblok_id=" + infoblock_id+"&val="+val,
135 success: function (data) { 154 success: function (data) {
136 location.url = data; 155 location.url = data;
137 console.log('Удаление левых документов + добавление реальных документов'); 156 console.log('Удаление левых документов + добавление реальных документов');
138 157
139 console.log('Info 100% +'+ data); 158 console.log('Info 100% +'+ data);
140 //window.location.href = data; 159 //window.location.href = data;
141 //block.html(data); 160 //block.html(data);
142 }, 161 },
143 headers: { 162 headers: {
144 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 163 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
145 }, 164 },
146 error: function (data) { 165 error: function (data) {
147 data = JSON.stringify(data); 166 data = JSON.stringify(data);
148 console.log('Error: ' + data); 167 console.log('Error: ' + data);
149 } 168 }
150 }); 169 });
151 170
152 }); 171 });
153 172
154 </script> 173 </script>
155 @endsection 174 @endsection
156 175
157 @section('content') 176 @section('content')
158 <section class="cabinet"> 177 <section class="cabinet">
159 <div class="container"> 178 <div class="container">
160 <ul class="breadcrumbs cabinet__breadcrumbs"> 179 <ul class="breadcrumbs cabinet__breadcrumbs">
161 <li><a href="{{ route('index') }}">Главная</a></li> 180 <li><a href="{{ route('index') }}">Главная</a></li>
162 <li><b>Личный кабинет</b></li> 181 <li><b>Личный кабинет</b></li>
163 </ul> 182 </ul>
164 <div class="cabinet__wrapper"> 183 <div class="cabinet__wrapper">
165 <div class="cabinet__side"> 184 <div class="cabinet__side">
166 <div class="cabinet__side-toper"> 185 <div class="cabinet__side-toper">
167 @include('workers.emblema') 186 @include('workers.emblema')
168 187
169 </div> 188 </div>
170 189
171 @include('workers.menu', ['item' => 1]) 190 @include('workers.menu', ['item' => 1])
172 </div> 191 </div>
173 <form class="cabinet__body" action="{{ route('worker.cabinet_save', ['worker' => $Worker[0]->id]) }}" enctype="multipart/form-data" method="POST"> 192 <form class="cabinet__body" action="{{ route('worker.cabinet_save', ['worker' => $Worker[0]->id]) }}" enctype="multipart/form-data" method="POST">
174 @csrf 193 @csrf
175 @include('messages_error') 194 @include('messages_error')
176 <div class="cabinet__body-item"> 195 <div class="cabinet__body-item">
177 <div class="cabinet__anketa"> 196 <div class="cabinet__anketa">
178 <h2 class="title cabinet__title">Моя анкета</h2> 197 <h2 class="title cabinet__title">Моя анкета</h2>
179 <div class="cabinet__anketa-buttons"> 198 <div class="cabinet__anketa-buttons">
180 <a href="{{ route('worker.up', ['worker' => $Worker[0]->id]) }}" class="button">Поднять резюме</a> 199 <a href="{{ route('worker.up', ['worker' => $Worker[0]->id]) }}" class="button">Поднять резюме</a>
181 <a href="{{ route('resume_download', ['worker' => $Worker[0]->id]) }}" target="_blank" class="button"> 200 <a href="{{ route('resume_download', ['worker' => $Worker[0]->id]) }}" target="_blank" class="button">
182 <svg> 201 <svg>
183 <use xlink:href="{{ asset('images/sprite.svg#share') }}"></use> 202 <use xlink:href="{{ asset('images/sprite.svg#share') }}"></use>
184 </svg> 203 </svg>
185 Скачать резюме 204 Скачать резюме
186 </a> 205 </a>
187 </div> 206 </div>
188 </div> 207 </div>
189 </div> 208 </div>
190 <div class="cabinet__body-item"> 209 <div class="cabinet__body-item">
191 <div class="cabinet__stats"> 210 <div class="cabinet__stats">
192 <h3 class="cabinet__subtitle cabinet__stats-title">Статистика</h3> 211 <h3 class="cabinet__subtitle cabinet__stats-title">Статистика</h3>
193 <div class="cabinet__stats-body"> 212 <div class="cabinet__stats-body">
194 <div class="cabinet__stats-item"> 213 <div class="cabinet__stats-item">
195 <svg> 214 <svg>
196 <use xlink:href="{{ asset('images/sprite.svg#eye-3') }}"></use> 215 <use xlink:href="{{ asset('images/sprite.svg#eye-3') }}"></use>
197 </svg> 216 </svg>
198 <span>Просмотров:</span> 217 <span>Просмотров:</span>
199 <b>@if (isset($stat[0]->lookin)) {{ $stat[0]->lookin }} @else 0 @endif</b> 218 <b>@if (isset($stat[0]->lookin)) {{ $stat[0]->lookin }} @else 0 @endif</b>
200 </div> 219 </div>
201 <div class="cabinet__stats-item"> 220 <div class="cabinet__stats-item">
202 <svg> 221 <svg>
203 <use xlink:href="{{ asset('images/sprite.svg#warning') }}"></use> 222 <use xlink:href="{{ asset('images/sprite.svg#warning') }}"></use>
204 </svg> 223 </svg>
205 <span>Отзывов:</span> 224 <span>Отзывов:</span>
206 <b>@if(isset($Worker[0]->response)) {{ $Worker[0]->response->count() }} @else 0 @endif</b> 225 <b>@if(isset($Worker[0]->response)) {{ $Worker[0]->response->count() }} @else 0 @endif</b>
207 </div> 226 </div>
208 </div> 227 </div>
209 <div class="cabinet__stats-subtitle">Анкета заполнена на {{ $persent }}%</div> 228 <div class="cabinet__stats-subtitle">Анкета заполнена на {{ $persent }}%</div>
210 <div class="cabinet__stats-line"> 229 <div class="cabinet__stats-line">
211 <span style="width:{{ $persent }}%"></span> 230 <span style="width:{{ $persent }}%"></span>
212 </div> 231 </div>
213 <div class="cabinet__stats-bottom">Заполните профиль, чтобы повысить процент анкеты на 80%</div> 232 <div class="cabinet__stats-bottom">Заполните профиль, чтобы повысить процент анкеты на 80%</div>
214 </div> 233 </div>
215 </div> 234 </div>
216 <div class="cabinet__body-item"> 235 <div class="cabinet__body-item">
217 <h3 class="cabinet__subtitle">Профиль</h3> 236 <h3 class="cabinet__subtitle">Профиль</h3>
218 <div class="cabinet__avatar"> 237 <div class="cabinet__avatar">
219 <div class="cabinet__avatar-pic"> 238 <div class="cabinet__avatar-pic">
220 239
221 @if (!empty($Worker[0]->photo)) 240 @if (!empty($Worker[0]->photo))
222 <img src="{{ asset(Storage::url($Worker[0]->photo)) }}"/> 241 <img src="{{ asset(Storage::url($Worker[0]->photo)) }}"/>
223 @else 242 @else
224 <svg> 243 <svg>
225 <use xlink:href="{{ asset('images/sprite.svg#pic') }}"></use> 244 <use xlink:href="{{ asset('images/sprite.svg#pic') }}"></use>
226 </svg> 245 </svg>
227 @endif 246 @endif
228 </div> 247 </div>
229 <div class="cabinet__avatar-form"> 248 <div class="cabinet__avatar-form">
230 <label class="file"> 249 <label class="file">
231 <span class="file__input"> 250 <span class="file__input">
232 <input type="file" name="photo" id="photo"> 251 <input type="file" name="photo" id="photo">
233 252
234 <span class="button"> 253 <span class="button">
235 <svg> 254 <svg>
236 <use xlink:href="{{ asset('images/sprite.svg#plus') }}"></use> 255 <use xlink:href="{{ asset('images/sprite.svg#plus') }}"></use>
237 </svg> 256 </svg>
238 Загрузить 257 Загрузить
239 </span> 258 </span>
240 </span> 259 </span>
241 </label> 260 </label>
242 <p class="cabinet__text">Загрузите фотографию в формате svg., jpg., jpeg., png.</p> 261 <p class="cabinet__text">Загрузите фотографию в формате svg., jpg., jpeg., png.</p>
243 </div> 262 </div>
244 </div> 263 </div>
245 </div> 264 </div>
246 <div class="cabinet__body-item"> 265 <div class="cabinet__body-item">
247 <div class="cabinet__inputs"> 266 <div class="cabinet__inputs">
248 <div class="cabinet__inputs-item form-group"> 267 <div class="cabinet__inputs-item form-group">
249 <label class="form-group__label">Электронная почта *</label> 268 <label class="form-group__label">Электронная почта *</label>
250 <div class="form-group__item"> 269 <div class="form-group__item">
251 <input type="email" name="email" id="email" value="{{ $Worker[0]->email }}" class="input" placeholder="info@rekamore.su" required> 270 <input type="email" name="email" id="email" value="{{ $Worker[0]->email }}" class="input" placeholder="info@rekamore.su" required>
252 </div> 271 </div>
253 </div> 272 </div>
254 <div class="cabinet__inputs-item form-group"> 273 <div class="cabinet__inputs-item form-group">
255 <label class="form-group__label">Статус</label> 274 <label class="form-group__label">Статус</label>
256 <div class="form-group__item"> 275 <div class="form-group__item">
257 <div class="select"> 276 <div class="select">
258 <select class="js-select2" name="status_work" id="status_work"> 277 <select class="js-select2" name="status_work" id="status_work">
259 <option value="1" @if ($Worker[0]->status_work == 1) selected @endif>Не указано</option> 278 <option value="1" @if ($Worker[0]->status_work == 1) selected @endif>Не указано</option>
260 <option value="2" @if ($Worker[0]->status_work == 2) selected @endif>Не ищу работу</option> 279 <option value="2" @if ($Worker[0]->status_work == 2) selected @endif>Не ищу работу</option>
261 <option value="0" @if ($Worker[0]->status_work == 0) selected @endif>Ищу работу</option> 280 <option value="0" @if ($Worker[0]->status_work == 0) selected @endif>Ищу работу</option>
262 </select> 281 </select>
263 </div> 282 </div>
264 </div> 283 </div>
265 </div> 284 </div>
266 <!--<div class="cabinet__inputs-item form-group"> 285 <!--<div class="cabinet__inputs-item form-group">
267 <label class="form-group__label">Статус *</label> 286 <label class="form-group__label">Статус *</label>
268 <div class="form-group__item"> 287 <div class="form-group__item">
269 <input type="text" class="input" required> 288 <input type="text" class="input" required>
270 </div> 289 </div>
271 </div>--> 290 </div>-->
272 @if (isset($Worker[0]->users)) 291 @if (isset($Worker[0]->users))
273 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 292 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
274 <label class="form-group__label">Фамилия *</label> 293 <label class="form-group__label">Фамилия *</label>
275 <div class="form-group__item"> 294 <div class="form-group__item">
276 <input type="text" name="surname" id="surmane" class="input" value="{{ $Worker[0]->users->surname }}" placeholder="Филиппов" required> 295 <input type="text" name="surname" id="surmane" class="input" value="{{ $Worker[0]->users->surname }}" placeholder="Филиппов" required>
277 </div> 296 </div>
278 </div> 297 </div>
279 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 298 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
280 <label class="form-group__label">Имя *</label> 299 <label class="form-group__label">Имя *</label>
281 <div class="form-group__item"> 300 <div class="form-group__item">
282 <input type="text" name="name_man" id="name_man" class="input" value="{{ $Worker[0]->users->name_man }}" placeholder="Егор" required> 301 <input type="text" name="name_man" id="name_man" class="input" value="{{ $Worker[0]->users->name_man }}" placeholder="Егор" required>
283 </div> 302 </div>
284 </div> 303 </div>
285 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 304 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
286 <label class="form-group__label">Отчество *</label> 305 <label class="form-group__label">Отчество *</label>
287 <div class="form-group__item"> 306 <div class="form-group__item">
288 <input type="text" class="input" name="surname2" id="surmane2" value="{{ $Worker[0]->users->surname2 }}" placeholder="Алексеевич"> 307 <input type="text" class="input" name="surname2" id="surmane2" value="{{ $Worker[0]->users->surname2 }}" placeholder="Алексеевич">
289 </div> 308 </div>
290 </div> 309 </div>
291 @endif 310 @endif
292 </div> 311 </div>
293 </div> 312 </div>
294 <div class="cabinet__body-item"> 313 <div class="cabinet__body-item">
295 <h3 class="cabinet__subtitle">Основная информация</h3> 314 <h3 class="cabinet__subtitle">Основная информация</h3>
296 <div class="cabinet__inputs"> 315 <div class="cabinet__inputs">
297 <div class="cabinet__inputs-item cabinet__inputs-item_min form-group"> 316 <div class="cabinet__inputs-item cabinet__inputs-item_min form-group">
298 <label class="form-group__label">Возраст</label> 317 <label class="form-group__label">Возраст</label>
299 <div class="form-group__item"> 318 <div class="form-group__item">
300 <input type="number" name="old_year" id="old_year" value="{{ $Worker[0]->old_year }}" class="input" placeholder="0" required> 319 <input type="number" name="old_year" id="old_year" value="{{ $Worker[0]->old_year }}" class="input" placeholder="0" required>
301 </div> 320 </div>
302 </div> 321 </div>
303 <div class="cabinet__inputs-item cabinet__inputs-item_max form-group"> 322 <div class="cabinet__inputs-item cabinet__inputs-item_max form-group">
304 <label class="form-group__label">Желаемые вакансии</label> 323 <label class="form-group__label">Желаемые вакансии</label>
305 <div class="form-group__item"> 324 <div class="form-group__item">
306 <div class="select"> 325 <div class="select">
307 <select class="js-select2" name="job_title_id[]" id="job_title_id[]" multiple="multiple"> 326 <select class="js-select2" name="job_title_id[]" id="job_title_id[]" multiple="multiple">
308 @if ($Job_titles->count()) 327 @if ($Job_titles->count())
309 @foreach($Job_titles as $it) 328 @foreach($Job_titles as $it)
310 @php $selected = false; @endphp 329 @php $selected = false; @endphp
311 @if (isset($Worker[0]->job_titles)) 330 @if (isset($Worker[0]->job_titles))
312 @if ($Worker[0]->job_titles->count()) 331 @if ($Worker[0]->job_titles->count())
313 @foreach($Worker[0]->job_titles as $select) 332 @foreach($Worker[0]->job_titles as $select)
314 @if ($it->id == $select->id) 333 @if ($it->id == $select->id)
315 @php $selected = true; @endphp 334 @php $selected = true; @endphp
316 @endif 335 @endif
317 @endforeach 336 @endforeach
318 @endif 337 @endif
319 @endif 338 @endif
320 <option value="{{ $it->id }}" @if ($selected) selected @endif>{{ $it->name }}</option> 339 <option value="{{ $it->id }}" @if ($selected) selected @endif>{{ $it->name }}</option>
321 @endforeach 340 @endforeach
322 @endif 341 @endif
323 </select> 342 </select>
324 </div> 343 </div>
325 </div> 344 </div>
326 </div> 345 </div>
327 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 346 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
328 <label class="form-group__label">Город</label> 347 <label class="form-group__label">Город</label>
329 <div class="form-group__item"> 348 <div class="form-group__item">
330 <input type="text" name="city" id="city" value="{{ $Worker[0]->city }}" class="input" placeholder="Челябинск" required> 349 <input type="text" name="city" id="city" value="{{ $Worker[0]->city }}" class="input" placeholder="Челябинск" required>
331 </div> 350 </div>
332 </div> 351 </div>
333 <div class="cabinet__inputs-item form-group"> 352 <div class="cabinet__inputs-item form-group">
334 <label class="form-group__label">Опыт работы</label> 353 <label class="form-group__label">Опыт работы</label>
335 <div class="form-group__item"> 354 <div class="form-group__item">
336 <div class="select"> 355 <div class="select">
337 <select class="js-select2" id="experience" name="experience"> 356 <select class="js-select2" id="experience" name="experience">
338 <option value="Не указано" @if (empty($Worker[0]->experience)) selected @endif>Не указано</option> 357 <option value="Не указано" @if (empty($Worker[0]->experience)) selected @endif>Не указано</option>
339 <option value="меньше 1 года" @if ($Worker[0]->experience == 'меньше 1 года') selected @endif>меньше 1 года</option> 358 <option value="меньше 1 года" @if ($Worker[0]->experience == 'меньше 1 года') selected @endif>меньше 1 года</option>
340 <option value="от 1 года до 3 лет" @if ($Worker[0]->experience == 'от 1 года до 3 лет') selected @endif>от 1 года до 3 лет</option> 359 <option value="от 1 года до 3 лет" @if ($Worker[0]->experience == 'от 1 года до 3 лет') selected @endif>от 1 года до 3 лет</option>
341 <option value="от 3 до 5 лет" @if ($Worker[0]->experience == 'от 3 до 5 лет') selected @endif>от 3 до 5 лет</option> 360 <option value="от 3 до 5 лет" @if ($Worker[0]->experience == 'от 3 до 5 лет') selected @endif>от 3 до 5 лет</option>
342 <option value="от 5 до 10 лет" @if ($Worker[0]->experience == 'от 5 до 10 лет') selected @endif>от 5 до 10 лет</option> 361 <option value="от 5 до 10 лет" @if ($Worker[0]->experience == 'от 5 до 10 лет') selected @endif>от 5 до 10 лет</option>
343 <option value="Больше 10 лет" @if ($Worker[0]->experience == 'Больше 10 лет') selected @endif>Больше 10 лет</option> 362 <option value="Больше 10 лет" @if ($Worker[0]->experience == 'Больше 10 лет') selected @endif>Больше 10 лет</option>
344 </select> 363 </select>
345 </div> 364 </div>
346 </div> 365 </div>
347 </div> 366 </div>
348 367
349 <div class="cabinet__inputs-item form-group"> 368 <div class="cabinet__inputs-item form-group">
350 <label class="form-group__label">Номер телефона 1</label> 369 <label class="form-group__label">Номер телефона 1</label>
351 <div class="form-group__item"> 370 <div class="form-group__item">
352 <input type="tel" name="telephone" id="telephone" value="{{ old('telephone') ?? $Worker[0]->telephone ?? '' }}" class="input" placeholder="+7 (___) ___-__-__" required> 371 <input type="tel" name="telephone" id="telephone" value="{{ old('telephone') ?? $Worker[0]->telephone ?? '' }}" class="input" placeholder="+7 (___) ___-__-__" required>
353 </div> 372 </div>
354 </div> 373 </div>
355 <div class="cabinet__inputs-item form-group"> 374 <div class="cabinet__inputs-item form-group">
356 <label class="form-group__label">Номер телефона 2</label> 375 <label class="form-group__label">Номер телефона 2</label>
357 <div class="form-group__item"> 376 <div class="form-group__item">
358 <input type="tel" name="telephone2" id="telephon2" value="{{ old('telephone2') ?? $Worker[0]->telephone2 ?? '' }}" class="input" placeholder="+7 (___) ___-__-__"> 377 <input type="tel" name="telephone2" id="telephon2" value="{{ old('telephone2') ?? $Worker[0]->telephone2 ?? '' }}" class="input" placeholder="+7 (___) ___-__-__">
359 </div> 378 </div>
360 </div> 379 </div>
361 </div> 380 </div>
362 </div> 381 </div>
363 382
364 <div class="cabinet__body-item"> 383 <div class="cabinet__body-item">
365 <h4 class="cabinet__h4">О себе</h4> 384 <h4 class="cabinet__h4">О себе</h4>
366 <textarea class="textarea" name="text" id="text" placeholder="Не указано">{{ $Worker[0]->text }}</textarea> 385 <textarea class="textarea" name="text" id="text" placeholder="Не указано">{{ $Worker[0]->text }}</textarea>
367 <div class="cabinet__buttons"> 386 <div class="cabinet__buttons">
368 <button type="submit" class="button">Сохранить</button> 387 <button type="submit" class="button">Сохранить</button>
369 <label class="file"> 388 <label class="file">
370 <span class="file__input"> 389 <span class="file__input">
371 <input type="file" name="file" id="file"> 390 <input type="file" name="file" id="file">
372 <span class="button button_light">@if (empty($Worker[0]->file)) Прикрепить резюме @else Обновить резюме @endif</span> 391 <span class="button button_light">@if (empty($Worker[0]->file)) Прикрепить резюме @else Обновить резюме @endif</span>
373 </span> 392 </span>
374 </label> 393 </label>
375 </div> 394 </div>
376 </div> 395 </div>
377 396
378 397
379 <div id="sertificate" name="sertificate"> 398 <div id="sertificate" name="sertificate">
380 @if ((isset($Worker[0]->sertificate)) && ($Worker[0]->sertificate->count() > 0)) 399 @if ((isset($Worker[0]->sertificate)) && ($Worker[0]->sertificate->count() > 0))
381 @php $i = 0; @endphp 400 @php $i = 0; @endphp
382 @foreach($Worker[0]->sertificate as $it) 401 @foreach($Worker[0]->sertificate as $it)
383 <div style="margin-bottom: 20px" class="cabinet__body-item"> 402 <div style="margin-bottom: 20px" class="cabinet__body-item">
384 @if ($i == 0) 403 @if ($i == 0)
385 <h3 class="cabinet__subtitle">Сертификаты / документы</h3> 404 <h3 class="cabinet__subtitle">Сертификаты / документы</h3>
386 @endif 405 @endif
387 <h4 class="cabinet__h4">Сертификат {{ $i+1 }}</h4> 406 <h4 class="cabinet__h4">Сертификат {{ $i+1 }}</h4>
388 <div class="cabinet__inputs"> 407 <div class="cabinet__inputs">
389 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 408 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
390 <label class="form-group__label">Название сертификата:</label> 409 <label class="form-group__label">Название сертификата:</label>
391 <div class="form-group__item"> 410 <div class="form-group__item">
392 <input type="text" class="input" value="{{ $it->name }}" disabled> 411 <input type="text" class="input" value="{{ $it->name }}" disabled>
393 </div> 412 </div>
394 </div> 413 </div>
395 <!--<div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 414 <!--<div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
396 <label class="form-group__label">Учебное заведение</label> 415 <label class="form-group__label">Учебное заведение</label>
397 <div class="form-group__item"> 416 <div class="form-group__item">
398 <input type="text" class="input" value=" $it->education }}" disabled> 417 <input type="text" class="input" value=" $it->education }}" disabled>
399 </div> 418 </div>
400 </div>--> 419 </div>-->
401 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 420 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
402 <label class="form-group__label">Действителен до:</label> 421 <label class="form-group__label">Действителен до:</label>
403 <div class="form-group__item"> 422 <div class="form-group__item">
404 <input type="text" class="input" value="{{ $it->end_begin }}" disabled> 423 <input type="text" class="input" value="{{ $it->end_begin }}" disabled>
405 </div> 424 </div>
406 </div> 425 </div>
407 <a href="{{ route('worker.delete_sertificate', ['doc' => $it->id]) }}" class="button button_light"> 426 <a href="{{ route('worker.delete_sertificate', ['doc' => $it->id]) }}" class="button button_light">
408 <svg> 427 <svg>
409 <use xlink:href="{{ asset('images/sprite.svg#del') }}"></use> 428 <use xlink:href="{{ asset('images/sprite.svg#del') }}"></use>
410 </svg> 429 </svg>
411 Удалить 430 Удалить
412 </a> 431 </a>
413 <a href="{{ route('worker.edit_sertificate', ['worker' => $Worker[0]->id, 'doc' => $it->id ]) }}" class="button">Редактирование</a> 432 <a href="{{ route('worker.edit_sertificate', ['worker' => $Worker[0]->id, 'doc' => $it->id ]) }}" class="button">Редактирование</a>
414 </div> 433 </div>
415 </div> 434 </div>
416 @php $i++ @endphp 435 @php $i++ @endphp
417 @endforeach 436 @endforeach
418 @else 437 @else
419 <div style="margin-bottom: 20px" class="cabinet__body-item"> 438 <div style="margin-bottom: 20px" class="cabinet__body-item">
420 <h3 class="cabinet__subtitle">Сертификаты / документы</h3> 439 <h3 class="cabinet__subtitle">Сертификаты / документы</h3>
421 Нет сертификатов 440 Нет сертификатов
422 </div> 441 </div>
423 @endif 442 @endif
424 </div> 443 </div>
425 444
426 <div class="cabinet__body-item"> 445 <div class="cabinet__body-item">
427 <a class="button button_light" href="{{ route('worker.new_sertificate',['worker' => $Worker[0]->id]) }}" id="button_new_doc" name="button_new_doc"> 446 <a class="button button_light" href="{{ route('worker.new_sertificate',['worker' => $Worker[0]->id]) }}" id="button_new_doc" name="button_new_doc">
428 Добавить сертификат 447 Добавить сертификат
429 </a> 448 </a>
430 </div> 449 </div>
431 450
432 <div class="cabinet__body-item" name="ajax_dop_diplomi" id="ajax_dop_diplomi"> 451 <div class="cabinet__body-item" name="ajax_dop_diplomi" id="ajax_dop_diplomi">
433 <h4 class="cabinet__h4">Дополнительная информация</h4> 452 <h4 class="cabinet__h4">Дополнительная информация</h4>
434 <div class="cabinet__inputs" id="block_sertificate"> 453 <div class="cabinet__inputs" id="block_sertificate">
435 @if ($Infobloks->count()) 454 @if ($Infobloks->count())
436 @foreach ($Infobloks as $doc) 455 @foreach ($Infobloks as $doc)
437 <div class="cabinet__inputs-item form-group"> 456 <div class="cabinet__inputs-item form-group">
438 <label class="form-group__label">{{ $doc->name }}</label> 457 <label class="form-group__label">{{ $doc->name }}</label>
439 <div class="form-group__item"> 458 <div class="form-group__item">
440 <div class="select"> 459 <div class="select">
441 @php $Selected = 0; @endphp 460 @php $Selected = 0; @endphp
442 @if ($Worker[0]->infobloks->count()) 461 @if ($Worker[0]->infobloks->count())
443 @foreach ($Worker[0]->dop_info as $info) 462 @foreach ($Worker[0]->dop_info as $info)
444 @if ($info->infoblok_id == $doc->id) 463 @if ($info->infoblok_id == $doc->id)
445 @php $Selected = $info->status; @endphp 464 @php $Selected = $info->status; @endphp
446 @endif 465 @endif
447 @endforeach 466 @endforeach
448 @endif 467 @endif
449 <select data-info="{{ $doc->id }}" class="js-select2 sertificates_js"> 468 <select data-info="{{ $doc->id }}" class="js-select2 sertificates_js">
450 <option value="0" @if ($Selected == 0) selected @endif>Не указано</option> 469 <option value="0" @if ($Selected == 0) selected @endif>Не указано</option>
451 <option value="1" @if ($Selected == 1) selected @endif>В наличии</option> 470 <option value="1" @if ($Selected == 1) selected @endif>В наличии</option>
452 <option value="2" @if ($Selected == 2) selected @endif>Отсутствует</option> 471 <option value="2" @if ($Selected == 2) selected @endif>Отсутствует</option>
453 </select> 472 </select>
454 </div> 473 </div>
455 </div> 474 </div>
456 </div> 475 </div>
457 @endforeach 476 @endforeach
458 @endif 477 @endif
459 <!--_if (isset($Worker[0]->infobloks)) 478 <!--_if (isset($Worker[0]->infobloks))
460 _php dd($Worker[0]->infobloks) _endphp 479 _php dd($Worker[0]->infobloks) _endphp
461 _if ($Worker[0]->infobloks->count()) 480 _if ($Worker[0]->infobloks->count())
462 _php $i = 1; _endphp 481 _php $i = 1; _endphp
463 _foreach ($Worker[0]->infobloks as $info) 482 _foreach ($Worker[0]->infobloks as $info)
464 <div class="cabinet__inputs-item form-group"> 483 <div class="cabinet__inputs-item form-group">
465 <label class="form-group__label"> $info->name }}</label> 484 <label class="form-group__label"> $info->name }}</label>
466 <div class="form-group__item"> 485 <div class="form-group__item">
467 <div class="select"> 486 <div class="select">
468 <select data-info=" $info->id }}" class="js-select2 sertificates_js"> 487 <select data-info=" $info->id }}" class="js-select2 sertificates_js">
469 <option value="0">Нет</option> 488 <option value="0">Нет</option>
470 <option value="1" selected>Да</option> 489 <option value="1" selected>Да</option>
471 </select> 490 </select>
472 </div> 491 </div>
473 </div> 492 </div>
474 </div> 493 </div>
475 _php $i++; _endphp 494 _php $i++; _endphp
476 _endforeach 495 _endforeach
477 _endif 496 _endif
478 _endif 497 _endif
479 --> 498 -->
480 499
481 <!--<div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 500 <!--<div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
482 <label class="form-group__label">Образцы дипломов и документов</label> 501 <label class="form-group__label">Образцы дипломов и документов</label>
483 <div class="form-group__item"> 502 <div class="form-group__item">
484 <div class="select"> 503 <div class="select">
485 <select class="js-select2" id="documents" name="documents"> 504 <select class="js-select2" id="documents" name="documents">
486 _if ($Infoblocks->count()) 505 _if ($Infoblocks->count())
487 _foreach ($Infoblocks as $it) 506 _foreach ($Infoblocks as $it)
488 <option value="_$it->id }}">_$it->name }}</option> 507 <option value="_$it->id }}">_$it->name }}</option>
489 _endforeach 508 _endforeach
490 _endif 509 _endif
491 </select> 510 </select>
492 </div> 511 </div>
493 </div> 512 </div>
494 </div>--> 513 </div>-->
495 </div> 514 </div>
496 <!--<a href=" route('worker.add_diplom', ['worker' => $Worker[0]->id]) }}" name="btn_new_diplom" data-val="{{ $Worker[0]->id }}" id="btn_new_diplom" class="button button_light"> 515 <!--<a href=" route('worker.add_diplom', ['worker' => $Worker[0]->id]) }}" name="btn_new_diplom" data-val="{{ $Worker[0]->id }}" id="btn_new_diplom" class="button button_light">
497 Добавить документ 516 Добавить документ
498 </a>--> 517 </a>-->
499 </div> 518 </div>
500 <div class="cabinet__body-item"> 519 <div class="cabinet__body-item">
501 <div class="cabinet__works"> 520 <div class="cabinet__works">
502 @if (isset($Worker[0]->place_worker)) 521 @if (isset($Worker[0]->place_worker))
503 @php $i = 1; @endphp 522 @php $i = 1; @endphp
504 @foreach($Worker[0]->place_worker as $company) 523 @foreach($Worker[0]->place_worker as $company)
505 <div class="cabinet__works-item"> 524 <div class="cabinet__works-item">
506 <div class="cabinet__works-spoiler active"> 525 <div class="cabinet__works-spoiler active">
507 <div class="cabinet__works-spoiler-left"> 526 <div class="cabinet__works-spoiler-left">
508 <div class="cabinet__works-spoiler-buttons"> 527 <div class="cabinet__works-spoiler-buttons">
509 <a href="{{ route('worker.delete_document', ['doc' => $company->id]) }}" class="button button_light js-works-remove"> 528 <a href="{{ route('worker.delete_document', ['doc' => $company->id]) }}" class="button button_light js-works-remove">
510 <svg> 529 <svg>
511 <use xlink:href="{{ asset('images/sprite.svg#del') }}"></use> 530 <use xlink:href="{{ asset('images/sprite.svg#del') }}"></use>
512 </svg> 531 </svg>
513 </a> 532 </a>
514 <a href="{{ route('worker.edit_document', ['doc' => $company->id, 'worker' => $Worker[0]->id]) }}" type="button" class="button button_light js-works-edit"> 533 <a href="{{ route('worker.edit_document', ['doc' => $company->id, 'worker' => $Worker[0]->id]) }}" type="button" class="button button_light js-works-edit">
515 <svg> 534 <svg>
516 <use xlink:href="{{ asset('images/sprite.svg#pencil') }}"></use> 535 <use xlink:href="{{ asset('images/sprite.svg#pencil') }}"></use>
517 </svg> 536 </svg>
518 </a> 537 </a>
519 </div> 538 </div>
520 <div class="cabinet__works-spoiler-text">Место работы {{ $i }}</div> 539 <div class="cabinet__works-spoiler-text">Место работы {{ $i }}</div>
521 </div> 540 </div>
522 <button type="button" class="cabinet__works-spoiler-right js-parent-toggle"> 541 <button type="button" class="cabinet__works-spoiler-right js-parent-toggle">
523 <svg> 542 <svg>
524 <use xlink:href="{{ asset('images/sprite.svg#arrow-bold') }}"></use> 543 <use xlink:href="{{ asset('images/sprite.svg#arrow-bold') }}"></use>
525 </svg> 544 </svg>
526 </button> 545 </button>
527 </div> 546 </div>
528 <div class="cabinet__works-body"> 547 <div class="cabinet__works-body">
529 <div class="cabinet__inputs"> 548 <div class="cabinet__inputs">
530 <div class="cabinet__inputs-item form-group"> 549 <div class="cabinet__inputs-item form-group">
531 <label class="form-group__label">Должность</label> 550 <label class="form-group__label">Должность</label>
532 <div class="form-group__item"> 551 <div class="form-group__item">
533 <input type="text" class="input" value="{{ $company->job_title }}" disabled> 552 <input type="text" class="input" value="{{ $company->job_title }}" disabled>
534 </div> 553 </div>
535 </div> 554 </div>
536 <!--<div class="cabinet__inputs-item form-group"> 555 <!--<div class="cabinet__inputs-item form-group">
537 <label class="form-group__label">Опыт работы в танкерном флоте</label> 556 <label class="form-group__label">Опыт работы в танкерном флоте</label>
538 <div class="form-group__item"> 557 <div class="form-group__item">
539 <input type="text" class="input" value="@if ($company->tanker) Есть @else Нет @endif"> 558 <input type="text" class="input" value="@if ($company->tanker) Есть @else Нет @endif">
540 </div> 559 </div>
541 </div>--> 560 </div>-->
542 <div class="cabinet__inputs-item form-group"> 561 <div class="cabinet__inputs-item form-group">
543 <label class="form-group__label">Название т/х</label> 562 <label class="form-group__label">Название т/х</label>
544 <div class="form-group__item"> 563 <div class="form-group__item">
545 <input type="text" class="input" value="{{ $company->teplohod }}" disabled> 564 <input type="text" class="input" value="{{ $company->teplohod }}" disabled>
546 </div> 565 </div>
547 </div> 566 </div>
548 <div class="cabinet__inputs-item form-group"> 567 <div class="cabinet__inputs-item form-group">
549 <label class="form-group__label">Тип суда (GWT)</label> 568 <label class="form-group__label">Тип суда (GWT)</label>
550 <div class="form-group__item"> 569 <div class="form-group__item">
551 <input type="text" class="input" value="{{ $company->GWT }}" disabled> 570 <input type="text" class="input" value="{{ $company->GWT }}" disabled>
552 </div> 571 </div>
553 </div> 572 </div>
554 <div class="cabinet__inputs-item form-group"> 573 <div class="cabinet__inputs-item form-group">
555 <label class="form-group__label">Марка ГД</label> 574 <label class="form-group__label">Марка ГД</label>
556 <div class="form-group__item"> 575 <div class="form-group__item">
557 <input type="text" class="input" value="{{ $company->Marka_GD }}" disabled> 576 <input type="text" class="input" value="{{ $company->Marka_GD }}" disabled>
558 </div> 577 </div>
559 </div> 578 </div>
560 <div class="cabinet__inputs-item form-group"> 579 <div class="cabinet__inputs-item form-group">
561 <label class="form-group__label">Мощность ГД (кВТ)</label> 580 <label class="form-group__label">Мощность ГД (кВТ)</label>
562 <div class="form-group__item"> 581 <div class="form-group__item">
563 <input type="text" class="input" value="{{ $company->KBT }}" disabled> 582 <input type="text" class="input" value="{{ $company->KBT }}" disabled>
564 </div> 583 </div>
565 </div> 584 </div>
566 <div class="cabinet__inputs-item form-group"> 585 <div class="cabinet__inputs-item form-group">
567 <label class="form-group__label">Водоизмещение (GRT)</label> 586 <label class="form-group__label">Водоизмещение (GRT)</label>
568 <div class="form-group__item"> 587 <div class="form-group__item">
569 <input type="text" class="input" value="{{ $company->GRT }}" disabled> 588 <input type="text" class="input" value="{{ $company->GRT }}" disabled>
570 </div> 589 </div>
571 </div> 590 </div>
572 <div class="cabinet__inputs-item form-group"> 591 <div class="cabinet__inputs-item form-group">
573 <label class="form-group__label">Название компании</label> 592 <label class="form-group__label">Название компании</label>
574 <div class="form-group__item"> 593 <div class="form-group__item">
575 <input type="text" class="input" value="{{ $company->name_company }}" disabled> 594 <input type="text" class="input" value="{{ $company->name_company }}" disabled>
576 </div> 595 </div>
577 </div> 596 </div>
578 <div class="cabinet__inputs-item form-group"> 597 <div class="cabinet__inputs-item form-group">
579 <label class="form-group__label">Начало контракта</label> 598 <label class="form-group__label">Начало контракта</label>
580 <div class="form-group__item"> 599 <div class="form-group__item">
581 <input type="text" class="input" value="{{ $company->begin_work }}" disabled> 600 <input type="text" class="input" value="{{ $company->begin_work }}" disabled>
582 </div> 601 </div>
583 </div> 602 </div>
584 <div class="cabinet__inputs-item form-group"> 603 <div class="cabinet__inputs-item form-group">
585 <label class="form-group__label">Окончание контракта</label> 604 <label class="form-group__label">Окончание контракта</label>
586 <div class="form-group__item"> 605 <div class="form-group__item">
587 <input type="text" class="input" value="{{ $company->end_work }}" disabled> 606 <input type="text" class="input" value="{{ $company->end_work }}" disabled>
588 </div> 607 </div>
589 </div> 608 </div>
590 609
591 </div> 610 </div>
592 </div> 611 </div>
593 </div> 612 </div>
594 @php $i++ @endphp 613 @php $i++ @endphp
595 @endforeach 614 @endforeach
596 @endif 615 @endif
597 </div> 616 </div>
598 617
599 </div> 618 </div>
600 619
601 <a href="{{ route('worker.add_document', ['worker' => $Worker[0]->id]) }}" id="new_work" name="new_work" class="button button_light cabinet__works-add" style="width:100%; max-width:none;">Новое место работы</a> 620 <a href="{{ route('worker.add_document', ['worker' => $Worker[0]->id]) }}" id="new_work" name="new_work" class="button button_light cabinet__works-add" style="width:100%; max-width:none;">Новое место работы</a>
602 621
603 <div id="prev_worker" name="prev_worker"> 622 <div id="prev_worker" name="prev_worker">
604 @if ((isset($Worker[0]->prev_company)) && ($Worker[0]->prev_company->count() > 0)) 623 @if ((isset($Worker[0]->prev_company)) && ($Worker[0]->prev_company->count() > 0))
605 @php $i = 0; @endphp 624 @php $i = 0; @endphp
606 @foreach($Worker[0]->prev_company as $it) 625 @foreach($Worker[0]->prev_company as $it)
607 <div style="margin-bottom: 20px" class="cabinet__body-item"> 626 <div style="margin-bottom: 20px" class="cabinet__body-item">
608 @if ($i == 0) 627 @if ($i == 0)
609 <h3 class="cabinet__subtitle">Контакты предыдущих компаний</h3> 628 <h3 class="cabinet__subtitle">Контакты предыдущих компаний</h3>
610 @endif 629 @endif
611 <h4 class="cabinet__h4">Компания {{ $i+1 }}</h4> 630 <h4 class="cabinet__h4">Компания {{ $i+1 }}</h4>
612 <div class="cabinet__inputs"> 631 <div class="cabinet__inputs">
613 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 632 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
614 <label class="form-group__label">Название компании</label> 633 <label class="form-group__label">Название компании</label>
615 <div class="form-group__item"> 634 <div class="form-group__item">
616 <input type="text" class="input" value="{{ $it->name_company }}" disabled> 635 <input type="text" class="input" value="{{ $it->name_company }}" disabled>
617 </div> 636 </div>
618 </div> 637 </div>
619 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 638 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
620 <label class="form-group__label">ФИО сотрудника</label> 639 <label class="form-group__label">ФИО сотрудника</label>
621 <div class="form-group__item"> 640 <div class="form-group__item">
622 <input type="text" class="input" value="{{ $it->direct }}" disabled> 641 <input type="text" class="input" value="{{ $it->direct }}" disabled>
623 </div> 642 </div>
624 </div> 643 </div>
625 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 644 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
626 <label class="form-group__label">Должность сотрудника</label> 645 <label class="form-group__label">Должность сотрудника</label>
627 <div class="form-group__item"> 646 <div class="form-group__item">
628 <input type="text" class="input" value="{{ $it->telephone }}" disabled> 647 <input type="text" class="input" value="{{ $it->telephone }}" disabled>
629 </div> 648 </div>
630 </div> 649 </div>
631 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group"> 650 <div class="cabinet__inputs-item cabinet__inputs-item_fullwidth form-group">
632 <label class="form-group__label">Телефон сотрудника</label> 651 <label class="form-group__label">Телефон сотрудника</label>
633 <div class="form-group__item"> 652 <div class="form-group__item">
634 <input type="text" class="input" value="{{ $it->telephone2 }}" disabled> 653 <input type="text" class="input" value="{{ $it->telephone2 }}" disabled>
635 </div> 654 </div>
636 </div> 655 </div>
637 <a href="{{ route('worker.delete_prev_company', ['doc' => $it->id]) }}" class="button button_light"> 656 <a href="{{ route('worker.delete_prev_company', ['doc' => $it->id]) }}" class="button button_light">
638 <svg> 657 <svg>
639 <use xlink:href="{{ asset('images/sprite.svg#del') }}"></use> 658 <use xlink:href="{{ asset('images/sprite.svg#del') }}"></use>
640 </svg> 659 </svg>
641 Удалить 660 Удалить
642 </a> 661 </a>
643 <a href="{{ route('worker.edit_prev_company', ['worker' => $Worker[0]->id, 'doc' => $it->id ]) }}" class="button">Редактирование</a> 662 <a href="{{ route('worker.edit_prev_company', ['worker' => $Worker[0]->id, 'doc' => $it->id ]) }}" class="button">Редактирование</a>
644 </div> 663 </div>
645 </div> 664 </div>
646 @php $i++ @endphp 665 @php $i++ @endphp
647 @endforeach 666 @endforeach
648 @else 667 @else
649 <div style="margin-bottom: 20px" class="cabinet__body-item"> 668 <div style="margin-bottom: 20px" class="cabinet__body-item">
650 <h3 class="cabinet__subtitle">Предыдущие компании</h3> 669 <h3 class="cabinet__subtitle">Предыдущие компании</h3>
651 Нет предыдущих компаний 670 Нет предыдущих компаний
652 </div> 671 </div>
653 @endif 672 @endif
654 </div> 673 </div>
655 674
656 <div class="cabinet__body-item"> 675 <div class="cabinet__body-item">
657 <a class="button button_light" href="{{ route('worker.new_prev_company',['worker' => $Worker[0]->id]) }}" id="button_new_doc" name="button_new_doc"> 676 <a class="button button_light" href="{{ route('worker.new_prev_company',['worker' => $Worker[0]->id]) }}" id="button_new_doc" name="button_new_doc">
658 Добавить официльную контактную информацию 677 Добавить официльную контактную информацию
659 </a> 678 </a>
660 </div> 679 </div>
661 680
662 </form> 681 </form>
663 </div> 682 </div>
664 </div> 683 </div>
665 </section> 684 </section>
666 </div> 685 </div>
667 <div> 686 <div>
668 @endsection 687 @endsection
669 688