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

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

4,849 lines 106.4 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--reverse {
3561 top: 25px; }
3562
3563 .line-chart__tooltip:before {
3564 content: "";
3565 position: absolute;
3566 border-width: 7px;
3567 border-style: solid;
3568 border-color: #1d293f transparent transparent transparent;
3569 top: 100%;
3570 left: 50%;
3571 transform: translateX(-50%); }
3572
3573 .line-chart__tooltip--reverse:before {
3574 border-color: transparent transparent #1d293f transparent;
3575 top: 0%;
3576 transform: translateX(-50%) translateY(-100%); }
3577
3578 .line-chart {
3579 position: relative;
3580 }
3581
3582
3583 .wtotem_theme—dark .wtotem_body{
3584 background: #191919;
3585 color: #e2e2e2;
3586 }
3587 .wtotem_theme—dark .wt_card,
3588 .wtotem_theme—dark .wt_card:before,
3589 .wtotem_theme—dark .wtotem_chart-first__btn_active {
3590 background: #282828;
3591 }
3592
3593 .wtotem_theme—dark .wtotem_content,
3594 .wtotem_theme—dark .wtotem_footer,
3595 .wtotem_theme—dark .wtotem_chart-first__right,
3596 .wtotem_theme—dark .wtotem_control__block,
3597 .wtotem_theme—dark .wtotem_state__select,
3598 .wtotem_theme—dark .wtotem_chart__calendars{
3599 background: #191919;
3600 }
3601
3602 .wtotem_theme—dark .wtotem_version__count {
3603 border: 1px solid #f3f5f6;
3604 }
3605
3606 .wtotem_theme—dark .wtotem_logo {
3607 background: url("../img/dr-logo.svg") no-repeat center center/cover;
3608 }
3609
3610 .wtotem_theme—dark .wtotem_nav__link,
3611 .wtotem_theme—dark .wtotem_nav__link_active,
3612 .wtotem_theme—dark .wtotem_version__count,
3613 .wtotem_theme—dark .title,
3614 .wtotem_theme—dark .wtotem_title-info__title,
3615 .wtotem_theme—dark .wtotem_overall__text,
3616 .wtotem_theme—dark .wtotem_info__subtitle,
3617 .wtotem_theme—dark .wtotem_info__info,
3618 .wtotem_theme—dark .wtotem_numbers__figures,
3619 .wtotem_theme—dark .wtotem_from__country,
3620 .wtotem_theme—dark .wtotem_from__country span,
3621 .wtotem_theme—dark .wtotem_data__th,
3622 .wtotem_theme—dark .wtotem_antivirus__title,
3623 .wtotem_theme—dark .wtotem_table__title,
3624 .wtotem_theme—dark .wtotem_table__subject,
3625 .wtotem_theme—dark .wtotem_table__text,
3626 .wtotem_theme—dark .wtotem_table__perfomance,
3627 .wtotem_theme—dark .wtotem_footer__text,
3628 .wtotem_theme—dark .wtotem_footer__text,
3629 .wtotem_theme—dark .wtotem_chart__btn,
3630 .wtotem_theme—dark .wtotem_antivirus__item:last-child div,
3631 .wtotem_theme—dark .wtotem_from__percent,
3632 .wtotem_theme—dark .wtotem_chart-first__all,
3633 .wtotem_theme—dark .wtotem_chart-first__hack p,
3634 .wtotem_theme—dark .wtotem_chart-first__btn_active,
3635 .wtotem_theme—dark .wtotem_chart__text,
3636 .wtotem_theme—dark .wtotem_table__initial-value,
3637 .wtotem_theme—dark .arrow-right,
3638 .wtotem_theme—dark .wtotem_print__label,
3639 .wtotem_theme—dark .wtotem_state__text,
3640 .wtotem_theme—dark .wtotem_pagination__number,
3641 .wtotem_theme—dark .wtotem_data__td,
3642 .wtotem_theme—dark .wtotem_file-table__th,
3643 .wtotem_theme—dark .wtotem_file-table,
3644 .wtotem_theme—dark .wtotem_option__title,
3645 .wtotem_theme—dark .wtotem_option__text,
3646 .wtotem_theme—dark .wtotem_control__title,
3647 .wtotem_theme—dark .wtotem_control__name,
3648 .wtotem_theme—dark .onoff__label:after,
3649 .wtotem_theme—dark .onoff__label:before,
3650 .wtotem_theme—dark .wtotem_offer__title,
3651 .wtotem_theme—dark .wtotem_offer__text,
3652 .wtotem_theme—dark .wtotem_unit__expectation_loading,
3653 .wtotem_theme—dark .wtotem_alert__text {
3654 color: #f3f5f6;
3655 }
3656
3657 .wtotem_theme—dark .wtotem_data__ip {
3658 color: #86939e;
3659 }
3660
3661 .wtotem_theme—dark .wtotem_chart__btn {
3662 border: 1px solid #f3f5f6;
3663 }
3664
3665 .wtotem_theme—dark .wtotem_title-info__info {
3666 background: url("../img/dr-info.svg") no-repeat center center/cover;
3667 }
3668
3669 .wtotem_theme—dark .wtotem_nav__link_active {
3670 color: #3d50df;
3671 }
3672
3673 .wtotem_theme—dark .wtotem_info__item:first-child,
3674 .wtotem_theme—dark .wtotem_numbers__item,
3675 .wtotem_theme—dark .wtotem_antivirus__item,
3676 .wtotem_theme—dark .wtotem_unit__block {
3677 border-right: 1px solid #3c3c3d;
3678 }
3679
3680 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
3681 border-right: none;
3682 }
3683
3684 .wtotem_theme—dark .wtotem_numbers__item:last-child {
3685 border-right: none;
3686 }
3687
3688 .wtotem_theme—dark .wtotem_table__col {
3689 border-right: 1px solid #3c3c3d;
3690 border-bottom: 1px solid #3c3c3d;
3691 }
3692
3693 .wtotem_theme—dark .wtotem_table__col:last-child {
3694 border-right: none;
3695 }
3696
3697 .wtotem_theme—dark .wtotem_chart__line {
3698 background: #3c3c3d;
3699 }
3700
3701 .wtotem_theme—dark .wtotem_table__th,
3702 .wtotem_theme—dark .wtotem_table__td {
3703 border-bottom: 1px solid #3c3c3d;
3704 }
3705
3706 .wtotem_theme—dark .wtotem_table__link:after {
3707 content: "";
3708 border: solid #fff;
3709 border-width: 0 1.5px 1.5px 0;
3710 transform: rotate(-45deg);
3711 -webkit-transform: rotate(-45deg);
3712 }
3713
3714 .wtotem_theme—dark .arrow-right:after {
3715 content: "";
3716 border: solid #f3f5f6;
3717 border-width: 0 1px 1px 0;
3718 transform: rotate(-45deg);
3719 -webkit-transform: rotate(-45deg);
3720 margin-left: 10px;
3721 }
3722
3723 .wtotem_theme—dark .wtotem_footer__line,
3724 .wtotem_theme—dark .wtotem_state__line {
3725 background: #2d2e2e;
3726 }
3727
3728 .wtotem_theme—dark .wtotem_footer__app-store {
3729 width: 19px;
3730 height: 19px;
3731 background: url("../img/dr-app-store.svg") no-repeat center center/cover;
3732 }
3733
3734 .wtotem_theme—dark .wtotem_footer__play-store {
3735 width: 17px;
3736 height: 19px;
3737 background: url("../img/dr-play-store.svg") no-repeat center center/cover;
3738 }
3739
3740 .wtotem_theme—dark .wtotem_footer__logo {
3741 background: url("../img/dr-logo-footer.svg") no-repeat center center/cover;
3742 }
3743
3744 .wtotem_theme—dark .line-chart__tooltip,
3745 .wtotem_theme—dark .line-chart__tooltip::before {
3746 background: #3d50df;
3747 }
3748
3749 .wtotem_theme—dark .wtotem_firewall__icon {
3750 background: url("../img/dr-shape.svg") no-repeat center center/cover;
3751 }
3752
3753 .wtotem_theme—dark .wtotem_pagination__number_active {
3754 background: #5a5c5e;
3755 }
3756
3757 .wtotem_pagination__number:hover {
3758 color: #5e6977;
3759 transition: all 0.2s ease;
3760 }
3761
3762 .wtotem_theme—dark .onoff__label {
3763 background: #686868;
3764 }
3765
3766 .wtotem_theme—dark .wtotem_print__img {
3767 background: url("../img/dr-print.svg") no-repeat center center/cover;
3768 }
3769
3770 .wtotem_theme—dark .wtotem_control__trash {
3771 background: url("../img/dr-trash.svg") no-repeat center center/cover;
3772 }
3773
3774 .wtotem_theme—dark .onoff__input:checked + label .onoff__circle {
3775 background: #4bc374;
3776 }
3777
3778 .wtotem_theme—dark .onoff__circle {
3779 background: #ec6d62;
3780 }
3781
3782 .wtotem_theme—dark .wtotem_alert__close:before,
3783 .wtotem_theme—dark .wtotem_alert__close:after {
3784 background: #dadada;
3785 }
3786
3787 .wtotem_theme—dark .wtotem-waf-settings-popup{
3788 background: #282828;
3789 color: #e2e2e2;
3790 }
3791
3792 .wtotem_theme—dark .wtotem-waf-settings-popup__input{
3793 border: 1px solid #333333;
3794 background-color: #191919;
3795 color: #ffffff;
3796 }
3797
3798 .wtotem_theme—dark .wtotem_antivirus__figures_black{
3799 color: #5a7bb7;
3800 }
3801
3802 .wtotem_info__item .arrow-right {
3803 color: #3d50df;
3804 }
3805 .wtotem_info__item .arrow-right:after {
3806 content: "";
3807 border: solid #3d50df;
3808 border-width: 0 1px 1px 0;
3809 transform: rotate(-45deg);
3810 -webkit-transform: rotate(-45deg);
3811 margin-left: 10px;
3812 }
3813
3814
3815
3816 /* 320-576px Extra small */
3817 @media screen and (max-width: 576px) {
3818 .wtotem_theme—dark .wtotem_info__item:first-child {
3819 border-right: none;
3820 }
3821 .wtotem_theme—dark .wtotem_antivirus__item {
3822 border-bottom: 1px solid #3c3c3d;
3823 }
3824 .wtotem_theme—dark .wtotem_numbers__item:last-child {
3825 border-right: 1px solid #3c3c3d;
3826 }
3827 .wtotem_theme—dark .wtotem_numbers__item:nth-child(2) {
3828 border-right: none;
3829 }
3830 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
3831 border-right: none;
3832 border-bottom: none;
3833 }
3834 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(2) {
3835 border-right: none;
3836 }
3837 .wtotem_theme—dark .wtotem_antivirus__item:nth-child(3) {
3838 border-bottom: none;
3839 }
3840 }
3841
3842 .wtotem_theme—dark #disk-chart svg path {
3843 stroke: #282828;
3844 }
3845
3846 /* 992-1100px lg Large */
3847 @media screen and (max-width: 1100px) {
3848 .wtotem_container {
3849 max-width: 960px;
3850 }
3851 }
3852
3853 /* 768-992px md Medium */
3854 @media screen and (max-width: 992px) {
3855 .wtotem_container {
3856 max-width: 720px;
3857 }
3858 }
3859
3860 /* 576-768px sm Small */
3861 @media screen and (max-width: 768px) {
3862 .wtotem_container {
3863 max-width: 540px;
3864 }
3865 .wtotem_content {
3866 padding-top: 19px;
3867 }
3868 }
3869
3870 /* 375-576px Extra small */
3871 @media screen and (max-width: 576px) {
3872 .wtotem_container {
3873 max-width: 345px;
3874 }
3875 }
3876
3877 /* 320-375px Extra small */
3878 @media screen and (max-width: 374px) {
3879 .wtotem_container {
3880 max-width: auto;
3881 padding: 0 10px;
3882 }
3883 }
3884
3885 /* 992-1100px lg Large */
3886 /* 768-992px md Medium */
3887 /* 576-768px sm Small */
3888 /* 375-576px Extra small */
3889 /* 320-375px Extra small */
3890
3891 /*# sourceMappingURL=main.css.map */
3892
3893 /*tlite */
3894 .tlite {
3895 background: #111;
3896 color: #fff;
3897 font-family: sans-serif;
3898 font-size: 0.8rem;
3899 font-weight: normal;
3900 text-decoration: none;
3901 text-align: left;
3902 padding: 0.6em 0.75rem;
3903 border-radius: 4px;
3904 position: absolute;
3905 opacity: 0;
3906 visibility: hidden;
3907 transition: opacity 0.4s;
3908 max-width: 350px;
3909 box-shadow: 0 0.5rem 1rem -0.5rem #000;
3910 z-index: 1000;
3911 -webkit-backface-visibility: hidden;
3912 }
3913 .tlite-table td,
3914 .tlite-table th {
3915 position: relative;
3916 }
3917 .tlite-visible {
3918 visibility: visible;
3919 opacity: 0.9;
3920 }
3921 .tlite::before {
3922 content: " ";
3923 display: block;
3924 background: inherit;
3925 width: 10px;
3926 height: 10px;
3927 position: absolute;
3928 transform: rotate(45deg);
3929 }
3930 .tlite-n::before {
3931 top: -3px;
3932 left: 50%;
3933 margin-left: -5px;
3934 }
3935 .tlite-nw::before {
3936 top: -3px;
3937 left: 10px;
3938 }
3939 .tlite-ne::before {
3940 top: -3px;
3941 right: 10px;
3942 }
3943 .tlite-s::before {
3944 bottom: -3px;
3945 left: 50%;
3946 margin-left: -5px;
3947 }
3948 .tlite-se::before {
3949 bottom: -3px;
3950 right: 10px;
3951 }
3952 .tlite-sw::before {
3953 bottom: -3px;
3954 left: 10px;
3955 }
3956 .tlite-w::before {
3957 left: -3px;
3958 top: 50%;
3959 margin-top: -5px;
3960 }
3961 .tlite-e::before {
3962 right: -3px;
3963 top: 50%;
3964 margin-top: -5px;
3965 }
3966 .is--status--ok {
3967 color: #4bc374;
3968 fill: #4bc374;
3969 }
3970 .is--status--error {
3971 color: #ee3f3f;
3972 fill: #ee3f3f;
3973 }
3974 .is--status--pending {
3975 color: #3d50df;
3976 fill: #3d50df;
3977 }
3978 .is--status--warning {
3979 color: #f5bf4f;
3980 fill: #f5bf4f;
3981 }
3982 .wtsec_score_red {
3983 color: #d56c6a;
3984 }
3985 .wtsec_score_orange {
3986 color: #c2b00e;
3987 }
3988 .wtsec_score_green {
3989 color: #7eb40c;
3990 }
3991 .wtsec_score_bg_red {
3992 background: #d56c6a;
3993 color: #fff;
3994 }
3995 .wtsec_score_bg_orange {
3996 background: #c2b00e;
3997 color: #fff;
3998 }
3999 .wtsec_score_bg_green {
4000 background: #7eb40c;
4001 color: #fff;
4002 }
4003 #wtotem_alert {
4004 margin-top: 20px;
4005 }
4006
4007 .ml-2 {
4008 margin-left: 20px;
4009 }
4010
4011 .wt-flex {
4012 display: flex;
4013 }
4014
4015 .wt-flex-middle {
4016 align-items: center;
4017 }
4018
4019 .wt-margin-right-10 {
4020 margin-right: 10px;
4021 }
4022 .break-word {
4023 overflow-wrap: break-word;
4024 word-wrap: break-word;
4025 word-break: break-all;
4026 }
4027
4028 select.wtotem_state__select {
4029 display: block;
4030 margin-left: 18px;
4031 width: 100%;
4032 padding: 14px 12px;
4033 color: #86939e;
4034 font-size: 14px;
4035 font-weight: 400;
4036 -webkit-appearance: none;
4037 appearance: none;
4038 background-color: #f3f5f6;
4039 background-image: none;
4040 border-radius: 4px;
4041 border: none;
4042 font-family: inherit;
4043 cursor: pointer;
4044 line-height: normal;
4045 }
4046
4047 .wtotem_unit {
4048 margin-bottom: 30px;
4049 }
4050
4051 .wtotem_table__text {
4052 margin-left: 15px;
4053 word-break: break-all;
4054 }
4055 .wt-margin-20{
4056 margin: 20px;
4057 }
4058 .wt-margin-bottom-15{
4059 margin-bottom: 15px;
4060 }
4061 .wtotem_av_filters_wrapper{
4062 justify-content: space-between;
4063 display: flex;
4064 }
4065
4066 .wt_flag{
4067 width: 24px;
4068 }
4069
4070
4071 .wtotem_theme—dark input.wtotem_calendar {
4072 color: #cccccc;
4073 }
4074
4075
4076 .wtotem_theme—dark .flatpickr-calendar{
4077 background: #282828;
4078 border: 2px solid #191919;
4079 }
4080
4081 .wtotem_theme—dark .flatpickr-day{
4082 color: #cccccc;
4083 }
4084
4085 .wtotem_theme—dark .flatpickr-monthDropdown-months, .wtotem_theme—dark .flatpickr-current-month input.cur-year{
4086 color: #cccccc !important;
4087 }
4088
4089 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{
4090 background-color: #282828;
4091 }
4092 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months,
4093 .wtotem_theme—dark .flatpickr-monthDropdown-months, .wtotem_theme—dark .flatpickr-current-month input.cur-year{
4094 border: 1.6px solid #545454;
4095 }
4096
4097 .wtotem_theme—dark .flatpickr-day.inRange, .wtotem_theme—dark .flatpickr-day.today.inRange{
4098 background: #656565;
4099 color: #fff;
4100 border-color: #656565;
4101 }
4102
4103 .wtotem_theme—dark .flatpickr-day.inRange,
4104 .wtotem_theme—dark .flatpickr-day.prevMonthDay.inRange,
4105 .wtotem_theme—dark .flatpickr-day.nextMonthDay.inRange,
4106 .wtotem_theme—dark .flatpickr-day.today.inRange,
4107 .wtotem_theme—dark .flatpickr-day.prevMonthDay.today.inRange,
4108 .wtotem_theme—dark .flatpickr-day.nextMonthDay.today.inRange,
4109 .wtotem_theme—dark .flatpickr-day:hover,
4110 .wtotem_theme—dark .flatpickr-day.prevMonthDay:hover,
4111 .wtotem_theme—dark .flatpickr-day.nextMonthDay:hover,
4112 .wtotem_theme—dark .flatpickr-day:focus,
4113 .wtotem_theme—dark .flatpickr-day.prevMonthDay:focus,
4114 .wtotem_theme—dark .flatpickr-day.nextMonthDay:focus{
4115 background: #656565;
4116 border-color: #656565;
4117 color: #fff;
4118 }
4119
4120 .wtotem_theme—dark .wtotem_country__desc{
4121 color: #ccc;
4122 }
4123
4124
4125
4126 .wtotem_control__input:checked + label {
4127 background: #777;
4128 }
4129
4130 .wtotem_nav__link:focus {
4131 box-shadow: none;
4132 }
4133
4134
4135
4136 /* reports-page.css */
4137 .wtotem_reports {
4138 display: grid;
4139 grid-template-rows: auto 1fr auto;
4140 min-height: 100vh; }
4141 .wtotem_reports__content {
4142 height: 100%; }
4143 .wtotem_reports__header {
4144 display: flex;
4145 align-items: center;
4146 margin-bottom: 15px;
4147 flex-wrap: wrap; }
4148 @media screen and (max-width: 768px) {
4149 .wtotem_reports__header {
4150 margin-bottom: 10px; } }
4151 .wtotem_reports__title {
4152 margin-right: auto; }
4153 .wtotem_reports__btn {
4154 width: auto;
4155 padding: 14px 26px;
4156 position: relative; }
4157 @media screen and (max-width: 768px) {
4158 .wtotem_reports__btn {
4159 width: 100%;
4160 margin-top: 15px; } }
4161 .wtotem_reports__btn--load-more {
4162 text-transform: none;
4163 display: flex;
4164 justify-content: center; }
4165
4166 .wtotem_reports-dates {
4167 background-color: #E1E8EE;
4168 cursor: pointer;
4169 display: flex;
4170 margin-right: 6px;
4171 padding: 10px 12px;
4172 border-radius: 5px; }
4173 @media screen and (max-width: 768px) {
4174 .wtotem_reports-dates {
4175 margin-right: 0; } }
4176 .wtotem_reports-dates::before {
4177 content: '';
4178 display: block;
4179 align-self: center;
4180 height: 13px;
4181 width: 13px;
4182 margin-right: 9px;
4183 background-image: url("../img/calendar.svg");
4184 background-repeat: no-repeat;
4185 background-position: center center; }
4186 @media screen and (max-width: 576px) {
4187 .wtotem_reports-dates::before {
4188 margin-right: 0; } }
4189 .wtotem_reports-dates__input {
4190 cursor: pointer;
4191 color: #5e6977;
4192 display: block;
4193 position: relative;
4194 background-color: transparent;
4195 border: none;
4196 width: 50%;
4197 text-align: center;
4198 width: 0;
4199 flex-grow: 1;
4200 min-width: 90px; }
4201 @media screen and (max-width: 576px) {
4202 .wtotem_reports-dates__input {
4203 display: none; } }
4204 .wtotem_reports-dates__divider {
4205 display: block;
4206 align-self: center;
4207 margin: 0 3px; }
4208 @media screen and (max-width: 576px) {
4209 .wtotem_reports-dates__divider {
4210 display: none; } }
4211
4212 .wtotem_reports-no-data {
4213 display: flex;
4214 flex-direction: column;
4215 align-items: center;
4216 justify-content: center;
4217 height: 100%; }
4218 .wtotem_reports-no-data::before {
4219 content: '';
4220 display: block;
4221 height: 89px;
4222 width: 89px;
4223 margin-bottom: 10px;
4224 background-image: url("../img/empty-list.svg");
4225 background-repeat: no-repeat;
4226 background-position: center center; }
4227 .wtotem_reports-no-data__text {
4228 font-weight: bold;
4229 font-size: 14px;
4230 line-height: 18px;
4231 margin-bottom: 23px; }
4232
4233 .wtotem_reports-table {
4234 width: 100%;
4235 text-align: left;
4236 border-spacing: 0 8px;
4237 margin-bottom: 30px;
4238 border-collapse: separate;}
4239 @media screen and (max-width: 768px) {
4240 .wtotem_reports-table {
4241 display: none; } }
4242 .wtotem_reports-table__row {
4243 font-weight: 500;
4244 font-size: 14px;
4245 line-height: 21px;
4246 color: #5e6977;
4247 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
4248 background: #ffffff; }
4249 .wtotem_reports-table__row--header {
4250 color: #86939E; }
4251 .wtotem_reports-table__column {
4252 padding: 18px;
4253 padding-left: 0; }
4254 .wtotem_reports-table__column:first-child {
4255 padding-left: 18px; }
4256 .wtotem_reports-table__column--success {
4257 color: #4BC374; }
4258 .wtotem_reports-table__column--warning {
4259 color: #f5c451; }
4260 .wtotem_reports-table__column--error {
4261 color: #f5c451; }
4262 .wtotem_reports-table__column--actions {
4263 padding-top: 0;
4264 padding-bottom: 0;
4265 text-align: right; }
4266 .wtotem_reports-table__buttons-wrapper {
4267 height: 100%;
4268 width: 100%;
4269 display: flex;
4270 justify-content: flex-end;
4271 align-content: center; }
4272 .wtotem_reports-table__button {
4273 cursor: pointer;
4274 display: block;
4275 height: 35px;
4276 width: 35px;
4277 border: none;
4278 background-color: transparent; }
4279 .wtotem_reports-table__button:last-child {
4280 margin-right: 0; }
4281 .wtotem_reports-table__button--print {
4282 background-image: url("../img/print.svg");
4283 background-repeat: no-repeat;
4284 background-position: center center; }
4285 .wtotem_reports-table__button--download {
4286 background-image: url("../img/download.svg");
4287 background-repeat: no-repeat;
4288 background-position: center center; }
4289
4290 .wtotem_reports-list__load-more-wrapper {
4291 width: 100%;
4292 display: flex;
4293 justify-content: center; }
4294
4295 .wtotem_reports__load-more-label {
4296 position: relative;
4297 padding-left: 25px; }
4298 .wtotem_reports__load-more-label::before {
4299 content: '';
4300 display: block;
4301 position: absolute;
4302 height: 20px;
4303 width: 20px;
4304 top: 50%;
4305 left: 0;
4306 transform: translateY(-50%);
4307 background-image: url("../img/load-more.svg");
4308 background-repeat: no-repeat;
4309 background-position: center center; }
4310
4311 .wtotem_reports-modal {
4312 position: fixed;
4313 left: 0;
4314 top: 0;
4315 display: grid;
4316 place-items: center;
4317 height: 100%;
4318 width: 100%;
4319 z-index: 99999;
4320 background-color: rgba(94, 105, 119, 0.67);
4321 color: #545C68;
4322 font-weight: 500;
4323 font-size: 16px;
4324 line-height: 14px; }
4325 .wtotem_reports-modal--hidden {
4326 display: none; }
4327 .wtotem_reports-modal__content {
4328 position: relative;
4329 background: #FFFFFF;
4330 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
4331 border-radius: 12px;
4332 padding: 30px;
4333 min-width: 360px; }
4334 .wtotem_reports-modal__close {
4335 cursor: pointer;
4336 position: absolute;
4337 background-color: transparent;
4338 height: 30px;
4339 width: 30px;
4340 top: 0;
4341 right: 0;
4342 transform: translate(100%, -100%);
4343 border: none;
4344 background-image: url("../img/close.svg");
4345 background-repeat: no-repeat;
4346 background-position: center center; }
4347 @media screen and (max-width: 768px) {
4348 .wtotem_reports-modal__close {
4349 transform: translate(0, 0);
4350 top: 12px;
4351 right: 12px;
4352 background-image: url("../img/close-dark.svg");
4353 background-repeat: no-repeat;
4354 background-position: center center; } }
4355
4356 .wtotem_reports-settings__field-title {
4357 font-size: 16px;
4358 line-height: 14px;
4359 margin-bottom: 20px; }
4360 .wtotem_reports-settings__field-title--modules {
4361 margin-bottom: 10px; }
4362
4363 .wtotem_reports-settings__period-list {
4364 padding: 0;
4365 margin: 0;
4366 list-style: none;
4367 display: flex;
4368 width: 300px;
4369 height: 38px;
4370 margin-bottom: 10px; }
4371
4372 .wtotem_reports-settings__period-item {
4373 flex-grow: 1;
4374 border: 2px solid #E1E8EE; }
4375 .wtotem_reports-settings__period-item:not(:last-child) {
4376 border-right: none; }
4377
4378 .wtotem_reports-settings__period-radio {
4379 display: none; }
4380
4381 .wtotem_reports-settings__period-label {
4382 cursor: pointer;
4383 position: relative;
4384 display: flex;
4385 justify-content: center;
4386 align-items: center;
4387 height: 100%;
4388 width: 100%;
4389 font-size: 12px;
4390 line-height: 14px;
4391 font-weight: normal;
4392 text-align: center; }
4393
4394 .wtotem_reports-settings__period-radio:checked + .wtotem_reports-settings__period-label {
4395 color: #3d50df; }
4396
4397 .wtotem_reports-settings__dates {
4398 cursor: pointer;
4399 display: flex;
4400 border-radius: 2px;
4401 border: 2px solid #E1E8EE;
4402 padding: 7px 15px;
4403 margin-bottom: 25px; }
4404 .wtotem_reports-settings__dates::before {
4405 content: '';
4406 display: block;
4407 align-self: center;
4408 height: 13px;
4409 width: 15px;
4410 margin-right: 9px;
4411 background-image: url("../img/report.svg");
4412 background-repeat: no-repeat;
4413 background-position: center center; }
4414
4415 .wtotem_reports-settings__date-input {
4416 cursor: pointer;
4417 display: block;
4418 border: none;
4419 width: 0;
4420 min-width: 80px;
4421 font-size: 12px;
4422 line-height: 14px;
4423 font-weight: normal;
4424 text-align: right;
4425 color: inherit; }
4426 .wtotem_reports-settings__date-input:last-child {
4427 flex-grow: 1;
4428 text-align: left; }
4429
4430 .wtotem_reports-settings__date-divider {
4431 display: block;
4432 align-self: center;
4433 margin: 0 3px; }
4434
4435 .wtotem_reports-settings__modules-list {
4436 padding: 0;
4437 margin: 0;
4438 list-style: none;
4439 margin-bottom: 10px; }
4440
4441 .wtotem_reports-settings__module-item {
4442 position: relative;
4443 display: flex;
4444 align-items: center;
4445 justify-content: space-between;
4446 min-height: 48px; }
4447 .wtotem_reports-settings__module-item::after {
4448 content: '';
4449 position: absolute;
4450 height: 1px;
4451 left: -30px;
4452 right: -30px;
4453 bottom: 0;
4454 background-color: #EBF0F5; }
4455 .wtotem_reports-settings__module-item:last-child::after {
4456 content: unset; }
4457
4458 .wtotem_reports-settings__module-title {
4459 font-size: 14px;
4460 line-height: 35px; }
4461
4462 .wtotem_reports-settings__module-label {
4463 cursor: pointer;
4464 display: block;
4465 position: relative;
4466 width: 45px;
4467 height: 35px; }
4468 .wtotem_reports-settings__module-label::before {
4469 content: '';
4470 position: absolute;
4471 left: 50%;
4472 top: 50%;
4473 transform: translate(-50%, -50%);
4474 width: 100%;
4475 height: 10px;
4476 background: #E1E8EE;
4477 box-shadow: inset 0px 1px 0px rgba(189, 198, 207, 0.529014);
4478 border-radius: 100px; }
4479 .wtotem_reports-settings__module-label::after {
4480 content: '';
4481 position: absolute;
4482 left: 0;
4483 top: 50%;
4484 transform: translateY(-50%);
4485 width: 18px;
4486 height: 18px;
4487 margin-left: 5px;
4488 background: #5E6977;
4489 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.189736);
4490 border-radius: 100%;
4491 transition: 0.15s; }
4492
4493 .wtotem_reports-settings__module-checkbox {
4494 display: none; }
4495
4496 .wtotem_reports-settings__module-checkbox:checked + .wtotem_reports-settings__module-label::after {
4497 background: #3D50DF;
4498 left: 100%;
4499 margin-left: -23px; }
4500
4501 .wtotem_reports-settings__btn {
4502 width: 100%; }
4503
4504 .wtotem_reports-accordion {
4505 font-weight: 500;
4506 font-size: 14px;
4507 line-height: 21px;
4508 display: none; }
4509 @media screen and (max-width: 768px) {
4510 .wtotem_reports-accordion {
4511 display: block; } }
4512 .wtotem_reports-accordion__header {
4513 display: flex;
4514 align-items: center;
4515 justify-content: space-between;
4516 color: #86939E; }
4517 .wtotem_reports-accordion__header, .wtotem_reports-accordion__item {
4518 width: 100%;
4519 padding: 18px 14px;
4520 background: #FFFFFF;
4521 margin-bottom: 6px;
4522 box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
4523 border-radius: 4px; }
4524 .wtotem_reports-accordion__header:last-child, .wtotem_reports-accordion__item:last-child {
4525 margin-bottom: 0; }
4526 .wtotem_reports-accordion__title {
4527 cursor: pointer;
4528 display: flex;
4529 justify-content: space-between;
4530 align-items: center; }
4531 .wtotem_reports-accordion__title::after {
4532 content: '';
4533 display: block;
4534 align-self: center;
4535 height: 20px;
4536 width: 20px;
4537 background-image: url("../img/arrow-down.svg");
4538 background-repeat: no-repeat;
4539 background-position: center center; }
4540 .wtotem_reports-accordion__content-wrapper {
4541 margin-top: 10px;
4542 border-top: 1px solid #F3F5F6; }
4543 .wtotem_reports-accordion__line-wrapper {
4544 display: flex;
4545 justify-content: space-between;
4546 padding: 10px 0; }
4547 .wtotem_reports-accordion__line-title {
4548 color: #86939E; }
4549 .wtotem_reports-accordion__line-value--success {
4550 color: #4BC374; }
4551 .wtotem_reports-accordion__line-value--warning {
4552 color: #f5c451; }
4553 .wtotem_reports-accordion__line-value--error {
4554 color: #f5c451; }
4555 .wtotem_reports-accordion__button {
4556 display: block;
4557 width: 100%;
4558 margin-bottom: 12px; }
4559 .wtotem_reports-accordion__button:last-child {
4560 margin-bottom: 0; }
4561
4562
4563 .wt-loader {
4564 z-index: 1
4565 }
4566 .wt-loader, .wt-spinner {
4567 display: flex;
4568 align-items: center;
4569 justify-content: center
4570 }
4571 .wt-spinner {
4572 position: absolute;
4573 top: 0;
4574 right: 0;
4575 bottom: 0;
4576 left: 0;
4577 background-color: hsla(0, 0%, 100%, .5);
4578 z-index: 20
4579 }
4580 .wt-loader img, .wt-loader path, .wt-spinner img {
4581 -webkit-user-select: none;
4582 -moz-user-select: none;
4583 -ms-user-select: none;
4584 user-select: none;
4585 transform: rotate(0deg);
4586 animation: 1s linear 0s normal none infinite running rot;
4587 -webkit-animation: 1s linear 0s normal none infinite running rot;
4588 }
4589
4590 .wtotem_body .wtotem_reports-modal--active {
4591 display: grid;
4592 }
4593 .wtotem_body .wtotem_reports-modal__content {
4594 position: relative;
4595 background: #FFFFFF;
4596 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
4597 border-radius: 12px;
4598 padding: 30px;
4599 min-width: 360px;
4600 }
4601
4602 .wtotem_reports-settings__field-title {
4603 font-size: 16px;
4604 line-height: 14px;
4605 margin-bottom: 20px;
4606 }
4607 .wtotem_body .wtotem_reports-settings__field-title--modules {
4608 margin-bottom: 10px;
4609 }
4610 .wtotem_body .wtotem_reports-settings__period-list {
4611 padding: 0;
4612 margin: 0;
4613 list-style: none;
4614 display: flex;
4615 width: 300px;
4616 height: 38px;
4617 margin-bottom: 20px;
4618 }
4619 .wtotem_body .wtotem_reports-settings__period-item {
4620 flex-grow: 1;
4621 border: 2px solid #E1E8EE;
4622 }
4623 .wtotem_body .wtotem_reports-settings__period-item:not(:last-child) {
4624 border-right: none;
4625 }
4626 .wtotem_body .wtotem_reports-settings__period-radio {
4627 display: none;
4628 }
4629 .wtotem_body .wtotem_reports-settings__period-label {
4630 cursor: pointer;
4631 position: relative;
4632 display: flex;
4633 justify-content: center;
4634 align-items: center;
4635 height: 100%;
4636 width: 100%;
4637 font-size: 12px;
4638 line-height: 14px;
4639 font-weight: normal;
4640 text-align: center;
4641 }
4642 .wtotem_body .wtotem_reports-settings__period-radio:checked + .wtotem_reports-settings__period-label {
4643 color: #3d50df;
4644 }
4645 .wtotem_body .wtotem_reports-settings__dates {
4646 display: flex;
4647 border-radius: 2px;
4648 border: 2px solid #E1E8EE;
4649 padding: 7px 15px;
4650 margin-bottom: 25px;
4651 }
4652 .wtotem_body .wtotem_reports-settings__dates::before {
4653 content: '';
4654 display: block;
4655 align-self: center;
4656 height: 13px;
4657 width: 15px;
4658 margin-right: 9px;
4659 background-image: url('../img/report.svg');
4660 background-repeat: no-repeat;
4661 background-position: center center;
4662 }
4663 .wtotem_body .wtotem_reports-settings__date-input {
4664 cursor: pointer;
4665 display: block;
4666 border: none;
4667 width: 0;
4668 min-width: 92px;
4669 padding-left: 10px;
4670 margin-left: 7px;
4671 font-size: 12px;
4672 line-height: 14px;
4673 font-weight: normal;
4674 text-align: right;
4675 color: inherit;
4676 background-color: transparent;
4677 }
4678
4679 .wtotem_body .wtotem_reports-settings__date-input:focus {
4680 border: 0;
4681 box-shadow: none;
4682 outline: none;
4683 }
4684
4685 .wtotem_body .wtotem_reports-settings__date-input:last-child {
4686 flex-grow: 1;
4687 text-align: left;
4688 }
4689 .wtotem_body .wtotem_reports-settings__date-divider {
4690 display: block;
4691 align-self: center;
4692 margin: 0 3px;
4693 }
4694 .wtotem_body .wtotem_reports-settings__modules-list {
4695 padding: 0;
4696 margin: 0;
4697 list-style: none;
4698 margin-bottom: 20px;
4699 }
4700 .wtotem_reports-settings__module-item {
4701 position: relative;
4702 display: flex;
4703 align-items: center;
4704 justify-content: space-between;
4705 min-height: 48px;
4706 }
4707 .wtotem_body .wtotem_reports-settings__module-item::after {
4708 content: '';
4709 position: absolute;
4710 height: 1px;
4711 left: -30px;
4712 right: -30px;
4713 bottom: 0;
4714 background-color: #EBF0F5;
4715 }
4716 .wtotem_body .wtotem_reports-settings__module-item:last-child::after {
4717 content: unset;
4718 }
4719 .wtotem_body .wtotem_reports-settings__module-title {
4720 font-size: 14px;
4721 line-height: 35px;
4722 }
4723 .wtotem_body .wtotem_reports-settings__module-label {
4724 cursor: pointer;
4725 display: block;
4726 position: relative;
4727 width: 45px;
4728 height: 35px;
4729 }
4730 .wtotem_body .wtotem_reports-settings__module-label::before {
4731 content: '';
4732 position: absolute;
4733 left: 50%;
4734 top: 50%;
4735 transform: translate(-50%, -50%);
4736 width: 100%;
4737 height: 10px;
4738 background: #E1E8EE;
4739 box-shadow: inset 0px 1px 0px rgba(189, 198, 207, 0.529014);
4740 border-radius: 100px;
4741 }
4742 .wtotem_body .wtotem_reports-settings__module-label::after {
4743 content: '';
4744 position: absolute;
4745 left: 0;
4746 top: 50%;
4747 transform: translateY(-50%);
4748 width: 18px;
4749 height: 18px;
4750 margin-left: 5px;
4751 background: #5E6977;
4752 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.189736);
4753 border-radius: 100%;
4754 transition: 0.15s;
4755 }
4756 .wtotem_body .wtotem_reports-settings__module-checkbox {
4757 display: none;
4758 }
4759 .wtotem_body .wtotem_reports-settings__module-checkbox:checked + .wtotem_reports-settings__module-label::after {
4760 background: #3D50DF;
4761 left: 100%;
4762 margin-left: -23px;
4763 }
4764 .wtotem_body .wtotem_reports-settings__btn {
4765 width: 100%;
4766 }
4767
4768 .wtotem_theme—dark .wtotem_reports-table__column,.wtotem_theme—dark .wtotem_reports-dates{
4769 background: #282828;
4770 }
4771
4772 .wtotem_theme—dark .wtotem_body .wtotem_reports-dates__input {
4773 border: 1px solid #3a3a3a;
4774 color: #ccc;
4775 }
4776
4777 .wtotem_theme—dark .wtotem_reports-table__row{
4778 background: transparent;
4779 }
4780
4781 .wtotem_theme—dark .wtotem_reports-modal{
4782 color: #ddd;
4783 }
4784
4785 .wtotem_theme—dark .wtotem_body .wtotem_reports-modal__content{
4786 background: #282828;
4787 }
4788
4789 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__dates,
4790 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__period-item{
4791 border: 2px solid #35383b;
4792 }
4793
4794 .wtotem_theme—dark .wtotem_reports-modal__close{
4795 background-image: url(../img/close.svg);
4796 }
4797
4798 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__module-item::after{
4799 background-color: #35383b;
4800 }
4801
4802 .wtotem_theme—dark .wtotem_reports-accordion__header, .wtotem_theme—dark .wtotem_reports-accordion__item{
4803 background: #282828;
4804 color: #d6d6d6;
4805 }
4806
4807 .wtotem_theme—dark .wtotem_reports-accordion__content-wrapper{
4808 border-top: 1px solid #565656;
4809 }
4810
4811 body.wtotem_theme—dark {
4812 background: #191919;
4813 }
4814
4815 .reports_load_more_td{
4816 background: transparent;
4817 border-color: transparent;
4818 }
4819
4820 /* # reports-page.css */
4821
4822
4823 /*fixes*/
4824 @media screen and (max-width: 768px) {
4825 .chart-date text{
4826 -webkit-transform: rotate(-40deg) translate(-20px);
4827 -ms-transform: rotate(-40deg) translate(-20px);
4828 transform: rotate(-40deg) translate(-20px);
4829 }
4830 }
4831
4832 @media screen and (max-width: 576px) {
4833 .wtotem_av_filters_wrapper{
4834 display: block;
4835 }
4836 }
4837
4838 /* Settings */
4839 .wtotem_firewall-section-menu-item{
4840 position: relative;
4841 margin: 15px 0;
4842 }
4843
4844 .wtotem_switch-checkbox-with-text{
4845 position: absolute;
4846 right: 6px;
4847 top: 1px;
4848 }
4849