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

main.css in WebTotem Security 2.4.21, at includes/css/main.css

6,832 lines 144.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1
2 /**
3 * Redefining tags styles
4 */
5 .wtotem_body *,
6 .wtotem_body *:after,
7 .wtotem_body *:before {
8 margin: 0;
9 padding: 0;
10 box-sizing: border-box;
11 }
12 .wtotem_body *:focus {
13 outline: none;
14 }
15 .wtotem_body ol,
16 .wtotem_body ul {
17 list-style: none;
18 }
19 .wtotem_body a {
20 text-decoration: none;
21 }
22 .wtotem_body a:hover {
23 text-decoration: none;
24 }
25 .wtotem_body a:focus{
26 box-shadow: none;
27 }
28 .wtotem_body .h1,
29 .wtotem_body .h2,
30 .wtotem_body .h3,
31 .wtotem_body .h4,
32 .wtotem_body .h5 {
33 color: #5e6977;
34 font-weight: 700;
35 }
36 .wtotem_body ::-webkit-input-placeholder,
37 .wtotem_body ::-moz-placeholder,
38 .wtotem_body :-moz-placeholder,
39 .wtotem_body :-ms-input-placeholder{
40 color:#86939E;
41 }
42
43 /**
44 * Base styles
45 */
46 .wtotem_body {
47 line-height: 24px;
48 font-family: "Inter", sans-serif;
49 font-size: 14px;
50 color: #5e6977;
51 font-weight: 400;;
52 margin-left: -18px;
53 }
54 .wtotem_body p{
55 font-size: 14px;
56 }
57 .wtotem_body.lock, body.lock{
58 overflow: hidden;
59 }
60 .wtotem_content {
61 padding-top: 30px;
62 padding-bottom: 5px;
63 background: #f3f5f6;
64 }
65 .wtotem_body .wt_card {
66 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
67 border-radius: 4px;
68 background: #fff;
69 }
70 .wtotem_body .button,
71 .wtotem_body .button:hover,
72 .wtotem_body .button:focus,
73 .wtotem_body .button:active {
74 background: #3d50df;
75 font-weight: 500;
76 font-size: 14px;
77 color: #fff;
78 border: none;
79 border-radius: 5px;
80 cursor: pointer;
81 display: inline-block;
82 text-align: center;
83 padding: 0 15px;
84 text-shadow: none;
85 margin: 0 0 15px;
86 /*height: 42px;*/
87 }
88 .wtotem_body .d-none {
89 display: none;
90 visibility: hidden;
91 }
92 .wtotem_body .wt-flex {
93 display: flex;
94 }
95 .wt-flex-middle {
96 align-items: center;
97 }
98 .wtotem_body .visually-hidden {
99 position: absolute;
100 /* IE6, IE7 */
101 clip: rect(1px 1px 1px 1px);
102 clip: rect(1px, 1px, 1px, 1px);
103 padding: 0;
104 border: 0;
105 height: 1px;
106 width: 1px;
107 overflow: hidden;
108 }
109 .wtotem_body .title {
110 font-size: 24px;
111 font-weight: 700;
112 }
113 .wtotem_container {
114 max-width: 1020px;
115 margin: 0 auto;
116 }
117 .wtotem_button {
118 min-width: 28px;
119 padding: 5px 10px;
120 color: #3d50df;
121 font-size: 14px;
122 border-radius: 5px;
123 border: 2px solid #3d50df;
124 cursor: pointer;
125 background-color: #fff;
126 text-decoration: none;
127 }
128 .wtotem_button>*+* {
129 margin-left: 10px;
130 }
131 .wtotem_button.wtotem_button--primary {
132 border: none;
133 background-color: #3d50df;
134 color: #fff;
135 }
136 .wtotem_button_link{
137 background: none;
138 color: #3d50df;
139 width: 100%;
140 height: 42px;
141 display: flex;
142 align-items: center;
143 justify-content: center;
144 cursor: pointer;
145 padding: 0 20px;
146 margin-top: 15px;
147 }
148 .wtotem_title-info__title {
149 font-size: 14px;
150 text-transform: uppercase;
151 }
152 .wtotem_block_center {
153 margin: 20px auto;
154 display: block;
155 width: fit-content;
156 }
157 .wtotem_body .text-align-center {
158 text-align: center;
159 }
160 .wtotem_body .break-word {
161 overflow-wrap: break-word;
162 word-wrap: break-word;
163 word-break: break-all;
164 }
165 .wtotem-font-700 {
166 font-weight: 700;
167 }
168 .wtotem-ml-20 {
169 margin-left: 20px;
170 }
171 .wtotem-mr-10 {
172 margin-right: 10px;
173 }
174 .wtotem-mb-15 {
175 margin-bottom: 15px;
176 }
177 .wtotem-mb-20 {
178 margin-bottom: 20px;
179 }
180 .wtotem_title-info__info {
181 background: url("../img/info-gray.svg") no-repeat center center/cover;
182 display: inline-block;
183 vertical-align: middle;
184 width: 17px;
185 height: 17px;
186 margin-top: -2px;
187 }
188 .wtotem_title-info__info .tlite {
189 text-transform: none;
190 }
191 .wtotem_body .section-header {
192 display: flex;
193 justify-content: space-between;
194 align-items: center;
195 margin-bottom: 25px;
196 }
197 .wtotem_input_error {
198 border-color: #cc0000!important;
199 }
200 .wtotem_body .wt-text.wt-text--blue {
201 color: #3d50df;
202 }
203 .wtotem_body .wt-text.wt-text--uppercase {
204 text-transform: uppercase;
205 }
206 .wtotem_body .arrow-right {
207 color: #3d50df;
208 cursor: pointer;
209 display: flex;
210 align-items: center;
211 }
212 .wtotem_body .arrow-right:after {
213 content: "";
214 border: solid #3d50df;
215 border-width: 0 1px 1px 0;
216 display: inline-block;
217 padding: 3px;
218 -webkit-transform: rotate(-45deg);
219 transform: rotate(-45deg);
220 margin-left: 10px;
221 }
222 .wtotem_body .wt-icon {
223 /*cursor: pointer;*/
224 display: flex;
225 align-items: center;
226 justify-content: center;
227 }
228 .wtotem_print {
229 display: flex;
230 align-items: center;
231 cursor: pointer;
232 }
233 .wtotem_print__img {
234 display: block;
235 width: 17px;
236 height: 17px;
237 margin-right: 10px;
238 background: url("../img/print.svg") no-repeat center center/cover;
239 }
240 .wtotem_print__label {
241 color: #86939e;
242 }
243 .wtotem_body .section-header-mb {
244 margin-bottom: 25px;
245 }
246 .wtotem-content-text{
247 color: #818181;
248 font-size: 14px;
249 }
250 h3.wtotem-content-text{
251 color: #5E6977;
252 font-size: 16px;
253 }
254 .wtotem-two_in_one{
255 width: 49%;
256 padding-right: 10px;
257 display: inline-block;
258 vertical-align: top;
259 }
260
261 /*
262 * Base Large 992-1100px
263 */
264 @media screen and (max-width: 1100px) {
265 .wtotem_container {
266 max-width: 960px;
267 }
268 }
269
270 /*
271 * Base Medium 768-992px
272 */
273 @media screen and (max-width: 992px) {
274 .wtotem_container {
275 max-width: 720px;
276 }
277 }
278
279 /*
280 * Base Small 576-768px
281 */
282 @media screen and (max-width: 768px) {
283 .wtotem_body {
284 overflow: hidden;
285 }
286
287 .wtotem_body .section-header-mb {
288 margin-bottom: 20px;
289 }
290 .wtotem_body .arrow-right:after {
291 margin-left: 5px;
292 }
293
294 .wtotem_container {
295 max-width: 540px;
296 }
297 .wtotem_content {
298 padding-top: 19px;
299 }
300 .wtotem-two_in_one{
301 width: 100%;
302 }
303 }
304
305 /*
306 * Base Extra small 375-576px
307 */
308 @media screen and (max-width: 576px) {
309 .wtotem_container {
310 max-width: 345px;
311 }
312
313 .wtotem_body .wt_card {
314 flex-wrap: wrap
315 }
316 }
317
318 /*
319 * Base Extra small 320-375px
320 */
321 @media screen and (max-width: 374px) {
322 .wtotem_container {
323 padding: 0 10px;
324 }
325 }
326
327 /**
328 * Test styles
329 */
330 .wtotem_body .wt-text.wt-text--red {
331 color: #ee3f3f;
332 }
333 .wtotem_body .wt-text.wt-text--green {
334 color: #4bc374;
335 }
336 .wtotem_body .wt-text.wt-text--yellow {
337 color: #dcb320;
338 }
339 .wtotem_body .wt-text.wt-text--blue {
340 color: #3d50df;
341 }
342 .wtotem_body .wt-text.wt-text--gray {
343 color: #86939e;
344 }
345 .wtotem_body .wt-text.wt-text--light-gray {
346 color: #bdc6cf;
347 }
348 .wtotem_body .wt-text.wt-text--black {
349 color: #000000;
350 }
351
352 /**
353 * Tabs styles
354 */
355 .wtotem-tabs__content {
356 /* by default, we hide all the blocks */
357 display: none;
358 }
359 .wtotem-tabs__content.active {
360 /*by default, we show the desired block*/
361 display: block;
362 }
363
364 /**
365 * Header styles
366 */
367 .wtotem_header {
368 position: relative;
369 z-index: 4;
370 width: 100%;
371 top: 0;
372 left: 0;
373 }
374 .wtotem_header__body {
375 display: flex;
376 justify-content: space-between;
377 align-items: center;
378 }
379 .wtotem_header:before {
380 content: "";
381 position: absolute;
382 top: 0;
383 left: 0;
384 width: 100%;
385 height: 100%;
386 background: #fff;
387 z-index: 2;
388 }
389 .wtotem_version {
390 position: relative;
391 z-index: 100;
392 display: flex;
393 align-items: center;
394 }
395 .wtotem_version__count {
396 width: 28px;
397 height: 18px;
398 display: flex;
399 justify-content: center;
400 align-items: center;
401 font-size: 10px;
402 font-weight: 500;
403 border: 1px solid #3d50df;
404 border-radius: 4px;
405 margin-left: 8px;
406 }
407 .wtotem_logo {
408 width: 113px;
409 height: 24px;
410 background: url("../img/logo.svg") no-repeat center center/cover;
411 }
412 .wtotem_nav {
413 position: relative;
414 z-index: 3;
415 height: 70px;
416 }
417 .wtotem_nav .wtotem_control__checkbox {
418 align-self: center;
419 }
420 .wtotem_nav__menu {
421 display: flex;
422 height: 100%;
423 list-style-type: none;
424 }
425 .wtotem_nav__link {
426 position: relative;
427 display: flex;
428 align-items: center;
429 height: 100%;
430 font-size: 14px;
431 color: #5e6977;
432 font-weight: 500;
433 padding: 0 13px;
434 }
435 .wtotem_nav__link_active {
436 color: #3d50df;
437 }
438 .wtotem_nav__link_active:before {
439 content: "";
440 position: absolute;
441 bottom: 0;
442 right: 0;
443 left: 0;
444 background: #3d50df;
445 height: 3px;
446 }
447
448 .wtotem_nav__menu .wtotem_control__input{
449 display: none;
450 }
451
452 /**
453 * Header Small styles 576-768px
454 */
455 @media screen and (max-width: 1000px) {
456 .wtotem_version {
457 position: relative;
458 z-index: 3;
459 }
460 .wtotem_header__body {
461 height: 65px;
462 }
463 .wtotem_nav {
464 position: fixed;
465 top: -100%;
466 left: 0;
467 width: 100%;
468 height: 100%;
469 background: #f3f5f6;
470 display: block;
471 padding-top: 65px;
472 transition: all 0.3s ease-in-out;
473 overflow: auto;
474 z-index: 1;
475 margin-top: 63px;
476 }
477 .wtotem_nav__menu {
478 display: block;
479 }
480 .wtotem_nav__item {
481 border-bottom: 1px solid #eceff4;
482 padding: 12px 0;
483 }
484 .wtotem_nav__link {
485 height: auto;
486 display: block;
487 color: #1d293f;
488 font-size: 24px;
489 padding: 22px 0;
490 width: 540px;
491 margin: 0 auto;
492 }
493 .wtotem_nav__link_active {
494 color: #3d50df;
495 }
496 .wtotem_nav__link_active:before {
497 display: none;
498 }
499 .wtotem_nav__link:focus {
500 box-shadow: none;
501 }
502 .wtotem_nav.active {
503 top: 0;
504 }
505 .wtotem_burger {
506 position: relative;
507 width: 23px;
508 height: 18px;
509 display: flex;
510 align-items: center;
511 justify-content: flex-end;
512 cursor: pointer;
513 z-index: 3;
514 }
515 .wtotem_burger:before,
516 .wtotem_burger__middle-line,
517 .wtotem_burger:after {
518 content: "";
519 background: #3d50df;
520 height: 2px;
521 display: block;
522 right: 0;
523 border-radius: 100px;
524 transition: all 0.3s ease-in-out;
525 }
526 .wtotem_burger:before {
527 position: absolute;
528 width: 23px;
529 top: 0;
530 }
531 .wtotem_burger__middle-line {
532 width: 18px;
533 }
534 .wtotem_burger:after {
535 position: absolute;
536 width: 14px;
537 bottom: 0;
538 }
539 .wtotem_burger.active .wtotem_burger__middle-line {
540 transform: scale(0);
541 }
542 .wtotem_burger.active:before {
543 transform: rotate(45deg);
544 top: 8px;
545 }
546 .wtotem_burger.active:after {
547 transform: rotate(-45deg);
548 width: 100%;
549 bottom: 8px;
550 }
551 }
552
553
554
555 /**
556 * Header styles 576-1160px
557 */
558 @media screen and (max-width: 1150px) {
559 .wtotem_nav__link {
560 padding: 0 8px;
561 }
562 }
563
564 /**
565 * Header Extra small styles 320-576px
566 */
567 @media screen and (max-width: 1000px) {
568 .wtotem_nav__link {
569 width: 345px;
570 margin: 0 auto;
571 }
572 }
573
574 /**
575 * Header Extra small styles 320-375px
576 */
577 @media screen and (max-width: 375px) {
578 .wtotem_nav__link {
579 padding-left: 10px;
580 }
581 }
582
583 /**
584 * All sites page styles
585 */
586 .wtotem_body td,
587 .wtotem_body th {
588 border: solid 1px #fff;
589 padding-right: 5px;
590 background-color: white;
591 }
592 .wtotem_body td:first-child,
593 .wtotem_body th:first-child {
594 border-left-style: solid;
595 border-top-left-radius: 10px;
596 border-bottom-left-radius: 10px;
597 padding-left: 20px;
598 }
599 .wtotem_body td:last-child,
600 .wtotem_body th:last-child {
601 border-right-style: solid;
602 border-bottom-right-radius: 10px;
603 border-top-right-radius: 10px;
604 padding-right: 20px;
605 width: 220px;
606 }
607 .wtotem_body #all_sites_wrap td:last-child{
608 padding-top: 20px;
609 width: 150px;
610 }
611
612 .wtotem_all__first {
613 display: flex;
614 justify-content: space-between;
615 align-items: center;
616 }
617 .wtotem_all__btn {
618 min-width: 114px;
619 }
620 .wtotem_all__table {
621 width: 100%;
622 border-collapse: separate;
623 margin-bottom: 16px;
624 border-spacing: 0 10px;
625 }
626 .wtotem_all__tr {
627 height: 70px;
628 border-radius: 10px;
629 margin-bottom: 20px;
630 }
631 .wtotem_all__th {
632 text-align: left;
633 font-weight: normal;
634 font-size: 14px;
635 line-height: 24px;
636 color: #5e6977;
637
638 }
639 .wtotem_all__td:last-child {
640 text-align: right;
641 }
642 .wtotem_all__title-tr {
643 font-weight: bold;
644 font-size: 16px;
645 line-height: 24px;
646 color: #5e6977;
647 }
648 .wtotem_all__url {
649 font-weight: normal;
650 font-size: 14px;
651 }
652 .wtotem_all__status_need {
653 color: #ee3f3f;
654 font-weight: bold;
655 font-size: 14px;
656 text-transform: uppercase;
657 }
658 .wtotem_all__status_scannig {
659 color: #5e6977;
660 font-weight: bold;
661 font-size: 14px;
662 text-transform: uppercase;
663 }
664 .wtotem_all__td-btn {
665 min-width: 107px;
666 }
667 .wtotem_all__more {
668 display: block;
669 min-width: 132px;
670 margin: 0 auto;
671 }
672 .wtotem__no-data-icon {
673 background: #e5ebf0;
674 box-shadow: 0 2px 4px rgb(0 0 0 / 5%);
675 border-radius: 12px;
676 padding: 18px 20px;
677 margin-bottom: 18px;
678 }
679 .wtotem__no-data {
680 display: flex;
681 flex-direction: column;
682 align-items: center;
683 padding: 100px;
684 color: #86939e;
685 }
686
687 /**
688 * All sites small styles max-width 992px
689 */
690 @media screen and (max-width: 992px) {
691 .wtotem_all__first {
692 margin-bottom: 10px;
693 }
694 .wtotem_body thead {
695 display: none;
696 }
697 .wtotem_body td:nth-child(2),
698 .wtotem_body td:nth-child(3),
699 .wtotem_body td:nth-child(4),
700 .wtotem_body td:nth-child(5) {
701 display: none;
702 }
703 .wtotem_body .port-scanner-list td:last-child{
704 display: block;
705 }
706 }
707
708 /**
709 * All sites small styles max-width 576px
710 */
711 @media screen and (max-width: 576px) {
712 .wtotem_all__first {
713 flex-direction: column;
714 align-items: flex-start;
715 }
716 .wtotem_all__first h2 {
717 margin-bottom: 30px;
718 }
719 .wtotem_all__first button {
720 width: 100%;
721 }
722 }
723
724 /**
725 * Calendar styles
726 */
727 .wtotem_chart__calendars {
728 display: flex;
729 background: #f3f5f6;
730 border-radius: 5px;
731 align-items: center;
732 padding: 5px 8px;
733 margin-right: 7px;
734 margin-left: auto;
735 }
736 .wtotem_calendar-icon {
737 background: url(../img/shape.svg) no-repeat center center / cover;
738 display: block;
739 width: 14px;
740 height: 14px;
741 margin-right: 3px;
742 }
743 .wtotem_body input.wtotem_calendar {
744 background: transparent;
745 border: none;
746 color: #5e6977;
747 width: 125px;
748 cursor: pointer;
749 text-align: center;
750 box-shadow: none;
751 }
752 input.wtotem_calendar:focus {
753 border: none;
754 box-shadow: none;
755 outline: 0;
756 }
757 .wtotem_calendar-connect {
758 margin: 0 3px;
759 }
760 .wtotem_body .numInputWrapper span {
761 opacity: 1;
762 right: 3px;
763 }
764 .numInputWrapper span.arrowUp {
765 top: 15%;
766 }
767 .numInputWrapper span.arrowDown {
768 top: 35%;
769 }
770 .flatpickr-calendar {
771 font-family: "Inter", sans-serif;
772 width: 225px;
773 padding: 5px;
774 border: 2px solid #e1e8ee;
775 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
776 border-radius: 5px;
777 margin-top: 10px;
778 }
779 .flatpickr-calendar.arrowTop:before {
780 border: 5px solid transparent;
781 border-bottom: 5px solid #e1e8ee;
782 top: -12px;
783 }
784 .flatpickr-calendar.arrowTop:after {
785 border: 5px solid transparent;
786 border-bottom: 5px solid #e1e8ee;
787 top: -12px;
788 }
789 .flatpickr-calendar .dayContainer {
790 justify-content: flex-start;
791 width: 225px;
792 min-width: 225px;
793 max-width: 225px;
794 align-items: center;
795 }
796 .flatpickr-calendar .flatpickr-days {
797 width: 225px;
798 }
799 .flatpickr-calendar .flatpickr-weekdays {
800 display: none;
801 }
802 .flatpickr-calendar .flatpickr-day {
803 border-radius: 0;
804 font-size: 12px;
805 max-width: 29px;
806 font-weight: 500;
807 margin-bottom: 12px;
808 line-height: 5px;
809 height: 20px;
810 display: flex;
811 align-items: center;
812 justify-content: center;
813 }
814 .flatpickr-calendar .flatpickr-day:nth-last-child(-n + 7) {
815 margin-bottom: 0;
816 }
817 .flatpickr-calendar .flatpickr-day.today,
818 .flatpickr-calendar .flatpickr-day.today.inRange {
819 color: #393939;
820 }
821 .flatpickr-calendar.flatpickr-day.today.selected {
822 color: #fff;
823 }
824 .flatpickr-calendar .flatpickr-day.inRange,
825 .flatpickr-calendar .flatpickr-day.today.inRange {
826 background: #e1e8ee;
827 box-shadow: none;
828 margin-top: 0;
829 }
830 .flatpickr-calendar .flatpickr-day.selected,
831 .flatpickr-calendar .flatpickr-day.endRange,
832 .flatpickr-calendar .flatpickr-day.startRange {
833 background: #3d50df;
834 border-radius: 5px 5px 5px 5px;
835 }
836 .flatpickr-calendar .flatpickr-day.selected,
837 .flatpickr-calendar .flatpickr-day.startRange,
838 .flatpickr-calendar .flatpickr-day.endRange,
839 .flatpickr-calendar .flatpickr-day.selected.inRange,
840 .flatpickr-calendar .flatpickr-day.startRange.inRange,
841 .flatpickr-calendar .flatpickr-day.endRange.inRange,
842 .flatpickr-calendar .flatpickr-day.selected:focus,
843 .flatpickr-calendar .flatpickr-day.startRange:focus,
844 .flatpickr-calendar .flatpickr-day.endRange:focus,
845 .flatpickr-calendar .flatpickr-day.selected:hover,
846 .flatpickr-calendar .flatpickr-day.startRange:hover,
847 .flatpickr-calendar .flatpickr-day.endRange:hover,
848 .flatpickr-calendar .flatpickr-day.selected.prevMonthDay,
849 .flatpickr-calendar .flatpickr-day.startRange.prevMonthDay,
850 .flatpickr-calendar .flatpickr-day.endRange.prevMonthDay,
851 .flatpickr-calendar .flatpickr-day.selected.nextMonthDay,
852 .flatpickr-calendar .flatpickr-day.startRange.nextMonthDay,
853 .flatpickr-calendar .flatpickr-day.endRange.nextMonthDay {
854 background: #3d50df;
855 border-radius: 5px 5px 5px 5px;
856 height: 24px;
857 }
858 .flatpickr-calendar .flatpickr-months .flatpickr-prev-month,
859 .flatpickr-calendar .flatpickr-months .flatpickr-next-month {
860 display: none;
861 }
862 .flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months {
863 width: 93px;
864 height: 31px;
865 padding: 6px 10px 7px;
866 border: 1px solid #e1e8ee;
867 border-radius: 2px;
868 }
869 .flatpickr-calendar .flatpickr-monthDropdown-months,
870 .flatpickr-calendar .flatpickr-current-month input.cur-year {
871 width: 93px;
872 height: 31px;
873 padding: 6px 10px 7px;
874 border: 1px solid #e1e8ee;
875 border-radius: 2px;
876 }
877 .flatpickr-calendar .flatpickr-current-month .numInputWrapper {
878 width: 93px;
879 }
880 .flatpickr-calendar .flatpickr-current-month .numInputWrapper span.arrowDown:after,
881 .flatpickr-calendar .flatpickr-current-month .numInputWrapper span.arrowUp:after {
882 border-top-color: rgba(134, 147, 158, 1);
883 border-bottom-color: rgba(134, 147, 158, 1);
884 }
885 .flatpickr-calendar .flatpickr-month {
886 text-align-last: left;
887 margin-bottom: 13px;
888 position: relative;
889 }
890 .flatpickr-calendar .flatpickr-month:after {
891 content: "";
892 display: block;
893 border: 4px solid transparent;
894 border-top: 4px solid #86939e;
895 position: absolute;
896 right: 60%;
897 top: 43%;
898 }
899 .flatpickr-calendar .flatpickr-current-month {
900 left: 0;
901 width: 205px;
902 padding: 0;
903 display: flex;
904 align-items: center;
905 justify-content: space-between;
906 }
907 .flatpickr-calendar .flatpickr-monthDropdown-months,
908 .flatpickr-calendar .flatpickr-current-month input.cur-year {
909 -webkit-appearance: none;
910 -moz-appearance: none;
911 /*appearance: none;*/
912 color: #5e6977;
913 font-size: 12px;
914 }
915 .flatpickr-calendar .numInputWrapper span {
916 border: none;
917 }
918 .flatpickr-calendar .numInputWrapper span:hover {
919 background: transparent;
920 }
921
922 /**
923 * Calendar Small styles 768px
924 */
925 @media screen and (max-width: 768px) {
926 .wtotem_chart__calendars{
927 margin-left: 0;
928 }
929 }
930
931 /**
932 * Footer styles
933 */
934 .wtotem_footer {
935 padding-top: 18px;
936 padding-bottom: 20px;
937 background: #f3f5f6;
938 }
939 .wtotem_footer__first {
940 display: flex;
941 justify-content: space-between;
942 align-items: center;
943 margin-bottom: 21px;
944 }
945 .wtotem_footer__caption {
946 display: flex;
947 align-items: center;
948 }
949 .wtotem_footer__logo {
950 margin-right: 12px;
951 background: url("../img/logo-blue.svg") no-repeat center center/cover;
952 width: 20px;
953 height: 32px;
954 }
955 .wtotem_footer__text {
956 font-size: 12px;
957 color: #5e6977;
958 line-height: 12px;
959 font-weight: 500;
960 }
961 .wtotem_footer__contacts {
962 width: 200px;
963 display: flex;
964 justify-content: space-between;
965 }
966 .wtotem_footer__link {
967 font-weight: 500;
968 }
969 .wtotem_footer__line {
970 height: 1px;
971 background: #e1e8ee;
972 margin-bottom: 26px;
973 }
974 .wtotem_footer__bottom {
975 display: flex;
976 justify-content: space-between;
977 align-items: center;
978 }
979 .wtotem_footer__left {
980 display: flex;
981 justify-content: space-between;
982 align-items: center;
983 width: 255px;
984 }
985 .wtotem_footer__text {
986 font-size: 12px;
987 font-weight: 500;
988 color: #5e6977;
989 }
990 .wtotem_footer__soc-link {
991 margin-right: 20px;
992 }
993 .wtotem_footer__soc-link:last-child {
994 margin-right: 0;
995 }
996 .wtotem_footer__payment {
997 width: 166px;
998 display: flex;
999 justify-content: space-between;
1000 align-items: center;
1001 }
1002
1003 /**
1004 * Footer Small styles 576-768px
1005 */
1006 @media screen and (max-width: 768px) {
1007 .wtotem_footer__store,
1008 .wtotem_footer__soc,
1009 .wtotem_footer__payment,
1010 .wtotem_footer__line {
1011 display: none;
1012 }
1013 .wtotem_footer__caption,
1014 .wtotem_footer__left,
1015 .wtotem_footer__text {
1016 margin: 0 auto;
1017 }
1018 .wtotem_footer__caption {
1019 flex-direction: column;
1020 }
1021 .wtotem_footer__logo {
1022 margin-bottom: 18px;
1023 }
1024 }
1025
1026 /**
1027 * Tooltip
1028 */
1029 .wtotem-tooltip {
1030 cursor: pointer;
1031 display: inline-block;
1032 position: relative;
1033 margin-left: 3px;
1034 }
1035 .wtotem-tooltip__content {
1036 visibility: hidden;
1037 border-radius: 8px;
1038 padding: 10px;
1039 color: #f5f5f6;
1040 font-size: 12px;
1041 line-height: 18px;
1042 background-color: #1d293f;
1043 text-transform: none;
1044 min-width: 300px;
1045 position: absolute;
1046 z-index: 51;
1047 transform: translateY(-50%);
1048 left: 25px;
1049 }
1050 .wtotem-tooltip-top .wtotem-tooltip__content {
1051 bottom: 20px;
1052 transform: translate(-50%,0);
1053 left: 10px;
1054 min-width: 180px;
1055 }
1056 .wtotem-tooltip.wtotem-tooltip-top .wtotem-tooltip__content::after{
1057 top: 100%;
1058 right: 50%;
1059 border-color: #1d293f transparent transparent transparent;
1060 }
1061 .wtotem-tooltip-bottom .wtotem-tooltip__content {
1062 top: 20px;
1063 transform: translate(-50%,0);
1064 left: 10px;
1065 min-width: 180px;
1066 }
1067 .wtotem-tooltip.wtotem-tooltip-bottom .wtotem-tooltip__content::after{
1068 top: -6px;
1069 right: 50%;
1070 border-color: transparent transparent #1d293f transparent;
1071 }
1072 .wtotem-tooltip__text {
1073 font-size: 12px;
1074 line-height: 18px;
1075 font-weight: normal;
1076 margin-bottom: 5px;
1077 }
1078 .wtotem-tooltip__text:last-child {
1079 margin-bottom: 0;
1080 }
1081 .wtotem-tooltip__header {
1082 font-weight: bold;
1083 margin: 0 0 5px;
1084 }
1085 .wtotem-tooltip .wtotem-tooltip__content::after {
1086 content: "";
1087 position: absolute;
1088 top: 50%;
1089 right: 100%;
1090 border-style: solid;
1091 border-color: transparent #1d293f transparent transparent;
1092 }
1093 .wtotem-tooltip:hover .wtotem-tooltip__content {
1094 visibility: visible;
1095 }
1096
1097 /**
1098 * Tooltip Small styles 768px
1099 */
1100 @media screen and (max-width: 768px) {
1101
1102 }
1103
1104
1105 /**
1106 * Page header
1107 */
1108 .wtotem_page-header {
1109 margin-bottom: 40px;
1110 }
1111 .wtotem_page-header__first {
1112 display: flex;
1113 justify-content: space-between;
1114 align-items: center;
1115 margin-bottom: 55px;
1116 }
1117 .wtotem_page-header__sub-title {
1118 font-weight: bold;
1119 font-size: 16px;
1120 line-height: 19px;
1121 color: #86939e;
1122 margin-bottom: 15px;
1123 }
1124 .wtotem_page-header__title {
1125 font-weight: bold;
1126 font-size: 32px;
1127 line-height: 18px;
1128 color: #3d50df;
1129 }
1130 .wtotem_page-header__btn {
1131 min-width: 114px;
1132 height: 36px;
1133 }
1134 .wtotem_page-header__menu {
1135 display: flex;
1136 justify-content: space-between;
1137 border-bottom: 1px solid #e1e8ee;
1138 padding-bottom: 15px;
1139 overflow-x: auto;
1140 overflow-y: hidden;
1141 }
1142 .wtotem_page-header ::-webkit-scrollbar {
1143 display: none;
1144 }
1145 .wtotem_page-header__list {
1146 display: flex;
1147 }
1148 .wtotem_page-header__item {
1149 margin-right: 20px;
1150 }
1151 .wtotem_page-header__item:last-child {
1152 margin-right: 0;
1153 }
1154 .wtotem_page-header__link {
1155 color: #5e6977;
1156 font-size: 14px;
1157 padding: 0 5px;
1158 white-space: nowrap;
1159 }
1160 .wtotem_page-header__link_active {
1161 color: #3d50df;
1162 font-weight: bold;
1163 position: relative;
1164 }
1165 .wtotem_page-header__link_active::after {
1166 content: "";
1167 display: block;
1168 width: 100%;
1169 height: 2px;
1170 border-radius: 10px;
1171 position: absolute;
1172 background: #3d50df;
1173 bottom: -20px;
1174 }
1175
1176 /* 576-768px sm Small */
1177 @media screen and (max-width: 768px) {
1178 .wtotem_page-header__item {
1179 margin-right: 25px;
1180 }
1181 .wtotem_page-header__item:last-child {
1182 margin-right: 25px;
1183 }
1184 .wtotem_page-header__list:last-child .wtotem_page-header__item:last-child {
1185 margin-right: 0;
1186 }
1187 }
1188
1189 /* 320-576px Extra small */
1190 @media screen and (max-width: 576px) {
1191 .wtotem_page-header__sub-title {
1192 font-weight: normal;
1193 font-size: 14px;
1194 margin-bottom: 10px;
1195 }
1196 .wtotem_page-header__title {
1197 font-size: 24px;
1198 }
1199 .wtotem_page-header__first {
1200 margin-bottom: 25px;
1201 }
1202 .wtotem_page-header__btn {
1203 display: none;
1204 }
1205 }
1206
1207 /**
1208 * Checkbox styles
1209 */
1210 .wtotem_body .wt-checkbox__input {
1211 position: absolute!important;
1212 clip: rect(1px 1px 1px 1px);
1213 /* IE6, IE7 */
1214 clip: rect(1px, 1px, 1px, 1px);
1215 padding: 0!important;
1216 border: 0!important;
1217 height: 1px!important;
1218 width: 1px!important;
1219 overflow: hidden!important;
1220 }
1221 .wtotem_body .wt-checkbox__label {
1222 cursor: pointer;
1223 position: relative;
1224 padding-left: 28px;
1225 font-weight: 500;
1226 font-size: 14px;
1227 line-height: 20px;
1228 }
1229 .wtotem_body .wt-checkbox__label::before {
1230 content: "";
1231 position: absolute;
1232 height: 18px;
1233 width: 18px;
1234 top: 50%;
1235 left: 0;
1236 transform: translateY(-50%);
1237 background-color: #3d50df;
1238 border-radius: 4px;
1239 }
1240 .wtotem_body .wt-checkbox__input:checked + .wt-checkbox__label::before {
1241 background: #3d50df url("../img/checkbox-mark.svg") no-repeat center center;
1242 }
1243
1244 /**
1245 * Help page styles
1246 */
1247 .wtotem_help-links {
1248 font-weight: 500;
1249 line-height: 1.5;
1250 }
1251 .wtotem_help-links__item {
1252 width: 100%;
1253 background: #ffffff;
1254 margin-bottom: 6px;
1255 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
1256 border-radius: 4px;
1257 }
1258 .wtotem_help-links__item:last-child {
1259 margin-bottom: 0;
1260 }
1261 .wtotem_help-links__title {
1262 cursor: pointer;
1263 padding: 18px 14px;
1264 display: flex;
1265 justify-content: space-between;
1266 align-items: center;
1267 color: #1d293f;
1268 font-size: 24px;
1269 }
1270 .wtotem_help-links__title::after {
1271 content: '';
1272 display: block;
1273 align-self: center;
1274 height: 20px;
1275 width: 20px;
1276 background: url("../img/arrow-right-blue.svg") no-repeat center center;
1277 }
1278
1279 /**
1280 * Loader dots
1281 */
1282 .wtotem-loader {
1283 display: flex;
1284 flex-direction: column;
1285 align-items: center;
1286 justify-content: center;
1287 z-index: 1;
1288 }
1289 .wtotem-loader__wrapper {
1290 display: flex;
1291 justify-content: center;
1292 align-items: center;
1293 width: 54px;
1294 height: 54px;
1295 background: #e5ebf0;
1296 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.005);
1297 border-radius: 12px;
1298 margin-bottom: 20px;
1299 }
1300 .wtotem-loader__text {
1301 line-height: 24px;
1302 font-size: 14px;
1303 }
1304 .wtotem-loader__text--blue {
1305 color: #3d50df;
1306 }
1307 .wtotem-loader__dots {
1308 display: flex;
1309 justify-content: space-between;
1310 }
1311 .wtotem-loader__dots span {
1312 border-radius: 50%;
1313 opacity: 0.2;
1314 background: #3d50df;
1315 width: 6px;
1316 height: 6px;
1317 display: block;
1318 }
1319 .wtotem-loader__dots span:first-child {
1320 animation: fball 1350ms infinite linear;
1321 }
1322 .wtotem-loader__dots span:nth-child(2) {
1323 animation: sball 1350ms infinite linear;
1324 }
1325 .wtotem-loader__dots span:last-child {
1326 animation: tball 1350ms infinite linear;
1327 }
1328
1329 /**
1330 * Loader spinner
1331 */
1332 .wtotem_loader_spinner{
1333 position: relative;
1334 }
1335 .wtotem_loader_spinner::before{
1336 content: "";
1337 background-image: url(../img/spinner.svg);
1338 z-index: 101;
1339 position: absolute;
1340 width: 64px;
1341 height: 64px;
1342 top: 50%;
1343 left: 50%;
1344 margin-left: -32px;
1345 margin-top: -32px;
1346 transform: rotate(0deg);
1347 animation: 1s linear 0s normal none infinite running rot;
1348 -webkit-animation: 1s linear 0s normal none infinite running rot;
1349 }
1350 .wtotem_loader_spinner::after{
1351 content: "";
1352 background: #fff;
1353 height: 100%;
1354 width: 100%;
1355 position: absolute;
1356 top: 0;
1357 left: 0;
1358 z-index: 100;
1359 opacity: .7;
1360 }
1361 .wtotem_body div.wtotem_min_loader_spinner{
1362 position: relative;
1363 background: transparent;
1364 border: 1px solid #3d50df;
1365 color: #3d50df;
1366 padding-left: 32px;
1367 pointer-events: none;
1368 cursor: default;
1369 }
1370 .wtotem_body .wtotem_min_loader_spinner::before{
1371 content: "";
1372 background-image: url(../img/spinner_.svg);
1373 z-index: 101;
1374 position: absolute;
1375 width: 16px;
1376 height: 16px;
1377 top: 50%;
1378 left: 16px;
1379 margin-left: -8px;
1380 margin-top: -8px;
1381 transform: rotate(0deg);
1382 animation: 1s linear 0s normal none infinite running rot;
1383 -webkit-animation: 1s linear 0s normal none infinite running rot;
1384 }
1385
1386 /**
1387 * Scoring block styles
1388 */
1389 .wtotem_first {
1390 margin-bottom: 37px;
1391 display: flex;
1392 justify-content: space-between;
1393 }
1394 .wtotem_overall {
1395 padding: 21px 8px 30px 24px;
1396 width: 49%;
1397 }
1398 .wtotem_overall__title .wtotem_title-info__title {
1399 text-transform: none;
1400 font-size: 18px;
1401 }
1402 .wtotem_overall__body {
1403 display: flex;
1404 justify-content: space-between;
1405 align-items: center;
1406 margin-top: 21px;
1407 }
1408 .wtotem_overall__inner {
1409 display: flex;
1410 align-items: center;
1411 }
1412 .wtotem_overall__rectangle {
1413 width: 74px;
1414 height: 50px;
1415 background: #d56c6a;
1416 color: #fff;
1417 font-size: 32px;
1418 font-weight: 700;
1419 display: flex;
1420 align-items: center;
1421 justify-content: center;
1422 margin-right: 10px;
1423 }
1424 .wtotem_overall__figures {
1425 color: #d56c6a;
1426 font-size: 42px;
1427 font-weight: 700;
1428 }
1429 .wtotem_overall__text {
1430 font-size: 16px;
1431 color: #86939e;
1432 width: 267px;
1433 }
1434 .wtotem_info {
1435 display: flex;
1436 width: 49%;
1437 }
1438 .wtotem_info__item {
1439 padding: 23px 29px;
1440 }
1441 .wtotem_info__item:first-child {
1442 border-right: 1px solid #f3f5f6;
1443 }
1444 .wtotem_info__item .arrow-right {
1445 color: #3d50df;
1446 }
1447 .wtotem_info__item .arrow-right:after {
1448 content: "";
1449 border: solid #3d50df;
1450 border-width: 0 1px 1px 0;
1451 -webkit-transform: rotate(-45deg);
1452 transform: rotate(-45deg);
1453 margin-left: 10px;
1454 }
1455 .wtotem_info__block {
1456 margin-bottom: 10px;
1457 }
1458 .wtotem_info__subtitle {
1459 font-size: 14px;
1460 color: #86939e;
1461 margin-bottom: 3px;
1462 }
1463 .wtotem_info__info {
1464 font-size: 14px;
1465 color: #5e6977;
1466 }
1467 .wtotem_info__scoring {
1468 height: 51px;
1469 display: flex;
1470 align-items: center;
1471 justify-content: center;
1472 }
1473 .wtotem_score_red {
1474 color: #d56c6a;
1475 }
1476 .wtotem_score_orange {
1477 color: #c2b00e;
1478 }
1479 .wtotem_score_green {
1480 color: #7eb40c;
1481 }
1482 .wtotem_score_bg_red {
1483 background: #d56c6a;
1484 color: #fff;
1485 }
1486 .wtotem_score_bg_orange {
1487 background: #c2b00e;
1488 color: #fff;
1489 }
1490 .wtotem_score_bg_green {
1491 background: #7eb40c;
1492 color: #fff;
1493 }
1494
1495 /**
1496 * Scoring block Large styles 992-1100px
1497 */
1498 @media screen and (max-width: 1100px) {
1499 .wtotem_overall {
1500 width: 49%;
1501 }
1502 .wtotem_overall__body {
1503 flex-direction: column;
1504 align-items: flex-start;
1505 }
1506 .wtotem_overall__inner {
1507 margin-bottom: 15px;
1508 }
1509 .wtotem_overall__text {
1510 width: 100%;
1511 }
1512 .wtotem_info {
1513 width: 49%;
1514 }
1515 }
1516
1517 /**
1518 * Scoring block Medium styles 768-992px
1519 */
1520 @media screen and (max-width: 992px) {
1521 .wtotem_info {
1522 align-items: center;
1523 }
1524 .wtotem_info__item {
1525 padding: 13px 20px;
1526 }
1527 }
1528
1529 /**
1530 * Scoring block Small styles 576-768px
1531 */
1532 @media screen and (max-width: 768px) {
1533 .wtotem_first {
1534 flex-direction: column;
1535 margin-bottom: 20px;
1536 }
1537 .wtotem_overall {
1538 width: 100%;
1539 margin-bottom: 10px;
1540 }
1541 .wtotem_info {
1542 width: 100%;
1543 }
1544 .wtotem_info__item {
1545 width: 100%;
1546 }
1547 .wtotem_info__scoring {
1548 justify-content: flex-start;
1549 }
1550 }
1551
1552 /**
1553 * Scoring block Extra small styles 320-576px
1554 */
1555 @media screen and (max-width: 576px) {
1556 .wtotem_overall {
1557 padding-left: 22px;
1558 padding-right: 22px;
1559 }
1560 .wtotem_info {
1561 width: 100%;
1562 flex-direction: column;
1563 padding: 13px 22px 13px 22px;
1564 }
1565 .wtotem_info__item {
1566 width: 100%;
1567 padding: 0;
1568 }
1569 .wtotem_info__item:first-child {
1570 border-right: none;
1571 }
1572 .wtotem_info__block {
1573 margin-bottom: 20px;
1574 }
1575 .wtotem_info__scoring {
1576 justify-content: flex-start;
1577 height: auto;
1578 }
1579 }
1580
1581 /**
1582 * Firewall block styles
1583 */
1584 .wtotem_waf_filter__wrapper {
1585 padding: 13px 0 19px 0;
1586 }
1587 .wtotem_firewall {
1588 margin-bottom: 20px;
1589 }
1590 .wtotem_firewall__stats {
1591 display: flex;
1592 align-items: center;
1593 }
1594 .wtotem_firewall__icon {
1595 display: block;
1596 width: 14px;
1597 height: 14px;
1598 margin-right: 10px;
1599 background: url("../img/shape.svg") no-repeat center center/cover;
1600 }
1601 .wtotem_flag {
1602 width: 24px;
1603 }
1604 .wtotem_firewall__text {
1605 color: #86939e;
1606 }
1607 .wtotem_firewall__block {
1608 display: flex;
1609 justify-content: space-between;
1610 }
1611 .wtotem_numbers {
1612 width: 49%;
1613 display: flex;
1614 justify-content: space-between;
1615 align-items: center;
1616 }
1617 .wtotem_numbers__item {
1618 text-align: center;
1619 width: 33.3333333333%;
1620 height: 100%;
1621 display: flex;
1622 flex-direction: column;
1623 justify-content: center;
1624 border-right: 1px solid #f3f5f6;
1625 }
1626 .wtotem_numbers__item:last-child {
1627 border-right: none;
1628 }
1629 .wtotem_numbers__title {
1630 line-height: 18px;
1631 color: #86939e;
1632 margin-bottom: 15px;
1633 }
1634 .wtotem_numbers__figures {
1635 color: #1d293f;
1636 font-size: 32px;
1637 font-weight: 700;
1638 }
1639 .wtotem_from {
1640 width: 49%;
1641 display: flex;
1642 align-items: center;
1643 padding: 17px 23px;
1644 }
1645 .wtotem_from__arrow-right {
1646 margin-left: auto;
1647 border: solid #5e6977;
1648 border-width: 0 1px 1px 0;
1649 display: inline-block;
1650 padding: 6px;
1651 -webkit-transform: rotate(-45deg);
1652 transform: rotate(-45deg);
1653 }
1654 .wtotem_from__svg-wrap {
1655 position: relative;
1656 display: flex;
1657 align-items: center;
1658 }
1659 .wtotem_from__svg-wrap:after {
1660 content: "";
1661 position: absolute;
1662 top: 0;
1663 left: 0;
1664 z-index: 2;
1665 width: 70px;
1666 height: 70px;
1667 border-radius: 100%;
1668 border: 13px solid #f3f5f6;
1669 margin-top: 1px;
1670 }
1671 .wtotem_from__progress {
1672 position: relative;
1673 z-index: 3;
1674 width: 71px;
1675 height: 71px;
1676 }
1677 .wtotem_from__circle {
1678 stroke-width: 15px;
1679 stroke: #3d50df;
1680 fill: #ffffff00;
1681 transform-origin: center;
1682 transform: rotate(-90deg);
1683 transition: stroke-dashoffset 0.3s;
1684 stroke-dashoffset: 0;
1685 }
1686 .wtotem_from__percent {
1687 position: absolute;
1688 display: block;
1689 width: 33px;
1690 top: 33%;
1691 left: 29%;
1692 font-weight: 700;
1693 font-size: 12px;
1694 text-align: center;
1695 }
1696 .wtotem_from__info {
1697 margin-left: 18px;
1698 }
1699 .wtotem_from__title {
1700 color: #86939e;
1701 margin-bottom: 9px;
1702 }
1703 .wtotem_from__country {
1704 font-size: 18px;
1705 color: #1d293f;
1706 line-height: 18px;
1707 }
1708 .wtotem_from__country span {
1709 color: #3d50df;
1710 }
1711
1712 /**
1713 * Firewall block Large styles 992-1100px
1714 */
1715 @media screen and (max-width: 1100px) {
1716 .wtotem_numbers,
1717 .wtotem_from {
1718 width: 49%;
1719 }
1720 }
1721
1722 /**
1723 * Firewall block Small styles 576-768px
1724 */
1725 @media screen and (max-width: 768px) {
1726 .wtotem_firewall__block {
1727 flex-direction: column;
1728 }
1729 .wtotem_numbers,
1730 .wtotem_from {
1731 width: 100%;
1732 }
1733 .wtotem_numbers {
1734 height: 104px;
1735 margin-bottom: 10px;
1736 }
1737 .wtotem_from__country {
1738 font-size: 14px;
1739 }
1740 }
1741
1742 /**
1743 * Firewall block Extra small styles 320-576px
1744 */
1745 @media screen and (max-width: 576px) {
1746 .wtotem_numbers {
1747 display: flex;
1748 flex-wrap: wrap;
1749 width: 345px;
1750 height: 217px;
1751 }
1752 .wtotem_numbers__item {
1753 width: 172px;
1754 height: 108px;
1755 }
1756 .wtotem_numbers__item:last-child {
1757 border-right: 1px solid #f3f5f6;
1758 }
1759 }
1760
1761 /**
1762 * Firewall block Extra small styles 320-375px
1763 */
1764 @media screen and (max-width: 374px) {
1765 .wtotem_numbers {
1766 width: 300px;
1767 }
1768 .wtotem_numbers__item {
1769 width: 150px;
1770 }
1771 }
1772
1773 /**
1774 * Firewall log report styles
1775 */
1776 .firewall-log-report {
1777 height: 100vh;
1778 overflow-y: scroll;
1779 position: relative;
1780 }
1781 .firewall-log-report__close {
1782 width: 24px;
1783 height: 24px;
1784 display: flex;
1785 justify-content: center;
1786 align-items: center;
1787 background-color: transparent;
1788 border-radius: 50%;
1789 border: 1px solid #5e6977;
1790 transform: rotate(45deg);
1791 cursor: pointer;
1792 }
1793 .firewall-log-report__header-wrapper {
1794 display: flex;
1795 justify-content: space-between;
1796 align-items: center;
1797 padding: 20px;
1798 border-bottom: 1px solid #e1e8ee;
1799 }
1800 .firewall-log-report__title {
1801 margin: 0;
1802 font-size: 18px;
1803 line-height: 21px;
1804 }
1805 .firewall-log-report__list {
1806 margin: 0;
1807 padding: 0;
1808 list-style: none;
1809 display: grid;
1810 gap: 20px;
1811 grid-template-rows: repeat(6, auto);
1812 grid-auto-flow: column;
1813 padding: 20px;
1814 border-bottom: 1px solid #e1e8ee;
1815 }
1816 .firewall-log-report__item {
1817 display: flex;
1818 font-size: 14px;
1819 line-height: 17px;
1820 }
1821 .firewall-log-report__item-title {
1822 font-weight: bold;
1823 margin: 0;
1824 margin-right: 5px;
1825 }
1826 .firewall-log-report__item-value {
1827 margin: 0;
1828 text-align: left;
1829 word-break: break-all;
1830 }
1831 .firewall-log-report__item-value--blue {
1832 color: #3d50df;
1833 }
1834 .firewall-log-report__payload-wrapper {
1835 padding: 20px;
1836 text-align: left;
1837 }
1838 .firewall-log-report__payload-title {
1839 font-weight: bold;
1840 margin: 0;
1841 margin-bottom: 20px;
1842 }
1843 .firewall-log-report__payload {
1844 background: #e1e8ee;
1845 border-radius: 4px;
1846 padding: 12px;
1847 word-break: break-all;
1848 position: relative;
1849 }
1850 .wtotem_firewall-log__show-more{
1851 cursor: pointer;
1852 color: #3D50DF;
1853 }
1854 .firewall-log-report__payload-text{
1855 display: inline-block;
1856 margin-right: 50px;
1857 }
1858
1859 /**
1860 * Charts styles
1861 */
1862 .wtotem_chart__wrapper {
1863 display: flex;
1864 }
1865 .wtotem_chart {
1866 padding: 13px 0 19px 0;
1867 margin-bottom: 30px;
1868 }
1869 .wtotem_chart-first {
1870 display: flex;
1871 justify-content: space-between;
1872 align-items: center;
1873 padding: 0 26px;
1874 }
1875 .wtotem_chart-first__left {
1876 display: flex;
1877 align-items: center;
1878 }
1879 .wtotem_chart-first__all {
1880 color: #3d50df;
1881 margin-right: 10px;
1882 }
1883 .wtotem_chart-first__hack {
1884 margin-right: 15px;
1885 display: flex;
1886 align-items: center;
1887 }
1888 .wtotem_chart-first__hack p {
1889 color: #86939e;
1890 }
1891 .wtotem_chart-first__hack span {
1892 display: block;
1893 width: 7px;
1894 height: 7px;
1895 border-radius: 100px;
1896 margin-right: 7px;
1897 }
1898 .wtotem_chart-first__hack_attack span {
1899 background: #d56c6a;
1900 }
1901 .wtotem_chart-first__hack_blocked span {
1902 background: #bace3d;
1903 }
1904 .wtotem_chart-first__right {
1905 display: flex;
1906 background: #f3f5f6;
1907 height: 40px;
1908 align-items: center;
1909 justify-content: space-between;
1910 padding: 0 6px;
1911 border-radius: 5px;
1912 }
1913 .wtotem_chart-first__btn {
1914 display: flex;
1915 justify-content: center;
1916 align-items: center;
1917 width: 65px;
1918 height: 31px;
1919 border-radius: 4px;
1920 color: #5e6977;
1921 cursor: pointer;
1922 }
1923 .wtotem_chart-first__btn_active {
1924 background: #fff;
1925 color: #3d50df;
1926 }
1927 .wtotem_period_not_available {
1928 pointer-events: none;
1929 color: #ccc;
1930 }
1931 .wtotem_dark_btn {
1932 background: #1d293f;
1933 color: #fff;
1934 text-transform: initial;
1935 font-size: 14px;
1936 font-style: normal;
1937 font-weight: 400;
1938 line-height: 12px;
1939 text-align: center;
1940 display: flex;
1941 align-items: center;
1942 justify-content: center;
1943 padding: 12px 8px;
1944 border: 0;
1945 }
1946 .wtotem_dark_btn:hover {
1947 background: #1d293f;
1948 color: #fff;
1949 }
1950 .wtotem_chart__diagram {
1951 height: 251px;
1952 }
1953 .wtotem_chart__line {
1954 width: 100%;
1955 height: 1px;
1956 background: #f3f5f6;
1957 margin-bottom: 16px;
1958 }
1959 .wtotem_chart__last {
1960 display: flex;
1961 justify-content: flex-end;
1962 align-items: center;
1963 padding: 0 26px;
1964 }
1965 .wtotem_chart__text {
1966 font-weight: 500;
1967 }
1968 .wtotem_chart__text a {
1969 color: #3d50df;
1970 }
1971 .wtotem_chart__btn {
1972 background: none;
1973 border: 1px solid #3d50df;
1974 border-radius: 4px;
1975 width: 136px;
1976 display: flex;
1977 align-items: center;
1978 justify-content: center;
1979 padding: 7px 5px;
1980 color: #3d50df;
1981 cursor: pointer;
1982 }
1983 .wtotem_body .line-chart {
1984 position: relative;
1985 }
1986 .wtotem_body .line-chart .axis line {
1987 stroke: #f0f0f0;
1988 }
1989 .wtotem_body .line-chart .axis path {
1990 stroke: #f0f0f0;
1991 }
1992 .wtotem_body .line-chart .axis text {
1993 fill: #5e6977;
1994 }
1995 .wtotem_body .line-chart .grid line {
1996 stroke: #f0f0f0;
1997 }
1998 .wtotem_body .line-chart .listening-rect {
1999 fill: #ffffff00;
2000 }
2001 .wtotem_body .line-chart__tooltip {
2002 opacity: 0;
2003 position: absolute;
2004 top: -25px;
2005 left: -17px;
2006 padding: 0.2em 0.5em;
2007 background: #1d293f;
2008 text-align: center;
2009 line-height: 1.4em;
2010 font-size: 0.9em;
2011 z-index: 10;
2012 transition: all 0.1s ease-out;
2013 pointer-events: none;
2014 color: #fff;
2015 font-family: Inter, Gilroy, Helvetica, sans-serif;
2016 border-radius: 2px;
2017 min-width: 28px;
2018 }
2019 .wtotem_body .line-chart__tooltip--reverse {
2020 top: 25px;
2021 }
2022 .wtotem_body .line-chart__tooltip:before {
2023 content: "";
2024 position: absolute;
2025 border-top: 7px solid #1d293f;
2026 top: 100%;
2027 left: 50%;
2028 transform: translateX(-50%);
2029 }
2030 .wtotem_body .line-chart__tooltip--reverse:before {
2031 border-color: transparent transparent #1d293f transparent;
2032 top: 0;
2033 transform: translateX(-50%) translateY(-100%);
2034 }
2035
2036 /**
2037 * Charts Small styles 768px
2038 */
2039 @media screen and (max-width: 768px) {
2040 .wtotem_body .chart-date text {
2041 -webkit-transform: rotate(-40deg) translate(-20px);
2042 -ms-transform: rotate(-40deg) translate(-20px);
2043 transform: rotate(-40deg) translate(-20px);
2044 }
2045 .wtotem_chart-first{
2046 flex-wrap: wrap;
2047 }
2048 }
2049
2050 /*
2051 * More button styles
2052 */
2053 .wtotem_more_btn_wrap {
2054 text-align: center;
2055 }
2056 .wtotem_more_btn {
2057 background: none;
2058 border: 1px solid #3d50df;
2059 border-radius: 4px;
2060 width: 136px;
2061 display: flex;
2062 align-items: center;
2063 justify-content: center;
2064 padding: 7px 5px;
2065 color: #3d50df;
2066 cursor: pointer;
2067 margin: 10px auto;
2068 }
2069 .wtotem_more_btn a {
2070 display: block;
2071 width: 100%;
2072 height: 100%;
2073 text-align: center;
2074 }
2075
2076 /*
2077 * Tables styles
2078 */
2079 .wtotem_data {
2080 padding: 0 26px;
2081 }
2082 .wtotem_data__thead {
2083 margin-bottom: 15px;
2084 }
2085 .wtotem_data__tr {
2086 display: flex;
2087 justify-content: space-between;
2088 }
2089 .wtotem_data__th {
2090 color: #5e6977;
2091 font-weight: 500;
2092 font-size: 12px;
2093 }
2094 .wtotem_data__th:last-child {
2095 text-align: right;
2096 }
2097 .wtotem_data__td {
2098 font-size: 12px;
2099 font-weight: 500;
2100 color: #86939e;
2101 margin-bottom: 20px;
2102 }
2103 .wtotem_data__td_blocked:before {
2104 content: "";
2105 width: 4px;
2106 height: 4px;
2107 border-radius: 100px;
2108 background: #bace3d;
2109 display: block;
2110 }
2111 .wtotem_data__td_banned:before {
2112 content: "";
2113 width: 4px;
2114 height: 4px;
2115 border-radius: 100px;
2116 background: #d56c6a;
2117 display: block;
2118 }
2119 .wtotem_data__td:first-child {
2120 display: flex;
2121 align-items: center;
2122 }
2123 .wtotem_data__td:nth-child(2) {
2124 display: flex;
2125 align-items: center;
2126 }
2127 .wtotem_data__td:last-child {
2128 text-align: right;
2129 }
2130 .wtotem_data__ip {
2131 /*margin-left: 10px;*/
2132 }
2133 .wtotem_data__img {
2134 width: 23px;
2135 height: 13px;
2136 margin-right: 6px;
2137 }
2138 .wtotem_data__flag {
2139 display: block;
2140 width: 100%;
2141 }
2142 .wtotem_data__td--orange {
2143 color: #d56c6a;
2144 }
2145 .wtotem_data__td--centered {
2146 display: flex;
2147 justify-content: center;
2148 }
2149 .wtotem_data__td--right {
2150 display: flex;
2151 justify-content: flex-end;
2152 }
2153 .wtotem_data_width_1 {
2154 width: 12%;
2155 }
2156 .wtotem_data_width_2 {
2157 width: 13%;
2158 }
2159 .wtotem_data_width_3 {
2160 width: 13%;
2161 }
2162 .wtotem_data_width_4 {
2163 width: 24%;
2164 }
2165 .wtotem_data_width_5 {
2166 width: 29%;
2167 }
2168 .wtotem_data_width_6 {
2169 width: 11%;
2170 }
2171 .wtotem_data_width_7 {
2172 width: 4%;
2173 }
2174
2175 /*
2176 * Tables Medium styles 768-992px
2177 */
2178 @media screen and (max-width: 992px) {
2179 .wtotem_data__td:nth-child(4),
2180 .wtotem_data__td:nth-child(5),
2181 .wtotem_data__td:nth-child(6),
2182 .wtotem_data__th:nth-child(4),
2183 .wtotem_data__th:nth-child(5),
2184 .wtotem_data__th:nth-child(6) {
2185 display: none;
2186 }
2187 .wtotem_data__th,
2188 .wtotem_data__td {
2189 width: 32%;
2190 }
2191 .wtotem_data__th:nth-child(3),
2192 .wtotem_data__td:nth-child(3) {
2193 width: 36%;
2194 }
2195 }
2196
2197 /*
2198 * Tables Small styles 320-576px
2199 */
2200 @media screen and (max-width: 576px) {
2201 .wtotem_data {
2202 padding: 0 16px;
2203 }
2204 .wtotem_data__td:nth-child(3),
2205 .wtotem_data__th:nth-child(3) {
2206 display: none;
2207 }
2208 .wtotem_chart-first {
2209 flex-direction: column;
2210 align-items: flex-start;
2211 }
2212 .wtotem_chart-first__left {
2213 margin-bottom: 20px;
2214 }
2215 .wtotem_chart-first__right {
2216 width: 100%;
2217 }
2218 }
2219
2220 /*
2221 * Tables Extra small styles 320-375px
2222 */
2223 @media screen and (max-width: 375px) {
2224 .wtotem_data__th,
2225 .wtotem_data__td {
2226 width: 33%;
2227 }
2228 .wtotem_data__ip {
2229 margin-left: 5px;
2230 }
2231 }
2232
2233 /*
2234 * Antivirus styles
2235 */
2236 .wtotem_antivirus {
2237 margin-bottom: 30px;
2238 }
2239 .wtotem_antivirus__block {
2240 display: flex;
2241 justify-content: space-between;
2242 align-items: center;
2243 width: 100%;
2244 background: #fff;
2245 border-radius: 4px;
2246 }
2247 .wtotem_antivirus__item {
2248 width: 25%;
2249 height: 100px;
2250 text-align: center;
2251 display: flex;
2252 align-items: center;
2253 justify-content: center;
2254 flex-direction: column;
2255 border-right: 1px solid #f3f5f6;
2256 }
2257 .wtotem_antivirus_stats .wtotem_antivirus__item {
2258 cursor: pointer;
2259 }
2260 .wtotem_antivirus__item:last-child {
2261 border-right: none;
2262 }
2263 .wtotem_antivirus__figures {
2264 font-size: 32px;
2265 font-weight: 700;
2266 margin-bottom: 18px;
2267 }
2268 .wtotem_antivirus__figures_green {
2269 color: #bace3d;
2270 }
2271 .wtotem_antivirus__figures_yellow {
2272 color: #e9cf73;
2273 }
2274 .wtotem_antivirus__figures_orange {
2275 color: #d56c6a;
2276 }
2277 .wtotem_antivirus__figures_black {
2278 color: #1d293f;
2279 }
2280 .wtotem_antivirus__title {
2281 color: #86939e;
2282 line-height: 18px;
2283 }
2284 .wtotem_antivirus__quarantine {
2285 margin-bottom: 15px;
2286 }
2287 .wtotem_antivirus__quarantine-header {
2288 display: flex;
2289 align-items: center;
2290 flex-wrap: wrap;
2291 padding: 5px 20px 10px;
2292 }
2293 .wtotem_antivirus__quarantine-title {
2294 font-size: 14px;
2295 }
2296 .wtotem_antivirus__quarantine-files-count {
2297 font-size: 12px;
2298 color: #ee3f3f;
2299 font-weight: 500;
2300 margin-left: 10px;
2301 }
2302 .wtotem_antivirus__quarantine-restore {
2303 margin-left: auto;
2304 }
2305 .wtotem_antivirus__quarantine-restore-button {
2306 cursor: pointer;
2307 display: inline-block;
2308 padding: 0 5px;
2309 height: 100%;
2310 background-color: transparent;
2311 border: none;
2312 }
2313 .wtotem_antivirus__quarantine-restore-text {
2314 position: relative;
2315 padding-left: 20px;
2316 font-size: 12px;
2317 font-weight: 500;
2318 color: #3d50df;
2319 }
2320 .wtotem_antivirus__quarantine-restore-text::before {
2321 content: "";
2322 display: block;
2323 position: absolute;
2324 height: 15px;
2325 width: 15px;
2326 top: 50%;
2327 left: 0;
2328 transform: translateY(-50%);
2329 background: url("../img/restore-file.svg") no-repeat center center/contain;
2330 }
2331 .wtotem_body .add-to-quarantine{
2332 cursor: pointer;
2333 }
2334 .wtotem_antivirus-logs__panel {
2335 display: flex;
2336 align-items: center;
2337 flex-wrap: wrap;
2338 /*margin-bottom: 15px;*/
2339 padding: 0 18px 10px;
2340 }
2341 .wtotem_antivirus-logs__filter {
2342 margin-bottom: 0;
2343 }
2344 .wtotem_antivirus-logs__permission {
2345 margin-left: 30px;
2346 }
2347 .wtotem_last_scan_av {
2348 width: 100%;
2349 text-align: right;
2350 border-top: 1px solid #f1f1f1;
2351 margin: 0;
2352 padding: 10px;
2353 color: #86939e;
2354 font-size: 14px;
2355 }
2356 .wtotem_antivirus-logs__buttons-wrapper {
2357 margin-left: auto;
2358 display: flex;
2359 }
2360 .wtotem_antivirus-logs__button {
2361 cursor: pointer;
2362 font-family: inherit;
2363 display: block;
2364 font-weight: 500;
2365 font-size: 14px;
2366 border: none;
2367 background-color: transparent;
2368 color: #3d50df;
2369 margin-right: 10px;
2370 min-height: 28px;
2371 }
2372 .wtotem_antivirus-logs__button--download {
2373 position: relative;
2374 padding-left: 33px;
2375 }
2376 .wtotem_antivirus-logs__button--download::before {
2377 content: "";
2378 position: absolute;
2379 height: 28px;
2380 width: 28px;
2381 top: 50%;
2382 left: 0;
2383 transform: translateY(-50%);
2384 border-radius: 50%;
2385 background: #3d50df url("../img/download-white.svg") no-repeat center center;
2386 }
2387 .wtotem_antivirus-logs__button--rescan {
2388 position: relative;
2389 padding-left: 33px;
2390 }
2391 .wtotem_antivirus-logs__button--rescan::before {
2392 content: "";
2393 position: absolute;
2394 height: 28px;
2395 width: 28px;
2396 top: 50%;
2397 left: 0;
2398 transform: translateY(-50%);
2399 border-radius: 50%;
2400 background: #3d50df url("../img/round-arrows.svg") no-repeat center center;
2401 }
2402 .wtotem_antivirus-logs__button--rescan.active::before {
2403 top: 0;
2404 transform: rotate(0deg);
2405 animation: 1s linear 0s normal none infinite running rot;
2406 -webkit-animation: 1s linear 0s normal none infinite running rot;
2407 }
2408 .wtotem_antivirus-logs__button:last-child {
2409 margin-right: 0;
2410 }
2411
2412 /*
2413 * Antivirus small styles 768px
2414 */
2415 @media screen and (max-width: 768px) {
2416 .wtotem_antivirus-logs__button {
2417 padding-left: 28px;
2418 }
2419 .wtotem_antivirus-logs__button-text {
2420 position: absolute;
2421 clip: rect(1px 1px 1px 1px);
2422 /* IE6, IE7 */
2423 clip: rect(1px, 1px, 1px, 1px);
2424 padding: 0;
2425 border: 0;
2426 height: 1px;
2427 width: 1px;
2428 overflow: hidden;
2429 }
2430 }
2431
2432 /*
2433 * Antivirus small styles 768px
2434 */
2435 @media screen and (max-width: 992px) {
2436 .wtotem_antivirus__quarantine .wtotem_file-table__td:first-child {
2437 width: auto;
2438 }
2439 .wtotem_antivirus__quarantine .wtotem_file-table__td:last-child {
2440 display: block;
2441 width: auto;
2442 }
2443 }
2444
2445 /*
2446 * Antivirus Extra small styles 320-576px
2447 */
2448 @media screen and (max-width: 576px) {
2449 .wtotem_antivirus__block {
2450 flex-wrap: wrap;
2451 }
2452 .wtotem_antivirus__item {
2453 width: 172px;
2454 border-bottom: 1px solid #f3f5f6;
2455 }
2456 .wtotem_antivirus__item:last-child {
2457 border-right: none;
2458 border-bottom: none;
2459 }
2460 .wtotem_antivirus__item:nth-child(2) {
2461 border-right: none;
2462 }
2463 .wtotem_antivirus__item:nth-child(3) {
2464 border-bottom: none;
2465 }
2466 .wtotem_antivirus-logs__permission {
2467 order: 3;
2468 margin-left: 0;
2469 margin-top: 10px;
2470 }
2471 }
2472
2473 /*
2474 * Antivirus Extra small styles 320-375px
2475 */
2476 @media screen and (max-width: 375px) {
2477 .wtotem_antivirus__item {
2478 width: 150px;
2479 }
2480 }
2481
2482 /*
2483 * Monitoring and scanning block styles
2484 */
2485 .wtotem_monitoring {
2486 margin-bottom: 30px;
2487 }
2488 .wtotem_table__row {
2489 display: flex;
2490 width: 100%;
2491 }
2492 .wtotem_table__col {
2493 width: 33.3333333333%;
2494 border-right: 1px solid #f3f5f6;
2495 border-bottom: 1px solid #f3f5f6;
2496 }
2497 .wtotem_table__col:last-child {
2498 border-right: none;
2499 }
2500 .wtotem_table__th,
2501 .wtotem_table__td,
2502 .wtotem_table__info {
2503 padding: 15px 15px;
2504 }
2505 .wtotem_table__th,
2506 .wtotem_table__td {
2507 border-bottom: 1px solid #f3f5f6;
2508 }
2509 .wtotem_table__td {
2510 display: flex;
2511 justify-content: space-between;
2512 align-items: center;
2513 height: 64px;
2514 }
2515 .wtotem_table__item {
2516 height: 110px;
2517 display: flex;
2518 align-items: center;
2519 justify-content: center;
2520 }
2521 .wtotem_table__expired {
2522 color: #d56c6a;
2523 }
2524 .wtotem_table__solve {
2525 color: #3d50df;
2526 }
2527 .wtotem_table__info {
2528 min-height: 55px;
2529 display: flex;
2530 justify-content: space-between;
2531 align-items: center;
2532 }
2533 .wtotem_table__subject {
2534 font-size: 14px;
2535 text-transform: uppercase;
2536 }
2537 .wtotem_table__status {
2538 text-transform: uppercase;
2539 }
2540 .wtotem_table__status_green {
2541 color: #4bc374;
2542 }
2543 .wtotem_table__status_yellow {
2544 color: #dcb320;
2545 text-transform: none;
2546 }
2547 .wtotem_table__text {
2548 color: #86939e;
2549 font-weight: 500;
2550 margin-left: 15px;
2551 word-break: break-all;
2552 }
2553 .wtotem_table__perfomance {
2554 font-weight: 500;
2555 color: #5e6977;
2556 }
2557 .wtotem_table__perfomance span {
2558 color: #3d50df;
2559 }
2560 .wtotem_table__wrap {
2561 width: 30px;
2562 height: 30px;
2563 }
2564 .wtotem_table__wrap_big {
2565 width: 56px;
2566 height: 56px;
2567 }
2568 .wtotem_table__img {
2569 width: 100%;
2570 display: block;
2571 }
2572 .wtotem_table__link {
2573 display: flex;
2574 justify-content: space-between;
2575 align-items: center;
2576 padding: 13px 16px;
2577 }
2578 .wtotem_table__link:after {
2579 content: "";
2580 border: solid #5e6977;
2581 border-width: 0 1px 1px 0;
2582 display: inline-block;
2583 padding: 4px;
2584 -webkit-transform: rotate(-45deg);
2585 transform: rotate(-45deg);
2586 }
2587 .wtotem_table__loader {
2588 min-height: 275px;
2589 display: flex;
2590 justify-content: center;
2591 align-items: center;
2592 }
2593 .wtotem_table__right_progress-wrap {
2594 width: 167px;
2595 margin-top: -21px;
2596 }
2597 .wtotem_table__stick-progress {
2598 position: relative;
2599 background: #3d50df;
2600 width: 96%;
2601 height: 7px;
2602 border-radius: 100px;
2603 }
2604 .wtotem_table__stick-progress:after {
2605 content: "";
2606 position: absolute;
2607 top: 0;
2608 left: 0;
2609 width: 167px;
2610 height: 7px;
2611 opacity: 0.1;
2612 border-radius: 100px;
2613 background: #5e6977;
2614 }
2615 .wtotem_table__initial-value {
2616 font-size: 10px;
2617 font-weight: 500;
2618 color: #5e6977;
2619 }
2620 .wtotem_table__message {
2621 position: absolute;
2622 top: -20px;
2623 right: -12px;
2624 z-index: 50;
2625 width: 30px;
2626 height: 15px;
2627 border-radius: 2px;
2628 background: #3d50df;
2629 font-size: 10px;
2630 font-weight: 500;
2631 text-align: center;
2632 color: #fff;
2633 display: flex;
2634 justify-content: center;
2635 align-items: center;
2636 }
2637 .wtotem_table__triangle {
2638 position: absolute;
2639 z-index: -1;
2640 top: 55%;
2641 left: 40%;
2642 width: 8px;
2643 height: 8px;
2644 display: block;
2645 border-radius: 1px;
2646 transform: rotate(45deg);
2647 background: #3d50df;
2648 margin: 0 auto;
2649 }
2650
2651 /*
2652 * Monitoring and scanning block Medium styles 768-992px
2653 */
2654 @media screen and (max-width: 992px) {
2655 .wtotem_table__row {
2656 flex-direction: column;
2657 }
2658 .wtotem_table__col {
2659 width: 100%;
2660 border-right: none;
2661 }
2662 }
2663
2664 /*
2665 * Monitoring and scanning block Extra small styles 320-375px
2666 */
2667 @media screen and (max-width: 375px) {
2668 .wtotem_table__perfomance_long {
2669 width: 210px;
2670 }
2671 .wtotem_chart-first {
2672 padding: 0 16px;
2673 }
2674 }
2675
2676 /*
2677 * Map block styles
2678 */
2679 .wtotem_map .wtotem_map-block {
2680 display: flex;
2681 align-items: center;
2682 justify-content: space-around;
2683 padding-right: 26px;
2684 }
2685 .wtotem_map .wtotem_map-block .firewall_bar {
2686 display: block;
2687 }
2688 .wtotem_map .wtotem_map-block__map {
2689 width: 50%;
2690 height: 330px;
2691 }
2692 .wtotem_map .firewall {
2693 width: 50%;
2694 position: relative;
2695 height: 230px;
2696 }
2697 .wtotem_map-wrap {
2698 padding-top: 15px;
2699 margin-bottom: 30px;
2700 }
2701 .wtotem_country {
2702 margin-bottom: -15px;
2703 }
2704 .wtotem_country__title {
2705 font-size: 14px;
2706 line-height: 18px;
2707 color: #86939e;
2708 margin-bottom: 9px;
2709 }
2710 .wtotem_country__desc {
2711 font-size: 18px;
2712 line-height: 18px;
2713 color: #1d293f;
2714 }
2715
2716 /*
2717 * Map block styles Medium 768-992px
2718 */
2719 @media screen and (max-width: 992px) {
2720 .wtotem_map .wtotem_map-wrap {
2721 padding-bottom: 20px;
2722 }
2723 .wtotem_map .wtotem_map-block {
2724 flex-direction: column;
2725 padding-right: 0;
2726 }
2727 .wtotem_map .wtotem_map-block__map {
2728 width: 100%;
2729 text-align: center;
2730 }
2731 .wtotem_map .wtotem_map-block__map svg {
2732 width: 403px;
2733 }
2734 .wtotem_map .firewall_bar {
2735 display: block;
2736 height: 135px;
2737 width: 270px;
2738 }
2739 .wtotem_map .firewall {
2740 position: relative;
2741 margin: auto;
2742 height: 70vh;
2743 width: 60vw;
2744 }
2745 }
2746
2747 /*
2748 * Map block styles Extra small 375-576px
2749 */
2750 @media screen and (max-width: 576px) {
2751 .wtotem_map .wtotem_map-block__map {
2752 height: auto;
2753 }
2754 .wtotem_map .firewall_map {
2755 width: 100%;
2756 zoom: 0.8;
2757 }
2758 .wtotem_map .wtotem_country {
2759 margin-bottom: 20px;
2760 }
2761 .wtotem_map .wtotem_chart__wrapper {
2762 width: 100%;
2763 }
2764 }
2765
2766 /*
2767 * Map block styles Extra small 500px
2768 */
2769 @media screen and (max-width: 500px) {
2770 .wtotem_map .firewall {
2771 width: 70vw;
2772 }
2773 }
2774
2775 /*
2776 * Map block styles Extra small 420px
2777 */
2778 @media screen and (max-width: 420px) {
2779 .wtotem_map .firewall {
2780 width: 75vw;
2781 }
2782 .wtotem_map__title {
2783 width: 120px;
2784 }
2785 }
2786
2787 /*
2788 * Map block styles Extra small 390px
2789 */
2790 @media screen and (max-width: 390px) {
2791 .wtotem_map .firewall {
2792 width: 80vw;
2793 }
2794 }
2795
2796 /*
2797 * Map block styles Extra small 375px
2798 */
2799 @media screen and (max-width: 375px) {
2800 .wtotem_map .firewall_map {
2801 width: 100%;
2802 zoom: 0.7;
2803 display: block;
2804 transform: translateX(25px);
2805 }
2806 }
2807
2808 /*
2809 * Map block styles Extra small 340px
2810 */
2811 @media screen and (max-width: 340px) {
2812 .wtotem_map .firewall_map {
2813 width: 100%;
2814 zoom: 0.7;
2815 display: block;
2816 transform: translateX(15px);
2817 }
2818 }
2819
2820 /*
2821 * Firewall training alert styles
2822 */
2823 .wtotem_firwall-training-alert {
2824 padding: 17px 22px;
2825 display: flex;
2826 justify-content: space-between;
2827 align-items: center;
2828 background: #fff;
2829 border-radius: 4px;
2830 margin-bottom: 30px;
2831 }
2832 .wtotem_firwall-training-alert__text-wrapper {
2833 display: flex;
2834 align-items: center;
2835 }
2836 .wtotem_firwall-training-alert__text-wrapper::before {
2837 content: '';
2838 display: block;
2839 align-self: center;
2840 height: 45px;
2841 width: 45px;
2842 margin-right: 9px;
2843 background: url("../img/firewall-icon.svg") no-repeat center center;
2844 flex-shrink: 0;
2845 }
2846 .wtotem_firwall-training-alert__text {
2847 font-weight: 500;
2848 font-size: 16px;
2849 line-height: 19px;
2850 }
2851 .wtotem_firwall-training-alert__learn-more {
2852 display: block;
2853 width: auto;
2854 padding: 14px 26px;
2855 position: relative;
2856 flex-shrink: 0;
2857 }
2858
2859 /*
2860 * Firewall training alert Small styles 768px
2861 */
2862 @media screen and (max-width: 768px) {
2863 .wtotem_firwall-training-alert {
2864 flex-direction: column;
2865 }
2866 .wtotem_firwall-training-alert__text-wrapper {
2867 margin-bottom: 10px;
2868 }
2869 }
2870
2871 /*
2872 * State styles
2873 */
2874 .wtotem_state {
2875 border-radius: 4px;
2876 background: #fff;
2877 padding: 13px 0 0 0;
2878 }
2879 .wtotem_state__select-wrapper {
2880 position: relative;
2881 width: 220px;
2882 cursor: pointer;
2883 }
2884 .wtotem_state__select-wrapper:after {
2885 content: "";
2886 position: absolute;
2887 top: 45%;
2888 right: 0;
2889 border-style: solid;
2890 border-width: 5px 5px 0 5px;
2891 border-color: #86939e transparent transparent transparent;
2892 border-radius: 50px;
2893 }
2894 .wtotem_state__select-wrapper .ajax-progress {
2895 position: absolute;
2896 top: 25%;
2897 left: -10px;
2898 }
2899 select.wtotem_state__select {
2900 display: block;
2901 margin-left: 18px;
2902 width: 100%;
2903 padding: 14px 12px;
2904 color: #86939e;
2905 font-size: 14px;
2906 font-weight: 400;
2907 -webkit-appearance: none;
2908 /*appearance: none;*/
2909 background-color: #f3f5f6;
2910 background-image: none;
2911 border-radius: 4px;
2912 border: none;
2913 font-family: inherit;
2914 cursor: pointer;
2915 line-height: normal;
2916 }
2917 .wtotem_body select.wtotem_state__select:hover {
2918 background-image: none;
2919 color: #86939e;
2920 }
2921 .wtotem_state__option {
2922 border: none;
2923 }
2924 .wtotem_state__line {
2925 background: #f3f5f6;
2926 height: 1px;
2927 margin-bottom: 20px;
2928 }
2929 .wtotem_state__last {
2930 display: flex;
2931 align-items: center;
2932 justify-content: space-between;
2933 padding: 0 18px;
2934 }
2935 .wtotem_state__text {
2936 color: #5e6977;
2937 font-weight: 500;
2938 }
2939 .wtotem_state__text a {
2940 color: #3d50df;
2941 }
2942
2943 /*
2944 * State Medium styles 992px
2945 */
2946 @media screen and (max-width: 992px) {
2947 .wtotem_state {
2948 overflow: hidden;
2949 }
2950 }
2951
2952 /*
2953 * State Extra small styles 375-576px
2954 */
2955 @media screen and (max-width: 576px) {
2956 .wtotem_state__text {
2957 display: none;
2958 }
2959 }
2960
2961 /*
2962 * File table styles
2963 */
2964 .wtotem_file-table {
2965 color: #86939e;
2966 padding-bottom: 10px;
2967 }
2968 .wtotem_file-table__tr {
2969 display: flex;
2970 border-top: 1px solid #f5f5f5;
2971 margin: 0;
2972 padding: 10px 15px;
2973 }
2974 .wtotem_file-table__th {
2975 color: #5e6977;
2976 width: 17.5%;
2977 font-weight: 500;
2978 font-size: 13px;
2979 }
2980 .wtotem_file-table__th:first-child {
2981 width: 50%;
2982 }
2983 .wtotem_file-table__td {
2984 font-size: 13px;
2985 width: 17.5%;
2986 font-weight: 500;
2987 }
2988 .wtotem_file-table__td:first-child {
2989 width: 50%;
2990 }
2991 .wtotem_file-table__td_normal {
2992 color: #5e6977;
2993 }
2994 .wtotem_file-table__td_critical {
2995 color: #d56c6a;
2996 }
2997 .wtotem_file-table__td_changed {
2998 color: #caae4b;
2999 }
3000 .wtotem_file_path {
3001 cursor: help;
3002 }
3003
3004 /*
3005 * File table Medium styles 768-992px
3006 */
3007 @media screen and (max-width: 992px) {
3008 .wtotem_file-table__td,
3009 .wtotem_file-table__th {
3010 display: none;
3011 }
3012 .wtotem_file-table__td:first-child,
3013 .wtotem_file-table__th:first-child {
3014 display: block;
3015 width: 100%;
3016 }
3017 }
3018
3019 /*
3020 * Login block styles
3021 */
3022 .wtotem_welcome-wrapper {
3023 background: #f3f5f6;
3024 }
3025 .wtotem_welcome-wrapper__head-height {
3026 display: flex;
3027 align-items: center;
3028 justify-content: center;
3029 height: calc(100vh - 135px);
3030 min-height: 596px;
3031 }
3032 .wtotem_welcome-wrapper__footer-height {
3033 display: flex;
3034 justify-content: center;
3035 height: 135px;
3036 }
3037 .wtotem_welcome-wrapper .wtotem_modal__btn {
3038 background: #4bc374;
3039 font-weight: 700;
3040 font-size: 14px;
3041 line-height: 16px;
3042 text-transform: uppercase;
3043 width: 300px;
3044 padding: 16px 0;
3045 border: none;
3046 color: #fff;
3047 border-radius: 0;
3048 text-shadow: none;
3049 }
3050 .wtotem_welcome-wrapper .wtotem_modal__btn:hover {
3051 background: #dbdbdb;
3052 color: #fff;
3053 }
3054 .wtotem_welcome-bottom {
3055 text-align: center;
3056 }
3057 .wtotem_welcome-bottom__logo {
3058 margin-bottom: 26px;
3059 }
3060 .wtotem_welcome-bottom__label {
3061 margin-bottom: 20px;
3062 }
3063 .wtotem_welcome-bottom__block {
3064 width: 54px;
3065 display: flex;
3066 justify-content: space-between;
3067 margin: 0 auto;
3068 }
3069 .wtotem_modal {
3070 text-align: center;
3071 }
3072 .wtotem_modal__subject {
3073 font-size: 24px;
3074 line-height: 18px;
3075 margin-bottom: 24px;
3076 }
3077 .wtotem_modal__window {
3078 background: #fff;
3079 padding: 23px 0 35px 0;
3080 width: 360px;
3081 margin: 0 auto 24px;
3082 }
3083 .wtotem_modal__title {
3084 font-size: 18px;
3085 margin-bottom: 5px;
3086 }
3087 .wtotem_modal__text {
3088 font-size: 10px;
3089 margin-bottom: 8px;
3090 }
3091 .wtotem_modal__block {
3092 margin-bottom: 50px;
3093 }
3094 .wtotem_modal__block:after {
3095 content: "";
3096 display: block;
3097 height: 1px;
3098 width: 100%;
3099 background: #e1e8ee;
3100 margin-top: -40px;
3101 }
3102 .wtotem_modal__logo {
3103 margin: 0 auto;
3104 }
3105 .wtotem_modal__wrap {
3106 width: 300px;
3107 display: flex;
3108 align-items: center;
3109 margin: 0 auto 18px;
3110 }
3111 .wtotem_modal__api-key {
3112 width: 100%;
3113 padding: 13px 30px 13px 15px;
3114 border: 2px solid #e1e8ee;
3115 border-radius: 2px;
3116 line-height: normal;
3117 }
3118 .wtotem_modal__api-key[type="text"]::-webkit-input-placeholder {
3119 font-weight: 500;
3120 font-size: 14px;
3121 line-height: 14px;
3122 color: #5e6977;
3123 }
3124 .wtotem_modal__api-key[type="text"]:-ms-input-placeholder {
3125 font-weight: 500;
3126 font-size: 14px;
3127 line-height: 14px;
3128 color: #5e6977;
3129 }
3130 .wtotem_modal__api-key[type="text"]::-ms-input-placeholder {
3131 font-weight: 500;
3132 font-size: 14px;
3133 line-height: 14px;
3134 color: #5e6977;
3135 }
3136 .wtotem_modal__api-key[type="text"]::placeholder {
3137 font-weight: 500;
3138 font-size: 14px;
3139 line-height: 14px;
3140 color: #5e6977;
3141 }
3142 .wtotem_modal__info {
3143 margin-left: -30px;
3144 }
3145 .wtotem_modal__desc {
3146 font-size: 12px;
3147 font-weight: 500;
3148 line-height: 16px;
3149 max-width: 274px;
3150 margin: 0 auto;
3151 color: #5e6977;
3152 }
3153 .wtotem_modal__cabinet {
3154 color: #3d50df;
3155 }
3156
3157 /*
3158 * Login block Extra small styles 320-375px
3159 */
3160 @media screen and (max-width: 375px) {
3161 .wtotem_modal__window {
3162 width: 345px;
3163 }
3164 }
3165
3166 /*
3167 * Login block Extra small styles 320-375px
3168 */
3169 @media screen and (max-width: 355px) {
3170 .wtotem_modal__window {
3171 width: 320px;
3172 }
3173 .wtotem_modal__wrap,
3174 .wtotem_modal__btn {
3175 width: 85%;
3176 }
3177 }
3178
3179 /*
3180 * Login block Extra small styles 330px
3181 */
3182 @media screen and (max-width: 330px) {
3183 .wtotem_modal__window {
3184 width: 305px;
3185 }
3186 }
3187
3188 /*
3189 * Settings blocks styles
3190 */
3191 .wtotem_item {
3192 margin-bottom: 23px;
3193 }
3194 .wtotem_holder {
3195 display: flex;
3196 justify-content: space-between;
3197 }
3198 .wtotem_holder__content {
3199 width: 70%;
3200 }
3201 .wtotem_holder__sidebar {
3202 width: 27.8431372549%;
3203 }
3204 .wtotem_option {
3205 margin-bottom: 12px;
3206 padding: 28px 24px 24px 24px;
3207 display: flex;
3208 align-items: center;
3209 justify-content: space-between;
3210 width: 100%;
3211 position: relative;
3212 }
3213 .wtotem_option:last-child {
3214 margin-bottom: 0;
3215 }
3216 .wtotem_option__title {
3217 margin-bottom: 7px;
3218 color: #1d293f;
3219 font-size: 14px;
3220 font-weight: 500;
3221 }
3222 .wtotem_option__text {
3223 width: 495px;
3224 font-size: 12px;
3225 color: #5e6977;
3226 line-height: 16px;
3227 }
3228 .wtotem_option__checkbox div {
3229 display: flex;
3230 }
3231 .wtotem_control {
3232 padding: 16px 22px 24px 22px;
3233 }
3234 .wtotem_control__title {
3235 color: #1d293f;
3236 font-size: 14px;
3237 font-weight: 500;
3238 margin-bottom: 18px;
3239 }
3240 .wtotem_control__block {
3241 padding: 12px 8px;
3242 display: flex;
3243 align-items: center;
3244 background: #f3f5f6;
3245 border-radius: 5px;
3246 margin-bottom: 12px;
3247 width: 100%;
3248 }
3249 .wtotem_control__block_switch {
3250 justify-content: space-between;
3251 align-items: center;
3252 }
3253 .wtotem_control__circle {
3254 margin-right: 4px;
3255 width: 20px;
3256 height: 20px;
3257 }
3258 .wtotem_control__circle img {
3259 width: 18px;
3260 height: 18px;
3261 }
3262 .wtotem_control__name {
3263 color: #5e6977;
3264 }
3265 .wtotem_control__trash {
3266 width: 15px;
3267 height: 15px;
3268 background: url("../img/trash.svg") no-repeat center center/cover;
3269 margin-left: auto;
3270 cursor: pointer;
3271 }
3272 .wtotem_body .wtotem_control__btn {
3273 color: #fff;
3274 width: 100%;
3275 height: 42px;
3276 display: flex;
3277 align-items: center;
3278 justify-content: center;
3279 background: #3d50df;
3280 border-radius: 5px;
3281 transition: all 0.2s ease-in-out;
3282 border: none;
3283 cursor: pointer;
3284 padding: 0 20px;
3285 }
3286 .wtotem_body .wtotem_control__btn:hover {
3287 transition: all 0.2s ease-in-out;
3288 background: #e5e5e5;
3289 color: #5e6977;
3290 }
3291 .wtotem_body .wtotem_btn_wc {
3292 width: fit-content;
3293 }
3294 .wtotem_control__label {
3295 position: relative;
3296 width: 41px;
3297 height: 23px;
3298 border-radius: 100px;
3299 background: #1f2323;
3300 padding: 4px 7px;
3301 display: flex;
3302 justify-content: space-between;
3303 align-items: center;
3304 cursor: pointer;
3305 margin: 0 25px;
3306 }
3307 .wtotem_control__label:before,
3308 .wtotem_control__label:after {
3309 content: "";
3310 display: block;
3311 position: relative;
3312 z-index: 2;
3313 }
3314 .wtotem_control__label:before {
3315 width: 8px;
3316 height: 8px;
3317 background: url("../img/checkbox-sun.svg") no-repeat center center/cover;
3318 }
3319 .wtotem_control__label:after {
3320 width: 6px;
3321 height: 6px;
3322 background: url("../img/checkbox-moon.svg") no-repeat center center/cover;
3323 }
3324 .wtotem_control__switched-circle {
3325 position: absolute;
3326 left: 4px;
3327 width: 15px;
3328 height: 15px;
3329 background: #fff;
3330 border-radius: 100px;
3331 display: block;
3332 z-index: 1;
3333 transition: all 0.3s ease-in-out;
3334 }
3335 .wtotem_control__input {
3336 display: none;
3337 }
3338 .wtotem_control__input:checked + label {
3339 background: #777;
3340 }
3341 .wtotem_control__input:checked + label span {
3342 left: 23px;
3343 background: #3d50df;
3344 }
3345 .wtotem_body .onoff__input {
3346 display: none;
3347 }
3348 .wtotem_body .onoff__label {
3349 position: relative;
3350 display: flex;
3351 align-items: center;
3352 width: 43px;
3353 height: 23px;
3354 border-radius: 100px;
3355 padding: 4px;
3356 background: #e2e2e2;
3357 overflow: hidden;
3358 cursor: pointer;
3359 }
3360 .wtotem_body .onoff__label:before,
3361 .wtotem_body .onoff__label:after {
3362 position: absolute;
3363 font-weight: 500;
3364 font-size: 9px;
3365 transition: all 0.3s ease-in-out;
3366 }
3367 .wtotem_body .onoff__label:before {
3368 content: "ON";
3369 color: #3d50df;
3370 left: -100%;
3371 }
3372 .wtotem_body .onoff__label:after {
3373 content: "OFF";
3374 color: #979797;
3375 right: 4px;
3376 }
3377 .wtotem_body .onoff__circle {
3378 position: absolute;
3379 left: 4px;
3380 width: 15px;
3381 height: 15px;
3382 border-radius: 100px;
3383 background: #c4c4c4;
3384 transition: all 0.3s ease-in-out;
3385 }
3386 .wtotem_body .onoff__input:checked + label .onoff__circle {
3387 background: #3d50df;
3388 left: 22px;
3389 }
3390 .wtotem_body .onoff__input:checked + label:before {
3391 left: 4px;
3392 }
3393 .wtotem_body .onoff__input:checked + label:after {
3394 right: -100%;
3395 }
3396
3397 input.wtotem_settings_input{
3398 width: 100%;
3399 border: 2px solid #e1e8ee;
3400 border-radius: 8px;
3401 margin-bottom: 15px;
3402 padding: 2px 14px;
3403 }
3404
3405 .wtotem_settings_section_inner{
3406 padding: 22px;
3407 }
3408
3409 .wtotem_settings_submit_wrap {
3410 text-align: right;
3411 }
3412 .wtotem_body .wtotem_settings_submit_wrap .wtotem_control__btn{
3413 display: inline-block;
3414 width: 250px;
3415 margin-top: 15px;
3416 }
3417
3418 /*
3419 * Settings blocks Large styles 992-1100px
3420 */
3421 @media screen and (max-width: 1100px) {
3422 .wtotem_option__text {
3423 width: 95%;
3424 }
3425 }
3426
3427 /*
3428 * Settings blocks Medium styles 576-992px
3429 */
3430 @media screen and (max-width: 992px) {
3431 .wtotem_holder {
3432 flex-direction: column;
3433 }
3434 .wtotem_holder__content {
3435 width: 100%;
3436 margin-bottom: 30px;
3437 }
3438 .wtotem_holder__sidebar {
3439 width: 100%;
3440 }
3441 }
3442
3443 /*
3444 * Settings blocks Small styles 576px
3445 */
3446 @media screen and (max-width: 576px) {
3447 .wtotem_holder__content {
3448 margin-bottom: 20px;
3449 }
3450 }
3451
3452 /*
3453 * Server Status block styles
3454 */
3455 .wtotem-ss-info {
3456 padding: 25px;
3457 }
3458 .wtotem-ss-info__stats-list {
3459 display: grid;
3460 grid-template-columns: 1fr 1fr 1fr;
3461 font-size: 14px;
3462 line-height: 17px;
3463 }
3464 .wtotem-ss-info__stats-list dt {
3465 font-weight: bold;
3466 }
3467 .wtotem-ss-info__stat-wrapper {
3468 display: flex;
3469 justify-content: space-between;
3470 flex-wrap: wrap;
3471 margin-bottom: 10px;
3472 margin-right: 10px;
3473 }
3474 .wtotem-ss-info__stat-wrapper:last-child {
3475 margin-bottom: 0;
3476 }
3477 .wtotem-ss-disc {
3478 margin-bottom: 0;
3479 height: 100%;
3480 display: flex;
3481 flex-direction: column;
3482 }
3483 .wtotem-ss-disc__header {
3484 margin-bottom: 15px;
3485 }
3486 .wtotem-ss-disc__line {
3487 margin-bottom: 10px;
3488 }
3489 .wtotem-ss-disc__content {
3490 display: flex;
3491 padding: 0 25px;
3492 flex-grow: 1;
3493 justify-content: center;
3494 align-items: center;
3495 }
3496 .wtotem-ss-disc__wrapper {
3497 display: flex;
3498 flex-direction: column;
3499 justify-content: center;
3500 align-items: center;
3501 margin-right: 15px;
3502 }
3503 .wtotem-ss-disc__totals {
3504 display: flex;
3505 font-weight: 500;
3506 font-size: 14px;
3507 line-height: 17px;
3508 }
3509 .wtotem-ss-disc__totals-caption {
3510 margin-right: 10px;
3511 }
3512 .wtotem-ss-disc__totals-value {
3513 font-weight: 600;
3514 }
3515 .wtotem-ss-disc__legend-item {
3516 padding-top: 15px;
3517 position: relative;
3518 margin-bottom: 20px;
3519 }
3520 .wtotem-ss-disc__legend-item:last-child {
3521 margin-bottom: 0;
3522 }
3523 .wtotem-ss-disc__legend-item::before {
3524 content: "";
3525 display: block;
3526 width: 20px;
3527 height: 4px;
3528 left: 0;
3529 top: 0;
3530 position: absolute;
3531 background: #3d50df;
3532 border-radius: 14px;
3533 }
3534 .wtotem-ss-disc__legend-item--free::before {
3535 background: #3d50df;
3536 }
3537 .wtotem-ss-disc__legend-item--use::before {
3538 background: #5e6977;
3539 }
3540 .wtotem-ss-disc__legend-value {
3541 font-weight: 600;
3542 font-size: 18px;
3543 line-height: 22px;
3544 margin-bottom: 10px;
3545 }
3546 .wtotem-ss-disc__legend-caption {
3547 font-weight: 500;
3548 font-size: 14px;
3549 line-height: 17px;
3550 }
3551
3552 /*
3553 * Server Status block Medium styles 992px
3554 */
3555 @media screen and (max-width: 992px) {
3556 .wtotem-ss-info__stat-wrapper {
3557 display: block;
3558 }
3559 }
3560
3561 /*
3562 * Server Status block Small styles 768px
3563 */
3564 @media screen and (max-width: 768px) {
3565 .wtotem-ss-info__stats-list {
3566 grid-template-columns: 1fr;
3567 }
3568 .wtotem-ss-info__stat-wrapper {
3569 display: flex;
3570 }
3571 .wtotem-ss-info__stat-wrapper:last-child {
3572 margin-bottom: 10px;
3573 }
3574 }
3575
3576 /*
3577 * Loader styles
3578 */
3579 .wtotem-loader {
3580 display: flex;
3581 flex-direction: column;
3582 align-items: center;
3583 justify-content: center;
3584 z-index: 1;
3585 }
3586 .wtotem-loader__wrapper {
3587 display: flex;
3588 justify-content: center;
3589 align-items: center;
3590 width: 54px;
3591 height: 54px;
3592 background: #e5ebf0;
3593 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.005);
3594 border-radius: 12px;
3595 margin-bottom: 20px;
3596 }
3597 .wtotem-loader__text {
3598 line-height: 24px;
3599 font-size: 14px;
3600 }
3601 .wtotem-loader__text--blue {
3602 color: #3d50df;
3603 }
3604 .wtotem-loader__dots {
3605 display: flex;
3606 justify-content: space-between;
3607 }
3608 .wtotem-loader__dots span {
3609 border-radius: 50%;
3610 opacity: 0.2;
3611 background: #3d50df;
3612 width: 6px;
3613 height: 6px;
3614 display: block;
3615 }
3616 .wtotem-loader__dots span:first-child {
3617 animation: fball 1350ms infinite linear;
3618 }
3619 .wtotem-loader__dots span:nth-child(2) {
3620 animation: sball 1350ms infinite linear;
3621 }
3622 .wtotem-loader__dots span:last-child {
3623 animation: tball 1350ms infinite linear;
3624 }
3625 @keyframes fball {
3626 0% {
3627 opacity: 0;
3628 transform: scale(0.5);
3629 }
3630 13% {
3631 opacity: 0.9;
3632 transform: scale(1.03);
3633 }
3634 26% {
3635 opacity: 1;
3636 transform: scale(0.95);
3637 }
3638 33% {
3639 transform: scale(1);
3640 }
3641 34% {
3642 opacity: 0.2;
3643 }
3644 }
3645 @keyframes sball {
3646 32% {
3647 opacity: 0.2;
3648 transform: scale(1);
3649 }
3650 33% {
3651 opacity: 0;
3652 transform: scale(0.5);
3653 }
3654 46% {
3655 opacity: 0.9;
3656 transform: scale(1.03);
3657 }
3658 59% {
3659 opacity: 1;
3660 transform: scale(0.95);
3661 }
3662 66% {
3663 transform: scale(1);
3664 }
3665 67% {
3666 opacity: 0.2;
3667 }
3668 }
3669 @keyframes tball {
3670 67% {
3671 opacity: 0.2;
3672 transform: scale(1);
3673 }
3674 68% {
3675 opacity: 0;
3676 transform: scale(0.5);
3677 }
3678 81% {
3679 opacity: 0.9;
3680 transform: scale(1.03);
3681 }
3682 94% {
3683 opacity: 1;
3684 transform: scale(0.95);
3685 }
3686 100% {
3687 transform: scale(1);
3688 }
3689 }
3690
3691 /*
3692 * Confirm popup styles
3693 */
3694 .wtotem_body .popup-content {
3695 z-index: 30!important;
3696 }
3697 .wtotem_body .confirmation-dialog {
3698 padding: 20px;
3699 display: flex;
3700 align-items: center;
3701 justify-content: center;
3702 flex-direction: column;
3703 }
3704 .wtotem_body .confirmation-dialog__title {
3705 font-weight: 700;
3706 font-size: 24px;
3707 line-height: 1.5;
3708 color: #1d293f;
3709 margin: 0;
3710 }
3711 .wtotem_body .confirmation-dialog__text {
3712 font-weight: 500;
3713 font-size: 14px;
3714 line-height: 1.5;
3715 text-align: center;
3716 color: #000;
3717 margin-bottom: 24px;
3718 max-width: 242px;
3719 white-space: pre-wrap;
3720 }
3721 .wtotem_body .confirmation-dialog__buttons-wrapper {
3722 display: flex;
3723 }
3724 .wtotem_body .wt-button {
3725 min-width: 28px;
3726 height: 36px;
3727 padding: 0 10px;
3728 color: #3d50df;
3729 font-size: 14px;
3730 border-radius: 5px;
3731 border: 2px solid #3d50df;
3732 text-transform: uppercase;
3733 cursor: pointer;
3734 display: flex;
3735 align-items: center;
3736 justify-content: center;
3737 background-color: #fff;
3738 text-decoration: none;
3739 }
3740 .wtotem_body .wt-button--padded {
3741 padding: 0 22px;
3742 }
3743 .wtotem_body .wt-button--size-300 {
3744 height: 32px;
3745 }
3746 .wtotem_body .wt-button--red {
3747 border: none;
3748 background-color: #ee3f3f;
3749 color: #fff;
3750 }
3751 .wtotem_body .confirmation-dialog__button {
3752 margin-right: 15px;
3753 }
3754 .wtotem_body .wt-button--success {
3755 border: none;
3756 background-color: #4bc374;
3757 color: #fff;
3758 }
3759
3760 /*
3761 * Firewall settings styles
3762 */
3763 .wtotem-waf-settings-popup {
3764 background: #ffffff;
3765 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
3766 border-radius: 10px;
3767 width: 280px;
3768 padding: 15px 24px;
3769 }
3770 .wtotem_body .wtotem-waf-settings-popup__title {
3771 font-weight: 500;
3772 font-size: 14px;
3773 line-height: 24px;
3774 margin-bottom: 20px;
3775 }
3776 .wtotem_body .wtotem-waf-settings-popup__label {
3777 display: block;
3778 font-weight: 500;
3779 font-size: 14px;
3780 line-height: 24px;
3781 margin-bottom: 10px;
3782 color: #555555;
3783 }
3784 .wtotem_body .wtotem_body .wtotem-waf-settings-popup__input {
3785 display: block;
3786 font-size: 12px;
3787 line-height: 22px;
3788 padding: 5px 10px;
3789 border: 2px solid #c9c9c9;
3790 box-sizing: border-box;
3791 border-radius: 8px;
3792 width: 100%;
3793 margin-bottom: 20px;
3794 }
3795 .wtotem_body .wtotem-waf-settings-popup__save {
3796 padding: 12px 48px;
3797 width: 100%;
3798 text-transform: none;
3799 font-weight: normal;
3800 font-size: 14px;
3801 line-height: 12px;
3802 }
3803 .wtotem_body .firewall-add-ip-popup__add {
3804 padding: 12px;
3805 width: 100%;
3806 }
3807 .wtotem_body .firewall-add-ip-popup__title {
3808 margin-bottom: 20px;
3809 }
3810 .wtotem_body .firewall-add-ip-popup__list-label {
3811 display: block;
3812 font-weight: 500;
3813 font-size: 14px;
3814 line-height: 14px;
3815 color: #86939e;
3816 margin-bottom: 15px;
3817 }
3818 .wtotem_body .firewall-add-ip-popup__input {
3819 display: block;
3820 box-sizing: border-box;
3821 font-weight: 500;
3822 font-size: 14px;
3823 line-height: 14px;
3824 padding: 10px 15px;
3825 width: 100%;
3826 font-family: inherit;
3827 color: inherit;
3828 border: 2px solid #e1e8ee;
3829 border-radius: 5px;
3830 margin-bottom: 20px;
3831 }
3832 .wtotem_body .firewall-configuration {
3833 padding-bottom: 20px;
3834 }
3835 .wtotem_body .firewall-configuration__header-wrapper {
3836 display: flex;
3837 justify-content: space-between;
3838 align-items: center;
3839 }
3840 .wtotem_body .firewall-configuration__list-types {
3841 display: flex;
3842 flex-wrap: wrap;
3843 padding: 0 18px;
3844 border-bottom: 1px solid #f3f5f6;
3845 margin-bottom: 15px;
3846 }
3847 .wtotem_body .firewall-configuration__list-type-label {
3848 cursor: pointer;
3849 display: block;
3850 font-weight: normal;
3851 font-size: 16px;
3852 line-height: 18px;
3853 padding: 20px 0;
3854 }
3855 .wtotem_body .firewall-configuration__list-types-item {
3856 margin-right: 18px;
3857 cursor: pointer;
3858 display: block;
3859 font-weight: normal;
3860 font-size: 16px;
3861 line-height: 18px;
3862 padding: 20px 0;
3863 }
3864 .wtotem_body .firewall-configuration__list-types-item:last-child {
3865 margin-right: 0;
3866 }
3867 .wtotem_body .firewall-configuration__list-types-item.active {
3868 color: #3d50df;
3869 font-weight: bold;
3870 border-bottom: 1px solid #3d50df;
3871 }
3872 .wtotem_body .firewall-configuration__list-type-input:checked + .firewall-configuration__list-type-label {
3873 color: #3d50df;
3874 font-weight: bold;
3875 }
3876
3877 .wtotem_body .firewall-configuration__ip-adress-wrapper {
3878 display: flex;
3879 flex-wrap: wrap;
3880 padding: 0 18px;
3881 margin-bottom: 20px;
3882 }
3883 .wtotem_body .firewall-configuration__ip-adress {
3884 display: block;
3885 font-size: 12px;
3886 line-height: 22px;
3887 padding: 5px 10px;
3888 border: 2px solid #86939e;
3889 box-sizing: border-box;
3890 border-radius: 8px;
3891 margin-right: 20px;
3892 width: 350px;
3893 box-shadow: none;
3894 }
3895 .wtotem_body .firewall-configuration__add {
3896 padding: 12px 21px;
3897 text-transform: none;
3898 }
3899 .wtotem_body .firewall-configuration__add {
3900 padding: 12px 21px;
3901 text-transform: none;
3902 }
3903 .wtotem_body .firewall-configuration__multi-adding {
3904 font-size: 16px;
3905 /*line-height: 18px;*/
3906 color: #3d50df;
3907 background-color: transparent;
3908 align-self: stretch;
3909 margin-left: 10px;
3910 border: none;
3911 cursor: pointer;
3912 padding: 5px;
3913 }
3914 .wtotem_body .firewall-ip-table {
3915 width: 100%;
3916 }
3917 .wtotem_body .firewall-ip-table__th {
3918 font-weight: 500;
3919 font-size: 14px;
3920 line-height: 21px;
3921 text-align: left;
3922 padding: 12px;
3923 background: #fff;
3924 border: solid #f3f5f6;
3925 border-width: 1px 0;
3926 }
3927 .wtotem_body .firewall-ip-table__th:last-child {
3928 text-align: right;
3929 }
3930 .wtotem_body .firewall-ip-table__td {
3931 font-size: 16px;
3932 line-height: 16px;
3933 color: #86939e;
3934 padding: 12px;
3935 border-bottom: 1px solid #f3f5f6;
3936 }
3937 .wtotem_body .firewall-ip-table__td:last-child {
3938 text-align: right;
3939 }
3940 .wtotem_body .firewall-ip-table__tr:last-child .firewall-ip-table__td {
3941 border-bottom: none;
3942 }
3943 .wtotem_body .firewall-ip-table__tr {
3944 border-bottom: 1px solid #f3f5f6;
3945 }
3946 .wtotem_body .firewall-ip-table__remove {
3947 cursor: pointer;
3948 font-weight: 500;
3949 font-size: 16px;
3950 line-height: 24px;
3951 color: #d56c6a;
3952 background-color: transparent;
3953 border: none;
3954 }
3955 .wtotem_body .firewall-configuration .wtotem-waf-settings-popup__configuration-link {
3956 display: none;
3957 }
3958 .wtotem_body .firewall-multi-adding__label-wrapper {
3959 display: flex;
3960 align-items: center;
3961 margin-bottom: 20px;
3962 }
3963 .wtotem_body .firewall-multi-adding__label {
3964 font-size: 18px;
3965 line-height: 18px;
3966 font-weight: bold;
3967 }
3968 .wtotem_body .firewall-multi-adding__form {
3969 padding: 30px;
3970 }
3971 .wtotem_body .firewall-multi-adding__input {
3972 width: 100%;
3973 padding: 12px;
3974 border: 2px solid #e1e8ee;
3975 border-radius: 10px;
3976 font-family: inherit;
3977 color: inherit;
3978 font-size: 16px;
3979 line-height: 18px;
3980 resize: vertical;
3981 margin-bottom: 15px;
3982 box-shadow: none;
3983 }
3984 .wtotem_body .firewall-multi-adding__save {
3985 padding: 12px;
3986 width: 100%;
3987 text-transform: none;
3988 font-weight: normal;
3989 }
3990 .wtotem-firewall-settings__no-data-icon {
3991 background: #e5ebf0;
3992 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
3993 border-radius: 12px;
3994 padding: 18px 20px;
3995 margin-bottom: 18px;
3996 }
3997 .wtotem-firewall-settings__no-data {
3998 display: flex;
3999 flex-direction: column;
4000 align-items: center;
4001 padding: 50px;
4002 color: #86939e;
4003 }
4004
4005 /*
4006 * Firewall settings Small styles 576px
4007 */
4008 @media screen and (max-width: 576px) {
4009 .wtotem_body .firewall-ip-table__td:nth-child(2),
4010 .wtotem_body .firewall-ip-table__th:nth-child(2) {
4011 display: none;
4012 }
4013 .wtotem_body .firewall-multi-adding__tooltip-content {
4014 min-width: 170px;
4015 }
4016 .wtotem_body .firewall-multi-adding__tooltip-header {
4017 display: none;
4018 }
4019 }
4020
4021 /*
4022 * Messages styles
4023 */
4024 .wtotem_input__error_text {
4025 margin: 0 0 15px;
4026 color: #ee3f3f;
4027 }
4028 .wtotem_input__success {
4029 margin: 0 0 15px;
4030 color: #68bd28;
4031 }
4032 .wtotem_input__messages {
4033 margin: 0 0 15px;
4034 }
4035
4036 .wtotem_body .message {
4037 margin: 20px 0;
4038 }
4039
4040 .wtotem_body .success_message {
4041 color: #4bc374;
4042 }
4043
4044 .wtotem_body .error_message {
4045 color: #ee3f3f;
4046 }
4047
4048 /*
4049 * Agents Install clock styles
4050 */
4051 .wtotem_unit {
4052 margin-bottom: 30px;
4053 }
4054 .wtotem_unit__first {
4055 display: flex;
4056 justify-content: space-between;
4057 }
4058
4059 .wtotem_unit__wrapper {
4060 display: flex;
4061 justify-content: space-between;
4062 background: #fff;
4063 }
4064 .wtotem_unit__block {
4065 display: flex;
4066 justify-content: space-between;
4067 align-items: center;
4068 width: 100%;
4069 padding: 30px 30px;
4070 border-right: 1px solid #f3f5f6;
4071 }
4072 .wtotem_unit__contain {
4073 display: flex;
4074 justify-content: space-between;
4075 align-items: center;
4076 }
4077 .wtotem_unit__circle {
4078 margin-right: 16px;
4079 width: 45px;
4080 height: 45px;
4081 border-radius: 100px;
4082 display: flex;
4083 align-items: center;
4084 justify-content: center;
4085 }
4086 .wtotem_unit__circle_success {
4087 background: #4bc374;
4088 }
4089 .wtotem_unit__circle_error {
4090 background: #ee3f3f;
4091 position: relative;
4092 }
4093 .wtotem_unit__circle_error:before {
4094 content: "";
4095 position: absolute;
4096 width: 19px;
4097 height: 3px;
4098 background: #fff;
4099 border-radius: 1px;
4100 display: block;
4101 transform: rotate(45deg);
4102 }
4103 .wtotem_unit__circle_error:after {
4104 content: "";
4105 position: absolute;
4106 width: 19px;
4107 height: 3px;
4108 background: #fff;
4109 border-radius: 1px;
4110 display: block;
4111 transform: rotate(-45deg);
4112 }
4113 .wtotem_unit__img_spinner {
4114 animation: 1s linear 0s normal none infinite running rot;
4115 -webkit-animation: 1s linear 0s normal none infinite running rot;
4116 }
4117 @keyframes rot {
4118 0% {
4119 transform: rotate(0deg);
4120 }
4121 100% {
4122 transform: rotate(360deg);
4123 }
4124 }
4125 @-webkit-keyframes rot {
4126 0% {
4127 transform: rotate(0deg);
4128 }
4129 100% {
4130 transform: rotate(360deg);
4131 }
4132 }
4133 .wtotem_unit__expectation {
4134 font-size: 16px;
4135 font-weight: 500;
4136 }
4137 .wtotem_unit__expectation_loading {
4138 color: #7c8087;
4139 }
4140 .wtotem_unit__expectation_success {
4141 color: #bace3d;
4142 }
4143 .wtotem_unit__expectation_error {
4144 color: #d56c6a;
4145 }
4146 .wtotem_unit__repeat {
4147 color: #3d50df;
4148 cursor: pointer;
4149 }
4150
4151 /*
4152 * Alert block styles
4153 */
4154 .wtotem_alert {
4155 padding: 17px 22px;
4156 display: flex;
4157 justify-content: space-between;
4158 align-items: center;
4159 background: #fff;
4160 border-radius: 4px;
4161 margin-bottom: 15px;
4162 margin-top: 20px;
4163 }
4164 .wtotem_alert__desc {
4165 display: flex;
4166 align-items: center;
4167 width: 100%;
4168 }
4169 .wtotem_alert__img {
4170 margin-right: 5px;
4171 display: flex;
4172 align-items: center;
4173 justify-content: center;
4174 }
4175 .wtotem_alert__img_cross {
4176 width: 16px;
4177 height: 16px;
4178 border-radius: 100px;
4179 display: flex;
4180 align-items: center;
4181 justify-content: center;
4182 background: #ee3f3f;
4183 }
4184 .wtotem_alert__img_cross:before {
4185 content: "";
4186 position: absolute;
4187 display: block;
4188 width: 8px;
4189 height: 1px;
4190 border-radius: 1px;
4191 transform: rotate(45deg);
4192 background: #fff;
4193 }
4194 .wtotem_alert__img_cross:after {
4195 content: "";
4196 position: absolute;
4197 display: block;
4198 width: 8px;
4199 height: 1px;
4200 border-radius: 1px;
4201 transform: rotate(-45deg);
4202 background: #fff;
4203 }
4204 .wtotem_alert__title {
4205 font-size: 12px;
4206 text-transform: uppercase;
4207 }
4208 .wtotem_alert__title_yellow {
4209 color: #f5c451;
4210 }
4211 .wtotem_alert__title_green {
4212 color: #4bc374;
4213 }
4214 .wtotem_alert__title_red {
4215 color: #ee3f3f;
4216 }
4217 .wtotem_alert__title_blue {
4218 color: #3070b3;
4219 }
4220 .wtotem_alert__text {
4221 color: #1d293f;
4222 font-size: 12px;
4223 word-wrap: break-word;
4224 display: block;
4225 width: calc(100% - 140px);
4226 margin-left: 20px;
4227 }
4228 .wtotem_alert__close {
4229 position: relative;
4230 width: 10px;
4231 height: 10px;
4232 display: flex;
4233 justify-self: center;
4234 align-items: center;
4235 cursor: pointer;
4236 }
4237 .wtotem_alert__close:before {
4238 content: "";
4239 position: absolute;
4240 display: block;
4241 width: 10px;
4242 height: 2px;
4243 border-radius: 1px;
4244 transform: rotate(45deg);
4245 background: #000;
4246 }
4247 .wtotem_alert__close:after {
4248 content: "";
4249 position: absolute;
4250 display: block;
4251 width: 10px;
4252 height: 2px;
4253 border-radius: 1px;
4254 transform: rotate(-45deg);
4255 background: #000;
4256 }
4257
4258 /*
4259 * Alert block Small styles 576-768px
4260 */
4261 @media screen and (max-width: 768px) {
4262 .wtotem_alert {
4263 margin-bottom: 20px;
4264 }
4265
4266 .wtotem_alert__desc {
4267 margin-right: -10px;
4268 }
4269 }
4270
4271 /*
4272 * Tlite styles
4273 */
4274 .wtotem_body .tlite {
4275 background: #111;
4276 color: #fff;
4277 font-family: sans-serif;
4278 font-size: 0.8rem;
4279 font-weight: normal;
4280 text-decoration: none;
4281 text-align: left;
4282 padding: 0.6em 0.75rem;
4283 border-radius: 4px;
4284 position: absolute;
4285 opacity: 0;
4286 visibility: hidden;
4287 transition: opacity 0.4s;
4288 max-width: 350px;
4289 box-shadow: 0 0.5rem 1rem -0.5rem #000;
4290 z-index: 1000;
4291 -webkit-backface-visibility: hidden;
4292 }
4293 .wtotem_body .tlite-table td,
4294 .wtotem_body .tlite-table th {
4295 position: relative;
4296 }
4297 .wtotem_body .tlite-visible {
4298 visibility: visible;
4299 opacity: 0.9;
4300 }
4301 .wtotem_body .tlite::before {
4302 content: " ";
4303 display: block;
4304 background: inherit;
4305 width: 10px;
4306 height: 10px;
4307 position: absolute;
4308 transform: rotate(45deg);
4309 }
4310 .wtotem_body .tlite-n::before {
4311 top: -3px;
4312 left: 50%;
4313 margin-left: -5px;
4314 }
4315 .wtotem_body .tlite-nw::before {
4316 top: -3px;
4317 left: 10px;
4318 }
4319 .wtotem_body .tlite-ne::before {
4320 top: -3px;
4321 right: 10px;
4322 }
4323 .wtotem_body .tlite-s::before {
4324 bottom: -3px;
4325 left: 50%;
4326 margin-left: -5px;
4327 }
4328 .wtotem_body .tlite-se::before {
4329 bottom: -3px;
4330 right: 10px;
4331 }
4332 .wtotem_body .tlite-sw::before {
4333 bottom: -3px;
4334 left: 10px;
4335 }
4336 .wtotem_body .tlite-w::before {
4337 left: -3px;
4338 top: 50%;
4339 margin-top: -5px;
4340 }
4341 .wtotem_body .tlite-e::before {
4342 right: -3px;
4343 top: 50%;
4344 margin-top: -5px;
4345 }
4346
4347 /*
4348 * Status styles
4349 */
4350 .wtotem_body .is--status--ok {
4351 color: #4bc374;
4352 fill: #4bc374;
4353 }
4354 .wtotem_body .is--status--error {
4355 color: #ee3f3f;
4356 fill: #ee3f3f;
4357 }
4358 .wtotem_body .is--status--pending {
4359 color: #3d50df;
4360 fill: #3d50df;
4361 }
4362 .wtotem_body .is--status--warning {
4363 color: #f5bf4f;
4364 fill: #f5bf4f;
4365 }
4366
4367 /*
4368 * Reports page styles
4369 */
4370 .wtotem_reports {
4371 display: grid;
4372 grid-template-rows: auto 1fr auto;
4373 min-height: calc(100vh - 315px);
4374 background: #f3f5f6;
4375 }
4376 .wtotem_reports__content {
4377 height: 100%;
4378 }
4379 .wtotem_reports__header {
4380 display: flex;
4381 align-items: center;
4382 margin-bottom: 15px;
4383 flex-wrap: wrap;
4384 }
4385 .wtotem_reports__title {
4386 margin-right: auto;
4387 }
4388 .wtotem_body .wtotem_reports__btn {
4389 margin-bottom: 15px;
4390 }
4391 .wtotem_reports__btn--load-more {
4392 text-transform: none;
4393 display: flex;
4394 justify-content: center;
4395 }
4396 .wtotem_reports-dates {
4397 background-color: #e1e8ee;
4398 cursor: pointer;
4399 display: flex;
4400 margin-right: 6px;
4401 padding: 10px 12px;
4402 border-radius: 5px;
4403 }
4404 .wtotem_reports-dates::before {
4405 content: '';
4406 display: block;
4407 align-self: center;
4408 height: 13px;
4409 width: 13px;
4410 margin-right: 9px;
4411 background: url("../img/calendar.svg") no-repeat center center;
4412 }
4413 .wtotem_reports-dates__input {
4414 cursor: pointer;
4415 color: #5e6977;
4416 display: block;
4417 position: relative;
4418 background-color: transparent;
4419 border: none;
4420 text-align: center;
4421 width: 0;
4422 flex-grow: 1;
4423 min-width: 90px;
4424 }
4425 .wtotem_reports-dates__divider {
4426 display: block;
4427 align-self: center;
4428 margin: 0 3px;
4429 }
4430 .wtotem_reports-no-data {
4431 display: flex;
4432 flex-direction: column;
4433 align-items: center;
4434 justify-content: center;
4435 height: 100%;
4436 }
4437 .wtotem_reports-no-data::before {
4438 content: '';
4439 display: block;
4440 height: 89px;
4441 width: 89px;
4442 margin-bottom: 10px;
4443 background: url("../img/empty-list.svg") no-repeat center center;
4444 }
4445 .wtotem_reports-no-data__text {
4446 font-weight: bold;
4447 font-size: 14px;
4448 line-height: 18px;
4449 margin-bottom: 23px;
4450 }
4451 .wtotem_reports-table {
4452 width: 100%;
4453 text-align: left;
4454 border-spacing: 0 8px;
4455 margin-bottom: 30px;
4456 border-collapse: separate;
4457 }
4458 .wtotem_reports-table__row {
4459 font-weight: 500;
4460 font-size: 14px;
4461 line-height: 21px;
4462 color: #5e6977;
4463 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
4464 background: #ffffff;
4465 }
4466 .wtotem_reports-table__row--header {
4467 color: #86939e;
4468 }
4469 .wtotem_reports-table__column {
4470 padding: 18px 18px 18px 0;
4471 background: #ffffff;
4472 color: #86939e;
4473 border: none;
4474 }
4475 .wtotem_reports-table__column:first-child {
4476 padding-left: 18px;
4477 }
4478 .wtotem_reports-table__column--success {
4479 color: #4bc374;
4480 }
4481 .wtotem_reports-table__column--warning {
4482 color: #f5c451;
4483 }
4484 .wtotem_reports-table__column--error {
4485 color: #f5c451;
4486 }
4487 .wtotem_reports-table__column--actions {
4488 padding-top: 0;
4489 padding-bottom: 0;
4490 text-align: right;
4491 }
4492 .wtotem_reports-table__buttons-wrapper {
4493 height: 100%;
4494 width: 100%;
4495 display: flex;
4496 justify-content: flex-end;
4497 align-content: center;
4498 }
4499 .wtotem_reports-table__button {
4500 cursor: pointer;
4501 display: block;
4502 height: 35px;
4503 width: 35px;
4504 border: none;
4505 background-color: transparent;
4506 }
4507 .wtotem_reports-table__button:last-child {
4508 margin-right: 0;
4509 }
4510 .wtotem_reports-table__button--print {
4511 background: url("../img/print.svg") no-repeat center center;
4512 }
4513 .wtotem_reports-table__button--download {
4514 background: url("../img/download.svg") no-repeat center center;
4515 }
4516 .wtotem_reports-list__load-more-wrapper {
4517 width: 100%;
4518 display: flex;
4519 justify-content: center;
4520 }
4521 .wtotem_reports__load-more-label {
4522 position: relative;
4523 padding-left: 25px;
4524 }
4525 .wtotem_reports__load-more-label::before {
4526 content: '';
4527 display: block;
4528 position: absolute;
4529 height: 20px;
4530 width: 20px;
4531 top: 50%;
4532 left: 0;
4533 transform: translateY(-50%);
4534 background: url("../img/load-more.svg") no-repeat center center;
4535 }
4536 .wtotem_reports-modal {
4537 position: fixed;
4538 left: 0;
4539 top: 0;
4540 display: grid;
4541 place-items: center;
4542 height: 100%;
4543 width: 100%;
4544 z-index: 99999;
4545 background-color: rgba(94, 105, 119, 0.67);
4546 color: #545c68;
4547 font-weight: 500;
4548 font-size: 16px;
4549 }
4550 .wtotem_reports-modal--hidden {
4551 display: none;
4552 }
4553 .wtotem_reports-modal__close {
4554 cursor: pointer;
4555 position: absolute;
4556 height: 30px;
4557 width: 30px;
4558 border: none;
4559 transform: translate(0, 0);
4560 top: 12px;
4561 right: 12px;
4562 background: url("../img/close-dark.svg") no-repeat center center;
4563 }
4564 .wtotem_body .wtotem_reports-modal--active {
4565 display: grid;
4566 }
4567 .wtotem_body .wtotem_reports-modal__content {
4568 position: relative;
4569 background: #ffffff;
4570 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
4571 border-radius: 12px;
4572 padding: 30px;
4573 min-width: 360px;
4574 max-height: 100%;
4575 overflow-y: auto;
4576 }
4577 .wtotem_reports-settings__field-title {
4578 font-size: 16px;
4579 line-height: 14px;
4580 margin-bottom: 20px;
4581 }
4582 .wtotem_body .wtotem_reports-settings__field-title--modules {
4583 margin-bottom: 10px;
4584 }
4585 .wtotem_body .wtotem_reports-settings__period-list {
4586 padding: 0;
4587 margin: 0 0 20px;
4588 list-style: none;
4589 display: flex;
4590 width: 300px;
4591 height: 38px;
4592 }
4593 .wtotem_body .wtotem_reports-settings__period-item {
4594 flex-grow: 1;
4595 border: 2px solid #e1e8ee;
4596 }
4597 .wtotem_body .wtotem_reports-settings__period-item:not(:last-child) {
4598 border-right: none;
4599 }
4600 .wtotem_body .wtotem_reports-settings__period-radio {
4601 display: none;
4602 }
4603 .wtotem_body .wtotem_reports-settings__period-label {
4604 cursor: pointer;
4605 position: relative;
4606 display: flex;
4607 justify-content: center;
4608 align-items: center;
4609 height: 100%;
4610 width: 100%;
4611 font-size: 12px;
4612 line-height: 14px;
4613 font-weight: normal;
4614 text-align: center;
4615 }
4616 .wtotem_body .wtotem_reports-settings__period-radio:checked + .wtotem_reports-settings__period-label {
4617 color: #3d50df;
4618 }
4619 .wtotem_body .wtotem_reports-settings__dates {
4620 display: flex;
4621 border-radius: 2px;
4622 border: 2px solid #e1e8ee;
4623 padding: 7px 15px;
4624 margin-bottom: 25px;
4625 }
4626 .wtotem_body .wtotem_reports-settings__dates::before {
4627 content: '';
4628 display: block;
4629 align-self: center;
4630 height: 13px;
4631 width: 15px;
4632 margin-right: 9px;
4633 background: url('../img/report.svg') no-repeat center center;
4634 }
4635 .wtotem_body .wtotem_reports-settings__date-input {
4636 cursor: pointer;
4637 display: block;
4638 border: none;
4639 width: 0;
4640 min-width: 92px;
4641 padding-left: 10px;
4642 margin-left: 7px;
4643 font-size: 12px;
4644 line-height: 14px;
4645 font-weight: normal;
4646 text-align: right;
4647 color: inherit;
4648 background-color: transparent;
4649 }
4650 .wtotem_body .wtotem_reports-settings__date-input:focus {
4651 border: 0;
4652 box-shadow: none;
4653 outline: none;
4654 }
4655 .wtotem_body .wtotem_reports-settings__date-input:last-child {
4656 flex-grow: 1;
4657 text-align: left;
4658 }
4659 .wtotem_body .wtotem_reports-settings__date-divider {
4660 display: block;
4661 align-self: center;
4662 margin: 0 3px;
4663 }
4664 .wtotem_body .wtotem_reports-settings__modules-list {
4665 padding: 0;
4666 margin: 0 0 20px;
4667 list-style: none;
4668 }
4669 .wtotem_reports-settings__module-item {
4670 position: relative;
4671 display: flex;
4672 align-items: center;
4673 justify-content: space-between;
4674 min-height: 48px;
4675 }
4676 .wtotem_reports-settings__module-item .form-item {
4677 margin: 0;
4678 }
4679 .wtotem_body .wtotem_reports-settings__module-item::after {
4680 content: '';
4681 position: absolute;
4682 height: 1px;
4683 left: -30px;
4684 right: -30px;
4685 bottom: 0;
4686 background-color: #ebf0f5;
4687 }
4688 .wtotem_body .wtotem_reports-settings__module-item:last-child::after {
4689 content: unset;
4690 }
4691 .wtotem_body .wtotem_reports-settings__module-title {
4692 font-size: 14px;
4693 line-height: 35px;
4694 }
4695 .wtotem_body .wtotem_reports-settings__module-label {
4696 cursor: pointer;
4697 display: block;
4698 position: relative;
4699 width: 45px;
4700 height: 35px;
4701 color: #fff;
4702 }
4703 .wtotem_body .wtotem_reports-settings__module-label::before {
4704 content: '';
4705 position: absolute;
4706 left: 50%;
4707 top: 50%;
4708 transform: translate(-50%, -50%);
4709 width: 100%;
4710 height: 10px;
4711 background: #e1e8ee;
4712 box-shadow: inset 0 1px 0 rgba(189, 198, 207, 0.529014);
4713 border-radius: 100px;
4714 }
4715 .wtotem_body .wtotem_reports-settings__module-label::after {
4716 content: '';
4717 position: absolute;
4718 left: 0;
4719 top: 50%;
4720 transform: translateY(-50%);
4721 width: 18px;
4722 height: 18px;
4723 margin-left: 5px;
4724 background: #5e6977;
4725 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.189736);
4726 border-radius: 100%;
4727 transition: 0.15s;
4728 }
4729 .wtotem_body .wtotem_reports-settings__module-checkbox {
4730 display: none;
4731 }
4732 .wtotem_body .wtotem_reports-settings__module-checkbox:checked + .wtotem_reports-settings__module-label::after {
4733 background: #3d50df;
4734 left: 100%;
4735 margin-left: -23px;
4736 }
4737 .wtotem_body .wtotem_reports-settings__btn {
4738 width: 100%;
4739 }
4740 .wtotem_reports-accordion {
4741 font-weight: 500;
4742 font-size: 14px;
4743 line-height: 21px;
4744 display: none;
4745 }
4746 .wtotem_reports-accordion__header {
4747 display: flex;
4748 align-items: center;
4749 justify-content: space-between;
4750 color: #86939e;
4751 }
4752 .wtotem_reports-accordion__header,
4753 .wtotem_reports-accordion__item {
4754 width: 100%;
4755 padding: 18px 14px;
4756 background: #ffffff;
4757 margin-bottom: 6px;
4758 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
4759 border-radius: 4px;
4760 }
4761 .wtotem_reports-accordion__header:last-child,
4762 .wtotem_reports-accordion__item:last-child {
4763 margin-bottom: 0;
4764 }
4765 .wtotem_reports-accordion__title {
4766 cursor: pointer;
4767 display: flex;
4768 justify-content: space-between;
4769 align-items: center;
4770 }
4771 .wtotem_reports-accordion__title::after {
4772 content: '';
4773 display: block;
4774 align-self: center;
4775 height: 20px;
4776 width: 20px;
4777 background: url("../img/arrow-down.svg") no-repeat center center;
4778 }
4779 .wtotem_reports-accordion__content-wrapper {
4780 margin-top: 10px;
4781 border-top: 1px solid #f3f5f6;
4782 }
4783 .wtotem_reports-accordion__line-wrapper {
4784 display: flex;
4785 justify-content: space-between;
4786 padding: 10px 0;
4787 }
4788 .wtotem_reports-accordion__line-title {
4789 color: #86939e;
4790 }
4791 .wtotem_reports-accordion__line-value--success {
4792 color: #4bc374;
4793 }
4794 .wtotem_reports-accordion__line-value--warning {
4795 color: #f5c451;
4796 }
4797 .wtotem_reports-accordion__line-value--error {
4798 color: #f5c451;
4799 }
4800 .wtotem_reports-accordion__button {
4801 display: block;
4802 width: 100%;
4803 margin-bottom: 12px;
4804 }
4805 .wtotem_reports-accordion__button:last-child {
4806 margin-bottom: 0;
4807 }
4808 .wtotem_body .reports_load_more_td {
4809 background: transparent;
4810 border-color: transparent;
4811 }
4812
4813 /*
4814 * Reports page Small styles 768px
4815 */
4816 @media screen and (max-width: 768px) {
4817 .wtotem_reports__header {
4818 margin-bottom: 10px;
4819 }
4820 .wtotem_reports__btn {
4821 width: 100%;
4822 margin-top: 15px;
4823 }
4824 .wtotem_reports-dates {
4825 margin-right: 0;
4826 }
4827 .wtotem_reports-table {
4828 display: none;
4829 }
4830 .wtotem_reports-accordion {
4831 display: block;
4832 }
4833 }
4834
4835 /*
4836 * Reports page Small styles 576px
4837 */
4838 @media screen and (max-width: 576px) {
4839 .wtotem_reports-dates::before {
4840 margin-right: 0;
4841 }
4842 .wtotem_reports-dates__divider {
4843 display: none;
4844 }
4845 .wtotem_reports-dates__input {
4846 display: none;
4847 }
4848 }
4849
4850 /*
4851 * Settings page styles
4852 */
4853 .wtotem_body .settings__header {
4854 padding: 20px 22px 15px;
4855 }
4856 .wtotem_firewall-section-menu-item {
4857 position: relative;
4858 margin: 15px 0;
4859 }
4860 .wtotem_switch-checkbox-with-text {
4861 position: absolute;
4862 right: 6px;
4863 top: 1px;
4864 }
4865 .wtotem_body .togglers-list {
4866 margin: 0;
4867 list-style: none;
4868 position: relative;
4869 }
4870 .wtotem_body .togglers-list__item {
4871 display: flex;
4872 justify-content: space-between;
4873 align-items: center;
4874 margin-right: 20px;
4875 }
4876 .wtotem_body .togglers-list__item.one-element{
4877 max-width: 340px;
4878 }
4879 .wtotem_body .togglers-list__item.one-element .togglers-list__name{
4880 font-size: 16px;
4881 display: inline-block;
4882 }
4883 .wtotem_body .togglers-list__item.one-element .wtotem_option__checkbox{
4884 margin-left: 20px;
4885 }
4886
4887 .wtotem_body .togglers-list__item--disabled {
4888 color: #c4c4c4;
4889 }
4890
4891 .wtotem_body .togglers-list__name {
4892 margin: 0 10px 0 0;
4893 }
4894 .wtotem_body .notifications-list {
4895 padding: 22px;
4896 display: grid;
4897 grid-template-columns: repeat(3, 1fr);
4898 grid-template-rows: 1fr 1fr;
4899 grid-auto-flow: column;
4900 grid-row-gap: 25px;
4901 /*row-gap: 25px;*/
4902 /*grid-column-gap: 10%;*/
4903 /*-webkit-column-gap: 10%;*/
4904 /*column-gap: 10%*/
4905 }
4906 .wtotem_body .module-list {
4907 padding: 22px;
4908 display: grid;
4909 grid-template-columns: repeat(3, 1fr);
4910 grid-template-rows: 1fr 1fr 1fr;
4911 grid-auto-flow: column;
4912 grid-row-gap: 25px;
4913 /*row-gap: 25px;*/
4914 /*grid-column-gap: 10%;*/
4915 /*-webkit-column-gap: 10%;*/
4916 /*column-gap: 10%*/
4917 }
4918 .wtotem_body .notifications-settings__text {
4919 font-weight: 500;
4920 font-size: 14px;
4921 line-height: 20px;
4922 color: #86939e;
4923 margin: 0 0 22px;
4924 }
4925 .wtotem_body .notifications-settings__header-wrapper {
4926 padding: 20px 22px 0;
4927 border-bottom: 1px solid #f3f5f6;
4928 }
4929
4930
4931 /*
4932 * Settings page styles 768px
4933 */
4934 @media screen and (max-width: 768px) {
4935 .wtotem_body .module-list, .wtotem_body .notifications-list {
4936 grid-template-columns: repeat(1, 1fr);
4937 grid-template-rows: 1fr;
4938 grid-auto-flow: row;
4939 }
4940 }
4941
4942
4943 /*
4944 * Modal window styles
4945 */
4946 .wtotem-modal {
4947 position: fixed;
4948 left: 0;
4949 top: 0;
4950 display: grid;
4951 place-items: center;
4952 height: 100%;
4953 width: 100%;
4954 z-index: 1000;
4955 background-color: rgba(94, 105, 119, 0.67);
4956 color: #545c68;
4957 font-weight: 500;
4958 font-size: 16px;
4959 line-height: 18px;
4960 }
4961 .wtotem-modal--hidden {
4962 display: none;
4963 }
4964 .wtotem-modal__content {
4965 box-sizing: border-box;
4966 position: relative;
4967 background: #ffffff;
4968 box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.0965523);
4969 border-radius: 12px;
4970 padding: 30px;
4971 min-width: 360px;
4972 margin-top: 40px;
4973 }
4974 .wtotem-modal__close {
4975 cursor: pointer;
4976 position: absolute;
4977 height: 30px;
4978 width: 30px;
4979 top: 0;
4980 right: 0;
4981 transform: translate(100%, -100%);
4982 border: none;
4983 background: transparent url("../img/close.svg") no-repeat center center;
4984 }
4985 .wtotem-modal__title {
4986 font-weight: bold;
4987 font-size: 18px;
4988 line-height: 20px;
4989 }
4990 .wtotem_body .side-modal__content {
4991 display: block;
4992 position: fixed;
4993 height: 100vh;
4994 overflow-y: auto;
4995 top: 30px;
4996 right: 0;
4997 z-index: 1000;
4998 background: #ffffff;
4999 transition: all 200ms;
5000 transform: translateX(100%);
5001 max-width: 500px;
5002 width: 100%;
5003 }
5004 .wtotem_body .side-modal__overlay {
5005 display: none;
5006 position: fixed;
5007 top: 0;
5008 left: 0;
5009 height: 100vh;
5010 width: 100%;
5011 z-index: 999;
5012 background-color: rgba(94, 105, 119, 0.67);
5013 }
5014 .wtotem_body .side-modal--opened .side-modal__content {
5015 transform: translateX(0);
5016 }
5017 .wtotem_body .side-modal--opened .side-modal__overlay {
5018 display: block;
5019 }
5020 .wtotem_body .side-modal__title {
5021 font-weight: bold;
5022 font-size: 18px;
5023 line-height: 21px;
5024 color: #3d50df;
5025 }
5026 .wtotem_body .side-modal__header-wrapper {
5027 position: relative;
5028 display: flex;
5029 justify-content: space-between;
5030 align-items: center;
5031 padding: 30px;
5032 border-bottom: 1px solid #e1e8ee;
5033 }
5034 .wtotem_body .side-modal__title.h2 {
5035 margin: 0;
5036 font-size: 18px;
5037 line-height: 21px;
5038 color: #3d50df;
5039 }
5040 .wtotem_body .side-modal__close {
5041 position: absolute;
5042 top: 50%;
5043 right: 10px;
5044 transform: translateY(-50%);
5045 padding: 15px;
5046 display: flex;
5047 justify-content: center;
5048 align-items: center;
5049 background-color: transparent;
5050 border: none;
5051 cursor: pointer;
5052 }
5053 .wtotem_body .side-modal__close svg {
5054 height: 24px;
5055 width: 24px;
5056 }
5057 .wtotem_body .side-modal__close path {
5058 fill: #5e6977;
5059 }
5060 .wtotem_body h2.side-modal__title {
5061 margin: 0;
5062 font-size: 18px;
5063 line-height: 21px;
5064 color: #3d50df;
5065 }
5066
5067 /*
5068 * Modal window Small styles 768px
5069 */
5070 @media screen and (max-width: 768px) {
5071 .wtotem-modal__close {
5072 transform: translate(0, 0);
5073 top: 12px;
5074 right: 12px;
5075 background: url("../img/close-dark.svg") no-repeat center center;
5076 }
5077 }
5078
5079 /*
5080 * Modal window Small styles 576px
5081 */
5082 @media screen and (max-width: 576px) {
5083 .wtotem-modal {
5084 font-size: 14px;
5085 line-height: 16px;
5086 }
5087 .wtotem-modal__content {
5088 padding: 20px;
5089 min-width: 320px;
5090 }
5091 .side-modal__content {
5092 width: 100%;
5093 }
5094 }
5095
5096 /*
5097 * Port scanner styles
5098 */
5099 .wtotem_body .wt-input input {
5100 border: none;
5101 background-color: transparent;
5102 flex-grow: 1;
5103 padding: 14px 42px 14px 16px;
5104 color: #5e6977;
5105 font-size: 16px;
5106 width: 100%;
5107 }
5108 .wtotem_body .popup-overlay {
5109 position: fixed;
5110 inset: 0;
5111 background: rgba(94, 105, 119, 0.6);
5112 display: flex;
5113 z-index: 999;
5114 padding: 0;
5115 }
5116 .wtotem_body .popup-overlay__close {
5117 width: 24px;
5118 height: 24px;
5119 display: flex;
5120 justify-content: center;
5121 align-items: center;
5122 border-radius: 50%;
5123 border: 1px solid #5e6977;
5124 transform: rotate(45deg);
5125 cursor: pointer;
5126 }
5127 .wtotem_body .popup-content {
5128 position: absolute;
5129 background: rgb(255, 255, 255);
5130 width: 700px;
5131 margin: 0 auto 30px;
5132 border: 1px solid rgb(187, 187, 187);
5133 padding: 0;
5134 right: 0;
5135 animation-name: slideLeft;
5136 animation-duration: 0.3s;
5137 animation-timing-function: ease;
5138 margin-top: 30px;
5139 }
5140 .wtotem_body .port-scanner-ports span+span {
5141 margin-left: 4px;
5142 }
5143 .wtotem_body .port-scanner-ports-wrap {
5144 display: flex;
5145 }
5146 .wtotem_body .port-scanner-port-wrapper {
5147 background-color: #e5ebf0;
5148 padding: 9px;
5149 border-radius: 4px;
5150 margin-right: 5px;
5151 display: none;
5152 }
5153 .wtotem_body .port-scanner-ports-wrap .port-scanner-port-wrapper {
5154 display: none;
5155 }
5156 .wtotem_body .port-scanner-list__form-ports .port-scanner-port-wrapper {
5157 display: flex;
5158 }
5159 .wtotem_body .port-scanner-port-wrapper:nth-child(-n+2) {
5160 display: flex;
5161 }
5162 .wtotem_body .port-scanner-icon {
5163 background-color: #5e6977;
5164 width: 16px;
5165 margin-left: 4px;
5166 height: 16px;
5167 border-radius: 100%;
5168 display: flex;
5169 align-items: center;
5170 justify-content: center;
5171 transform: rotate(45deg);
5172 cursor: pointer;
5173 }
5174 .wtotem_body .port-scanner-list {
5175 height: 100vh;
5176 }
5177 .wtotem_body .port-scanner-list__header {
5178 display: flex;
5179 justify-content: space-between;
5180 align-items: center;
5181 padding: 27px 22px;
5182 border-bottom: 1px solid #e1e8ee;
5183 }
5184 .wtotem_body .port-scanner-list__header--title {
5185 font-size: 18px;
5186 font-weight: 700;
5187 line-height: 19px;
5188 }
5189 .wtotem_body .port-scanner-list__form {
5190 padding: 24px 22px;
5191 display: flex;
5192 flex-direction: column;
5193 }
5194 .wtotem_body .port-scanner-list__form span {
5195 font-weight: 500;
5196 font-size: 14px;
5197 line-height: 14px;
5198 }
5199 .wtotem_body .port-scanner-list__form-ports {
5200 list-style: none;
5201 display: flex;
5202 flex-wrap: wrap;
5203 padding: 0;
5204 margin: 6px 0 14px;
5205 }
5206 .wtotem_body .port-scanner-list__form-ports .port-scanner-icon {
5207 transform: rotate(0deg);
5208 }
5209 .wtotem_body .port-scanner-list__form-ports .port-scanner-port-wrapper {
5210 background-color: #feeba6;
5211 }
5212 .wtotem_body .port-scanner-list__form-ports li {
5213 padding: 5px 10px;
5214 background-color: #feeba6;
5215 font-size: 14px;
5216 font-weight: 500;
5217 line-height: 24px;
5218 border-radius: 4px;
5219 display: flex;
5220 align-items: center;
5221 }
5222 .wtotem_body .port-scanner-list__form-ports li+li,
5223 .wtotem_body .port-scanner-list__form-ports li:first-child {
5224 margin-right: 5px;
5225 margin-top: 8px;
5226 }
5227 .wtotem_body .wt-input__icon {
5228 position: absolute;
5229 right: 15px;
5230 top: 50%;
5231 transform: translateY(-50%);
5232 display: flex;
5233 }
5234 .wtotem_body .port-scanner-list__form-input-icon {
5235 background-color: #dde2e5;
5236 border-radius: 100%;
5237 width: 16px;
5238 height: 16px;
5239 display: flex;
5240 justify-content: center;
5241 align-items: center;
5242 cursor: pointer;
5243 }
5244 .wtotem_body .port-scanner-list__table {
5245 padding: 0 22px;
5246 }
5247 .wtotem_body .port-scanner-list table {
5248 width: 100%;
5249 border-collapse: collapse;
5250 }
5251 .wtotem_body .port-scanner-list td {
5252 padding: 18px 0;
5253 border-bottom: 1px solid #f3f5f6;
5254 }
5255 .wtotem_body .port-scanner-list td span {
5256 background: #e5ebf0;
5257 border-radius: 4px;
5258 padding: 4px 10px;
5259 }
5260 .wtotem_body .port-scanner-list td div {
5261 color: #d46c6a;
5262 cursor: pointer;
5263 }
5264 .wtotem_body .port-scanner-list td:last-child {
5265 text-align: end;
5266 }
5267 .wtotem_body .wt-input__inner {
5268 position: relative;
5269 width: 100%;
5270 display: flex;
5271 height: 42px;
5272 border: 2px solid #f3f5f6;
5273 border-radius: 2px;
5274 background-color: #fff;
5275 margin-bottom: 15px;
5276 }
5277 .wtotem_body .wt-stats__value {
5278 line-height: 18px;
5279 display: flex;
5280 align-items: center;
5281 font-size: 14px;
5282 padding: 10px;
5283 color: #5e6977;
5284 white-space: nowrap;
5285 overflow: hidden;
5286 text-overflow: ellipsis;
5287 }
5288 .wtotem_body .port-scanner-list__form-input-icon input[type=image] {
5289 padding: 0;
5290 }
5291 .wtotem_body .popup-content {
5292 z-index: 30;
5293 }
5294 @-webkit-keyframes slideRight {
5295 0% {
5296 transform: translateX(-100%);
5297 }
5298 to {
5299 transform: translateX(0);
5300 }
5301 }
5302 @keyframes slideRight {
5303 0% {
5304 transform: translateX(-100%);
5305 }
5306 to {
5307 transform: translateX(0);
5308 }
5309 }
5310 @-webkit-keyframes slideLeft {
5311 0% {
5312 right: -100%;
5313 }
5314 to {
5315 right: 0;
5316 }
5317 }
5318 @keyframes slideLeft {
5319 0% {
5320 right: -100%;
5321 }
5322 to {
5323 right: 0;
5324 }
5325 }
5326
5327 /*
5328 * Port scanner Small styles 768px
5329 */
5330 @media screen and (max-width: 768px) {
5331 .wtotem_body .popup-content {
5332 width: 100%;
5333 }
5334 }
5335
5336 /*
5337 * Country blocking styles
5338 */
5339 .wtotem_body .block-country-section {
5340 padding: 19px 17px;
5341 display: flex;
5342 align-items: center;
5343 }
5344 .wtotem_body .block-country-section__content{
5345 width: 100%;
5346 }
5347 .wtotem_body .country-blocking-modal-attacks-container {
5348 display: flex;
5349 justify-content: space-between;
5350 padding: 16px 12px;
5351 border: 1px solid #f3f5f6;
5352 border-radius: 10px;
5353 }
5354 .wtotem_body .country-blocking-modal .side-modal__content{
5355 width: 100%!important;
5356 max-width: 650px!important;
5357 }
5358 .wtotem_body .country-blocking-modal-attack-block {
5359 display: flex;
5360 flex-direction: column;
5361 /*color: #5e6977;*/
5362 gap: 10px;
5363 margin-right: 10px;
5364 }
5365 .wtotem_body .country-blocking-modal-attack-block__percent {
5366 font-size: 20px;
5367 font-weight: 700;
5368 }
5369 .wtotem_body .country-blocking-modal-attack-block__country {
5370 font-weight: 500;
5371 font-size: 14px;
5372 }
5373 .wtotem_body .country-blocking-modal-attack-block__country span {
5374 color: #3d50df;
5375 }
5376 .wtotem_body .country-blocking-modal-header {
5377 padding: 30px;
5378 box-shadow: 0px 20px 20px -20px rgba(0, 0, 0, 0.15);
5379 display: flex;
5380 flex-direction: column;
5381 gap: 20px;
5382 }
5383 .wtotem_body .country-blocking-modal__search-input {
5384 padding: 3px 15px;
5385 border: 2px solid #f3f5f6;
5386 border-radius: 10px;
5387 width: 100%;
5388 font-weight: 500;
5389 font-size: 16px;
5390 }
5391 .wtotem_body .country-blocking-modal__search-input::placeholder {
5392 color: #86939e;
5393 font-weight: 500;
5394 font-size: 16px;
5395 }
5396 .wtotem_body .country-blocking-modal__content {
5397 height: calc(100% - 100px);
5398 }
5399 .wtotem_body .country-blocking-form {
5400 color: #9dafbd;
5401 font-size: 14px;
5402 min-height: calc(100% - 210px);
5403 display: flex;
5404 flex-direction: column;
5405 justify-content: space-between;
5406 }
5407 .wtotem_body .country-blocking-form__main {
5408 padding-bottom: 95px;
5409 }
5410 .wtotem_body .country-blocking-form__select-all {
5411 display: flex;
5412 align-items: center;
5413 gap: 16px;
5414 padding: 15px 30px 0;
5415 }
5416 .wtotem_body .country-blocking-form__checkbox:focus {
5417 border-width: 1px;
5418 }
5419 .wtotem_body .country-blocking-form__region-container {
5420 display: flex;
5421 justify-content: space-between;
5422 align-items: center;
5423 padding: 15px 30px;
5424 border-bottom: 1px solid #f3f5f6;
5425 background-color: transparent;
5426 border: none;
5427 cursor: pointer;
5428 width: 100%;
5429 color: inherit;
5430 }
5431 .wtotem_body .country-blocking-form__select-region {
5432 display: flex;
5433 align-items: center;
5434 justify-content: space-between;
5435 border-bottom: 1px solid #f3f5f6;
5436 padding: 15px 0;
5437 }
5438 .wtotem_body .country-blocking-form__region-name {
5439 color: #86939e;
5440 font-size: 18px;
5441 font-weight: 500;
5442 text-align: left;
5443 margin-bottom: 4px;
5444 }
5445 .wtotem_body .country-blocking-form__country-container {
5446 display: flex;
5447 align-items: center;
5448 justify-content: space-between;
5449 }
5450 .wtotem_body .country-blocking-form__region-countries {
5451 height: 0;
5452 overflow: hidden;
5453 }
5454 .wtotem_body .country-blocking-form__region-countries--open {
5455 padding: 13px 50px;
5456 height: auto;
5457 }
5458 .wtotem_body .country-blocking-form__country {
5459 padding: 15px 0;
5460 display: flex;
5461 align-items: center;
5462 gap: 12px;
5463 }
5464 .wtotem_body .country-blocking-form-save {
5465 padding: 20px 45px;
5466 display: flex;
5467 justify-content: space-between;
5468 align-items: center;
5469 background-color: #fff;
5470 box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
5471 position: sticky;
5472 left: 0;
5473 width: 100%;
5474 bottom: 30px;
5475 }
5476 .wtotem_body .country-blocking-form-save__btn {
5477 margin: 0!important;
5478 text-transform: uppercase;
5479 font-weight: bold;
5480 }
5481 .wtotem_body .chevron {
5482 rotate: 0deg;
5483 transition: all 0.1s ease-in;
5484 }
5485 .wtotem_body .chevron--open {
5486 rotate: -90deg;
5487 }
5488
5489 /*
5490 * WP scan page styles
5491 */
5492 .wtotem_scan__third {
5493 margin-top: 48px;
5494 }
5495 .wtotem_body .wtotem_scan__first{
5496 margin-bottom: 10px!important;
5497 }
5498 .wtotem_body .wtotem_scan_no_data{
5499 display: flex;
5500 justify-content: center;
5501 align-items: center;
5502 height: 200px;
5503 text-align: center;
5504 }
5505 ::-webkit-scrollbar {
5506 width: 4px;
5507 }
5508 ::-webkit-scrollbar-thumb {
5509 background-color: #d1d5db;
5510 border-radius: 22222px;
5511 }
5512 .wtotem_body .wtotem_scan__header{
5513 display: flex;
5514 justify-content: space-between;
5515 align-items: center;
5516 margin-bottom: 25px;
5517 }
5518 .wtotem_body .wtotem_scan__subheader{
5519 display: flex;
5520 justify-content: space-between;
5521 align-items: center;
5522 margin-bottom: 25px;
5523 }
5524 .wtotem_body .tab.confidential-files,
5525 .wtotem_body .tab.links,
5526 .wtotem_body .tab.scripts,
5527 .wtotem_body .tab.iframes {
5528 display: none;
5529 }
5530 .wtotem_body .tab.confidential-files.tab--active,
5531 .wtotem_body .tab.links.tab--active,
5532 .wtotem_body .tab.scripts.tab--active,
5533 .wtotem_body .tab.iframes.tab--active {
5534 display: block;
5535 }
5536 .wtotem_body .scan-tabs {
5537 display: flex;
5538 flex-wrap: wrap;
5539 gap: 40px;
5540 padding: 12px 0 0;
5541 border-bottom: 1px solid #f3f4f6;
5542 margin: 0 16px;
5543 }
5544 .wtotem_body .scan-tabs__item {
5545 padding-bottom: 16px;
5546 border-bottom: 2px solid transparent;
5547 transform: translateY(1.5px);
5548 }
5549 .wtotem_body .scan-tabs__item .num {
5550 padding: 2px 10px;
5551 border-radius: 10px;
5552 margin-left: 8px;
5553 background-color: #f3f4f6;
5554 color: #1d293f;
5555 }
5556 .wtotem_body .scan-tabs__item .num--empty {
5557 padding: 0;
5558 }
5559 .wtotem_body .scan-tabs__item--active {
5560 border-bottom-color: #3d50df;
5561 }
5562 .wtotem_body .scan-tabs__item--active .scan-tabs__btn {
5563 color: #3d50df;
5564 }
5565 .wtotem_body .scan-tabs__item--active .num {
5566 color: #3d50df;
5567 background-color: #e0e7ff;
5568 }
5569 .wtotem_body .scan-tabs__btn {
5570 font-weight: 500;
5571 cursor: pointer;
5572 color: #86939e;
5573 background-color: transparent;
5574 border: none;
5575 }
5576 .wtotem_body .audit-logs {
5577 display: flex;
5578 flex-direction: column;
5579 }
5580 .wtotem_body .audit-logs__controls {
5581 display: flex;
5582 padding: 12px 16px;
5583 border-bottom: 1px solid #f3f4f6;
5584 }
5585 .wtotem_body .audit-logs__time {
5586 background-color: transparent;
5587 border: none;
5588 color: #86939e;
5589 text-transform: uppercase;
5590 display: flex;
5591 gap: 35px;
5592 align-items: center;
5593 padding-right: 15px
5594 }
5595 .wtotem_body .audit-logs__time:hover {
5596 cursor: pointer;
5597 }
5598 .wtotem_body .audit-logs__time-icon--up,
5599 .wtotem_body .audit-logs__time-icon--down {
5600 width: 8px;
5601 fill: #86939e;
5602 }
5603 .wtotem_body .audit-logs__time[data-order="descending"] .audit-logs__time-icon--down {
5604 fill: #1d293f;
5605 }
5606 .wtotem_body .audit-logs__time[data-order="ascending"] .audit-logs__time-icon--up {
5607 fill: #1d293f;
5608 }
5609 .wtotem_body .audit-logs__icon-container {
5610 height: 24px;
5611 display: flex;
5612 gap: 4px;
5613 justify-content: center;
5614 flex-direction: column;
5615 }
5616 .wtotem_body .audit-logs__label {
5617 color: #86939e;
5618 text-transform: uppercase;
5619 }
5620 .wtotem_body .audit-logs__event-container {
5621 display: flex;
5622 align-items: center;
5623 gap: 24px;
5624 flex: 3;
5625 }
5626 .wtotem_body .audit-logs__event {
5627 padding: 5px 8px;
5628 border-radius: 6px;
5629 border: 1px solid #d1d5db;
5630 color: #86939e;
5631 }
5632 .wtotem_body .audit-logs__left {
5633 display: flex;
5634 flex-wrap: wrap;
5635 justify-content: space-between;
5636 align-items: center;
5637 flex: 2;
5638 }
5639 .wtotem_body .audit-logs__ip {
5640 text-align: right;
5641 flex: 1;
5642 }
5643 .wtotem_body .audit-logs__time,
5644 .wtotem_body .audit-logs__user {
5645 flex: 1;
5646 }
5647 .wtotem_body .audit-logs__user {
5648 padding-right: 20px;
5649 }
5650 .wtotem_body .audit-logs__content {
5651 display: flex;
5652 flex-direction: column;
5653 gap: 32px;
5654 /*max-height: 390px;*/
5655 overflow-y: scroll;
5656 padding: 12px 16px 20px;
5657 }
5658 .wtotem_body .audit-logs__short-info {
5659 display: flex;
5660 align-items: center;
5661 }
5662 .wtotem_body .audit-logs__date {
5663 color: #1d293f;
5664 font-size: 18px;
5665 margin-right: 12px;
5666 }
5667 .wtotem_body .audit-logs__divider {
5668 flex: 5;
5669 background-color: #d1d5db;
5670 height: 1px;
5671 float: left;
5672 align-items: center;
5673 }
5674 .wtotem_body .audit-logs__time-count {
5675 text-align: right;
5676 display: flex;
5677 align-items: center;
5678 justify-content: center;
5679 width: 35px;
5680 height: 35px;
5681 border: 1px solid #d1d5db;
5682 border-radius: 100%;
5683 }
5684 .wtotem_body .audit-logs__entries-container {
5685 display: flex;
5686 flex-direction: column;
5687 gap: 20px;
5688 }
5689 .wtotem_body .audit-logs-entry {
5690 display: flex;
5691 justify-content: space-between;
5692 }
5693 .wtotem_body .audit-logs-entry__left {
5694 display: flex;
5695 justify-content: space-between;
5696 align-items: center;
5697 flex: 2;
5698 }
5699 .wtotem_body .audit-logs-entry__ip {
5700 flex: 1;
5701 text-align: right;
5702 color: #86939e;
5703 font-size: 14px;
5704 }
5705 .wtotem_body .audit-logs-entry__time {
5706 color: #86939e;
5707 display: flex;
5708 align-items: center;
5709 gap: 4px;
5710 flex: 1;
5711 margin-right: -25px;
5712 }
5713 .wtotem_body .audit-logs-entry__description {
5714 flex: 3;
5715 color: #1d293f;
5716 max-width: 395px;
5717 word-break: break-all;
5718 }
5719 .wtotem_body .audit-logs-entry__status-container {
5720 flex: 1;
5721 margin-right: 25px;
5722 width: 131px;
5723 position: relative;
5724 align-items: center;
5725 display: flex;
5726 }
5727 .wtotem_body .audit-logs-entry__status{
5728 padding: 0 10px;
5729 border-radius: 10px;
5730 max-width: 130px;
5731 width: fit-content;
5732 text-overflow:ellipsis;
5733 white-space: nowrap;
5734 overflow: hidden;
5735 display: block;
5736 position: absolute;
5737 }
5738 .wtotem_body .audit-logs-entry__status:hover{
5739 text-overflow:clip;
5740 width:auto;
5741 white-space: normal;
5742 max-width: none;
5743 }
5744 .wtotem_body .audit-logs-entry__status--notice {
5745 color: #065f46;
5746 background-color: #d1fae5;
5747 }
5748 .wtotem_body .audit-logs-entry__status--warning {
5749 color: #92400e;
5750 background-color: #fef3c7;
5751 }
5752 .wtotem_body .audit-logs-entry__status--critical {
5753 color: #991b1b;
5754 background-color: #fee2e2;
5755 }
5756 .wtotem_body .audit-logs-entry[data-unseen="1"] .audit-logs-entry__new {
5757 display: block;
5758 width: 6px;
5759 height: 6px;
5760 background-color: #3d50df;
5761 border-radius: 100%;
5762 }
5763 .wtotem_body .tab.links.tab--active,
5764 .wtotem_body .tab.scripts.tab--active,
5765 .wtotem_body .tab.iframes.tab--active {
5766 display: flex;
5767 flex-direction: column;
5768 gap: 20px;
5769 /*height: 390px;*/
5770 /*margin-top: 12px;*/
5771 overflow-y: scroll;
5772 }
5773 .wtotem_body .tab.links.tab--active.tab--no-data,
5774 .wtotem_body .tab.scripts.tab--active.tab--no-data,
5775 .wtotem_body .tab.iframes.tab--active.tab--no-data {
5776 justify-content: center;
5777 align-items: center;
5778 color: #1d293f;
5779 }
5780 .wtotem_body .tab.links.tab--active .links__item,
5781 .wtotem_body .tab.links.tab--active .scripts__item,
5782 .wtotem_body .tab.links.tab--active .iframes__item,
5783 .wtotem_body .tab.scripts.tab--active .links__item,
5784 .wtotem_body .tab.scripts.tab--active .scripts__item,
5785 .wtotem_body .tab.scripts.tab--active .iframes__item,
5786 .wtotem_body .tab.iframes.tab--active .links__item,
5787 .wtotem_body .tab.iframes.tab--active .scripts__item,
5788 .wtotem_body .tab.iframes.tab--active .iframes__item {
5789 color: #3d50df;
5790 padding: 8px 16px;
5791 display: flex;
5792 align-items: center;
5793 gap: 13px;
5794 word-break: break-all;
5795 }
5796 .wtotem_body .link_source{
5797 font-size: 14px;
5798 width: 310px;
5799 padding: 8px 5px;
5800 display: flex;
5801 align-items: center;
5802 gap: 13px;
5803 word-break: break-all;
5804 }
5805 .wtotem_body .span__item{
5806 padding: 8px 16px;
5807 display: flex;
5808 align-items: center;
5809 gap: 13px;
5810 }
5811
5812 .wtotem_body .tab.links.tab--active .links__item .hover-icon,
5813 .wtotem_body .tab.links.tab--active .scripts__item .hover-icon,
5814 .wtotem_body .tab.links.tab--active .iframes__item .hover-icon,
5815 .wtotem_body .tab.scripts.tab--active .links__item .hover-icon,
5816 .wtotem_body .tab.scripts.tab--active .scripts__item .hover-icon,
5817 .wtotem_body .tab.scripts.tab--active .iframes__item .hover-icon,
5818 .wtotem_body .tab.iframes.tab--active .links__item .hover-icon,
5819 .wtotem_body .tab.iframes.tab--active .scripts__item .hover-icon,
5820 .wtotem_body .tab.iframes.tab--active .iframes__item .hover-icon {
5821 display: none;
5822 }
5823 .wtotem_body .tab.links.tab--active .links__item:hover,
5824 .wtotem_body .tab.links.tab--active .scripts__item:hover,
5825 .wtotem_body .tab.links.tab--active .iframes__item:hover,
5826 .wtotem_body .tab.scripts.tab--active .links__item:hover,
5827 .wtotem_body .tab.scripts.tab--active .scripts__item:hover,
5828 .wtotem_body .tab.scripts.tab--active .iframes__item:hover,
5829 .wtotem_body .tab.iframes.tab--active .links__item:hover,
5830 .wtotem_body .tab.iframes.tab--active .scripts__item:hover,
5831 .wtotem_body .tab.iframes.tab--active .iframes__item:hover {
5832 background-color: rgba(61, 80, 223, 0.04);
5833 }
5834 .wtotem_body .tab.links.tab--active .links__item:hover .hover-icon,
5835 .wtotem_body .tab.links.tab--active .scripts__item:hover .hover-icon,
5836 .wtotem_body .tab.links.tab--active .iframes__item:hover .hover-icon,
5837 .wtotem_body .tab.scripts.tab--active .links__item:hover .hover-icon,
5838 .wtotem_body .tab.scripts.tab--active .scripts__item:hover .hover-icon,
5839 .wtotem_body .tab.scripts.tab--active .iframes__item:hover .hover-icon,
5840 .wtotem_body .tab.iframes.tab--active .links__item:hover .hover-icon,
5841 .wtotem_body .tab.iframes.tab--active .scripts__item:hover .hover-icon,
5842 .wtotem_body .tab.iframes.tab--active .iframes__item:hover .hover-icon {
5843 display: block;
5844 }
5845 .wtotem_body .files__controls {
5846 display: flex;
5847 gap: 36px;
5848 border-bottom: 1px solid #f3f5f6;
5849 padding: 12px 16px;
5850 }
5851 .wtotem_body .files__controls[data-order-type="modified_at"] .files__btn--modified_at[data-order="descending"] .files__last-modify-icon--down {
5852 fill: #1d293f;
5853 }
5854 .wtotem_body .files__controls[data-order-type="modified_at"] .files__btn--modified_at[data-order="ascending"] .files__last-modify-icon--up {
5855 fill: #1d293f;
5856 }
5857 .wtotem_body .files__controls[data-order-type="size"] .files__btn--size[data-order="descending"] .files__size-icon--down {
5858 fill: #1d293f;
5859 }
5860 .wtotem_body .files__controls[data-order-type="size"] .files__btn--size[data-order="ascending"] .files__size-icon--up {
5861 fill: #1d293f;
5862 }
5863 .wtotem_body .files__btn--type[data-order="descending"] .files__size-icon--down {
5864 fill: #1d293f;
5865 }
5866 .wtotem_body .files__btn--type[data-order="ascending"] .files__size-icon--up {
5867 fill: #1d293f;
5868 }
5869 .wtotem_body .files__btn {
5870 background-color: transparent;
5871 border: none;
5872 display: flex;
5873 justify-content: space-between;
5874 align-items: center;
5875 color: #86939e;
5876 text-transform: uppercase;
5877 }
5878 .wtotem_body .files__btn:hover {
5879 cursor: pointer;
5880 }
5881 .wtotem_body .files__btn--size {
5882 flex: 1;
5883 }
5884 .wtotem_body .files__btn--modified_at {
5885 flex: 2;
5886 }
5887 .wtotem_body .files__btn--file-name {
5888 flex: 3;
5889 }
5890 .wtotem_body .files__icon-container {
5891 height: 24px;
5892 display: flex;
5893 gap: 4px;
5894 justify-content: center;
5895 flex-direction: column;
5896 }
5897 .wtotem_body .files__icon {
5898 width: 8px;
5899 fill: #86939e;
5900 }
5901 .wtotem_body .files__file-name-title {
5902 color: #86939e;
5903 text-transform: uppercase;
5904 flex: 3;
5905 }
5906 .wtotem_body .files__path {
5907 color: #86939e;
5908 text-transform: uppercase;
5909 flex: 4;
5910 }
5911 .wtotem_body .files__empty {
5912 flex: 1;
5913 }
5914 .wtotem_body .files__link {
5915 color: #86939e;
5916 text-transform: uppercase;
5917 flex: 6;
5918 }
5919 .wtotem_body .files__btn--type{
5920 flex: 1;
5921 }
5922 .wtotem_body .links__item{
5923 flex: 6;
5924 }
5925 .wtotem_body .links__type{
5926 flex: 1;
5927 text-align: right;
5928 padding: 8px 12px;
5929 }
5930
5931 .wtotem_body .files__icon-container {
5932 display: flex;
5933 flex-direction: column;
5934 }
5935 .wtotem_body .files__container {
5936 display: flex;
5937 flex-direction: column;
5938 gap: 16px;
5939 max-height: 390px;
5940 overflow-y: scroll;
5941 }
5942 .wtotem_body .files__item {
5943 display: flex;
5944 gap: 36px;
5945 align-items: center;
5946 justify-content: space-between;
5947 padding: 8px 12px 16px;
5948 font-size: 14px;
5949 position: relative;
5950 }
5951 .wtotem_body .links .files__item,
5952 .wtotem_body .scripts .files__item,
5953 .wtotem_body .iframes .files__item{
5954 padding: 0;
5955 }
5956 .wtotem_body .files__item:hover {
5957 background-color: rgba(61, 80, 223, 0.04);
5958 }
5959 .wtotem_body .files__size {
5960 flex: 1;
5961 color: #86939e;
5962 text-transform: uppercase;
5963 }
5964 .wtotem_body .files__last-modify {
5965 flex: 2;
5966 color: #1d293f;
5967 }
5968 .wtotem_body .files__file-name {
5969 flex: 3;
5970 color: #3d50df;
5971 }
5972 .wtotem_body .files__file-name:focus-visible {
5973 text-decoration: underline;
5974 }
5975 .wtotem_body .files__file-path {
5976 flex: 4;
5977 word-break: break-all;
5978 color: #1d293f;
5979 line-height: 20px;
5980 }
5981 .wtotem_body .files__btn-dots {
5982 display: flex;
5983 justify-content: end;
5984 background-color: transparent;
5985 border: 1px solid transparent;
5986 flex: 1;
5987 margin-top: 5px;
5988 padding-right: 10px;
5989 position: relative;
5990 }
5991 .wtotem_body .files__btn-dots:hover {
5992 cursor: pointer;
5993 }
5994 .wtotem_body .options {
5995 flex-direction: column;
5996 border-radius: 4px;
5997 background-color: #fff;
5998 box-shadow: 0px 4px 16px rgba(83, 93, 184, 0.12);
5999 position: absolute;
6000 display: none;
6001 top: 20px;
6002 right: 30px;
6003 z-index: 200;;
6004 width: 210px;
6005 }
6006 .wtotem_body .options.options--open {
6007 display: flex;
6008 }
6009 .wtotem_body .options__item {
6010 background-color: transparent;
6011 border: none;
6012 cursor: pointer;
6013 color: #1d293f;
6014 font-size: 14px;
6015 padding: 11px 45px 11px 14px;
6016 text-align: left;
6017 display: flex;
6018 gap: 10px;
6019 align-items: flex-end;
6020 }
6021 .wtotem_body .options__item:disabled {
6022 color: #86939e;
6023 cursor: default;
6024 }
6025 .wtotem_body .options__item:not(:last-child) {
6026 border-bottom: 1px solid #f3f5f6;
6027 }
6028 .wtotem_body .popup {
6029 position: fixed;
6030 z-index: 10;
6031 top: 0;
6032 left: 0;
6033 height: 100%;
6034 width: 100%;
6035 background: rgba(3, 4, 28, 0.3);
6036 justify-content: center;
6037 align-items: center;
6038 font-family: "Inter", sans-serif;
6039 display: none;
6040 }
6041 .wtotem_body .popup--active {
6042 display: flex;
6043 }
6044 .wtotem_body .popup__container {
6045 background-color: #fff;
6046 border-radius: 8px;
6047 padding: 24px;
6048 display: flex;
6049 flex-direction: column;
6050 width: 512px;
6051 box-shadow: 0px 20px 25px -5px rgba(0, 0, 0, 0.1), 0px 10px 10px -5px rgba(0, 0, 0, 0.04);
6052 }
6053 .wtotem_body .popup__content {
6054 display: flex;
6055 gap: 16px;
6056 }
6057 .wtotem_body .popup__text {
6058 display: flex;
6059 flex-direction: column;
6060 gap: 8px;
6061 }
6062 .wtotem_body .popup__title {
6063 color: #1d293f;
6064 font-size: 18px;
6065 }
6066 .wtotem_body .popup__file-name {
6067 color: #86939e;
6068 font-size: 14px;
6069 word-break: break-all;
6070 line-height: 20px;
6071 }
6072 .wtotem_body .popup__btns {
6073 margin-left: auto;
6074 display: flex;
6075 gap: 12px;
6076 }
6077 .wtotem_body .popup__btn {
6078 padding: 9px 17px;
6079 border-radius: 6px;
6080 font-size: 14px;
6081 border: 1px solid transparent;
6082 font-family: "Inter", sans-serif;
6083 }
6084 .wtotem_body .popup__btn:hover {
6085 cursor: pointer;
6086 }
6087 .wtotem_body .popup__cancel {
6088 border-color: #86939e;
6089 color: #1d293f;
6090 background-color: #fff;
6091 }
6092 .wtotem_body .popup__delete {
6093 background-color: #dc2626;
6094 border-color: #dc2626;
6095 color: #fff;
6096 }
6097
6098 /**
6099 * WP scan page small styles max-width 768px
6100 */
6101 /**
6102 * WP scan page small styles max-width 1024px
6103 */
6104 @media screen and (max-width: 1024px) {
6105 .wtotem_body .audit-logs-entry__status {
6106 max-width: 100px;
6107 }
6108 }
6109
6110 @media screen and (max-width: 768px) {
6111 .wtotem_body .link_source {
6112 display: none;
6113 }
6114 .wtotem_body .files__size {
6115 display: none;
6116 }
6117 .wtotem_body .files__last-modify {
6118 display: none;
6119 }
6120 .wtotem_body .files__controls {
6121 display: none;
6122 }
6123
6124 .wtotem_body .audit-logs__time,
6125 .wtotem_body .audit-logs__user,
6126 .wtotem_body .audit-logs-entry__time,
6127 .wtotem_body .audit-logs-entry__status-container{
6128 display: none;
6129 }
6130
6131 }
6132
6133 /*
6134 * Pagination styles
6135 */
6136 .wtotem_pagination {
6137 display: flex;
6138 align-items: center;
6139 justify-content: center;
6140 padding: 12px 16px 45px;
6141 }
6142 .wtotem_pagination__number {
6143 color: #99a6b1;
6144 font-weight: 500;
6145 margin: 15px;
6146 display: flex;
6147 align-items: center;
6148 }
6149 .wtotem_pagination__number:hover {
6150 color: #5e6977;
6151 }
6152 .wtotem_pagination__number_active {
6153 width: 46px;
6154 height: 46px;
6155 background: #f1f3f5;
6156 color: #5e6977;
6157 margin: 0px;
6158 border-radius: 100px;
6159 display: flex;
6160 justify-content: center;
6161 align-items: center;
6162 }
6163 .wtotem_pagination__number_etc {
6164 margin-right: 22px;
6165 }
6166 .wtotem_pagination__arrow {
6167 width: 19px;
6168 height: 12px;
6169 display: block;
6170 cursor: pointer;
6171 }
6172
6173 /*
6174 * MultiSite page
6175 */
6176 .wtotem_body .sites-section__icon {
6177 font-size: 12px;
6178 line-height: 15px;
6179 color: #5e6977
6180 }
6181 .wtotem_body .sites-section__icon--red {
6182 background: #ff0202;
6183 border: 1px solid rgba(61, 80, 223, .3)
6184 }
6185 .wtotem_body .sites-section__icon--yellow {
6186 background: #ffe602;
6187 border: 1px solid rgba(61, 80, 223, .3)
6188 }
6189 .wtotem_body .sites-section__icon--gray {
6190 border: 1px solid #86939e;
6191 background-color: #e1e8ee
6192 }
6193 .wtotem_body .sites-section__icon-stack {
6194 display: flex
6195 }
6196 .wtotem_body .sites-section__icon-stack>* {
6197 width: 40px;
6198 height: 40px;
6199 line-height: 28px;
6200 text-align: center;
6201 border-radius: 50%;
6202 margin-left: -9px;
6203 display: inline-flex;
6204 align-items: center;
6205 justify-content: center;
6206 position: relative;
6207 }
6208 .wtotem_body .sites-section__icon-stack>:first-child {
6209 margin-left: 0
6210 }
6211 .wtotem_body .services-icons rect{
6212 fill: rgb(255, 255, 255);
6213 }
6214 .wtotem_body .services-icons.services-icon__wa path{
6215 fill: rgb(105 105 105);
6216 }
6217 .wtotem_body .sites-section__icon--yellow .services-icons rect{
6218 fill: rgb(105 105 105);
6219 }
6220 .wtotem_body .services-icons {
6221 width: 18px;
6222 height: 18px;
6223 }
6224
6225 /**
6226 * Not working page styles
6227 */
6228 .wtotem_not-working {
6229 display: grid;
6230 grid-template-rows: auto 1fr auto;
6231 min-height: 100vh;
6232 }
6233 .wtotem_not-working__card {
6234 margin: 40px auto;
6235 }
6236 .wtotem_not-working__title {
6237 margin-bottom: 30px;
6238 }
6239 .wtotem_not-working__img {
6240 display: block;
6241 margin-bottom: 30px;
6242 }
6243 .wtotem_not-working__text {
6244 font-weight: 500;
6245 font-size: 16px;
6246 line-height: 19px;
6247 text-align: center;
6248 padding-bottom: 30px;
6249 border-bottom: 1px solid #e1e8ee;
6250 margin-bottom: 30px;
6251 width: 100%;
6252 }
6253
6254 /**
6255 * Message card
6256 */
6257 .wtotem_body .message-card {
6258 background: #ffffff;
6259 /* Shadow */
6260 box-shadow: 0px 6px 54px rgba(61, 80, 223, 0.04);
6261 border-radius: 24px;
6262 padding: 45px;
6263 display: flex;
6264 flex-direction: column;
6265 align-items: center;
6266 width: 390px;
6267 }
6268 .wtotem_body .message-card__title {
6269 font-weight: bold;
6270 font-size: 24px;
6271 line-height: 32px;
6272 color: #3d50df;
6273 text-align: center;
6274 }
6275 .wtotem_body .message-card__button {
6276 width: 100%;
6277 padding: 13px;
6278 }
6279
6280 /**
6281 * Message card small styles max-width 576px
6282 */
6283 @media screen and (max-width: 576px) {
6284 .wtotem_body .message-card {
6285 width: 300px;
6286 }
6287 }
6288
6289 /**
6290 * 2FA styles
6291 */
6292 .wtotem-recovery-codes li{
6293 font-family: monospace !important;
6294 }
6295 .wtotem_body .wtotem_control__btn.wtotem_disabled {
6296 color: #777;
6297 background-color: #f3f5f6;
6298 border-color: #9f9f9f;
6299 cursor: not-allowed;
6300 opacity: 0.75;
6301 }
6302 .wtotem-recovery-list{
6303 width: 350px;
6304 background: #F3F5F6;
6305 border-radius: 4px;
6306 padding: 16px 24px;
6307 position: relative;
6308 margin: 15px 0;
6309 color: #5a5a5a;
6310 }
6311 .wtotem-recovery-btn{
6312 position: absolute;
6313 bottom: 5px;
6314 right: 14px;
6315 }
6316 .wtotem-recovery-btn img{
6317 margin-right: 10px;
6318 cursor: pointer;
6319 }
6320 .wtotem-hr{
6321 border: 0;
6322 border-top: 1px solid #ebebeb;
6323 border-bottom: 1px solid #f6f7f7;
6324 }
6325 #wtotem_ga_qr canvas{
6326 border: 10px solid #fff;
6327 }
6328
6329 /**
6330 * Login attempts
6331 */
6332 .wtotem-interval-select{
6333 border: 2px solid #e1e8ee;
6334 border-radius: 5px;
6335 margin-bottom: 5px;
6336 position: relative;
6337 width: fit-content;
6338 }
6339 .wtotem-interval-select:before{
6340 content: '';
6341 background: url("../img/clock.svg") no-repeat;
6342 width: 20px;
6343 height: 20px;
6344 position: absolute;
6345 top: 5px;
6346 left: 5px;
6347 }
6348
6349 .wtotem-interval-select select{
6350 border: 0;
6351 padding-left: 30px;
6352 }
6353
6354 /*
6355 * Dark mode styles
6356 */
6357 .wtotem_theme—dark {
6358 background: #191919;
6359 color: #e2e2e2;
6360 }
6361 .wtotem_theme—dark .wtotem_body .h1,
6362 .wtotem_theme—dark .wtotem_body .h2,
6363 .wtotem_theme—dark .wtotem_body .h3,
6364 .wtotem_theme—dark .wtotem_body .h4,
6365 .wtotem_theme—dark .wtotem_body .h5 {
6366 color: #e8e8e8;
6367 }
6368 .wtotem_theme—dark .wtotem_body .wt_card,
6369 .wtotem_theme—dark .wtotem_body .wt_card:before,
6370 .wtotem_theme—dark .wtotem_chart-first__btn_active,
6371 .wtotem_theme—dark .country-blocking-form-save{
6372 background: #282828;
6373 }
6374 .wtotem_theme—dark .wtotem_content,
6375 .wtotem_theme—dark .wtotem_footer,
6376 .wtotem_theme—dark .wtotem_chart-first__right,
6377 .wtotem_theme—dark .wtotem_control__block,
6378 .wtotem_theme—dark .wtotem_state__select,
6379 .wtotem_theme—dark .wtotem_chart__calendars,
6380 .wtotem_theme—dark .wtotem_control__btn:hover {
6381 background: #191919;
6382 }
6383 .wtotem_theme—dark .wtotem_version__count {
6384 border: 1px solid #f3f5f6;
6385 }
6386 .wtotem_theme—dark .wtotem_logo {
6387 background: url("../img/dr-logo.svg") no-repeat center center/cover;
6388 }
6389 .wtotem_theme—dark .wtotem_nav__link,
6390 .wtotem_theme—dark .wtotem_version__count,
6391 .wtotem_theme—dark .wtotem_body .title,
6392 .wtotem_theme—dark .wtotem_title-info__title,
6393 .wtotem_theme—dark .wtotem_overall__text,
6394 .wtotem_theme—dark .wtotem_info__subtitle,
6395 .wtotem_theme—dark .wtotem_info__info,
6396 .wtotem_theme—dark .wtotem_numbers__figures,
6397 .wtotem_theme—dark .wtotem_from__country,
6398 .wtotem_theme—dark .wtotem_from__country span,
6399 .wtotem_theme—dark .wtotem_data__th,
6400 .wtotem_theme—dark .wtotem_antivirus__title,
6401 .wtotem_theme—dark .wtotem_table__title,
6402 .wtotem_theme—dark .wtotem_table__subject,
6403 .wtotem_theme—dark .wtotem_table__text,
6404 .wtotem_theme—dark .wtotem_table__perfomance,
6405 .wtotem_theme—dark .wtotem_footer__text,
6406 .wtotem_theme—dark .wtotem_footer__text,
6407 .wtotem_theme—dark .wtotem_chart__btn,
6408 .wtotem_theme—dark .wtotem_antivirus__item:last-child div,
6409 .wtotem_theme—dark .wtotem_from__percent,
6410 .wtotem_theme—dark .wtotem_chart-first__all,
6411 .wtotem_theme—dark .wtotem_chart-first__hack p,
6412 .wtotem_theme—dark .wtotem_chart-first__btn_active,
6413 .wtotem_theme—dark .wtotem_chart__text,
6414 .wtotem_theme—dark .wtotem_table__initial-value,
6415 .wtotem_theme—dark .wtotem_body .arrow-right,
6416 .wtotem_theme—dark .wtotem_print__label,
6417 .wtotem_theme—dark .wtotem_state__text,
6418 .wtotem_theme—dark .wtotem_data__td,
6419 .wtotem_theme—dark .wtotem_file-table__th,
6420 .wtotem_theme—dark .wtotem_file-table,
6421 .wtotem_theme—dark .wtotem_option__title,
6422 .wtotem_theme—dark .wtotem_option__text,
6423 .wtotem_theme—dark .wtotem_control__title,
6424 .wtotem_theme—dark .wtotem_control__name,
6425 .wtotem_theme—dark .wtotem_body .onoff__label:after,
6426 .wtotem_theme—dark .wtotem_body .onoff__label:before,
6427 .wtotem_theme—dark .wtotem_unit__expectation_loading,
6428 .wtotem_theme—dark .wtotem_alert__text,
6429 .wtotem_theme—dark .audit-logs-entry__description,
6430 .wtotem_theme—dark .audit-logs__date{
6431 color: #f3f5f6;
6432 }
6433 .wtotem_theme—dark .wtotem_nav__link_active {
6434 color: #3d50df;
6435 }
6436 .wtotem_theme—dark .wtotem_data__ip,
6437 .wtotem_theme—dark .files__last-modify,
6438 .wtotem_theme—dark .wtotem_body .files__file-path{
6439 color: #86939e;
6440 }
6441 .wtotem_theme—dark .wtotem_body .options__item{
6442 color: #fff;
6443 width: 100%;
6444 border-bottom: 1px solid #282828;
6445 }
6446 .wtotem_theme—dark .wtotem_body .options{
6447 border: 1px solid rgb(25, 25, 25);
6448 background: rgb(60, 60, 61);
6449 }
6450 .wtotem_theme—dark .wtotem_chart__btn {
6451 border: 1px solid #f3f5f6;
6452 }
6453 .wtotem_theme—dark .wtotem_file-table__tr,
6454 .wtotem_theme—dark .wtotem_last_scan_av {
6455 border-color: #191919;
6456 }
6457 .wtotem_theme—dark .audit-logs__time-count{
6458 border: 1px solid #3c3c3d;
6459 }
6460 .wtotem_theme—dark .wtotem_title-info__info {
6461 background: url("../img/dr-info.svg") no-repeat center center/cover;
6462 }
6463 .wtotem_theme—dark .wtotem_info__item:first-child,
6464 .wtotem_theme—dark .wtotem_numbers__item,
6465 .wtotem_theme—dark .wtotem_antivirus__item,
6466 .wtotem_theme—dark .wtotem_unit__block {
6467 border-right: 1px solid #3c3c3d;
6468 }
6469 .wtotem_theme—dark .wtotem_antivirus__item:last-child {
6470 border-right: none;
6471 }
6472 .wtotem_theme—dark .wtotem_numbers__item:last-child {
6473 border-right: none;
6474 }
6475 .wtotem_theme—dark .wtotem_table__col {
6476 border-right: 1px solid #3c3c3d;
6477 border-bottom: 1px solid #3c3c3d;
6478 }
6479 .wtotem_theme—dark .wtotem_table__col:last-child {
6480 border-right: none;
6481 }
6482 .wtotem_theme—dark .wtotem_chart__line,
6483 .wtotem_theme—dark .audit-logs__divider{
6484 background: #3c3c3d;
6485 }
6486 .wtotem_theme—dark .wtotem_table__th,
6487 .wtotem_theme—dark .wtotem_table__td,
6488 .wtotem_theme—dark .wtotem_body .country-blocking-form__select-region{
6489 border-bottom: 1px solid #3c3c3d;
6490 }
6491 .wtotem_theme—dark .wtotem_body .country-blocking-form{
6492 color: #e2e2e2;
6493 }
6494 .wtotem_theme—dark .wtotem_table__link:after {
6495 content: "";
6496 border: solid #fff;
6497 border-width: 0 1px 1px 0;
6498 -webkit-transform: rotate(-45deg);
6499 transform: rotate(-45deg);
6500 }
6501 .wtotem_theme—dark .wtotem_body .arrow-right:after {
6502 content: "";
6503 border: solid #f3f5f6;
6504 border-width: 0 1px 1px 0;
6505 -webkit-transform: rotate(-45deg);
6506 transform: rotate(-45deg);
6507 margin-left: 10px;
6508 }
6509 .wtotem_theme—dark .wtotem_footer__line,
6510 .wtotem_theme—dark .wtotem_state__line {
6511 background: #2d2e2e;
6512 }
6513 .wtotem_theme—dark .wtotem_body td,
6514 .wtotem_theme—dark .wtotem_body th {
6515 border: 1px solid #282828;
6516 background: #282828;
6517 }
6518 .wtotem_theme—dark .wtotem_footer__logo {
6519 background: url("../img/dr-logo-footer.svg") no-repeat center center/cover;
6520 }
6521 .wtotem_theme—dark .wtotem_body .line-chart__tooltip {
6522 background: #3d50df;
6523 }
6524 .wtotem_theme—dark .wtotem_body .line-chart__tooltip::before {
6525 border-color: #3d50df transparent transparent transparent;
6526 }
6527 .wtotem_theme—dark .wtotem_body .line-chart__tooltip--reverse::before {
6528 border-color: transparent transparent #3d50df transparent;
6529 }
6530 .wtotem_theme—dark .wtotem_body .wtotem_firewall__icon {
6531 background: url("../img/dr-shape.svg") no-repeat center center/cover;
6532 }
6533 .wtotem_theme—dark .wtotem_body .onoff__label {
6534 background: #686868;
6535 }
6536 .wtotem_theme—dark .wtotem_body .wtotem_print__img {
6537 background: url("../img/dr-print.svg") no-repeat center center/cover;
6538 }
6539 .wtotem_theme—dark .wtotem_body .wtotem_control__trash {
6540 background: url("../img/dr-trash.svg") no-repeat center center/cover;
6541 }
6542 .wtotem_theme—dark .wtotem_body .onoff__input:checked + label .onoff__circle {
6543 background: #4bc374;
6544 }
6545 .wtotem_theme—dark .wtotem_body .onoff__circle {
6546 background: #ec6d62;
6547 }
6548 .wtotem_theme—dark .wtotem_alert__close:before,
6549 .wtotem_theme—dark .wtotem_alert__close:after {
6550 background: #dadada;
6551 }
6552 .wtotem_theme—dark .wtotem-waf-settings-popup {
6553 background: #282828;
6554 color: #e2e2e2;
6555 }
6556 .wtotem_theme—dark .wtotem_body .country-blocking-modal-attacks-container {
6557 border: 1px solid #333333;
6558 color: #ffffff;
6559 }
6560 .wtotem_theme—dark .wtotem_body .wtotem-waf-settings-popup__input,
6561 .wtotem_theme—dark .wtotem_body .firewall-configuration__ip-adress,
6562 .wtotem_theme—dark .wtotem_body .country-blocking-modal__search-input{
6563 border: 1px solid #333333;
6564 background-color: #191919;
6565 color: #ffffff;
6566 }
6567 .wtotem_theme—dark .wtotem_antivirus__figures_black {
6568 color: #5a7bb7;
6569 }
6570 .wtotem_theme—dark .wtotem_help-links__item {
6571 background: #282828;
6572 }
6573 .wtotem_theme—dark .wtotem_help-links__title {
6574 color: #eee;
6575 }
6576 .wtotem_theme—dark .wtotem_dark_btn {
6577 background: #1b3b75;
6578 }
6579 .wtotem_theme—dark .wtotem-firewall-settings__no-data-icon {
6580 background: #191919;
6581 }
6582 .wtotem_theme—dark input {
6583 background-color: #191919;
6584 color: #fff;
6585 border-color: #3a3a3a;
6586 }
6587 .wtotem_theme—dark .wtotem_body .firewall-ip-table__tr:hover {
6588 background: #191919;
6589 border-bottom: 1px solid #7a7a7a;
6590 }
6591 .wtotem_theme—dark .wtotem_body .firewall-ip-table__td {
6592 /*border-bottom: 1px solid #5a5a5a;*/
6593 }
6594 .wtotem_theme—dark .wtotem_body .firewall-ip-table__th {
6595 background: transparent;
6596 border-color: transparent;
6597 color: #cfcfcf;
6598 }
6599 .wtotem_theme—dark .wtotem-loader__wrapper {
6600 background: #191919;
6601 }
6602 .wtotem_theme—dark .wtotem_body .firewall-multi-adding__input {
6603 background-color: #191919;
6604 color: #fff;
6605 border-color: #3a3a3a;
6606 }
6607 .wtotem_theme—dark .wtotem_disk_chart svg path {
6608 stroke: #282828;
6609 }
6610 .wtotem_theme—dark input.wtotem_calendar {
6611 color: #cccccc;
6612 }
6613 .wtotem_theme—dark .flatpickr-calendar {
6614 background: #282828;
6615 border: 2px solid #191919;
6616 }
6617 .wtotem_theme—dark .flatpickr-day {
6618 color: #cccccc;
6619 }
6620 .wtotem_theme—dark .flatpickr-monthDropdown-months,
6621 .wtotem_theme—dark .flatpickr-current-month input.cur-year {
6622 color: #cccccc;
6623 }
6624 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
6625 background-color: #282828;
6626 }
6627 .wtotem_theme—dark .flatpickr-current-month .flatpickr-monthDropdown-months,
6628 .wtotem_theme—dark .flatpickr-monthDropdown-months,
6629 .wtotem_theme—dark .flatpickr-current-month input.cur-year {
6630 border: 1px solid #545454;
6631 }
6632 .wtotem_theme—dark .flatpickr-day.inRange,
6633 .wtotem_theme—dark .flatpickr-day.prevMonthDay.inRange,
6634 .wtotem_theme—dark .flatpickr-day.nextMonthDay.inRange,
6635 .wtotem_theme—dark .flatpickr-day.today.inRange,
6636 .wtotem_theme—dark .flatpickr-day.prevMonthDay.today.inRange,
6637 .wtotem_theme—dark .flatpickr-day.nextMonthDay.today.inRange,
6638 .wtotem_theme—dark .flatpickr-day:hover,
6639 .wtotem_theme—dark .flatpickr-day.prevMonthDay:hover,
6640 .wtotem_theme—dark .flatpickr-day.nextMonthDay:hover,
6641 .wtotem_theme—dark .flatpickr-day:focus,
6642 .wtotem_theme—dark .flatpickr-day.prevMonthDay:focus,
6643 .wtotem_theme—dark .flatpickr-day.nextMonthDay:focus {
6644 background: #656565;
6645 border-color: #656565;
6646 color: #fff;
6647 }
6648 .wtotem_theme—dark .wtotem_body .wtotem_country__desc {
6649 color: #ccc;
6650 }
6651 .wtotem_theme—dark .wtotem_body .wtotem_reports {
6652 background: #191919;
6653 }
6654 .wtotem_theme—dark .wtotem_body .wtotem_reports-table__column,
6655 .wtotem_theme—dark .wtotem_body .wtotem_reports-dates {
6656 background: #282828;
6657 border: solid 1px #282828;
6658 }
6659 .wtotem_theme—dark .wtotem_body .wtotem_reports-dates__input {
6660 border: 1px solid #3a3a3a;
6661 color: #ccc;
6662 }
6663 .wtotem_theme—dark .wtotem_body .wtotem_reports-table__row {
6664 background: transparent;
6665 }
6666 .wtotem_theme—dark .wtotem_body .wtotem_reports-modal {
6667 color: #ddd;
6668 }
6669 .wtotem_theme—dark .wtotem_body .wtotem_reports-modal__content {
6670 background: #282828;
6671 }
6672 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__dates,
6673 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__period-item {
6674 border: 2px solid #35383b;
6675 }
6676 .wtotem_theme—dark .wtotem_body .wtotem_reports-modal__close {
6677 background-image: url(../img/close.svg);
6678 }
6679 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__module-item::after {
6680 background-color: #35383b;
6681 }
6682 .wtotem_theme—dark .wtotem_body .wtotem_reports-accordion__header,
6683 .wtotem_theme—dark .wtotem_body .wtotem_reports-accordion__item {
6684 background: #282828;
6685 color: #d6d6d6;
6686 }
6687 .wtotem_theme—dark .wtotem_body .wtotem_reports-accordion__content-wrapper {
6688 border-top: 1px solid #565656;
6689 }
6690 .wtotem_theme—dark .wtotem_body .wt-input input {
6691 background-color: #191919;
6692 color: #fff;
6693 border-color: #3a3a3a;
6694 }
6695 .wtotem_theme—dark .wtotem_body .wt-input input[type=image] {
6696 background-color: transparent;
6697 }
6698 .wtotem_theme—dark .wtotem_body .wt-input__inner {
6699 background-color: #191919;
6700 border-color: #3a3a3a;
6701 }
6702 .wtotem_theme—dark .wtotem_body .port-scanner-list td span {
6703 background-color: #424242;
6704 }
6705 .wtotem_theme—dark .wtotem_body .port-scanner-list__form-ports .port-scanner-port-wrapper {
6706 background-color: #867b56;
6707 }
6708 .wtotem_theme—dark .wtotem_body .port-scanner-list td,
6709 .wtotem_theme—dark .wtotem_body .port-scanner-list__header,
6710 .wtotem_theme—dark .wtotem_body .popup-content,
6711 .wtotem_theme—dark .wtotem_body .side-modal__header-wrapper {
6712 border-bottom: 1px solid #191919;
6713 }
6714 .wtotem_theme—dark .wtotem_body .wtotem_reports-settings__module-label {
6715 color: #282828;
6716 }
6717 .wtotem_theme—dark .wtotem_body .wtotem_all__th {
6718 color: #f3f5f6;
6719 }
6720 .wtotem_theme—dark .wtotem_body .wtotem_body td,
6721 .wtotem_theme—dark .wtotem_body .wtotem_body th {
6722 border: 1px solid #282828;
6723 background: #282828;
6724 }
6725 .wtotem_theme—dark .wtotem_body .wtotem_all__td,
6726 .wtotem_theme—dark .wtotem_body .wtotem_all__th {
6727 background: #282828;
6728 border: solid 1px #282828;
6729 }
6730 .wtotem_theme—dark .wtotem_body .firewall-ip-table__tr{
6731 border: solid 1px #282828;
6732 }
6733 .wtotem_theme—dark .wtotem_body .notifications-settings__header-wrapper{
6734 border-bottom: 1px solid #525252;
6735 }
6736 .wtotem_theme—dark .wtotem_body .firewall-configuration__list-types,
6737 .wtotem_theme—dark .wtotem_body .wtotem_page-header__menu{
6738 border-bottom: 1px solid #525252;
6739 }
6740 .wtotem_theme—dark .wtotem_body .wtotem_page-header__link{
6741 color: #d5d5d5;
6742 }
6743 .wtotem_theme—dark .wtotem_body .wtotem_page-header__link:hover{
6744 color: #fff;
6745 }
6746 .wtotem_theme—dark .wtotem_body .popup-content{
6747 background: #282828;
6748 }
6749 .wtotem_theme—dark .wtotem_body .confirmation-dialog__title,
6750 .wtotem_theme—dark .wtotem_body .confirmation-dialog__text{
6751 color: #fff;
6752 }
6753 .wtotem_theme—dark .wtotem_body .sites-section__icon--gray{
6754 border: 1px solid #000000;
6755 background-color: #191919;
6756 }
6757 .wtotem_theme—dark .wtotem-hr{
6758 border-top: 1px solid #626262;
6759 border-bottom: 1px solid #505050;
6760 }
6761 .wtotem_theme—dark .wtotem-interval-select{
6762 border: 2px solid #686868;
6763 }
6764 .wtotem_theme—dark .wtotem-interval-select select{
6765 background-color: #191919;
6766 background-image: url('../img/arrow-down.svg');
6767 color: #fff;
6768 }
6769 .wtotem_theme—dark .scan-tabs__item--active .scan-tabs__btn{
6770 color: #7d8dff;
6771 }
6772 .wtotem_theme—dark .scan-tabs__item--active{
6773 border-bottom-color: #7d8dff;
6774 }
6775 .wtotem_theme—dark .firewall-log-report__payload{
6776 color: #000;
6777 }
6778 .wtotem_theme—dark .wtotem_body .audit-logs__event{
6779 background: #191919 url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E) no-repeat right 5px top 55%;
6780 color: #f3f5f6;
6781 }
6782 .wtotem_theme—dark .scan-tabs__item .num{
6783 background-color: #191919;
6784 color: #f3f5f6;
6785 }
6786 .wtotem_theme—dark .wtotem_body .scan-tabs__item--active .num{
6787 background-color: #191919;
6788 color: #7d8dff;
6789 }
6790 .wtotem_theme—dark .wtotem_body .audit-logs__controls,
6791 .wtotem_theme—dark .wtotem_body .scan-tabs{
6792 border-bottom: 1px solid #3c3c3d;
6793 }
6794
6795 /*
6796 * Dark mode Small styles 768px
6797 */
6798 @media screen and (max-width: 1000px) {
6799 .wtotem_theme—dark .wtotem_body .wtotem_nav {
6800 background: #191919;
6801 }
6802 .wtotem_theme—dark .wtotem_body .wtotem_nav__item {
6803 border-bottom: 1px solid #3c3c3d;
6804 }
6805 }
6806
6807 /* Dark mode Extra small styles 576px*/
6808 @media screen and (max-width: 576px) {
6809 .wtotem_theme—dark .wtotem_info__item:first-child {
6810 border-right: none;
6811 }
6812 .wtotem_theme—dark .wtotem_body .wtotem_antivirus__item {
6813 border-bottom: 1px solid #3c3c3d;
6814 }
6815 .wtotem_theme—dark .wtotem_body .wtotem_numbers__item:last-child {
6816 border-right: 1px solid #3c3c3d;
6817 }
6818 .wtotem_theme—dark .wtotem_body .wtotem_numbers__item:nth-child(2) {
6819 border-right: none;
6820 }
6821 .wtotem_theme—dark .wtotem_body .wtotem_antivirus__item:last-child {
6822 border-right: none;
6823 border-bottom: none;
6824 }
6825 .wtotem_theme—dark .wtotem_body .wtotem_antivirus__item:nth-child(2) {
6826 border-right: none;
6827 }
6828 .wtotem_theme—dark .wtotem_body .wtotem_antivirus__item:nth-child(3) {
6829 border-bottom: none;
6830 }
6831 }
6832