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

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

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