PluginProbe
WebTotem Security / 2.2.3
WebTotem Security v2.2.3
3.0.1 3.0.0 trunk 1.0 1.1 1.2 1.3 1.3.1 1.3.2 1.3.3 2.0 2.1 2.1.1 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.1.7 2.1.8 2.1.9 2.2.1 2.2.2 2.2.3 2.2.4 All 109 releases
wt-security / htdocs / css / main.css

main.css in WebTotem Security 2.2.3, at htdocs/css/main.css

3,039 lines 63.6 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @charset "UTF-8";
2 .wtotem_body *,
3 .wtotem_body *:after,
4 .wtotem_body *:before {
5 margin: 0;
6 padding: 0;
7 outline: none;
8 box-sizing: border-box;
9 }
10
11 .wtotem_body {
12 line-height: 24px;
13 font-family: "Inter", sans-serif;
14 font-size: 14px;
15 color: #5e6977;
16 font-weight: 400;
17 }
18
19 .wtotem_body ol,
20 .wtotem_body ul {
21 list-style: none;
22 }
23
24 .wtotem_body a {
25 text-decoration: none;
26 }
27
28 .wtotem_body a:hover {
29 text-decoration: none;
30 }
31
32 .wtotem_body h1,
33 .wtotem_body h2,
34 .wtotem_body h3,
35 .wtotem_body h4,
36 .wtotem_body h5 {
37 color: #5e6977;
38 font-weight: 700;
39 }
40
41 .wtotem_container {
42 max-width: 1020px;
43 margin: 0 auto;
44 }
45
46 .wtotem_title-info__title {
47 font-size: 14px;
48 text-transform: uppercase;
49 }
50
51 .wtotem_title-info__info {
52 background: url("../img/info-gray.svg") no-repeat center center/cover;
53 display: inline-block;
54 vertical-align: middle;
55 width: 17px;
56 height: 17px;
57 margin-top: -2px;
58 }
59
60 .title {
61 font-size: 24px;
62 font-weight: 700;
63 }
64
65 .section-header-mb {
66 margin-bottom: 25px;
67 }
68
69 .arrow-right {
70 color: #3d50df;
71 cursor: pointer;
72 display: flex;
73 align-items: center;
74 }
75 .arrow-right:after {
76 content: "";
77 border: solid #3d50df;
78 border-width: 0 1px 1px 0;
79 display: inline-block;
80 padding: 3px;
81 transform: rotate(-45deg);
82 -webkit-transform: rotate(-45deg);
83 margin-left: 10px;
84 }
85
86 .wtotem_print {
87 display: flex;
88 align-items: center;
89 cursor: pointer;
90 }
91 .wtotem_print__img {
92 display: block;
93 width: 17px;
94 height: 17px;
95 margin-right: 10px;
96 background: url("../img/print.svg") no-repeat center center/cover;
97 }
98 .wtotem_print__label {
99 color: #86939e;
100 }
101
102 .wt_card {
103 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
104 border-radius: 4px;
105 background: #fff;
106 }
107
108 /* 576-768px sm Small */
109 @media screen and (max-width: 768px) {
110 .section-header-mb {
111 margin-bottom: 20px;
112 }
113 .arrow-right:after {
114 margin-left: 5px;
115 }
116 }
117
118
119 /*# =header.css.map */
120
121 .wtotem_header {
122 position: relative;
123 z-index: 4;
124 width: 100%;
125 top: 0;
126 left: 0; }
127 .wtotem_header__body {
128 display: flex;
129 justify-content: space-between;
130 align-items: center; }
131 .wtotem_header:before {
132 content: "";
133 position: absolute;
134 top: 0;
135 left: 0;
136 width: 100%;
137 height: 100%;
138 background: #fff;
139 z-index: 2; }
140
141 .wtotem_version {
142 position: relative;
143 z-index: 100;
144 display: flex;
145 align-items: center; }
146 .wtotem_version__count {
147 width: 28px;
148 height: 18px;
149 display: flex;
150 justify-content: center;
151 align-items: center;
152 font-size: 10px;
153 font-weight: 500;
154 border: 1px solid #3d50df;
155 border-radius: 4px;
156 margin-left: 8px; }
157
158 .wtotem_logo {
159 width: 113px;
160 height: 24px;
161 background: url("../img/logo.svg") no-repeat center center/cover; }
162
163 .wtotem_nav {
164 position: relative;
165 z-index: 3;
166 height: 70px; }
167 .wtotem_nav .wtotem_control__checkbox {
168 align-self: center; }
169 .wtotem_nav__menu {
170 display: flex;
171 height: 100%; }
172 .wtotem_nav__link {
173 position: relative;
174 display: flex;
175 align-items: center;
176 height: 100%;
177 font-size: 14px;
178 color: #5e6977;
179 font-weight: 500;
180 padding: 0 16px; }
181 .wtotem_nav__link_active {
182 color: #3d50df; }
183 .wtotem_nav__link_active:before {
184 content: "";
185 position: absolute;
186 bottom: 0;
187 right: 0;
188 left: 0;
189 background: #3d50df;
190 height: 3px; }
191
192 /* 576-768px sm Small */
193 @media screen and (max-width: 768px) {
194 body.lock {
195 overflow: hidden; }
196 .wtotem_version {
197 position: relative;
198 z-index: 3; }
199 .wtotem_header__body {
200 height: 65px; }
201 .wtotem_nav {
202 position: fixed;
203 top: -100%;
204 left: 0;
205 width: 100%;
206 height: 100%;
207 background: #f3f5f6;
208 display: block;
209 padding-top: 65px;
210 transition: all 0.3s ease-in-out;
211 overflow: auto;
212 z-index: 1; }
213 .wtotem_nav__menu {
214 display: block; }
215 .wtotem_nav__item {
216 border-bottom: 1px solid #eceff4; }
217 .wtotem_nav__link {
218 height: auto;
219 display: block;
220 color: #1d293f;
221 font-size: 24px;
222 padding: 22px 0;
223 width: 540px;
224 margin: 0 auto; }
225 .wtotem_nav__link_active {
226 color: #3d50df; }
227 .wtotem_nav__link_active:before {
228 display: none; }
229 .wtotem_nav.active {
230 top: 0; }
231 .wtotem_burger {
232 position: relative;
233 width: 23px;
234 height: 18px;
235 display: flex;
236 align-items: center;
237 justify-content: flex-end;
238 cursor: pointer;
239 z-index: 3; }
240 .wtotem_burger:before, .wtotem_burger__middle-line, .wtotem_burger:after {
241 content: "";
242 background: #3d50df;
243 height: 2px;
244 display: block;
245 right: 0;
246 border-radius: 100px;
247 transition: all 0.3s ease-in-out; }
248 .wtotem_burger:before {
249 position: absolute;
250 width: 23px;
251 top: 0; }
252 .wtotem_burger__middle-line {
253 width: 18px; }
254 .wtotem_burger:after {
255 position: absolute;
256 width: 14px;
257 bottom: 0; }
258 .wtotem_burger.active .wtotem_burger__middle-line {
259 transform: scale(0); }
260 .wtotem_burger.active:before {
261 transform: rotate(45deg);
262 top: 8px; }
263 .wtotem_burger.active:after {
264 transform: rotate(-45deg);
265 width: 100%;
266 bottom: 8px; } }
267
268 /* 320-576px Extra small */
269 @media screen and (max-width: 576px) {
270 .wtotem_nav__link {
271 width: 345px;
272 margin: 0 auto; } }
273
274 /* 320-375px Extra small */
275 @media screen and (max-width: 375px) {
276 .wtotem_nav__link {
277 padding-left: 10px; } }
278
279 @media screen and (max-width: 768px) {
280 .wtotem_theme—dark .wtotem_nav {
281 background: #191919; }
282 .wtotem_theme—dark .wtotem_nav__item {
283 border-bottom: 1px solid #3c3c3d; } }
284
285 /*# =header.css.map */
286
287
288
289 .wtotem_chart__wrapper {
290 display: flex;
291 }
292
293 .wtotem_filter__wrapper {
294 display: flex;
295 justify-content: flex-end;
296 }
297
298 .wtotem_chart__calendars {
299 display: flex;
300 background: #f3f5f6;
301 border-radius: 5px;
302 align-items: center;
303 padding: 10px 8px;
304 margin-right: 7px;
305 }
306
307 .wtotem_calendar-icon {
308 background: url(../img/shape.svg) no-repeat center center / cover;
309 display: block;
310 width: 14px;
311 height: 14px;
312 margin-right: 3px;
313 }
314
315 input.wtotem_calendar {
316 background: transparent;
317 border: none;
318 color: #5e6977;
319 width: 125px;
320 cursor: pointer;
321 text-align: center;
322 }
323
324 input.wtotem_calendar:focus{
325 border: none;
326 box-shadow: none;
327 outline: 0;
328 }
329
330
331 .wtotem_calendar-connect {
332 margin: 0 3px;
333 }
334
335 .numInputWrapper span {
336 opacity: 1;
337 right: 2.5px;
338 }
339
340 .numInputWrapper span.arrowUp {
341 top: 15%;
342 }
343
344 .numInputWrapper span.arrowDown {
345 top: 35%;
346 }
347
348 .flatpickr-calendar {
349 font-family: "Inter", sans-serif;
350 width: 225px;
351 padding: 5px;
352 border: 2px solid #e1e8ee;
353 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
354 border-radius: 5px;
355 margin-top: 10px;
356 /*top: 382px !important;*/
357 }
358
359 .flatpickr-calendar.arrowTop:before {
360 border: 5px solid transparent;
361 border-bottom: 5px solid #e1e8ee;
362 top: -12px;
363 }
364
365 .flatpickr-calendar.arrowTop:after {
366 border: 5px solid transparent;
367 border-bottom: 5px solid #e1e8ee;
368 top: -12px;
369 }
370
371 .dayContainer {
372 justify-content: flex-start;
373 width: 225px;
374 min-width: 225px;
375 max-width: 225px;
376 align-items: center;
377 }
378
379 .flatpickr-days {
380 width: 225px;
381 }
382
383 .flatpickr-weekdays {
384 display: none;
385 }
386
387 .flatpickr-day {
388 border-radius: 0;
389 font-size: 12px;
390 max-width: 29px;
391 font-weight: 500;
392 color: #5e6977;
393 margin-bottom: 12px;
394 line-height: 5px;
395 height: 20px;
396 display: flex;
397 align-items: center;
398 justify-content: center;
399 }
400
401 .flatpickr-day:nth-last-child(-n + 7) {
402 margin-bottom: 0;
403 }
404
405 .flatpickr-day.today,
406 .flatpickr-day.today.inRange {
407 color: #393939;
408 }
409
410 .flatpickr-day.today.selected {
411 color: #fff;
412 }
413
414 .flatpickr-day.inRange,
415 .flatpickr-day.today.inRange {
416 background: #e1e8ee;
417 box-shadow: none;
418 margin-top: 0;
419 }
420
421 .flatpickr-day.selected,
422 .flatpickr-day.endRange,
423 .flatpickr-day.startRange {
424 background: #3d50df;
425 border-radius: 5px 5px 5px 5px !important;
426 }
427
428 .flatpickr-day.selected,
429 .flatpickr-day.startRange,
430 .flatpickr-day.endRange,
431 .flatpickr-day.selected.inRange,
432 .flatpickr-day.startRange.inRange,
433 .flatpickr-day.endRange.inRange,
434 .flatpickr-day.selected:focus,
435 .flatpickr-day.startRange:focus,
436 .flatpickr-day.endRange:focus,
437 .flatpickr-day.selected:hover,
438 .flatpickr-day.startRange:hover,
439 .flatpickr-day.endRange:hover,
440 .flatpickr-day.selected.prevMonthDay,
441 .flatpickr-day.startRange.prevMonthDay,
442 .flatpickr-day.endRange.prevMonthDay,
443 .flatpickr-day.selected.nextMonthDay,
444 .flatpickr-day.startRange.nextMonthDay,
445 .flatpickr-day.endRange.nextMonthDay {
446 background: #3d50df;
447 border-radius: 5px 5px 5px 5px !important;
448 height: 24px;
449 }
450
451 .flatpickr-months .flatpickr-prev-month,
452 .flatpickr-months .flatpickr-next-month {
453 display: none;
454 }
455
456 .flatpickr-current-month .flatpickr-monthDropdown-months {
457 width: 93px;
458 height: 31px;
459 padding: 6px 10px 7px;
460 border: 1.6px solid #e1e8ee;
461 border-radius: 2px;
462 }
463
464 .flatpickr-monthDropdown-months,
465 .flatpickr-current-month input.cur-year {
466 width: 93px;
467 height: 31px;
468 padding: 6px 10px 7px;
469 border: 1.6px solid #e1e8ee;
470 border-radius: 2px;
471 }
472
473 .flatpickr-current-month .numInputWrapper {
474 width: 93px;
475 }
476
477 .numInputWrapper span {
478 border: none;
479 }
480
481 .numInputWrapper span:hover {
482 background: transparent;
483 }
484
485 .flatpickr-current-month .numInputWrapper span.arrowDown:after,
486 .flatpickr-current-month .numInputWrapper span.arrowUp:after {
487 border-top-color: rgba(134, 147, 158, 1);
488 border-bottom-color: rgba(134, 147, 158, 1);
489 }
490
491 .flatpickr-month {
492 text-align-last: left;
493 margin-bottom: 13px;
494 position: relative;
495 }
496
497 .flatpickr-month:after {
498 content: "";
499 display: block;
500 border: 4px solid transparent;
501 border-top: 4px solid #86939e;
502 position: absolute;
503 right: 60%;
504 top: 43%;
505 }
506
507 .flatpickr-current-month {
508 left: 0;
509 width: 205px;
510 padding: 0;
511 display: flex;
512 align-items: center;
513 justify-content: space-between;
514 }
515
516 .flatpickr-monthDropdown-months,
517 .flatpickr-current-month input.cur-year {
518 -webkit-appearance: none !important;
519 -moz-appearance: none !important;
520 appearance: none !important;
521 color: #5e6977 !important;
522 font-size: 12px !important;
523 }
524
525 .flatpickr-current-month .numInputWrapper {
526 }
527
528 /* 576-768px sm Small */
529 @media screen and (max-width: 768px) {
530 body.lock {
531 overflow: hidden;
532 }
533 .wtotem_version {
534 position: relative;
535 z-index: 3;
536 }
537 .wtotem_header__body {
538 height: 65px;
539 }
540 .wtotem_nav {
541 position: fixed;
542 top: -100%;
543 left: 0;
544 width: 100%;
545 height: 100%;
546 background: #f3f5f6;
547 display: block;
548 padding-top: 65px;
549 transition: all 0.3s ease-in-out;
550 overflow: auto;
551 z-index: 1;
552 }
553 .wtotem_nav .wtotem_control__checkbox {
554 display: none; }
555 .wtotem_nav__menu {
556 display: block;
557 }
558 .wtotem_nav__item {
559 border-bottom: 1px solid #eceff4;
560 }
561 .wtotem_nav__link {
562 height: auto;
563 display: block;
564 color: #1d293f;
565 font-size: 24px;
566 padding: 22px 0;
567 width: 540px;
568 margin: 0 auto;
569 }
570 .wtotem_nav__link_active {
571 color: #3d50df;
572 }
573 .wtotem_nav__link_active:before {
574 display: none;
575 }
576 .wtotem_nav.active {
577 top: 0;
578 }
579 .wtotem_burger {
580 position: relative;
581 width: 23px;
582 height: 18px;
583 display: flex;
584 align-items: center;
585 justify-content: flex-end;
586 cursor: pointer;
587 z-index: 3;
588 }
589 .wtotem_burger:before,
590 .wtotem_burger__middle-line,
591 .wtotem_burger:after {
592 content: "";
593 background: #3d50df;
594 height: 2px;
595 display: block;
596 right: 0;
597 border-radius: 100px;
598 transition: all 0.3s ease-in-out;
599 }
600 .wtotem_burger:before {
601 position: absolute;
602 width: 23px;
603 top: 0;
604 }
605 .wtotem_burger__middle-line {
606 width: 18px;
607 }
608 .wtotem_burger:after {
609 position: absolute;
610 width: 14px;
611 bottom: 0;
612 }
613 .wtotem_burger.active .wtotem_burger__middle-line {
614 transform: scale(0);
615 }
616 .wtotem_burger.active:before {
617 transform: rotate(45deg);
618 top: 8px;
619 }
620 .wtotem_burger.active:after {
621 transform: rotate(-45deg);
622 width: 100%;
623 bottom: 8px;
624 }
625 }
626
627 /* 320-576px Extra small */
628 @media screen and (max-width: 576px) {
629 .wtotem_nav__link {
630 width: 345px;
631 margin: 0 auto;
632 }
633 }
634
635 /* 320-375px Extra small */
636 @media screen and (max-width: 375px) {
637 .wtotem_nav__link {
638 padding-left: 10px;
639 }
640 }
641
642 @media screen and (max-width: 768px) {
643 .wtotem_theme—dark .wtotem_nav {
644 background: #191919;
645 }
646 .wtotem_theme—dark .wtotem_nav__item {
647 border-bottom: 1px solid #3c3c3d;
648 }
649 }
650
651 .wtotem_footer {
652 padding-top: 18px;
653 padding-bottom: 20px;
654 background: #f3f5f6;
655 }
656 .wtotem_footer__first {
657 display: flex;
658 justify-content: space-between;
659 align-items: center;
660 margin-bottom: 21px;
661 }
662 .wtotem_footer__caption {
663 display: flex;
664 align-items: center;
665 }
666 .wtotem_footer__logo {
667 margin-right: 12px;
668 background: url("../img/logo-blue.svg") no-repeat center center/cover;
669 width: 20px;
670 height: 32px;
671 }
672 .wtotem_footer__text {
673 font-size: 12px;
674 color: #5e6977;
675 line-height: 12px;
676 font-weight: 500;
677 }
678 .wtotem_footer__contacts {
679 width: 200px;
680 display: flex;
681 justify-content: space-between;
682 }
683 .wtotem_footer__link {
684 font-weight: 500;
685 }
686 .wtotem_footer__line {
687 height: 1px;
688 background: #e1e8ee;
689 margin-bottom: 26px;
690 }
691 .wtotem_footer__bottom {
692 display: flex;
693 justify-content: space-between;
694 align-items: center;
695 }
696 .wtotem_footer__left {
697 display: flex;
698 justify-content: space-between;
699 align-items: center;
700 width: 255px;
701 }
702 .wtotem_footer__text {
703 font-size: 12px;
704 font-weight: 500;
705 color: #5e6977;
706 }
707 .wtotem_footer__store {
708 margin-bottom: -5px;
709 }
710 .wtotem_footer__app-store {
711 width: 19px;
712 height: 19px;
713 background: url("../img/app-store.svg") no-repeat center center/cover;
714 }
715 .wtotem_footer__play-store {
716 width: 17px;
717 height: 19px;
718 background: url("../img/play-store.svg") no-repeat center center/cover;
719 }
720 .wtotem_footer__soc-link {
721 margin-right: 20px;
722 }
723 .wtotem_footer__soc-link:last-child {
724 margin-right: 0;
725 }
726 .wtotem_footer__payment {
727 width: 166px;
728 display: flex;
729 justify-content: space-between;
730 align-items: center;
731 }
732
733 /* 576-768px sm Small */
734 @media screen and (max-width: 768px) {
735 .wtotem_footer__store,
736 .wtotem_footer__soc,
737 .wtotem_footer__payment,
738 .wtotem_footer__line {
739 display: none;
740 }
741 .wtotem_footer__caption,
742 .wtotem_footer__left,
743 .wtotem_footer__text {
744 margin: 0 auto;
745 }
746 .wtotem_footer__caption {
747 flex-direction: column;
748 }
749 .wtotem_footer__logo {
750 margin-bottom: 18px;
751 }
752 }
753
754 /* 320-576px Extra small */
755 .wtotem_content {
756 padding-top: 37px;
757 padding-bottom: 20px;
758 background: #f3f5f6;
759 }
760
761 .wtotem_first {
762 margin-bottom: 37px;
763 display: flex;
764 justify-content: space-between;
765 }
766
767 .wtotem_overall {
768 padding: 21px 8px 30px 24px;
769 width: 49%;
770 }
771 .wtotem_overall__title .wtotem_title-info__title {
772 text-transform: none;
773 font-size: 18px;
774 }
775 .wtotem_overall__body {
776 display: flex;
777 justify-content: space-between;
778 align-items: center;
779 margin-top: 21px;
780 }
781 .wtotem_overall__inner {
782 display: flex;
783 align-items: center;
784 }
785 .wtotem_overall__rectangle {
786 width: 74px;
787 height: 50px;
788 background: #d56c6a;
789 color: #fff;
790 font-size: 32px;
791 font-weight: 700;
792 display: flex;
793 align-items: center;
794 justify-content: center;
795 margin-right: 10px;
796 }
797 .wtotem_overall__figures {
798 color: #d56c6a;
799 font-size: 42px;
800 font-weight: 700;
801 }
802 .wtotem_overall__text {
803 font-size: 16px;
804 color: #86939e;
805 width: 267px;
806 }
807
808 .wtotem_info {
809 display: flex;
810 width: 49%;
811 }
812 .wtotem_info__item {
813 padding: 23px 29px;
814 }
815 .wtotem_info__item:first-child {
816 border-right: 1px solid #f3f5f6;
817 }
818 .wtotem_info__block {
819 margin-bottom: 10px;
820 }
821 .wtotem_info__subtitle {
822 font-size: 14px;
823 color: #86939e;
824 margin-bottom: 3px;
825 }
826 .wtotem_info__info {
827 font-size: 14px;
828 color: #5e6977;
829 }
830 .wtotem_info__scoring {
831 height: 51px;
832 display: flex;
833 align-items: center;
834 justify-content: center;
835 }
836
837 /* 992-1100px lg Large */
838 @media screen and (max-width: 1100px) {
839 .wtotem_overall {
840 width: 49%;
841 }
842 .wtotem_overall__body {
843 flex-direction: column;
844 align-items: flex-start;
845 }
846 .wtotem_overall__inner {
847 margin-bottom: 15px;
848 }
849 .wtotem_overall__text {
850 width: 100%;
851 }
852 .wtotem_info {
853 width: 49%;
854 }
855 }
856
857 /* 768-992px md Medium */
858 @media screen and (max-width: 992px) {
859 .wtotem_info {
860 align-items: center;
861 }
862 .wtotem_info__item {
863 padding: 13px 20px;
864 }
865 }
866
867 /* 576-768px sm Small */
868 @media screen and (max-width: 768px) {
869 .wtotem_first {
870 flex-direction: column;
871 margin-bottom: 20px;
872 }
873 .wtotem_overall {
874 width: 100%;
875 margin-bottom: 10px;
876 }
877 .wtotem_info {
878 width: 100%;
879 }
880 .wtotem_info__item {
881 width: 100%;
882 }
883 .wtotem_info__scoring {
884 justify-content: flex-start;
885 }
886 }
887
888 /* 320-576px Extra small */
889 @media screen and (max-width: 576px) {
890 .wtotem_overall {
891 padding-left: 22px;
892 padding-right: 22px;
893 }
894 .wtotem_info {
895 width: 100%;
896 flex-direction: column;
897 padding: 13px 22px 13px 22px;
898 }
899 .wtotem_info__item {
900 width: 100%;
901 padding: 0;
902 }
903 .wtotem_info__item:first-child {
904 border-right: none;
905 }
906 .wtotem_info__block {
907 margin-bottom: 20px;
908 }
909 .wtotem_info__scoring {
910 justify-content: flex-start;
911 height: auto;
912 }
913 }
914
915 .wtotem_firewall {
916 margin-bottom: 20px;
917 }
918 .wtotem_firewall__first {
919 display: flex;
920 justify-content: space-between;
921 }
922 .wtotem_firewall__stats {
923 display: flex;
924 align-items: center;
925 }
926 .wtotem_firewall__icon {
927 display: block;
928 width: 14px;
929 height: 14px;
930 margin-right: 10px;
931 background: url("../img/shape.svg") no-repeat center center/cover;
932 }
933 .wtotem_firewall__text {
934 color: #86939e;
935 }
936 .wtotem_firewall__block {
937 display: flex;
938 justify-content: space-between;
939 }
940
941 .wtotem_numbers {
942 width: 49%;
943 display: flex;
944 justify-content: space-between;
945 align-items: center;
946 }
947 .wtotem_numbers__item {
948 text-align: center;
949 width: 33.3333333333%;
950 height: 100%;
951 display: flex;
952 flex-direction: column;
953 justify-content: center;
954 border-right: 1px solid #f3f5f6;
955 }
956 .wtotem_numbers__item:last-child {
957 border-right: none;
958 }
959 .wtotem_numbers__title {
960 line-height: 18px;
961 color: #86939e;
962 margin-bottom: 15px;
963 }
964 .wtotem_numbers__figures {
965 color: #1d293f;
966 font-size: 32px;
967 font-weight: 700;
968 }
969
970 .wtotem_from {
971 width: 49%;
972 display: flex;
973 align-items: center;
974 padding: 17px 23px;
975 }
976 .wtotem_from__arrow-right {
977 margin-left: auto;
978 border: solid #5e6977;
979 border-width: 0 1.5px 1.5px 0;
980 display: inline-block;
981 padding: 6px;
982 transform: rotate(-45deg);
983 -webkit-transform: rotate(-45deg);
984 }
985 .wtotem_from__svg-wrap {
986 position: relative;
987 display: flex;
988 align-items: center;
989 }
990 .wtotem_from__svg-wrap:after {
991 content: "";
992 position: absolute;
993 top: 0;
994 left: 0;
995 z-index: 2;
996 width: 69.5px;
997 height: 69.5px;
998 border-radius: 100%;
999 border: 13.3px solid #f3f5f6;
1000 margin-top: 1px;
1001 }
1002 .wtotem_from__progress {
1003 position: relative;
1004 z-index: 3;
1005 width: 71px;
1006 height: 71px;
1007 }
1008 .wtotem_from__circle {
1009 stroke-width: 15px;
1010 stroke: #3d50df;
1011 fill: transparent;
1012 transform-origin: center;
1013 transform: rotate(-90deg);
1014 transition: stroke-dashoffset 0.3s;
1015 stroke-dashoffset: 0;
1016 }
1017 .wtotem_from__percent {
1018 position: absolute;
1019 display: block;
1020 width: 33px;
1021 top: 33%;
1022 left: 29%;
1023 font-weight: 700;
1024 font-size: 12px;
1025 text-align: center;
1026 }
1027 .wtotem_from__info {
1028 margin-left: 18px;
1029 }
1030 .wtotem_from__title {
1031 color: #86939e;
1032 margin-bottom: 9px;
1033 }
1034 .wtotem_from__country {
1035 font-size: 18px;
1036 color: #1d293f;
1037 line-height: 18px;
1038 }
1039 .wtotem_from__country span {
1040 color: #3d50df;
1041 }
1042
1043 /* 992-1100px lg Large */
1044 @media screen and (max-width: 1100px) {
1045 .wtotem_numbers,
1046 .wtotem_from {
1047 width: 49%;
1048 }
1049 }
1050
1051 /* 768-992px md Medium */
1052 /* 576-768px sm Small */
1053 @media screen and (max-width: 768px) {
1054 .wtotem_firewall__block {
1055 flex-direction: column;
1056 }
1057 .wtotem_numbers,
1058 .wtotem_from {
1059 width: 100%;
1060 }
1061 .wtotem_numbers {
1062 height: 104px;
1063 margin-bottom: 10px;
1064 }
1065 .wtotem_from__country {
1066 font-size: 14px;
1067 }
1068 }
1069
1070 /* 320-576px Extra small */
1071 @media screen and (max-width: 576px) {
1072 .wtotem_numbers {
1073 display: flex;
1074 flex-wrap: wrap;
1075 width: 345px;
1076 height: 217px;
1077 }
1078 .wtotem_numbers__item {
1079 width: 172.5px;
1080 height: 108.5px;
1081 }
1082 .wtotem_numbers__item:last-child {
1083 border-right: 1px solid #f3f5f6;
1084 }
1085 }
1086
1087 /* 320-375px Extra small */
1088 @media screen and (max-width: 374px) {
1089 .wtotem_numbers {
1090 width: 300px;
1091 }
1092 .wtotem_numbers__item {
1093 width: 150px;
1094 }
1095 }
1096
1097 .wtotem_chart {
1098 background: #fff;
1099 padding: 13px 0 19px 0;
1100 }
1101
1102 .wtotem_chart-first {
1103 display: flex;
1104 justify-content: space-between;
1105 align-items: center;
1106 padding: 0 26px;
1107 }
1108 .wtotem_chart-first__left {
1109 display: flex;
1110 align-items: center;
1111 }
1112 .wtotem_chart-first__all {
1113 color: #3d50df;
1114 margin-right: 10px;
1115 }
1116 .wtotem_chart-first__hack {
1117 margin-right: 15px;
1118 display: flex;
1119 align-items: center;
1120 }
1121 .wtotem_chart-first__hack p {
1122 color: #86939e;
1123 }
1124 .wtotem_chart-first__hack span {
1125 display: block;
1126 width: 7px;
1127 height: 7px;
1128 border-radius: 100px;
1129 margin-right: 7px;
1130 }
1131 .wtotem_chart-first__hack_attack span {
1132 background: #d56c6a;
1133 }
1134 .wtotem_chart-first__hack_blocked span {
1135 background: #bace3d;
1136 }
1137 .wtotem_chart-first__right {
1138 display: flex;
1139 background: #f3f5f6;
1140 /*width: 202px;*/
1141 height: 45px;
1142 align-items: center;
1143 justify-content: space-between;
1144 padding: 0 6px;
1145 border-radius: 5px;
1146 }
1147 .wtotem_chart-first__btn {
1148 display: flex;
1149 justify-content: center;
1150 align-items: center;
1151 width: 65px;
1152 height: 31px;
1153 border-radius: 4px;
1154 color: #5e6977;
1155 cursor: pointer;
1156 }
1157 .wtotem_chart-first__btn_active {
1158 background: #fff;
1159 color: #3d50df;
1160 }
1161
1162 .wtotem_chart {
1163 margin-bottom: 30px;
1164 }
1165 .wtotem_chart__diagram {
1166 height: 251px;
1167 }
1168 .wtotem_chart__line {
1169 width: 100%;
1170 height: 1px;
1171 background: #f3f5f6;
1172 margin-bottom: 16px;
1173 }
1174 .wtotem_chart__last {
1175 display: flex;
1176 justify-content: space-between;
1177 align-items: center;
1178 padding: 0 26px;
1179 }
1180 .wtotem_chart__text {
1181 font-weight: 500;
1182 }
1183 .wtotem_chart__text a {
1184 color: #3d50df;
1185 }
1186 .wtotem_chart__btn {
1187 background: none;
1188 border: 1px solid #3d50df;
1189 border-radius: 4px;
1190 display: block;
1191 width: 136px;
1192 display: flex;
1193 align-items: center;
1194 justify-content: center;
1195 padding: 7px 5px;
1196 color: #3d50df;
1197 cursor: pointer;
1198 }
1199
1200 .wtotem_data {
1201 padding: 0 26px;
1202 }
1203 .wtotem_data__thead {
1204 margin-bottom: 15px;
1205 }
1206 .wtotem_data__tr {
1207 display: flex;
1208 justify-content: space-between;
1209 }
1210 .wtotem_data__th {
1211 color: #5e6977;
1212 font-weight: 500;
1213 font-size: 12px;
1214 }
1215 .wtotem_data__th:last-child {
1216 text-align: right;
1217 }
1218 .wtotem_data__td {
1219 font-size: 12px;
1220 font-weight: 500;
1221 color: #86939e;
1222 margin-bottom: 20px;
1223 }
1224 .wtotem_data__td_blocked:before {
1225 content: "";
1226 width: 4px;
1227 height: 4px;
1228 border-radius: 100px;
1229 background: #bace3d;
1230 display: block;
1231 }
1232 .wtotem_data__td_banned:before {
1233 content: "";
1234 width: 4px;
1235 height: 4px;
1236 border-radius: 100px;
1237 background: #d56c6a;
1238 display: block;
1239 }
1240 .wtotem_data__td:first-child {
1241 display: flex;
1242 align-items: center;
1243 }
1244 .wtotem_data__td:nth-child(2) {
1245 display: flex;
1246 align-items: center;
1247 }
1248 .wtotem_data__td:last-child {
1249 text-align: right;
1250 color: #d56c6a;
1251 }
1252 .wtotem_data__ip {
1253 margin-left: 10px;
1254 }
1255 .wtotem_data__img {
1256 width: 23px;
1257 height: 13px;
1258 margin-right: 6px;
1259 }
1260 .wtotem_data__flag {
1261 display: block;
1262 width: 100%;
1263 }
1264 .wtotem_data_width_1 {
1265 width: 13%;
1266 }
1267 .wtotem_data_width_2 {
1268 width: 10%;
1269 }
1270 .wtotem_data_width_3 {
1271 width: 14%;
1272 }
1273 .wtotem_data_width_4 {
1274 width: 24%;
1275 }
1276 .wtotem_data_width_5 {
1277 width: 29%;
1278 }
1279 .wtotem_data_width_6 {
1280 width: 11%;
1281 }
1282
1283 /* 768-992px md Medium */
1284 @media screen and (max-width: 992px) {
1285 .wtotem_data__th:nth-last-child(-n + 3),
1286 .wtotem_data__td:nth-last-child(-n + 3) {
1287 display: none;
1288 }
1289 .wtotem_data__th,
1290 .wtotem_data__td {
1291 width: 32%;
1292 }
1293 .wtotem_data__th:nth-child(3),
1294 .wtotem_data__td:nth-child(3) {
1295 width: 36%;
1296 }
1297 }
1298
1299 /* 576-768px sm Small */
1300 /* 320-576px Extra small */
1301 @media screen and (max-width: 576px) {
1302 .wtotem_data {
1303 padding: 0 16px;
1304 }
1305 .wtotem_chart-first {
1306 flex-direction: column;
1307 align-items: flex-start;
1308 }
1309 .wtotem_chart-first__left {
1310 margin-bottom: 20px;
1311 }
1312 .wtotem_chart-first__right {
1313 width: 100%;
1314 }
1315 }
1316
1317 /* 320-375px Extra small */
1318 @media screen and (max-width: 375px) {
1319 .wtotem_data__th,
1320 .wtotem_data__td {
1321 width: 33% !important;
1322 }
1323 .wtotem_data__ip {
1324 margin-left: 5px;
1325 }
1326 }
1327
1328 .wtotem_antivirus {
1329 margin-bottom: 30px;
1330 }
1331 .wtotem_antivirus__first {
1332 display: flex;
1333 justify-content: space-between;
1334 align-items: center;
1335 }
1336 .wtotem_antivirus__block {
1337 display: flex;
1338 justify-content: space-between;
1339 align-items: center;
1340 width: 100%;
1341 background: #fff;
1342 border-radius: 4px;
1343 }
1344 .wtotem_antivirus__item {
1345 width: 25%;
1346 height: 100.5px;
1347 text-align: center;
1348 display: flex;
1349 align-items: center;
1350 justify-content: center;
1351 flex-direction: column;
1352 border-right: 1px solid #f3f5f6;
1353 }
1354 .wtotem_antivirus__item:last-child {
1355 border-right: none;
1356 }
1357 .wtotem_antivirus__figures {
1358 font-size: 32px;
1359 font-weight: 700;
1360 margin-bottom: 18px;
1361 }
1362 .wtotem_antivirus__figures_green {
1363 color: #bace3d;
1364 }
1365 .wtotem_antivirus__figures_yellow {
1366 color: #e9cf73;
1367 }
1368 .wtotem_antivirus__figures_orange {
1369 color: #d56c6a;
1370 }
1371 .wtotem_antivirus__figures_black {
1372 color: #1d293f;
1373 }
1374 .wtotem_antivirus__title {
1375 color: #86939e;
1376 line-height: 18px;
1377 }
1378
1379 /* 320-576px Extra small */
1380 @media screen and (max-width: 576px) {
1381 .wtotem_antivirus__block {
1382 flex-wrap: wrap;
1383 }
1384 .wtotem_antivirus__item {
1385 width: 172.5px;
1386 border-bottom: 1px solid #f3f5f6;
1387 }
1388 .wtotem_antivirus__item:last-child {
1389 border-right: none;
1390 border-bottom: none;
1391 }
1392 .wtotem_antivirus__item:nth-child(2) {
1393 border-right: none;
1394 }
1395 .wtotem_antivirus__item:nth-child(3) {
1396 border-bottom: none;
1397 }
1398 }
1399
1400 /* 320-375px */
1401 @media screen and (max-width: 375px) {
1402 .wtotem_antivirus__item {
1403 width: 150px;
1404 }
1405 }
1406
1407 .wtotem_monitoring {
1408 margin-bottom: 30px;
1409 }
1410
1411 .wtotem_table__row {
1412 display: flex;
1413 width: 100%;
1414 }
1415
1416 .wtotem_table__col {
1417 width: 33.3333333333%;
1418 border-right: 1px solid #f3f5f6;
1419 border-bottom: 1px solid #f3f5f6;
1420 }
1421 .wtotem_table__col:last-child {
1422 border-right: none;
1423 }
1424
1425 .wtotem_table__th,
1426 .wtotem_table__td,
1427 .wtotem_table__info {
1428 padding: 15px 15px;
1429 }
1430
1431 .wtotem_table__th,
1432 .wtotem_table__td {
1433 border-bottom: 1px solid #f3f5f6;
1434 }
1435
1436 .wtotem_table__td {
1437 display: flex;
1438 justify-content: space-between;
1439 align-items: center;
1440 height: 64px;
1441 }
1442
1443 .wtotem_table__item {
1444 height: 110px;
1445 display: flex;
1446 align-items: center;
1447 justify-content: center;
1448 }
1449
1450 .wtotem_table__expired {
1451 color: #d56c6a;
1452 }
1453
1454 .wtotem_table__solve {
1455 color: #3d50df;
1456 }
1457
1458 .wtotem_table__info {
1459 height: 55px;
1460 display: flex;
1461 justify-content: space-between;
1462 }
1463
1464 .wtotem_table__subject {
1465 font-size: 14px;
1466 text-transform: uppercase;
1467 }
1468
1469 .wtotem_table__status {
1470 text-transform: uppercase;
1471 }
1472 .wtotem_table__status_green {
1473 color: #4bc374;
1474 }
1475 .wtotem_table__status_yellow {
1476 color: #dcb320;
1477 text-transform: none;
1478 }
1479
1480 .wtotem_table__text {
1481 color: #86939e;
1482 font-weight: 500;
1483 }
1484
1485 .wtotem_table__perfomance {
1486 font-weight: 500;
1487 color: #5e6977;
1488 }
1489 .wtotem_table__perfomance span {
1490 color: #3d50df;
1491 }
1492
1493 .wtotem_table__wrap {
1494 width: 30px;
1495 height: 30px;
1496 }
1497 .wtotem_table__wrap_big {
1498 width: 56px;
1499 height: 56px;
1500 }
1501
1502 .wtotem_table__img {
1503 width: 100%;
1504 display: block;
1505 }
1506
1507 .wtotem_table__link {
1508 display: flex;
1509 justify-content: space-between;
1510 align-items: center;
1511 padding: 13px 16px;
1512 }
1513 .wtotem_table__link:after {
1514 content: "";
1515 border: solid #5e6977;
1516 border-width: 0 1.5px 1.5px 0;
1517 display: inline-block;
1518 padding: 4px;
1519 transform: rotate(-45deg);
1520 -webkit-transform: rotate(-45deg);
1521 }
1522
1523 .wtotem_table__right_progress-wrap {
1524 width: 167px;
1525 margin-top: -21px;
1526 }
1527
1528 .wtotem_table__stick-progress {
1529 position: relative;
1530 background: #3d50df;
1531 width: 96px;
1532 height: 7px;
1533 border-radius: 100px;
1534 }
1535 .wtotem_table__stick-progress:after {
1536 content: "";
1537 position: absolute;
1538 top: 0;
1539 left: 0;
1540 width: 167px;
1541 height: 7px;
1542 opacity: 0.1;
1543 border-radius: 100px;
1544 background: #5e6977;
1545 }
1546
1547 .wtotem_table__initial-value {
1548 font-size: 10px;
1549 font-weight: 500;
1550 color: #5e6977;
1551 }
1552
1553 .wtotem_table__message {
1554 position: absolute;
1555 top: -20px;
1556 right: -12px;
1557 z-index: 50;
1558 width: 30px;
1559 height: 15px;
1560 border-radius: 2px;
1561 background: #3d50df;
1562 font-size: 10px;
1563 font-weight: 500;
1564 text-align: center;
1565 color: #fff;
1566 display: flex;
1567 justify-content: center;
1568 align-items: center;
1569 }
1570
1571 .wtotem_table__triangle {
1572 position: absolute;
1573 z-index: -1;
1574 top: 55%;
1575 left: 40%;
1576 width: 8.5px;
1577 height: 8.5px;
1578 display: block;
1579 border-radius: 1px;
1580 transform: rotate(45deg);
1581 background: #3d50df;
1582 margin: 0 auto;
1583 }
1584
1585 /* 992-1100px lg Large */
1586 /* 768-992px md Medium */
1587 @media screen and (max-width: 992px) {
1588 .wtotem_table__row {
1589 flex-direction: column;
1590 }
1591 .wtotem_table__col {
1592 width: 100%;
1593 border-right: none !important;
1594 }
1595 }
1596
1597 /* 576-768px sm Small */
1598 /* 320-576px Extra small */
1599 /* 320-375px Extra small */
1600 @media screen and (max-width: 375px) {
1601 .wtotem_table__perfomance_long {
1602 width: 210px;
1603 }
1604 .wtotem_chart-first {
1605 padding: 0 16px;
1606 }
1607 }
1608
1609 .wtotem_map__first {
1610 display: flex;
1611 justify-content: space-between;
1612 }
1613
1614 .wtotem_map .wtotem_map-block {
1615 display: flex;
1616 align-items: center;
1617 justify-content: space-around;
1618 padding-right: 26px; }
1619
1620 .wtotem_map .wtotem_map-block #firewall {
1621 display: block; }
1622
1623 .wtotem_map .wtotem_map-block__map {
1624 width: 50%;
1625 height: 330px; }
1626
1627 .wtotem_map .firewall {
1628 width: 50%;
1629 position: relative;
1630 height: 230px; }
1631
1632 .wtotem_map-wrap {
1633 padding-top: 15px;
1634 margin-bottom: 30px; }
1635
1636 .wtotem_country {
1637 margin-bottom: -15px; }
1638 .wtotem_country__title {
1639 font-size: 14px;
1640 line-height: 18px;
1641 color: #86939e;
1642 margin-bottom: 9px; }
1643 .wtotem_country__desc {
1644 font-size: 18px;
1645 line-height: 18px;
1646 color: #1d293f; }
1647
1648 /* 992-1100px lg Large */
1649 /* 768-992px md Medium */
1650 @media screen and (max-width: 992px) {
1651 .wtotem_map .wtotem_map-wrap {
1652 padding-bottom: 20px; }
1653 .wtotem_map .wtotem_map-block {
1654 flex-direction: column;
1655 padding-right: 0; }
1656 .wtotem_map .wtotem_map-block__map {
1657 width: 100%;
1658 text-align: center; }
1659 .wtotem_map .wtotem_map-block__map svg {
1660 width: 403px; }
1661 .wtotem_map #firewall {
1662 display: block;
1663 height: 135px;
1664 width: 270px; }
1665 .wtotem_map .firewall {
1666 position: relative;
1667 margin: auto;
1668 height: 70vh;
1669 width: 60vw; } }
1670
1671 /* 576-768px sm Small */
1672 /* 375-576px Extra small */
1673 @media screen and (max-width: 576px) {
1674 .wtotem_map .wtotem_map-block__map {
1675 height: auto; }
1676 .wtotem_map #firewallMap {
1677 width: 100%;
1678 zoom: 0.8; }
1679 .wtotem_map .wtotem_country {
1680 margin-bottom: 20px; }
1681 .wtotem_map .wtotem_chart__wrapper {
1682 width: 100%; } }
1683
1684 @media screen and (max-width: 500px) {
1685 .wtotem_map .firewall {
1686 width: 70vw; } }
1687
1688 @media screen and (max-width: 420px) {
1689 .wtotem_map .firewall {
1690 width: 75vw; } }
1691
1692 @media screen and (max-width: 390px) {
1693 .wtotem_map .firewall {
1694 width: 80vw; } }
1695
1696 @media screen and (max-width: 375px) {
1697 .wtotem_map #firewallMap {
1698 width: 100%;
1699 zoom: 0.7;
1700 display: block;
1701 transform: translateX(25px); } }
1702
1703 @media screen and (max-width: 340px) {
1704 .wtotem_map #firewallMap {
1705 width: 100%;
1706 zoom: 0.7;
1707 display: block;
1708 transform: translateX(15px); } }
1709
1710 @media screen and (max-width: 340px) {
1711 .wtotem_map #firewallMap {
1712 width: 100%;
1713 zoom: 0.7;
1714 display: block;
1715 transform: translateX(5px); } }
1716
1717 /* 320-375px Extra small */
1718
1719 .wtotem_state {
1720 border-radius: 4px;
1721 }
1722
1723 .wtotem_state {
1724 background: #fff;
1725 padding: 13px 0 26px 0;
1726 }
1727 .wtotem_state__select-wrapper {
1728 position: relative;
1729 margin-bottom: 15px;
1730 width: 190px;
1731 cursor: pointer;
1732 }
1733 .wtotem_state__select-wrapper:after {
1734 content: "";
1735 position: absolute;
1736 top: 45%;
1737 right: 0;
1738 border-style: solid;
1739 border-width: 5px 5px 0 5px;
1740 border-color: #86939e transparent transparent transparent;
1741 border-radius: 50px;
1742 }
1743 .wtotem_state__select {
1744 display: block;
1745 margin-left: 18px;
1746 width: 100%;
1747 padding: 8px 12px 8px 12px;
1748 color: #86939e;
1749 font-size: 14px;
1750 font-weight: 400;
1751 -webkit-appearance: none;
1752 appearance: none;
1753 background-color: #f3f5f6;
1754 background-image: none;
1755 border-radius: 4px;
1756 border: none;
1757 font-family: inherit;
1758 cursor: pointer;
1759 }
1760 .wtotem_state__option {
1761 border: none;
1762 }
1763 .wtotem_state__line {
1764 background: #f3f5f6;
1765 height: 1px;
1766 margin-bottom: 20px;
1767 }
1768 .wtotem_state__last {
1769 display: flex;
1770 align-items: center;
1771 justify-content: space-between;
1772 padding: 0 18px;
1773 }
1774 .wtotem_state__text {
1775 color: #5e6977;
1776 font-weight: 500;
1777 }
1778 .wtotem_state__text a {
1779 color: #3d50df;
1780 }
1781
1782 .wtotem_file-table {
1783 color: #86939e;
1784 }
1785 .wtotem_file-table__tr {
1786 display: flex;
1787 margin-bottom: 15px;
1788 padding: 0 18px;
1789 }
1790 .wtotem_file-table__th {
1791 color: #5e6977;
1792 width: 12.5%;
1793 font-weight: 500;
1794 font-size: 12px;
1795 }
1796 .wtotem_file-table__th:first-child {
1797 width: 50%;
1798 }
1799 .wtotem_file-table__td {
1800 font-size: 12px;
1801 width: 12.5%;
1802 font-weight: 500;
1803 }
1804 .wtotem_file-table__td:first-child {
1805 width: 50%;
1806 }
1807 .wtotem_file-table__td_normal {
1808 color: #5e6977;
1809 }
1810 .wtotem_file-table__td_critical {
1811 color: #d56c6a;
1812 }
1813 .wtotem_file-table__td_changed {
1814 color: #caae4b;
1815 }
1816
1817 .wtotem_pagination {
1818 display: flex;
1819 }
1820 .wtotem_pagination__number {
1821 color: #99a6b1;
1822 font-weight: 500;
1823 margin-right: 30px;
1824 display: flex;
1825 align-items: center;
1826 }
1827 .wtotem_pagination__number:hover {
1828 color: #5e6977;
1829 }
1830 .wtotem_pagination__number_active {
1831 width: 46px;
1832 height: 46px;
1833 background: #f1f3f5;
1834 color: #5e6977;
1835 margin-right: 13px;
1836 border-radius: 100px;
1837 display: flex;
1838 justify-content: center;
1839 align-items: center;
1840 }
1841 .wtotem_pagination__number_etc {
1842 margin-right: 22px;
1843 }
1844 .wtotem_pagination__arrow {
1845 width: 19px;
1846 height: 12px;
1847 display: block;
1848 cursor: pointer;
1849 }
1850
1851 /* 992-1100px lg Large */
1852 /* 768-992px md Medium */
1853 @media screen and (max-width: 992px) {
1854 .wtotem_state {
1855 overflow: hidden;
1856 }
1857 .wtotem_file-table__td,
1858 .wtotem_file-table__th {
1859 display: none;
1860 }
1861 .wtotem_file-table__td:first-child,
1862 .wtotem_file-table__th:first-child {
1863 display: block;
1864 width: 100%;
1865 }
1866 }
1867
1868 /* 576-768px sm Small */
1869 /* 375-576px Extra small */
1870 @media screen and (max-width: 576px) {
1871 .wtotem_state__text {
1872 display: none;
1873 }
1874 .wtotem_pagination {
1875 margin: 0 auto;
1876 }
1877 .wtotem_pagination__number {
1878 margin-right: 18px;
1879 }
1880 .wtotem_pagination__number_active {
1881 margin-right: 13px;
1882 }
1883 }
1884
1885 /* 320-375px Extra small */
1886 .wtotem_welcome-wrapper {
1887 background: #f3f5f6;
1888 }
1889 .wtotem_welcome-wrapper__head-height {
1890 display: flex;
1891 align-items: center;
1892 justify-content: center;
1893 height: calc(100vh - 135px);
1894 min-height: 596px;
1895 }
1896 .wtotem_welcome-wrapper__footer-height {
1897 display: flex;
1898 justify-content: center;
1899 height: 135px;
1900 }
1901
1902 .wtotem_modal {
1903 text-align: center;
1904 }
1905 .wtotem_modal__subject {
1906 font-size: 24px;
1907 line-height: 18px;
1908 margin-bottom: 24px;
1909 }
1910 .wtotem_modal__window {
1911 background: #fff;
1912 padding: 23px 0 35px 0;
1913 width: 360px;
1914 margin: 0 auto;
1915 margin-bottom: 24px;
1916 }
1917 .wtotem_modal__title {
1918 font-size: 18px;
1919 margin-bottom: 5px;
1920 }
1921 .wtotem_modal__text {
1922 font-size: 10px;
1923 margin-bottom: 8px;
1924 }
1925 .wtotem_modal__block {
1926 margin-bottom: 50px;
1927 }
1928 .wtotem_modal__block:after {
1929 content: "";
1930 display: block;
1931 height: 1px;
1932 width: 100%;
1933 background: #e1e8ee;
1934 margin-top: -40px;
1935 }
1936 .wtotem_modal__logo {
1937 margin: 0 auto;
1938 }
1939 .wtotem_modal__wrap {
1940 width: 300px;
1941 display: flex;
1942 align-items: center;
1943 margin: 0 auto;
1944 margin-bottom: 18px;
1945 }
1946 .wtotem_modal__api-key {
1947 width: 100%;
1948 padding: 13px 30px 13px 15px;
1949 border: 2px solid #e1e8ee;
1950 border-radius: 2px;
1951 }
1952 .wtotem_modal__api-key[type="text"]::-webkit-input-placeholder {
1953 font-weight: 500;
1954 font-size: 14px;
1955 line-height: 14px;
1956 color: #5e6977;
1957 }
1958 .wtotem_modal__api-key[type="text"]:-ms-input-placeholder {
1959 font-weight: 500;
1960 font-size: 14px;
1961 line-height: 14px;
1962 color: #5e6977;
1963 }
1964 .wtotem_modal__api-key[type="text"]::-ms-input-placeholder {
1965 font-weight: 500;
1966 font-size: 14px;
1967 line-height: 14px;
1968 color: #5e6977;
1969 }
1970 .wtotem_modal__api-key[type="text"]::placeholder {
1971 font-weight: 500;
1972 font-size: 14px;
1973 line-height: 14px;
1974 color: #5e6977;
1975 }
1976 .wtotem_modal__info {
1977 margin-left: -30px;
1978 }
1979 .wtotem_modal__btn {
1980 background: #4bc374;
1981 font-weight: 700;
1982 font-size: 14px;
1983 line-height: 16px;
1984 text-transform: uppercase;
1985 width: 300px;
1986 padding: 16px 0;
1987 border: none;
1988 color: #fff;
1989 }
1990 .wtotem_modal__desc {
1991 font-size: 12px;
1992 font-weight: 500;
1993 line-height: 16px;
1994 max-width: 274px;
1995 margin: 0 auto;
1996 color: #5e6977;
1997 }
1998 .wtotem_modal__cabinet {
1999 color: #3d50df;
2000 }
2001
2002 .wtotem_welcome-bottom {
2003 text-align: center;
2004 }
2005 .wtotem_welcome-bottom__logo {
2006 margin-bottom: 26px;
2007 }
2008 .wtotem_welcome-bottom__label {
2009 margin-bottom: 20px;
2010 }
2011 .wtotem_welcome-bottom__block {
2012 width: 54px;
2013 display: flex;
2014 justify-content: space-between;
2015 margin: 0 auto;
2016 }
2017
2018 /* 375-576px Extra small */
2019 /* 320-375px Extra small */
2020 @media screen and (max-width: 375px) {
2021 .wtotem_modal__window {
2022 width: 345px;
2023 }
2024 }
2025
2026 /* 320-375px Extra small */
2027 @media screen and (max-width: 355px) {
2028 .wtotem_modal__window {
2029 width: 320px;
2030 }
2031 .wtotem_modal__wrap,
2032 .wtotem_modal__btn {
2033 width: 85%;
2034 }
2035 }
2036
2037 @media screen and (max-width: 330px) {
2038 .wtotem_modal__window {
2039 width: 305px;
2040 }
2041 }
2042
2043 /*# options.css */
2044
2045 .wtotem_item {
2046 margin-bottom: 23px; }
2047
2048 .wtotem_holder {
2049 display: flex;
2050 justify-content: space-between; }
2051 .wtotem_holder__content {
2052 width: 70%; }
2053 .wtotem_holder__sidebar {
2054 width: 27.8431372549%; }
2055
2056 .wtotem_option {
2057 margin-bottom: 12px;
2058 padding: 28px 24px 24px 24px;
2059 display: flex;
2060 align-items: center;
2061 justify-content: space-between;
2062 width: 100%; }
2063 .wtotem_option:last-child {
2064 margin-bottom: 0; }
2065 .wtotem_option__title {
2066 margin-bottom: 7px;
2067 color: #1d293f;
2068 font-size: 14px;
2069 font-weight: 500; }
2070 .wtotem_option__text {
2071 width: 495px;
2072 font-size: 12px;
2073 color: #5e6977;
2074 line-height: 16px; }
2075
2076 .wtotem_control {
2077 padding: 16px 22px 24px 22px; }
2078 .wtotem_control__title {
2079 color: #1d293f;
2080 font-size: 14px;
2081 font-weight: 500;
2082 margin-bottom: 18px; }
2083 .wtotem_control__block {
2084 padding: 12px 8px;
2085 display: flex;
2086 align-items: center;
2087 background: #f3f5f6;
2088 border-radius: 5px;
2089 margin-bottom: 12px;
2090 width: 100%; }
2091 .wtotem_control__block_switch {
2092 justify-content: space-between;
2093 align-items: center; }
2094 .wtotem_control__circle {
2095 margin-right: 4px;
2096 width: 16px;
2097 height: 16px;
2098 border-radius: 100px;
2099 display: flex;
2100 align-items: center;
2101 justify-content: center;
2102 background: #4bc374; }
2103 .wtotem_control__circle img {
2104 width: 7px;
2105 height: 7px; }
2106 .wtotem_control__name {
2107 color: #5e6977; }
2108 .wtotem_control__trash {
2109 width: 15px;
2110 height: 15px;
2111 background: url("../img/trash.svg") no-repeat center center/cover;
2112 margin-left: auto;
2113 cursor: pointer; }
2114 .wtotem_control__btn {
2115 color: #fff;
2116 display: block;
2117 width: 100%;
2118 height: 42px;
2119 display: flex;
2120 align-items: center;
2121 justify-content: center;
2122 background: #4bc374;
2123 border-radius: 5px;
2124 transition: all 0.2s ease-in-out;
2125 border: none;
2126 cursor: pointer; }
2127 .wtotem_control__btn:hover {
2128 transition: all 0.2s ease-in-out;
2129 background: #f3f5f6;
2130 color: #5e6977; }
2131 .wtotem_control__label {
2132 position: relative;
2133 width: 41px;
2134 height: 23px;
2135 border-radius: 100px;
2136 background: #1f2323;
2137 padding: 4px 7px;
2138 display: flex;
2139 justify-content: space-between;
2140 align-items: center;
2141 cursor: pointer; }
2142 .wtotem_control__label:before, .wtotem_control__label:after {
2143 content: "";
2144 display: block;
2145 position: relative;
2146 z-index: 2; }
2147 .wtotem_control__label:before {
2148 width: 8px;
2149 height: 8px;
2150 background: url("../img/checkbox-sun.svg") no-repeat center center/cover; }
2151 .wtotem_control__label:after {
2152 width: 6px;
2153 height: 6px;
2154 background: url("../img/checkbox-moon.svg") no-repeat center center/cover; }
2155 .wtotem_control__switched-circle {
2156 position: absolute;
2157 left: 4px;
2158 width: 15px;
2159 height: 15px;
2160 background: #fff;
2161 border-radius: 100px;
2162 display: block;
2163 z-index: 1;
2164 transition: all 0.3s ease-in-out; }
2165 .wtotem_control__input {
2166 display: none!important; }
2167 .wtotem_control__input:checked + label {
2168 background: #fff; }
2169 .wtotem_control__input:checked + label span {
2170 left: 23px;
2171 background: #3d50df; }
2172
2173 .onoff__input {
2174 display: none!important; }
2175
2176 .onoff__label {
2177 position: relative;
2178 display: flex;
2179 align-items: center;
2180 width: 43px;
2181 height: 23px;
2182 border-radius: 100px;
2183 padding: 4px;
2184 background: #f4f4f4;
2185 overflow: hidden;
2186 cursor: pointer; }
2187 .onoff__label:before, .onoff__label:after {
2188 position: absolute;
2189 font-weight: 500;
2190 font-size: 9px;
2191 transition: all 0.3s ease-in-out; }
2192 .onoff__label:before {
2193 content: "ON";
2194 color: #3d50df;
2195 left: -100%; }
2196 .onoff__label:after {
2197 content: "OFF";
2198 color: #979797;
2199 right: 4px; }
2200
2201 .onoff__circle {
2202 position: absolute;
2203 left: 4px;
2204 width: 15px;
2205 height: 15px;
2206 border-radius: 100px;
2207 background: #c4c4c4;
2208 transition: all 0.3s ease-in-out; }
2209
2210 .onoff__input:checked + label .onoff__circle {
2211 background: #3d50df;
2212 left: 22px; }
2213
2214 .onoff__input:checked + label:before {
2215 left: 4px; }
2216
2217 .onoff__input:checked + label:after {
2218 right: -100%; }
2219
2220 /* 992-1100px lg Large */
2221 @media screen and (max-width: 1100px) {
2222 .wtotem_option__text {
2223 width: 95%; } }
2224
2225 /* 768-992px md Medium */
2226 @media screen and (max-width: 992px) {
2227 .wtotem_holder {
2228 flex-direction: column; }
2229 .wtotem_holder__content {
2230 width: 100%;
2231 margin-bottom: 30px; }
2232 .wtotem_holder__sidebar {
2233 width: 100%; } }
2234
2235 /* 576-768px sm Small */
2236 /* 375-576px Extra small */
2237 @media screen and (max-width: 576px) {
2238 .wtotem_holder__content {
2239 margin-bottom: 20px; } }
2240
2241 /* 320-375px Extra small */
2242
2243 /*# options.css */
2244
2245
2246 .wtotem_offer {
2247 display: flex;
2248 justify-content: space-between;
2249 align-items: center;
2250 padding: 40px 56px 37px 40px;
2251 margin-bottom: 110px;
2252 }
2253 .wtotem_offer__title {
2254 margin-bottom: 22px;
2255 font-size: 24px;
2256 color: #1d293f;
2257 font-weight: 500;
2258 }
2259 .wtotem_offer__text {
2260 width: 601px;
2261 margin-bottom: 22px;
2262 font-size: 16px;
2263 color: #5e6977;
2264 line-height: 24px;
2265 }
2266 .wtotem_offer__btn {
2267 color: #fff;
2268 background: #3d50df;
2269 border-radius: 5px;
2270 width: 151px;
2271 height: 42px;
2272 display: flex;
2273 align-items: center;
2274 justify-content: center;
2275 border: none;
2276 cursor: pointer;
2277 }
2278
2279 /* 992-1100px lg Large */
2280 /* 768-992px md Medium */
2281 @media screen and (max-width: 992px) {
2282 .wtotem_offer__title {
2283 line-height: 32px;
2284 margin-bottom: 20px;
2285 }
2286 .wtotem_offer__text {
2287 width: 100%;
2288 }
2289 }
2290
2291 /* 576-768px sm Small */
2292 @media screen and (max-width: 768px) {
2293 .wtotem_offer {
2294 padding: 20px;
2295 }
2296 .wtotem_offer__img {
2297 display: none;
2298 }
2299 }
2300
2301 /* 375-576px Extra small */
2302 /* 320-375px Extra small */
2303 .wtotem_ready {
2304 background: #e5e5e5;
2305 }
2306
2307 .wtotem_unit__first {
2308 display: flex;
2309 justify-content: space-between;
2310 }
2311
2312 .wtotem_unit__wrapper {
2313 display: flex;
2314 justify-content: space-between;
2315 background: #fff;
2316 }
2317
2318 .wtotem_unit__block {
2319 display: flex;
2320 justify-content: space-between;
2321 align-items: center;
2322 width: 100%;
2323 padding: 30px 30px;
2324 border-right: 1px solid #f3f5f6;
2325 }
2326
2327 .wtotem_unit__contain {
2328 display: flex;
2329 justify-content: space-between;
2330 align-items: center;
2331 }
2332
2333 .wtotem_unit__circle {
2334 margin-right: 16px;
2335 width: 45px;
2336 height: 45px;
2337 border-radius: 100px;
2338 display: flex;
2339 align-items: center;
2340 justify-content: center;
2341 }
2342 /*.wtotem_unit__circle_loading {*/
2343 /*background: #f3f5f6;*/
2344 /*}*/
2345 .wtotem_unit__circle_success {
2346 background: #4bc374;
2347 }
2348 .wtotem_unit__circle_error {
2349 background: #ee3f3f;
2350 position: relative;
2351 }
2352 .wtotem_unit__circle_error:before {
2353 content: "";
2354 position: absolute;
2355 width: 19px;
2356 height: 3px;
2357 background: #fff;
2358 border-radius: 1px;
2359 display: block;
2360 transform: rotate(45deg);
2361 }
2362 .wtotem_unit__circle_error:after {
2363 content: "";
2364 position: absolute;
2365 width: 19px;
2366 height: 3px;
2367 background: #fff;
2368 border-radius: 1px;
2369 display: block;
2370 transform: rotate(-45deg);
2371 }
2372
2373 .wtotem_unit__img_spinner {
2374 animation: 1s linear 0s normal none infinite running rot;
2375 -webkit-animation: 1s linear 0s normal none infinite running rot;
2376 }
2377
2378 @keyframes rot {
2379 0% {
2380 transform: rotate(0deg);
2381 }
2382 100% {
2383 transform: rotate(360deg);
2384 }
2385 }
2386
2387 @-webkit-keyframes rot {
2388 0% {
2389 transform: rotate(0deg);
2390 }
2391 100% {
2392 transform: rotate(360deg);
2393 }
2394 }
2395
2396 .wtotem_unit__expectation {
2397 font-size: 16px;
2398 font-weight: 500;
2399 }
2400 .wtotem_unit__expectation_loading {
2401 color: #7c8087;
2402 }
2403 .wtotem_unit__expectation_success {
2404 color: #bace3d;
2405 }
2406 .wtotem_unit__expectation_error {
2407 color: #d56c6a;
2408 }
2409
2410 .wtotem_unit__repeat {
2411 color: #3d50df;
2412 cursor: pointer;
2413 }
2414
2415 .wtotem_layout {
2416 background: #e5e5e5;
2417 }
2418
2419 .wtotem_alert {
2420 padding: 17px 22px;
2421 display: flex;
2422 justify-content: space-between;
2423 align-items: center;
2424 background: #fff;
2425 border-radius: 4px;
2426 margin-bottom: 30px;
2427 }
2428 .wtotem_alert__desc {
2429 display: flex;
2430 align-items: center;
2431 }
2432 .wtotem_alert__img {
2433 margin-right: 5px;
2434 display: flex;
2435 align-items: center;
2436 justify-content: center;
2437 }
2438 .wtotem_alert__img_cross {
2439 width: 16px;
2440 height: 16px;
2441 border-radius: 100px;
2442 display: flex;
2443 align-items: center;
2444 justify-content: center;
2445 background: #ee3f3f;
2446 }
2447 .wtotem_alert__img_cross:before {
2448 content: "";
2449 position: absolute;
2450 display: block;
2451 width: 8px;
2452 height: 1.3px;
2453 border-radius: 1px;
2454 transform: rotate(45deg);
2455 background: #fff;
2456 }
2457 .wtotem_alert__img_cross:after {
2458 content: "";
2459 position: absolute;
2460 display: block;
2461 width: 8px;
2462 height: 1.3px;
2463 border-radius: 1px;
2464 transform: rotate(-45deg);
2465 background: #fff;
2466 }
2467 .wtotem_alert__title {
2468 font-size: 12px;
2469 text-transform: uppercase;
2470 }
2471 .wtotem_alert__title_yellow {
2472 color: #f5c451;
2473 }
2474 .wtotem_alert__title_green {
2475 color: #4bc374;
2476 }
2477 .wtotem_alert__title_red {
2478 color: #ee3f3f;
2479 }
2480 .wtotem_alert__text {
2481 color: #1d293f;
2482 font-size: 12px;
2483 }
2484 .wtotem_alert__close {
2485 position: relative;
2486 width: 10px;
2487 height: 10px;
2488 display: flex;
2489 justify-self: center;
2490 align-items: center;
2491 cursor: pointer;
2492 }
2493 .wtotem_alert__close:before {
2494 content: "";
2495 position: absolute;
2496 display: block;
2497 width: 10px;
2498 height: 2px;
2499 border-radius: 1px;
2500 transform: rotate(45deg);
2501 background: #000;
2502 }
2503 .wtotem_alert__close:after {
2504 content: "";
2505 position: absolute;
2506 display: block;
2507 width: 10px;
2508 height: 2px;
2509 border-radius: 1px;
2510 transform: rotate(-45deg);
2511 background: #000;
2512 }
2513
2514 /* 576-768px sm Small */
2515 @media screen and (max-width: 768px) {
2516 .wtotem_alert {
2517 margin-bottom: 20px;
2518 }
2519 }
2520
2521 /* 320-576px Extra small */
2522 .line-chart .axis line {
2523 stroke: #f0f0f0;
2524 }
2525
2526 .line-chart .axis path {
2527 stroke: #f0f0f0;
2528 }
2529
2530 .line-chart .axis text {
2531 fill: #5e6977;
2532 }
2533
2534 .line-chart .grid line {
2535 stroke: #f0f0f0;
2536 }
2537
2538 .line-chart .listening-rect {
2539 fill: transparent;
2540 }
2541
2542 .line-chart__tooltip {
2543 opacity: 0;
2544 position: absolute;
2545 top: -25px;
2546 left: -17px;
2547 padding: 0.2em 0.5em;
2548 background: #1d293f;
2549 text-align: center;
2550 line-height: 1.4em;
2551 font-size: 0.9em;
2552 z-index: 10;
2553 transition: all 0.1s ease-out;
2554 pointer-events: none;
2555 color: #fff;
2556 font-family: Inter, Gilroy, Helvetica, sans-serif;
2557 border-radius: 2px;
2558 min-width: 28px;
2559 }
2560
2561 .line-chart__tooltip:before {
2562 content: "";
2563 position: absolute;
2564 bottom: 0;
2565 left: 50%;
2566 width: 12px;
2567 height: 12px;
2568 background: #1d293f;
2569 border-top-color: transparent;
2570 border-left-color: transparent;
2571 transform: translate(-50%, 50%) rotate(45deg);
2572 transform-origin: center center;
2573 z-index: 10;
2574 }
2575
2576 .line-chart {
2577 position: relative;
2578 }
2579
2580 .wtotem_theme—dark .wt_card,
2581 .wtotem_theme—dark .wt_card:before,
2582 .wtotem_theme—dark .wtotem_chart-first__btn_active {
2583 background: #282828;
2584 }
2585
2586 .wtotem_theme—dark .wtotem_content,
2587 .wtotem_theme—dark .wtotem_footer,
2588 .wtotem_theme—dark .wtotem_chart-first__right,
2589 .wtotem_theme—dark .wtotem_control__block,
2590 .wtotem_theme—dark .wtotem_state__select,
2591 .wtotem_theme—dark .wtotem_chart__calendars,
2592 .wtotem_theme—dark .wtotem_unit__circle_loading {
2593 background: #191919;
2594 }
2595
2596 .wtotem_theme—dark .wtotem_version__count {
2597 border: 1px solid #f3f5f6;
2598 }
2599
2600 .wtotem_theme—dark .wtotem_logo {
2601 background: url("../img/dr-logo.svg") no-repeat center center/cover;
2602 }
2603
2604 .wtotem_theme—dark .wtotem_nav__link,
2605 .wtotem_theme—dark .wtotem_nav__link_active,
2606 .wtotem_theme—dark .wtotem_version__count,
2607 .wtotem_theme—dark .title,
2608 .wtotem_theme—dark .wtotem_title-info__title,
2609 .wtotem_theme—dark .wtotem_overall__text,
2610 .wtotem_theme—dark .wtotem_info__subtitle,
2611 .wtotem_theme—dark .wtotem_info__info,
2612 .wtotem_theme—dark .wtotem_numbers__figures,
2613 .wtotem_theme—dark .wtotem_from__country,
2614 .wtotem_theme—dark .wtotem_from__country span,
2615 .wtotem_theme—dark .wtotem_data__th,
2616 .wtotem_theme—dark .wtotem_antivirus__title,
2617 .wtotem_theme—dark .wtotem_table__title,
2618 .wtotem_theme—dark .wtotem_table__subject,
2619 .wtotem_theme—dark .wtotem_table__text,
2620 .wtotem_theme—dark .wtotem_table__perfomance,
2621 .wtotem_theme—dark .wtotem_footer__text,
2622 .wtotem_theme—dark .wtotem_footer__text,
2623 .wtotem_theme—dark .wtotem_chart__btn,
2624 .wtotem_theme—dark .wtotem_antivirus__item:last-child div,
2625 .wtotem_theme—dark .wtotem_from__percent,
2626 .wtotem_theme—dark .wtotem_chart-first__all,
2627 .wtotem_theme—dark .wtotem_chart-first__hack p,
2628 .wtotem_theme—dark .wtotem_chart-first__btn_active,
2629 .wtotem_theme—dark .wtotem_chart__text,
2630 .wtotem_theme—dark .wtotem_table__initial-value,
2631 .wtotem_theme—dark .arrow-right,
2632 .wtotem_theme—dark .wtotem_print__label,
2633 .wtotem_theme—dark .wtotem_state__text,
2634 .wtotem_theme—dark .wtotem_pagination__number,
2635 .wtotem_theme—dark .wtotem_data__td,
2636 .wtotem_theme—dark .wtotem_file-table__th,
2637 .wtotem_theme—dark .wtotem_file-table,
2638 .wtotem_theme—dark .wtotem_option__title,
2639 .wtotem_theme—dark .wtotem_option__text,
2640 .wtotem_theme—dark .wtotem_control__title,
2641 .wtotem_theme—dark .wtotem_control__name,
2642 .wtotem_theme—dark .onoff__label:after,
2643 .wtotem_theme—dark .onoff__label:before,
2644 .wtotem_theme—dark .wtotem_offer__title,
2645 .wtotem_theme—dark .wtotem_offer__text,
2646 .wtotem_theme—dark .wtotem_unit__expectation_loading,
2647 .wtotem_theme—dark .wtotem_alert__text {
2648 color: #f3f5f6;
2649 }
2650
2651 .wtotem_theme—dark .wtotem_data__ip {
2652 color: #86939e;
2653 }
2654
2655 .wtotem_theme—dark .wtotem_chart__btn {
2656 border: 1px solid #f3f5f6;
2657 }
2658
2659 .wtotem_theme—dark .wtotem_title-info__info {
2660 background: url("../img/dr-info.svg") no-repeat center center/cover;
2661 }
2662
2663 .wtotem_theme—dark .wtotem_nav__link_active {
2664 color: #3d50df;
2665 }
2666
2667 .wtotem_theme—dark .wtotem_info__item:first-child,
2668 .wtotem_theme—dark .wtotem_numbers__item,
2669 .wtotem_theme—dark .wtotem_antivirus__item,
2670 .wtotem_theme—dark .wtotem_unit__block {
2671 border-right: 1px solid #3c3c3d;
2672 }
2673
2674 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
2675 border-right: none;
2676 }
2677
2678 .wtotem_theme—dark .wtotem_numbers__item:last-child {
2679 border-right: none;
2680 }
2681
2682 .wtotem_theme—dark .wtotem_table__col {
2683 border-right: 1px solid #3c3c3d;
2684 border-bottom: 1px solid #3c3c3d;
2685 }
2686
2687 .wtotem_theme—dark .wtotem_table__col:last-child {
2688 border-right: none;
2689 }
2690
2691 .wtotem_theme—dark .wtotem_chart__line {
2692 background: #3c3c3d;
2693 }
2694
2695 .wtotem_theme—dark .wtotem_table__th,
2696 .wtotem_theme—dark .wtotem_table__td {
2697 border-bottom: 1px solid #3c3c3d;
2698 }
2699
2700 .wtotem_theme—dark .wtotem_table__link:after {
2701 content: "";
2702 border: solid #fff;
2703 border-width: 0 1.5px 1.5px 0;
2704 transform: rotate(-45deg);
2705 -webkit-transform: rotate(-45deg);
2706 }
2707
2708 .wtotem_theme—dark .arrow-right:after {
2709 content: "";
2710 border: solid #f3f5f6;
2711 border-width: 0 1px 1px 0;
2712 transform: rotate(-45deg);
2713 -webkit-transform: rotate(-45deg);
2714 margin-left: 10px;
2715 }
2716
2717 .wtotem_theme—dark .wtotem_footer__line,
2718 .wtotem_theme—dark .wtotem_state__line {
2719 background: #2d2e2e;
2720 }
2721
2722 .wtotem_theme—dark .wtotem_footer__app-store {
2723 width: 19px;
2724 height: 19px;
2725 background: url("../img/dr-app-store.svg") no-repeat center center/cover;
2726 }
2727
2728 .wtotem_theme—dark .wtotem_footer__play-store {
2729 width: 17px;
2730 height: 19px;
2731 background: url("../img/dr-play-store.svg") no-repeat center center/cover;
2732 }
2733
2734 .wtotem_theme—dark .wtotem_footer__logo {
2735 background: url("../img/dr-logo-footer.svg") no-repeat center center/cover;
2736 }
2737
2738 .wtotem_theme—dark .line-chart__tooltip,
2739 .wtotem_theme—dark .line-chart__tooltip::before {
2740 background: #3d50df;
2741 }
2742
2743 .wtotem_theme—dark .wtotem_firewall__icon {
2744 background: url("../img/dr-shape.svg") no-repeat center center/cover;
2745 }
2746
2747 .wtotem_theme—dark .wtotem_pagination__number_active {
2748 background: #5a5c5e;
2749 }
2750
2751 .wtotem_pagination__number:hover {
2752 color: #5e6977;
2753 transition: all 0.2s ease;
2754 }
2755
2756 .wtotem_theme—dark .onoff__label {
2757 background: #686868;
2758 }
2759
2760 .wtotem_theme—dark .wtotem_print__img {
2761 background: url("../img/dr-print.svg") no-repeat center center/cover;
2762 }
2763
2764 .wtotem_theme—dark .wtotem_control__trash {
2765 background: url("../img/dr-trash.svg") no-repeat center center/cover;
2766 }
2767
2768 .wtotem_theme—dark .onoff__input:checked + label .onoff__circle {
2769 background: #4bc374;
2770 }
2771
2772 .wtotem_theme—dark .onoff__circle {
2773 background: #ec6d62;
2774 }
2775
2776 .wtotem_theme—dark .wtotem_alert__close:before,
2777 .wtotem_theme—dark .wtotem_alert__close:after {
2778 background: #dadada;
2779 }
2780
2781 .wtotem_info__item .arrow-right {
2782 color: #3d50df;
2783 }
2784 .wtotem_info__item .arrow-right:after {
2785 content: "";
2786 border: solid #3d50df;
2787 border-width: 0 1px 1px 0;
2788 transform: rotate(-45deg);
2789 -webkit-transform: rotate(-45deg);
2790 margin-left: 10px;
2791 }
2792
2793 /* 320-576px Extra small */
2794 @media screen and (max-width: 576px) {
2795 .wtotem_theme—dark .wtotem_info__item:first-child {
2796 border-right: none;
2797 }
2798 .wtotem_theme—dark .wtotem_antivirus__item {
2799 border-bottom: 1px solid #3c3c3d;
2800 }
2801 .wtotem_theme—dark .wtotem_numbers__item:last-child {
2802 border-right: 1px solid #3c3c3d;
2803 }
2804 .wtotem_theme—dark .wtotem_numbers__item:nth-child(2) {
2805 border-right: none;
2806 }
2807 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
2808 border-right: none;
2809 border-bottom: none;
2810 }
2811 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(2) {
2812 border-right: none;
2813 }
2814 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(3) {
2815 border-bottom: none;
2816 }
2817 }
2818
2819 /* 992-1100px lg Large */
2820 @media screen and (max-width: 1100px) {
2821 .wtotem_container {
2822 max-width: 960px;
2823 }
2824 }
2825
2826 /* 768-992px md Medium */
2827 @media screen and (max-width: 992px) {
2828 .wtotem_container {
2829 max-width: 720px;
2830 }
2831 }
2832
2833 /* 576-768px sm Small */
2834 @media screen and (max-width: 768px) {
2835 .wtotem_container {
2836 max-width: 540px;
2837 }
2838 .wtotem_content {
2839 padding-top: 19px;
2840 }
2841 }
2842
2843 /* 375-576px Extra small */
2844 @media screen and (max-width: 576px) {
2845 .wtotem_container {
2846 max-width: 345px;
2847 }
2848 }
2849
2850 /* 320-375px Extra small */
2851 @media screen and (max-width: 374px) {
2852 .wtotem_container {
2853 max-width: auto;
2854 padding: 0 10px;
2855 }
2856 }
2857
2858 /* 992-1100px lg Large */
2859 /* 768-992px md Medium */
2860 /* 576-768px sm Small */
2861 /* 375-576px Extra small */
2862 /* 320-375px Extra small */
2863
2864 /*# sourceMappingURL=main.css.map */
2865
2866 /*tlite */
2867 .tlite {
2868 background: #111;
2869 color: #fff;
2870 font-family: sans-serif;
2871 font-size: 0.8rem;
2872 font-weight: normal;
2873 text-decoration: none;
2874 text-align: left;
2875 padding: 0.6em 0.75rem;
2876 border-radius: 4px;
2877 position: absolute;
2878 opacity: 0;
2879 visibility: hidden;
2880 transition: opacity 0.4s;
2881 max-width: 350px;
2882 box-shadow: 0 0.5rem 1rem -0.5rem #000;
2883 z-index: 1000;
2884 -webkit-backface-visibility: hidden;
2885 }
2886 .tlite-table td,
2887 .tlite-table th {
2888 position: relative;
2889 }
2890 .tlite-visible {
2891 visibility: visible;
2892 opacity: 0.9;
2893 }
2894 .tlite::before {
2895 content: " ";
2896 display: block;
2897 background: inherit;
2898 width: 10px;
2899 height: 10px;
2900 position: absolute;
2901 transform: rotate(45deg);
2902 }
2903 .tlite-n::before {
2904 top: -3px;
2905 left: 50%;
2906 margin-left: -5px;
2907 }
2908 .tlite-nw::before {
2909 top: -3px;
2910 left: 10px;
2911 }
2912 .tlite-ne::before {
2913 top: -3px;
2914 right: 10px;
2915 }
2916 .tlite-s::before {
2917 bottom: -3px;
2918 left: 50%;
2919 margin-left: -5px;
2920 }
2921 .tlite-se::before {
2922 bottom: -3px;
2923 right: 10px;
2924 }
2925 .tlite-sw::before {
2926 bottom: -3px;
2927 left: 10px;
2928 }
2929 .tlite-w::before {
2930 left: -3px;
2931 top: 50%;
2932 margin-top: -5px;
2933 }
2934 .tlite-e::before {
2935 right: -3px;
2936 top: 50%;
2937 margin-top: -5px;
2938 }
2939 .is--status--ok {
2940 color: #4bc374;
2941 fill: #4bc374;
2942 }
2943 .is--status--error {
2944 color: #ee3f3f;
2945 fill: #ee3f3f;
2946 }
2947 .is--status--pending {
2948 color: #3d50df;
2949 fill: #3d50df;
2950 }
2951 .is--status--warning {
2952 color: #f5bf4f;
2953 fill: #f5bf4f;
2954 }
2955 .wtsec_score_red {
2956 color: #d56c6a;
2957 }
2958 .wtsec_score_orange {
2959 color: #c2b00e;
2960 }
2961 .wtsec_score_green {
2962 color: #7eb40c;
2963 }
2964 .wtsec_score_bg_red {
2965 background: #d56c6a;
2966 color: #fff;
2967 }
2968 .wtsec_score_bg_orange {
2969 background: #c2b00e;
2970 color: #fff;
2971 }
2972 .wtsec_score_bg_green {
2973 background: #7eb40c;
2974 color: #fff;
2975 }
2976 #wtotem_alert {
2977 margin-top: 20px;
2978 }
2979
2980 .ml-2 {
2981 margin-left: 20px;
2982 }
2983
2984 .wt-flex {
2985 display: flex;
2986 }
2987
2988 .wt-flex-middle {
2989 align-items: center;
2990 }
2991
2992 .wt-margin-right-10 {
2993 margin-right: 10px;
2994 }
2995 .break-word {
2996 overflow-wrap: break-word;
2997 word-wrap: break-word;
2998 }
2999
3000 select.wtotem_state__select {
3001 display: block;
3002 margin-left: 18px;
3003 width: 100%;
3004 padding: 8px 12px 8px 12px;
3005 color: #86939e;
3006 font-size: 14px;
3007 font-weight: 400;
3008 -webkit-appearance: none;
3009 appearance: none;
3010 background-color: #f3f5f6;
3011 background-image: none;
3012 border-radius: 4px;
3013 border: none;
3014 font-family: inherit;
3015 cursor: pointer;
3016 }
3017
3018 .wtotem_unit {
3019 margin-bottom: 30px;
3020 }
3021
3022 .wtotem_table__text {
3023 margin-left: 15px;
3024 word-break: break-all;
3025 }
3026 .wt-margin-20{
3027 margin: 20px;
3028 }
3029 .wt-margin-bottom-15{
3030 margin-bottom: 15px;
3031 }
3032 .wtotem_av_filters_wrapper{
3033 justify-content: space-between;
3034 display: flex;
3035 }
3036
3037 .wt_flag{
3038 width: 24px;
3039 }