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

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

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