PluginProbe
WebTotem Security / 2.3
WebTotem Security v2.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.3, at htdocs/css/main.css

4,180 lines 90.6 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
2
3 /* Document
4 ========================================================================== */
5
6 /**
7 * 1. Correct the line height in all browsers.
8 * 2. Prevent adjustments of font size after orientation changes in iOS.
9 */
10
11 html {
12 line-height: 1.15; /* 1 */
13 -webkit-text-size-adjust: 100%; /* 2 */
14 }
15
16 /* Sections
17 ========================================================================== */
18
19 /**
20 * Remove the margin in all browsers.
21 */
22
23 body {
24 margin: 0;
25 }
26
27 /**
28 * Render the `main` element consistently in IE.
29 */
30
31 main {
32 display: block;
33 }
34
35 /**
36 * Correct the font size and margin on `h1` elements within `section` and
37 * `article` contexts in Chrome, Firefox, and Safari.
38 */
39
40 h1 {
41 font-size: 2em;
42 margin: 0.67em 0;
43 }
44
45 /* Grouping content
46 ========================================================================== */
47
48 /**
49 * 1. Add the correct box sizing in Firefox.
50 * 2. Show the overflow in Edge and IE.
51 */
52
53 hr {
54 box-sizing: content-box; /* 1 */
55 height: 0; /* 1 */
56 overflow: visible; /* 2 */
57 }
58
59 /**
60 * 1. Correct the inheritance and scaling of font size in all browsers.
61 * 2. Correct the odd `em` font sizing in all browsers.
62 */
63
64 pre {
65 font-family: monospace, monospace; /* 1 */
66 font-size: 1em; /* 2 */
67 }
68
69 /* Text-level semantics
70 ========================================================================== */
71
72 /**
73 * Remove the gray background on active links in IE 10.
74 */
75
76 a {
77 background-color: transparent;
78 }
79
80 /**
81 * 1. Remove the bottom border in Chrome 57-
82 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
83 */
84
85 abbr[title] {
86 border-bottom: none; /* 1 */
87 text-decoration: underline; /* 2 */
88 text-decoration: underline dotted; /* 2 */
89 }
90
91 /**
92 * Add the correct font weight in Chrome, Edge, and Safari.
93 */
94
95 b,
96 strong {
97 font-weight: bolder;
98 }
99
100 /**
101 * 1. Correct the inheritance and scaling of font size in all browsers.
102 * 2. Correct the odd `em` font sizing in all browsers.
103 */
104
105 code,
106 kbd,
107 samp {
108 font-family: monospace, monospace; /* 1 */
109 font-size: 1em; /* 2 */
110 }
111
112 /**
113 * Add the correct font size in all browsers.
114 */
115
116 small {
117 font-size: 80%;
118 }
119
120 /**
121 * Prevent `sub` and `sup` elements from affecting the line height in
122 * all browsers.
123 */
124
125 sub,
126 sup {
127 font-size: 75%;
128 line-height: 0;
129 position: relative;
130 vertical-align: baseline;
131 }
132
133 sub {
134 bottom: -0.25em;
135 }
136
137 sup {
138 top: -0.5em;
139 }
140
141 /* Embedded content
142 ========================================================================== */
143
144 /**
145 * Remove the border on images inside links in IE 10.
146 */
147
148 img {
149 border-style: none;
150 }
151
152 /* Forms
153 ========================================================================== */
154
155 /**
156 * 1. Change the font styles in all browsers.
157 * 2. Remove the margin in Firefox and Safari.
158 */
159
160 button,
161 input,
162 optgroup,
163 select,
164 textarea {
165 font-family: inherit; /* 1 */
166 font-size: 100%; /* 1 */
167 line-height: 1.15; /* 1 */
168 margin: 0; /* 2 */
169 }
170
171 /**
172 * Show the overflow in IE.
173 * 1. Show the overflow in Edge.
174 */
175
176 button,
177 input { /* 1 */
178 overflow: visible;
179 }
180
181 /**
182 * Remove the inheritance of text transform in Edge, Firefox, and IE.
183 * 1. Remove the inheritance of text transform in Firefox.
184 */
185
186 button,
187 select { /* 1 */
188 text-transform: none;
189 }
190
191 /**
192 * Correct the inability to style clickable types in iOS and Safari.
193 */
194
195 button,
196 [type="button"],
197 [type="reset"],
198 [type="submit"] {
199 -webkit-appearance: button;
200 }
201
202 /**
203 * Remove the inner border and padding in Firefox.
204 */
205
206 button::-moz-focus-inner,
207 [type="button"]::-moz-focus-inner,
208 [type="reset"]::-moz-focus-inner,
209 [type="submit"]::-moz-focus-inner {
210 border-style: none;
211 padding: 0;
212 }
213
214 /**
215 * Restore the focus styles unset by the previous rule.
216 */
217
218 button:-moz-focusring,
219 [type="button"]:-moz-focusring,
220 [type="reset"]:-moz-focusring,
221 [type="submit"]:-moz-focusring {
222 outline: 1px dotted ButtonText;
223 }
224
225 /**
226 * Correct the padding in Firefox.
227 */
228
229 fieldset {
230 padding: 0.35em 0.75em 0.625em;
231 }
232
233 /**
234 * 1. Correct the text wrapping in Edge and IE.
235 * 2. Correct the color inheritance from `fieldset` elements in IE.
236 * 3. Remove the padding so developers are not caught out when they zero out
237 * `fieldset` elements in all browsers.
238 */
239
240 legend {
241 box-sizing: border-box; /* 1 */
242 color: inherit; /* 2 */
243 display: table; /* 1 */
244 max-width: 100%; /* 1 */
245 padding: 0; /* 3 */
246 white-space: normal; /* 1 */
247 }
248
249 /**
250 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
251 */
252
253 progress {
254 vertical-align: baseline;
255 }
256
257 /**
258 * Remove the default vertical scrollbar in IE 10+.
259 */
260
261 textarea {
262 overflow: auto;
263 }
264
265 /**
266 * 1. Add the correct box sizing in IE 10.
267 * 2. Remove the padding in IE 10.
268 */
269
270 [type="checkbox"],
271 [type="radio"] {
272 box-sizing: border-box; /* 1 */
273 padding: 0; /* 2 */
274 }
275
276 /**
277 * Correct the cursor style of increment and decrement buttons in Chrome.
278 */
279
280 [type="number"]::-webkit-inner-spin-button,
281 [type="number"]::-webkit-outer-spin-button {
282 height: auto;
283 }
284
285 /**
286 * 1. Correct the odd appearance in Chrome and Safari.
287 * 2. Correct the outline style in Safari.
288 */
289
290 [type="search"] {
291 -webkit-appearance: textfield; /* 1 */
292 outline-offset: -2px; /* 2 */
293 }
294
295 /**
296 * Remove the inner padding in Chrome and Safari on macOS.
297 */
298
299 [type="search"]::-webkit-search-decoration {
300 -webkit-appearance: none;
301 }
302
303 /**
304 * 1. Correct the inability to style clickable types in iOS and Safari.
305 * 2. Change font properties to `inherit` in Safari.
306 */
307
308 ::-webkit-file-upload-button {
309 -webkit-appearance: button; /* 1 */
310 font: inherit; /* 2 */
311 }
312
313 /* Interactive
314 ========================================================================== */
315
316 /*
317 * Add the correct display in Edge, IE 10+, and Firefox.
318 */
319
320 details {
321 display: block;
322 }
323
324 /*
325 * Add the correct display in all browsers.
326 */
327
328 summary {
329 display: list-item;
330 }
331
332 /* Misc
333 ========================================================================== */
334
335 /**
336 * Add the correct display in IE 10+.
337 */
338
339 template {
340 display: none;
341 }
342
343 /**
344 * Add the correct display in IE 10.
345 */
346
347 [hidden] {
348 display: none;
349 }
350
351
352 @charset "UTF-8";
353 .wtotem_body *,
354 .wtotem_body *:after,
355 .wtotem_body *:before {
356 margin: 0;
357 padding: 0;
358 outline: none;
359 box-sizing: border-box;
360 }
361
362 .wtotem_body .button,
363 .wtotem_body .button:hover,
364 .wtotem_body .button:focus,
365 .wtotem_body .button:active {
366 text-transform: uppercase;
367 background: #3d50df;
368 font-weight: bold;
369 font-size: 14px;
370 line-height: 16px;
371 color: #fff;
372 border: none;
373 border-radius: 5px;
374 cursor: pointer;
375 display: inline-block;
376 text-align: center;
377 padding: 10px 15px;
378 }
379
380 .wtotem_body {
381 line-height: 24px;
382 font-family: "Inter", sans-serif;
383 font-size: 14px;
384 color: #5e6977;
385 font-weight: 400;
386 }
387
388 .d-none{
389 display: none!important;
390 }
391
392 .wtotem_body ol,
393 .wtotem_body ul {
394 list-style: none;
395 }
396
397 .wtotem_body a {
398 text-decoration: none;
399 }
400
401 .wtotem_body a:hover {
402 text-decoration: none;
403 }
404
405 .wtotem_body h1,
406 .wtotem_body h2,
407 .wtotem_body h3,
408 .wtotem_body h4,
409 .wtotem_body h5 {
410 color: #5e6977;
411 font-weight: 700;
412 }
413
414 .wtotem_container {
415 max-width: 1020px;
416 margin: 0 auto;
417 }
418
419 .visually-hidden {
420 position: absolute !important;
421 clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
422 clip: rect(1px, 1px, 1px, 1px);
423 padding:0 !important;
424 border:0 !important;
425 height: 1px !important;
426 width: 1px !important;
427 overflow: hidden;
428 }
429
430 .wtotem_title-info__title {
431 font-size: 14px;
432 text-transform: uppercase;
433 }
434
435 .wtotem_title-info__info {
436 background: url("../img/info-gray.svg") no-repeat center center/cover;
437 display: inline-block;
438 vertical-align: middle;
439 width: 17px;
440 height: 17px;
441 margin-top: -2px;
442 }
443
444 .title {
445 font-size: 24px;
446 font-weight: 700;
447 }
448
449 .section-header-mb {
450 margin-bottom: 25px;
451 }
452
453 .arrow-right {
454 color: #3d50df;
455 cursor: pointer;
456 display: flex;
457 align-items: center;
458 }
459 .arrow-right:after {
460 content: "";
461 border: solid #3d50df;
462 border-width: 0 1px 1px 0;
463 display: inline-block;
464 padding: 3px;
465 transform: rotate(-45deg);
466 -webkit-transform: rotate(-45deg);
467 margin-left: 10px;
468 }
469
470 .wtotem_print {
471 display: flex;
472 align-items: center;
473 cursor: pointer;
474 }
475 .wtotem_print__img {
476 display: block;
477 width: 17px;
478 height: 17px;
479 margin-right: 10px;
480 background: url("../img/print.svg") no-repeat center center/cover;
481 }
482 .wtotem_print__label {
483 color: #86939e;
484 }
485
486 .wt_card {
487 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
488 border-radius: 4px;
489 background: #fff;
490 }
491
492 /* 576-768px sm Small */
493 @media screen and (max-width: 768px) {
494 .section-header-mb {
495 margin-bottom: 20px;
496 }
497 .arrow-right:after {
498 margin-left: 5px;
499 }
500 }
501
502
503 /*# =header.css.map */
504
505 .wtotem_header {
506 position: relative;
507 z-index: 4;
508 width: 100%;
509 top: 0;
510 left: 0; }
511 .wtotem_header__body {
512 display: flex;
513 justify-content: space-between;
514 align-items: center; }
515 .wtotem_header:before {
516 content: "";
517 position: absolute;
518 top: 0;
519 left: 0;
520 width: 100%;
521 height: 100%;
522 background: #fff;
523 z-index: 2; }
524
525 .wtotem_version {
526 position: relative;
527 z-index: 100;
528 display: flex;
529 align-items: center; }
530 .wtotem_version__count {
531 width: 28px;
532 height: 18px;
533 display: flex;
534 justify-content: center;
535 align-items: center;
536 font-size: 10px;
537 font-weight: 500;
538 border: 1px solid #3d50df;
539 border-radius: 4px;
540 margin-left: 8px; }
541
542 .wtotem_logo {
543 width: 113px;
544 height: 24px;
545 background: url("../img/logo.svg") no-repeat center center/cover; }
546
547 .wtotem_nav {
548 position: relative;
549 z-index: 3;
550 height: 70px; }
551 .wtotem_nav .wtotem_control__checkbox {
552 align-self: center; }
553 .wtotem_nav__menu {
554 display: flex;
555 height: 100%; }
556 .wtotem_nav__link {
557 position: relative;
558 display: flex;
559 align-items: center;
560 height: 100%;
561 font-size: 14px;
562 color: #5e6977;
563 font-weight: 500;
564 padding: 0 16px; }
565 .wtotem_nav__link_active {
566 color: #3d50df; }
567 .wtotem_nav__link_active:before {
568 content: "";
569 position: absolute;
570 bottom: 0;
571 right: 0;
572 left: 0;
573 background: #3d50df;
574 height: 3px; }
575
576 /* 576-768px sm Small */
577 @media screen and (max-width: 768px) {
578 body.lock {
579 overflow: hidden; }
580 .wtotem_version {
581 position: relative;
582 z-index: 3; }
583 .wtotem_header__body {
584 height: 65px; }
585 .wtotem_nav {
586 position: fixed;
587 top: -100%;
588 left: 0;
589 width: 100%;
590 height: 100%;
591 background: #f3f5f6;
592 display: block;
593 padding-top: 65px;
594 transition: all 0.3s ease-in-out;
595 overflow: auto;
596 z-index: 1; }
597 .wtotem_nav__menu {
598 display: block; }
599 .wtotem_nav__item {
600 border-bottom: 1px solid #eceff4; }
601 .wtotem_nav__link {
602 height: auto;
603 display: block;
604 color: #1d293f;
605 font-size: 24px;
606 padding: 22px 0;
607 width: 540px;
608 margin: 0 auto; }
609 .wtotem_nav__link_active {
610 color: #3d50df; }
611 .wtotem_nav__link_active:before {
612 display: none; }
613 .wtotem_nav.active {
614 top: 0; }
615 .wtotem_burger {
616 position: relative;
617 width: 23px;
618 height: 18px;
619 display: flex;
620 align-items: center;
621 justify-content: flex-end;
622 cursor: pointer;
623 z-index: 3; }
624 .wtotem_burger:before, .wtotem_burger__middle-line, .wtotem_burger:after {
625 content: "";
626 background: #3d50df;
627 height: 2px;
628 display: block;
629 right: 0;
630 border-radius: 100px;
631 transition: all 0.3s ease-in-out; }
632 .wtotem_burger:before {
633 position: absolute;
634 width: 23px;
635 top: 0; }
636 .wtotem_burger__middle-line {
637 width: 18px; }
638 .wtotem_burger:after {
639 position: absolute;
640 width: 14px;
641 bottom: 0; }
642 .wtotem_burger.active .wtotem_burger__middle-line {
643 transform: scale(0); }
644 .wtotem_burger.active:before {
645 transform: rotate(45deg);
646 top: 8px; }
647 .wtotem_burger.active:after {
648 transform: rotate(-45deg);
649 width: 100%;
650 bottom: 8px; } }
651
652 /* 320-576px Extra small */
653 @media screen and (max-width: 576px) {
654 .wtotem_nav__link {
655 width: 345px;
656 margin: 0 auto; } }
657
658 /* 320-375px Extra small */
659 @media screen and (max-width: 375px) {
660 .wtotem_nav__link {
661 padding-left: 10px; } }
662
663 @media screen and (max-width: 768px) {
664 .wtotem_theme—dark .wtotem_nav {
665 background: #191919; }
666 .wtotem_theme—dark .wtotem_nav__item {
667 border-bottom: 1px solid #3c3c3d; } }
668
669 /*# =header.css.map */
670
671
672
673 .wtotem_chart__wrapper {
674 display: flex;
675 }
676
677 .wtotem_filter__wrapper {
678 display: flex;
679 justify-content: flex-end;
680 }
681
682 .wtotem_chart__calendars {
683 display: flex;
684 background: #f3f5f6;
685 border-radius: 5px;
686 align-items: center;
687 padding: 10px 8px;
688 margin-right: 7px;
689 }
690
691 .wtotem_calendar-icon {
692 background: url(../img/shape.svg) no-repeat center center / cover;
693 display: block;
694 width: 14px;
695 height: 14px;
696 margin-right: 3px;
697 }
698
699 input.wtotem_calendar {
700 background: transparent;
701 border: none;
702 color: #5e6977;
703 width: 125px;
704 cursor: pointer;
705 text-align: center;
706 }
707
708 input.wtotem_calendar:focus{
709 border: none;
710 box-shadow: none;
711 outline: 0;
712 }
713
714
715 .wtotem_calendar-connect {
716 margin: 0 3px;
717 }
718
719 .numInputWrapper span {
720 opacity: 1;
721 right: 2.5px;
722 }
723
724 .numInputWrapper span.arrowUp {
725 top: 15%;
726 }
727
728 .numInputWrapper span.arrowDown {
729 top: 35%;
730 }
731
732 .flatpickr-calendar {
733 font-family: "Inter", sans-serif;
734 width: 225px;
735 padding: 5px;
736 border: 2px solid #e1e8ee;
737 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
738 border-radius: 5px;
739 margin-top: 10px;
740 /*top: 382px !important;*/
741 }
742
743 .flatpickr-calendar.arrowTop:before {
744 border: 5px solid transparent;
745 border-bottom: 5px solid #e1e8ee;
746 top: -12px;
747 }
748
749 .flatpickr-calendar.arrowTop:after {
750 border: 5px solid transparent;
751 border-bottom: 5px solid #e1e8ee;
752 top: -12px;
753 }
754
755 .dayContainer {
756 justify-content: flex-start;
757 width: 225px;
758 min-width: 225px;
759 max-width: 225px;
760 align-items: center;
761 }
762
763 .flatpickr-days {
764 width: 225px;
765 }
766
767 .flatpickr-weekdays {
768 display: none;
769 }
770
771 .flatpickr-day {
772 border-radius: 0;
773 font-size: 12px;
774 max-width: 29px;
775 font-weight: 500;
776 color: #5e6977;
777 margin-bottom: 12px;
778 line-height: 5px;
779 height: 20px;
780 display: flex;
781 align-items: center;
782 justify-content: center;
783 }
784
785 .flatpickr-day:nth-last-child(-n + 7) {
786 margin-bottom: 0;
787 }
788
789 .flatpickr-day.today,
790 .flatpickr-day.today.inRange {
791 color: #393939;
792 }
793
794 .flatpickr-day.today.selected {
795 color: #fff;
796 }
797
798 .flatpickr-day.inRange,
799 .flatpickr-day.today.inRange {
800 background: #e1e8ee;
801 box-shadow: none;
802 margin-top: 0;
803 }
804
805 .flatpickr-day.selected,
806 .flatpickr-day.endRange,
807 .flatpickr-day.startRange {
808 background: #3d50df;
809 border-radius: 5px 5px 5px 5px !important;
810 }
811
812 .flatpickr-day.selected,
813 .flatpickr-day.startRange,
814 .flatpickr-day.endRange,
815 .flatpickr-day.selected.inRange,
816 .flatpickr-day.startRange.inRange,
817 .flatpickr-day.endRange.inRange,
818 .flatpickr-day.selected:focus,
819 .flatpickr-day.startRange:focus,
820 .flatpickr-day.endRange:focus,
821 .flatpickr-day.selected:hover,
822 .flatpickr-day.startRange:hover,
823 .flatpickr-day.endRange:hover,
824 .flatpickr-day.selected.prevMonthDay,
825 .flatpickr-day.startRange.prevMonthDay,
826 .flatpickr-day.endRange.prevMonthDay,
827 .flatpickr-day.selected.nextMonthDay,
828 .flatpickr-day.startRange.nextMonthDay,
829 .flatpickr-day.endRange.nextMonthDay {
830 background: #3d50df;
831 border-radius: 5px 5px 5px 5px !important;
832 height: 24px;
833 }
834
835 .flatpickr-months .flatpickr-prev-month,
836 .flatpickr-months .flatpickr-next-month {
837 display: none;
838 }
839
840 .flatpickr-current-month .flatpickr-monthDropdown-months {
841 width: 93px;
842 height: 31px;
843 padding: 6px 10px 7px;
844 border: 1.6px solid #e1e8ee;
845 border-radius: 2px;
846 }
847
848 .flatpickr-monthDropdown-months,
849 .flatpickr-current-month input.cur-year {
850 width: 93px;
851 height: 31px;
852 padding: 6px 10px 7px;
853 border: 1.6px solid #e1e8ee;
854 border-radius: 2px;
855 }
856
857 .flatpickr-current-month .numInputWrapper {
858 width: 93px;
859 }
860
861 .numInputWrapper span {
862 border: none;
863 }
864
865 .numInputWrapper span:hover {
866 background: transparent;
867 }
868
869 .flatpickr-current-month .numInputWrapper span.arrowDown:after,
870 .flatpickr-current-month .numInputWrapper span.arrowUp:after {
871 border-top-color: rgba(134, 147, 158, 1);
872 border-bottom-color: rgba(134, 147, 158, 1);
873 }
874
875 .flatpickr-month {
876 text-align-last: left;
877 margin-bottom: 13px;
878 position: relative;
879 }
880
881 .flatpickr-month:after {
882 content: "";
883 display: block;
884 border: 4px solid transparent;
885 border-top: 4px solid #86939e;
886 position: absolute;
887 right: 60%;
888 top: 43%;
889 }
890
891 .flatpickr-current-month {
892 left: 0;
893 width: 205px;
894 padding: 0;
895 display: flex;
896 align-items: center;
897 justify-content: space-between;
898 }
899
900 .flatpickr-monthDropdown-months,
901 .flatpickr-current-month input.cur-year {
902 -webkit-appearance: none !important;
903 -moz-appearance: none !important;
904 appearance: none !important;
905 color: #5e6977 !important;
906 font-size: 12px !important;
907 }
908
909 .flatpickr-current-month .numInputWrapper {
910 }
911
912 /* 576-768px sm Small */
913 @media screen and (max-width: 768px) {
914 body.lock {
915 overflow: hidden;
916 }
917 .wtotem_version {
918 position: relative;
919 z-index: 3;
920 }
921 .wtotem_header__body {
922 height: 65px;
923 }
924 .wtotem_nav {
925 position: fixed;
926 top: -100%;
927 left: 0;
928 width: 100%;
929 height: 100%;
930 background: #f3f5f6;
931 display: block;
932 padding-top: 65px;
933 transition: all 0.3s ease-in-out;
934 overflow: auto;
935 z-index: 1;
936 }
937 .wtotem_nav .wtotem_control__checkbox {
938 display: none; }
939 .wtotem_nav__menu {
940 display: block;
941 }
942 .wtotem_nav__item {
943 border-bottom: 1px solid #eceff4;
944 }
945 .wtotem_nav__link {
946 height: auto;
947 display: block;
948 color: #1d293f;
949 font-size: 24px;
950 padding: 22px 0;
951 width: 540px;
952 margin: 0 auto;
953 }
954 .wtotem_nav__link_active {
955 color: #3d50df;
956 }
957 .wtotem_nav__link_active:before {
958 display: none;
959 }
960 .wtotem_nav.active {
961 top: 0;
962 }
963 .wtotem_burger {
964 position: relative;
965 width: 23px;
966 height: 18px;
967 display: flex;
968 align-items: center;
969 justify-content: flex-end;
970 cursor: pointer;
971 z-index: 3;
972 }
973 .wtotem_burger:before,
974 .wtotem_burger__middle-line,
975 .wtotem_burger:after {
976 content: "";
977 background: #3d50df;
978 height: 2px;
979 display: block;
980 right: 0;
981 border-radius: 100px;
982 transition: all 0.3s ease-in-out;
983 }
984 .wtotem_burger:before {
985 position: absolute;
986 width: 23px;
987 top: 0;
988 }
989 .wtotem_burger__middle-line {
990 width: 18px;
991 }
992 .wtotem_burger:after {
993 position: absolute;
994 width: 14px;
995 bottom: 0;
996 }
997 .wtotem_burger.active .wtotem_burger__middle-line {
998 transform: scale(0);
999 }
1000 .wtotem_burger.active:before {
1001 transform: rotate(45deg);
1002 top: 8px;
1003 }
1004 .wtotem_burger.active:after {
1005 transform: rotate(-45deg);
1006 width: 100%;
1007 bottom: 8px;
1008 }
1009 }
1010
1011 /* 320-576px Extra small */
1012 @media screen and (max-width: 576px) {
1013 .wtotem_nav__link {
1014 width: 345px;
1015 margin: 0 auto;
1016 }
1017 }
1018
1019 /* 320-375px Extra small */
1020 @media screen and (max-width: 375px) {
1021 .wtotem_nav__link {
1022 padding-left: 10px;
1023 }
1024 }
1025
1026 @media screen and (max-width: 768px) {
1027 .wtotem_theme—dark .wtotem_nav {
1028 background: #191919;
1029 }
1030 .wtotem_theme—dark .wtotem_nav__item {
1031 border-bottom: 1px solid #3c3c3d;
1032 }
1033 }
1034
1035 .wtotem_footer {
1036 padding-top: 18px;
1037 padding-bottom: 20px;
1038 background: #f3f5f6;
1039 }
1040 .wtotem_footer__first {
1041 display: flex;
1042 justify-content: space-between;
1043 align-items: center;
1044 margin-bottom: 21px;
1045 }
1046 .wtotem_footer__caption {
1047 display: flex;
1048 align-items: center;
1049 }
1050 .wtotem_footer__logo {
1051 margin-right: 12px;
1052 background: url("../img/logo-blue.svg") no-repeat center center/cover;
1053 width: 20px;
1054 height: 32px;
1055 }
1056 .wtotem_footer__text {
1057 font-size: 12px;
1058 color: #5e6977;
1059 line-height: 12px;
1060 font-weight: 500;
1061 }
1062 .wtotem_footer__contacts {
1063 width: 200px;
1064 display: flex;
1065 justify-content: space-between;
1066 }
1067 .wtotem_footer__link {
1068 font-weight: 500;
1069 }
1070 .wtotem_footer__line {
1071 height: 1px;
1072 background: #e1e8ee;
1073 margin-bottom: 26px;
1074 }
1075 .wtotem_footer__bottom {
1076 display: flex;
1077 justify-content: space-between;
1078 align-items: center;
1079 }
1080 .wtotem_footer__left {
1081 display: flex;
1082 justify-content: space-between;
1083 align-items: center;
1084 width: 255px;
1085 }
1086 .wtotem_footer__text {
1087 font-size: 12px;
1088 font-weight: 500;
1089 color: #5e6977;
1090 }
1091 .wtotem_footer__store {
1092 margin-bottom: -5px;
1093 }
1094 .wtotem_footer__app-store {
1095 width: 19px;
1096 height: 19px;
1097 background: url("../img/app-store.svg") no-repeat center center/cover;
1098 }
1099 .wtotem_footer__play-store {
1100 width: 17px;
1101 height: 19px;
1102 background: url("../img/play-store.svg") no-repeat center center/cover;
1103 }
1104 .wtotem_footer__soc-link {
1105 margin-right: 20px;
1106 }
1107 .wtotem_footer__soc-link:last-child {
1108 margin-right: 0;
1109 }
1110 .wtotem_footer__payment {
1111 width: 166px;
1112 display: flex;
1113 justify-content: space-between;
1114 align-items: center;
1115 }
1116
1117 /* 576-768px sm Small */
1118 @media screen and (max-width: 768px) {
1119 .wtotem_footer__store,
1120 .wtotem_footer__soc,
1121 .wtotem_footer__payment,
1122 .wtotem_footer__line {
1123 display: none;
1124 }
1125 .wtotem_footer__caption,
1126 .wtotem_footer__left,
1127 .wtotem_footer__text {
1128 margin: 0 auto;
1129 }
1130 .wtotem_footer__caption {
1131 flex-direction: column;
1132 }
1133 .wtotem_footer__logo {
1134 margin-bottom: 18px;
1135 }
1136 }
1137
1138 /* 320-576px Extra small */
1139 .wtotem_content {
1140 padding-top: 37px;
1141 padding-bottom: 20px;
1142 background: #f3f5f6;
1143 }
1144
1145 .wtotem_first {
1146 margin-bottom: 37px;
1147 display: flex;
1148 justify-content: space-between;
1149 }
1150
1151 .wtotem_overall {
1152 padding: 21px 8px 30px 24px;
1153 width: 49%;
1154 }
1155 .wtotem_overall__title .wtotem_title-info__title {
1156 text-transform: none;
1157 font-size: 18px;
1158 }
1159 .wtotem_overall__body {
1160 display: flex;
1161 justify-content: space-between;
1162 align-items: center;
1163 margin-top: 21px;
1164 }
1165 .wtotem_overall__inner {
1166 display: flex;
1167 align-items: center;
1168 }
1169 .wtotem_overall__rectangle {
1170 width: 74px;
1171 height: 50px;
1172 background: #d56c6a;
1173 color: #fff;
1174 font-size: 32px;
1175 font-weight: 700;
1176 display: flex;
1177 align-items: center;
1178 justify-content: center;
1179 margin-right: 10px;
1180 }
1181 .wtotem_overall__figures {
1182 color: #d56c6a;
1183 font-size: 42px;
1184 font-weight: 700;
1185 }
1186 .wtotem_overall__text {
1187 font-size: 16px;
1188 color: #86939e;
1189 width: 267px;
1190 }
1191
1192 .wtotem_info {
1193 display: flex;
1194 width: 49%;
1195 }
1196 .wtotem_info__item {
1197 padding: 23px 29px;
1198 }
1199 .wtotem_info__item:first-child {
1200 border-right: 1px solid #f3f5f6;
1201 }
1202 .wtotem_info__block {
1203 margin-bottom: 10px;
1204 }
1205 .wtotem_info__subtitle {
1206 font-size: 14px;
1207 color: #86939e;
1208 margin-bottom: 3px;
1209 }
1210 .wtotem_info__info {
1211 font-size: 14px;
1212 color: #5e6977;
1213 }
1214 .wtotem_info__scoring {
1215 height: 51px;
1216 display: flex;
1217 align-items: center;
1218 justify-content: center;
1219 }
1220
1221 /* 992-1100px lg Large */
1222 @media screen and (max-width: 1100px) {
1223 .wtotem_overall {
1224 width: 49%;
1225 }
1226 .wtotem_overall__body {
1227 flex-direction: column;
1228 align-items: flex-start;
1229 }
1230 .wtotem_overall__inner {
1231 margin-bottom: 15px;
1232 }
1233 .wtotem_overall__text {
1234 width: 100%;
1235 }
1236 .wtotem_info {
1237 width: 49%;
1238 }
1239 }
1240
1241 /* 768-992px md Medium */
1242 @media screen and (max-width: 992px) {
1243 .wtotem_info {
1244 align-items: center;
1245 }
1246 .wtotem_info__item {
1247 padding: 13px 20px;
1248 }
1249 }
1250
1251 /* 576-768px sm Small */
1252 @media screen and (max-width: 768px) {
1253 .wtotem_first {
1254 flex-direction: column;
1255 margin-bottom: 20px;
1256 }
1257 .wtotem_overall {
1258 width: 100%;
1259 margin-bottom: 10px;
1260 }
1261 .wtotem_info {
1262 width: 100%;
1263 }
1264 .wtotem_info__item {
1265 width: 100%;
1266 }
1267 .wtotem_info__scoring {
1268 justify-content: flex-start;
1269 }
1270 }
1271
1272 /* 320-576px Extra small */
1273 @media screen and (max-width: 576px) {
1274 .wtotem_overall {
1275 padding-left: 22px;
1276 padding-right: 22px;
1277 }
1278 .wtotem_info {
1279 width: 100%;
1280 flex-direction: column;
1281 padding: 13px 22px 13px 22px;
1282 }
1283 .wtotem_info__item {
1284 width: 100%;
1285 padding: 0;
1286 }
1287 .wtotem_info__item:first-child {
1288 border-right: none;
1289 }
1290 .wtotem_info__block {
1291 margin-bottom: 20px;
1292 }
1293 .wtotem_info__scoring {
1294 justify-content: flex-start;
1295 height: auto;
1296 }
1297 }
1298
1299 .wtotem_firewall {
1300 margin-bottom: 20px;
1301 }
1302 .wtotem_firewall__first {
1303 display: flex;
1304 justify-content: space-between;
1305 }
1306 .wtotem_firewall__stats {
1307 display: flex;
1308 align-items: center;
1309 }
1310 .wtotem_firewall__icon {
1311 display: block;
1312 width: 14px;
1313 height: 14px;
1314 margin-right: 10px;
1315 background: url("../img/shape.svg") no-repeat center center/cover;
1316 }
1317 .wtotem_firewall__text {
1318 color: #86939e;
1319 }
1320 .wtotem_firewall__block {
1321 display: flex;
1322 justify-content: space-between;
1323 }
1324
1325 .wtotem_numbers {
1326 width: 49%;
1327 display: flex;
1328 justify-content: space-between;
1329 align-items: center;
1330 }
1331 .wtotem_numbers__item {
1332 text-align: center;
1333 width: 33.3333333333%;
1334 height: 100%;
1335 display: flex;
1336 flex-direction: column;
1337 justify-content: center;
1338 border-right: 1px solid #f3f5f6;
1339 }
1340 .wtotem_numbers__item:last-child {
1341 border-right: none;
1342 }
1343 .wtotem_numbers__title {
1344 line-height: 18px;
1345 color: #86939e;
1346 margin-bottom: 15px;
1347 }
1348 .wtotem_numbers__figures {
1349 color: #1d293f;
1350 font-size: 32px;
1351 font-weight: 700;
1352 }
1353
1354 .wtotem_from {
1355 width: 49%;
1356 display: flex;
1357 align-items: center;
1358 padding: 17px 23px;
1359 }
1360 .wtotem_from__arrow-right {
1361 margin-left: auto;
1362 border: solid #5e6977;
1363 border-width: 0 1.5px 1.5px 0;
1364 display: inline-block;
1365 padding: 6px;
1366 transform: rotate(-45deg);
1367 -webkit-transform: rotate(-45deg);
1368 }
1369 .wtotem_from__svg-wrap {
1370 position: relative;
1371 display: flex;
1372 align-items: center;
1373 }
1374 .wtotem_from__svg-wrap:after {
1375 content: "";
1376 position: absolute;
1377 top: 0;
1378 left: 0;
1379 z-index: 2;
1380 width: 69.5px;
1381 height: 69.5px;
1382 border-radius: 100%;
1383 border: 13.3px solid #f3f5f6;
1384 margin-top: 1px;
1385 }
1386 .wtotem_from__progress {
1387 position: relative;
1388 z-index: 3;
1389 width: 71px;
1390 height: 71px;
1391 }
1392 .wtotem_from__circle {
1393 stroke-width: 15px;
1394 stroke: #3d50df;
1395 fill: transparent;
1396 transform-origin: center;
1397 transform: rotate(-90deg);
1398 transition: stroke-dashoffset 0.3s;
1399 stroke-dashoffset: 0;
1400 }
1401 .wtotem_from__percent {
1402 position: absolute;
1403 display: block;
1404 width: 33px;
1405 top: 33%;
1406 left: 29%;
1407 font-weight: 700;
1408 font-size: 12px;
1409 text-align: center;
1410 }
1411 .wtotem_from__info {
1412 margin-left: 18px;
1413 }
1414 .wtotem_from__title {
1415 color: #86939e;
1416 margin-bottom: 9px;
1417 }
1418 .wtotem_from__country {
1419 font-size: 18px;
1420 color: #1d293f;
1421 line-height: 18px;
1422 }
1423 .wtotem_from__country span {
1424 color: #3d50df;
1425 }
1426
1427 /* 992-1100px lg Large */
1428 @media screen and (max-width: 1100px) {
1429 .wtotem_numbers,
1430 .wtotem_from {
1431 width: 49%;
1432 }
1433 }
1434
1435 /* 768-992px md Medium */
1436 /* 576-768px sm Small */
1437 @media screen and (max-width: 768px) {
1438 .wtotem_firewall__block {
1439 flex-direction: column;
1440 }
1441 .wtotem_numbers,
1442 .wtotem_from {
1443 width: 100%;
1444 }
1445 .wtotem_numbers {
1446 height: 104px;
1447 margin-bottom: 10px;
1448 }
1449 .wtotem_from__country {
1450 font-size: 14px;
1451 }
1452 }
1453
1454 /* 320-576px Extra small */
1455 @media screen and (max-width: 576px) {
1456 .wtotem_numbers {
1457 display: flex;
1458 flex-wrap: wrap;
1459 width: 345px;
1460 height: 217px;
1461 }
1462 .wtotem_numbers__item {
1463 width: 172.5px;
1464 height: 108.5px;
1465 }
1466 .wtotem_numbers__item:last-child {
1467 border-right: 1px solid #f3f5f6;
1468 }
1469 }
1470
1471 /* 320-375px Extra small */
1472 @media screen and (max-width: 374px) {
1473 .wtotem_numbers {
1474 width: 300px;
1475 }
1476 .wtotem_numbers__item {
1477 width: 150px;
1478 }
1479 }
1480
1481 .wtotem_chart {
1482 background: #fff;
1483 padding: 13px 0 19px 0;
1484 }
1485
1486 .wtotem_chart-first {
1487 display: flex;
1488 justify-content: space-between;
1489 align-items: center;
1490 padding: 0 26px;
1491 }
1492 .wtotem_chart-first__left {
1493 display: flex;
1494 align-items: center;
1495 }
1496 .wtotem_chart-first__all {
1497 color: #3d50df;
1498 margin-right: 10px;
1499 }
1500 .wtotem_chart-first__hack {
1501 margin-right: 15px;
1502 display: flex;
1503 align-items: center;
1504 }
1505 .wtotem_chart-first__hack p {
1506 color: #86939e;
1507 }
1508 .wtotem_chart-first__hack span {
1509 display: block;
1510 width: 7px;
1511 height: 7px;
1512 border-radius: 100px;
1513 margin-right: 7px;
1514 }
1515 .wtotem_chart-first__hack_attack span {
1516 background: #d56c6a;
1517 }
1518 .wtotem_chart-first__hack_blocked span {
1519 background: #bace3d;
1520 }
1521 .wtotem_chart-first__right {
1522 display: flex;
1523 background: #f3f5f6;
1524 /*width: 202px;*/
1525 height: 45px;
1526 align-items: center;
1527 justify-content: space-between;
1528 padding: 0 6px;
1529 border-radius: 5px;
1530 }
1531 .wtotem_chart-first__btn {
1532 display: flex;
1533 justify-content: center;
1534 align-items: center;
1535 width: 65px;
1536 height: 31px;
1537 border-radius: 4px;
1538 color: #5e6977;
1539 cursor: pointer;
1540 }
1541 .wtotem_chart-first__btn_active {
1542 background: #fff;
1543 color: #3d50df;
1544 }
1545
1546 .wtotem_chart {
1547 margin-bottom: 30px;
1548 }
1549 .wtotem_chart__diagram {
1550 height: 251px;
1551 }
1552 .wtotem_chart__line {
1553 width: 100%;
1554 height: 1px;
1555 background: #f3f5f6;
1556 margin-bottom: 16px;
1557 }
1558 .wtotem_chart__last {
1559 display: flex;
1560 justify-content: space-between;
1561 align-items: center;
1562 padding: 0 26px;
1563 }
1564 .wtotem_chart__text {
1565 font-weight: 500;
1566 }
1567 .wtotem_chart__text a {
1568 color: #3d50df;
1569 }
1570 .wtotem_chart__btn {
1571 background: none;
1572 border: 1px solid #3d50df;
1573 border-radius: 4px;
1574 display: block;
1575 width: 136px;
1576 display: flex;
1577 align-items: center;
1578 justify-content: center;
1579 padding: 7px 5px;
1580 color: #3d50df;
1581 cursor: pointer;
1582 }
1583
1584 .wtotem_data {
1585 padding: 0 26px;
1586 }
1587 .wtotem_data__thead {
1588 margin-bottom: 15px;
1589 }
1590 .wtotem_data__tr {
1591 display: flex;
1592 justify-content: space-between;
1593 }
1594 .wtotem_data__th {
1595 color: #5e6977;
1596 font-weight: 500;
1597 font-size: 12px;
1598 }
1599 .wtotem_data__th:last-child {
1600 text-align: right;
1601 }
1602 .wtotem_data__td {
1603 font-size: 12px;
1604 font-weight: 500;
1605 color: #86939e;
1606 margin-bottom: 20px;
1607 }
1608 .wtotem_data__td_blocked:before {
1609 content: "";
1610 width: 4px;
1611 height: 4px;
1612 border-radius: 100px;
1613 background: #bace3d;
1614 display: block;
1615 }
1616 .wtotem_data__td_banned:before {
1617 content: "";
1618 width: 4px;
1619 height: 4px;
1620 border-radius: 100px;
1621 background: #d56c6a;
1622 display: block;
1623 }
1624 .wtotem_data__td:first-child {
1625 display: flex;
1626 align-items: center;
1627 }
1628 .wtotem_data__td:nth-child(2) {
1629 display: flex;
1630 align-items: center;
1631 }
1632 .wtotem_data__td:last-child {
1633 text-align: right;
1634 color: #d56c6a;
1635 }
1636 .wtotem_data__ip {
1637 margin-left: 10px;
1638 }
1639 .wtotem_data__img {
1640 width: 23px;
1641 height: 13px;
1642 margin-right: 6px;
1643 }
1644 .wtotem_data__flag {
1645 display: block;
1646 width: 100%;
1647 }
1648 .wtotem_data_width_1 {
1649 width: 13%;
1650 }
1651 .wtotem_data_width_2 {
1652 width: 10%;
1653 }
1654 .wtotem_data_width_3 {
1655 width: 14%;
1656 }
1657 .wtotem_data_width_4 {
1658 width: 24%;
1659 }
1660 .wtotem_data_width_5 {
1661 width: 29%;
1662 }
1663 .wtotem_data_width_6 {
1664 width: 11%;
1665 }
1666
1667 /* 768-992px md Medium */
1668 @media screen and (max-width: 992px) {
1669 .wtotem_data__th:nth-last-child(-n + 3),
1670 .wtotem_data__td:nth-last-child(-n + 3) {
1671 display: none;
1672 }
1673 .wtotem_data__th,
1674 .wtotem_data__td {
1675 width: 32%;
1676 }
1677 .wtotem_data__th:nth-child(3),
1678 .wtotem_data__td:nth-child(3) {
1679 width: 36%;
1680 }
1681 }
1682
1683 /* 576-768px sm Small */
1684 /* 320-576px Extra small */
1685 @media screen and (max-width: 576px) {
1686 .wtotem_data {
1687 padding: 0 16px;
1688 }
1689 .wtotem_chart-first {
1690 flex-direction: column;
1691 align-items: flex-start;
1692 }
1693 .wtotem_chart-first__left {
1694 margin-bottom: 20px;
1695 }
1696 .wtotem_chart-first__right {
1697 width: 100%;
1698 }
1699 }
1700
1701 /* 320-375px Extra small */
1702 @media screen and (max-width: 375px) {
1703 .wtotem_data__th,
1704 .wtotem_data__td {
1705 width: 33% !important;
1706 }
1707 .wtotem_data__ip {
1708 margin-left: 5px;
1709 }
1710 }
1711
1712 .wtotem_antivirus {
1713 margin-bottom: 30px;
1714 }
1715 .wtotem_antivirus__first {
1716 display: flex;
1717 justify-content: space-between;
1718 align-items: center;
1719 }
1720 .wtotem_antivirus__block {
1721 display: flex;
1722 justify-content: space-between;
1723 align-items: center;
1724 width: 100%;
1725 background: #fff;
1726 border-radius: 4px;
1727 }
1728 .wtotem_antivirus__item {
1729 width: 25%;
1730 height: 100.5px;
1731 text-align: center;
1732 display: flex;
1733 align-items: center;
1734 justify-content: center;
1735 flex-direction: column;
1736 border-right: 1px solid #f3f5f6;
1737 }
1738 .wtotem_antivirus__item:last-child {
1739 border-right: none;
1740 }
1741 .wtotem_antivirus__figures {
1742 font-size: 32px;
1743 font-weight: 700;
1744 margin-bottom: 18px;
1745 }
1746 .wtotem_antivirus__figures_green {
1747 color: #bace3d;
1748 }
1749 .wtotem_antivirus__figures_yellow {
1750 color: #e9cf73;
1751 }
1752 .wtotem_antivirus__figures_orange {
1753 color: #d56c6a;
1754 }
1755 .wtotem_antivirus__figures_black {
1756 color: #1d293f;
1757 }
1758 .wtotem_antivirus__title {
1759 color: #86939e;
1760 line-height: 18px;
1761 }
1762
1763 /* 320-576px Extra small */
1764 @media screen and (max-width: 576px) {
1765 .wtotem_antivirus__block {
1766 flex-wrap: wrap;
1767 }
1768 .wtotem_antivirus__item {
1769 width: 172.5px;
1770 border-bottom: 1px solid #f3f5f6;
1771 }
1772 .wtotem_antivirus__item:last-child {
1773 border-right: none;
1774 border-bottom: none;
1775 }
1776 .wtotem_antivirus__item:nth-child(2) {
1777 border-right: none;
1778 }
1779 .wtotem_antivirus__item:nth-child(3) {
1780 border-bottom: none;
1781 }
1782 }
1783
1784 /* 320-375px */
1785 @media screen and (max-width: 375px) {
1786 .wtotem_antivirus__item {
1787 width: 150px;
1788 }
1789 }
1790
1791 .wtotem_monitoring {
1792 margin-bottom: 30px;
1793 }
1794
1795 .wtotem_table__row {
1796 display: flex;
1797 width: 100%;
1798 }
1799
1800 .wtotem_table__col {
1801 width: 33.3333333333%;
1802 border-right: 1px solid #f3f5f6;
1803 border-bottom: 1px solid #f3f5f6;
1804 }
1805 .wtotem_table__col:last-child {
1806 border-right: none;
1807 }
1808
1809 .wtotem_table__th,
1810 .wtotem_table__td,
1811 .wtotem_table__info {
1812 padding: 15px 15px;
1813 }
1814
1815 .wtotem_table__th,
1816 .wtotem_table__td {
1817 border-bottom: 1px solid #f3f5f6;
1818 }
1819
1820 .wtotem_table__td {
1821 display: flex;
1822 justify-content: space-between;
1823 align-items: center;
1824 height: 64px;
1825 }
1826
1827 .wtotem_table__item {
1828 height: 110px;
1829 display: flex;
1830 align-items: center;
1831 justify-content: center;
1832 }
1833
1834 .wtotem_table__expired {
1835 color: #d56c6a;
1836 }
1837
1838 .wtotem_table__solve {
1839 color: #3d50df;
1840 }
1841
1842 .wtotem_table__info {
1843 height: 55px;
1844 display: flex;
1845 justify-content: space-between;
1846 }
1847
1848 .wtotem_table__subject {
1849 font-size: 14px;
1850 text-transform: uppercase;
1851 }
1852
1853 .wtotem_table__status {
1854 text-transform: uppercase;
1855 }
1856 .wtotem_table__status_green {
1857 color: #4bc374;
1858 }
1859 .wtotem_table__status_yellow {
1860 color: #dcb320;
1861 text-transform: none;
1862 }
1863
1864 .wtotem_table__text {
1865 color: #86939e;
1866 font-weight: 500;
1867 }
1868
1869 .wtotem_table__perfomance {
1870 font-weight: 500;
1871 color: #5e6977;
1872 }
1873 .wtotem_table__perfomance span {
1874 color: #3d50df;
1875 }
1876
1877 .wtotem_table__wrap {
1878 width: 30px;
1879 height: 30px;
1880 }
1881 .wtotem_table__wrap_big {
1882 width: 56px;
1883 height: 56px;
1884 }
1885
1886 .wtotem_table__img {
1887 width: 100%;
1888 display: block;
1889 }
1890
1891 .wtotem_table__link {
1892 display: flex;
1893 justify-content: space-between;
1894 align-items: center;
1895 padding: 13px 16px;
1896 }
1897 .wtotem_table__link:after {
1898 content: "";
1899 border: solid #5e6977;
1900 border-width: 0 1.5px 1.5px 0;
1901 display: inline-block;
1902 padding: 4px;
1903 transform: rotate(-45deg);
1904 -webkit-transform: rotate(-45deg);
1905 }
1906
1907 .wtotem_table__right_progress-wrap {
1908 width: 167px;
1909 margin-top: -21px;
1910 }
1911
1912 .wtotem_table__stick-progress {
1913 position: relative;
1914 background: #3d50df;
1915 width: 96px;
1916 height: 7px;
1917 border-radius: 100px;
1918 }
1919 .wtotem_table__stick-progress:after {
1920 content: "";
1921 position: absolute;
1922 top: 0;
1923 left: 0;
1924 width: 167px;
1925 height: 7px;
1926 opacity: 0.1;
1927 border-radius: 100px;
1928 background: #5e6977;
1929 }
1930
1931 .wtotem_table__initial-value {
1932 font-size: 10px;
1933 font-weight: 500;
1934 color: #5e6977;
1935 }
1936
1937 .wtotem_table__message {
1938 position: absolute;
1939 top: -20px;
1940 right: -12px;
1941 z-index: 50;
1942 width: 30px;
1943 height: 15px;
1944 border-radius: 2px;
1945 background: #3d50df;
1946 font-size: 10px;
1947 font-weight: 500;
1948 text-align: center;
1949 color: #fff;
1950 display: flex;
1951 justify-content: center;
1952 align-items: center;
1953 }
1954
1955 .wtotem_table__triangle {
1956 position: absolute;
1957 z-index: -1;
1958 top: 55%;
1959 left: 40%;
1960 width: 8.5px;
1961 height: 8.5px;
1962 display: block;
1963 border-radius: 1px;
1964 transform: rotate(45deg);
1965 background: #3d50df;
1966 margin: 0 auto;
1967 }
1968
1969 /* 992-1100px lg Large */
1970 /* 768-992px md Medium */
1971 @media screen and (max-width: 992px) {
1972 .wtotem_table__row {
1973 flex-direction: column;
1974 }
1975 .wtotem_table__col {
1976 width: 100%;
1977 border-right: none !important;
1978 }
1979 }
1980
1981 /* 576-768px sm Small */
1982 /* 320-576px Extra small */
1983 /* 320-375px Extra small */
1984 @media screen and (max-width: 375px) {
1985 .wtotem_table__perfomance_long {
1986 width: 210px;
1987 }
1988 .wtotem_chart-first {
1989 padding: 0 16px;
1990 }
1991 }
1992
1993 .wtotem_map__first {
1994 display: flex;
1995 justify-content: space-between;
1996 }
1997
1998 .wtotem_map .wtotem_map-block {
1999 display: flex;
2000 align-items: center;
2001 justify-content: space-around;
2002 padding-right: 26px; }
2003
2004 .wtotem_map .wtotem_map-block #firewall {
2005 display: block; }
2006
2007 .wtotem_map .wtotem_map-block__map {
2008 width: 50%;
2009 height: 330px; }
2010
2011 .wtotem_map .firewall {
2012 width: 50%;
2013 position: relative;
2014 height: 230px; }
2015
2016 .wtotem_map-wrap {
2017 padding-top: 15px;
2018 margin-bottom: 30px; }
2019
2020 .wtotem_country {
2021 margin-bottom: -15px; }
2022 .wtotem_country__title {
2023 font-size: 14px;
2024 line-height: 18px;
2025 color: #86939e;
2026 margin-bottom: 9px; }
2027 .wtotem_country__desc {
2028 font-size: 18px;
2029 line-height: 18px;
2030 color: #1d293f; }
2031
2032 /* 992-1100px lg Large */
2033 /* 768-992px md Medium */
2034 @media screen and (max-width: 992px) {
2035 .wtotem_map .wtotem_map-wrap {
2036 padding-bottom: 20px; }
2037 .wtotem_map .wtotem_map-block {
2038 flex-direction: column;
2039 padding-right: 0; }
2040 .wtotem_map .wtotem_map-block__map {
2041 width: 100%;
2042 text-align: center; }
2043 .wtotem_map .wtotem_map-block__map svg {
2044 width: 403px; }
2045 .wtotem_map #firewall {
2046 display: block;
2047 height: 135px;
2048 width: 270px; }
2049 .wtotem_map .firewall {
2050 position: relative;
2051 margin: auto;
2052 height: 70vh;
2053 width: 60vw; } }
2054
2055 /* 576-768px sm Small */
2056 /* 375-576px Extra small */
2057 @media screen and (max-width: 576px) {
2058 .wtotem_map .wtotem_map-block__map {
2059 height: auto; }
2060 .wtotem_map #firewallMap {
2061 width: 100%;
2062 zoom: 0.8; }
2063 .wtotem_map .wtotem_country {
2064 margin-bottom: 20px; }
2065 .wtotem_map .wtotem_chart__wrapper {
2066 width: 100%; } }
2067
2068 @media screen and (max-width: 500px) {
2069 .wtotem_map .firewall {
2070 width: 70vw; } }
2071
2072 @media screen and (max-width: 420px) {
2073 .wtotem_map .firewall {
2074 width: 75vw; } }
2075
2076 @media screen and (max-width: 390px) {
2077 .wtotem_map .firewall {
2078 width: 80vw; } }
2079
2080 @media screen and (max-width: 375px) {
2081 .wtotem_map #firewallMap {
2082 width: 100%;
2083 zoom: 0.7;
2084 display: block;
2085 transform: translateX(25px); } }
2086
2087 @media screen and (max-width: 340px) {
2088 .wtotem_map #firewallMap {
2089 width: 100%;
2090 zoom: 0.7;
2091 display: block;
2092 transform: translateX(15px); } }
2093
2094 @media screen and (max-width: 340px) {
2095 .wtotem_map #firewallMap {
2096 width: 100%;
2097 zoom: 0.7;
2098 display: block;
2099 transform: translateX(5px); } }
2100
2101 /* 320-375px Extra small */
2102
2103 .wtotem_state {
2104 border-radius: 4px;
2105 }
2106
2107 .wtotem_state {
2108 background: #fff;
2109 padding: 13px 0 26px 0;
2110 }
2111 .wtotem_state__select-wrapper {
2112 position: relative;
2113 margin-bottom: 15px;
2114 width: 190px;
2115 cursor: pointer;
2116 }
2117 .wtotem_state__select-wrapper:after {
2118 content: "";
2119 position: absolute;
2120 top: 45%;
2121 right: 0;
2122 border-style: solid;
2123 border-width: 5px 5px 0 5px;
2124 border-color: #86939e transparent transparent transparent;
2125 border-radius: 50px;
2126 }
2127 .wtotem_state__select {
2128 display: block;
2129 margin-left: 18px;
2130 width: 100%;
2131 padding: 8px 12px 8px 12px;
2132 color: #86939e;
2133 font-size: 14px;
2134 font-weight: 400;
2135 -webkit-appearance: none;
2136 appearance: none;
2137 background-color: #f3f5f6;
2138 background-image: none;
2139 border-radius: 4px;
2140 border: none;
2141 font-family: inherit;
2142 cursor: pointer;
2143 }
2144 .wtotem_state__option {
2145 border: none;
2146 }
2147 .wtotem_state__line {
2148 background: #f3f5f6;
2149 height: 1px;
2150 margin-bottom: 20px;
2151 }
2152 .wtotem_state__last {
2153 display: flex;
2154 align-items: center;
2155 justify-content: space-between;
2156 padding: 0 18px;
2157 }
2158 .wtotem_state__text {
2159 color: #5e6977;
2160 font-weight: 500;
2161 }
2162 .wtotem_state__text a {
2163 color: #3d50df;
2164 }
2165
2166 .wtotem_file-table {
2167 color: #86939e;
2168 }
2169 .wtotem_file-table__tr {
2170 display: flex;
2171 margin-bottom: 15px;
2172 padding: 0 18px;
2173 }
2174 .wtotem_file-table__th {
2175 color: #5e6977;
2176 width: 12.5%;
2177 font-weight: 500;
2178 font-size: 12px;
2179 }
2180 .wtotem_file-table__th:first-child {
2181 width: 50%;
2182 }
2183 .wtotem_file-table__td {
2184 font-size: 12px;
2185 width: 12.5%;
2186 font-weight: 500;
2187 }
2188 .wtotem_file-table__td:first-child {
2189 width: 50%;
2190 }
2191 .wtotem_file-table__td_normal {
2192 color: #5e6977;
2193 }
2194 .wtotem_file-table__td_critical {
2195 color: #d56c6a;
2196 }
2197 .wtotem_file-table__td_changed {
2198 color: #caae4b;
2199 }
2200
2201 .wtotem_pagination {
2202 display: flex;
2203 }
2204 .wtotem_pagination__number {
2205 color: #99a6b1;
2206 font-weight: 500;
2207 margin-right: 30px;
2208 display: flex;
2209 align-items: center;
2210 }
2211 .wtotem_pagination__number:hover {
2212 color: #5e6977;
2213 }
2214 .wtotem_pagination__number_active {
2215 width: 46px;
2216 height: 46px;
2217 background: #f1f3f5;
2218 color: #5e6977;
2219 margin-right: 13px;
2220 border-radius: 100px;
2221 display: flex;
2222 justify-content: center;
2223 align-items: center;
2224 }
2225 .wtotem_pagination__number_etc {
2226 margin-right: 22px;
2227 }
2228 .wtotem_pagination__arrow {
2229 width: 19px;
2230 height: 12px;
2231 display: block;
2232 cursor: pointer;
2233 }
2234
2235 /* 992-1100px lg Large */
2236 /* 768-992px md Medium */
2237 @media screen and (max-width: 992px) {
2238 .wtotem_state {
2239 overflow: hidden;
2240 }
2241 .wtotem_file-table__td,
2242 .wtotem_file-table__th {
2243 display: none;
2244 }
2245 .wtotem_file-table__td:first-child,
2246 .wtotem_file-table__th:first-child {
2247 display: block;
2248 width: 100%;
2249 }
2250 }
2251
2252 /* 576-768px sm Small */
2253 /* 375-576px Extra small */
2254 @media screen and (max-width: 576px) {
2255 .wtotem_state__text {
2256 display: none;
2257 }
2258 .wtotem_pagination {
2259 margin: 0 auto;
2260 }
2261 .wtotem_pagination__number {
2262 margin-right: 18px;
2263 }
2264 .wtotem_pagination__number_active {
2265 margin-right: 13px;
2266 }
2267 }
2268
2269 /* 320-375px Extra small */
2270 .wtotem_welcome-wrapper {
2271 background: #f3f5f6;
2272 }
2273 .wtotem_welcome-wrapper__head-height {
2274 display: flex;
2275 align-items: center;
2276 justify-content: center;
2277 height: calc(100vh - 135px);
2278 min-height: 596px;
2279 }
2280 .wtotem_welcome-wrapper__footer-height {
2281 display: flex;
2282 justify-content: center;
2283 height: 135px;
2284 }
2285
2286 .wtotem_modal {
2287 text-align: center;
2288 }
2289 .wtotem_modal__subject {
2290 font-size: 24px;
2291 line-height: 18px;
2292 margin-bottom: 24px;
2293 }
2294 .wtotem_modal__window {
2295 background: #fff;
2296 padding: 23px 0 35px 0;
2297 width: 360px;
2298 margin: 0 auto;
2299 margin-bottom: 24px;
2300 }
2301 .wtotem_modal__title {
2302 font-size: 18px;
2303 margin-bottom: 5px;
2304 }
2305 .wtotem_modal__text {
2306 font-size: 10px;
2307 margin-bottom: 8px;
2308 }
2309 .wtotem_modal__block {
2310 margin-bottom: 50px;
2311 }
2312 .wtotem_modal__block:after {
2313 content: "";
2314 display: block;
2315 height: 1px;
2316 width: 100%;
2317 background: #e1e8ee;
2318 margin-top: -40px;
2319 }
2320 .wtotem_modal__logo {
2321 margin: 0 auto;
2322 }
2323 .wtotem_modal__wrap {
2324 width: 300px;
2325 display: flex;
2326 align-items: center;
2327 margin: 0 auto;
2328 margin-bottom: 18px;
2329 }
2330 .wtotem_modal__api-key {
2331 width: 100%;
2332 padding: 13px 30px 13px 15px;
2333 border: 2px solid #e1e8ee;
2334 border-radius: 2px;
2335 }
2336 .wtotem_modal__api-key[type="text"]::-webkit-input-placeholder {
2337 font-weight: 500;
2338 font-size: 14px;
2339 line-height: 14px;
2340 color: #5e6977;
2341 }
2342 .wtotem_modal__api-key[type="text"]:-ms-input-placeholder {
2343 font-weight: 500;
2344 font-size: 14px;
2345 line-height: 14px;
2346 color: #5e6977;
2347 }
2348 .wtotem_modal__api-key[type="text"]::-ms-input-placeholder {
2349 font-weight: 500;
2350 font-size: 14px;
2351 line-height: 14px;
2352 color: #5e6977;
2353 }
2354 .wtotem_modal__api-key[type="text"]::placeholder {
2355 font-weight: 500;
2356 font-size: 14px;
2357 line-height: 14px;
2358 color: #5e6977;
2359 }
2360 .wtotem_modal__info {
2361 margin-left: -30px;
2362 }
2363 .wtotem_modal__btn {
2364 background: #4bc374;
2365 font-weight: 700;
2366 font-size: 14px;
2367 line-height: 16px;
2368 text-transform: uppercase;
2369 width: 300px;
2370 padding: 16px 0;
2371 border: none;
2372 color: #fff;
2373 }
2374 .wtotem_modal__desc {
2375 font-size: 12px;
2376 font-weight: 500;
2377 line-height: 16px;
2378 max-width: 274px;
2379 margin: 0 auto;
2380 color: #5e6977;
2381 }
2382 .wtotem_modal__cabinet {
2383 color: #3d50df;
2384 }
2385
2386 .wtotem_welcome-bottom {
2387 text-align: center;
2388 }
2389 .wtotem_welcome-bottom__logo {
2390 margin-bottom: 26px;
2391 }
2392 .wtotem_welcome-bottom__label {
2393 margin-bottom: 20px;
2394 }
2395 .wtotem_welcome-bottom__block {
2396 width: 54px;
2397 display: flex;
2398 justify-content: space-between;
2399 margin: 0 auto;
2400 }
2401
2402 /* 375-576px Extra small */
2403 /* 320-375px Extra small */
2404 @media screen and (max-width: 375px) {
2405 .wtotem_modal__window {
2406 width: 345px;
2407 }
2408 }
2409
2410 /* 320-375px Extra small */
2411 @media screen and (max-width: 355px) {
2412 .wtotem_modal__window {
2413 width: 320px;
2414 }
2415 .wtotem_modal__wrap,
2416 .wtotem_modal__btn {
2417 width: 85%;
2418 }
2419 }
2420
2421 @media screen and (max-width: 330px) {
2422 .wtotem_modal__window {
2423 width: 305px;
2424 }
2425 }
2426
2427 /*# options.css */
2428
2429 .wtotem_item {
2430 margin-bottom: 23px; }
2431
2432 .wtotem_holder {
2433 display: flex;
2434 justify-content: space-between; }
2435 .wtotem_holder__content {
2436 width: 70%; }
2437 .wtotem_holder__sidebar {
2438 width: 27.8431372549%; }
2439
2440 .wtotem_option {
2441 margin-bottom: 12px;
2442 padding: 28px 24px 24px 24px;
2443 display: flex;
2444 align-items: center;
2445 justify-content: space-between;
2446 width: 100%; }
2447 .wtotem_option:last-child {
2448 margin-bottom: 0; }
2449 .wtotem_option__title {
2450 margin-bottom: 7px;
2451 color: #1d293f;
2452 font-size: 14px;
2453 font-weight: 500; }
2454 .wtotem_option__text {
2455 width: 495px;
2456 font-size: 12px;
2457 color: #5e6977;
2458 line-height: 16px; }
2459
2460 .wtotem_control {
2461 padding: 16px 22px 24px 22px; }
2462 .wtotem_control__title {
2463 color: #1d293f;
2464 font-size: 14px;
2465 font-weight: 500;
2466 margin-bottom: 18px; }
2467 .wtotem_control__block {
2468 padding: 12px 8px;
2469 display: flex;
2470 align-items: center;
2471 background: #f3f5f6;
2472 border-radius: 5px;
2473 margin-bottom: 12px;
2474 width: 100%; }
2475 .wtotem_control__block_switch {
2476 justify-content: space-between;
2477 align-items: center; }
2478 .wtotem_control__circle {
2479 margin-right: 4px;
2480 width: 16px;
2481 height: 16px;
2482 border-radius: 100px;
2483 display: flex;
2484 align-items: center;
2485 justify-content: center;
2486 background: #4bc374; }
2487 .wtotem_control__circle img {
2488 width: 7px;
2489 height: 7px; }
2490 .wtotem_control__name {
2491 color: #5e6977; }
2492 .wtotem_control__trash {
2493 width: 15px;
2494 height: 15px;
2495 background: url("../img/trash.svg") no-repeat center center/cover;
2496 margin-left: auto;
2497 cursor: pointer; }
2498 .wtotem_control__btn {
2499 color: #fff;
2500 display: block;
2501 width: 100%;
2502 height: 42px;
2503 display: flex;
2504 align-items: center;
2505 justify-content: center;
2506 background: #4bc374;
2507 border-radius: 5px;
2508 transition: all 0.2s ease-in-out;
2509 border: none;
2510 cursor: pointer; }
2511 .wtotem_control__btn:hover {
2512 transition: all 0.2s ease-in-out;
2513 background: #f3f5f6;
2514 color: #5e6977; }
2515 .wtotem_control__label {
2516 position: relative;
2517 width: 41px;
2518 height: 23px;
2519 border-radius: 100px;
2520 background: #1f2323;
2521 padding: 4px 7px;
2522 display: flex;
2523 justify-content: space-between;
2524 align-items: center;
2525 cursor: pointer; }
2526 .wtotem_control__label:before, .wtotem_control__label:after {
2527 content: "";
2528 display: block;
2529 position: relative;
2530 z-index: 2; }
2531 .wtotem_control__label:before {
2532 width: 8px;
2533 height: 8px;
2534 background: url("../img/checkbox-sun.svg") no-repeat center center/cover; }
2535 .wtotem_control__label:after {
2536 width: 6px;
2537 height: 6px;
2538 background: url("../img/checkbox-moon.svg") no-repeat center center/cover; }
2539 .wtotem_control__switched-circle {
2540 position: absolute;
2541 left: 4px;
2542 width: 15px;
2543 height: 15px;
2544 background: #fff;
2545 border-radius: 100px;
2546 display: block;
2547 z-index: 1;
2548 transition: all 0.3s ease-in-out; }
2549 .wtotem_control__input {
2550 display: none!important; }
2551 .wtotem_control__input:checked + label {
2552 background: #fff; }
2553 .wtotem_control__input:checked + label span {
2554 left: 23px;
2555 background: #3d50df; }
2556
2557 .onoff__input {
2558 display: none!important; }
2559
2560 .onoff__label {
2561 position: relative;
2562 display: flex;
2563 align-items: center;
2564 width: 43px;
2565 height: 23px;
2566 border-radius: 100px;
2567 padding: 4px;
2568 background: #f4f4f4;
2569 overflow: hidden;
2570 cursor: pointer; }
2571 .onoff__label:before, .onoff__label:after {
2572 position: absolute;
2573 font-weight: 500;
2574 font-size: 9px;
2575 transition: all 0.3s ease-in-out; }
2576 .onoff__label:before {
2577 content: "ON";
2578 color: #3d50df;
2579 left: -100%; }
2580 .onoff__label:after {
2581 content: "OFF";
2582 color: #979797;
2583 right: 4px; }
2584
2585 .onoff__circle {
2586 position: absolute;
2587 left: 4px;
2588 width: 15px;
2589 height: 15px;
2590 border-radius: 100px;
2591 background: #c4c4c4;
2592 transition: all 0.3s ease-in-out; }
2593
2594 .onoff__input:checked + label .onoff__circle {
2595 background: #3d50df;
2596 left: 22px; }
2597
2598 .onoff__input:checked + label:before {
2599 left: 4px; }
2600
2601 .onoff__input:checked + label:after {
2602 right: -100%; }
2603
2604 /* 992-1100px lg Large */
2605 @media screen and (max-width: 1100px) {
2606 .wtotem_option__text {
2607 width: 95%; } }
2608
2609 /* 768-992px md Medium */
2610 @media screen and (max-width: 992px) {
2611 .wtotem_holder {
2612 flex-direction: column; }
2613 .wtotem_holder__content {
2614 width: 100%;
2615 margin-bottom: 30px; }
2616 .wtotem_holder__sidebar {
2617 width: 100%; } }
2618
2619 /* 576-768px sm Small */
2620 /* 375-576px Extra small */
2621 @media screen and (max-width: 576px) {
2622 .wtotem_holder__content {
2623 margin-bottom: 20px; } }
2624
2625 /* 320-375px Extra small */
2626
2627 /*# options.css */
2628
2629
2630 .wtotem_offer {
2631 display: flex;
2632 justify-content: space-between;
2633 align-items: center;
2634 padding: 40px 56px 37px 40px;
2635 margin-bottom: 110px;
2636 }
2637 .wtotem_offer__title {
2638 margin-bottom: 22px;
2639 font-size: 24px;
2640 color: #1d293f;
2641 font-weight: 500;
2642 }
2643 .wtotem_offer__text {
2644 width: 601px;
2645 margin-bottom: 22px;
2646 font-size: 16px;
2647 color: #5e6977;
2648 line-height: 24px;
2649 }
2650 .wtotem_offer__btn {
2651 color: #fff;
2652 background: #3d50df;
2653 border-radius: 5px;
2654 width: 151px;
2655 height: 42px;
2656 display: flex;
2657 align-items: center;
2658 justify-content: center;
2659 border: none;
2660 cursor: pointer;
2661 }
2662
2663 /* 992-1100px lg Large */
2664 /* 768-992px md Medium */
2665 @media screen and (max-width: 992px) {
2666 .wtotem_offer__title {
2667 line-height: 32px;
2668 margin-bottom: 20px;
2669 }
2670 .wtotem_offer__text {
2671 width: 100%;
2672 }
2673 }
2674
2675 /* 576-768px sm Small */
2676 @media screen and (max-width: 768px) {
2677 .wtotem_offer {
2678 padding: 20px;
2679 }
2680 .wtotem_offer__img {
2681 display: none;
2682 }
2683 }
2684
2685 /* 375-576px Extra small */
2686 /* 320-375px Extra small */
2687 .wtotem_ready {
2688 background: #e5e5e5;
2689 }
2690
2691 .wtotem_unit__first {
2692 display: flex;
2693 justify-content: space-between;
2694 }
2695
2696 .wtotem_unit__wrapper {
2697 display: flex;
2698 justify-content: space-between;
2699 background: #fff;
2700 }
2701
2702 .wtotem_unit__block {
2703 display: flex;
2704 justify-content: space-between;
2705 align-items: center;
2706 width: 100%;
2707 padding: 30px 30px;
2708 border-right: 1px solid #f3f5f6;
2709 }
2710
2711 .wtotem_unit__contain {
2712 display: flex;
2713 justify-content: space-between;
2714 align-items: center;
2715 }
2716
2717 .wtotem_unit__circle {
2718 margin-right: 16px;
2719 width: 45px;
2720 height: 45px;
2721 border-radius: 100px;
2722 display: flex;
2723 align-items: center;
2724 justify-content: center;
2725 }
2726 /*.wtotem_unit__circle_loading {*/
2727 /*background: #f3f5f6;*/
2728 /*}*/
2729 .wtotem_unit__circle_success {
2730 background: #4bc374;
2731 }
2732 .wtotem_unit__circle_error {
2733 background: #ee3f3f;
2734 position: relative;
2735 }
2736 .wtotem_unit__circle_error:before {
2737 content: "";
2738 position: absolute;
2739 width: 19px;
2740 height: 3px;
2741 background: #fff;
2742 border-radius: 1px;
2743 display: block;
2744 transform: rotate(45deg);
2745 }
2746 .wtotem_unit__circle_error:after {
2747 content: "";
2748 position: absolute;
2749 width: 19px;
2750 height: 3px;
2751 background: #fff;
2752 border-radius: 1px;
2753 display: block;
2754 transform: rotate(-45deg);
2755 }
2756
2757 .wtotem_unit__img_spinner {
2758 animation: 1s linear 0s normal none infinite running rot;
2759 -webkit-animation: 1s linear 0s normal none infinite running rot;
2760 }
2761
2762 @keyframes rot {
2763 0% {
2764 transform: rotate(0deg);
2765 }
2766 100% {
2767 transform: rotate(360deg);
2768 }
2769 }
2770
2771 @-webkit-keyframes rot {
2772 0% {
2773 transform: rotate(0deg);
2774 }
2775 100% {
2776 transform: rotate(360deg);
2777 }
2778 }
2779
2780 .wtotem_unit__expectation {
2781 font-size: 16px;
2782 font-weight: 500;
2783 }
2784 .wtotem_unit__expectation_loading {
2785 color: #7c8087;
2786 }
2787 .wtotem_unit__expectation_success {
2788 color: #bace3d;
2789 }
2790 .wtotem_unit__expectation_error {
2791 color: #d56c6a;
2792 }
2793
2794 .wtotem_unit__repeat {
2795 color: #3d50df;
2796 cursor: pointer;
2797 }
2798
2799 .wtotem_layout {
2800 background: #e5e5e5;
2801 }
2802
2803 .wtotem_alert {
2804 padding: 17px 22px;
2805 display: flex;
2806 justify-content: space-between;
2807 align-items: center;
2808 background: #fff;
2809 border-radius: 4px;
2810 margin-bottom: 30px;
2811 }
2812 .wtotem_alert__desc {
2813 display: flex;
2814 align-items: center;
2815 }
2816 .wtotem_alert__img {
2817 margin-right: 5px;
2818 display: flex;
2819 align-items: center;
2820 justify-content: center;
2821 }
2822 .wtotem_alert__img_cross {
2823 width: 16px;
2824 height: 16px;
2825 border-radius: 100px;
2826 display: flex;
2827 align-items: center;
2828 justify-content: center;
2829 background: #ee3f3f;
2830 }
2831 .wtotem_alert__img_cross:before {
2832 content: "";
2833 position: absolute;
2834 display: block;
2835 width: 8px;
2836 height: 1.3px;
2837 border-radius: 1px;
2838 transform: rotate(45deg);
2839 background: #fff;
2840 }
2841 .wtotem_alert__img_cross:after {
2842 content: "";
2843 position: absolute;
2844 display: block;
2845 width: 8px;
2846 height: 1.3px;
2847 border-radius: 1px;
2848 transform: rotate(-45deg);
2849 background: #fff;
2850 }
2851 .wtotem_alert__title {
2852 font-size: 12px;
2853 text-transform: uppercase;
2854 }
2855 .wtotem_alert__title_yellow {
2856 color: #f5c451;
2857 }
2858 .wtotem_alert__title_green {
2859 color: #4bc374;
2860 }
2861 .wtotem_alert__title_red {
2862 color: #ee3f3f;
2863 }
2864 .wtotem_alert__text {
2865 color: #1d293f;
2866 font-size: 12px;
2867 }
2868 .wtotem_alert__close {
2869 position: relative;
2870 width: 10px;
2871 height: 10px;
2872 display: flex;
2873 justify-self: center;
2874 align-items: center;
2875 cursor: pointer;
2876 }
2877 .wtotem_alert__close:before {
2878 content: "";
2879 position: absolute;
2880 display: block;
2881 width: 10px;
2882 height: 2px;
2883 border-radius: 1px;
2884 transform: rotate(45deg);
2885 background: #000;
2886 }
2887 .wtotem_alert__close:after {
2888 content: "";
2889 position: absolute;
2890 display: block;
2891 width: 10px;
2892 height: 2px;
2893 border-radius: 1px;
2894 transform: rotate(-45deg);
2895 background: #000;
2896 }
2897
2898 /* 576-768px sm Small */
2899 @media screen and (max-width: 768px) {
2900 .wtotem_alert {
2901 margin-bottom: 20px;
2902 }
2903 }
2904
2905 /* 320-576px Extra small */
2906 .line-chart .axis line {
2907 stroke: #f0f0f0;
2908 }
2909
2910 .line-chart .axis path {
2911 stroke: #f0f0f0;
2912 }
2913
2914 .line-chart .axis text {
2915 fill: #5e6977;
2916 }
2917
2918 .line-chart .grid line {
2919 stroke: #f0f0f0;
2920 }
2921
2922 .line-chart .listening-rect {
2923 fill: transparent;
2924 }
2925
2926 .line-chart__tooltip {
2927 opacity: 0;
2928 position: absolute;
2929 top: -25px;
2930 left: -17px;
2931 padding: 0.2em 0.5em;
2932 background: #1d293f;
2933 text-align: center;
2934 line-height: 1.4em;
2935 font-size: 0.9em;
2936 z-index: 10;
2937 transition: all 0.1s ease-out;
2938 pointer-events: none;
2939 color: #fff;
2940 font-family: Inter, Gilroy, Helvetica, sans-serif;
2941 border-radius: 2px;
2942 min-width: 28px;
2943 }
2944
2945 .line-chart__tooltip:before {
2946 content: "";
2947 position: absolute;
2948 bottom: 0;
2949 left: 50%;
2950 width: 12px;
2951 height: 12px;
2952 background: #1d293f;
2953 border-top-color: transparent;
2954 border-left-color: transparent;
2955 transform: translate(-50%, 50%) rotate(45deg);
2956 transform-origin: center center;
2957 z-index: 10;
2958 }
2959
2960 .line-chart {
2961 position: relative;
2962 }
2963
2964
2965 .wtotem_theme—dark .wtotem_body{
2966 background: #191919;
2967 }
2968 .wtotem_theme—dark .wt_card,
2969 .wtotem_theme—dark .wt_card:before,
2970 .wtotem_theme—dark .wtotem_chart-first__btn_active {
2971 background: #282828;
2972 }
2973
2974 .wtotem_theme—dark .wtotem_content,
2975 .wtotem_theme—dark .wtotem_footer,
2976 .wtotem_theme—dark .wtotem_chart-first__right,
2977 .wtotem_theme—dark .wtotem_control__block,
2978 .wtotem_theme—dark .wtotem_state__select,
2979 .wtotem_theme—dark .wtotem_chart__calendars{
2980 background: #191919;
2981 }
2982
2983 .wtotem_theme—dark .wtotem_version__count {
2984 border: 1px solid #f3f5f6;
2985 }
2986
2987 .wtotem_theme—dark .wtotem_logo {
2988 background: url("../img/dr-logo.svg") no-repeat center center/cover;
2989 }
2990
2991 .wtotem_theme—dark .wtotem_nav__link,
2992 .wtotem_theme—dark .wtotem_nav__link_active,
2993 .wtotem_theme—dark .wtotem_version__count,
2994 .wtotem_theme—dark .title,
2995 .wtotem_theme—dark .wtotem_title-info__title,
2996 .wtotem_theme—dark .wtotem_overall__text,
2997 .wtotem_theme—dark .wtotem_info__subtitle,
2998 .wtotem_theme—dark .wtotem_info__info,
2999 .wtotem_theme—dark .wtotem_numbers__figures,
3000 .wtotem_theme—dark .wtotem_from__country,
3001 .wtotem_theme—dark .wtotem_from__country span,
3002 .wtotem_theme—dark .wtotem_data__th,
3003 .wtotem_theme—dark .wtotem_antivirus__title,
3004 .wtotem_theme—dark .wtotem_table__title,
3005 .wtotem_theme—dark .wtotem_table__subject,
3006 .wtotem_theme—dark .wtotem_table__text,
3007 .wtotem_theme—dark .wtotem_table__perfomance,
3008 .wtotem_theme—dark .wtotem_footer__text,
3009 .wtotem_theme—dark .wtotem_footer__text,
3010 .wtotem_theme—dark .wtotem_chart__btn,
3011 .wtotem_theme—dark .wtotem_antivirus__item:last-child div,
3012 .wtotem_theme—dark .wtotem_from__percent,
3013 .wtotem_theme—dark .wtotem_chart-first__all,
3014 .wtotem_theme—dark .wtotem_chart-first__hack p,
3015 .wtotem_theme—dark .wtotem_chart-first__btn_active,
3016 .wtotem_theme—dark .wtotem_chart__text,
3017 .wtotem_theme—dark .wtotem_table__initial-value,
3018 .wtotem_theme—dark .arrow-right,
3019 .wtotem_theme—dark .wtotem_print__label,
3020 .wtotem_theme—dark .wtotem_state__text,
3021 .wtotem_theme—dark .wtotem_pagination__number,
3022 .wtotem_theme—dark .wtotem_data__td,
3023 .wtotem_theme—dark .wtotem_file-table__th,
3024 .wtotem_theme—dark .wtotem_file-table,
3025 .wtotem_theme—dark .wtotem_option__title,
3026 .wtotem_theme—dark .wtotem_option__text,
3027 .wtotem_theme—dark .wtotem_control__title,
3028 .wtotem_theme—dark .wtotem_control__name,
3029 .wtotem_theme—dark .onoff__label:after,
3030 .wtotem_theme—dark .onoff__label:before,
3031 .wtotem_theme—dark .wtotem_offer__title,
3032 .wtotem_theme—dark .wtotem_offer__text,
3033 .wtotem_theme—dark .wtotem_unit__expectation_loading,
3034 .wtotem_theme—dark .wtotem_alert__text {
3035 color: #f3f5f6;
3036 }
3037
3038 .wtotem_theme—dark .wtotem_data__ip {
3039 color: #86939e;
3040 }
3041
3042 .wtotem_theme—dark .wtotem_chart__btn {
3043 border: 1px solid #f3f5f6;
3044 }
3045
3046 .wtotem_theme—dark .wtotem_title-info__info {
3047 background: url("../img/dr-info.svg") no-repeat center center/cover;
3048 }
3049
3050 .wtotem_theme—dark .wtotem_nav__link_active {
3051 color: #3d50df;
3052 }
3053
3054 .wtotem_theme—dark .wtotem_info__item:first-child,
3055 .wtotem_theme—dark .wtotem_numbers__item,
3056 .wtotem_theme—dark .wtotem_antivirus__item,
3057 .wtotem_theme—dark .wtotem_unit__block {
3058 border-right: 1px solid #3c3c3d;
3059 }
3060
3061 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
3062 border-right: none;
3063 }
3064
3065 .wtotem_theme—dark .wtotem_numbers__item:last-child {
3066 border-right: none;
3067 }
3068
3069 .wtotem_theme—dark .wtotem_table__col {
3070 border-right: 1px solid #3c3c3d;
3071 border-bottom: 1px solid #3c3c3d;
3072 }
3073
3074 .wtotem_theme—dark .wtotem_table__col:last-child {
3075 border-right: none;
3076 }
3077
3078 .wtotem_theme—dark .wtotem_chart__line {
3079 background: #3c3c3d;
3080 }
3081
3082 .wtotem_theme—dark .wtotem_table__th,
3083 .wtotem_theme—dark .wtotem_table__td {
3084 border-bottom: 1px solid #3c3c3d;
3085 }
3086
3087 .wtotem_theme—dark .wtotem_table__link:after {
3088 content: "";
3089 border: solid #fff;
3090 border-width: 0 1.5px 1.5px 0;
3091 transform: rotate(-45deg);
3092 -webkit-transform: rotate(-45deg);
3093 }
3094
3095 .wtotem_theme—dark .arrow-right:after {
3096 content: "";
3097 border: solid #f3f5f6;
3098 border-width: 0 1px 1px 0;
3099 transform: rotate(-45deg);
3100 -webkit-transform: rotate(-45deg);
3101 margin-left: 10px;
3102 }
3103
3104 .wtotem_theme—dark .wtotem_footer__line,
3105 .wtotem_theme—dark .wtotem_state__line {
3106 background: #2d2e2e;
3107 }
3108
3109 .wtotem_theme—dark .wtotem_footer__app-store {
3110 width: 19px;
3111 height: 19px;
3112 background: url("../img/dr-app-store.svg") no-repeat center center/cover;
3113 }
3114
3115 .wtotem_theme—dark .wtotem_footer__play-store {
3116 width: 17px;
3117 height: 19px;
3118 background: url("../img/dr-play-store.svg") no-repeat center center/cover;
3119 }
3120
3121 .wtotem_theme—dark .wtotem_footer__logo {
3122 background: url("../img/dr-logo-footer.svg") no-repeat center center/cover;
3123 }
3124
3125 .wtotem_theme—dark .line-chart__tooltip,
3126 .wtotem_theme—dark .line-chart__tooltip::before {
3127 background: #3d50df;
3128 }
3129
3130 .wtotem_theme—dark .wtotem_firewall__icon {
3131 background: url("../img/dr-shape.svg") no-repeat center center/cover;
3132 }
3133
3134 .wtotem_theme—dark .wtotem_pagination__number_active {
3135 background: #5a5c5e;
3136 }
3137
3138 .wtotem_pagination__number:hover {
3139 color: #5e6977;
3140 transition: all 0.2s ease;
3141 }
3142
3143 .wtotem_theme—dark .onoff__label {
3144 background: #686868;
3145 }
3146
3147 .wtotem_theme—dark .wtotem_print__img {
3148 background: url("../img/dr-print.svg") no-repeat center center/cover;
3149 }
3150
3151 .wtotem_theme—dark .wtotem_control__trash {
3152 background: url("../img/dr-trash.svg") no-repeat center center/cover;
3153 }
3154
3155 .wtotem_theme—dark .onoff__input:checked + label .onoff__circle {
3156 background: #4bc374;
3157 }
3158
3159 .wtotem_theme—dark .onoff__circle {
3160 background: #ec6d62;
3161 }
3162
3163 .wtotem_theme—dark .wtotem_alert__close:before,
3164 .wtotem_theme—dark .wtotem_alert__close:after {
3165 background: #dadada;
3166 }
3167
3168 .wtotem_info__item .arrow-right {
3169 color: #3d50df;
3170 }
3171 .wtotem_info__item .arrow-right:after {
3172 content: "";
3173 border: solid #3d50df;
3174 border-width: 0 1px 1px 0;
3175 transform: rotate(-45deg);
3176 -webkit-transform: rotate(-45deg);
3177 margin-left: 10px;
3178 }
3179
3180 /* 320-576px Extra small */
3181 @media screen and (max-width: 576px) {
3182 .wtotem_theme—dark .wtotem_info__item:first-child {
3183 border-right: none;
3184 }
3185 .wtotem_theme—dark .wtotem_antivirus__item {
3186 border-bottom: 1px solid #3c3c3d;
3187 }
3188 .wtotem_theme—dark .wtotem_numbers__item:last-child {
3189 border-right: 1px solid #3c3c3d;
3190 }
3191 .wtotem_theme—dark .wtotem_numbers__item:nth-child(2) {
3192 border-right: none;
3193 }
3194 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
3195 border-right: none;
3196 border-bottom: none;
3197 }
3198 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(2) {
3199 border-right: none;
3200 }
3201 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(3) {
3202 border-bottom: none;
3203 }
3204 }
3205
3206 /* 992-1100px lg Large */
3207 @media screen and (max-width: 1100px) {
3208 .wtotem_container {
3209 max-width: 960px;
3210 }
3211 }
3212
3213 /* 768-992px md Medium */
3214 @media screen and (max-width: 992px) {
3215 .wtotem_container {
3216 max-width: 720px;
3217 }
3218 }
3219
3220 /* 576-768px sm Small */
3221 @media screen and (max-width: 768px) {
3222 .wtotem_container {
3223 max-width: 540px;
3224 }
3225 .wtotem_content {
3226 padding-top: 19px;
3227 }
3228 }
3229
3230 /* 375-576px Extra small */
3231 @media screen and (max-width: 576px) {
3232 .wtotem_container {
3233 max-width: 345px;
3234 }
3235 }
3236
3237 /* 320-375px Extra small */
3238 @media screen and (max-width: 374px) {
3239 .wtotem_container {
3240 max-width: auto;
3241 padding: 0 10px;
3242 }
3243 }
3244
3245 /* 992-1100px lg Large */
3246 /* 768-992px md Medium */
3247 /* 576-768px sm Small */
3248 /* 375-576px Extra small */
3249 /* 320-375px Extra small */
3250
3251 /*# sourceMappingURL=main.css.map */
3252
3253 /*tlite */
3254 .tlite {
3255 background: #111;
3256 color: #fff;
3257 font-family: sans-serif;
3258 font-size: 0.8rem;
3259 font-weight: normal;
3260 text-decoration: none;
3261 text-align: left;
3262 padding: 0.6em 0.75rem;
3263 border-radius: 4px;
3264 position: absolute;
3265 opacity: 0;
3266 visibility: hidden;
3267 transition: opacity 0.4s;
3268 max-width: 350px;
3269 box-shadow: 0 0.5rem 1rem -0.5rem #000;
3270 z-index: 1000;
3271 -webkit-backface-visibility: hidden;
3272 }
3273 .tlite-table td,
3274 .tlite-table th {
3275 position: relative;
3276 }
3277 .tlite-visible {
3278 visibility: visible;
3279 opacity: 0.9;
3280 }
3281 .tlite::before {
3282 content: " ";
3283 display: block;
3284 background: inherit;
3285 width: 10px;
3286 height: 10px;
3287 position: absolute;
3288 transform: rotate(45deg);
3289 }
3290 .tlite-n::before {
3291 top: -3px;
3292 left: 50%;
3293 margin-left: -5px;
3294 }
3295 .tlite-nw::before {
3296 top: -3px;
3297 left: 10px;
3298 }
3299 .tlite-ne::before {
3300 top: -3px;
3301 right: 10px;
3302 }
3303 .tlite-s::before {
3304 bottom: -3px;
3305 left: 50%;
3306 margin-left: -5px;
3307 }
3308 .tlite-se::before {
3309 bottom: -3px;
3310 right: 10px;
3311 }
3312 .tlite-sw::before {
3313 bottom: -3px;
3314 left: 10px;
3315 }
3316 .tlite-w::before {
3317 left: -3px;
3318 top: 50%;
3319 margin-top: -5px;
3320 }
3321 .tlite-e::before {
3322 right: -3px;
3323 top: 50%;
3324 margin-top: -5px;
3325 }
3326 .is--status--ok {
3327 color: #4bc374;
3328 fill: #4bc374;
3329 }
3330 .is--status--error {
3331 color: #ee3f3f;
3332 fill: #ee3f3f;
3333 }
3334 .is--status--pending {
3335 color: #3d50df;
3336 fill: #3d50df;
3337 }
3338 .is--status--warning {
3339 color: #f5bf4f;
3340 fill: #f5bf4f;
3341 }
3342 .wtsec_score_red {
3343 color: #d56c6a;
3344 }
3345 .wtsec_score_orange {
3346 color: #c2b00e;
3347 }
3348 .wtsec_score_green {
3349 color: #7eb40c;
3350 }
3351 .wtsec_score_bg_red {
3352 background: #d56c6a;
3353 color: #fff;
3354 }
3355 .wtsec_score_bg_orange {
3356 background: #c2b00e;
3357 color: #fff;
3358 }
3359 .wtsec_score_bg_green {
3360 background: #7eb40c;
3361 color: #fff;
3362 }
3363 #wtotem_alert {
3364 margin-top: 20px;
3365 }
3366
3367 .ml-2 {
3368 margin-left: 20px;
3369 }
3370
3371 .wt-flex {
3372 display: flex;
3373 }
3374
3375 .wt-flex-middle {
3376 align-items: center;
3377 }
3378
3379 .wt-margin-right-10 {
3380 margin-right: 10px;
3381 }
3382 .break-word {
3383 overflow-wrap: break-word;
3384 word-wrap: break-word;
3385 }
3386
3387 select.wtotem_state__select {
3388 display: block;
3389 margin-left: 18px;
3390 width: 100%;
3391 padding: 8px 12px 8px 12px;
3392 color: #86939e;
3393 font-size: 14px;
3394 font-weight: 400;
3395 -webkit-appearance: none;
3396 appearance: none;
3397 background-color: #f3f5f6;
3398 background-image: none;
3399 border-radius: 4px;
3400 border: none;
3401 font-family: inherit;
3402 cursor: pointer;
3403 }
3404
3405 .wtotem_unit {
3406 margin-bottom: 30px;
3407 }
3408
3409 .wtotem_table__text {
3410 margin-left: 15px;
3411 word-break: break-all;
3412 }
3413 .wt-margin-20{
3414 margin: 20px;
3415 }
3416 .wt-margin-bottom-15{
3417 margin-bottom: 15px;
3418 }
3419 .wtotem_av_filters_wrapper{
3420 justify-content: space-between;
3421 display: flex;
3422 }
3423
3424 .wt_flag{
3425 width: 24px;
3426 }
3427
3428
3429 .wtotem_theme—dark input.wtotem_calendar {
3430 color: #cccccc;
3431 }
3432
3433
3434 .wtotem_theme—dark .flatpickr-calendar{
3435 background: #282828;
3436 border: 2px solid #191919;
3437 }
3438
3439 .wtotem_theme—dark .flatpickr-day{
3440 color: #cccccc;
3441 }
3442
3443 .wtotem_theme—dark .flatpickr-monthDropdown-months, .wtotem_theme—dark .flatpickr-current-month input.cur-year{
3444 color: #cccccc !important;
3445 }
3446
3447 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{
3448 background-color: #282828;
3449 }
3450 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months,
3451 .wtotem_theme—dark .flatpickr-monthDropdown-months, .wtotem_theme—dark .flatpickr-current-month input.cur-year{
3452 border: 1.6px solid #545454;
3453 }
3454
3455 .wtotem_theme—dark .flatpickr-day.inRange, .wtotem_theme—dark .flatpickr-day.today.inRange{
3456 background: #656565;
3457 color: #fff;
3458 border-color: #656565;
3459 }
3460
3461 .wtotem_theme—dark .flatpickr-day.inRange,
3462 .wtotem_theme—dark .flatpickr-day.prevMonthDay.inRange,
3463 .wtotem_theme—dark .flatpickr-day.nextMonthDay.inRange,
3464 .wtotem_theme—dark .flatpickr-day.today.inRange,
3465 .wtotem_theme—dark .flatpickr-day.prevMonthDay.today.inRange,
3466 .wtotem_theme—dark .flatpickr-day.nextMonthDay.today.inRange,
3467 .wtotem_theme—dark .flatpickr-day:hover,
3468 .wtotem_theme—dark .flatpickr-day.prevMonthDay:hover,
3469 .wtotem_theme—dark .flatpickr-day.nextMonthDay:hover,
3470 .wtotem_theme—dark .flatpickr-day:focus,
3471 .wtotem_theme—dark .flatpickr-day.prevMonthDay:focus,
3472 .wtotem_theme—dark .flatpickr-day.nextMonthDay:focus{
3473 background: #656565;
3474 border-color: #656565;
3475 color: #fff;
3476 }
3477
3478 .wtotem_theme—dark .wtotem_country__desc{
3479 color: #ccc;
3480 }
3481
3482
3483
3484 .wtotem_control__input:checked + label {
3485 background: #777;
3486 }
3487
3488 .wtotem_nav__link:focus {
3489 box-shadow: none;
3490 }
3491
3492
3493
3494 /* reports-page.css */
3495 .wtotem_reports {
3496 display: grid;
3497 grid-template-rows: auto 1fr auto;
3498 min-height: 100vh; }
3499 .wtotem_reports__content {
3500 height: 100%; }
3501 .wtotem_reports__header {
3502 display: flex;
3503 align-items: center;
3504 margin-bottom: 15px;
3505 flex-wrap: wrap; }
3506 @media screen and (max-width: 768px) {
3507 .wtotem_reports__header {
3508 margin-bottom: 10px; } }
3509 .wtotem_reports__title {
3510 margin-right: auto; }
3511 .wtotem_reports__btn {
3512 width: auto;
3513 padding: 14px 26px;
3514 position: relative; }
3515 @media screen and (max-width: 768px) {
3516 .wtotem_reports__btn {
3517 width: 100%;
3518 margin-top: 15px; } }
3519 .wtotem_reports__btn--load-more {
3520 text-transform: none;
3521 display: flex;
3522 justify-content: center; }
3523
3524 .wtotem_reports-dates {
3525 background-color: #E1E8EE;
3526 cursor: pointer;
3527 display: flex;
3528 margin-right: 6px;
3529 padding: 10px 12px;
3530 border-radius: 5px; }
3531 @media screen and (max-width: 768px) {
3532 .wtotem_reports-dates {
3533 margin-right: 0; } }
3534 .wtotem_reports-dates::before {
3535 content: '';
3536 display: block;
3537 align-self: center;
3538 height: 13px;
3539 width: 13px;
3540 margin-right: 9px;
3541 background-image: url("../img/calendar.svg");
3542 background-repeat: no-repeat;
3543 background-position: center center; }
3544 @media screen and (max-width: 576px) {
3545 .wtotem_reports-dates::before {
3546 margin-right: 0; } }
3547 .wtotem_reports-dates__input {
3548 cursor: pointer;
3549 color: #5e6977;
3550 display: block;
3551 position: relative;
3552 background-color: transparent;
3553 border: none;
3554 width: 50%;
3555 text-align: center;
3556 width: 0;
3557 flex-grow: 1;
3558 min-width: 90px; }
3559 @media screen and (max-width: 576px) {
3560 .wtotem_reports-dates__input {
3561 display: none; } }
3562 .wtotem_reports-dates__divider {
3563 display: block;
3564 align-self: center;
3565 margin: 0 3px; }
3566 @media screen and (max-width: 576px) {
3567 .wtotem_reports-dates__divider {
3568 display: none; } }
3569
3570 .wtotem_reports-no-data {
3571 display: flex;
3572 flex-direction: column;
3573 align-items: center;
3574 justify-content: center;
3575 height: 100%; }
3576 .wtotem_reports-no-data::before {
3577 content: '';
3578 display: block;
3579 height: 89px;
3580 width: 89px;
3581 margin-bottom: 10px;
3582 background-image: url("../img/empty-list.svg");
3583 background-repeat: no-repeat;
3584 background-position: center center; }
3585 .wtotem_reports-no-data__text {
3586 font-weight: bold;
3587 font-size: 14px;
3588 line-height: 18px;
3589 margin-bottom: 23px; }
3590
3591 .wtotem_reports-table {
3592 width: 100%;
3593 text-align: left;
3594 border-spacing: 0 8px;
3595 margin-bottom: 30px;
3596 border-collapse: separate;}
3597 @media screen and (max-width: 768px) {
3598 .wtotem_reports-table {
3599 display: none; } }
3600 .wtotem_reports-table__row {
3601 font-weight: 500;
3602 font-size: 14px;
3603 line-height: 21px;
3604 color: #5e6977;
3605 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
3606 background: #ffffff; }
3607 .wtotem_reports-table__row--header {
3608 color: #86939E; }
3609 .wtotem_reports-table__column {
3610 padding: 18px;
3611 padding-left: 0; }
3612 .wtotem_reports-table__column:first-child {
3613 padding-left: 18px; }
3614 .wtotem_reports-table__column--success {
3615 color: #4BC374; }
3616 .wtotem_reports-table__column--warning {
3617 color: #f5c451; }
3618 .wtotem_reports-table__column--error {
3619 color: #f5c451; }
3620 .wtotem_reports-table__column--actions {
3621 padding-top: 0;
3622 padding-bottom: 0;
3623 text-align: right; }
3624 .wtotem_reports-table__buttons-wrapper {
3625 height: 100%;
3626 width: 100%;
3627 display: flex;
3628 justify-content: flex-end;
3629 align-content: center; }
3630 .wtotem_reports-table__button {
3631 cursor: pointer;
3632 display: block;
3633 height: 35px;
3634 width: 35px;
3635 border: none;
3636 background-color: transparent; }
3637 .wtotem_reports-table__button:last-child {
3638 margin-right: 0; }
3639 .wtotem_reports-table__button--print {
3640 background-image: url("../img/print.svg");
3641 background-repeat: no-repeat;
3642 background-position: center center; }
3643 .wtotem_reports-table__button--download {
3644 background-image: url("../img/download.svg");
3645 background-repeat: no-repeat;
3646 background-position: center center; }
3647
3648 .wtotem_reports-list__load-more-wrapper {
3649 width: 100%;
3650 display: flex;
3651 justify-content: center; }
3652
3653 .wtotem_reports__load-more-label {
3654 position: relative;
3655 padding-left: 25px; }
3656 .wtotem_reports__load-more-label::before {
3657 content: '';
3658 display: block;
3659 position: absolute;
3660 height: 20px;
3661 width: 20px;
3662 top: 50%;
3663 left: 0;
3664 transform: translateY(-50%);
3665 background-image: url("../img/load-more.svg");
3666 background-repeat: no-repeat;
3667 background-position: center center; }
3668
3669 .wtotem_reports-modal {
3670 position: fixed;
3671 left: 0;
3672 top: 0;
3673 display: grid;
3674 place-items: center;
3675 height: 100%;
3676 width: 100%;
3677 z-index: 99999;
3678 background-color: rgba(94, 105, 119, 0.67);
3679 color: #545C68;
3680 font-weight: 500;
3681 font-size: 16px;
3682 line-height: 14px; }
3683 .wtotem_reports-modal--hidden {
3684 display: none; }
3685 .wtotem_reports-modal__content {
3686 position: relative;
3687 background: #FFFFFF;
3688 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
3689 border-radius: 12px;
3690 padding: 30px;
3691 min-width: 360px; }
3692 .wtotem_reports-modal__close {
3693 cursor: pointer;
3694 position: absolute;
3695 background-color: transparent;
3696 height: 30px;
3697 width: 30px;
3698 top: 0;
3699 right: 0;
3700 transform: translate(100%, -100%);
3701 border: none;
3702 background-image: url("../img/close.svg");
3703 background-repeat: no-repeat;
3704 background-position: center center; }
3705 @media screen and (max-width: 768px) {
3706 .wtotem_reports-modal__close {
3707 transform: translate(0, 0);
3708 top: 12px;
3709 right: 12px;
3710 background-image: url("../img/close-dark.svg");
3711 background-repeat: no-repeat;
3712 background-position: center center; } }
3713
3714 .wtotem_reports-settings__field-title {
3715 font-size: 16px;
3716 line-height: 14px;
3717 margin-bottom: 20px; }
3718 .wtotem_reports-settings__field-title--modules {
3719 margin-bottom: 10px; }
3720
3721 .wtotem_reports-settings__period-list {
3722 padding: 0;
3723 margin: 0;
3724 list-style: none;
3725 display: flex;
3726 width: 300px;
3727 height: 38px;
3728 margin-bottom: 10px; }
3729
3730 .wtotem_reports-settings__period-item {
3731 flex-grow: 1;
3732 border: 2px solid #E1E8EE; }
3733 .wtotem_reports-settings__period-item:not(:last-child) {
3734 border-right: none; }
3735
3736 .wtotem_reports-settings__period-radio {
3737 display: none; }
3738
3739 .wtotem_reports-settings__period-label {
3740 cursor: pointer;
3741 position: relative;
3742 display: flex;
3743 justify-content: center;
3744 align-items: center;
3745 height: 100%;
3746 width: 100%;
3747 font-size: 12px;
3748 line-height: 14px;
3749 font-weight: normal;
3750 text-align: center; }
3751
3752 .wtotem_reports-settings__period-radio:checked + .wtotem_reports-settings__period-label {
3753 color: #3d50df; }
3754
3755 .wtotem_reports-settings__dates {
3756 cursor: pointer;
3757 display: flex;
3758 border-radius: 2px;
3759 border: 2px solid #E1E8EE;
3760 padding: 7px 15px;
3761 margin-bottom: 25px; }
3762 .wtotem_reports-settings__dates::before {
3763 content: '';
3764 display: block;
3765 align-self: center;
3766 height: 13px;
3767 width: 15px;
3768 margin-right: 9px;
3769 background-image: url("../img/report.svg");
3770 background-repeat: no-repeat;
3771 background-position: center center; }
3772
3773 .wtotem_reports-settings__date-input {
3774 cursor: pointer;
3775 display: block;
3776 border: none;
3777 width: 0;
3778 min-width: 80px;
3779 font-size: 12px;
3780 line-height: 14px;
3781 font-weight: normal;
3782 text-align: right;
3783 color: inherit; }
3784 .wtotem_reports-settings__date-input:last-child {
3785 flex-grow: 1;
3786 text-align: left; }
3787
3788 .wtotem_reports-settings__date-divider {
3789 display: block;
3790 align-self: center;
3791 margin: 0 3px; }
3792
3793 .wtotem_reports-settings__modules-list {
3794 padding: 0;
3795 margin: 0;
3796 list-style: none;
3797 margin-bottom: 10px; }
3798
3799 .wtotem_reports-settings__module-item {
3800 position: relative;
3801 display: flex;
3802 align-items: center;
3803 justify-content: space-between;
3804 min-height: 48px; }
3805 .wtotem_reports-settings__module-item::after {
3806 content: '';
3807 position: absolute;
3808 height: 1px;
3809 left: -30px;
3810 right: -30px;
3811 bottom: 0;
3812 background-color: #EBF0F5; }
3813 .wtotem_reports-settings__module-item:last-child::after {
3814 content: unset; }
3815
3816 .wtotem_reports-settings__module-title {
3817 font-size: 14px;
3818 line-height: 35px; }
3819
3820 .wtotem_reports-settings__module-label {
3821 cursor: pointer;
3822 display: block;
3823 position: relative;
3824 width: 45px;
3825 height: 35px; }
3826 .wtotem_reports-settings__module-label::before {
3827 content: '';
3828 position: absolute;
3829 left: 50%;
3830 top: 50%;
3831 transform: translate(-50%, -50%);
3832 width: 100%;
3833 height: 10px;
3834 background: #E1E8EE;
3835 box-shadow: inset 0px 1px 0px rgba(189, 198, 207, 0.529014);
3836 border-radius: 100px; }
3837 .wtotem_reports-settings__module-label::after {
3838 content: '';
3839 position: absolute;
3840 left: 0;
3841 top: 50%;
3842 transform: translateY(-50%);
3843 width: 18px;
3844 height: 18px;
3845 margin-left: 5px;
3846 background: #5E6977;
3847 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.189736);
3848 border-radius: 100%;
3849 transition: 0.15s; }
3850
3851 .wtotem_reports-settings__module-checkbox {
3852 display: none; }
3853
3854 .wtotem_reports-settings__module-checkbox:checked + .wtotem_reports-settings__module-label::after {
3855 background: #3D50DF;
3856 left: 100%;
3857 margin-left: -23px; }
3858
3859 .wtotem_reports-settings__btn {
3860 width: 100%; }
3861
3862 .wtotem_reports-accordion {
3863 font-weight: 500;
3864 font-size: 14px;
3865 line-height: 21px;
3866 display: none; }
3867 @media screen and (max-width: 768px) {
3868 .wtotem_reports-accordion {
3869 display: block; } }
3870 .wtotem_reports-accordion__header {
3871 display: flex;
3872 align-items: center;
3873 justify-content: space-between;
3874 color: #86939E; }
3875 .wtotem_reports-accordion__header, .wtotem_reports-accordion__item {
3876 width: 100%;
3877 padding: 18px 14px;
3878 background: #FFFFFF;
3879 margin-bottom: 6px;
3880 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
3881 border-radius: 4px; }
3882 .wtotem_reports-accordion__header:last-child, .wtotem_reports-accordion__item:last-child {
3883 margin-bottom: 0; }
3884 .wtotem_reports-accordion__title {
3885 cursor: pointer;
3886 display: flex;
3887 justify-content: space-between;
3888 align-items: center; }
3889 .wtotem_reports-accordion__title::after {
3890 content: '';
3891 display: block;
3892 align-self: center;
3893 height: 20px;
3894 width: 20px;
3895 background-image: url("../img/arrow-down.svg");
3896 background-repeat: no-repeat;
3897 background-position: center center; }
3898 .wtotem_reports-accordion__content-wrapper {
3899 margin-top: 10px;
3900 border-top: 1px solid #F3F5F6; }
3901 .wtotem_reports-accordion__line-wrapper {
3902 display: flex;
3903 justify-content: space-between;
3904 padding: 10px 0; }
3905 .wtotem_reports-accordion__line-title {
3906 color: #86939E; }
3907 .wtotem_reports-accordion__line-value--success {
3908 color: #4BC374; }
3909 .wtotem_reports-accordion__line-value--warning {
3910 color: #f5c451; }
3911 .wtotem_reports-accordion__line-value--error {
3912 color: #f5c451; }
3913 .wtotem_reports-accordion__button {
3914 display: block;
3915 width: 100%;
3916 margin-bottom: 12px; }
3917 .wtotem_reports-accordion__button:last-child {
3918 margin-bottom: 0; }
3919
3920
3921 .wt-loader {
3922 z-index: 1
3923 }
3924 .wt-loader, .wt-spinner {
3925 display: flex;
3926 align-items: center;
3927 justify-content: center
3928 }
3929 .wt-spinner {
3930 position: absolute;
3931 top: 0;
3932 right: 0;
3933 bottom: 0;
3934 left: 0;
3935 background-color: hsla(0, 0%, 100%, .5);
3936 z-index: 20
3937 }
3938 .wt-loader img, .wt-loader path, .wt-spinner img {
3939 -webkit-user-select: none;
3940 -moz-user-select: none;
3941 -ms-user-select: none;
3942 user-select: none;
3943 transform: rotate(0deg);
3944 animation: 1s linear 0s normal none infinite running rot;
3945 -webkit-animation: 1s linear 0s normal none infinite running rot;
3946 }
3947
3948 .wtotem_body .wtotem_reports-modal--active {
3949 display: grid;
3950 }
3951 .wtotem_body .wtotem_reports-modal__content {
3952 position: relative;
3953 background: #FFFFFF;
3954 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
3955 border-radius: 12px;
3956 padding: 30px;
3957 min-width: 360px;
3958 }
3959
3960 .wtotem_reports-settings__field-title {
3961 font-size: 16px;
3962 line-height: 14px;
3963 margin-bottom: 20px;
3964 }
3965 .wtotem_body .wtotem_reports-settings__field-title--modules {
3966 margin-bottom: 10px;
3967 }
3968 .wtotem_body .wtotem_reports-settings__period-list {
3969 padding: 0;
3970 margin: 0;
3971 list-style: none;
3972 display: flex;
3973 width: 300px;
3974 height: 38px;
3975 margin-bottom: 20px;
3976 }
3977 .wtotem_body .wtotem_reports-settings__period-item {
3978 flex-grow: 1;
3979 border: 2px solid #E1E8EE;
3980 }
3981 .wtotem_body .wtotem_reports-settings__period-item:not(:last-child) {
3982 border-right: none;
3983 }
3984 .wtotem_body .wtotem_reports-settings__period-radio {
3985 display: none;
3986 }
3987 .wtotem_body .wtotem_reports-settings__period-label {
3988 cursor: pointer;
3989 position: relative;
3990 display: flex;
3991 justify-content: center;
3992 align-items: center;
3993 height: 100%;
3994 width: 100%;
3995 font-size: 12px;
3996 line-height: 14px;
3997 font-weight: normal;
3998 text-align: center;
3999 }
4000 .wtotem_body .wtotem_reports-settings__period-radio:checked + .wtotem_reports-settings__period-label {
4001 color: #3d50df;
4002 }
4003 .wtotem_body .wtotem_reports-settings__dates {
4004 display: flex;
4005 border-radius: 2px;
4006 border: 2px solid #E1E8EE;
4007 padding: 7px 15px;
4008 margin-bottom: 25px;
4009 }
4010 .wtotem_body .wtotem_reports-settings__dates::before {
4011 content: '';
4012 display: block;
4013 align-self: center;
4014 height: 13px;
4015 width: 15px;
4016 margin-right: 9px;
4017 background-image: url('../img/report.svg');
4018 background-repeat: no-repeat;
4019 background-position: center center;
4020 }
4021 .wtotem_body .wtotem_reports-settings__date-input {
4022 cursor: pointer;
4023 display: block;
4024 border: none;
4025 width: 0;
4026 min-width: 115px;
4027 font-size: 12px;
4028 line-height: 14px;
4029 font-weight: normal;
4030 text-align: right;
4031 color: inherit;
4032 background-color: transparent;
4033 }
4034
4035 .wtotem_body .wtotem_reports-settings__date-input:focus {
4036 border: 0;
4037 box-shadow: none;
4038 outline: none;
4039 }
4040
4041 .wtotem_body .wtotem_reports-settings__date-input:last-child {
4042 flex-grow: 1;
4043 text-align: left;
4044 }
4045 .wtotem_body .wtotem_reports-settings__date-divider {
4046 display: block;
4047 align-self: center;
4048 margin: 0 3px;
4049 }
4050 .wtotem_body .wtotem_reports-settings__modules-list {
4051 padding: 0;
4052 margin: 0;
4053 list-style: none;
4054 margin-bottom: 20px;
4055 }
4056 .wtotem_reports-settings__module-item {
4057 position: relative;
4058 display: flex;
4059 align-items: center;
4060 justify-content: space-between;
4061 min-height: 48px;
4062 }
4063 .wtotem_body .wtotem_reports-settings__module-item::after {
4064 content: '';
4065 position: absolute;
4066 height: 1px;
4067 left: -30px;
4068 right: -30px;
4069 bottom: 0;
4070 background-color: #EBF0F5;
4071 }
4072 .wtotem_body .wtotem_reports-settings__module-item:last-child::after {
4073 content: unset;
4074 }
4075 .wtotem_body .wtotem_reports-settings__module-title {
4076 font-size: 14px;
4077 line-height: 35px;
4078 }
4079 .wtotem_body .wtotem_reports-settings__module-label {
4080 cursor: pointer;
4081 display: block;
4082 position: relative;
4083 width: 45px;
4084 height: 35px;
4085 }
4086 .wtotem_body .wtotem_reports-settings__module-label::before {
4087 content: '';
4088 position: absolute;
4089 left: 50%;
4090 top: 50%;
4091 transform: translate(-50%, -50%);
4092 width: 100%;
4093 height: 10px;
4094 background: #E1E8EE;
4095 box-shadow: inset 0px 1px 0px rgba(189, 198, 207, 0.529014);
4096 border-radius: 100px;
4097 }
4098 .wtotem_body .wtotem_reports-settings__module-label::after {
4099 content: '';
4100 position: absolute;
4101 left: 0;
4102 top: 50%;
4103 transform: translateY(-50%);
4104 width: 18px;
4105 height: 18px;
4106 margin-left: 5px;
4107 background: #5E6977;
4108 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.189736);
4109 border-radius: 100%;
4110 transition: 0.15s;
4111 }
4112 .wtotem_body .wtotem_reports-settings__module-checkbox {
4113 display: none;
4114 }
4115 .wtotem_body .wtotem_reports-settings__module-checkbox:checked + .wtotem_reports-settings__module-label::after {
4116 background: #3D50DF;
4117 left: 100%;
4118 margin-left: -23px;
4119 }
4120 .wtotem_body .wtotem_reports-settings__btn {
4121 width: 100%;
4122 }
4123
4124 .wtotem_theme—dark .wtotem_reports-table__column,.wtotem_theme—dark .wtotem_reports-dates{
4125 background: #282828;
4126 }
4127
4128 .wtotem_theme—dark .wtotem_body .wtotem_reports-dates__input {
4129 border: 1px solid #3a3a3a;
4130 color: #ccc;
4131 }
4132
4133 .wtotem_theme—dark .wtotem_reports-table__row{
4134 background: transparent;
4135 }
4136
4137 .wtotem_theme—dark .wtotem_reports-modal{
4138 color: #ddd;
4139 }
4140
4141 .wtotem_theme—dark .wtotem_body .wtotem_reports-modal__content{
4142 background: #282828;
4143 }
4144
4145 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__dates,
4146 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__period-item{
4147 border: 2px solid #35383b;
4148 }
4149
4150 .wtotem_theme—dark .wtotem_reports-modal__close{
4151 background-image: url(../img/close.svg);
4152 }
4153
4154 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__module-item::after{
4155 background-color: #35383b;
4156 }
4157
4158 .wtotem_theme—dark .wtotem_reports-accordion__header, .wtotem_theme—dark .wtotem_reports-accordion__item{
4159 background: #282828;
4160 color: #d6d6d6;
4161 }
4162
4163 .wtotem_theme—dark .wtotem_reports-accordion__content-wrapper{
4164 border-top: 1px solid #565656;
4165 }
4166
4167 .reports_load_more_td{
4168 background: transparent;
4169 border-color: transparent;
4170 }
4171
4172 /* # reports-page.css */
4173
4174
4175 /*fixes*/
4176 .chart-date text{
4177 -webkit-transform: rotate(-40deg) translate(-20px);
4178 -ms-transform: rotate(-40deg) translate(-20px);
4179 transform: rotate(-40deg) translate(-20px);
4180 }