PluginProbe
WebTotem Security / 2.3.13
WebTotem Security v2.3.13
3.0.2 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 All 110 releases
wt-security / htdocs / css / wtsec_main.css

wtsec_main.css in WebTotem Security 2.3.13, at htdocs/css/wtsec_main.css

4,846 lines 106.3 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: 5px 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 .wt-flex{
393 display: flex;
394 }
395
396 .wtotem_body ol,
397 .wtotem_body ul {
398 list-style: none;
399 }
400
401 .wtotem_body a {
402 text-decoration: none;
403 }
404
405 .wtotem_body a:hover {
406 text-decoration: none;
407 }
408
409 .wtotem_body h1,
410 .wtotem_body h2,
411 .wtotem_body h3,
412 .wtotem_body h4,
413 .wtotem_body h5 {
414 color: #5e6977;
415 font-weight: 700;
416 }
417
418 .wtotem_container {
419 max-width: 1020px;
420 margin: 0 auto;
421 }
422
423 .visually-hidden {
424 position: absolute !important;
425 clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
426 clip: rect(1px, 1px, 1px, 1px);
427 padding:0 !important;
428 border:0 !important;
429 height: 1px !important;
430 width: 1px !important;
431 overflow: hidden;
432 }
433
434
435 .wtotem_button {
436 min-width: 28px;
437 padding: 5px 10px;
438 color: #3d50df;
439 font-size: 14px;
440 border-radius: 5px;
441 border: 2px solid #3d50df;
442 text-transform: uppercase;
443 cursor: pointer;
444 background-color: #fff;
445 text-decoration: none;
446 }
447
448 .wtotem_button.wtotem_button--primary {
449 border: none;
450 background-color: #3d50df;
451 color: #fff;
452 }
453
454 .wtotem_block_center{
455 margin: 20px auto;
456 display: block;
457 width: fit-content;
458 }
459
460 .wtotem_title-info__title {
461 font-size: 14px;
462 text-transform: uppercase;
463 }
464
465 .wtotem_font-700 {
466 font-weight: 700;
467 }
468
469 .wtotem_button>*+* {
470 margin-left: 10px;
471 }
472
473 .wtotem_title-info__info {
474 background: url("../img/info-gray.svg") no-repeat center center/cover;
475 display: inline-block;
476 vertical-align: middle;
477 width: 17px;
478 height: 17px;
479 margin-top: -2px;
480 }
481
482 .title {
483 font-size: 24px;
484 font-weight: 700;
485 }
486
487 .wtotem_title-info__info .tlite{
488 text-transform: none;
489 }
490
491 .section-header-mb {
492 margin-bottom: 25px;
493 }
494
495 .wt-text.wt-text--blue{
496 color:#3d50df
497 }
498 .wt-text.wt-text--uppercase{
499 text-transform:uppercase
500 }
501 .wt-loader-fixed {
502 position: fixed;
503 top: 0;
504 right: 0;
505 bottom: 0;
506 left: 0;
507 display: flex;
508 align-items: center;
509 justify-content: center;
510 background-color: hsla(0, 0%, 100%, .5);
511 z-index: 20
512 }
513 .wt-loader-fixed img, .wt-loader-fixed path {
514 -webkit-user-select: none;
515 -moz-user-select: none;
516 -ms-user-select: none;
517 user-select: none;
518 transform: rotate(0deg);
519 -webkit-animation: spinner 1.1s linear infinite;
520 animation: spinner 1.1s linear infinite
521 }
522
523 .arrow-right {
524 color: #3d50df;
525 cursor: pointer;
526 display: flex;
527 align-items: center;
528 }
529 .arrow-right:after {
530 content: "";
531 border: solid #3d50df;
532 border-width: 0 1px 1px 0;
533 display: inline-block;
534 padding: 3px;
535 transform: rotate(-45deg);
536 -webkit-transform: rotate(-45deg);
537 margin-left: 10px;
538 }
539
540 .wt-icon {
541 cursor: pointer;
542 display: flex;
543 align-items: center;
544 justify-content: center;
545 }
546
547 .wtotem_print {
548 display: flex;
549 align-items: center;
550 cursor: pointer;
551 }
552 .wtotem_print__img {
553 display: block;
554 width: 17px;
555 height: 17px;
556 margin-right: 10px;
557 background: url("../img/print.svg") no-repeat center center/cover;
558 }
559 .wtotem_print__label {
560 color: #86939e;
561 }
562
563 .wt_card {
564 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
565 border-radius: 4px;
566 background: #fff;
567 }
568
569 /* 576-768px sm Small */
570 @media screen and (max-width: 768px) {
571 .section-header-mb {
572 margin-bottom: 20px;
573 }
574 .arrow-right:after {
575 margin-left: 5px;
576 }
577 }
578
579
580 /*# =header.css.map */
581
582 .wtotem_header {
583 position: relative;
584 z-index: 4;
585 width: 100%;
586 top: 0;
587 left: 0; }
588 .wtotem_header__body {
589 display: flex;
590 justify-content: space-between;
591 align-items: center; }
592 .wtotem_header:before {
593 content: "";
594 position: absolute;
595 top: 0;
596 left: 0;
597 width: 100%;
598 height: 100%;
599 background: #fff;
600 z-index: 2; }
601
602 .wtotem_version {
603 position: relative;
604 z-index: 100;
605 display: flex;
606 align-items: center; }
607 .wtotem_version__count {
608 width: 28px;
609 height: 18px;
610 display: flex;
611 justify-content: center;
612 align-items: center;
613 font-size: 10px;
614 font-weight: 500;
615 border: 1px solid #3d50df;
616 border-radius: 4px;
617 margin-left: 8px; }
618
619 .wtotem_logo {
620 width: 113px;
621 height: 24px;
622 background: url("../img/logo.svg") no-repeat center center/cover; }
623
624 .wtotem_nav {
625 position: relative;
626 z-index: 3;
627 height: 70px; }
628 .wtotem_nav .wtotem_control__checkbox {
629 align-self: center; }
630 .wtotem_nav__menu {
631 display: flex;
632 height: 100%; }
633 .wtotem_nav__link {
634 position: relative;
635 display: flex;
636 align-items: center;
637 height: 100%;
638 font-size: 14px;
639 color: #5e6977;
640 font-weight: 500;
641 padding: 0 16px; }
642 .wtotem_nav__link_active {
643 color: #3d50df; }
644 .wtotem_nav__link_active:before {
645 content: "";
646 position: absolute;
647 bottom: 0;
648 right: 0;
649 left: 0;
650 background: #3d50df;
651 height: 3px; }
652
653 /* 576-768px sm Small */
654 @media screen and (max-width: 768px) {
655 body.lock {
656 overflow: hidden; }
657 .wtotem_version {
658 position: relative;
659 z-index: 3; }
660 .wtotem_header__body {
661 height: 65px; }
662 .wtotem_nav {
663 position: fixed;
664 top: -100%;
665 left: 0;
666 width: 100%;
667 height: 100%;
668 background: #f3f5f6;
669 display: block;
670 padding-top: 65px;
671 transition: all 0.3s ease-in-out;
672 overflow: auto;
673 z-index: 1; }
674 .wtotem_nav__menu {
675 display: block; }
676 .wtotem_nav__item {
677 border-bottom: 1px solid #eceff4; }
678 .wtotem_nav__link {
679 height: auto;
680 display: block;
681 color: #1d293f;
682 font-size: 24px;
683 padding: 22px 0;
684 width: 540px;
685 margin: 0 auto; }
686 .wtotem_nav__link_active {
687 color: #3d50df; }
688 .wtotem_nav__link_active:before {
689 display: none; }
690 .wtotem_nav.active {
691 top: 0; }
692 .wtotem_burger {
693 position: relative;
694 width: 23px;
695 height: 18px;
696 display: flex;
697 align-items: center;
698 justify-content: flex-end;
699 cursor: pointer;
700 z-index: 3; }
701 .wtotem_burger:before, .wtotem_burger__middle-line, .wtotem_burger:after {
702 content: "";
703 background: #3d50df;
704 height: 2px;
705 display: block;
706 right: 0;
707 border-radius: 100px;
708 transition: all 0.3s ease-in-out; }
709 .wtotem_burger:before {
710 position: absolute;
711 width: 23px;
712 top: 0; }
713 .wtotem_burger__middle-line {
714 width: 18px; }
715 .wtotem_burger:after {
716 position: absolute;
717 width: 14px;
718 bottom: 0; }
719 .wtotem_burger.active .wtotem_burger__middle-line {
720 transform: scale(0); }
721 .wtotem_burger.active:before {
722 transform: rotate(45deg);
723 top: 8px; }
724 .wtotem_burger.active:after {
725 transform: rotate(-45deg);
726 width: 100%;
727 bottom: 8px; } }
728
729 /* 320-576px Extra small */
730 @media screen and (max-width: 576px) {
731 .wtotem_nav__link {
732 width: 345px;
733 margin: 0 auto; } }
734
735 /* 320-375px Extra small */
736 @media screen and (max-width: 375px) {
737 .wtotem_nav__link {
738 padding-left: 10px; } }
739
740 @media screen and (max-width: 768px) {
741 .wtotem_theme—dark .wtotem_nav {
742 background: #191919; }
743 .wtotem_theme—dark .wtotem_nav__item {
744 border-bottom: 1px solid #3c3c3d; } }
745
746 /*# =header.css.map */
747
748
749
750 .wtotem_chart__wrapper {
751 display: flex;
752 }
753
754 .wtotem_filter__wrapper {
755 display: flex;
756 justify-content: flex-end;
757 }
758
759 .wtotem_chart__calendars {
760 display: flex;
761 background: #f3f5f6;
762 border-radius: 5px;
763 align-items: center;
764 padding: 10px 8px;
765 margin-right: 7px;
766 }
767
768 .wtotem_calendar-icon {
769 background: url(../img/shape.svg) no-repeat center center / cover;
770 display: block;
771 width: 14px;
772 height: 14px;
773 margin-right: 3px;
774 }
775
776 input.wtotem_calendar {
777 background: transparent;
778 border: none;
779 color: #5e6977;
780 width: 125px;
781 cursor: pointer;
782 text-align: center;
783 }
784
785 input.wtotem_calendar:focus{
786 border: none;
787 box-shadow: none;
788 outline: 0;
789 }
790
791
792 .wtotem_calendar-connect {
793 margin: 0 3px;
794 }
795
796 .numInputWrapper span {
797 opacity: 1;
798 right: 2.5px;
799 }
800
801 .numInputWrapper span.arrowUp {
802 top: 15%;
803 }
804
805 .numInputWrapper span.arrowDown {
806 top: 35%;
807 }
808
809 .flatpickr-calendar {
810 font-family: "Inter", sans-serif;
811 width: 225px;
812 padding: 5px;
813 border: 2px solid #e1e8ee;
814 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
815 border-radius: 5px;
816 margin-top: 10px;
817 /*top: 382px !important;*/
818 }
819
820 .flatpickr-calendar.arrowTop:before {
821 border: 5px solid transparent;
822 border-bottom: 5px solid #e1e8ee;
823 top: -12px;
824 }
825
826 .flatpickr-calendar.arrowTop:after {
827 border: 5px solid transparent;
828 border-bottom: 5px solid #e1e8ee;
829 top: -12px;
830 }
831
832 .dayContainer {
833 justify-content: flex-start;
834 width: 225px;
835 min-width: 225px;
836 max-width: 225px;
837 align-items: center;
838 }
839
840 .flatpickr-days {
841 width: 225px;
842 }
843
844 .flatpickr-weekdays {
845 display: none;
846 }
847
848 .flatpickr-day {
849 border-radius: 0;
850 font-size: 12px;
851 max-width: 29px;
852 font-weight: 500;
853 color: #5e6977;
854 margin-bottom: 12px;
855 line-height: 5px;
856 height: 20px;
857 display: flex;
858 align-items: center;
859 justify-content: center;
860 }
861
862 .flatpickr-day:nth-last-child(-n + 7) {
863 margin-bottom: 0;
864 }
865
866 .flatpickr-day.today,
867 .flatpickr-day.today.inRange {
868 color: #393939;
869 }
870
871 .flatpickr-day.today.selected {
872 color: #fff;
873 }
874
875 .flatpickr-day.inRange,
876 .flatpickr-day.today.inRange {
877 background: #e1e8ee;
878 box-shadow: none;
879 margin-top: 0;
880 }
881
882 .flatpickr-day.selected,
883 .flatpickr-day.endRange,
884 .flatpickr-day.startRange {
885 background: #3d50df;
886 border-radius: 5px 5px 5px 5px !important;
887 }
888
889 .flatpickr-day.selected,
890 .flatpickr-day.startRange,
891 .flatpickr-day.endRange,
892 .flatpickr-day.selected.inRange,
893 .flatpickr-day.startRange.inRange,
894 .flatpickr-day.endRange.inRange,
895 .flatpickr-day.selected:focus,
896 .flatpickr-day.startRange:focus,
897 .flatpickr-day.endRange:focus,
898 .flatpickr-day.selected:hover,
899 .flatpickr-day.startRange:hover,
900 .flatpickr-day.endRange:hover,
901 .flatpickr-day.selected.prevMonthDay,
902 .flatpickr-day.startRange.prevMonthDay,
903 .flatpickr-day.endRange.prevMonthDay,
904 .flatpickr-day.selected.nextMonthDay,
905 .flatpickr-day.startRange.nextMonthDay,
906 .flatpickr-day.endRange.nextMonthDay {
907 background: #3d50df;
908 border-radius: 5px 5px 5px 5px !important;
909 height: 24px;
910 }
911
912 .flatpickr-months .flatpickr-prev-month,
913 .flatpickr-months .flatpickr-next-month {
914 display: none;
915 }
916
917 .flatpickr-current-month .flatpickr-monthDropdown-months {
918 width: 93px;
919 height: 31px;
920 padding: 6px 10px 7px;
921 border: 1.6px solid #e1e8ee;
922 border-radius: 2px;
923 }
924
925 .flatpickr-monthDropdown-months,
926 .flatpickr-current-month input.cur-year {
927 width: 93px;
928 height: 31px;
929 padding: 6px 10px 7px;
930 border: 1.6px solid #e1e8ee;
931 border-radius: 2px;
932 }
933
934 .flatpickr-current-month .numInputWrapper {
935 width: 93px;
936 }
937
938 .numInputWrapper span {
939 border: none;
940 }
941
942 .numInputWrapper span:hover {
943 background: transparent;
944 }
945
946 .flatpickr-current-month .numInputWrapper span.arrowDown:after,
947 .flatpickr-current-month .numInputWrapper span.arrowUp:after {
948 border-top-color: rgba(134, 147, 158, 1);
949 border-bottom-color: rgba(134, 147, 158, 1);
950 }
951
952 .flatpickr-month {
953 text-align-last: left;
954 margin-bottom: 13px;
955 position: relative;
956 }
957
958 .flatpickr-month:after {
959 content: "";
960 display: block;
961 border: 4px solid transparent;
962 border-top: 4px solid #86939e;
963 position: absolute;
964 right: 60%;
965 top: 43%;
966 }
967
968 .flatpickr-current-month {
969 left: 0;
970 width: 205px;
971 padding: 0;
972 display: flex;
973 align-items: center;
974 justify-content: space-between;
975 }
976
977 .flatpickr-monthDropdown-months,
978 .flatpickr-current-month input.cur-year {
979 -webkit-appearance: none !important;
980 -moz-appearance: none !important;
981 appearance: none !important;
982 color: #5e6977 !important;
983 font-size: 12px !important;
984 }
985
986 .flatpickr-current-month .numInputWrapper {
987 }
988
989 /* 576-768px sm Small */
990 @media screen and (max-width: 768px) {
991 body.lock {
992 overflow: hidden;
993 }
994 .wtotem_version {
995 position: relative;
996 z-index: 3;
997 }
998 .wtotem_header__body {
999 height: 65px;
1000 }
1001 .wtotem_nav {
1002 position: fixed;
1003 top: -100%;
1004 left: 0;
1005 width: 100%;
1006 height: 100%;
1007 background: #f3f5f6;
1008 display: block;
1009 padding-top: 65px;
1010 transition: all 0.3s ease-in-out;
1011 overflow: auto;
1012 z-index: 1;
1013 }
1014 .wtotem_nav .wtotem_control__checkbox {
1015 display: none; }
1016 .wtotem_nav__menu {
1017 display: block;
1018 }
1019 .wtotem_nav__item {
1020 border-bottom: 1px solid #eceff4;
1021 }
1022 .wtotem_nav__link {
1023 height: auto;
1024 display: block;
1025 color: #1d293f;
1026 font-size: 24px;
1027 padding: 22px 0;
1028 width: 540px;
1029 margin: 0 auto;
1030 }
1031 .wtotem_nav__link_active {
1032 color: #3d50df;
1033 }
1034 .wtotem_nav__link_active:before {
1035 display: none;
1036 }
1037 .wtotem_nav.active {
1038 top: 0;
1039 }
1040 .wtotem_burger {
1041 position: relative;
1042 width: 23px;
1043 height: 18px;
1044 display: flex;
1045 align-items: center;
1046 justify-content: flex-end;
1047 cursor: pointer;
1048 z-index: 3;
1049 }
1050 .wtotem_burger:before,
1051 .wtotem_burger__middle-line,
1052 .wtotem_burger:after {
1053 content: "";
1054 background: #3d50df;
1055 height: 2px;
1056 display: block;
1057 right: 0;
1058 border-radius: 100px;
1059 transition: all 0.3s ease-in-out;
1060 }
1061 .wtotem_burger:before {
1062 position: absolute;
1063 width: 23px;
1064 top: 0;
1065 }
1066 .wtotem_burger__middle-line {
1067 width: 18px;
1068 }
1069 .wtotem_burger:after {
1070 position: absolute;
1071 width: 14px;
1072 bottom: 0;
1073 }
1074 .wtotem_burger.active .wtotem_burger__middle-line {
1075 transform: scale(0);
1076 }
1077 .wtotem_burger.active:before {
1078 transform: rotate(45deg);
1079 top: 8px;
1080 }
1081 .wtotem_burger.active:after {
1082 transform: rotate(-45deg);
1083 width: 100%;
1084 bottom: 8px;
1085 }
1086 }
1087
1088 /* 320-576px Extra small */
1089 @media screen and (max-width: 576px) {
1090 .wtotem_nav__link {
1091 width: 345px;
1092 margin: 0 auto;
1093 }
1094 }
1095
1096 /* 320-375px Extra small */
1097 @media screen and (max-width: 375px) {
1098 .wtotem_nav__link {
1099 padding-left: 10px;
1100 }
1101 }
1102
1103 @media screen and (max-width: 768px) {
1104 .wtotem_theme—dark .wtotem_nav {
1105 background: #191919;
1106 }
1107 .wtotem_theme—dark .wtotem_nav__item {
1108 border-bottom: 1px solid #3c3c3d;
1109 }
1110 }
1111
1112 .wtotem_footer {
1113 padding-top: 18px;
1114 padding-bottom: 20px;
1115 background: #f3f5f6;
1116 }
1117 .wtotem_footer__first {
1118 display: flex;
1119 justify-content: space-between;
1120 align-items: center;
1121 margin-bottom: 21px;
1122 }
1123 .wtotem_footer__caption {
1124 display: flex;
1125 align-items: center;
1126 }
1127 .wtotem_footer__logo {
1128 margin-right: 12px;
1129 background: url("../img/logo-blue.svg") no-repeat center center/cover;
1130 width: 20px;
1131 height: 32px;
1132 }
1133 .wtotem_footer__text {
1134 font-size: 12px;
1135 color: #5e6977;
1136 line-height: 12px;
1137 font-weight: 500;
1138 }
1139 .wtotem_footer__contacts {
1140 width: 200px;
1141 display: flex;
1142 justify-content: space-between;
1143 }
1144 .wtotem_footer__link {
1145 font-weight: 500;
1146 }
1147 .wtotem_footer__line {
1148 height: 1px;
1149 background: #e1e8ee;
1150 margin-bottom: 26px;
1151 }
1152 .wtotem_footer__bottom {
1153 display: flex;
1154 justify-content: space-between;
1155 align-items: center;
1156 }
1157 .wtotem_footer__left {
1158 display: flex;
1159 justify-content: space-between;
1160 align-items: center;
1161 width: 255px;
1162 }
1163 .wtotem_footer__text {
1164 font-size: 12px;
1165 font-weight: 500;
1166 color: #5e6977;
1167 }
1168 .wtotem_footer__store {
1169 margin-bottom: -5px;
1170 }
1171 .wtotem_footer__app-store {
1172 width: 19px;
1173 height: 19px;
1174 background: url("../img/app-store.svg") no-repeat center center/cover;
1175 }
1176 .wtotem_footer__play-store {
1177 width: 17px;
1178 height: 19px;
1179 background: url("../img/play-store.svg") no-repeat center center/cover;
1180 }
1181 .wtotem_footer__soc-link {
1182 margin-right: 20px;
1183 }
1184 .wtotem_footer__soc-link:last-child {
1185 margin-right: 0;
1186 }
1187 .wtotem_footer__payment {
1188 width: 166px;
1189 display: flex;
1190 justify-content: space-between;
1191 align-items: center;
1192 }
1193
1194 /* 576-768px sm Small */
1195 @media screen and (max-width: 768px) {
1196 .wtotem_footer__store,
1197 .wtotem_footer__soc,
1198 .wtotem_footer__payment,
1199 .wtotem_footer__line {
1200 display: none;
1201 }
1202 .wtotem_footer__caption,
1203 .wtotem_footer__left,
1204 .wtotem_footer__text {
1205 margin: 0 auto;
1206 }
1207 .wtotem_footer__caption {
1208 flex-direction: column;
1209 }
1210 .wtotem_footer__logo {
1211 margin-bottom: 18px;
1212 }
1213 }
1214
1215 /* wtotem-tooltip */
1216 .wtotem-tooltip {
1217 cursor: pointer;
1218 display: inline-block;
1219 position: relative; }
1220 .wtotem-tooltip__content {
1221 visibility: hidden;
1222 border-radius: 8px;
1223 padding: 10px;
1224 color: #F5F5F6;
1225 font-size: 12px;
1226 line-height: 18px;
1227 background-color: #1D293F;
1228 text-transform: none;
1229 min-width: 300px;
1230 position: absolute;
1231 z-index: 51;
1232 transform: translateY(-50%);
1233 left: 25px; }
1234 .wtotem-tooltip__text {
1235 font-size: 12px;
1236 line-height: 18px;
1237 font-weight: normal;
1238 margin-bottom: 5px; }
1239 .wtotem-tooltip__text:last-child {
1240 margin-bottom: 0; }
1241 .wtotem-tooltip__header {
1242 font-weight: bold;
1243 margin: 0;
1244 margin-bottom: 5px; }
1245
1246 .wtotem-tooltip .wtotem-tooltip__content::after {
1247 content: "";
1248 position: absolute;
1249 top: 50%;
1250 right: 100%;
1251 border-width: 5px;
1252 border-style: solid;
1253 border-color: transparent #1D293F transparent transparent; }
1254
1255 .wtotem-tooltip:hover .wtotem-tooltip__content {
1256 visibility: visible; }
1257 /* wtotem-tooltip */
1258
1259
1260 /* help-links */
1261 .wtotem_help-links {
1262 font-weight: 500;
1263 line-height: 1.5; }
1264 .wtotem_help-links__item {
1265 width: 100%;
1266 background: #FFFFFF;
1267 margin-bottom: 6px;
1268 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
1269 border-radius: 4px; }
1270 .wtotem_help-links__item:last-child {
1271 margin-bottom: 0; }
1272 .wtotem_help-links__title {
1273 cursor: pointer;
1274 padding: 18px 14px;
1275 display: flex;
1276 justify-content: space-between;
1277 align-items: center;
1278 color: #1D293F;
1279 font-size: 24px; }
1280 .wtotem_help-links__title::after {
1281 content: '';
1282 display: block;
1283 align-self: center;
1284 height: 20px;
1285 width: 20px;
1286 background-image: url("../img/arrow-right-blue.svg");
1287 background-repeat: no-repeat;
1288 background-position: center center; }
1289
1290 .wtotem-loader {
1291 display: flex;
1292 flex-direction: column;
1293 align-items: center;
1294 justify-content: center;
1295 z-index: 1; }
1296 .wtotem-loader__wrapper {
1297 display: flex;
1298 justify-content: center;
1299 align-items: center;
1300 width: 54px;
1301 height: 54px;
1302 background: #e5ebf0;
1303 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.005);
1304 border-radius: 12px;
1305 margin-bottom: 20px; }
1306 .wtotem-loader__text {
1307 line-height: 24px;
1308 font-size: 14px; }
1309 .wtotem-loader__text--blue {
1310 color: #3d50df; }
1311 .wtotem-loader__dots {
1312 display: flex;
1313 justify-content: space-between; }
1314 .wtotem-loader__dots span {
1315 border-radius: 50%;
1316 opacity: 0.2;
1317 background: #3d50df;
1318 width: 6px;
1319 height: 6px;
1320 display: block; }
1321 .wtotem-loader__dots span:first-child {
1322 animation: fball 1350ms infinite linear; }
1323 .wtotem-loader__dots span:nth-child(2) {
1324 animation: sball 1350ms infinite linear; }
1325 .wtotem-loader__dots span:last-child {
1326 animation: tball 1350ms infinite linear; }
1327
1328 @keyframes fball {
1329 0% {
1330 opacity: 0;
1331 transform: scale(0.5); }
1332 13% {
1333 opacity: 0.9;
1334 transform: scale(1.03); }
1335 26% {
1336 opacity: 1;
1337 transform: scale(0.95); }
1338 33% {
1339 transform: scale(1); }
1340 34% {
1341 opacity: 0.2; } }
1342
1343 @keyframes sball {
1344 32% {
1345 opacity: 0.2;
1346 transform: scale(1); }
1347 33% {
1348 opacity: 0;
1349 transform: scale(0.5); }
1350 46% {
1351 opacity: 0.9;
1352 transform: scale(1.03); }
1353 59% {
1354 opacity: 1;
1355 transform: scale(0.95); }
1356 66% {
1357 transform: scale(1); }
1358 67% {
1359 opacity: 0.2; } }
1360
1361 @keyframes tball {
1362 67% {
1363 opacity: 0.2;
1364 transform: scale(1); }
1365 68% {
1366 opacity: 0;
1367 transform: scale(0.5); }
1368 81% {
1369 opacity: 0.9;
1370 transform: scale(1.03); }
1371 94% {
1372 opacity: 1;
1373 transform: scale(0.95); }
1374 100% {
1375 transform: scale(1); } }
1376
1377
1378 .wtotem_content {
1379 padding-top: 37px;
1380 padding-bottom: 20px;
1381 background: #f3f5f6;
1382 }
1383
1384 .wtotem_first {
1385 margin-bottom: 37px;
1386 display: flex;
1387 justify-content: space-between;
1388 }
1389
1390 .wtotem_overall {
1391 padding: 21px 8px 30px 24px;
1392 width: 49%;
1393 }
1394 .wtotem_overall__title .wtotem_title-info__title {
1395 text-transform: none;
1396 font-size: 18px;
1397 }
1398 .wtotem_overall__body {
1399 display: flex;
1400 justify-content: space-between;
1401 align-items: center;
1402 margin-top: 21px;
1403 }
1404 .wtotem_overall__inner {
1405 display: flex;
1406 align-items: center;
1407 }
1408 .wtotem_overall__rectangle {
1409 width: 74px;
1410 height: 50px;
1411 background: #d56c6a;
1412 color: #fff;
1413 font-size: 32px;
1414 font-weight: 700;
1415 display: flex;
1416 align-items: center;
1417 justify-content: center;
1418 margin-right: 10px;
1419 }
1420 .wtotem_overall__figures {
1421 color: #d56c6a;
1422 font-size: 42px;
1423 font-weight: 700;
1424 }
1425 .wtotem_overall__text {
1426 font-size: 16px;
1427 color: #86939e;
1428 width: 267px;
1429 }
1430
1431 .wtotem_info {
1432 display: flex;
1433 width: 49%;
1434 }
1435 .wtotem_info__item {
1436 padding: 23px 29px;
1437 }
1438 .wtotem_info__item:first-child {
1439 border-right: 1px solid #f3f5f6;
1440 }
1441 .wtotem_info__block {
1442 margin-bottom: 10px;
1443 }
1444 .wtotem_info__subtitle {
1445 font-size: 14px;
1446 color: #86939e;
1447 margin-bottom: 3px;
1448 }
1449 .wtotem_info__info {
1450 font-size: 14px;
1451 color: #5e6977;
1452 }
1453 .wtotem_info__scoring {
1454 height: 51px;
1455 display: flex;
1456 align-items: center;
1457 justify-content: center;
1458 }
1459
1460 /* 992-1100px lg Large */
1461 @media screen and (max-width: 1100px) {
1462 .wtotem_overall {
1463 width: 49%;
1464 }
1465 .wtotem_overall__body {
1466 flex-direction: column;
1467 align-items: flex-start;
1468 }
1469 .wtotem_overall__inner {
1470 margin-bottom: 15px;
1471 }
1472 .wtotem_overall__text {
1473 width: 100%;
1474 }
1475 .wtotem_info {
1476 width: 49%;
1477 }
1478 }
1479
1480 /* 768-992px md Medium */
1481 @media screen and (max-width: 992px) {
1482 .wtotem_info {
1483 align-items: center;
1484 }
1485 .wtotem_info__item {
1486 padding: 13px 20px;
1487 }
1488 }
1489
1490 /* 576-768px sm Small */
1491 @media screen and (max-width: 768px) {
1492 .wtotem_first {
1493 flex-direction: column;
1494 margin-bottom: 20px;
1495 }
1496 .wtotem_overall {
1497 width: 100%;
1498 margin-bottom: 10px;
1499 }
1500 .wtotem_info {
1501 width: 100%;
1502 }
1503 .wtotem_info__item {
1504 width: 100%;
1505 }
1506 .wtotem_info__scoring {
1507 justify-content: flex-start;
1508 }
1509 }
1510
1511 /* 320-576px Extra small */
1512 @media screen and (max-width: 576px) {
1513 .wtotem_overall {
1514 padding-left: 22px;
1515 padding-right: 22px;
1516 }
1517 .wtotem_info {
1518 width: 100%;
1519 flex-direction: column;
1520 padding: 13px 22px 13px 22px;
1521 }
1522 .wtotem_info__item {
1523 width: 100%;
1524 padding: 0;
1525 }
1526 .wtotem_info__item:first-child {
1527 border-right: none;
1528 }
1529 .wtotem_info__block {
1530 margin-bottom: 20px;
1531 }
1532 .wtotem_info__scoring {
1533 justify-content: flex-start;
1534 height: auto;
1535 }
1536 }
1537
1538 .wtotem_firewall {
1539 margin-bottom: 20px;
1540 }
1541 .wtotem_firewall__first {
1542 display: flex;
1543 justify-content: space-between;
1544 }
1545 .wtotem_firewall__stats {
1546 display: flex;
1547 align-items: center;
1548 }
1549 .wtotem_firewall__icon {
1550 display: block;
1551 width: 14px;
1552 height: 14px;
1553 margin-right: 10px;
1554 background: url("../img/shape.svg") no-repeat center center/cover;
1555 }
1556 .wtotem_firewall__text {
1557 color: #86939e;
1558 }
1559 .wtotem_firewall__block {
1560 display: flex;
1561 justify-content: space-between;
1562 }
1563
1564 .wtotem_numbers {
1565 width: 49%;
1566 display: flex;
1567 justify-content: space-between;
1568 align-items: center;
1569 }
1570 .wtotem_numbers__item {
1571 text-align: center;
1572 width: 33.3333333333%;
1573 height: 100%;
1574 display: flex;
1575 flex-direction: column;
1576 justify-content: center;
1577 border-right: 1px solid #f3f5f6;
1578 }
1579 .wtotem_numbers__item:last-child {
1580 border-right: none;
1581 }
1582 .wtotem_numbers__title {
1583 line-height: 18px;
1584 color: #86939e;
1585 margin-bottom: 15px;
1586 }
1587 .wtotem_numbers__figures {
1588 color: #1d293f;
1589 font-size: 32px;
1590 font-weight: 700;
1591 }
1592
1593 .wtotem_from {
1594 width: 49%;
1595 display: flex;
1596 align-items: center;
1597 padding: 17px 23px;
1598 }
1599 .wtotem_from__arrow-right {
1600 margin-left: auto;
1601 border: solid #5e6977;
1602 border-width: 0 1.5px 1.5px 0;
1603 display: inline-block;
1604 padding: 6px;
1605 transform: rotate(-45deg);
1606 -webkit-transform: rotate(-45deg);
1607 }
1608 .wtotem_from__svg-wrap {
1609 position: relative;
1610 display: flex;
1611 align-items: center;
1612 }
1613 .wtotem_from__svg-wrap:after {
1614 content: "";
1615 position: absolute;
1616 top: 0;
1617 left: 0;
1618 z-index: 2;
1619 width: 69.5px;
1620 height: 69.5px;
1621 border-radius: 100%;
1622 border: 13.3px solid #f3f5f6;
1623 margin-top: 1px;
1624 }
1625 .wtotem_from__progress {
1626 position: relative;
1627 z-index: 3;
1628 width: 71px;
1629 height: 71px;
1630 }
1631 .wtotem_from__circle {
1632 stroke-width: 15px;
1633 stroke: #3d50df;
1634 fill: transparent;
1635 transform-origin: center;
1636 transform: rotate(-90deg);
1637 transition: stroke-dashoffset 0.3s;
1638 stroke-dashoffset: 0;
1639 }
1640 .wtotem_from__percent {
1641 position: absolute;
1642 display: block;
1643 width: 33px;
1644 top: 33%;
1645 left: 29%;
1646 font-weight: 700;
1647 font-size: 12px;
1648 text-align: center;
1649 }
1650 .wtotem_from__info {
1651 margin-left: 18px;
1652 }
1653 .wtotem_from__title {
1654 color: #86939e;
1655 margin-bottom: 9px;
1656 }
1657 .wtotem_from__country {
1658 font-size: 18px;
1659 color: #1d293f;
1660 line-height: 18px;
1661 }
1662 .wtotem_from__country span {
1663 color: #3d50df;
1664 }
1665
1666 /* 992-1100px lg Large */
1667 @media screen and (max-width: 1100px) {
1668 .wtotem_numbers,
1669 .wtotem_from {
1670 width: 49%;
1671 }
1672 }
1673
1674 /* 768-992px md Medium */
1675 /* 576-768px sm Small */
1676 @media screen and (max-width: 768px) {
1677 .wtotem_firewall__block {
1678 flex-direction: column;
1679 }
1680 .wtotem_numbers,
1681 .wtotem_from {
1682 width: 100%;
1683 }
1684 .wtotem_numbers {
1685 height: 104px;
1686 margin-bottom: 10px;
1687 }
1688 .wtotem_from__country {
1689 font-size: 14px;
1690 }
1691 }
1692
1693 /* 320-576px Extra small */
1694 @media screen and (max-width: 576px) {
1695 .wtotem_numbers {
1696 display: flex;
1697 flex-wrap: wrap;
1698 width: 345px;
1699 height: 217px;
1700 }
1701 .wtotem_numbers__item {
1702 width: 172.5px;
1703 height: 108.5px;
1704 }
1705 .wtotem_numbers__item:last-child {
1706 border-right: 1px solid #f3f5f6;
1707 }
1708 }
1709
1710 /* 320-375px Extra small */
1711 @media screen and (max-width: 374px) {
1712 .wtotem_numbers {
1713 width: 300px;
1714 }
1715 .wtotem_numbers__item {
1716 width: 150px;
1717 }
1718 }
1719
1720 .wtotem_chart {
1721 padding: 13px 0 19px 0;
1722 }
1723
1724 .wtotem_chart-first {
1725 display: flex;
1726 justify-content: space-between;
1727 align-items: center;
1728 padding: 0 26px;
1729 }
1730 .wtotem_chart-first__left {
1731 display: flex;
1732 align-items: center;
1733 }
1734 .wtotem_chart-first__all {
1735 color: #3d50df;
1736 margin-right: 10px;
1737 }
1738 .wtotem_chart-first__hack {
1739 margin-right: 15px;
1740 display: flex;
1741 align-items: center;
1742 }
1743 .wtotem_chart-first__hack p {
1744 color: #86939e;
1745 }
1746 .wtotem_chart-first__hack span {
1747 display: block;
1748 width: 7px;
1749 height: 7px;
1750 border-radius: 100px;
1751 margin-right: 7px;
1752 }
1753 .wtotem_chart-first__hack_attack span {
1754 background: #d56c6a;
1755 }
1756 .wtotem_chart-first__hack_blocked span {
1757 background: #bace3d;
1758 }
1759 .wtotem_chart-first__right {
1760 display: flex;
1761 background: #f3f5f6;
1762 /*width: 202px;*/
1763 height: 45px;
1764 align-items: center;
1765 justify-content: space-between;
1766 padding: 0 6px;
1767 border-radius: 5px;
1768 }
1769 .wtotem_chart-first__btn {
1770 display: flex;
1771 justify-content: center;
1772 align-items: center;
1773 width: 65px;
1774 height: 31px;
1775 border-radius: 4px;
1776 color: #5e6977;
1777 cursor: pointer;
1778 }
1779 .wtotem_chart-first__btn_active {
1780 background: #fff;
1781 color: #3d50df;
1782 }
1783
1784 .wtotem_chart {
1785 margin-bottom: 30px;
1786 }
1787 .wtotem_chart__diagram {
1788 height: 251px;
1789 }
1790 .wtotem_chart__line {
1791 width: 100%;
1792 height: 1px;
1793 background: #f3f5f6;
1794 margin-bottom: 16px;
1795 }
1796 .wtotem_chart__last {
1797 display: flex;
1798 justify-content: flex-end;
1799 align-items: center;
1800 padding: 0 26px;
1801 }
1802 .wtotem_chart__text {
1803 font-weight: 500;
1804 }
1805 .wtotem_chart__text a {
1806 color: #3d50df;
1807 }
1808 .wtotem_chart__btn {
1809 background: none;
1810 border: 1px solid #3d50df;
1811 border-radius: 4px;
1812 display: block;
1813 width: 136px;
1814 display: flex;
1815 align-items: center;
1816 justify-content: center;
1817 padding: 7px 5px;
1818 color: #3d50df;
1819 cursor: pointer;
1820 }
1821
1822 .wtotem_data {
1823 padding: 0 26px;
1824 }
1825 .wtotem_data__thead {
1826 margin-bottom: 15px;
1827 }
1828 .wtotem_data__tr {
1829 display: flex;
1830 justify-content: space-between;
1831 }
1832 .wtotem_data__th {
1833 color: #5e6977;
1834 font-weight: 500;
1835 font-size: 12px;
1836 }
1837 .wtotem_data__th:last-child {
1838 text-align: right;
1839 }
1840 .wtotem_data__td {
1841 font-size: 12px;
1842 font-weight: 500;
1843 color: #86939e;
1844 margin-bottom: 20px;
1845 }
1846 .wtotem_data__td_blocked:before {
1847 content: "";
1848 width: 4px;
1849 height: 4px;
1850 border-radius: 100px;
1851 background: #bace3d;
1852 display: block;
1853 }
1854 .wtotem_data__td_banned:before {
1855 content: "";
1856 width: 4px;
1857 height: 4px;
1858 border-radius: 100px;
1859 background: #d56c6a;
1860 display: block;
1861 }
1862 .wtotem_data__td:first-child {
1863 display: flex;
1864 align-items: center;
1865 }
1866 .wtotem_data__td:nth-child(2) {
1867 display: flex;
1868 align-items: center;
1869 }
1870 .wtotem_data__td:last-child {
1871 text-align: right;
1872 color: #d56c6a;
1873 }
1874 .wtotem_data__ip {
1875 margin-left: 10px;
1876 }
1877 .wtotem_data__img {
1878 width: 23px;
1879 height: 13px;
1880 margin-right: 6px;
1881 }
1882 .wtotem_data__flag {
1883 display: block;
1884 width: 100%;
1885 }
1886 .wtotem_data_width_1 {
1887 width: 12%;
1888 }
1889 .wtotem_data_width_2 {
1890 width: 12%;
1891 }
1892 .wtotem_data_width_3 {
1893 width: 13%;
1894 }
1895 .wtotem_data_width_4 {
1896 width: 24%;
1897 }
1898 .wtotem_data_width_5 {
1899 width: 29%;
1900 }
1901 .wtotem_data_width_6 {
1902 width: 11%;
1903 }
1904
1905 /* 768-992px md Medium */
1906 @media screen and (max-width: 992px) {
1907 .wtotem_data__th:nth-last-child(-n + 3),
1908 .wtotem_data__td:nth-last-child(-n + 3) {
1909 display: none;
1910 }
1911 .wtotem_data__th,
1912 .wtotem_data__td {
1913 width: 32%;
1914 }
1915 .wtotem_data__th:nth-child(3),
1916 .wtotem_data__td:nth-child(3) {
1917 width: 36%;
1918 }
1919 }
1920
1921 /* 576-768px sm Small */
1922 /* 320-576px Extra small */
1923 @media screen and (max-width: 576px) {
1924 .wtotem_data {
1925 padding: 0 16px;
1926 }
1927 .wtotem_chart-first {
1928 flex-direction: column;
1929 align-items: flex-start;
1930 }
1931 .wtotem_chart-first__left {
1932 margin-bottom: 20px;
1933 }
1934 .wtotem_chart-first__right {
1935 width: 100%;
1936 }
1937 }
1938
1939 /* 320-375px Extra small */
1940 @media screen and (max-width: 375px) {
1941 .wtotem_data__th,
1942 .wtotem_data__td {
1943 width: 33% !important;
1944 }
1945 .wtotem_data__ip {
1946 margin-left: 5px;
1947 }
1948 }
1949
1950 .wtotem_antivirus {
1951 margin-bottom: 30px;
1952 }
1953 .wtotem_antivirus__first {
1954 display: flex;
1955 justify-content: space-between;
1956 align-items: center;
1957 }
1958 .wtotem_antivirus__block {
1959 display: flex;
1960 justify-content: space-between;
1961 align-items: center;
1962 width: 100%;
1963 background: #fff;
1964 border-radius: 4px;
1965 }
1966 .wtotem_antivirus__item {
1967 width: 25%;
1968 height: 100.5px;
1969 text-align: center;
1970 display: flex;
1971 align-items: center;
1972 justify-content: center;
1973 flex-direction: column;
1974 border-right: 1px solid #f3f5f6;
1975 }
1976 .wtotem_antivirus__item:last-child {
1977 border-right: none;
1978 }
1979 .wtotem_antivirus__figures {
1980 font-size: 32px;
1981 font-weight: 700;
1982 margin-bottom: 18px;
1983 }
1984 .wtotem_antivirus__figures_green {
1985 color: #bace3d;
1986 }
1987 .wtotem_antivirus__figures_yellow {
1988 color: #e9cf73;
1989 }
1990 .wtotem_antivirus__figures_orange {
1991 color: #d56c6a;
1992 }
1993 .wtotem_antivirus__figures_black {
1994 color: #1d293f;
1995 }
1996 .wtotem_antivirus__title {
1997 color: #86939e;
1998 line-height: 18px;
1999 }
2000
2001 .wtotem_antivirus__quarantine {
2002 margin-bottom: 15px; }
2003 .wtotem_antivirus__quarantine-header {
2004 display: flex;
2005 align-items: center;
2006 flex-wrap: wrap;
2007 padding: 5px 20px 10px;
2008 border-bottom: 1px solid #f3f5f6;
2009 margin-bottom: 10px; }
2010 .wtotem_antivirus__quarantine-title {
2011 font-size: 14px; }
2012 .wtotem_antivirus__quarantine-files-count {
2013 font-size: 12px;
2014 color: #ee3f3f;
2015 font-weight: 500;
2016 margin-left: 10px; }
2017 .wtotem_antivirus__quarantine-restore {
2018 margin-left: auto; }
2019 .wtotem_antivirus__quarantine-restore-button {
2020 cursor: pointer;
2021 display: block;
2022 padding: 0 5px;
2023 height: 100%;
2024 display: block;
2025 background-color: transparent;
2026 border: none; }
2027 .wtotem_antivirus__quarantine-restore-text {
2028 position: relative;
2029 padding-left: 20px;
2030 font-size: 12px;
2031 font-weight: 500;
2032 color: #3D50DF; }
2033 .wtotem_antivirus__quarantine-restore-text::before {
2034 content: '';
2035 display: block;
2036 position: absolute;
2037 height: 15px;
2038 width: 15px;
2039 top: 50%;
2040 left: 0;
2041 transform: translateY(-50%);
2042 background-image: url("../img/restore-file.svg");
2043 background-repeat: no-repeat;
2044 background-position: center center;
2045 background-size: contain; }
2046
2047
2048
2049 @media screen and (max-width: 992px) {
2050 .wtotem_antivirus__quarantine .wtotem_file-table__td:first-child {
2051 width: auto; }
2052 .wtotem_antivirus__quarantine .wtotem_file-table__td:last-child {
2053 display: block;
2054 width: auto; } }
2055
2056 /* 320-576px Extra small */
2057 @media screen and (max-width: 576px) {
2058 .wtotem_antivirus__block {
2059 flex-wrap: wrap;
2060 }
2061 .wtotem_antivirus__item {
2062 width: 172.5px;
2063 border-bottom: 1px solid #f3f5f6;
2064 }
2065 .wtotem_antivirus__item:last-child {
2066 border-right: none;
2067 border-bottom: none;
2068 }
2069 .wtotem_antivirus__item:nth-child(2) {
2070 border-right: none;
2071 }
2072 .wtotem_antivirus__item:nth-child(3) {
2073 border-bottom: none;
2074 }
2075 }
2076
2077 /* 320-375px */
2078 @media screen and (max-width: 375px) {
2079 .wtotem_antivirus__item {
2080 width: 150px;
2081 }
2082 }
2083
2084 .wtotem_monitoring {
2085 margin-bottom: 30px;
2086 }
2087
2088 .wtotem_table__row {
2089 display: flex;
2090 width: 100%;
2091 }
2092
2093 .wtotem_table__col {
2094 width: 33.3333333333%;
2095 border-right: 1px solid #f3f5f6;
2096 border-bottom: 1px solid #f3f5f6;
2097 }
2098 .wtotem_table__col:last-child {
2099 border-right: none;
2100 }
2101
2102 .wtotem_table__th,
2103 .wtotem_table__td,
2104 .wtotem_table__info {
2105 padding: 15px 15px;
2106 }
2107
2108 .wtotem_table__th,
2109 .wtotem_table__td {
2110 border-bottom: 1px solid #f3f5f6;
2111 }
2112
2113 .wtotem_table__td {
2114 display: flex;
2115 justify-content: space-between;
2116 align-items: center;
2117 height: 64px;
2118 }
2119
2120 .wtotem_table__item {
2121 height: 110px;
2122 display: flex;
2123 align-items: center;
2124 justify-content: center;
2125 }
2126
2127 .wtotem_table__expired {
2128 color: #d56c6a;
2129 }
2130
2131 .wtotem_table__solve {
2132 color: #3d50df;
2133 }
2134
2135 .wtotem_table__info {
2136 height: 55px;
2137 display: flex;
2138 justify-content: space-between;
2139 }
2140
2141 .wtotem_table__subject {
2142 font-size: 14px;
2143 text-transform: uppercase;
2144 }
2145
2146 .wtotem_table__status {
2147 text-transform: uppercase;
2148 }
2149 .wtotem_table__status_green {
2150 color: #4bc374;
2151 }
2152 .wtotem_table__status_yellow {
2153 color: #dcb320;
2154 text-transform: none;
2155 }
2156
2157 .wtotem_table__text {
2158 color: #86939e;
2159 font-weight: 500;
2160 }
2161
2162 .wtotem_table__perfomance {
2163 font-weight: 500;
2164 color: #5e6977;
2165 }
2166 .wtotem_table__perfomance span {
2167 color: #3d50df;
2168 }
2169
2170 .wtotem_table__wrap {
2171 width: 30px;
2172 height: 30px;
2173 }
2174 .wtotem_table__wrap_big {
2175 width: 56px;
2176 height: 56px;
2177 }
2178
2179 .wtotem_table__img {
2180 width: 100%;
2181 display: block;
2182 }
2183
2184 .wtotem_table__link {
2185 display: flex;
2186 justify-content: space-between;
2187 align-items: center;
2188 padding: 13px 16px;
2189 }
2190 .wtotem_table__link:after {
2191 content: "";
2192 border: solid #5e6977;
2193 border-width: 0 1.5px 1.5px 0;
2194 display: inline-block;
2195 padding: 4px;
2196 transform: rotate(-45deg);
2197 -webkit-transform: rotate(-45deg);
2198 }
2199
2200 .wtotem_table__loader {
2201 min-height: 275px;
2202 display: flex;
2203 justify-content: center;
2204 align-items: center; }
2205
2206
2207 .wtotem_table__right_progress-wrap {
2208 width: 167px;
2209 margin-top: -21px;
2210 }
2211
2212 .wtotem_table__stick-progress {
2213 position: relative;
2214 background: #3d50df;
2215 width: 96%;
2216 height: 7px;
2217 border-radius: 100px;
2218 }
2219 .wtotem_table__stick-progress:after {
2220 content: "";
2221 position: absolute;
2222 top: 0;
2223 left: 0;
2224 width: 167px;
2225 height: 7px;
2226 opacity: 0.1;
2227 border-radius: 100px;
2228 background: #5e6977;
2229 }
2230
2231 .wtotem_table__initial-value {
2232 font-size: 10px;
2233 font-weight: 500;
2234 color: #5e6977;
2235 }
2236
2237 .wtotem_table__message {
2238 position: absolute;
2239 top: -20px;
2240 right: -12px;
2241 z-index: 50;
2242 width: 30px;
2243 height: 15px;
2244 border-radius: 2px;
2245 background: #3d50df;
2246 font-size: 10px;
2247 font-weight: 500;
2248 text-align: center;
2249 color: #fff;
2250 display: flex;
2251 justify-content: center;
2252 align-items: center;
2253 }
2254
2255 .wtotem_table__triangle {
2256 position: absolute;
2257 z-index: -1;
2258 top: 55%;
2259 left: 40%;
2260 width: 8.5px;
2261 height: 8.5px;
2262 display: block;
2263 border-radius: 1px;
2264 transform: rotate(45deg);
2265 background: #3d50df;
2266 margin: 0 auto;
2267 }
2268
2269 /* 992-1100px lg Large */
2270 /* 768-992px md Medium */
2271 @media screen and (max-width: 992px) {
2272 .wtotem_table__row {
2273 flex-direction: column;
2274 }
2275 .wtotem_table__col {
2276 width: 100%;
2277 border-right: none !important;
2278 }
2279 }
2280
2281 /* 576-768px sm Small */
2282 /* 320-576px Extra small */
2283 /* 320-375px Extra small */
2284 @media screen and (max-width: 375px) {
2285 .wtotem_table__perfomance_long {
2286 width: 210px;
2287 }
2288 .wtotem_chart-first {
2289 padding: 0 16px;
2290 }
2291 }
2292
2293 .wtotem_map__first {
2294 display: flex;
2295 justify-content: space-between;
2296 }
2297
2298 .wtotem_map .wtotem_map-block {
2299 display: flex;
2300 align-items: center;
2301 justify-content: space-around;
2302 padding-right: 26px; }
2303
2304 .wtotem_map .wtotem_map-block #firewall {
2305 display: block; }
2306
2307 .wtotem_map .wtotem_map-block__map {
2308 width: 50%;
2309 height: 330px; }
2310
2311 .wtotem_map .firewall {
2312 width: 50%;
2313 position: relative;
2314 height: 230px; }
2315
2316 .wtotem_map-wrap {
2317 padding-top: 15px;
2318 margin-bottom: 30px; }
2319
2320 .wtotem_country {
2321 margin-bottom: -15px; }
2322 .wtotem_country__title {
2323 font-size: 14px;
2324 line-height: 18px;
2325 color: #86939e;
2326 margin-bottom: 9px; }
2327 .wtotem_country__desc {
2328 font-size: 18px;
2329 line-height: 18px;
2330 color: #1d293f; }
2331
2332 /* 992-1100px lg Large */
2333 /* 768-992px md Medium */
2334 @media screen and (max-width: 992px) {
2335 .wtotem_map .wtotem_map-wrap {
2336 padding-bottom: 20px; }
2337 .wtotem_map .wtotem_map-block {
2338 flex-direction: column;
2339 padding-right: 0; }
2340 .wtotem_map .wtotem_map-block__map {
2341 width: 100%;
2342 text-align: center; }
2343 .wtotem_map .wtotem_map-block__map svg {
2344 width: 403px; }
2345 .wtotem_map #firewall {
2346 display: block;
2347 height: 135px;
2348 width: 270px; }
2349 .wtotem_map .firewall {
2350 position: relative;
2351 margin: auto;
2352 height: 70vh;
2353 width: 60vw; } }
2354
2355 /* 576-768px sm Small */
2356 /* 375-576px Extra small */
2357 @media screen and (max-width: 576px) {
2358 .wtotem_map .wtotem_map-block__map {
2359 height: auto; }
2360 .wtotem_map #firewallMap {
2361 width: 100%;
2362 zoom: 0.8; }
2363 .wtotem_map .wtotem_country {
2364 margin-bottom: 20px; }
2365 .wtotem_map .wtotem_chart__wrapper {
2366 width: 100%; } }
2367
2368 @media screen and (max-width: 500px) {
2369 .wtotem_map .firewall {
2370 width: 70vw; } }
2371
2372 @media screen and (max-width: 420px) {
2373 .wtotem_map .firewall {
2374 width: 75vw; }
2375 .wtotem_map__title {
2376 width: 120px; }
2377 }
2378
2379 @media screen and (max-width: 390px) {
2380 .wtotem_map .firewall {
2381 width: 80vw; } }
2382
2383 @media screen and (max-width: 375px) {
2384 .wtotem_map #firewallMap {
2385 width: 100%;
2386 zoom: 0.7;
2387 display: block;
2388 transform: translateX(25px); } }
2389
2390 @media screen and (max-width: 340px) {
2391 .wtotem_map #firewallMap {
2392 width: 100%;
2393 zoom: 0.7;
2394 display: block;
2395 transform: translateX(15px); } }
2396
2397 @media screen and (max-width: 340px) {
2398 .wtotem_map #firewallMap {
2399 width: 100%;
2400 zoom: 0.7;
2401 display: block;
2402 transform: translateX(5px); } }
2403
2404 /* 320-375px Extra small */
2405
2406
2407 .wtotem_firwall-training-alert {
2408 padding: 17px 22px;
2409 display: flex;
2410 justify-content: space-between;
2411 align-items: center;
2412 background: #fff;
2413 border-radius: 4px;
2414 margin-bottom: 30px; }
2415 @media screen and (max-width: 768px) {
2416 .wtotem_firwall-training-alert {
2417 flex-direction: column; } }
2418 .wtotem_firwall-training-alert__text-wrapper {
2419 display: flex;
2420 align-items: center; }
2421 .wtotem_firwall-training-alert__text-wrapper::before {
2422 content: '';
2423 display: block;
2424 align-self: center;
2425 height: 45px;
2426 width: 45px;
2427 margin-right: 9px;
2428 background-image: url("../img/firewall-icon.svg");
2429 background-repeat: no-repeat;
2430 background-position: center center;
2431 flex-shrink: 0; }
2432 @media screen and (max-width: 768px) {
2433 .wtotem_firwall-training-alert__text-wrapper {
2434 margin-bottom: 10px; } }
2435 .wtotem_firwall-training-alert__text {
2436 font-weight: 500;
2437 font-size: 16px;
2438 line-height: 19px; }
2439 .wtotem_firwall-training-alert__learn-more {
2440 display: block;
2441 width: auto;
2442 padding: 14px 26px;
2443 position: relative;
2444 flex-shrink: 0; }
2445
2446
2447 .wtotem-waf-settings {
2448 position: relative; }
2449 .wtotem-waf-settings__button {
2450 position: relative;
2451 box-sizing: border-box;
2452 height: 38px;
2453 display: flex;
2454 justify-content: center;
2455 align-items: center;
2456 background-color: transparent;
2457 font-size: 14px;
2458 line-height: 18px;
2459 display: flex;
2460 align-items: center;
2461 color: #5E6977;
2462 border: 1px solid #5E6977;
2463 border-radius: 12px;
2464 padding: 0 10px; }
2465 .wtotem-waf-settings__button-icon path {
2466 fill: #5E6977; }
2467 .wtotem-waf-settings__button--active {
2468 color: #3D50DF;
2469 border-color: #3D50DF; }
2470 .wtotem-waf-settings__button--active .wtotem-waf-settings__button-icon path {
2471 fill: #3D50DF; }
2472 .wtotem-waf-settings__button-text {
2473 margin-right: 10px; }
2474 @media screen and (max-width: 576px) {
2475 .wtotem-waf-settings__button-text {
2476 display: none; } }
2477 .wtotem-waf-settings__popup {
2478 display: none;
2479 position: absolute;
2480 right: 0;
2481 margin-top: 5px;
2482 z-index: 900; }
2483
2484 .wtotem_state {
2485 border-radius: 4px;
2486 }
2487
2488 .wtotem_state {
2489 background: #fff;
2490 padding: 13px 0 26px 0;
2491 }
2492 .wtotem_state__select-wrapper {
2493 position: relative;
2494 margin-bottom: 15px;
2495 width: 220px;
2496 cursor: pointer;
2497 }
2498 .wtotem_state__select-wrapper:after {
2499 content: "";
2500 position: absolute;
2501 top: 40%;
2502 right: 0;
2503 border-style: solid;
2504 border-width: 5px 5px 0 5px;
2505 border-color: #86939e transparent transparent transparent;
2506 border-radius: 50px;
2507 }
2508 .wtotem_state__select {
2509 display: block;
2510 margin-left: 18px;
2511 width: 100%;
2512 padding: 8px 12px 8px 12px;
2513 color: #86939e;
2514 font-size: 14px;
2515 font-weight: 400;
2516 -webkit-appearance: none;
2517 appearance: none;
2518 background-color: #f3f5f6;
2519 background-image: none;
2520 border-radius: 4px;
2521 border: none;
2522 font-family: inherit;
2523 cursor: pointer;
2524 }
2525 .wtotem_state__option {
2526 border: none;
2527 }
2528 .wtotem_state__line {
2529 background: #f3f5f6;
2530 height: 1px;
2531 margin-bottom: 20px;
2532 }
2533 .wtotem_state__last {
2534 display: flex;
2535 align-items: center;
2536 justify-content: space-between;
2537 padding: 0 18px;
2538 }
2539 .wtotem_state__text {
2540 color: #5e6977;
2541 font-weight: 500;
2542 }
2543 .wtotem_state__text a {
2544 color: #3d50df;
2545 }
2546
2547 .wtotem_file-table {
2548 color: #86939e;
2549 }
2550 .wtotem_file-table__tr {
2551 display: flex;
2552 margin-bottom: 15px;
2553 padding: 0 18px;
2554 }
2555 .wtotem_file-table__th {
2556 color: #5e6977;
2557 width: 17.5%;
2558 font-weight: 500;
2559 font-size: 12px;
2560 }
2561 .wtotem_file-table__th:first-child {
2562 width: 50%;
2563 }
2564 .wtotem_file-table__td {
2565 font-size: 12px;
2566 width: 17.5%;
2567 font-weight: 500;
2568 }
2569 .wtotem_file-table__td:first-child {
2570 width: 50%;
2571 }
2572 .wtotem_file-table__td_normal {
2573 color: #5e6977;
2574 }
2575 .wtotem_file-table__td_critical {
2576 color: #d56c6a;
2577 }
2578 .wtotem_file-table__td_changed {
2579 color: #caae4b;
2580 }
2581
2582 .wtotem_pagination {
2583 display: flex;
2584 }
2585 .wtotem_pagination__number {
2586 color: #99a6b1;
2587 font-weight: 500;
2588 margin-right: 30px;
2589 display: flex;
2590 align-items: center;
2591 }
2592 .wtotem_pagination__number:hover {
2593 color: #5e6977;
2594 }
2595 .wtotem_pagination__number_active {
2596 width: 46px;
2597 height: 46px;
2598 background: #f1f3f5;
2599 color: #5e6977;
2600 margin-right: 13px;
2601 border-radius: 100px;
2602 display: flex;
2603 justify-content: center;
2604 align-items: center;
2605 }
2606 .wtotem_pagination__number_etc {
2607 margin-right: 22px;
2608 }
2609 .wtotem_pagination__arrow {
2610 width: 19px;
2611 height: 12px;
2612 display: block;
2613 cursor: pointer;
2614 }
2615
2616 /* 992-1100px lg Large */
2617 /* 768-992px md Medium */
2618 @media screen and (max-width: 992px) {
2619 .wtotem_state {
2620 overflow: hidden;
2621 }
2622 .wtotem_file-table__td,
2623 .wtotem_file-table__th {
2624 display: none;
2625 }
2626 .wtotem_file-table__td:first-child,
2627 .wtotem_file-table__th:first-child {
2628 display: block;
2629 width: 100%;
2630 }
2631 }
2632
2633 /* 576-768px sm Small */
2634 /* 375-576px Extra small */
2635 @media screen and (max-width: 576px) {
2636 .wtotem_state__text {
2637 display: none;
2638 }
2639 .wtotem_pagination {
2640 margin: 0 auto;
2641 }
2642 .wtotem_pagination__number {
2643 margin-right: 18px;
2644 }
2645 .wtotem_pagination__number_active {
2646 margin-right: 13px;
2647 }
2648 }
2649
2650 /* 320-375px Extra small */
2651 .wtotem_welcome-wrapper {
2652 background: #f3f5f6;
2653 }
2654 .wtotem_welcome-wrapper__head-height {
2655 display: flex;
2656 align-items: center;
2657 justify-content: center;
2658 height: calc(100vh - 135px);
2659 min-height: 596px;
2660 }
2661 .wtotem_welcome-wrapper__footer-height {
2662 display: flex;
2663 justify-content: center;
2664 height: 135px;
2665 }
2666
2667 .wtotem_modal {
2668 text-align: center;
2669 }
2670 .wtotem_modal__subject {
2671 font-size: 24px;
2672 line-height: 18px;
2673 margin-bottom: 24px;
2674 }
2675 .wtotem_modal__window {
2676 background: #fff;
2677 padding: 23px 0 35px 0;
2678 width: 360px;
2679 margin: 0 auto;
2680 margin-bottom: 24px;
2681 }
2682 .wtotem_modal__title {
2683 font-size: 18px;
2684 margin-bottom: 5px;
2685 }
2686 .wtotem_modal__text {
2687 font-size: 10px;
2688 margin-bottom: 8px;
2689 }
2690 .wtotem_modal__block {
2691 margin-bottom: 50px;
2692 }
2693 .wtotem_modal__block:after {
2694 content: "";
2695 display: block;
2696 height: 1px;
2697 width: 100%;
2698 background: #e1e8ee;
2699 margin-top: -40px;
2700 }
2701 .wtotem_modal__logo {
2702 margin: 0 auto;
2703 }
2704 .wtotem_modal__wrap {
2705 width: 300px;
2706 display: flex;
2707 align-items: center;
2708 margin: 0 auto;
2709 margin-bottom: 18px;
2710 }
2711 .wtotem_modal__api-key {
2712 width: 100%;
2713 padding: 13px 30px 13px 15px!important;
2714 border: 2px solid #e1e8ee!important;
2715 border-radius: 2px!important;
2716 line-height: normal!important;
2717 }
2718 .wtotem_modal__api-key[type="text"]::-webkit-input-placeholder {
2719 font-weight: 500;
2720 font-size: 14px;
2721 line-height: 14px;
2722 color: #5e6977;
2723 }
2724 .wtotem_modal__api-key[type="text"]:-ms-input-placeholder {
2725 font-weight: 500;
2726 font-size: 14px;
2727 line-height: 14px;
2728 color: #5e6977;
2729 }
2730 .wtotem_modal__api-key[type="text"]::-ms-input-placeholder {
2731 font-weight: 500;
2732 font-size: 14px;
2733 line-height: 14px;
2734 color: #5e6977;
2735 }
2736 .wtotem_modal__api-key[type="text"]::placeholder {
2737 font-weight: 500;
2738 font-size: 14px;
2739 line-height: 14px;
2740 color: #5e6977;
2741 }
2742 .wtotem_modal__info {
2743 margin-left: -30px;
2744 }
2745 .wtotem_modal__btn {
2746 background: #4bc374;
2747 font-weight: 700;
2748 font-size: 14px;
2749 line-height: 16px;
2750 text-transform: uppercase;
2751 width: 300px;
2752 padding: 16px 0;
2753 border: none;
2754 color: #fff;
2755 }
2756 .wtotem_modal__desc {
2757 font-size: 12px;
2758 font-weight: 500;
2759 line-height: 16px;
2760 max-width: 274px;
2761 margin: 0 auto;
2762 color: #5e6977;
2763 }
2764 .wtotem_modal__cabinet {
2765 color: #3d50df;
2766 }
2767
2768 .wtotem_welcome-bottom {
2769 text-align: center;
2770 }
2771 .wtotem_welcome-bottom__logo {
2772 margin-bottom: 26px;
2773 }
2774 .wtotem_welcome-bottom__label {
2775 margin-bottom: 20px;
2776 }
2777 .wtotem_welcome-bottom__block {
2778 width: 54px;
2779 display: flex;
2780 justify-content: space-between;
2781 margin: 0 auto;
2782 }
2783
2784 /* 375-576px Extra small */
2785 /* 320-375px Extra small */
2786 @media screen and (max-width: 375px) {
2787 .wtotem_modal__window {
2788 width: 345px;
2789 }
2790 }
2791
2792 /* 320-375px Extra small */
2793 @media screen and (max-width: 355px) {
2794 .wtotem_modal__window {
2795 width: 320px;
2796 }
2797 .wtotem_modal__wrap,
2798 .wtotem_modal__btn {
2799 width: 85%;
2800 }
2801 }
2802
2803 @media screen and (max-width: 330px) {
2804 .wtotem_modal__window {
2805 width: 305px;
2806 }
2807 }
2808
2809 /*# options.css */
2810
2811 .wtotem_item {
2812 margin-bottom: 23px; }
2813
2814 .wtotem_holder {
2815 display: flex;
2816 justify-content: space-between; }
2817 .wtotem_holder__content {
2818 width: 70%; }
2819 .wtotem_holder__sidebar {
2820 width: 27.8431372549%; }
2821
2822 .wtotem_option {
2823 margin-bottom: 12px;
2824 padding: 28px 24px 24px 24px;
2825 display: flex;
2826 align-items: center;
2827 justify-content: space-between;
2828 width: 100%; }
2829 .wtotem_option:last-child {
2830 margin-bottom: 0; }
2831 .wtotem_option__title {
2832 margin-bottom: 7px;
2833 color: #1d293f;
2834 font-size: 14px;
2835 font-weight: 500; }
2836 .wtotem_option__text {
2837 width: 495px;
2838 font-size: 12px;
2839 color: #5e6977;
2840 line-height: 16px; }
2841
2842 .wtotem_control {
2843 padding: 16px 22px 24px 22px; }
2844 .wtotem_control__title {
2845 color: #1d293f;
2846 font-size: 14px;
2847 font-weight: 500;
2848 margin-bottom: 18px; }
2849 .wtotem_control__block {
2850 padding: 12px 8px;
2851 display: flex;
2852 align-items: center;
2853 background: #f3f5f6;
2854 border-radius: 5px;
2855 margin-bottom: 12px;
2856 width: 100%; }
2857 .wtotem_control__block_switch {
2858 justify-content: space-between;
2859 align-items: center; }
2860 .wtotem_control__circle {
2861 margin-right: 4px;
2862 width: 16px;
2863 height: 16px;
2864 border-radius: 100px;
2865 display: flex;
2866 align-items: center;
2867 justify-content: center;
2868 background: #4bc374; }
2869 .wtotem_control__circle img {
2870 width: 7px;
2871 height: 7px; }
2872 .wtotem_control__name {
2873 color: #5e6977; }
2874 .wtotem_control__trash {
2875 width: 15px;
2876 height: 15px;
2877 background: url("../img/trash.svg") no-repeat center center/cover;
2878 margin-left: auto;
2879 cursor: pointer; }
2880 .wtotem_control__btn {
2881 color: #fff;
2882 display: block;
2883 width: 100%;
2884 height: 42px;
2885 display: flex;
2886 align-items: center;
2887 justify-content: center;
2888 background: #4bc374;
2889 border-radius: 5px;
2890 transition: all 0.2s ease-in-out;
2891 border: none;
2892 cursor: pointer; }
2893 .wtotem_control__btn:hover {
2894 transition: all 0.2s ease-in-out;
2895 background: #f3f5f6;
2896 color: #5e6977; }
2897 .wtotem_control__label {
2898 position: relative;
2899 width: 41px;
2900 height: 23px;
2901 border-radius: 100px;
2902 background: #1f2323;
2903 padding: 4px 7px;
2904 display: flex;
2905 justify-content: space-between;
2906 align-items: center;
2907 cursor: pointer; }
2908 .wtotem_control__label:before, .wtotem_control__label:after {
2909 content: "";
2910 display: block;
2911 position: relative;
2912 z-index: 2; }
2913 .wtotem_control__label:before {
2914 width: 8px;
2915 height: 8px;
2916 background: url("../img/checkbox-sun.svg") no-repeat center center/cover; }
2917 .wtotem_control__label:after {
2918 width: 6px;
2919 height: 6px;
2920 background: url("../img/checkbox-moon.svg") no-repeat center center/cover; }
2921 .wtotem_control__switched-circle {
2922 position: absolute;
2923 left: 4px;
2924 width: 15px;
2925 height: 15px;
2926 background: #fff;
2927 border-radius: 100px;
2928 display: block;
2929 z-index: 1;
2930 transition: all 0.3s ease-in-out; }
2931 .wtotem_control__input {
2932 display: none!important; }
2933 .wtotem_control__input:checked + label {
2934 background: #fff; }
2935 .wtotem_control__input:checked + label span {
2936 left: 23px;
2937 background: #3d50df; }
2938
2939 .onoff__input {
2940 display: none!important; }
2941
2942 .onoff__label {
2943 position: relative;
2944 display: flex;
2945 align-items: center;
2946 width: 43px;
2947 height: 23px;
2948 border-radius: 100px;
2949 padding: 4px;
2950 background: #f4f4f4;
2951 overflow: hidden;
2952 cursor: pointer; }
2953 .onoff__label:before, .onoff__label:after {
2954 position: absolute;
2955 font-weight: 500;
2956 font-size: 9px;
2957 transition: all 0.3s ease-in-out; }
2958 .onoff__label:before {
2959 content: "ON";
2960 color: #3d50df;
2961 left: -100%; }
2962 .onoff__label:after {
2963 content: "OFF";
2964 color: #979797;
2965 right: 4px; }
2966
2967 .onoff__circle {
2968 position: absolute;
2969 left: 4px;
2970 width: 15px;
2971 height: 15px;
2972 border-radius: 100px;
2973 background: #c4c4c4;
2974 transition: all 0.3s ease-in-out; }
2975
2976 .onoff__input:checked + label .onoff__circle {
2977 background: #3d50df;
2978 left: 22px; }
2979
2980 .onoff__input:checked + label:before {
2981 left: 4px; }
2982
2983 .onoff__input:checked + label:after {
2984 right: -100%; }
2985
2986 /* 992-1100px lg Large */
2987 @media screen and (max-width: 1100px) {
2988 .wtotem_option__text {
2989 width: 95%; } }
2990
2991 /* 768-992px md Medium */
2992 @media screen and (max-width: 992px) {
2993 .wtotem_holder {
2994 flex-direction: column; }
2995 .wtotem_holder__content {
2996 width: 100%;
2997 margin-bottom: 30px; }
2998 .wtotem_holder__sidebar {
2999 width: 100%; } }
3000
3001 /* 576-768px sm Small */
3002 /* 375-576px Extra small */
3003 @media screen and (max-width: 576px) {
3004 .wtotem_holder__content {
3005 margin-bottom: 20px; } }
3006
3007 /* 320-375px Extra small */
3008
3009 /*# options.css */
3010
3011
3012 .wtotem_offer {
3013 display: flex;
3014 justify-content: space-between;
3015 align-items: center;
3016 padding: 40px 56px 37px 40px;
3017 margin-bottom: 110px;
3018 }
3019 .wtotem_offer__title {
3020 margin-bottom: 22px;
3021 font-size: 24px;
3022 color: #1d293f;
3023 font-weight: 500;
3024 }
3025 .wtotem_offer__text {
3026 width: 601px;
3027 margin-bottom: 22px;
3028 font-size: 16px;
3029 color: #5e6977;
3030 line-height: 24px;
3031 }
3032 .wtotem_offer__btn {
3033 color: #fff;
3034 background: #3d50df;
3035 border-radius: 5px;
3036 width: 151px;
3037 height: 42px;
3038 display: flex;
3039 align-items: center;
3040 justify-content: center;
3041 border: none;
3042 cursor: pointer;
3043 }
3044
3045 /* 992-1100px lg Large */
3046 /* 768-992px md Medium */
3047 @media screen and (max-width: 992px) {
3048 .wtotem_offer__title {
3049 line-height: 32px;
3050 margin-bottom: 20px;
3051 }
3052 .wtotem_offer__text {
3053 width: 100%;
3054 }
3055 }
3056
3057 /* 576-768px sm Small */
3058 @media screen and (max-width: 768px) {
3059 .wtotem_offer {
3060 padding: 20px;
3061 }
3062 .wtotem_offer__img {
3063 display: none;
3064 }
3065 }
3066
3067
3068
3069 .wtotem-ss__wrapper {
3070 display: grid;
3071 grid-template-columns: auto auto;
3072 gap: 15px; }
3073
3074 @media screen and (max-width: 768px) {
3075 .wtotem-ss__period-wrapper {
3076 width: 100%;
3077 margin-top: 10px; }
3078 .wtotem-ss__wrapper {
3079 grid-template-columns: 1fr;
3080 gap: 0; } }
3081
3082 .wtotem-ss__cpu-card {
3083 margin-bottom: 0; }
3084 @media screen and (max-width: 768px) {
3085 .wtotem-ss__cpu-card {
3086 margin-bottom: 30px; } }
3087
3088 .wtotem-ss-info {
3089 padding: 25px; }
3090 .wtotem-ss-info__stats-list {
3091 display: grid;
3092 grid-template-columns: 1fr 1fr 1fr;
3093 gap: 50px;
3094 font-size: 14px;
3095 line-height: 17px; }
3096 .wtotem-ss-info__stats-list dt {
3097 font-weight: bold; }
3098 @media screen and (max-width: 768px) {
3099 .wtotem-ss-info__stats-list {
3100 grid-template-columns: 1fr;
3101 gap: 0; } }
3102 .wtotem-ss-info__stat-wrapper {
3103 display: flex;
3104 justify-content: space-between;
3105 flex-wrap: wrap;
3106 margin-bottom: 10px; }
3107 .wtotem-ss-info__stat-wrapper:last-child {
3108 margin-bottom: 0; }
3109 @media screen and (max-width: 992px) {
3110 .wtotem-ss-info__stat-wrapper {
3111 display: block; } }
3112 @media screen and (max-width: 768px) {
3113 .wtotem-ss-info__stat-wrapper {
3114 display: flex; }
3115 .wtotem-ss-info__stat-wrapper:last-child {
3116 margin-bottom: 10px; } }
3117
3118 .wtotem-ss-disc {
3119 margin-bottom: 0px;
3120 height: 100%;
3121 display: flex;
3122 flex-direction: column; }
3123 .wtotem-ss-disc__header {
3124 margin-bottom: 15px; }
3125 .wtotem-ss-disc__line {
3126 margin-bottom: 10px; }
3127 .wtotem-ss-disc__content {
3128 display: flex;
3129 padding: 0 25px;
3130 flex-grow: 1;
3131 justify-content: center;
3132 align-items: center; }
3133 .wtotem-ss-disc__wrapper {
3134 display: flex;
3135 flex-direction: column;
3136 justify-content: center;
3137 align-items: center;
3138 margin-right: 15px; }
3139 .wtotem-ss-disc__totals {
3140 display: flex;
3141 font-weight: 500;
3142 font-size: 14px;
3143 line-height: 17px; }
3144 .wtotem-ss-disc__totals-caption {
3145 margin-right: 10px; }
3146 .wtotem-ss-disc__totals-value {
3147 font-weight: 600; }
3148 .wtotem-ss-disc__legend-item {
3149 padding-top: 15px;
3150 position: relative;
3151 margin-bottom: 20px; }
3152 .wtotem-ss-disc__legend-item:last-child {
3153 margin-bottom: 0; }
3154 .wtotem-ss-disc__legend-item::before {
3155 content: "";
3156 display: block;
3157 width: 20px;
3158 height: 4px;
3159 left: 0;
3160 top: 0;
3161 position: absolute;
3162 background: #3D50DF;
3163 border-radius: 14px; }
3164 .wtotem-ss-disc__legend-item--free::before {
3165 background: #3D50DF; }
3166 .wtotem-ss-disc__legend-item--use::before {
3167 background: #5E6977; }
3168 .wtotem-ss-disc__legend-value {
3169 font-weight: 600;
3170 font-size: 18px;
3171 line-height: 22px;
3172 margin-bottom: 10px; }
3173 .wtotem-ss-disc__legend-caption {
3174 font-weight: 500;
3175 font-size: 14px;
3176 line-height: 17px; }
3177
3178 .wtotem-loader {
3179 display: flex;
3180 flex-direction: column;
3181 align-items: center;
3182 justify-content: center;
3183 z-index: 1; }
3184 .wtotem-loader__wrapper {
3185 display: flex;
3186 justify-content: center;
3187 align-items: center;
3188 width: 54px;
3189 height: 54px;
3190 background: #e5ebf0;
3191 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.005);
3192 border-radius: 12px;
3193 margin-bottom: 20px; }
3194 .wtotem-loader__text {
3195 line-height: 24px;
3196 font-size: 14px; }
3197 .wtotem-loader__text--blue {
3198 color: #3d50df; }
3199 .wtotem-loader__dots {
3200 display: flex;
3201 justify-content: space-between; }
3202 .wtotem-loader__dots span {
3203 border-radius: 50%;
3204 opacity: 0.2;
3205 background: #3d50df;
3206 width: 6px;
3207 height: 6px;
3208 display: block; }
3209 .wtotem-loader__dots span:first-child {
3210 animation: fball 1350ms infinite linear; }
3211 .wtotem-loader__dots span:nth-child(2) {
3212 animation: sball 1350ms infinite linear; }
3213 .wtotem-loader__dots span:last-child {
3214 animation: tball 1350ms infinite linear; }
3215
3216 @keyframes fball {
3217 0% {
3218 opacity: 0;
3219 transform: scale(0.5); }
3220 13% {
3221 opacity: 0.9;
3222 transform: scale(1.03); }
3223 26% {
3224 opacity: 1;
3225 transform: scale(0.95); }
3226 33% {
3227 transform: scale(1); }
3228 34% {
3229 opacity: 0.2; } }
3230
3231 @keyframes sball {
3232 32% {
3233 opacity: 0.2;
3234 transform: scale(1); }
3235 33% {
3236 opacity: 0;
3237 transform: scale(0.5); }
3238 46% {
3239 opacity: 0.9;
3240 transform: scale(1.03); }
3241 59% {
3242 opacity: 1;
3243 transform: scale(0.95); }
3244 66% {
3245 transform: scale(1); }
3246 67% {
3247 opacity: 0.2; } }
3248
3249 @keyframes tball {
3250 67% {
3251 opacity: 0.2;
3252 transform: scale(1); }
3253 68% {
3254 opacity: 0;
3255 transform: scale(0.5); }
3256 81% {
3257 opacity: 0.9;
3258 transform: scale(1.03); }
3259 94% {
3260 opacity: 1;
3261 transform: scale(0.95); }
3262 100% {
3263 transform: scale(1); } }
3264
3265 .wtotem-waf-settings-popup {
3266 background: #FFFFFF;
3267 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
3268 border-radius: 10px;
3269 width: 280px;
3270 padding: 15px 24px; }
3271 .wtotem-waf-settings-popup__title {
3272 font-weight: 500;
3273 font-size: 14px;
3274 line-height: 24px;
3275 margin-bottom: 20px; }
3276 .wtotem-waf-settings-popup__label {
3277 display: block;
3278 font-weight: 500;
3279 font-size: 14px;
3280 line-height: 24px;
3281 margin-bottom: 10px; }
3282 .wtotem-waf-settings-popup__input {
3283 display: block;
3284 font-size: 12px;
3285 line-height: 22px;
3286 padding: 5px 10px;
3287 border: 2px solid #86939E;
3288 box-sizing: border-box;
3289 border-radius: 8px;
3290 width: 100%;
3291 margin-bottom: 20px; }
3292 .wtotem-waf-settings-popup__save {
3293 padding: 12px 48px;
3294 width: 100%;
3295 text-transform: none;
3296 font-weight: normal;
3297 font-size: 14px;
3298 line-height: 12px; }
3299
3300 /* 375-576px Extra small */
3301 /* 320-375px Extra small */
3302 .wtotem_ready {
3303 background: #e5e5e5;
3304 }
3305
3306 .wtotem_unit__first {
3307 display: flex;
3308 justify-content: space-between;
3309 }
3310
3311 .wtotem_unit__wrapper {
3312 display: flex;
3313 justify-content: space-between;
3314 background: #fff;
3315 }
3316
3317 .wtotem_unit__block {
3318 display: flex;
3319 justify-content: space-between;
3320 align-items: center;
3321 width: 100%;
3322 padding: 30px 30px;
3323 border-right: 1px solid #f3f5f6;
3324 }
3325
3326 .wtotem_unit__contain {
3327 display: flex;
3328 justify-content: space-between;
3329 align-items: center;
3330 }
3331
3332 .wtotem_unit__circle {
3333 margin-right: 16px;
3334 width: 45px;
3335 height: 45px;
3336 border-radius: 100px;
3337 display: flex;
3338 align-items: center;
3339 justify-content: center;
3340 }
3341 /*.wtotem_unit__circle_loading {*/
3342 /*background: #f3f5f6;*/
3343 /*}*/
3344 .wtotem_unit__circle_success {
3345 background: #4bc374;
3346 }
3347 .wtotem_unit__circle_error {
3348 background: #ee3f3f;
3349 position: relative;
3350 }
3351 .wtotem_unit__circle_error:before {
3352 content: "";
3353 position: absolute;
3354 width: 19px;
3355 height: 3px;
3356 background: #fff;
3357 border-radius: 1px;
3358 display: block;
3359 transform: rotate(45deg);
3360 }
3361 .wtotem_unit__circle_error:after {
3362 content: "";
3363 position: absolute;
3364 width: 19px;
3365 height: 3px;
3366 background: #fff;
3367 border-radius: 1px;
3368 display: block;
3369 transform: rotate(-45deg);
3370 }
3371
3372 .wtotem_unit__img_spinner {
3373 animation: 1s linear 0s normal none infinite running rot;
3374 -webkit-animation: 1s linear 0s normal none infinite running rot;
3375 }
3376
3377 @keyframes rot {
3378 0% {
3379 transform: rotate(0deg);
3380 }
3381 100% {
3382 transform: rotate(360deg);
3383 }
3384 }
3385
3386 @-webkit-keyframes rot {
3387 0% {
3388 transform: rotate(0deg);
3389 }
3390 100% {
3391 transform: rotate(360deg);
3392 }
3393 }
3394
3395 .wtotem_unit__expectation {
3396 font-size: 16px;
3397 font-weight: 500;
3398 }
3399 .wtotem_unit__expectation_loading {
3400 color: #7c8087;
3401 }
3402 .wtotem_unit__expectation_success {
3403 color: #bace3d;
3404 }
3405 .wtotem_unit__expectation_error {
3406 color: #d56c6a;
3407 }
3408
3409 .wtotem_unit__repeat {
3410 color: #3d50df;
3411 cursor: pointer;
3412 }
3413
3414 .wtotem_layout {
3415 background: #e5e5e5;
3416 }
3417
3418 .wtotem_alert {
3419 padding: 17px 22px;
3420 display: flex;
3421 justify-content: space-between;
3422 align-items: center;
3423 background: #fff;
3424 border-radius: 4px;
3425 margin-bottom: 30px;
3426 }
3427 .wtotem_alert__desc {
3428 display: flex;
3429 align-items: center;
3430 }
3431 .wtotem_alert__img {
3432 margin-right: 5px;
3433 display: flex;
3434 align-items: center;
3435 justify-content: center;
3436 }
3437 .wtotem_alert__img_cross {
3438 width: 16px;
3439 height: 16px;
3440 border-radius: 100px;
3441 display: flex;
3442 align-items: center;
3443 justify-content: center;
3444 background: #ee3f3f;
3445 }
3446 .wtotem_alert__img_cross:before {
3447 content: "";
3448 position: absolute;
3449 display: block;
3450 width: 8px;
3451 height: 1.3px;
3452 border-radius: 1px;
3453 transform: rotate(45deg);
3454 background: #fff;
3455 }
3456 .wtotem_alert__img_cross:after {
3457 content: "";
3458 position: absolute;
3459 display: block;
3460 width: 8px;
3461 height: 1.3px;
3462 border-radius: 1px;
3463 transform: rotate(-45deg);
3464 background: #fff;
3465 }
3466 .wtotem_alert__title {
3467 font-size: 12px;
3468 text-transform: uppercase;
3469 }
3470 .wtotem_alert__title_yellow {
3471 color: #f5c451;
3472 }
3473 .wtotem_alert__title_green {
3474 color: #4bc374;
3475 }
3476 .wtotem_alert__title_red {
3477 color: #ee3f3f;
3478 }
3479 .wtotem_alert__text {
3480 color: #1d293f;
3481 font-size: 12px;
3482 }
3483 .wtotem_alert__close {
3484 position: relative;
3485 width: 10px;
3486 height: 10px;
3487 display: flex;
3488 justify-self: center;
3489 align-items: center;
3490 cursor: pointer;
3491 }
3492 .wtotem_alert__close:before {
3493 content: "";
3494 position: absolute;
3495 display: block;
3496 width: 10px;
3497 height: 2px;
3498 border-radius: 1px;
3499 transform: rotate(45deg);
3500 background: #000;
3501 }
3502 .wtotem_alert__close:after {
3503 content: "";
3504 position: absolute;
3505 display: block;
3506 width: 10px;
3507 height: 2px;
3508 border-radius: 1px;
3509 transform: rotate(-45deg);
3510 background: #000;
3511 }
3512
3513 /* 576-768px sm Small */
3514 @media screen and (max-width: 768px) {
3515 .wtotem_alert {
3516 margin-bottom: 20px;
3517 }
3518 }
3519
3520 /* 320-576px Extra small */
3521 .line-chart .axis line {
3522 stroke: #f0f0f0;
3523 }
3524
3525 .line-chart .axis path {
3526 stroke: #f0f0f0;
3527 }
3528
3529 .line-chart .axis text {
3530 fill: #5e6977;
3531 }
3532
3533 .line-chart .grid line {
3534 stroke: #f0f0f0;
3535 }
3536
3537 .line-chart .listening-rect {
3538 fill: transparent;
3539 }
3540
3541 .line-chart__tooltip {
3542 opacity: 0;
3543 position: absolute;
3544 top: -25px;
3545 left: -17px;
3546 padding: 0.2em 0.5em;
3547 background: #1d293f;
3548 text-align: center;
3549 line-height: 1.4em;
3550 font-size: 0.9em;
3551 z-index: 10;
3552 transition: all 0.1s ease-out;
3553 pointer-events: none;
3554 color: #fff;
3555 font-family: Inter, Gilroy, Helvetica, sans-serif;
3556 border-radius: 2px;
3557 min-width: 28px;
3558 }
3559
3560 .line-chart__tooltip:before {
3561 content: "";
3562 position: absolute;
3563 bottom: 0;
3564 left: 50%;
3565 width: 12px;
3566 height: 12px;
3567 background: #1d293f;
3568 border-top-color: transparent;
3569 border-left-color: transparent;
3570 transform: translate(-50%, 50%) rotate(45deg);
3571 transform-origin: center center;
3572 z-index: 10;
3573 }
3574
3575 .line-chart {
3576 position: relative;
3577 }
3578
3579
3580 .wtotem_theme—dark .wtotem_body{
3581 background: #191919;
3582 color: #e2e2e2;
3583 }
3584 .wtotem_theme—dark .wt_card,
3585 .wtotem_theme—dark .wt_card:before,
3586 .wtotem_theme—dark .wtotem_chart-first__btn_active {
3587 background: #282828;
3588 }
3589
3590 .wtotem_theme—dark .wtotem_content,
3591 .wtotem_theme—dark .wtotem_footer,
3592 .wtotem_theme—dark .wtotem_chart-first__right,
3593 .wtotem_theme—dark .wtotem_control__block,
3594 .wtotem_theme—dark .wtotem_state__select,
3595 .wtotem_theme—dark .wtotem_chart__calendars{
3596 background: #191919;
3597 }
3598
3599 .wtotem_theme—dark .wtotem_version__count {
3600 border: 1px solid #f3f5f6;
3601 }
3602
3603 .wtotem_theme—dark .wtotem_logo {
3604 background: url("../img/dr-logo.svg") no-repeat center center/cover;
3605 }
3606
3607 .wtotem_theme—dark .wtotem_nav__link,
3608 .wtotem_theme—dark .wtotem_nav__link_active,
3609 .wtotem_theme—dark .wtotem_version__count,
3610 .wtotem_theme—dark .title,
3611 .wtotem_theme—dark .wtotem_title-info__title,
3612 .wtotem_theme—dark .wtotem_overall__text,
3613 .wtotem_theme—dark .wtotem_info__subtitle,
3614 .wtotem_theme—dark .wtotem_info__info,
3615 .wtotem_theme—dark .wtotem_numbers__figures,
3616 .wtotem_theme—dark .wtotem_from__country,
3617 .wtotem_theme—dark .wtotem_from__country span,
3618 .wtotem_theme—dark .wtotem_data__th,
3619 .wtotem_theme—dark .wtotem_antivirus__title,
3620 .wtotem_theme—dark .wtotem_table__title,
3621 .wtotem_theme—dark .wtotem_table__subject,
3622 .wtotem_theme—dark .wtotem_table__text,
3623 .wtotem_theme—dark .wtotem_table__perfomance,
3624 .wtotem_theme—dark .wtotem_footer__text,
3625 .wtotem_theme—dark .wtotem_footer__text,
3626 .wtotem_theme—dark .wtotem_chart__btn,
3627 .wtotem_theme—dark .wtotem_antivirus__item:last-child div,
3628 .wtotem_theme—dark .wtotem_from__percent,
3629 .wtotem_theme—dark .wtotem_chart-first__all,
3630 .wtotem_theme—dark .wtotem_chart-first__hack p,
3631 .wtotem_theme—dark .wtotem_chart-first__btn_active,
3632 .wtotem_theme—dark .wtotem_chart__text,
3633 .wtotem_theme—dark .wtotem_table__initial-value,
3634 .wtotem_theme—dark .arrow-right,
3635 .wtotem_theme—dark .wtotem_print__label,
3636 .wtotem_theme—dark .wtotem_state__text,
3637 .wtotem_theme—dark .wtotem_pagination__number,
3638 .wtotem_theme—dark .wtotem_data__td,
3639 .wtotem_theme—dark .wtotem_file-table__th,
3640 .wtotem_theme—dark .wtotem_file-table,
3641 .wtotem_theme—dark .wtotem_option__title,
3642 .wtotem_theme—dark .wtotem_option__text,
3643 .wtotem_theme—dark .wtotem_control__title,
3644 .wtotem_theme—dark .wtotem_control__name,
3645 .wtotem_theme—dark .onoff__label:after,
3646 .wtotem_theme—dark .onoff__label:before,
3647 .wtotem_theme—dark .wtotem_offer__title,
3648 .wtotem_theme—dark .wtotem_offer__text,
3649 .wtotem_theme—dark .wtotem_unit__expectation_loading,
3650 .wtotem_theme—dark .wtotem_alert__text {
3651 color: #f3f5f6;
3652 }
3653
3654 .wtotem_theme—dark .wtotem_data__ip {
3655 color: #86939e;
3656 }
3657
3658 .wtotem_theme—dark .wtotem_chart__btn {
3659 border: 1px solid #f3f5f6;
3660 }
3661
3662 .wtotem_theme—dark .wtotem_title-info__info {
3663 background: url("../img/dr-info.svg") no-repeat center center/cover;
3664 }
3665
3666 .wtotem_theme—dark .wtotem_nav__link_active {
3667 color: #3d50df;
3668 }
3669
3670 .wtotem_theme—dark .wtotem_info__item:first-child,
3671 .wtotem_theme—dark .wtotem_numbers__item,
3672 .wtotem_theme—dark .wtotem_antivirus__item,
3673 .wtotem_theme—dark .wtotem_unit__block {
3674 border-right: 1px solid #3c3c3d;
3675 }
3676
3677 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
3678 border-right: none;
3679 }
3680
3681 .wtotem_theme—dark .wtotem_numbers__item:last-child {
3682 border-right: none;
3683 }
3684
3685 .wtotem_theme—dark .wtotem_table__col {
3686 border-right: 1px solid #3c3c3d;
3687 border-bottom: 1px solid #3c3c3d;
3688 }
3689
3690 .wtotem_theme—dark .wtotem_table__col:last-child {
3691 border-right: none;
3692 }
3693
3694 .wtotem_theme—dark .wtotem_chart__line {
3695 background: #3c3c3d;
3696 }
3697
3698 .wtotem_theme—dark .wtotem_table__th,
3699 .wtotem_theme—dark .wtotem_table__td {
3700 border-bottom: 1px solid #3c3c3d;
3701 }
3702
3703 .wtotem_theme—dark .wtotem_table__link:after {
3704 content: "";
3705 border: solid #fff;
3706 border-width: 0 1.5px 1.5px 0;
3707 transform: rotate(-45deg);
3708 -webkit-transform: rotate(-45deg);
3709 }
3710
3711 .wtotem_theme—dark .arrow-right:after {
3712 content: "";
3713 border: solid #f3f5f6;
3714 border-width: 0 1px 1px 0;
3715 transform: rotate(-45deg);
3716 -webkit-transform: rotate(-45deg);
3717 margin-left: 10px;
3718 }
3719
3720 .wtotem_theme—dark .wtotem_footer__line,
3721 .wtotem_theme—dark .wtotem_state__line {
3722 background: #2d2e2e;
3723 }
3724
3725 .wtotem_theme—dark .wtotem_footer__app-store {
3726 width: 19px;
3727 height: 19px;
3728 background: url("../img/dr-app-store.svg") no-repeat center center/cover;
3729 }
3730
3731 .wtotem_theme—dark .wtotem_footer__play-store {
3732 width: 17px;
3733 height: 19px;
3734 background: url("../img/dr-play-store.svg") no-repeat center center/cover;
3735 }
3736
3737 .wtotem_theme—dark .wtotem_footer__logo {
3738 background: url("../img/dr-logo-footer.svg") no-repeat center center/cover;
3739 }
3740
3741 .wtotem_theme—dark .line-chart__tooltip,
3742 .wtotem_theme—dark .line-chart__tooltip::before {
3743 background: #3d50df;
3744 }
3745
3746 .wtotem_theme—dark .wtotem_firewall__icon {
3747 background: url("../img/dr-shape.svg") no-repeat center center/cover;
3748 }
3749
3750 .wtotem_theme—dark .wtotem_pagination__number_active {
3751 background: #5a5c5e;
3752 }
3753
3754 .wtotem_pagination__number:hover {
3755 color: #5e6977;
3756 transition: all 0.2s ease;
3757 }
3758
3759 .wtotem_theme—dark .onoff__label {
3760 background: #686868;
3761 }
3762
3763 .wtotem_theme—dark .wtotem_print__img {
3764 background: url("../img/dr-print.svg") no-repeat center center/cover;
3765 }
3766
3767 .wtotem_theme—dark .wtotem_control__trash {
3768 background: url("../img/dr-trash.svg") no-repeat center center/cover;
3769 }
3770
3771 .wtotem_theme—dark .onoff__input:checked + label .onoff__circle {
3772 background: #4bc374;
3773 }
3774
3775 .wtotem_theme—dark .onoff__circle {
3776 background: #ec6d62;
3777 }
3778
3779 .wtotem_theme—dark .wtotem_alert__close:before,
3780 .wtotem_theme—dark .wtotem_alert__close:after {
3781 background: #dadada;
3782 }
3783
3784 .wtotem_theme—dark .wtotem-waf-settings-popup{
3785 background: #282828;
3786 color: #e2e2e2;
3787 }
3788
3789 .wtotem_theme—dark .wtotem-waf-settings-popup__input{
3790 border: 1px solid #333333;
3791 background-color: #191919;
3792 color: #ffffff;
3793 }
3794
3795 .wtotem_theme—dark .wtotem_antivirus__figures_black{
3796 color: #5a7bb7;
3797 }
3798
3799 .wtotem_info__item .arrow-right {
3800 color: #3d50df;
3801 }
3802 .wtotem_info__item .arrow-right:after {
3803 content: "";
3804 border: solid #3d50df;
3805 border-width: 0 1px 1px 0;
3806 transform: rotate(-45deg);
3807 -webkit-transform: rotate(-45deg);
3808 margin-left: 10px;
3809 }
3810
3811
3812
3813 /* 320-576px Extra small */
3814 @media screen and (max-width: 576px) {
3815 .wtotem_theme—dark .wtotem_info__item:first-child {
3816 border-right: none;
3817 }
3818 .wtotem_theme—dark .wtotem_antivirus__item {
3819 border-bottom: 1px solid #3c3c3d;
3820 }
3821 .wtotem_theme—dark .wtotem_numbers__item:last-child {
3822 border-right: 1px solid #3c3c3d;
3823 }
3824 .wtotem_theme—dark .wtotem_numbers__item:nth-child(2) {
3825 border-right: none;
3826 }
3827 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
3828 border-right: none;
3829 border-bottom: none;
3830 }
3831 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(2) {
3832 border-right: none;
3833 }
3834 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(3) {
3835 border-bottom: none;
3836 }
3837 }
3838
3839 .wtotem_theme—dark #disk-chart svg path {
3840 stroke: #282828;
3841 }
3842
3843 /* 992-1100px lg Large */
3844 @media screen and (max-width: 1100px) {
3845 .wtotem_container {
3846 max-width: 960px;
3847 }
3848 }
3849
3850 /* 768-992px md Medium */
3851 @media screen and (max-width: 992px) {
3852 .wtotem_container {
3853 max-width: 720px;
3854 }
3855 }
3856
3857 /* 576-768px sm Small */
3858 @media screen and (max-width: 768px) {
3859 .wtotem_container {
3860 max-width: 540px;
3861 }
3862 .wtotem_content {
3863 padding-top: 19px;
3864 }
3865 }
3866
3867 /* 375-576px Extra small */
3868 @media screen and (max-width: 576px) {
3869 .wtotem_container {
3870 max-width: 345px;
3871 }
3872 }
3873
3874 /* 320-375px Extra small */
3875 @media screen and (max-width: 374px) {
3876 .wtotem_container {
3877 max-width: auto;
3878 padding: 0 10px;
3879 }
3880 }
3881
3882 /* 992-1100px lg Large */
3883 /* 768-992px md Medium */
3884 /* 576-768px sm Small */
3885 /* 375-576px Extra small */
3886 /* 320-375px Extra small */
3887
3888 /*# sourceMappingURL=main.css.map */
3889
3890 /*tlite */
3891 .tlite {
3892 background: #111;
3893 color: #fff;
3894 font-family: sans-serif;
3895 font-size: 0.8rem;
3896 font-weight: normal;
3897 text-decoration: none;
3898 text-align: left;
3899 padding: 0.6em 0.75rem;
3900 border-radius: 4px;
3901 position: absolute;
3902 opacity: 0;
3903 visibility: hidden;
3904 transition: opacity 0.4s;
3905 max-width: 350px;
3906 box-shadow: 0 0.5rem 1rem -0.5rem #000;
3907 z-index: 1000;
3908 -webkit-backface-visibility: hidden;
3909 }
3910 .tlite-table td,
3911 .tlite-table th {
3912 position: relative;
3913 }
3914 .tlite-visible {
3915 visibility: visible;
3916 opacity: 0.9;
3917 }
3918 .tlite::before {
3919 content: " ";
3920 display: block;
3921 background: inherit;
3922 width: 10px;
3923 height: 10px;
3924 position: absolute;
3925 transform: rotate(45deg);
3926 }
3927 .tlite-n::before {
3928 top: -3px;
3929 left: 50%;
3930 margin-left: -5px;
3931 }
3932 .tlite-nw::before {
3933 top: -3px;
3934 left: 10px;
3935 }
3936 .tlite-ne::before {
3937 top: -3px;
3938 right: 10px;
3939 }
3940 .tlite-s::before {
3941 bottom: -3px;
3942 left: 50%;
3943 margin-left: -5px;
3944 }
3945 .tlite-se::before {
3946 bottom: -3px;
3947 right: 10px;
3948 }
3949 .tlite-sw::before {
3950 bottom: -3px;
3951 left: 10px;
3952 }
3953 .tlite-w::before {
3954 left: -3px;
3955 top: 50%;
3956 margin-top: -5px;
3957 }
3958 .tlite-e::before {
3959 right: -3px;
3960 top: 50%;
3961 margin-top: -5px;
3962 }
3963 .is--status--ok {
3964 color: #4bc374;
3965 fill: #4bc374;
3966 }
3967 .is--status--error {
3968 color: #ee3f3f;
3969 fill: #ee3f3f;
3970 }
3971 .is--status--pending {
3972 color: #3d50df;
3973 fill: #3d50df;
3974 }
3975 .is--status--warning {
3976 color: #f5bf4f;
3977 fill: #f5bf4f;
3978 }
3979 .wtsec_score_red {
3980 color: #d56c6a;
3981 }
3982 .wtsec_score_orange {
3983 color: #c2b00e;
3984 }
3985 .wtsec_score_green {
3986 color: #7eb40c;
3987 }
3988 .wtsec_score_bg_red {
3989 background: #d56c6a;
3990 color: #fff;
3991 }
3992 .wtsec_score_bg_orange {
3993 background: #c2b00e;
3994 color: #fff;
3995 }
3996 .wtsec_score_bg_green {
3997 background: #7eb40c;
3998 color: #fff;
3999 }
4000 #wtotem_alert {
4001 margin-top: 20px;
4002 }
4003
4004 .ml-2 {
4005 margin-left: 20px;
4006 }
4007
4008 .wt-flex {
4009 display: flex;
4010 }
4011
4012 .wt-flex-middle {
4013 align-items: center;
4014 }
4015
4016 .wt-margin-right-10 {
4017 margin-right: 10px;
4018 }
4019 .break-word {
4020 overflow-wrap: break-word;
4021 word-wrap: break-word;
4022 word-break: break-all;
4023 }
4024
4025 select.wtotem_state__select {
4026 display: block;
4027 margin-left: 18px;
4028 width: 100%;
4029 padding: 14px 12px;
4030 color: #86939e;
4031 font-size: 14px;
4032 font-weight: 400;
4033 -webkit-appearance: none;
4034 appearance: none;
4035 background-color: #f3f5f6;
4036 background-image: none;
4037 border-radius: 4px;
4038 border: none;
4039 font-family: inherit;
4040 cursor: pointer;
4041 line-height: normal;
4042 }
4043
4044 .wtotem_unit {
4045 margin-bottom: 30px;
4046 }
4047
4048 .wtotem_table__text {
4049 margin-left: 15px;
4050 word-break: break-all;
4051 }
4052 .wt-margin-20{
4053 margin: 20px;
4054 }
4055 .wt-margin-bottom-15{
4056 margin-bottom: 15px;
4057 }
4058 .wtotem_av_filters_wrapper{
4059 justify-content: space-between;
4060 display: flex;
4061 }
4062
4063 .wt_flag{
4064 width: 24px;
4065 }
4066
4067
4068 .wtotem_theme—dark input.wtotem_calendar {
4069 color: #cccccc;
4070 }
4071
4072
4073 .wtotem_theme—dark .flatpickr-calendar{
4074 background: #282828;
4075 border: 2px solid #191919;
4076 }
4077
4078 .wtotem_theme—dark .flatpickr-day{
4079 color: #cccccc;
4080 }
4081
4082 .wtotem_theme—dark .flatpickr-monthDropdown-months, .wtotem_theme—dark .flatpickr-current-month input.cur-year{
4083 color: #cccccc !important;
4084 }
4085
4086 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{
4087 background-color: #282828;
4088 }
4089 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months,
4090 .wtotem_theme—dark .flatpickr-monthDropdown-months, .wtotem_theme—dark .flatpickr-current-month input.cur-year{
4091 border: 1.6px solid #545454;
4092 }
4093
4094 .wtotem_theme—dark .flatpickr-day.inRange, .wtotem_theme—dark .flatpickr-day.today.inRange{
4095 background: #656565;
4096 color: #fff;
4097 border-color: #656565;
4098 }
4099
4100 .wtotem_theme—dark .flatpickr-day.inRange,
4101 .wtotem_theme—dark .flatpickr-day.prevMonthDay.inRange,
4102 .wtotem_theme—dark .flatpickr-day.nextMonthDay.inRange,
4103 .wtotem_theme—dark .flatpickr-day.today.inRange,
4104 .wtotem_theme—dark .flatpickr-day.prevMonthDay.today.inRange,
4105 .wtotem_theme—dark .flatpickr-day.nextMonthDay.today.inRange,
4106 .wtotem_theme—dark .flatpickr-day:hover,
4107 .wtotem_theme—dark .flatpickr-day.prevMonthDay:hover,
4108 .wtotem_theme—dark .flatpickr-day.nextMonthDay:hover,
4109 .wtotem_theme—dark .flatpickr-day:focus,
4110 .wtotem_theme—dark .flatpickr-day.prevMonthDay:focus,
4111 .wtotem_theme—dark .flatpickr-day.nextMonthDay:focus{
4112 background: #656565;
4113 border-color: #656565;
4114 color: #fff;
4115 }
4116
4117 .wtotem_theme—dark .wtotem_country__desc{
4118 color: #ccc;
4119 }
4120
4121
4122
4123 .wtotem_control__input:checked + label {
4124 background: #777;
4125 }
4126
4127 .wtotem_nav__link:focus {
4128 box-shadow: none;
4129 }
4130
4131
4132
4133 /* reports-page.css */
4134 .wtotem_reports {
4135 display: grid;
4136 grid-template-rows: auto 1fr auto;
4137 min-height: 100vh; }
4138 .wtotem_reports__content {
4139 height: 100%; }
4140 .wtotem_reports__header {
4141 display: flex;
4142 align-items: center;
4143 margin-bottom: 15px;
4144 flex-wrap: wrap; }
4145 @media screen and (max-width: 768px) {
4146 .wtotem_reports__header {
4147 margin-bottom: 10px; } }
4148 .wtotem_reports__title {
4149 margin-right: auto; }
4150 .wtotem_reports__btn {
4151 width: auto;
4152 padding: 14px 26px;
4153 position: relative; }
4154 @media screen and (max-width: 768px) {
4155 .wtotem_reports__btn {
4156 width: 100%;
4157 margin-top: 15px; } }
4158 .wtotem_reports__btn--load-more {
4159 text-transform: none;
4160 display: flex;
4161 justify-content: center; }
4162
4163 .wtotem_reports-dates {
4164 background-color: #E1E8EE;
4165 cursor: pointer;
4166 display: flex;
4167 margin-right: 6px;
4168 padding: 10px 12px;
4169 border-radius: 5px; }
4170 @media screen and (max-width: 768px) {
4171 .wtotem_reports-dates {
4172 margin-right: 0; } }
4173 .wtotem_reports-dates::before {
4174 content: '';
4175 display: block;
4176 align-self: center;
4177 height: 13px;
4178 width: 13px;
4179 margin-right: 9px;
4180 background-image: url("../img/calendar.svg");
4181 background-repeat: no-repeat;
4182 background-position: center center; }
4183 @media screen and (max-width: 576px) {
4184 .wtotem_reports-dates::before {
4185 margin-right: 0; } }
4186 .wtotem_reports-dates__input {
4187 cursor: pointer;
4188 color: #5e6977;
4189 display: block;
4190 position: relative;
4191 background-color: transparent;
4192 border: none;
4193 width: 50%;
4194 text-align: center;
4195 width: 0;
4196 flex-grow: 1;
4197 min-width: 90px; }
4198 @media screen and (max-width: 576px) {
4199 .wtotem_reports-dates__input {
4200 display: none; } }
4201 .wtotem_reports-dates__divider {
4202 display: block;
4203 align-self: center;
4204 margin: 0 3px; }
4205 @media screen and (max-width: 576px) {
4206 .wtotem_reports-dates__divider {
4207 display: none; } }
4208
4209 .wtotem_reports-no-data {
4210 display: flex;
4211 flex-direction: column;
4212 align-items: center;
4213 justify-content: center;
4214 height: 100%; }
4215 .wtotem_reports-no-data::before {
4216 content: '';
4217 display: block;
4218 height: 89px;
4219 width: 89px;
4220 margin-bottom: 10px;
4221 background-image: url("../img/empty-list.svg");
4222 background-repeat: no-repeat;
4223 background-position: center center; }
4224 .wtotem_reports-no-data__text {
4225 font-weight: bold;
4226 font-size: 14px;
4227 line-height: 18px;
4228 margin-bottom: 23px; }
4229
4230 .wtotem_reports-table {
4231 width: 100%;
4232 text-align: left;
4233 border-spacing: 0 8px;
4234 margin-bottom: 30px;
4235 border-collapse: separate;}
4236 @media screen and (max-width: 768px) {
4237 .wtotem_reports-table {
4238 display: none; } }
4239 .wtotem_reports-table__row {
4240 font-weight: 500;
4241 font-size: 14px;
4242 line-height: 21px;
4243 color: #5e6977;
4244 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
4245 background: #ffffff; }
4246 .wtotem_reports-table__row--header {
4247 color: #86939E; }
4248 .wtotem_reports-table__column {
4249 padding: 18px;
4250 padding-left: 0; }
4251 .wtotem_reports-table__column:first-child {
4252 padding-left: 18px; }
4253 .wtotem_reports-table__column--success {
4254 color: #4BC374; }
4255 .wtotem_reports-table__column--warning {
4256 color: #f5c451; }
4257 .wtotem_reports-table__column--error {
4258 color: #f5c451; }
4259 .wtotem_reports-table__column--actions {
4260 padding-top: 0;
4261 padding-bottom: 0;
4262 text-align: right; }
4263 .wtotem_reports-table__buttons-wrapper {
4264 height: 100%;
4265 width: 100%;
4266 display: flex;
4267 justify-content: flex-end;
4268 align-content: center; }
4269 .wtotem_reports-table__button {
4270 cursor: pointer;
4271 display: block;
4272 height: 35px;
4273 width: 35px;
4274 border: none;
4275 background-color: transparent; }
4276 .wtotem_reports-table__button:last-child {
4277 margin-right: 0; }
4278 .wtotem_reports-table__button--print {
4279 background-image: url("../img/print.svg");
4280 background-repeat: no-repeat;
4281 background-position: center center; }
4282 .wtotem_reports-table__button--download {
4283 background-image: url("../img/download.svg");
4284 background-repeat: no-repeat;
4285 background-position: center center; }
4286
4287 .wtotem_reports-list__load-more-wrapper {
4288 width: 100%;
4289 display: flex;
4290 justify-content: center; }
4291
4292 .wtotem_reports__load-more-label {
4293 position: relative;
4294 padding-left: 25px; }
4295 .wtotem_reports__load-more-label::before {
4296 content: '';
4297 display: block;
4298 position: absolute;
4299 height: 20px;
4300 width: 20px;
4301 top: 50%;
4302 left: 0;
4303 transform: translateY(-50%);
4304 background-image: url("../img/load-more.svg");
4305 background-repeat: no-repeat;
4306 background-position: center center; }
4307
4308 .wtotem_reports-modal {
4309 position: fixed;
4310 left: 0;
4311 top: 0;
4312 display: grid;
4313 place-items: center;
4314 height: 100%;
4315 width: 100%;
4316 z-index: 99999;
4317 background-color: rgba(94, 105, 119, 0.67);
4318 color: #545C68;
4319 font-weight: 500;
4320 font-size: 16px;
4321 line-height: 14px; }
4322 .wtotem_reports-modal--hidden {
4323 display: none; }
4324 .wtotem_reports-modal__content {
4325 position: relative;
4326 background: #FFFFFF;
4327 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
4328 border-radius: 12px;
4329 padding: 30px;
4330 min-width: 360px; }
4331 .wtotem_reports-modal__close {
4332 cursor: pointer;
4333 position: absolute;
4334 background-color: transparent;
4335 height: 30px;
4336 width: 30px;
4337 top: 0;
4338 right: 0;
4339 transform: translate(100%, -100%);
4340 border: none;
4341 background-image: url("../img/close.svg");
4342 background-repeat: no-repeat;
4343 background-position: center center; }
4344 @media screen and (max-width: 768px) {
4345 .wtotem_reports-modal__close {
4346 transform: translate(0, 0);
4347 top: 12px;
4348 right: 12px;
4349 background-image: url("../img/close-dark.svg");
4350 background-repeat: no-repeat;
4351 background-position: center center; } }
4352
4353 .wtotem_reports-settings__field-title {
4354 font-size: 16px;
4355 line-height: 14px;
4356 margin-bottom: 20px; }
4357 .wtotem_reports-settings__field-title--modules {
4358 margin-bottom: 10px; }
4359
4360 .wtotem_reports-settings__period-list {
4361 padding: 0;
4362 margin: 0;
4363 list-style: none;
4364 display: flex;
4365 width: 300px;
4366 height: 38px;
4367 margin-bottom: 10px; }
4368
4369 .wtotem_reports-settings__period-item {
4370 flex-grow: 1;
4371 border: 2px solid #E1E8EE; }
4372 .wtotem_reports-settings__period-item:not(:last-child) {
4373 border-right: none; }
4374
4375 .wtotem_reports-settings__period-radio {
4376 display: none; }
4377
4378 .wtotem_reports-settings__period-label {
4379 cursor: pointer;
4380 position: relative;
4381 display: flex;
4382 justify-content: center;
4383 align-items: center;
4384 height: 100%;
4385 width: 100%;
4386 font-size: 12px;
4387 line-height: 14px;
4388 font-weight: normal;
4389 text-align: center; }
4390
4391 .wtotem_reports-settings__period-radio:checked + .wtotem_reports-settings__period-label {
4392 color: #3d50df; }
4393
4394 .wtotem_reports-settings__dates {
4395 cursor: pointer;
4396 display: flex;
4397 border-radius: 2px;
4398 border: 2px solid #E1E8EE;
4399 padding: 7px 15px;
4400 margin-bottom: 25px; }
4401 .wtotem_reports-settings__dates::before {
4402 content: '';
4403 display: block;
4404 align-self: center;
4405 height: 13px;
4406 width: 15px;
4407 margin-right: 9px;
4408 background-image: url("../img/report.svg");
4409 background-repeat: no-repeat;
4410 background-position: center center; }
4411
4412 .wtotem_reports-settings__date-input {
4413 cursor: pointer;
4414 display: block;
4415 border: none;
4416 width: 0;
4417 min-width: 80px;
4418 font-size: 12px;
4419 line-height: 14px;
4420 font-weight: normal;
4421 text-align: right;
4422 color: inherit; }
4423 .wtotem_reports-settings__date-input:last-child {
4424 flex-grow: 1;
4425 text-align: left; }
4426
4427 .wtotem_reports-settings__date-divider {
4428 display: block;
4429 align-self: center;
4430 margin: 0 3px; }
4431
4432 .wtotem_reports-settings__modules-list {
4433 padding: 0;
4434 margin: 0;
4435 list-style: none;
4436 margin-bottom: 10px; }
4437
4438 .wtotem_reports-settings__module-item {
4439 position: relative;
4440 display: flex;
4441 align-items: center;
4442 justify-content: space-between;
4443 min-height: 48px; }
4444 .wtotem_reports-settings__module-item::after {
4445 content: '';
4446 position: absolute;
4447 height: 1px;
4448 left: -30px;
4449 right: -30px;
4450 bottom: 0;
4451 background-color: #EBF0F5; }
4452 .wtotem_reports-settings__module-item:last-child::after {
4453 content: unset; }
4454
4455 .wtotem_reports-settings__module-title {
4456 font-size: 14px;
4457 line-height: 35px; }
4458
4459 .wtotem_reports-settings__module-label {
4460 cursor: pointer;
4461 display: block;
4462 position: relative;
4463 width: 45px;
4464 height: 35px; }
4465 .wtotem_reports-settings__module-label::before {
4466 content: '';
4467 position: absolute;
4468 left: 50%;
4469 top: 50%;
4470 transform: translate(-50%, -50%);
4471 width: 100%;
4472 height: 10px;
4473 background: #E1E8EE;
4474 box-shadow: inset 0px 1px 0px rgba(189, 198, 207, 0.529014);
4475 border-radius: 100px; }
4476 .wtotem_reports-settings__module-label::after {
4477 content: '';
4478 position: absolute;
4479 left: 0;
4480 top: 50%;
4481 transform: translateY(-50%);
4482 width: 18px;
4483 height: 18px;
4484 margin-left: 5px;
4485 background: #5E6977;
4486 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.189736);
4487 border-radius: 100%;
4488 transition: 0.15s; }
4489
4490 .wtotem_reports-settings__module-checkbox {
4491 display: none; }
4492
4493 .wtotem_reports-settings__module-checkbox:checked + .wtotem_reports-settings__module-label::after {
4494 background: #3D50DF;
4495 left: 100%;
4496 margin-left: -23px; }
4497
4498 .wtotem_reports-settings__btn {
4499 width: 100%; }
4500
4501 .wtotem_reports-accordion {
4502 font-weight: 500;
4503 font-size: 14px;
4504 line-height: 21px;
4505 display: none; }
4506 @media screen and (max-width: 768px) {
4507 .wtotem_reports-accordion {
4508 display: block; } }
4509 .wtotem_reports-accordion__header {
4510 display: flex;
4511 align-items: center;
4512 justify-content: space-between;
4513 color: #86939E; }
4514 .wtotem_reports-accordion__header, .wtotem_reports-accordion__item {
4515 width: 100%;
4516 padding: 18px 14px;
4517 background: #FFFFFF;
4518 margin-bottom: 6px;
4519 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
4520 border-radius: 4px; }
4521 .wtotem_reports-accordion__header:last-child, .wtotem_reports-accordion__item:last-child {
4522 margin-bottom: 0; }
4523 .wtotem_reports-accordion__title {
4524 cursor: pointer;
4525 display: flex;
4526 justify-content: space-between;
4527 align-items: center; }
4528 .wtotem_reports-accordion__title::after {
4529 content: '';
4530 display: block;
4531 align-self: center;
4532 height: 20px;
4533 width: 20px;
4534 background-image: url("../img/arrow-down.svg");
4535 background-repeat: no-repeat;
4536 background-position: center center; }
4537 .wtotem_reports-accordion__content-wrapper {
4538 margin-top: 10px;
4539 border-top: 1px solid #F3F5F6; }
4540 .wtotem_reports-accordion__line-wrapper {
4541 display: flex;
4542 justify-content: space-between;
4543 padding: 10px 0; }
4544 .wtotem_reports-accordion__line-title {
4545 color: #86939E; }
4546 .wtotem_reports-accordion__line-value--success {
4547 color: #4BC374; }
4548 .wtotem_reports-accordion__line-value--warning {
4549 color: #f5c451; }
4550 .wtotem_reports-accordion__line-value--error {
4551 color: #f5c451; }
4552 .wtotem_reports-accordion__button {
4553 display: block;
4554 width: 100%;
4555 margin-bottom: 12px; }
4556 .wtotem_reports-accordion__button:last-child {
4557 margin-bottom: 0; }
4558
4559
4560 .wt-loader {
4561 z-index: 1
4562 }
4563 .wt-loader, .wt-spinner {
4564 display: flex;
4565 align-items: center;
4566 justify-content: center
4567 }
4568 .wt-spinner {
4569 position: absolute;
4570 top: 0;
4571 right: 0;
4572 bottom: 0;
4573 left: 0;
4574 background-color: hsla(0, 0%, 100%, .5);
4575 z-index: 20
4576 }
4577 .wt-loader img, .wt-loader path, .wt-spinner img {
4578 -webkit-user-select: none;
4579 -moz-user-select: none;
4580 -ms-user-select: none;
4581 user-select: none;
4582 transform: rotate(0deg);
4583 animation: 1s linear 0s normal none infinite running rot;
4584 -webkit-animation: 1s linear 0s normal none infinite running rot;
4585 }
4586
4587 .wtotem_body .wtotem_reports-modal--active {
4588 display: grid;
4589 }
4590 .wtotem_body .wtotem_reports-modal__content {
4591 position: relative;
4592 background: #FFFFFF;
4593 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
4594 border-radius: 12px;
4595 padding: 30px;
4596 min-width: 360px;
4597 }
4598
4599 .wtotem_reports-settings__field-title {
4600 font-size: 16px;
4601 line-height: 14px;
4602 margin-bottom: 20px;
4603 }
4604 .wtotem_body .wtotem_reports-settings__field-title--modules {
4605 margin-bottom: 10px;
4606 }
4607 .wtotem_body .wtotem_reports-settings__period-list {
4608 padding: 0;
4609 margin: 0;
4610 list-style: none;
4611 display: flex;
4612 width: 300px;
4613 height: 38px;
4614 margin-bottom: 20px;
4615 }
4616 .wtotem_body .wtotem_reports-settings__period-item {
4617 flex-grow: 1;
4618 border: 2px solid #E1E8EE;
4619 }
4620 .wtotem_body .wtotem_reports-settings__period-item:not(:last-child) {
4621 border-right: none;
4622 }
4623 .wtotem_body .wtotem_reports-settings__period-radio {
4624 display: none;
4625 }
4626 .wtotem_body .wtotem_reports-settings__period-label {
4627 cursor: pointer;
4628 position: relative;
4629 display: flex;
4630 justify-content: center;
4631 align-items: center;
4632 height: 100%;
4633 width: 100%;
4634 font-size: 12px;
4635 line-height: 14px;
4636 font-weight: normal;
4637 text-align: center;
4638 }
4639 .wtotem_body .wtotem_reports-settings__period-radio:checked + .wtotem_reports-settings__period-label {
4640 color: #3d50df;
4641 }
4642 .wtotem_body .wtotem_reports-settings__dates {
4643 display: flex;
4644 border-radius: 2px;
4645 border: 2px solid #E1E8EE;
4646 padding: 7px 15px;
4647 margin-bottom: 25px;
4648 }
4649 .wtotem_body .wtotem_reports-settings__dates::before {
4650 content: '';
4651 display: block;
4652 align-self: center;
4653 height: 13px;
4654 width: 15px;
4655 margin-right: 9px;
4656 background-image: url('../img/report.svg');
4657 background-repeat: no-repeat;
4658 background-position: center center;
4659 }
4660 .wtotem_body .wtotem_reports-settings__date-input {
4661 cursor: pointer;
4662 display: block;
4663 border: none;
4664 width: 0;
4665 min-width: 92px;
4666 padding-left: 10px;
4667 margin-left: 7px;
4668 font-size: 12px;
4669 line-height: 14px;
4670 font-weight: normal;
4671 text-align: right;
4672 color: inherit;
4673 background-color: transparent;
4674 }
4675
4676 .wtotem_body .wtotem_reports-settings__date-input:focus {
4677 border: 0;
4678 box-shadow: none;
4679 outline: none;
4680 }
4681
4682 .wtotem_body .wtotem_reports-settings__date-input:last-child {
4683 flex-grow: 1;
4684 text-align: left;
4685 }
4686 .wtotem_body .wtotem_reports-settings__date-divider {
4687 display: block;
4688 align-self: center;
4689 margin: 0 3px;
4690 }
4691 .wtotem_body .wtotem_reports-settings__modules-list {
4692 padding: 0;
4693 margin: 0;
4694 list-style: none;
4695 margin-bottom: 20px;
4696 }
4697 .wtotem_reports-settings__module-item {
4698 position: relative;
4699 display: flex;
4700 align-items: center;
4701 justify-content: space-between;
4702 min-height: 48px;
4703 }
4704 .wtotem_body .wtotem_reports-settings__module-item::after {
4705 content: '';
4706 position: absolute;
4707 height: 1px;
4708 left: -30px;
4709 right: -30px;
4710 bottom: 0;
4711 background-color: #EBF0F5;
4712 }
4713 .wtotem_body .wtotem_reports-settings__module-item:last-child::after {
4714 content: unset;
4715 }
4716 .wtotem_body .wtotem_reports-settings__module-title {
4717 font-size: 14px;
4718 line-height: 35px;
4719 }
4720 .wtotem_body .wtotem_reports-settings__module-label {
4721 cursor: pointer;
4722 display: block;
4723 position: relative;
4724 width: 45px;
4725 height: 35px;
4726 }
4727 .wtotem_body .wtotem_reports-settings__module-label::before {
4728 content: '';
4729 position: absolute;
4730 left: 50%;
4731 top: 50%;
4732 transform: translate(-50%, -50%);
4733 width: 100%;
4734 height: 10px;
4735 background: #E1E8EE;
4736 box-shadow: inset 0px 1px 0px rgba(189, 198, 207, 0.529014);
4737 border-radius: 100px;
4738 }
4739 .wtotem_body .wtotem_reports-settings__module-label::after {
4740 content: '';
4741 position: absolute;
4742 left: 0;
4743 top: 50%;
4744 transform: translateY(-50%);
4745 width: 18px;
4746 height: 18px;
4747 margin-left: 5px;
4748 background: #5E6977;
4749 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.189736);
4750 border-radius: 100%;
4751 transition: 0.15s;
4752 }
4753 .wtotem_body .wtotem_reports-settings__module-checkbox {
4754 display: none;
4755 }
4756 .wtotem_body .wtotem_reports-settings__module-checkbox:checked + .wtotem_reports-settings__module-label::after {
4757 background: #3D50DF;
4758 left: 100%;
4759 margin-left: -23px;
4760 }
4761 .wtotem_body .wtotem_reports-settings__btn {
4762 width: 100%;
4763 }
4764
4765 .wtotem_theme—dark .wtotem_reports-table__column,.wtotem_theme—dark .wtotem_reports-dates{
4766 background: #282828;
4767 }
4768
4769 .wtotem_theme—dark .wtotem_body .wtotem_reports-dates__input {
4770 border: 1px solid #3a3a3a;
4771 color: #ccc;
4772 }
4773
4774 .wtotem_theme—dark .wtotem_reports-table__row{
4775 background: transparent;
4776 }
4777
4778 .wtotem_theme—dark .wtotem_reports-modal{
4779 color: #ddd;
4780 }
4781
4782 .wtotem_theme—dark .wtotem_body .wtotem_reports-modal__content{
4783 background: #282828;
4784 }
4785
4786 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__dates,
4787 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__period-item{
4788 border: 2px solid #35383b;
4789 }
4790
4791 .wtotem_theme—dark .wtotem_reports-modal__close{
4792 background-image: url(../img/close.svg);
4793 }
4794
4795 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__module-item::after{
4796 background-color: #35383b;
4797 }
4798
4799 .wtotem_theme—dark .wtotem_reports-accordion__header, .wtotem_theme—dark .wtotem_reports-accordion__item{
4800 background: #282828;
4801 color: #d6d6d6;
4802 }
4803
4804 .wtotem_theme—dark .wtotem_reports-accordion__content-wrapper{
4805 border-top: 1px solid #565656;
4806 }
4807
4808 body.wtotem_theme—dark {
4809 background: #191919;
4810 }
4811
4812 .reports_load_more_td{
4813 background: transparent;
4814 border-color: transparent;
4815 }
4816
4817 /* # reports-page.css */
4818
4819
4820 /*fixes*/
4821 @media screen and (max-width: 768px) {
4822 .chart-date text{
4823 -webkit-transform: rotate(-40deg) translate(-20px);
4824 -ms-transform: rotate(-40deg) translate(-20px);
4825 transform: rotate(-40deg) translate(-20px);
4826 }
4827 }
4828
4829 @media screen and (max-width: 576px) {
4830 .wtotem_av_filters_wrapper{
4831 display: block;
4832 }
4833 }
4834
4835 /* Settings */
4836 .wtotem_firewall-section-menu-item{
4837 position: relative;
4838 margin: 15px 0;
4839 }
4840
4841 .wtotem_switch-checkbox-with-text{
4842 position: absolute;
4843 right: 6px;
4844 top: 1px;
4845 }
4846