PluginProbe ʕ •ᴥ•ʔ
Atarim – AI Agency for WordPress: Edit Pages, Fix Code, Update Plugins, SEO & Client Feedback / 3.14
Atarim – AI Agency for WordPress: Edit Pages, Fix Code, Update Plugins, SEO & Client Feedback v3.14
5.1.3 5.1.2 5.1.1 5.1 5.0 trunk 3.10 3.11 3.12 3.13 3.14 3.15 3.16 3.17 3.18 3.19 3.2.0 3.2.1 3.22 3.22.1 3.22.2 3.22.3 3.22.4 3.22.5 3.22.6 3.3.0 3.3.1 3.3.2 3.3.2.1 3.3.2.2 3.3.3 3.30 3.31 3.32 3.4 3.4.1 3.4.3 3.4.4 3.5 3.5.1 3.6 3.6.1 3.7 3.8 3.9 3.9.1 3.9.2 3.9.3 3.9.4 3.9.6 3.9.6.1 4.0 4.0.1 4.0.2 4.0.3 4.0.4 4.0.5 4.0.6 4.0.7 4.0.8 4.0.9 4.1.0 4.1.1 4.1.2 4.1.3 4.2 4.2.1 4.2.2 4.3 4.3.1 4.3.2 4.3.3 4.3.4 4.3.5 4.4
atarim-visual-collaboration / css / wpf-common.css
atarim-visual-collaboration / css Last commit date
admin-settings.css 2 years ago admin.css 2 years ago bootstrap.min.css 2 years ago monolith.min.css 2 years ago quill.css 2 years ago wpf-common.css 2 years ago wpf-icons.css 2 years ago wpf-login.css 2 years ago
wpf-common.css
6575 lines
1 @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
2
3 /* Sheet Structure
4 * - Animation
5 * - General
6 * - Users tab
7 * - Sliders tabs
8 * - Screenshot tab
9 * - Details tab
10 * -- Custom Tagging
11 * - Share tab
12 * - Item Circle
13 * - Chosen DIV Border
14 * - Floating Icon
15 * - Compact Mode
16 * - Chat Box
17 * - Sidebar
18 * - Filter task
19 * - Front End Wizard
20 * - Responsive Mode
21 * - General Tasks pop up
22 * - Unlock Website
23 * - Internal Tasks
24 * - Edit/Delete Comments
25 * - Tooltips
26 * - Plugin Conflicts
27 * - Translation Adaptations
28 * -- RTL
29 * - Mobile
30 * - Bug Fixes
31 * */
32
33
34 /**
35 * ----------------------------------------
36 * Animation fade-in-top
37 * ----------------------------------------
38 */
39
40 @-webkit-keyframes fade-in-top {
41 0% {
42 -webkit-transform: translateY(-50px);
43 transform: translateY(-50px);
44 opacity: 0;
45 }
46 100% {
47 -webkit-transform: translateY(0);
48 transform: translateY(0);
49 opacity: 1;
50 }
51 }
52 @keyframes fade-in-top {
53 0% {
54 -webkit-transform: translateY(-50px);
55 transform: translateY(-50px);
56 opacity: 0;
57 }
58 100% {
59 -webkit-transform: translateY(0);
60 transform: translateY(0);
61 opacity: 1;
62 }
63 }
64 /**
65 * ----------------------------------------
66 * Animation fade-in-bottom
67 * ----------------------------------------
68 */
69
70 @-webkit-keyframes fade-in-bottom{
71 0% {
72 -webkit-transform: translateY(50%);
73 transform: translateY(50%);
74 opacity: 0;
75 }
76 100% {
77 -webkit-transform: translateY(0);
78 transform: translateY(0);
79 opacity: 1;
80 }
81 }
82 @keyframes fade-in-bottom {
83 0% {
84 -webkit-transform: translateY(50%);
85 transform: translateY(50%);
86 opacity: 0;
87 }
88 100% {
89 -webkit-transform: translateY(0);
90 transform: translateY(0);
91 opacity: 1;
92 }
93 }
94 /**
95 * ----------------------------------------
96 * Animation fade-out
97 * ----------------------------------------
98 */
99
100 @-webkit-keyframes fade-out {
101 0% {
102 opacity: 1;
103 }
104 100% {
105 opacity: 0;
106 }
107 }
108 @keyframes fade-out {
109 0% {
110 opacity: 1;
111 }
112 100% {
113 opacity: 0;
114 }
115 }
116 /**
117 * ----------------------------------------
118 * Animation pulse
119 * ----------------------------------------
120 */
121 @keyframes wpfpulse {
122 0% {
123 box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
124 }
125 40% {
126 box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.3);
127 }
128 100% {
129 box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
130 }
131 }
132
133 /* ------------ General ------------ */
134 /* for fixing blank screenshot issue on Bricks theme */
135 body.bricks-is-frontend {
136 overflow-x: unset !important;
137 }
138 /* End */
139
140 div#wpf_launcher div {
141 padding: 0;
142 }
143
144 a {
145 outline: none !important;
146 }
147 #menu-posts-wpfeedback {
148 display: none !important;
149 }
150 object.wpf_none_comment,
151 .popover.wpf_comment_container .popover-body::before,
152 .popover.wpf_comment_container .popover-body::after {
153 box-sizing: border-box;
154 }
155 .wpf_comment_container .popover-body::-webkit-scrollbar,
156 .wpf_sidebar_container::-webkit-scrollbar,
157 div#wpf_general_comment_tabs::-webkit-scrollbar {
158 width: 7px;
159 transition: all 0.2s ease-in !important;
160 }
161 .wpf_comment_container .popover-body::-webkit-scrollbar-thumb,
162 .wpf_sidebar_container::-webkit-scrollbar-thumb,
163 div#wpf_general_comment_tabs::-webkit-scrollbar-thumb {
164 background: #dee2e6c9;
165 border-radius: 50px;
166 transition: all 0.2s ease-in !important;
167 }
168 .wpf_comment_container .popover-body::-webkit-scrollbar-thumb:hover,
169 .wpf_sidebar_container::-webkit-scrollbar-thumb:hover,
170 div#wpf_general_comment_tabs::-webkit-scrollbar-thumb:hover {
171 background: #dee2e6 !important;
172 }
173 .wpf_comment_container a:focus,
174 .wpf_comment_container button:focus {
175 outline: none !important;
176 }
177 .wpf_comment_container.popover-body {
178 padding: 15px 15px 10px 15px;
179 }
180 .popover.wpf_comment_container {
181 width: 360px;
182 font-family: 'Roboto', sans-serif;
183 max-width: 360px !important;
184 z-index: 214748364 !important;
185 border-radius: 7px;
186 display: inline-block;
187 opacity: 0;
188 -webkit-animation-name: fadeIn;
189 animation-name: fadeIn;
190 -webkit-animation-duration: 0.5s;
191 animation-duration: 0.5s;
192 -webkit-animation-fill-mode: both;
193 animation-fill-mode: both;
194 }
195 .popover.wpf_comment_container .popover-body {
196 padding: 10px 10px 4px 10px !important;
197 }
198 #wpf_general_comment_tabs
199 {
200 padding-top: 10px;
201 }
202 div#wpf_general_comment_tabs a,
203 .popover.wpf_comment_container a,
204 .popover.wpf_comment_container label,
205 .popover.wpf_comment_container button,
206 .wpf_comment_container button {
207 text-decoration: none !important;
208 box-shadow: none !important;
209 }
210 .wpf_comment_container ul {
211 margin-left: 0 !important;
212 margin-top: 0;
213 border: none;
214 width: auto;
215 margin-bottom: -1px;
216 }
217 .wpf_current_chat_box {
218 margin-bottom: 10px !important;
219 }
220 .wpf_comment_container.bs-popover-auto[x-placement^=right]>.arrow::before,
221 .wpf_comment_container.bs-popover-right>.arrow::before {
222 border-right-color: #ffffff !important;
223 left: 1px !important;
224 border-width: 0.5rem 0.5rem 0.5rem 0 !important;
225 }
226 .popover .arrow::after, .popover .arrow::before {
227 position: absolute;
228 display: block;
229 content: "";
230 border-color: transparent;
231 border-style: solid;
232 }
233 .wpf_comment_container.bs-popover-auto[x-placement^=left]>.arrow::before,
234 .wpf_comment_container.bs-popover-left>.arrow::before {
235 border-left-color: #ffffff !important;
236 right: 1px !important;
237 border-width: 0.5rem 0 0.5rem 0.5rem !important;
238 }
239 .wpf_comment_container .form-group {
240 margin-bottom: 8px !important;
241 }
242 .wpf_comment_container .form-group span {
243 font-size: 12px;
244 font-weight: bold;
245 color: #cc1816;
246 }
247 .wpf_comment_container textarea.form-control {
248 font-size: 14px;
249 font-family: 'Roboto', sans-serif;
250 padding: 5px 10px;
251 min-height: 80px;
252 border-radius: 7px;
253 width: 100%;
254 color: #000000;
255 text-transform: unset;
256 font-weight: normal;
257 height: auto;
258 line-height: 1.2 !important;
259 max-width: 100%;
260 min-width: 100%;
261 display: block;
262 -moz-box-sizing: border-box;
263 -webkit-box-sizing: border-box;
264 box-sizing: border-box;
265 box-shadow: none !important;
266 outline: none !important;
267 }
268 .wpf_comment_container .nav-tabs .nav-link {
269 text-align: center;
270 float: right;
271 font-size: 16px;
272 color: var(--main-wpf-color) !important;
273 background-color: transparent;
274 opacity: 0.3;
275 transition: all 0.2s ease-in !important;
276 }
277 .wpf_comment_container .nav-tabs .nav-item.show .nav-link,
278 .wpf_comment_container .nav-tabs .nav-link.active {
279 color: var(--main-wpf-color) !important;
280 z-index: 10;
281 position: relative;
282 opacity: 1;
283 border-color: #dee2e6 #dee2e6 #fff !important;
284 }
285 .wpf_comment_container .nav-tabs .nav-link:hover {
286 border-color: transparent;
287 opacity: 1;
288 }
289 .wpf_comment_container .tab-content {
290 overflow: hidden;
291 display: block;
292 border: inherit;
293 padding: inherit;
294 letter-spacing: 0.03em;
295 margin-top: 0px !important;
296 }
297 .wpf_comment_container .tab-content::before {
298 display: none !important;
299 }
300 .wpf_comment_container .tab-content > .tab-pane.active {
301 display: block;
302 margin-bottom: 15px;
303 border-radius: 0 0px 10px 10px;
304 -webkit-animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
305 animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
306 }
307 .wpf_comment_container .hide,
308 .hide {
309 display: none;
310 }
311
312 .wpf_comment_container input.wpf_uploadfile {
313 width: inherit !important;
314 position: absolute !important;
315 opacity: 0 !important;
316 overflow: hidden;
317 left: initial;
318 top: initial;
319 height: auto;
320 left: 0px;
321 z-index: 10003 !important;
322 cursor: pointer;
323 }
324 .wpf_comment_container .popover-body .close, .wpf_comment_container .popover-content .close {
325 font-size: 30px;
326 margin-top: -5px;
327 color: #e54f6d !important;
328 float: right;
329 font-weight: 400;
330 line-height: 1;
331 text-shadow: 0 1px 0 #fff;
332 text-decoration: none !important;
333 }
334 .bs-popover-bottom>.arrow.wpf_arrow:before {
335 border-bottom-color: #fff !important;
336 margin-top: 1px;
337 }
338 .bs-popover-auto[x-placement^=bottom]>.wpf_arrow::before,
339 .bs-popover-bottom>.wpf_arrow::before {
340 border-bottom-color: #fff !important;
341 }
342
343 .wpf_sidebar_container div,
344 .wpf_sidebar_container.wpf_graphics span {
345 -moz-box-sizing: border-box;
346 -webkit-box-sizing: border-box;
347 box-sizing: border-box;
348 }
349 /* ------------ Users tab ------------ */
350
351 .popover.wpf_comment_container ul.wp_feedback_filter_checkbox, .wpf_tag_autocomplete buttonuser, .popover.wpf_comment_container ul.wp_feedback_filter_checkbox.user, .wpf_wizard_modal ul.wp_feedback_filter_checkbox.user {
352 max-height: 120px !important;
353 overflow-y: auto;
354 padding: 0 !important;
355 margin: 0 !important;
356 }
357 ul.wp_feedback_filter_checkbox.user label {
358 margin: 0 0px 5px 5px;
359 letter-spacing: initial;
360 text-transform: initial;
361 font-size: 12px;
362 }
363 ul.wp_feedback_filter_checkbox.user li,
364 ul.wp_feedback_filter_checkbox.user label {
365 cursor: pointer;
366 position: relative;
367 }
368 ul.wp_feedback_filter_checkbox.user input[type=checkbox] {
369 display: none;
370 }
371 ul.wp_feedback_filter_checkbox.user input[type="checkbox"] + label:before,
372 div#wpf_wizard_notifications input + label:before {
373 content: '';
374 display: inline-block;
375 width: 16px;
376 height: 15px;
377 margin-bottom: -2px;
378 margin-right: 5px;
379 margin-left: -5px;
380 border-radius: 3px;
381 border: 2px solid #363d4d !important;
382 opacity: 0.6;
383 transition: all .12s, border-color .08s !important;
384 box-sizing: content-box;
385 }
386 ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:before,
387 div#wpf_wizard_notifications input:checked + label:before {
388 content: '';
389 display: inline-block;
390 width: 16px;
391 height: 15px;
392 margin-bottom: -2px;
393 margin-right: 5px;
394 margin-left: -5px;
395 border-radius: 3px;
396 border: 2px solid #363d4d !important;
397 opacity: 0.6;
398 transition: all .12s, border-color .08s !important;
399 }
400 ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:after,
401 div#wpf_wizard_notifications input:checked + label:after {
402 content: '';
403 display: block;
404 position: absolute;
405 top: 1px;
406 left: 0px;
407 width: 5px;
408 height: 10px;
409 border: solid #363d4d;
410 border-width: 0 2px 2px 0;
411 transform: rotate(45deg);
412 box-sizing: content-box;
413 }
414 .wpf_checkbox label {
415 margin-bottom: 10px !important;
416 position: relative;
417 }
418 /* ------------ Sliders tabs ------------ */
419
420 .anim-slider {
421 border-bottom: 7px solid #dee2e6;
422 box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.15);
423 padding-bottom: 0.25em;
424 position: relative;
425 width: 100%;
426 }
427 .anim-slider::after {
428 content: '';
429 display: table;
430 width: 100%;
431 clear: both;
432 }
433 .anim-slider input[type="radio"] {
434 display: none;
435 }
436 .anim-slider label {
437 float: left;
438 width: 25%;
439 text-align: center;
440 cursor: pointer;
441 transition: color .5s !important;
442 font-size: 10px !important;
443 margin-bottom: -15px;
444 font-family: 'Roboto', sans-serif;
445 color: #6c757d;
446 font-weight: 700 !important;
447 padding-bottom: 20px;
448 text-transform: initial;
449 display: inline-block !important;
450 letter-spacing: 0.3px !important;
451 }
452 .anim-slider label:hover {
453 text-decoration: underline;
454 }
455 .anim-slider input:checked + label {
456 color: var(--main-wpf-color);
457 }
458 .anim-slider label:last-of-type::after {
459 display: block;
460 width: 15px;
461 height: 15px;
462 background-color: var(--main-wpf-color);
463 content: "";
464 position: absolute;
465 bottom: -11px;
466 border-radius: 50%;
467 left: 0;
468 margin-left: -0.6em;
469 transition: left 0.5s !important;
470 }
471 .anim-slider input:checked:nth-of-type(1) ~ label:last-of-type::after {
472 left: 12%;
473 }
474 .anim-slider input:checked:nth-of-type(2) ~ label:last-of-type::after {
475 left: 38%;
476 }
477 .anim-slider input:checked:nth-of-type(3) ~ label:last-of-type::after {
478 left: 62%;
479 }
480 .anim-slider input:checked:nth-of-type(4) ~ label:last-of-type::after {
481 left: 88%;
482 }
483 /* ------------ Screenshot tab ------------ */
484
485 .wpf_screenshot_button {
486 background-color: var(--main-wpf-color);
487 color: #fff;
488 font-size: 14px;
489 text-align: center;
490 font-family: 'Roboto', sans-serif;
491 border-radius: 50px;
492 padding: 10px 5px;
493 line-height: 1.4;
494 margin-top: 5px;
495 -webkit-transition: all 0.2s ease-in;
496 -moz-transition: all 0.2s ease-in;
497 -ms-transition: all 0.2s ease-in;
498 -o-transition: all 0.2s ease-in;
499 transition: all 0.2s ease-in !important;
500 }
501 .wpf_screenshot_button:hover {
502 opacity: 0.8;
503 }
504 .wpfb_screenshot_class:before {
505 content: "";
506 width: 150px;
507 height: 150px;
508 background-size: contain;
509 background-color: #fff;
510 position: fixed;
511 left: calc(50% - 75px);
512 top: calc(50% - 75px);
513 }
514 .wpfb_screenshot_class {
515 filter: grayscale(0%) brightness(200%) contrast(200%);
516 -webkit-filter: grayscale(0%) brightness(200%) contrast(200%);
517 background-color: transparent !important;
518 -webkit-transition: all 0.2s ease-in;
519 -moz-transition: all 0.2s ease-in;
520 -ms-transition: all 0.2s ease-in;
521 -o-transition: all 0.2s ease-in;
522 transition: all 0.2s ease-in !important;
523 }
524 @-webkit-keyframes appear {
525 0% {
526 opacity: 1;
527 }
528 100% {
529 opacity: 0;
530 }
531 }
532 @keyframes appear {
533 0% {
534 opacity: 1;
535 }
536 100% {
537 opacity: 0;
538 }
539 }
540 a.wpf_screenshot_img_link img {
541 border-radius: 10px;
542 transition: all linear .2s !important;
543 box-sizing: border-box;
544 }
545 a.wpf_screenshot_img_link img:hover {
546 box-shadow: 0 6px 24px 0 rgba(18, 43, 70, .12);
547 }
548 /* ------------ Details tab ------------ */
549
550 ul.wpf_details_tab_inner {
551 padding: 0;
552 margin: 0;
553 }
554 .wpf_comment_container .popover-body li,
555 #wpf_general_comment_tabs ul li {
556 font-size: 12px;
557 line-height: 1.5;
558 color: #000000;
559 margin-left: 0;
560 margin-top: 0 !important;
561 margin-bottom: 0;
562 -moz-box-sizing: border-box;
563 -webkit-box-sizing: border-box;
564 box-sizing: border-box;
565 }
566 .wpf_comment_container .popover-body li:not(.meassage_area_main ul li, .meassage_area_main ol li),
567 #wpf_general_comment_tabs ul li:not(.meassage_area_main ul li, .meassage_area_main ol li) {
568 list-style: none;
569 }
570 .wpf_comment_container .popover .nav-tabs {
571 border-bottom: none;
572 }
573 .wpf_comment_container > .arrow {
574 width: .5rem !important;
575 height: 1rem !important;
576 border-style: none !important;
577 }
578 /* ------------ Custom Tagging ------------ */
579
580 .mfp-wrap .modal {
581 display: block;
582 }
583 button.wpf_upload_button:after {
584 content: none !important;
585 }
586 span.wpf_tag_name a {
587 margin-left: 5px;
588 color: var(--main-wpf-color) !important;
589 line-height: 0px !important;
590 }
591 .wpf_comment_container span.wpf_tag_name {
592 display: inline-flex;
593 background: #e2e4e7;
594 transition: all .2s cubic-bezier(.4, 1, .4, 1) !important;
595 margin-right: 5px;
596 margin-top: 5px;
597 border-radius: 12px;
598 padding: 0 4px 0 8px;
599 font-size: 12px;
600 align-items: center;
601 }
602 input.wpf_tag {
603 padding: initial;
604 width: 100%;
605 margin-bottom: 5px;
606 height: 40px;
607 box-shadow: none;
608 border-radius: 5px;
609 }
610 .wpf_icon_title {
611 display: block;
612 text-align: left;
613 color: var(--main-wpf-color);
614 font-weight: 700;
615 margin-top: 5px;
616 font-size: 12px;
617 letter-spacing: 0.015em;
618 line-height: 1.4;
619 margin-bottom: 5px;
620 }
621 div#wpf_share_page_btn .wpf_icon_title {
622 margin-top: 10px;
623 }
624 .wpf_tag_autocomplete input {
625 font-size: 12px !important;
626 font-family: inherit !important;
627 border-radius: 5px !important;
628 }
629 .wpf_tag_autocomplete {
630 position: relative !important;
631 }
632 .wpf_tag_autocomplete button {
633 position: absolute;
634 right: 10px;
635 top: 0px;
636 bottom: 0;
637 width: 24px;
638 margin-bottom: 0px;
639 height: 40px;
640 background-color: transparent !important;
641 opacity: 0.9;
642 cursor: pointer;
643 margin-top: 0px !important;
644 box-shadow: none !important;
645 }
646 .wpf_tag_autocomplete button i {
647 vertical-align: top;
648 position: absolute;
649 top: 10px;
650 right: 0px;
651 color: var(--main-wpf-color);
652 }
653 .wpf_comment_container button.wpf_tag_submit_btn:hover,
654 .wpf_comment_container button.wpf_tag_submit_btn:focus {
655 background: transparent !important;
656 }
657 .wpf_tag_autocomplete-items {
658 font-size: 12px;
659 border: 1px solid #dee2e6;
660 position: absolute;
661 background-color: #fff;
662 width: 100%;
663 top: 35px;
664 border-radius: 0px 0px 7px 7px;
665 cursor: pointer;
666 max-height: 115px;
667 overflow-y: auto;
668 z-index: 10000;
669 }
670 .wpf_tag_autocomplete-items div {
671 padding: 5px 15px;
672 -webkit-transition: all 0.2s ease-in;
673 -moz-transition: all 0.2s ease-in;
674 -ms-transition: all 0.2s ease-in;
675 -o-transition: all 0.2s ease-in;
676 transition: all 0.2s ease-in !important;
677 }
678 .wpf_tag_autocomplete-items div:hover {
679 background-color: #dee2e6;
680 font-weight: 700;
681 }
682 .wpf_tag_autocomplete-items .wpf_tag_autocomplete-active {
683 background-color: var(--main-wpf-color) !important;
684 color: #ffffff;
685 }
686 span.wpf_task_tag_more {
687 position: relative;
688 }
689 /* ------------ Share tab ------------ */
690
691 span.wpf_share_task_link {
692 color: rgba(0, 0, 0, 0.7);
693 font-size: 14px;
694 letter-spacing: 0.015em;
695 background-color: #d6fdd9;
696 padding: 4px 35px 5px 10px !important;
697 border: 1px solid #dee2e6;
698 border-radius: 5px;
699 display: flex;
700 line-height: 1.3;
701 max-height: 38px;
702 overflow: hidden;
703 text-align: left;
704 position: relative;
705 height: 38px;
706 box-sizing: border-box;
707 width: 100%;
708 align-content: stretch;
709 align-items: center;
710 margin-bottom: 5px;
711 }
712 a.wpf_copy_task_icon {
713 position: absolute;
714 right: 0;
715 top: 2px;
716 height: 35px;
717 width: 30px;
718 padding-left: 10px;
719 padding-top: 10px;
720 background-color: #d6fdd9;
721 box-sizing: border-box;
722 }
723 .wpf_success_wpf_share_link {
724 position: absolute;
725 bottom: -1px;
726 left: 0;
727 color: #fff;
728 font-size: 12px;
729 font-weight: 700;
730 letter-spacing: 0.015em;
731 background-color: #3ed696;
732 padding: 10px 5px 5px 10px !important;
733 border: 1px solid #dee2e6;
734 border-radius: 5px;
735 line-height: 1.3;
736 width: 100%;
737 height: 40px;
738 -webkit-transition: all 0.2s ease-out;
739 -moz-transition: all 0.2s ease-out;
740 -ms-transition: all 0.2s ease-out;
741 -o-transition: all 0.2s ease-out;
742 transition: all 0.2s ease-out !important;
743 -moz-box-sizing: border-box;
744 -webkit-box-sizing: border-box;
745 box-sizing: border-box;
746 }
747 .wpf_remove_login_box {
748 position: relative;
749 }
750 label.wpf_remove_login_label {
751 font-size: 12px !important;
752 color: #000 !important;
753 position: relative !important;
754 text-align: left;
755 }
756 input.wpf_remove_login_task_link {
757 width: 0 !important;
758 margin: 0 !important;
759 padding: 0 !important;
760 display: none !important;
761 }
762 label.wpf_remove_login_label:before {
763 content: '';
764 display: inline-block;
765 width: 15px;
766 height: 15px;
767 margin-bottom: -2px;
768 margin-right: 2px;
769 margin-left: 0;
770 border-radius: 3px;
771 border: 2px solid #363d4d !important;
772 opacity: 0.6;
773 transition: all .12s, border-color .08s !important;
774 box-sizing: content-box;
775 }
776 .wpf_remove_login_box input:checked + label:after {
777 content: '';
778 display: block;
779 position: absolute;
780 top: 3px;
781 left: 7px;
782 width: 5px;
783 height: 10px;
784 border: solid #363d4d;
785 border-width: 0 2px 2px 0;
786 transform: rotate(45deg);
787 box-sizing: content-box !important;
788 }
789 .wpf_wizard_modal label.wpf_remove_login_label:after {
790 top: 5px !important;
791 }
792 div#wpf_wizard_notifications input:checked + label:after {
793 top: 5px !important;
794 }
795
796 /* ------------ Item Circle ------------ */
797
798 .wpfb-point {
799 position: absolute!important;
800 overflow: hidden;
801 border-radius: 15% 50% 50% 50%;
802 border: 2px solid #fff!important;
803 text-decoration: none;
804 font-family: roboto,sans-serif;
805 font-weight: 500;
806 font-size: 12px !important;
807 box-shadow: 0 1px 3px rgb(0 0 0 / 50%);
808 width: 32px !important;
809 height: 32px !important;
810 line-height: 32px;
811 box-sizing: border-box;
812 vertical-align: middle;
813 text-align: center;
814 display: flex;
815 align-items: center;
816 justify-content: center;
817 color: #fff!important;
818 animation: wpfpulse 2s infinite!important;
819 z-index: 199997;
820 transition: background .35s ease,opacity .35s ease!important;
821 cursor: pointer;
822 background: rgb(54, 61, 77);
823 }
824 .wpfb-point:active,
825 .wpfb-point:focus {
826 opacity: 0.7 !important;
827 text-decoration: none;
828 }
829 .wpfb-point:hover {
830 opacity: 0.4 !important;
831 text-decoration: none;
832 }
833 .pending-review_custom {
834 background: #fcd227;
835 }
836 .in-progress_custom {
837 background: #ffa532;
838 }
839 .completed_custom {
840 background: #3ed696;
841 }
842 .low_custom {
843 background: #3ed696;
844 }
845 .medium_custom {
846 background: #fcd227;
847 }
848 .high_custom {
849 background: #ffa532;
850 }
851 .critical_custom {
852 background: #ff5a48;
853 }
854 .wpfb-point.complete .gg-check {
855 margin: 0;
856 z-index: 0px;
857 }
858 .open_custom .wpf_task_number {
859 background: #363d4d !important;
860 }
861 .pending-review_custom .wpf_task_number {
862 background: #fcd227 !important;
863 position: relative;
864 z-index: 0;
865 color: rgba(0,0,0,0.9) !important;;
866 }
867 .in-progress_custom .wpf_task_number {
868 background: #ffa532 !important;
869 position: relative;
870 z-index: 0;
871 }
872 .open_custom .low_custom,
873 .open_custom .medium_custom,
874 .open_custom .high_custom,
875 .open_custom .critical_custom,
876 .in-progress_custom .low_custom,
877 .in-progress_custom .medium_custom,
878 .in-progress_custom .high_custom,
879 .in-progress_custom .critical_custom,
880 .pending-review_custom .low_custom,
881 .pending-review_custom .medium_custom,
882 .pending-review_custom .high_custom,
883 .pending-review_custom .critical_custom,
884 .complete_custom .low_custom,
885 .complete_custom .medium_custom,
886 .complete_custom .high_custom,
887 .complete_custom .critical_custom {
888 border-radius: 50%;
889 position: absolute;
890 top: -10px;
891 right: -1px;
892 width: 12px;
893 height: 27px;
894 box-shadow: 0px 1px 11px #00000042;
895 transform: rotate(-44deg);
896 border: 0px;
897 display: block !important;
898 }
899
900 /* ------------ Chosen DIV Border ------------ */
901
902 .outer div {
903 position: absolute;
904 border-top: 2px dashed red;
905 z-index: 165000;
906 animation: wpfpulse 2s infinite !important;
907 }
908 .outer div:nth-child(3),
909 .outer div:nth-child(4) {
910 border-right: 2px dashed red;
911 animation: wpfpulse 2s infinite !important;
912 }
913 /* ------------ Floating Icon ------------ */
914
915 div#wpf_launcher {
916 position: fixed;
917 z-index: 214748365;
918 right: 0;
919 }
920 .logged-in #wpf_launcher {
921 top: 32px;
922 }
923 .wpf_start_comment {
924 display: block;
925 text-align: center;
926 padding: 7px 0px;
927 line-height: 1.2;
928 -webkit-transition: all 0.2s ease-in;
929 -moz-transition: all 0.2s ease-in;
930 -ms-transition: all 0.2s ease-in;
931 -o-transition: all 0.2s ease-in;
932 transition: all 0.2s ease-in !important;
933 }
934 .wpf_start_comment a {
935 color: #fff;
936 font-size: 10px;
937 line-height: 1.6;
938 padding: 15px;
939 display: block;
940 box-sizing: border-box;
941 }
942 .wpf_expand {
943 background-color: white;
944 font-size: 10px;
945 text-align: center;
946 font-family: 'Roboto', sans-serif;
947 display: block;
948 font-weight: 400;
949 -webkit-transition: all 0.2s ease-in;
950 -moz-transition: all 0.2s ease-in;
951 -ms-transition: all 0.2s ease-in;
952 -o-transition: all 0.2s ease-in;
953 transition: all 0.2s ease-in !important;
954 }
955 .wpf_expand:hover {} .wpf_expand a {
956 display: block;
957 min-height: 43px;
958 }
959 .wpf_expand img {
960 width: 100% !important;
961 padding: 10px;
962 }
963 .wpf_expand object {
964 width: 100%;
965 padding: 10px 15px;
966 pointer-events: none;
967 }
968 svg#wpf_icon path#wpf_exc_mark,
969 svg#wpf_icon circle#wpf_exc_circle {
970 fill: #363c4d;
971 }
972 svg#wpf_icon {
973 width: 100%;
974 padding: 8px 15px 6px 15px;
975 }
976 #wpf_expand_btn *, #wpf_launcher ::before, #wpf_launcher ::after {
977 box-sizing: border-box;
978 }
979 a.wpf_filter_tab_btn.cloud_dashboard_btn svg {
980 width: 20px !important;
981 display: block;
982 padding: 0px 0!important;
983 margin: auto;
984 height: 32px;
985 }
986 #wpf_launcher .wpf_sidebar_container .wpf_sidebar_header.wpf_col3 button,
987 #wpf_launcher button.wpf_tab_sidebar.wpf_thispage.wpf_active,
988 #wpf_launcher button.wpf_tab_sidebar.wpf_allpages.wpf_active,
989 #wpf_launcher button.wpf_tab_sidebar.wpf_backend.wpf_active,
990 #wpf_launcher button.wpf_tab_sidebar.wpf_frontend.wpf_active,
991 #wpf_launcher button.wpf_tab_sidebar {
992 box-shadow: none;
993 border-radius: 0 !important;
994 letter-spacing: 0px !important;
995 }
996 #wpf_launcher .wpf_launch_buttons {
997 position: fixed;
998 display: flex;
999 flex-wrap: wrap;
1000 align-items: center;
1001 width: 110px;
1002 height: 50px;
1003 padding: 0;
1004 margin: 0;
1005 right: 50px;
1006 border-radius: 5px 5px 0px 0px;
1007 overflow: hidden;
1008 box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
1009 }
1010
1011 #wpf_launcher .wpf_launch_buttons .wpf_start_comment,
1012 #wpf_launcher .wpf_launch_buttons .wpf_expand {
1013 width: 50px;
1014 height: 50px;
1015 display: flex;
1016 align-items: center;
1017 justify-content: center;
1018 padding: 0;
1019 margin: 0;
1020 }
1021 #wpf_launcher .wpf_launch_buttons .wpf_start_comment {
1022 background-color: var(--main-wpf-color) !important;
1023 width: 60px !important;
1024 }
1025 #wpf_launcher .wpf_launch_buttons .wpf_expand svg {
1026 height: 35px;
1027 width: auto;
1028 padding: 0;
1029 display: flex;
1030 }
1031 #wpf_launcher .wpf_launch_buttons .wpf_expand a {
1032 min-height: auto;
1033 }
1034 #wpf_launcher .wpf_launch_buttons .gg-math-plus {
1035 width: 30px;
1036 height: 6px;
1037 }
1038 #wpf_launcher .wpf_launch_buttons .gg-math-plus::after {
1039 height: 30px;
1040 width: 6px;
1041 top: -12px;
1042 left: 12px;
1043 }
1044 #wpf_launcher{
1045 opacity:0;
1046 }
1047 .wpf_launcher_loaded {
1048 opacity: 1 !important;
1049 -webkit-transition: all 0.5s ease-out;
1050 -moz-transition: all 0.5s ease-out;
1051 -ms-transition: all 0.5s ease-out;
1052 -o-transition: all 0.5s ease-out;
1053 transition: all 0.5s ease-out;
1054 }
1055 #wpf_enable_comment .wpf_bottom_left .message {
1056 color: #e54f6d;
1057 font-size: 12px;
1058 padding-left: 13px;
1059 display: flex;
1060 letter-spacing: 0.2px;
1061 font-weight: 700;
1062 }
1063
1064 /* ------------ Compact Mode ------------ */
1065
1066 .wpf-compact-launcher {
1067 position: fixed !important;
1068 cursor: pointer;
1069 z-index: 199998;
1070 right: 0 !important;
1071 top: 0;
1072 display: block;
1073 text-align: right;
1074 max-width: 380px;
1075 }
1076 .wpf-compact-launcher .wpf_launch_buttons {
1077 position: absolute !important;
1078 left: -56px !important;
1079 margin-top: 15vh !important;
1080 box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;
1081 border-radius: 7px 0px 0px 7px !important;
1082 overflow: hidden !important;
1083 width: 56px !important;
1084 height: 110px !important;
1085 -webkit-transition: all 0.3s ease-in;
1086 -moz-transition: all 0.3s ease-in;
1087 -ms-transition: all 0.3s ease-in;
1088 -o-transition: all 0.3s ease-in;
1089 transition: all 0.3s ease-in !important;
1090 }
1091 .wpf-compact-launcher .wpf_launch_buttons:not(.graphic_page_compact_buttons):hover {
1092 height: 210px !important;
1093 }
1094
1095 .wpf-compact-launcher .graphic_page_compact_buttons .wpf_general_comment {
1096
1097 top: 0px !important;
1098 }
1099 .wpf-compact-launcher .wpf_launch_buttons .wpf_start_comment {
1100 text-align: center;
1101 line-height: 1.2;
1102 height: 60px !important;
1103 -webkit-transition: all 0.2s ease-in;
1104 -moz-transition: all 0.3s ease-in;
1105 -ms-transition: all 0.3s ease-in;
1106 -o-transition: all 0.3s ease-in;
1107 transition: all 0.3s ease-in !important;
1108 }
1109 .wpf-compact-launcher .wpf_launch_buttons .wpf_start_comment a {
1110 padding: 15px 12px;
1111 }
1112 .wpf-compact-launcher .wpf_launch_buttons .wpf_expand {
1113 width: 60px !important;
1114 z-index: 2;
1115 }
1116 .wpf-compact-launcher .wpf_launch_buttons .wpf_general_comment {
1117 transform: rotate(-90deg);
1118 top: -60px;
1119 position: relative;
1120 z-index: -1;
1121 right: 18px;
1122 -webkit-transition: all 0.3s ease-in;
1123 -moz-transition: all 0.3s ease-in;
1124 -ms-transition: all 0.3s ease-in;
1125 -o-transition: all 0.3s ease-in;
1126 transition: all 0.3s ease-in !important;
1127 }
1128 .wpf-compact-launcher .wpf_launch_buttons .wpf_general_comment a {
1129 padding: 0px 13px !important;
1130 height: 100px !important;
1131 border-radius: 0 !important;
1132 margin-left: 0 !important;
1133 }
1134 .wpf-compact-launcher .wpf_launch_buttons:hover .wpf_general_comment {
1135 top: 0 !important;
1136 z-index: 1;
1137 }
1138 .wpf-compact-launcher-with-sidebar {
1139 width: 100%;
1140 right: 1.5rem !important;
1141 }
1142 .wpf-compact-launcher > .wpf_sidebar_container {
1143 z-index: 3;
1144 }
1145 .wpf_wizard_modal .wistia_responsive_padding {
1146 border-radius: 10px;
1147 overflow: hidden;
1148 }
1149 .rtl .wpf-compact-launcher .wpf_launch_buttons {
1150 left: 0px!important;
1151 right: 0px!important;
1152 }
1153
1154 .rtl .wpf-compact-launcher .wpf_launch_buttons .wpf_general_comment {
1155 right: -20px;
1156 }
1157 /* ------------ Chat Box ------------ */
1158
1159 .wpf_current_chat_box {
1160 max-height: 350px;
1161 overflow-y: auto;
1162 margin-bottom: 10px;
1163 border: 1px solid #dee2e6;
1164 padding: 10px;
1165 }
1166 .wpf_current_chat_box .task-author {
1167 display: block;
1168 }
1169 li.wpf_other {
1170 width: 95%;
1171 padding: 10px 0px !important;
1172 -webkit-animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
1173 animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
1174 color: #000000;
1175 }
1176 .wpf-comment-container {
1177 display: flex;
1178 flex-wrap: wrap;
1179 position: relative;
1180 color: #272d3c;
1181 font-size: 14px;
1182 word-wrap: break-word;
1183 width: 100%;
1184 line-height: 1.4;
1185 box-sizing: border-box;
1186 }
1187 .wpf_author:not(.is_info) .wpf-author-img, .wpf_other:not(.is_info) .wpf-author-img {
1188 min-width: 32px;
1189 height: 32px;
1190 width: 32px;
1191 border-radius: 50%;
1192 display: flex;
1193 align-items: center;
1194 justify-content: center;
1195 font-size: 12px;
1196 font-weight: 400;
1197 line-height: 1;
1198 color: #fff;
1199 text-transform: uppercase;
1200 background-color: rgb(103, 174, 63);
1201 }
1202 .wpf_author:not(.is_info) .wpf-author-img img, .wpf_other:not(.is_info) .wpf-author-img img {
1203 height: 32px;
1204 width: 32px;
1205 border-radius: 50%;
1206 margin: 0 !important;
1207 }
1208 .wpf_author.is_info .wpf-author-img img, .wpf_other.is_info .wpf-author-img img {
1209 -webkit-appearance: none !important;
1210 fill: none;
1211 color: #A4ABC5;
1212 width: 18px;
1213 height: 18px;
1214 margin-right: 5px;
1215 margin-top: 2px;
1216 }
1217 .wpf_author .wpf-comment-wrapper, .is_info .wpf-comment-wrapper {
1218 flex-grow: 1 !important;
1219 width: calc(100% - 40px);
1220 }
1221 .wpf_author:not(.is_info) .wpf-comment-wrapper {
1222 margin-left: 10px !important;
1223 width: calc(100% - 42px);
1224 overflow: hidden;
1225 }
1226 .wpf_other:not(.is_info) .wpf-comment-wrapper {
1227 flex-grow: 1 !important;
1228 width: calc(100% - 42px);
1229 overflow: hidden;
1230 }
1231 .wpf_other:not(.is_info) .wpf-comment-wrapper {
1232 margin-left: 10px !important;
1233 }
1234 li.wpf_author {
1235 padding: 5px 10px;
1236 width: 80%;
1237 margin-left: 10%;
1238 -webkit-animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
1239 animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
1240 list-style: none !important;
1241 color: #000000;
1242 }
1243 .chat_text {
1244 font-family: 'Roboto', sans-serif;
1245 margin-bottom: 10px;
1246 white-space: pre-wrap;
1247 cursor: auto;
1248 line-height: 1.4 !important;
1249 }
1250 .wpf_author:not(.is_info) .chat_text, .wpf_other:not(.is_info) .chat_text {
1251 margin-top: 5px;
1252 }
1253 .wpf_author.is_note .chat_text {
1254 border: 1px solid #FFFCC9 !important;
1255 background-color: #FFFCC9 !important;
1256 padding: 0 10px;
1257 border-radius: 5px 5px;
1258 }
1259 .wpf_note_html {
1260 color: #fff !important;
1261 padding: 0px 5px !important;
1262 font-family: Roboto, Helvetica, Arial, sans-serif !important;
1263 font-weight: 500 !important;
1264 font-size: 12px !important;
1265 margin-left: 5px !important;
1266 border-radius: 50px !important;
1267 background-color: #279af1 !important;
1268 }
1269 .wpf_current_chat_box .meassage_area_main img {
1270 overflow: hidden;
1271 width: auto !important;
1272 margin: auto;
1273 display: block;
1274 max-width: 100%;
1275 border-radius: 5px;
1276 -webkit-transition: all 0.3s ease-out;
1277 -moz-transition: all 1s ease-out;
1278 -ms-transition: all 1s ease-out;
1279 -o-transition: all 1s ease-out;
1280 transition: all 1s ease-out !important;
1281 }
1282
1283 .wpf_current_chat_box .meassage_area_main img:hover {
1284 box-shadow: 0 6px 24px 0 rgba(18, 43, 70, .12);
1285 }
1286 ul.wpf_current_chat_box:empty {
1287 display: none;
1288 }
1289 .wpfb-point.active_comment {
1290 pointer-events: none;
1291 }
1292 /* ------------ Sidebar ------------ */
1293
1294 .wpf_sidebar_container {
1295 width: 380px;
1296 max-width: 100vw !important;
1297 background-color: #fff;
1298 height: 100vh;
1299 position: relative;
1300 box-shadow: 0em 0em 1em 0em rgba(0, 0, 0, 0.1);
1301 font-size: 14px !important;
1302 line-height: 1.5 !important;
1303 letter-spacing: 0;
1304 margin: 0 -1px 0 0;
1305 right: 0;
1306 transition: 0.8s !important;
1307 display: flex !important;
1308 flex-direction: column;
1309 flex-wrap: nowrap;
1310 border-top: 3px solid var(--main-wpf-color) !important;
1311 }
1312 .logged-in .wpf_sidebar_container {
1313 height: calc(100vh - 32px);
1314 }
1315 .wpf_sidebar_container p {
1316 margin: 0 !important;
1317 }
1318 .wpf_sidebar_header {
1319 display: block;
1320 flex: 1;
1321 flex-grow: 0;
1322 padding: 0;
1323 background-color: #fff;
1324 }
1325 .wpf_sidebar_options {
1326 text-align: center;
1327 padding: 15px;
1328 flex: 1;
1329 flex-grow: 0;
1330 }
1331 .wpf_sidebar_filter.wpf_col2 div#container {
1332 overflow: hidden;
1333 margin-top: 0px;
1334 }
1335 .wpf_sidebar_container .wpf_filter_tab div#container .wpf_active {
1336 border: 1px solid #dee2e6;
1337 padding: 0 10px 10px;
1338 margin: 0;
1339 border-radius: 0 0 7px 7px;
1340 -webkit-animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
1341 animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
1342 }
1343 button.wpf_tab_sidebar {
1344 float: left;
1345 width: 33.33%;
1346 font-size: 14px !important;
1347 font-family: 'Roboto', sans-serif !important;
1348 background-color: #fff !important;
1349 color: #c0c1c5 !important;
1350 border-radius: 0 !important;
1351 border: none !important;
1352 outline: none !important;
1353 font-weight: 500;
1354 padding: 13px 0 !important;
1355 margin-right: 0;
1356 text-transform: none !important;
1357 text-decoration: none !important;
1358 margin-bottom: 0 !important;
1359 line-height: normal;
1360 min-width: auto !important;
1361 outline: none !important;
1362 cursor: pointer !important;
1363 }
1364 button.wpf_tab_sidebar.wpf_thispage.wpf_active,
1365 button.wpf_tab_sidebar.wpf_allpages.wpf_active,
1366 button.wpf_tab_sidebar.wpf_backend.wpf_active,
1367 button.wpf_tab_sidebar.wpf_frontend.wpf_active {
1368 background-color: #fff!important;
1369 border-radius: 7px 7px 0 0;
1370 }
1371 .wpf_filter_tab {
1372 padding: 8px 10px;
1373 }
1374 #wpf_launcher .wpf_general_task_thispage {
1375 float: right;
1376 color: var(--main-wpf-color) !important;
1377 background-color: #dee2e6;
1378 font-weight: 700;
1379 padding: 7px 10px 5px 5px;
1380 border-radius: 50px;
1381 transition: all 0.2s ease-in !important;
1382 }
1383 #wpf_launcher .wpf_general_task_thispage:hover {
1384 color: #fff !important;
1385 background-color: var(--main-wpf-color) !important;
1386 }
1387 a.wpf_general_task_thispage i.fa.fa-plus-circle {
1388 font-size: 18px;
1389 margin: -4px 5px 0px 0px !important;
1390 display: inline-block;
1391 vertical-align: middle;
1392 }
1393 #wpf_launcher a.wpf_filter_tab_btn {
1394 float: left;
1395 text-align: center;
1396 border: 1px solid transparent;
1397 border-top-left-radius: 7px;
1398 border-top-right-radius: 7px;
1399 font-size: 16px;
1400 color: var(--main-wpf-color) !important;
1401 background-color: transparent;
1402 height: 35px;
1403 width: 32px !important;
1404 line-height: 2;
1405 opacity: 0.3;
1406 outline: none;
1407 margin-bottom: -1px;
1408 transition: all 0.2s ease-in !important;
1409 display: flex;
1410 flex-direction: row;
1411 flex-wrap: nowrap;
1412 justify-content: flex-start;
1413 align-content: stretch;
1414 align-items: center;
1415 }
1416 #wpf_launcher a.wpf_filter_tab_btn:hover {
1417 opacity: 1;
1418 }
1419 #wpf_launcher a.cloud_dashboard_btn {
1420 display: block;
1421 width: 30px;
1422 padding: 0;
1423 }
1424 #wpf_launcher a.cloud_dashboard_btn object {
1425 pointer-events: none;
1426 width: 20px;
1427 margin-top: 6px;
1428 }
1429 a.wpf_filter_tab_btn.wpf_active {
1430 color: var(--main-wpf-color) !important;
1431 z-index: 10;
1432 position: relative;
1433 background-color: #fff;
1434 border-color: #dee2e6 #dee2e6 #fff !important;
1435 opacity: 1 !important;
1436 }
1437 .wpf_sidebar_content {
1438 overflow-y: auto;
1439 overflow-x: hidden;
1440 flex: 1;
1441 flex-grow: 1;
1442 padding-bottom: 60px !important;
1443 }
1444 .wpf_sidebar_footer {
1445 background-color: #dee2e6;
1446 text-align: center;
1447 font-size: 12px;
1448 flex: 1;
1449 flex-grow: 0;
1450 }
1451 .wpf_sidebar_footer img {
1452 max-width: 100px;
1453 max-height: 24px;
1454 margin: -5px 2px -7px 2px;
1455 display: inline-block;
1456 -webkit-transition: all 0.2s ease-in;
1457 -moz-transition: all 0.2s ease-in;
1458 -ms-transition: all 0.2s ease-in;
1459 -o-transition: all 0.2s ease-in;
1460 transition: all 0.2s ease-in !important;
1461 }
1462 .wpf_sidebar_footer:hover img {
1463 max-width: 110px;
1464 max-height: 30px;
1465 margin: -10px -6px -8px 0px;
1466 }
1467 .wpf_sidebar_footer a {
1468 display: block;
1469 padding: 14px;
1470 color: var(--main-wpf-color) !important;
1471 }
1472 .wpf_sidebar_footer a:hover {
1473 color: var(--main-wpf-color) !important;
1474 }
1475 .wpf_sidebar_footer span {
1476 font-size: 15px;
1477 font-weight: 700;
1478 }
1479 .wpf_task_pagename {
1480 font-weight: 400;
1481 font-family: 'Roboto', sans-serif;
1482 margin-top: 0;
1483 margin-bottom: 4px;
1484 font-size: 14px;
1485 color: #565c6b;
1486 line-height: 1.4 !important;
1487 }
1488 .wpf_hide,
1489 .wpfb-point.complete,
1490 .wpf_general_hide {
1491 display: none;
1492 }
1493 a.wpfb-point.complete {
1494 background-color: #3ed696 !important;
1495 line-height: 31px;
1496 color: rgba(0,0,0,0.9) !important;
1497 }
1498
1499 #wpf_enable_comment p {
1500 display: inline-block;
1501 margin: 0 15px 0 0;
1502 }
1503
1504 .wpf_sidebar_dashboard svg {
1505 margin-left: 5px;
1506 }
1507 .wpfb_screenshot_class:before {
1508 content: "";
1509 width: 150px;
1510 height: 150px;
1511 background-size: contain;
1512 background-color: #fff;
1513 position: fixed;
1514 left: calc(50% - 75px);
1515 top: calc(50vh - 75px)
1516 }
1517 .wpfb_screenshot_class {
1518 background-color: transparent !important;
1519 -webkit-animation: appear 1s ease 1s 1 normal both;
1520 animation: appear 1s ease 1s 1 normal both !important;
1521 }
1522 .popover.fade.show {
1523 opacity: 1 !important;
1524 }
1525 @-webkit-keyframes appear {
1526 0% {
1527 opacity: 1;
1528 }
1529 100% {
1530 opacity: 0;
1531 }
1532 }
1533 @keyframes appear {
1534 0% {
1535 opacity: 1;
1536 }
1537 100% {
1538 opacity: 0;
1539 }
1540 }
1541 .popover a:hover,
1542 .popover a:active,
1543 .popover a:focus {
1544 outline: none !important;
1545 }
1546 .wpf_sidebar_container ul {
1547 padding: 0;
1548 }
1549 li.current_page_task, li.current_page_general_task {
1550 list-style: none;
1551 align-items: flex-start;
1552 display: flex;
1553 position: relative;
1554 margin-left: 0;
1555 padding: 10px 0;
1556 transition: 0.2s !important;
1557 background-color: transparent;
1558 outline: none !important;
1559 margin-bottom: 0 !important;
1560 margin-top: 0 !important;
1561 border-bottom: 1px solid #eeeeee;
1562 cursor: pointer;
1563 text-align: left;
1564 justify-content: space-between;
1565 }
1566
1567 .wpf_thispage_tab .wpf_task_number:hover{
1568 background-color: #e54f6d !important;
1569 color: #e54f6d !important;
1570 }
1571 .wpf_thispage_tab .wpf_task_number:before {
1572 content: "";
1573 box-sizing: border-box;
1574 display: block;
1575 transform: scale(var(--ggs, 1));
1576 width: 5px;
1577 height: 5px;
1578 border: 2px solid;
1579 border-radius: 100px;
1580 position: absolute;
1581 color: #fff;
1582 transition: all 0.2s ease-in !important;
1583 opacity: 0;
1584 z-index: 1;
1585 }
1586 .wpf_thispage_tab .wpf_task_number:hover:before {
1587 opacity: 1;
1588 }
1589 .wpf_thispage_tab .wpf_task_number:after {
1590 content: "";
1591 display: block;
1592 box-sizing: border-box;
1593 position: absolute;
1594 width: 11px;
1595 height: 11px;
1596 box-shadow: -5px -5px 0 -3px, 5px 5px 0 -3px, 5px -5px 0 -3px, -5px 5px 0 -3px;
1597 transform: rotate(0deg);
1598 color: #fff;
1599 transition: all 0.2s ease-in !important;
1600 opacity: 0;
1601 z-index: 1;
1602 }
1603 .wpf_thispage_tab .wpf_task_number:hover:after {
1604 transform: rotate(45deg);
1605 opacity: 1;
1606 }
1607 .wpf_task_sum {
1608 display: inline-block;
1609 vertical-align: top;
1610 margin-left: 10px;
1611 width: calc(100% - 45px);
1612 text-align: left;
1613 color: #4B4B4B;
1614 font-size: 15px;
1615 font-family: 'Roboto', sans-serif;
1616 transition: all 0.2s ease-in !important;
1617 }
1618 level.task-author {
1619 font-size: 13px;
1620 color: #363d4d;
1621 vertical-align: top;
1622 display: block;
1623 font-weight: 500;
1624 text-transform: capitalize;
1625 }
1626 level.task-author span {
1627 font-weight: 400;
1628 margin: 0 5px;
1629 display: inline-block;
1630 color: #bebebe;
1631 }
1632 #wpf_thispage level.task-author {
1633 display: block;
1634 }
1635 #wpf_backend level.task-author {
1636 margin-bottom: 5px;
1637 }
1638 .note-tooltip {
1639 height: 12px;
1640 width: 12px;
1641 border: 1px solid #e54f6d;
1642 border-radius: 15px;
1643 background-color: #e54f6d !important;
1644 text-align: center;
1645 vertical-align: middle;
1646 font-size: 11px;
1647 line-height: 12px;
1648 font-weight: 700 !important;
1649 color: #ffffff !important;
1650 }
1651 .note-tooltip:before {
1652 position : absolute;
1653 content : attr(data-note-tooltip);
1654 font-size: 13px;
1655 font-weight: 400;
1656 line-height: 18px;
1657 top: 30px;
1658 display: none;
1659 text-align: left;
1660 left: 0;
1661 text-transform: initial;
1662 background: #fff;
1663 color: #e54f6d;
1664 }
1665 .note-tooltip:hover:before {
1666 padding: 10px;
1667 box-shadow: 0em 0em 1em 0em rgb(0 0 0 / 10%);
1668 display: block;
1669 }
1670 input#wpf_display_all_taskmeta {
1671 height: 0;
1672 }
1673 input#wpf_display_all_taskmeta:before {
1674 content: '';
1675 display: inline-block;
1676 width: 15px;
1677 height: 15px;
1678 margin-bottom: -2px;
1679 margin-right: 2px;
1680 margin-left: 0;
1681 border-radius: 3px;
1682 border: 2px solid #363d4d !important;
1683 opacity: 0.6;
1684 transition: all .12s, border-color .08s !important;
1685 }
1686 input#wpf_display_all_taskmeta:checked:after {
1687 content: '';
1688 display: block;
1689 position: absolute;
1690 top: 0px;
1691 left: 0px;
1692 width: 5px;
1693 height: 8px;
1694 border: solid #363d4d;
1695 border-width: 0 2px 2px 0;
1696 transform: rotate(45deg);
1697 }
1698 .wpf_task_meta {
1699 display: inline-block;
1700 vertical-align: top;
1701 transition: all 0.2s ease-in !important;
1702 opacity: 0.5;
1703 margin-top: -10px;
1704 position: absolute;
1705 right: 0;
1706 background-color: transparent;
1707 box-shadow: none;
1708 padding: 0 5px;
1709 height: 120%;
1710 text-align: right;
1711 }
1712 .wpf_task_meta:hover,
1713 .wpf_task_meta.wpf_active {
1714 opacity: 1;
1715 right: -5px;
1716 background-color: rgba(255, 255, 255, 0.9);
1717 }
1718 .wpf_task_meta_icon {
1719 display: inline-block;
1720 color: var(--main-wpf-color) !important;
1721 vertical-align: top;
1722 font-size: 14px;
1723 padding: 15px 10px;
1724 opacity: 1;
1725 transition: all 0.2s ease-in !important;
1726 height: 100%;
1727 position: absolute;
1728 right: 0;
1729 }
1730 .wpf_task_meta:hover > .wpf_task_meta_icon,
1731 .wpf_task_meta.wpf_active .wpf_task_meta_icon {
1732 opacity: 0;
1733 z-index: 0;
1734 }
1735 .wpf_task_meta_details {
1736 display: inline-block;
1737 vertical-align: middle;
1738 margin-right: -100px;
1739 transition: all 0.2s ease-in !important;
1740 overflow: hidden;
1741 opacity: 0;
1742 padding: 5px;
1743 position: relative;
1744 }
1745 .wpf_task_meta:hover > .wpf_task_meta_details,
1746 .wpf_task_meta.wpf_active .wpf_task_meta_details {
1747 margin-right: 0;
1748 opacity: 1;
1749 z-index: 100;
1750 }
1751 span.wpf_task_type {
1752 background-color: #279af1 !important;
1753 color: #fff;
1754 font-size: 10px;
1755 font-weight: 500;
1756 text-transform: uppercase;
1757 padding: 2px 3px;
1758 border-radius: 15px;
1759 display: inline-block;
1760 margin-bottom: 2px !important;
1761 line-height: 1.1;
1762 letter-spacing: 0;
1763 vertical-align: top;
1764 margin-right: 5px;
1765 }
1766 .wpf_task_label {
1767 margin-top: -1px;
1768 }
1769 .wpf_task_label span {
1770 width: 18px;
1771 height: 18px;
1772 text-align: center;
1773 border-radius: 50%;
1774 color: #fff;
1775 margin: 1px 1px 0px 1px;
1776 font-weight: 100;
1777 display: inline-block;
1778 font-size: 10px;
1779 line-height: 1.9;
1780 }
1781 span.task_status {
1782 width: 17px;
1783 height: 17px;
1784 }
1785 span.wpf_task_tag,
1786 span.wpf_task_tag_more {
1787 background-color: #dee2e6;
1788 font-size: 11px;
1789 padding: 2px 5px;
1790 border-radius: 15px;
1791 margin-right: 2px;
1792 }
1793 span.wpf_task_tag:last-child,
1794 span.wpf_task_tag_more:last-child {
1795 margin-right: 0px;
1796 }
1797 .tab-pane ul {
1798 margin: 0;
1799 padding: 0;
1800 }
1801 .current_page_task_list {
1802 line-height: 1.2 !important;
1803 white-space: normal;
1804 font-size: 14px !important;
1805 color: #89879f !important;
1806 max-width: 90%;
1807 overflow: hidden;
1808 text-overflow: ellipsis;
1809 display: -webkit-box;
1810 -webkit-line-clamp: 3;
1811 -webkit-box-orient: vertical;
1812 }
1813 #wpf_already_comment p.wpf_btn,
1814 #pushed_to_media p.wpf_btn,
1815 #wpf_reconnecting_task p.wpf_btn {
1816 margin: 0;
1817 }
1818 div#wpf_already_comment,
1819 div#pushed_to_media,
1820 div#wpf_reconnecting_task,
1821 div#wpf_reconnecting_enabled {
1822 position: fixed;
1823 margin: auto;
1824 color: #333 !important;
1825 border-radius: 6px;
1826 font-size: 14px;
1827 text-align: left;
1828 padding: 10px 25px;
1829 font-family: 'Roboto', sans-serif;
1830 font-weight: 700;
1831 top: 50px;
1832 left: 25px;
1833 max-width: 95%;
1834 z-index: 199999;
1835 opacity: 1;
1836 width: 350px;
1837 background-color: #3ed696;
1838 line-height: 1.5;
1839 letter-spacing: 0.02em;
1840 box-shadow: 0em 0em 1em 0.1em rgba(0, 0, 0, 0.2);
1841 }
1842 .wpf_notice_text {
1843 font-weight: 400;
1844 }
1845 .wpf-notice-unsafe {
1846 position: unset;
1847 }
1848 .wpf_sidebar_generaltask a {
1849 width: 100%;
1850 display: inline-block;
1851 background-color: var(--main-wpf-color) !important;
1852 padding: 10px;
1853 border-radius: 7px;
1854 color: #fff !important;
1855 font-size: 14px;
1856 font-weight: bold;
1857 transition: 0.5s !important;
1858 margin-bottom: 10px;
1859 text-decoration: none !important;
1860 }
1861 .wpf_sidebar_generaltask a:hover {
1862 opacity: 0.8;
1863 }
1864 .wpf_sidebar_dashboard a {
1865 width: 100%;
1866 display: inline-block;
1867 background-color: #efefef;
1868 padding: 10px;
1869 border-radius: 7px;
1870 color: var(--main-wpf-color) !important;
1871 font-size: 14px;
1872 font-weight: bold;
1873 transition: 0.5s !important;
1874 }
1875 .wpf_sidebar_dashboard:hover a {
1876 background-color: #d6d6d6;
1877 }
1878 .wpf_sidebar_dashboard i {
1879 margin-left: 5px;
1880 font-size: 18px;
1881 }
1882 .wpf_sidebar_checkboxes input[type=checkbox] {
1883 display: none;
1884 }
1885 .wpf_sidebar_checkboxes input[type="checkbox"] + label:before {
1886 content: '';
1887 display: inline-block;
1888 width: 15px;
1889 height: 15px;
1890 margin-bottom: -2px;
1891 margin-right: 5px;
1892 margin-left: -5px;
1893 border-radius: 3px;
1894 border: 2px solid #363d4d !important;
1895 opacity: 0.6;
1896 transition: all .12s, border-color .08s !important;
1897 }
1898 .wpf_sidebar_checkboxes input[type="checkbox"]:checked + label:after {
1899 content: '';
1900 display: block;
1901 position: absolute;
1902 top: 0px;
1903 left: 0px;
1904 width: 3px;
1905 height: 7px;
1906 border: solid #363d4d;
1907 border-width: 0 2px 2px 0;
1908 transform: rotate(45deg);
1909 box-sizing: content-box !important;
1910 }
1911 div#wpf_task_visibility input[type="checkbox"]:checked + label:after {
1912 top: 2px;
1913 left: 7.5px;
1914 width: 5px;
1915 height: 12px;
1916 }
1917 label.wpf_visibility_title {
1918 display: block;
1919 text-align: left;
1920 color: #4a5568;
1921 /*font-weight: 700;*/
1922 margin-top: 10px;
1923 font-size: 12px;
1924 margin-bottom: 0;
1925 }
1926
1927 .wpf_display_all_taskmeta_div.wpf_sidebar_checkboxes {
1928 width: 100%;
1929 padding-left: 7px;
1930 display: block;
1931 float: none;
1932 margin-top: 0;
1933 }
1934 .wpf_sidebar_checkboxes label {
1935 font-size: 12px;
1936 text-align: left;
1937 position: relative;
1938 margin: 0 !important;
1939 }
1940 .wpf_start_comment a.active_comment i {
1941 -moz-transform: rotate(45deg);
1942 -webkit-transform: rotate(45deg);
1943 -o-transform: rotate(45deg);
1944 -ms-transform: rotate(45deg);
1945 transform: rotate(45deg);
1946 }
1947 .wpf_task_label .wpf_pending-review,
1948 .wpf_task_label .wpf_medium {
1949 background-color: #fcd227;
1950 }
1951 .wpf_task_label .wpf_high,
1952 .wpf_task_label .wpf_in-progress {
1953 background-color: #ffa532;
1954 }
1955 .wpf_task_label .wpf_complete,
1956 .wpf_task_label .wpf_low {
1957 background-color: #3ed696;
1958 }
1959 .wpf_task_label .wpf_open,
1960 .wpf_task_label .wpf_critical {
1961 background-color: #ff5a48;
1962 }
1963 #wpf_tasks span.wpf_tag_name {
1964 display: inline-flex;
1965 background: #e2e4e7;
1966 transition: all .2s cubic-bezier(.4, 1, .4, 1) !important;
1967 margin-right: 5px;
1968 border-radius: 12px;
1969 padding: 5px 8px;
1970 font-size: 14px;
1971 margin-bottom: 5px;
1972 }
1973 /*------sidebar-New Desing css Start------*/
1974
1975 .top_tabs {
1976 width: 230px;
1977 }
1978 .logged-in .wpf_sidebar_container {
1979 padding-bottom: 70px;
1980 }
1981
1982 .wpf_sidebar_container ul {
1983 width: calc(100% - 40px);
1984 margin: 0 auto;
1985 }
1986
1987 .wpf_sidebar_container ul li .wpf_task_sum {
1988 margin-left: 0;
1989 }
1990 .wpf_sidebar_container ul li:hover level.task-author {
1991 color: #279af1;
1992 }
1993 .wpf_sidebar_container .wpf_sidebar_header button.wpf_tab_sidebar.wpf_active {
1994 color: #279af1 !important;
1995 border-bottom: 2px solid #279af1;
1996 }
1997 .wpf_sidebar_container .wpf_sidebar_header button.wpf_tab_sidebar:hover {
1998 color: #279af1 !important;
1999 }
2000 .wpf_sidebar_container .wpf_sidebar_header {
2001 box-shadow: 1px 0 15px rgba(0, 0, 0, 0.20);
2002 padding-right: 40px;
2003 position: relative;
2004 display: flex;
2005 justify-content: space-around;
2006 align-items: center;
2007 }
2008 .wpf_sidebar_container ul li .wpf_task_pagename,
2009 .wpf_sidebar_container ul li .task-author {
2010 margin-bottom: 5px;
2011 }
2012 .wpf_sidebar_container .wpf_filter_tab,
2013 .wpf_sidebar_container ul .wpf_task_meta {
2014 display: none;
2015 }
2016 .custom_today,
2017 .custom_yesterday,
2018 .custom_Weekly,
2019 .custom_this_month,
2020 .custom_year,
2021 .custom_other {
2022 background: #ecf3f9;
2023 text-align: left;
2024 padding: 0 20px;
2025 text-transform: uppercase;
2026 font-weight: 400;
2027 color: #363d4d;
2028 font-family: 'Roboto', sans-serif;
2029 display: flex;
2030 align-items: center;
2031 height: 30px;
2032 font-size: 13px;
2033 }
2034
2035 ul#wpf_thispage_container_today > li:first-child {
2036 margin-top: 31px !important;
2037 }
2038
2039 ul#wpf_thispage_container_today > li:first-child:before {
2040 content: "TODAY";
2041 display: block;
2042 font-weight: 500;
2043 font-family: 'Roboto', sans-serif;
2044 width: calc(100% + 40px);
2045 background-color: #ecf3f9;
2046 position: absolute;
2047 top: -31px;
2048 padding: 5px 20px;
2049 left: -20px;
2050 right: -20px;
2051 }
2052
2053 ul#wpf_thispage_container_yesterday > li:first-child {
2054 margin-top: 31px !important;
2055 }
2056
2057 ul#wpf_thispage_container_yesterday > li:first-child:before, .wpf_sidebar_content .sidebar_list_header:before {
2058 content: "YESTERDAY";
2059 display: block;
2060 font-weight: 500;
2061 font-family: 'Roboto', sans-serif;
2062 width: calc(100% + 40px);
2063 background-color: #ecf3f9;
2064 position: absolute;
2065 top: -31px;
2066 padding: 5px 20px;
2067 left: -20px;
2068 right: -20px;
2069 }
2070
2071 ul#wpf_thispage_container_this_week > li:first-child {
2072 margin-top: 31px !important;
2073 }
2074
2075 ul#wpf_thispage_container_this_week > li:first-child:before {
2076 content: "THIS WEEK";
2077 display: block !important;
2078 font-weight: 500;
2079 font-family: 'Roboto', sans-serif;
2080 width: calc(100% + 40px) !important;
2081 background-color: #ecf3f9;
2082 position: absolute;
2083 top: -31px;
2084 padding: 5px 20px;
2085 left: -20px;
2086 right: -20px;
2087 }
2088
2089 ul#wpf_thispage_container_this_month > li:first-child {
2090 margin-top: 31px !important;
2091 }
2092
2093 ul#wpf_thispage_container_this_month > li:first-child:before {
2094 content: "THIS MONTH";
2095 display: block !important;
2096 font-weight: 500;
2097 font-family: 'Roboto', sans-serif;
2098 width: calc(100% + 40px) !important;
2099 background-color: #ecf3f9;
2100 position: absolute;
2101 top: -31px;
2102 padding: 5px 20px;
2103 left: -20px;
2104 right: -20px;
2105 }
2106
2107 ul#wpf_thispage_container_year > li:first-child {
2108 margin-top: 31px !important;
2109 }
2110
2111 ul#wpf_thispage_container_year > li:first-child:before {
2112 content: "THIS YEAR";
2113 display: block !important;
2114 font-weight: 500;
2115 font-family: 'Roboto', sans-serif;
2116 width: calc(100% + 40px) !important;
2117 background-color: #ecf3f9;
2118 position: absolute;
2119 top: -31px;
2120 padding: 5px 20px;
2121 left: -20px;
2122 right: -20px;
2123 }
2124
2125 ul#wpf_thispage_container_other > li:first-child {
2126 margin-top: 31px !important;
2127 }
2128
2129 ul#wpf_thispage_container_other > li:first-child:before {
2130 content: "OTHER";
2131 font-weight: 500;
2132 font-family: 'Roboto', sans-serif;
2133 display: block !important;
2134 width: calc(100% + 40px) !important;
2135 background-color: #ecf3f9;
2136 position: absolute;
2137 top: -31px;
2138 padding: 5px 20px;
2139 left: -20px;
2140 right: -20px;
2141 }
2142
2143 ul#wpf_allpages_container_today > li:first-child {
2144 margin-top: 31px !important;
2145 }
2146
2147 ul#wpf_allpages_container_today > li:first-child:before {
2148 content: "TODAY";
2149 display: block;
2150 font-weight: 500;
2151 font-family: 'Roboto', sans-serif;
2152 width: calc(100% + 40px);
2153 background-color: #ecf3f9;
2154 position: absolute;
2155 top: -31px;
2156 padding: 5px 20px;
2157 left: -20px;
2158 right: -20px;
2159 }
2160
2161 ul#wpf_allpages_container_yesterday > li:first-child {
2162 margin-top: 31px !important;
2163 }
2164
2165 ul#wpf_allpages_container_yesterday > li:first-child:before {
2166 content: "YESTERDAY";
2167 display: block;
2168 font-weight: 500;
2169 font-family: 'Roboto', sans-serif;
2170 width: calc(100% + 40px);
2171 background-color: #ecf3f9;
2172 position: absolute;
2173 top: -31px;
2174 padding: 5px 20px;
2175 left: -20px;
2176 right: -20px;
2177 }
2178
2179 ul#wpf_allpages_container_this_week > li:first-child {
2180 margin-top: 31px !important;
2181 }
2182
2183 ul#wpf_allpages_container_this_week > li:first-child:before {
2184 content: "THIS WEEK";
2185 display: block;
2186 font-weight: 500;
2187 font-family: 'Roboto', sans-serif;
2188 width: calc(100% + 40px);
2189 background-color: #ecf3f9;
2190 position: absolute;
2191 top: -31px;
2192 padding: 5px 20px;
2193 left: -20px;
2194 right: -20px;
2195 }
2196
2197 ul#wpf_allpages_container_this_month > li:first-child {
2198 margin-top: 31px !important;
2199 }
2200
2201 ul#wpf_allpages_container_this_month > li:first-child:before {
2202 content: "THIS MONTH";
2203 display: block;
2204 font-weight: 500;
2205 font-family: 'Roboto', sans-serif;
2206 width: calc(100% + 40px);
2207 background-color: #ecf3f9;
2208 position: absolute;
2209 top: -31px;
2210 padding: 5px 20px;
2211 left: -20px;
2212 right: -20px;
2213 }
2214
2215 ul#wpf_allpages_container_year > li:first-child {
2216 margin-top: 31px !important;
2217 }
2218
2219 ul#wpf_allpages_container_year > li:first-child:before {
2220 content: "THIS YEAR";
2221 display: block;
2222 font-weight: 500;
2223 font-family: 'Roboto', sans-serif;
2224 width: calc(100% + 40px);
2225 background-color: #ecf3f9;
2226 position: absolute;
2227 top: -31px;
2228 padding: 5px 20px;
2229 left: -20px;
2230 right: -20px;
2231 }
2232
2233
2234 ul#wpf_allpages_container_other > li:first-child {
2235 margin-top: 31px !important;
2236 }
2237
2238 ul#wpf_allpages_container_other > li:first-child:before {
2239 content: "OTHER";
2240 display: block;
2241 font-weight: 500;
2242 font-family: 'Roboto', sans-serif;
2243 width: calc(100% + 40px);
2244 background-color: #ecf3f9;
2245 position: absolute;
2246 top: -31px;
2247 padding: 5px 20px;
2248 left: -20px;
2249 right: -20px;
2250 }
2251
2252 ul#wpf_backend_container_today > li:first-child {
2253 margin-top: 31px !important;
2254 }
2255
2256 ul#wpf_backend_container_today > li:first-child:before {
2257 content: "TODAY";
2258 display: block;
2259 font-weight: 500;
2260 font-family: 'Roboto', sans-serif;
2261 width: calc(100% + 40px);
2262 background-color: #ecf3f9;
2263 position: absolute;
2264 top: -31px;
2265 padding: 5px 20px;
2266 left: -20px;
2267 right: -20px;
2268 }
2269
2270 ul#wpf_backend_container_yesterday > li:first-child {
2271 margin-top: 31px !important;
2272 }
2273
2274 ul#wpf_backend_container_yesterday > li:first-child:before {
2275 content: "YESTERDAY";
2276 display: block;
2277 font-weight: 500;
2278 font-family: 'Roboto', sans-serif;
2279 width: calc(100% + 40px);
2280 background-color: #ecf3f9;
2281 position: absolute;
2282 top: -31px;
2283 padding: 5px 20px;
2284 left: -20px;
2285 right: -20px;
2286 }
2287
2288 ul#wpf_backend_container_this_week > li:first-child {
2289 margin-top: 31px !important;
2290 }
2291
2292 ul#wpf_backend_container_this_week > li:first-child:before {
2293 content: "THIS WEEK";
2294 display: block;
2295 font-weight: 500;
2296 font-family: 'Roboto', sans-serif;
2297 width: calc(100% + 40px);
2298 background-color: #ecf3f9;
2299 position: absolute;
2300 top: -31px;
2301 padding: 5px 20px;
2302 left: -20px;
2303 right: -20px;
2304 }
2305
2306 ul#wpf_backend_container_this_month > li:first-child {
2307 margin-top: 31px !important;
2308 }
2309
2310 ul#wpf_backend_container_this_month > li:first-child:before {
2311 content: "THIS MONTH";
2312 display: block;
2313 font-weight: 500;
2314 font-family: 'Roboto', sans-serif;
2315 width: calc(100% + 40px);
2316 background-color: #ecf3f9;
2317 position: absolute;
2318 top: -31px;
2319 padding: 5px 20px;
2320 left: -20px;
2321 right: -20px;
2322 }
2323
2324 ul#wpf_backend_container_year > li:first-child {
2325 margin-top: 31px !important;
2326 }
2327
2328 ul#wpf_backend_container_year > li:first-child:before {
2329 content: "YEAR";
2330 display: block;
2331 font-weight: 500;
2332 font-family: 'Roboto', sans-serif;
2333 width: calc(100% + 40px);
2334 background-color: #ecf3f9;
2335 position: absolute;
2336 top: -31px;
2337 padding: 5px 20px;
2338 left: -20px;
2339 right: -20px;
2340 }
2341
2342 ul#wpf_backend_container_other > li:first-child {
2343 margin-top: 31px !important;
2344 }
2345
2346 ul#wpf_backend_container_other > li:first-child:before {
2347 content: "OTHER";
2348 display: block;
2349 font-weight: 500;
2350 font-family: 'Roboto', sans-serif;
2351 width: calc(100% + 40px);
2352 background-color: #ecf3f9;
2353 position: absolute;
2354 top: -31px;
2355 padding: 5px 20px;
2356 left: -20px;
2357 right: -20px;
2358 }
2359 ul#wpf_backend_container_today > li:first-child {
2360 margin-top: 31px !important;
2361 }
2362
2363 ul#wpf_backend_container_today > li:first-child:before {
2364 content: "TODAY";
2365 display: block;
2366 font-weight: 500;
2367 font-family: 'Roboto', sans-serif;
2368 width: calc(100% + 40px);
2369 background-color: #ecf3f9;
2370 position: absolute;
2371 top: -31px;
2372 padding: 5px 20px;
2373 left: -20px;
2374 right: -20px;
2375 }
2376
2377 ul#wpf_backend_container_yesterday > li:first-child {
2378 margin-top: 31px !important;
2379 }
2380
2381 ul#wpf_backend_container_yesterday > li:first-child:before {
2382 content: "YESTERDAY";
2383 display: block;
2384 font-weight: 500;
2385 font-family: 'Roboto', sans-serif;
2386 width: calc(100% + 40px);
2387 background-color: #ecf3f9;
2388 position: absolute;
2389 top: -31px;
2390 padding: 5px 20px;
2391 left: -20px;
2392 right: -20px;
2393 }
2394
2395 ul#wpf_backend_container_this_week > li:first-child {
2396 margin-top: 31px !important;
2397 }
2398
2399 ul#wpf_backend_container_this_week > li:first-child:before {
2400 content: "THIS WEEK";
2401 display: block;
2402 font-weight: 500;
2403 font-family: 'Roboto', sans-serif;
2404 width: calc(100% + 40px);
2405 background-color: #ecf3f9;
2406 position: absolute;
2407 top: -31px;
2408 padding: 5px 20px;
2409 left: -20px;
2410 right: -20px;
2411 }
2412
2413 ul#wpf_backend_container_this_month > li:first-child {
2414 margin-top: 31px !important;
2415 }
2416
2417 ul#wpf_backend_container_this_month > li:first-child:before {
2418 content: "THIS MONTH";
2419 display: block;
2420 font-weight: 500;
2421 font-family: 'Roboto', sans-serif;
2422 width: calc(100% + 40px);
2423 background-color: #ecf3f9;
2424 position: absolute;
2425 top: -31px;
2426 padding: 5px 20px;
2427 left: -20px;
2428 right: -20px;
2429 }
2430
2431 ul#wpf_backend_container_year > li:first-child {
2432 margin-top: 31px !important;
2433 }
2434
2435 ul#wpf_backend_container_year >li:first-child:before {
2436 content: "YEAR";
2437 display: block;
2438 font-weight: 500;
2439 font-family: 'Roboto', sans-serif;
2440 width: calc(100% + 40px);
2441 background-color: #ecf3f9;
2442 position: absolute;
2443 top: -31px;
2444 padding: 5px 20px;
2445 left: -20px;
2446 right: -20px;
2447 }
2448
2449 ul#wpf_backend_container_other > li:first-child {
2450 margin-top: 31px !important;
2451 }
2452
2453 ul#wpf_backend_container_other > li:first-child:before {
2454 content: "OTHER";
2455 display: block;
2456 font-weight: 500;
2457 font-family: 'Roboto', sans-serif;
2458 width: calc(100% + 40px);
2459 background-color: #ecf3f9;
2460 position: absolute;
2461 top: -31px;
2462 padding: 5px 20px;
2463 left: -20px;
2464 right: -20px;
2465 }
2466
2467 ul#wpf_frontend_container_today > li:first-child {
2468 margin-top: 31px !important;
2469 }
2470
2471 ul#wpf_frontend_container_today > li:first-child:before {
2472 content: "TODAY";
2473 display: block;
2474 font-weight: 500;
2475 font-family: 'Roboto', sans-serif;
2476 width: calc(100% + 40px);
2477 background-color: #ecf3f9;
2478 position: absolute;
2479 top: -31px;
2480 padding: 5px 20px;
2481 left: -20px;
2482 right: -20px;
2483 }
2484
2485 ul#wpf_frontend_container_yesterday > li:first-child {
2486 margin-top: 31px !important;
2487 }
2488
2489 ul#wpf_frontend_container_yesterday > li:first-child:before {
2490 content: "YESTERDAY";
2491 display: block;
2492 font-weight: 500;
2493 font-family: 'Roboto', sans-serif;
2494 width: calc(100% + 40px);
2495 background-color: #ecf3f9;
2496 position: absolute;
2497 top: -31px;
2498 padding: 5px 20px;
2499 left: -20px;
2500 right: -20px;
2501 }
2502
2503 ul#wpf_frontend_container_this_week > li:first-child {
2504 margin-top: 31px !important;
2505 }
2506
2507 ul#wpf_frontend_container_this_week > li:first-child:before {
2508 content: "THIS WEEK";
2509 display: block;
2510 font-weight: 500;
2511 font-family: 'Roboto', sans-serif;
2512 width: calc(100% + 40px);
2513 background-color: #ecf3f9;
2514 position: absolute;
2515 top: -31px;
2516 padding: 5px 20px;
2517 left: -20px;
2518 right: -20px;
2519 }
2520
2521 ul#wpf_frontend_container_this_month > li:first-child {
2522 margin-top: 31px !important;
2523 }
2524
2525 ul#wpf_frontend_container_this_month > li:first-child:before {
2526 content: "THIS MONTH";
2527 display: block;
2528 font-weight: 500;
2529 font-family: 'Roboto', sans-serif;
2530 width: calc(100% + 40px);
2531 background-color: #ecf3f9;
2532 position: absolute;
2533 top: -31px;
2534 padding: 5px 20px;
2535 left: -20px;
2536 right: -20px;
2537 }
2538
2539 ul#wpf_frontend_container_year > li:first-child {
2540 margin-top: 31px !important;
2541 }
2542
2543 ul#wpf_frontend_container_year > li:first-child:before {
2544 content: "YEAR";
2545 display: block;
2546 font-weight: 500;
2547 font-family: 'Roboto', sans-serif;
2548 width: calc(100% + 40px);
2549 background-color: #ecf3f9;
2550 position: absolute;
2551 top: -31px;
2552 padding: 5px 20px;
2553 left: -20px;
2554 right: -20px;
2555 }
2556
2557 ul#wpf_frontend_container_other > li:first-child {
2558 margin-top: 31px !important;
2559 }
2560
2561 ul#wpf_frontend_container_other > li:first-child:before {
2562 content: "OTHER";
2563 display: block;
2564 font-weight: 500;
2565 font-family: 'Roboto', sans-serif;
2566 width: calc(100% + 40px);
2567 background-color: #ecf3f9;
2568 position: absolute;
2569 top: -31px;
2570 padding: 5px 20px;
2571 left: -20px;
2572 right: -20px;
2573 }
2574 .wpf_sidebar_container .close_sidebar {
2575 border: 0;
2576 outline: none;
2577 background: transparent;
2578 position: absolute;
2579 right: 10px;
2580 top: 14px;
2581 cursor: pointer;
2582 padding: 0;
2583 z-index: 9;
2584 }
2585 .wpf_sidebar_container .close_sidebar svg {
2586 height: 14px;
2587 width: 14px;
2588 }
2589 .wpf_sidebar_container .close_sidebar:hover svg {
2590 opacity: 0.8;
2591 }
2592 .wpf_sidebar_container .no_task_found {
2593 padding: 20px;
2594 text-align: center;
2595 justify-content: center;
2596 font-size: 16px;
2597 color: rgba(0,0,0,0.2);
2598 }
2599 /* notes when task become general */
2600 p.note_task_become_general {
2601 color: #e54f6d;
2602 margin-top: 5px;
2603 font-size: 85%;
2604 font-weight: 400;
2605 }
2606
2607 /* sidebar search */
2608
2609 #sidebar_filters {
2610 position: relative;
2611 padding: 15px !important;
2612 }
2613 #sidebar_filters #wpf_side_filter {
2614 padding: 0 12px;
2615 }
2616 .wpf_search_box >.search-icon {
2617 height: 16px;
2618 width: 16px;
2619 display: flex;
2620 margin: 0 auto;
2621 margin-bottom: 0px;
2622 fill: transparent;
2623 }
2624 .filter_ui_content .wpf_search_box {
2625 font-size: 15px;
2626 width: 100%;
2627 padding: 0 7px;
2628 display: flex;
2629 align-items: center;
2630 }
2631 .filter_ui_content .wpf_search_box input.wpf_search_title {
2632 font-family: 'Roboto', sans-serif;
2633 font-size: 12px;
2634 width: 100%;
2635 border-width: inherit;
2636 margin: 0px;
2637 height: auto;
2638 font-weight: 400;
2639 border-bottom: 0 !important;
2640 outline: none !important;
2641 padding: 9px 10px;
2642 }
2643
2644 #sidebar_live_search {
2645 display: none;
2646 width: 100%;
2647 height: 100%;
2648 position: absolute;
2649 z-index: 99;
2650 left: 0;
2651 background: #fff;
2652 }
2653
2654
2655 #sidebar_filters ul.icons-block {
2656 text-align: center;
2657 margin: 0;
2658 padding: 0;
2659 list-style: none;
2660 display: flex;
2661 align-items: flex-end;
2662 }
2663 #sidebar_filters ul.icons-block > li {
2664 text-align: center;
2665 margin: 0 7px;
2666 }
2667 #sidebar_filters ul.icons-block > li > a {
2668 color: #4a5568 !important;
2669 font-family: 'Roboto', sans-serif;
2670 font-size: 12px;
2671 text-decoration: none;
2672 }
2673 #sidebar_filters ul.icons-block > li > a svg {
2674 height: 16px;
2675 width: 16px;
2676 display: flex;
2677 margin: 0 auto;
2678 margin-bottom: 0px;
2679 fill: transparent;
2680 }
2681 #sidebar_filters ul.icons-block > li:first-child > a svg {
2682 width: 26px !important;
2683 }
2684 div#wpf_side_filter {
2685 overflow: hidden;
2686 }
2687 .filter_ui_content .wpf_list.wpf_active {
2688 padding: 1px 0px !important;
2689 -webkit-animation: fade-in-top .2s cubic-bezier(.39,.575,.565,1) both;
2690 animation: fade-in-top .2s cubic-bezier(.39,.575,.565,1) both!important;
2691 }
2692 .filter_ui_content .wpf_list .wpf_filter_title {
2693 color: #4a5568;
2694 font-size: 12px;
2695 margin-bottom: 8px;
2696 font-weight: 700;
2697 }
2698 .filter_ui_content .wpf_icon_title svg {
2699 margin-right: 5px !important;
2700 display: inline-block;
2701 }
2702 .filter_ui_content .wpf_list .wpf_filter_title svg {
2703 height: 12px;
2704 width: auto;
2705 }
2706 .filter_ui_content .wpf_filter_checkbox {
2707 width: 100% !important;
2708 }
2709 .filter_ui_content #sidebar_search.active {
2710 position: relative;
2711 background: #fff;
2712 width: 100%;
2713 height: 100%;
2714 padding: 0 15px;
2715 }
2716 .filter_ui_content label.wpf_filter_title {
2717 margin-top: 0px;
2718 }
2719 .filter_ui_content .wpf_list > div:not(#sidebar_search) {
2720 padding: 7px 15px 7px;
2721 }
2722
2723 #sidebar_filters ul.icons-block {
2724 margin-right: 15px;
2725 }
2726
2727 .wpf_sidebar_content.nothingfound {
2728 background: url(../images//nothingfound.svg) 100% 36% no-repeat;
2729 -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
2730 animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
2731 }
2732 .wpf_sidebar_content.nothingfound:before {
2733 content: "No Results Found";
2734 font-weight: 700;
2735 text-align: center;
2736 display: block;
2737 margin-top: 10%;
2738 padding-top: 40%;
2739 height: 90%;
2740 background-color: rgb(255 255 255 / 50%);
2741 }
2742 .wpf_sidebar_content .nothingfound {
2743 position: absolute;
2744 top: 32%;
2745 width: 100%;
2746 }
2747
2748
2749 /*----------------Some website plus icon disappeared on frontend-------------------*/
2750
2751 .wpf_start_comment .fa-plus:hover {
2752 box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
2753 animation: wpfpulse 2s infinite !important;
2754 }
2755 .wpf_start_comment a.active_comment i,
2756 .wpf_start_comment a.active_comment .fa-plus {
2757 -moz-transform: rotate(45deg);
2758 -webkit-transform: rotate(45deg);
2759 -o-transform: rotate(45deg);
2760 -ms-transform: rotate(45deg);
2761 transform: rotate(45deg);
2762 }
2763 .wpf_start_comment i,
2764 .wpf_start_comment .fa-plus {
2765 margin: 10px 0;
2766 color: #fff;
2767 display: block;
2768 box-sizing: border-box;
2769 -webkit-transition: all 0.2s ease-in;
2770 -moz-transition: all 0.2s ease-in;
2771 -ms-transition: all 0.2s ease-in;
2772 -o-transition: all 0.2s ease-in;
2773 transition: all 0.2s ease-in !important;
2774 }
2775 .popover.wpf_comment_container i.fa,
2776 #wpf_launcher i.fa,
2777 #wpf_launcher .fa-plus {
2778 margin: 0px;
2779 background: unset;
2780 padding: unset;
2781 }
2782 /* ---------- Filter task ---------- */
2783
2784 button.wpf_filter.wpf_filter_taskstatus {
2785 margin-right: 2%;
2786 }
2787 div#wpf_task_filter_btn {
2788 border: 1px solid #dee2e6;
2789 padding: 0 10px 10px;
2790 margin: 0;
2791 border-radius: 0 0 7px 7px;
2792 -webkit-animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
2793 animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
2794 }
2795 button.wpf_filter:hover,
2796 button.wpf_filter.wpf_active {
2797 background-color: var(--main-wpf-color) !important;
2798 color: #fff !important;
2799 }
2800 label.wpf_filter_title {
2801 display: block;
2802 text-align: left;
2803 color: var(--main-wpf-color);
2804 margin-top: 10px;
2805 font-size: 12px;
2806 }
2807 ul#wpf_sidebar_filter_task_status,
2808 ul#wpf_sidebar_filter_task_priority {
2809 display: -ms-flexbox;
2810 display: -webkit-flex;
2811 display: flex;
2812 -webkit-flex-direction: row;
2813 -ms-flex-direction: row;
2814 flex-direction: row;
2815 -webkit-flex-wrap: wrap;
2816 -ms-flex-wrap: wrap;
2817 flex-wrap: wrap;
2818 -webkit-justify-content: space-between;
2819 -ms-flex-pack: justify;
2820 justify-content: space-between;
2821 -webkit-align-content: stretch;
2822 -ms-flex-line-pack: stretch;
2823 align-content: stretch;
2824 -webkit-align-items: flex-start;
2825 -ms-flex-align: start;
2826 align-items: flex-start;
2827 }
2828 .wpf_filter_checkbox li {
2829 float: left;
2830 font-size: 11px;
2831 text-align: left;
2832 font-weight: 700;
2833 list-style: none;
2834 margin-top: 5px;
2835 -webkit-order: 0;
2836 -ms-flex-order: 0;
2837 order: 0;
2838 -webkit-flex: 0 1 auto;
2839 -ms-flex: 0 1 auto;
2840 flex: 0 1 auto;
2841 -webkit-align-self: auto;
2842 -ms-flex-item-align: auto;
2843 align-self: auto;
2844 margin-left: 0;
2845 }
2846 .wpf_filter_checkbox li label {
2847 cursor: pointer !important;
2848 font-size: 11px !important;
2849 margin-left: 0 !important;
2850 position: relative;
2851 font-weight: 700;
2852 }
2853 ul#wpf_sidebar_filter_task_status.wpf_filter_checkbox li:nth-child(1),
2854 ul#wpf_sidebar_filter_task_priority.wpf_filter_checkbox li:nth-child(4) {
2855 color: #ff5a48;
2856 }
2857 ul#wpf_sidebar_filter_task_status.wpf_filter_checkbox li:nth-child(2),
2858 ul#wpf_sidebar_filter_task_priority.wpf_filter_checkbox li:nth-child(3) {
2859 color: #ffa532;
2860 }
2861 ul#wpf_sidebar_filter_task_status.wpf_filter_checkbox li:nth-child(3),
2862 ul#wpf_sidebar_filter_task_priority.wpf_filter_checkbox li:nth-child(2) {
2863 color: #fcd227;
2864 }
2865 ul#wpf_sidebar_filter_task_status.wpf_filter_checkbox li:nth-child(4),
2866 ul#wpf_sidebar_filter_task_priority.wpf_filter_checkbox li:nth-child(1) {
2867 color: #3ed696;
2868 }
2869 .wpf_filter_checkbox input:checked + label:after {
2870 content: '';
2871 display: block;
2872 position: absolute;
2873 top: 3px;
2874 left: 7px;
2875 width: 3px;
2876 height: 7px;
2877 border: solid #363d4d;
2878 border-width: 0 2px 2px 0;
2879 transform: rotate(45deg);
2880 box-sizing: content-box !important;
2881 }
2882 .wpf_filter_checkbox input + label:before {
2883 content: '';
2884 display: inline-block;
2885 width: 15px;
2886 height: 15px;
2887 margin-bottom: -2px;
2888 margin-right: 2px;
2889 margin-left: 0;
2890 border-radius: 3px;
2891 border: 2px solid #363d4d !important;
2892 opacity: 0.6;
2893 transition: all .12s, border-color .08s !important;
2894 box-sizing: content-box !important;
2895 }
2896 .wpf_filter_checkbox li input {
2897 display: none;
2898 }
2899 a.wpf_sidebar_filter_reset_task_status,
2900 a.wpf_sidebar_filter_reset_task_priority {
2901 display: none !important;
2902 color: var(--main-wpf-color) !important;
2903 }
2904
2905 /* ---------- Front End Wizard ---------- */
2906
2907 .wpf_wizard_container {
2908 position: fixed;
2909 z-index: 199999;
2910 top: 0;
2911 left: 0;
2912 width: 100%;
2913 height: 100%;
2914 overflow: auto;
2915 background-color: rgba(255, 255, 255, 0.85);
2916 -webkit-animation-name: fadeIn;
2917 animation-name: fadeIn;
2918 -webkit-animation-duration: 0.5s;
2919 animation-duration: 0.5s;
2920 -webkit-animation-fill-mode: both;
2921 animation-fill-mode: both;
2922 }
2923 .wpf_wizard_modal {
2924 width: 450px;
2925 max-width: 88%;
2926 margin: auto;
2927 margin-top: 5%;
2928 box-shadow: 0em 0em 3em 0em rgba(0, 0, 0, 0.13);
2929 padding: 15px;
2930 border-radius: 10px;
2931 border: 1px solid #efefef;
2932 background-color: #fff !important;
2933 text-align: center;
2934 font-family: arial, sans-serif;
2935 font-size: 14px;
2936 -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
2937 animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
2938 }
2939 .wpf_wizard_page {
2940 margin-bottom: 15px;
2941 }
2942 .wpf_wizard_button {
2943 border-radius: 5px;
2944 border: none;
2945 padding: 10px 25px;
2946 font-size: 14px;
2947 cursor: pointer;
2948 color: #272d3c;
2949 font-weight: 700;
2950 text-align: center;
2951 text-decoration: none;
2952 font-family: 'Roboto', sans-serif;
2953 background-color: #3ed696 !important;
2954 display: block;
2955 -webkit-transition: all 0.2s ease-in;
2956 -moz-transition: all 0.2s ease-in;
2957 -ms-transition: all 0.2s ease-in;
2958 -o-transition: all 0.2s ease-in;
2959 transition: all 0.2s ease-in !important;
2960 }
2961 .wpf_wizard_button:hover {
2962 opacity: 0.8;
2963 }
2964 .wpf_wizard_title {
2965 font-size: 24px;
2966 font-weight: 700;
2967 margin-bottom: 5px;
2968 color: #272D3C !important;
2969 font-family: 'Roboto', sans-serif;
2970 line-height: 1.1;
2971 margin-bottom: 15px;
2972 }
2973 .wpf_wizard_modal b, .wpf_wizard_modal {
2974 font-family: 'Roboto', sans-serif !important;
2975 font-size: 14px !important;
2976 color: #272D3C !important;
2977 }
2978 .wpf_wizard_user {
2979 display: flex;
2980 justify-content: space-around;
2981 }
2982 .wpf_wizard_choice {
2983 width: 30%;
2984 padding: 10px;
2985 border-radius: 5px;
2986 border: 1px solid #efefef;
2987 vertical-align: top;
2988 min-height: 150px;
2989 background-color: #fff;
2990 cursor: pointer;
2991 -webkit-transition: all 0.2s ease-in;
2992 -moz-transition: all 0.2s ease-in;
2993 -ms-transition: all 0.2s ease-in;
2994 -o-transition: all 0.2s ease-in;
2995 transition: all 0.2s ease-in !important;
2996 box-sizing: border-box;
2997 text-align: center;
2998 }
2999
3000 .wpf_wizard_choice:hover {
3001 background-color: #ECF3F9;
3002 }
3003 .wpf_wizard_choice_title {
3004 font-size: 14px;
3005 font-weight: 500;
3006 margin-bottom: 5px;
3007 color: #272D3C !important;
3008 font-family: 'Roboto', sans-serif;
3009 line-height: 1.1;
3010 }
3011 .wpf_wizard_choice img {
3012 width: 70px;
3013 margin: 5px auto;
3014 }
3015 .wpf_wizard_desc {
3016 font-size: 80%;
3017 margin-top: 5px;
3018 }
3019 .wpf_wizard_user input[type=radio]:checked+label {
3020 background-color: #efefef;
3021 }
3022 .wpf_wizard_page input {
3023 display: none !important;
3024 }
3025 .wpf_wizard_notifications_check .wpf_checkbox {
3026 margin-bottom: 7px;
3027 min-height: 22px;
3028 }
3029 .wpf_wizard_notifications_check .wpf_checkbox label {
3030 margin-bottom: 10px !important;
3031 position: relative;
3032 font-size: 14px !important;
3033 }
3034 .wpf_wizard_notifications_check {
3035 text-align: left;
3036 border: 1px solid #efefef;
3037 padding-left: 13px;
3038 padding-top: 7px;
3039 border-radius: 5px;
3040 margin-bottom: 15px;
3041 color: #000000;
3042 }
3043 btn#wpf_wizard_done_button {
3044 margin-top: 15px;
3045 }
3046 li.wpf_other.magic_msg_replied {
3047 padding: 5px 10px !important;
3048 }
3049 li.wpf_other.magic_msg_replied a {
3050 width: 100%;
3051 border: none !important;
3052 margin-top: 10px;
3053 background-color: var(--main-wpf-color) !important;
3054 color: #fff !important;
3055 font-size: 14px;
3056 text-align: center;
3057 font-family: 'Roboto', sans-serif;
3058 border-radius: 5px;
3059 padding: 12px 5px !important;
3060 font-weight: 700;
3061 -webkit-transition: all 0.2s ease-in;
3062 -moz-transition: all 0.2s ease-in;
3063 -ms-transition: all 0.2s ease-in;
3064 -o-transition: all 0.2s ease-in;
3065 transition: all 0.2s ease-in !important;
3066 height: auto;
3067 line-height: initial;
3068 margin-right: 0;
3069 margin-bottom: 0;
3070 text-transform: none;
3071 display: block;
3072 }
3073 .bs-popover-auto[x-placement^=right], .bs-popover-right {
3074 margin-left: 0.5rem;
3075 }
3076 .popover {
3077 font-style: normal;
3078 font-weight: 400;
3079 line-height: 1.5;
3080 text-align: left;
3081 text-decoration: none;
3082 text-shadow: none;
3083 text-transform: none;
3084 letter-spacing: normal;
3085 word-break: normal;
3086 word-spacing: normal;
3087 white-space: normal;
3088 line-break: auto;
3089 font-size: .875rem;
3090 word-wrap: break-word;
3091 background-color: #fff;
3092 background-clip: padding-box;
3093 border: 1px solid rgba(0, 0, 0, .2);
3094 }
3095 .bs-popover-right>.arrow {
3096 left: calc((0.5rem + 0px) * -1) !important;
3097 margin: 0.3rem 0;
3098 }
3099 .bs-popover-left>.arrow {
3100 right: calc((0.5rem + 0px) * -1) !important;
3101 margin: 0.3rem 0;
3102 left: unset;
3103 }
3104 .popover .arrow {
3105 position: absolute;
3106 display: block;
3107 }
3108 .popover-header:empty {
3109 display: none;
3110 }
3111 .popover-header {
3112 padding: 0.5rem 0.75rem;
3113 margin-bottom: 0;
3114 font-size: 1rem;
3115 background-color: #f7f7f7;
3116 border-bottom: 1px solid #ebebeb;
3117 border-top-left-radius: calc(0.3rem - 1px);
3118 border-top-right-radius: calc(0.3rem - 1px);
3119 }
3120 .popover-body {
3121 color: #212529;
3122 }
3123 .nav {
3124 display: -ms-flexbox;
3125 display: flex;
3126 -ms-flex-wrap: wrap;
3127 flex-wrap: wrap;
3128 list-style: none;
3129 }
3130 .nav-tabs .nav-link {
3131 border-top-left-radius: 0.25rem;
3132 border-top-right-radius: 0.25rem;
3133 }
3134 .nav-link {
3135 display: block;
3136 }
3137 .wpf_comment_container .tab-content > .tab-pane {
3138 display: none;
3139 }
3140 .wpf_comment_container .popover-body ul.nav.nav-tabs li:before,
3141 ul.wp_feedback_filter_checkbox.user li:before,
3142 #wpf_general_comment_tabs ul li:before,
3143 #wpf_sidebar_filter_task_status li:before,
3144 #wpf_sidebar_filter_task_priority li:before {
3145 content: none;
3146 }
3147 .wpf_comment_container .popover-body ul.nav.nav-tabs li,
3148 ul.wp_feedback_filter_checkbox.user li,
3149 .wpf_comment_container .popover-body li,
3150 #wpf_sidebar_filter_task_status li,
3151 #wpf_sidebar_filter_task_priority li {
3152 padding: 0;
3153 }
3154 .wpf_comment_container ul {
3155 padding: inherit;
3156 }
3157
3158 .wpf_tag_autocomplete input {
3159 background-color: #fff;
3160 background-clip: padding-box;
3161 border: 1px solid rgba(0, 0, 0, .2);
3162 border-radius: .3rem;
3163 padding-left: 10px;
3164 }
3165 .wpf_confirm_dialog .wpf-close {
3166 float: right;
3167 font-size: 20px;
3168 margin-top: -5px;
3169 color: var(--main-wpf-color) !important;
3170 float: right;
3171 font-weight: 700;
3172 line-height: 1;
3173 text-shadow: 0 1px 0 #fff;
3174 opacity: .5;
3175 text-decoration: none;
3176 font-style: normal;
3177 cursor: pointer;
3178 }
3179
3180 @media only screen and (max-width: 479px) {
3181 .wpf_wizard_choice img {
3182 float: left;
3183 margin: 0 10px 0 0;
3184 }
3185 .wpf_wizard_choice_title {
3186 display: inline-block;
3187 margin-top: 15px;
3188 }
3189 .wpf_wizard_choice {
3190 width: 80%;
3191 text-align: left;
3192 min-height: auto;
3193 margin-bottom: 10px;
3194 }
3195 }
3196 /* ---------- Responsive Mode ---------- */
3197 .wpf_responsive_modal_wrap {
3198 position: fixed;
3199 top: 0;
3200 left: 0;
3201 width: 100%;
3202 height: 100%;
3203 background-color: #0a0a0a !important;
3204 z-index: 10000000000;
3205 text-align: center;
3206 background-color: rgba(255, 255, 255, 0.85);
3207 -webkit-animation-name: fadeIn;
3208 animation-name: fadeIn;
3209 -webkit-animation-duration: 0.5s;
3210 animation-duration: 0.5s;
3211 -webkit-animation-fill-mode: both;
3212 animation-fill-mode: both;
3213 }
3214 .wpf_responsive_modal_wrap:before {
3215 content: "";
3216 background-image: url(../images/BG-pattern.png);
3217 width: 100%;
3218 height: 100%;
3219 position: absolute;
3220 left: 0;
3221 top: 0;
3222 opacity: 0.2;
3223 background-size: contain;
3224 z-index: -1;
3225 }
3226 .wpf_responsive_modal_wrap:after {
3227 background-image: url(../images/Loader-slider-WPFeedback.svg);
3228 background-repeat: no-repeat;
3229 background-position: center center;
3230 background-size: 60px;
3231 content: "";
3232 position: absolute;
3233 top: 40%;
3234 width: 60px;
3235 height: 50px;
3236 display: block;
3237 left: calc(50% - 30px);
3238 z-index: -1;
3239 }
3240
3241 a.wpf_close {
3242 position: absolute;
3243 top: 10px;
3244 right: 10px;
3245 z-index: 10;
3246 }
3247 .wpf_responsive_modal {
3248 -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
3249 animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
3250 animation-delay: 2s !important;
3251 border-radius: 5px;
3252 display: flex;
3253 overflow: hidden;
3254 height: 100%;
3255 justify-content: center;
3256 align-items: center;
3257 }
3258 .wpf_responsive_modal iframe {
3259 border: 1px solid #dee2e6;
3260 border-radius: 5px;
3261 }
3262 .wpf_responsive_icons {
3263 position: absolute;
3264 top: 70px;
3265 background-color: #fff;
3266 box-shadow: 0em 0em 3em 0em rgb(0 0 0 / 70%);
3267 border-radius: 0 5px 5px 0;
3268 border: 1px solid #efefef;
3269 z-index: 10;
3270 }
3271 a.wpf_responsive_icon {
3272 display: block;
3273 text-align: left;
3274 font-size: 14px !important;
3275 color: #272d3c !important;
3276 font-weight: 400;
3277 font-family: roboto,sans-serif !important;
3278 padding: 10px 11px;
3279 -webkit-transition: all 0.2s ease-in;
3280 -moz-transition: all 0.2s ease-in;
3281 -ms-transition: all 0.2s ease-in;
3282 -o-transition: all 0.2s ease-in;
3283 transition: all 0.2s ease-in !important;
3284 }
3285 a.wpf_responsive_icon:hover {
3286 background: #ecf3f9;
3287 }
3288 .wpf_responsive_active_tab {
3289 background: #69DC9D !important;
3290 }
3291
3292 a.wpf_responsive_icon span {
3293 width: 22px;
3294 height: 22px;
3295 display: inline-block;
3296 vertical-align: middle;
3297 text-align: center;
3298 margin-right: 3px;
3299 color: rgb(74, 85, 104);
3300 }
3301
3302 a.wpf_responsive_icon i {
3303 display: block;
3304 margin-right: 0;
3305 margin-bottom: 0;
3306 margin-top: 0;
3307 }
3308 .wpf_responsive_icons_bar {
3309 position: relative;
3310 border: 1px solid #A4ABC5;
3311 margin-left: 10px;
3312 border-radius: 5px;
3313 display: flex;
3314 justify-content: center;
3315 align-items: center;
3316 height: 36px;
3317 width: 36px;
3318 box-sizing: border-box;
3319 cursor: pointer;
3320 }
3321 .wpf_responsive_icons_bar > img {
3322 margin-left: -4px;
3323 }
3324 .wpf_responsove_options {
3325 visibility: hidden;
3326 position: absolute;
3327 top: -130px;
3328 left: 0;
3329 height: 110px;
3330 width: 105px;
3331 background: #FFFFFF;
3332 box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.27);
3333 border-radius: 5px;
3334 transition: opacity 244ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 163ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
3335 padding: 10px 0px !important;
3336 box-sizing: border-box;
3337 }
3338 .wpf_desktop_view, .wpf_tab_view, .wpf_mobile_view {
3339 font-family: 'Roboto', sans-serif;
3340 height: 30px;
3341 font-size: 14px;
3342 font-weight: 400;
3343 padding: 0px 15px !important;
3344 box-sizing: border-box;
3345 display: flex;
3346 align-items: center;
3347 justify-content: space-around;
3348 color: #000;
3349 }
3350 .wpf_desktop_view span, .wpf_tab_view span, .wpf_mobile_view span {
3351 width: 52px;
3352 }
3353 .wpf_desktop_view {
3354 cursor: default;
3355 }
3356 .wpf_desktop_view, .wpf_desktop_view:hover, .wpf_tab_view:hover, .wpf_mobile_view:hover {
3357 background-color: #ECF3F9;
3358 }
3359 select#wpf_scale_effect {
3360 border: none;
3361 border-top: 1px solid #dee2e6;
3362 font-size: 14px;
3363 border-radius: 0;
3364 }
3365 a.wpf_close.wpf_back_responsive {
3366 color: #fff !important;
3367 left: 5px;
3368 top: 20px;
3369 right: auto;
3370 background-color: #e54f6d;
3371 font-size: 14px !important;
3372 border-radius: 50px;
3373 padding: 0 10px 0 0;
3374 }
3375 a.wpf_close.wpf_back_responsive i {
3376 display: inline-block;
3377 vertical-align: middle;
3378 }
3379 .wpf_responsive_modal .iframe_holder {
3380 -webkit-transition: all 0.3s ease-in;
3381 -moz-transition: all 0.3s ease-in;
3382 -ms-transition: all 0.3s ease-in;
3383 -o-transition: all 0.3s ease-in;
3384 transition: all 0.3s ease-in !important;
3385 background-color: #fff;
3386 padding: 60px 15px;
3387 border-radius: 25px;
3388 position: relative;
3389 box-shadow: 0em 0em 3em 0em rgb(0 0 0 / 70%);
3390 }
3391 .wpf_responsive_modal .iframe_holder:before {
3392 content: "";
3393 width: 16px;
3394 height: 16px;
3395 position: absolute;
3396 left: calc(50% - 8px);
3397 top: 25px;
3398 background-color: #ccc;
3399 border-radius: 50px;
3400 }
3401 .wpf_responsive_modal .iframe_holder:after {
3402 content: "";
3403 width: 40px;
3404 height: 40px;
3405 position: absolute;
3406 left: calc(50% - 20px);
3407 bottom: 10px;
3408 border-radius: 50px;
3409 border: 1px solid #e6e9ec;
3410 }
3411 .wpf_iframe_wrap {
3412 width: 100%;
3413 height: 100%;
3414 background-image: url(../images/Loader-slider-WPFeedback.svg);
3415 background-repeat: no-repeat;
3416 background-position: center center;
3417 background-size: 60px;
3418 }
3419 .iframe_holder iframe {
3420 max-width: 100% !important;
3421 max-height: 100% !important;
3422 }
3423 /*Responsive mode scale css*/
3424 .wpf_scale_50 {
3425 -ms-transform: scale(0.50);
3426 -moz-transform: scale(0.50);
3427 -o-transform: scale(0.50);
3428 -webkit-transform: scale(0.50);
3429 transform: scale(0.50);
3430 }
3431 .wpf_scale_75 {
3432 -ms-transform: scale(0.75);
3433 -moz-transform: scale(0.75);
3434 -o-transform: scale(0.75);
3435 -webkit-transform: scale(0.75);
3436 transform: scale(0.75);
3437 }
3438 .wpf_scale_100 {
3439 -ms-transform: scale(1);
3440 -moz-transform: scale(1);
3441 -o-transform: scale(1);
3442 -webkit-transform: scale(1);
3443 transform: scale(1);
3444 }
3445 .wpf_scale_125 {
3446 -ms-transform: scale(1.25);
3447 -moz-transform: scale(1.25);
3448 -o-transform: scale(1.25);
3449 -webkit-transform: scale(1.25);
3450 transform: scale(1.25);
3451 }
3452 .wpf_scale_150 {
3453 -ms-transform: scale(1.50);
3454 -moz-transform: scale(1.50);
3455 -o-transform: scale(1.50);
3456 -webkit-transform: scale(1.50);
3457 transform: scale(1.50);
3458 }
3459
3460 /* ---------- General Tasks pop up ---------- */
3461
3462 a.wpf_general_task_close, .wpf_approve_pg_close, a.wpf_close {
3463 font-size: 30px !important;
3464 margin-top: -7px;
3465 color: #e54f6d !important;
3466 float: right;
3467 font-weight: 400;
3468 line-height: 1;
3469 text-decoration: none;
3470 }
3471 a.wpf_general_task_close:hover,
3472 a.wpf_general_task_close:active,
3473 a.wpf_general_task_close:focus,
3474 a.wpf_approve_pg_close:hover,
3475 a.wpf_approve_pg_close:active,
3476 a.wpf_approve_pg_close:focus {
3477 text-decoration: none !important;
3478 }
3479 div#wpf_general_comment_tabs {
3480 text-align: left;
3481 margin-top: -10px;
3482 margin-bottom: -10px;
3483 }
3484 .wpf_info_block {
3485 width: 450px;
3486 max-width: 88%;
3487 background-color: #dee2e6;
3488 margin: 15px auto;
3489 padding: 15px;
3490 font-size: 13px;
3491 font-family: 'Roboto', sans-serif;
3492 border-radius: 7px;
3493 line-height: 1.5;
3494 }
3495 .wpf_info_block b,
3496 .wpf_info_block i {
3497 color: var(--main-wpf-color) !important;
3498 }
3499 .wpf_wizard_modal ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:after {
3500 top: 1px;
3501 }
3502 /* ------------ Unlock Website ------------ */
3503 .wpf_locked_modal svg {
3504 width: 75px;
3505 display: block;
3506 margin: auto;
3507 margin-bottom: 15px;
3508 }
3509 .wpf_unlock_website_btn {
3510 margin: auto;
3511 }
3512 .wpf_locked_modal a {
3513 color: #279af1;
3514 text-decoration: underline;
3515 }
3516 /* ------------ Internal Tasks ------------ */
3517 .wpf_mark_internal, .wpf_mark_note {
3518 height: 35px !important;
3519 padding: 0 !important;
3520 width: 35px !important;
3521 color: var(--main-wpf-color) !important;
3522 cursor: pointer;
3523 }
3524 .bottom_buttons .wpf_mark_internal, .bottom_buttons .wpf_mark_note {
3525 display: flex !important;
3526 align-items: center;
3527 justify-content: center;
3528 }
3529 .wpf_mark_internal img, .wpf_mark_note img {
3530 margin: auto !important;
3531 height: 18px;
3532 }
3533 .bottom_buttons .wpf_mark_note {
3534 background-color: transparent !important;
3535 }
3536 .wpf_mark_internal {
3537 position: relative;
3538 display: inline-block;
3539 border-width: 2px 2px 2px 1px !important;
3540 border-style: solid;
3541 border-color: #B3BDCD !important;
3542 border-radius: 0px 7px 7px 0px !important;
3543 background-color: transparent !important;
3544 }
3545 .wpf_mark_note {
3546 border-width: 2px 1px 2px 2px !important;
3547 border-style: solid;
3548 border-color: #B3BDCD !important;
3549 position: relative;
3550 border-radius: 7px 0px 0px 7px !important;
3551 }
3552 .wpf_mark_note:hover {
3553 background-color: #FEC90D !important;
3554 }
3555 .wpf_mark_note img path {
3556 fill: #000;
3557 }
3558 .wpf_chat_reply .wpf_mark_internal, .wpf_chat_reply .wpf_mark_note {
3559 top: 2px;
3560 }
3561 #send_chat {
3562 margin-right: 5px;
3563 }
3564 .wpf_tasks-list span.wpf_chevron_wrapper {
3565 top: 6px;
3566 left: 7px;
3567 bottom: 5px;
3568 }
3569 .wpf_chevron_wrapper {
3570 position: absolute;
3571 left: 4px;
3572 top: 3px;
3573 bottom: 3px;
3574 -webkit-transition: all 0.2s ease-out;
3575 -moz-transition: all 0.2s ease-out;
3576 -ms-transition: all 0.2s ease-out;
3577 -o-transition: all 0.2s ease-out;
3578 transition: all 0.2s ease-out;
3579 }
3580
3581 .wpfb-internal span.wpf_bubble_num_wrapper, .wpfb-internal:hover .wpf_chevron_wrapper {
3582 opacity: 0;
3583 }
3584 .wpfb-internal:hover span.wpf_bubble_num_wrapper, .wpfb-internal .wpf_chevron_wrapper {
3585 opacity: 1;
3586 }
3587 .wpfb-internal.complete .wpf_chevron_wrapper {
3588 background: inherit;
3589 }
3590 .wpf_hide_users_for_internal_tasks {
3591 color: #fff;
3592 font-size: 12px;
3593 font-weight: 700;
3594 letter-spacing: 0.015em;
3595 background-color: #3ed696;
3596 padding: 10px 5px 5px 10px !important;
3597 border: 1px solid #dee2e6;
3598 border-radius: 5px;
3599 line-height: 1.3;
3600 width: 100%;
3601 height: auto;
3602 -webkit-transition: all 0.2s ease-out;
3603 -moz-transition: all 0.2s ease-out;
3604 -ms-transition: all 0.2s ease-out;
3605 -o-transition: all 0.2s ease-out;
3606 transition: all 0.2s ease-out !important;
3607 -moz-box-sizing: border-box;
3608 -webkit-box-sizing: border-box;
3609 box-sizing: border-box;
3610 display: block;
3611 }
3612 .wpf_is_internal {
3613 background-color: var(--main-wpf-color) !important;
3614 color: #fff !important;
3615 }
3616 .wpf_chevron_wrapper .wpf-internal-img {
3617 height: 18px;
3618 width: 18px;
3619 }
3620 /*.wpf_is_internal .wpf-internal-img {
3621 filter: invert(1);
3622 }*/
3623 .wpf_is_internal.wpf_mark_internal_task_center .wpf-internal-img {
3624 filter: none;
3625 }
3626
3627 /* ------------ Edit/Delete Comments ------------ */
3628 .wpf-edit-delete-wrapper {
3629 background-color: #fff;
3630 padding: 5px 7px;
3631 position: absolute;
3632 right: -4px;
3633 top: -4px;
3634 border: 1px solid #dee2e6;
3635 border-radius: 5px;
3636 opacity: 0;
3637 box-shadow: 0 0 5px rgb(0 0 0 / 20%);
3638 -webkit-transition: all 0.2s ease-out;
3639 -moz-transition: all 0.2s ease-out;
3640 -ms-transition: all 0.2s ease-out;
3641 -o-transition: all 0.2s ease-out;
3642 transition: all 0.2s ease-out;
3643 }
3644 .wpf_comment_container ul li:hover .wpf-edit-delete-wrapper {
3645 opacity: 1;
3646 }
3647 .wpf-edit-delete-wrapper a {
3648 color: #A4ABC5;
3649 }
3650 .wpf_edit_box_active {
3651 margin-right: 7px;
3652 }
3653 .wpf-edit-delete-wrapper a:hover {
3654 color: #4a5568;
3655 }
3656 span.wpf-is-edited {
3657 color: #272D3C !important;
3658 font-size: 12px !important;
3659 margin-right: 5px !important;
3660 }
3661 span.wpf-is-edited:hover .edit_tooltip_text {
3662 visibility: visible;
3663 }
3664 span.wpf_tooltiptext.edit_tooltip_text {
3665 visibility: hidden;
3666 width: auto;
3667 white-space: nowrap;
3668 background-color: rgb(54, 61, 77);
3669 color: #fff !important;
3670 text-align: center;
3671 border-radius: 6px;
3672 padding: 5px 5px;
3673 font-weight: 500 !important;
3674 position: absolute;
3675 z-index: 1;
3676 bottom: 0;
3677 left: 80%;
3678 margin-left: -50px;
3679 }
3680 button.wpf_edit_comment_btn {
3681 height: 36px !important;
3682 padding: 0 13px !important;
3683 border-radius: 4px !important;
3684 border: 0 !important;
3685 color: #272d3c !important;
3686 align-items: center;
3687 background: #69DC9D !important;
3688 letter-spacing: 0.05em !important;
3689 font-family: 'Roboto', sans-serif !important;
3690 outline: none !important;
3691 text-decoration: none !important;
3692 cursor: pointer !important;
3693 text-transform: none !important;
3694 font-weight: 400 !important;
3695 margin-bottom: 0 !important;
3696 margin-right: 10px;
3697 margin-top: 5px;
3698 }
3699 a.wpf-cancel-edit-comment {
3700 color: #272d3c !important;
3701 }
3702 textarea.form-control.wpfb-edit-comment {
3703 background: #ecf3f9;
3704 border-radius: 8px;
3705 padding: 15px;
3706 border: 1px solid #dee2e6;
3707 font-size: 12px;
3708 margin-top: 5px;
3709 display: none;
3710 }
3711 /* ------------ Tooltips ------------ */
3712
3713 .wpf_mark_internal .wpf_tooltiptext, .wpf_mark_note .wpf_tooltiptext, .wpf_comment_container .nav-item .wpf_tooltiptext, .task_comment .wpf_tooltiptext {
3714 visibility: hidden;
3715 background-color: rgb(54, 61, 77);
3716 color: #fff !important;
3717 text-align: center;
3718 border-radius: 6px;
3719 padding: 5px 5px;
3720 font-weight: 500 !important;
3721 position: absolute;
3722 z-index: 1;
3723 bottom: 100%;
3724 left: 50%;
3725 margin-left: -50px;
3726 }
3727 .wpf_mark_internal .wpf_tooltiptext, .wpf_mark_note .wpf_tooltiptext, .task_comment .wpf_tooltiptext {
3728 width: auto;
3729 white-space: nowrap;
3730 }
3731 .wpf_comment_container .nav-item .wpf_tooltiptext {
3732 width: 400px !important;
3733 font-size: 12px !important;
3734 }
3735
3736 .wpf_mark_note_task_center:hover .note_tooltip_text,
3737 .wpf_mark_note:hover .note_tooltip_text,
3738 .unmark_internal_tooltip:hover .unmark_internal_tooltip_text,
3739 .wpf_mark_internal.wpf_is_internal:hover .unmark_internal_tooltip_text,
3740 .mark_internal_tooltip:hover .mark_internal_tooltip_text,
3741 .new_internal_tooltip:hover .new_internal_tooltip_text,
3742 .wpf_user_tab:hover .user_tooltip_text,
3743 .wpf_prio_tab:hover .urgency_tooltip_text,
3744 .wpf_stat_tab:hover .status_tooltip_text,
3745 .wpf_scrn_tab:hover .ss_tooltip_text,
3746 .wpf_deta_tab:hover .info_tooltip_text,
3747 .task_comment:hover .comment_tooltip_text {
3748 visibility: visible;
3749 }
3750 /* ------------ Plugin Conflicts ------------ */
3751
3752 /* Conflict with microthemer plugin*/
3753
3754 #css-group-icons .styling-option-icons .pg-icon {
3755 box-sizing: unset !important;
3756 }
3757 /* Conflict with Virtue - Premium theme collapse*/
3758
3759 .kad-nav-collapse.top_mobile_menu_collapse.collapse.show {
3760 height: auto !important;
3761 }
3762 .popover.wpf_comment_container .popover-content ul li {
3763 list-style: none;
3764 font-size: 12px;
3765 margin: inherit;
3766 }
3767 /* Conflict with Divi Version: 3.21.1 theme collapse*/
3768
3769 .popover.wpf_comment_container i.fa,
3770 #wpf_launcher i.fa {
3771 margin: 0px;
3772 background: unset;
3773 padding: unset;
3774 }
3775 .wpf_comment_container .fa.fa-trash:before {
3776 content: "\f1f8";
3777 }
3778 nav ul.nav {
3779 display: inherit;
3780 }
3781 .popover.wpf_comment_container.fade.in {
3782 opacity: 1;
3783 }
3784 div#elementor-lightbox {
3785 z-index: 999999;
3786 }
3787 /* ---------- Translation Adaptations ---------- */
3788
3789 button.wpf_tab_sidebar:lang(fr),
3790 button.wpf_tab_sidebar:lang(es),
3791 button.wpf_tab_sidebar:lang(it),
3792 button.wpf_tab_sidebar:lang(de),
3793 button.wpf_filter:lang(de) {
3794 height: 50px !important;
3795 padding: 5px !important;
3796 }
3797 button.wpf_tab_sidebar:lang(nl) {
3798 padding: 15px 3px !important;
3799 }
3800 a.wpf_sidebar_filter_reset_task_status:lang(fr),
3801 a.wpf_sidebar_filter_reset_task_priority:lang(fr),
3802 a.wpf_sidebar_filter_reset_task_status:lang(de),
3803 a.wpf_sidebar_filter_reset_task_priority:lang(de),
3804 a.wpf_sidebar_filter_reset_task_status:lang(es),
3805 a.wpf_sidebar_filter_reset_task_priority:lang(es),
3806 a.wpf_sidebar_filter_reset_task_status:lang(it),
3807 a.wpf_sidebar_filter_reset_task_priority:lang(it),
3808 a.wpf_sidebar_filter_reset_task_status:lang(nl),
3809 a.wpf_sidebar_filter_reset_task_priority:lang(nl) {
3810 -moz-transform: rotate(0deg);
3811 -webkit-transform: rotate(0deg);
3812 -o-transform: rotate(0deg);
3813 -ms-transform: rotate(0deg);
3814 transform: rotate(0deg);
3815 margin-top: 0;
3816 margin-right: 10px;
3817 }
3818 .wpf_filter_checkbox li:last-child:lang(fr),
3819 .wpf_filter_checkbox li:last-child:lang(de),
3820 .wpf_filter_checkbox li:last-child:lang(es),
3821 .wpf_filter_checkbox li:last-child:lang(it),
3822 .wpf_filter_checkbox li:last-child:lang(nl) {
3823 margin-right: 0;
3824 }
3825 .wpf_filter_checkbox li:lang(fr),
3826 .wpf_filter_checkbox li:lang(de),
3827 .wpf_filter_checkbox li:lang(es),
3828 .wpf_filter_checkbox li:lang(it),
3829 .wpf_filter_checkbox li:lang(nl) {
3830 width: 23.7%;
3831 }
3832 div#wpf_filter_taskstatus:lang(fr),
3833 div#wpf_filter_taskpriority:lang(fr),
3834 div#wpf_filter_taskstatus:lang(de),
3835 div#wpf_filter_taskpriority:lang(de),
3836 div#wpf_filter_taskstatus:lang(es),
3837 div#wpf_filter_taskpriority:lang(es),
3838 div#wpf_filter_taskstatus:lang(it),
3839 div#wpf_filter_taskpriority:lang(it),
3840 div#wpf_filter_taskstatus:lang(nl),
3841 div#wpf_filter_taskpriority:lang(nl) {
3842 border-bottom: 1px solid #efefef;
3843 }
3844 .wpf_sidebar_checkboxes:lang(es),
3845 .wpf_sidebar_checkboxes:lang(it) {
3846 vertical-align: top;
3847 }
3848 /*===== RTL ===========*/
3849
3850 .rtl .wpf_wizard_notifications_check,
3851 .rtl .wpf_comment_container ul {
3852 text-align: right;
3853 }
3854 .rtl .wpf_wizard_modal textarea.form-control {
3855 margin-bottom: 10px;
3856 }
3857 .rtl .wpf_comment_container .popover-body .close,
3858 .rtl .wpf_comment_container .popover-content .close,
3859 .rtl a.wpf_general_task_close,
3860 .rtl a.wpf_approve_pg_close {
3861 float: left;
3862 }
3863 .rtl li.wpf_other {
3864 margin-right: 25px;
3865 }
3866 .rtl .wpf_comment_container ul {
3867 padding-right: 0;
3868 margin-right: 0;
3869 direction: rtl;
3870 }
3871 .rtl ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:before,
3872 .rtl div#wpf_wizard_notifications input:checked + label:before {
3873 margin-left: 5px;
3874 }
3875 .rtl i.gg-share {
3876 margin-right: 16px;
3877 }
3878 .rtl ul.wp_feedback_filter_checkbox.user input[type="checkbox"] + label:before,
3879 .rtl div#wpf_wizard_notifications input + label:before {
3880 margin-left: 2px;
3881 }
3882 .rtl .wpf_remove_login_box input:checked + label:after,
3883 .rtl .wpf_filter_checkbox input:checked + label:after {
3884 right: 7px;
3885 content: "";
3886 }
3887 .rtl .wpf_sidebar_checkboxes label,
3888 .rtl label.wpf_visibility_title,
3889 .rtl label.wpf_reports_title,
3890 .rtl label.wpf_filter_title {
3891 text-align: right;
3892 }
3893 .rtl ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:after,
3894 .rtl div#wpf_wizard_notifications input:checked + label:after,
3895 .rtl div#wpf_task_visibility input[type="checkbox"]:checked + label:after {
3896 right: 10px;
3897 content: "";
3898 }
3899 .rtl .anim-slider label {
3900 float: right;
3901 }
3902 .rtl .anim-slider label:last-of-type::after {
3903 left: auto;
3904 transition: 0.5s;
3905 }
3906 .rtl .anim-slider input:checked:nth-of-type(1) ~ label:last-of-type::after {
3907 right: 9%;
3908 }
3909 .rtl .anim-slider input:checked:nth-of-type(2) ~ label:last-of-type::after {
3910 right: 35%;
3911 }
3912 .rtl button.wpf_tab_sidebar {
3913 float: right;
3914 margin: 0;
3915 }
3916 .rtl .wpf_sidebar_content,
3917 .rtl .wpf_sidebar_container ul {
3918 padding-right: 3px;
3919 }
3920 .rtl .wpf_task_sum {
3921 text-align: right;
3922 padding-right: 35px;
3923 }
3924 .rtl .complete .wpf_task_number i.gg-check {
3925 margin-right: 4px;
3926 }
3927 .rtl a.wpfb-point.complete .gg-check {
3928 margin-right: 8px;
3929 }
3930 .rtl .anim-slider input:checked:nth-of-type(3) ~ label:last-of-type::after {
3931 right: 59%;
3932 }
3933 .rtl .anim-slider input:checked:nth-of-type(4) ~ label:last-of-type::after {
3934 right: 85%;
3935 }
3936 .rtl a.wpf_task_delete_btn i.fa.fa-trash {
3937 margin-left: 5px !important;
3938 }
3939 .rtl .wpf_comment_container button.wpf_upload_button {
3940 margin-left: 5px;
3941 }
3942 .rtl button.wpf_upload_button i {
3943 margin-right: 10px;
3944 }
3945 .rtl .wpf_sidebar_checkboxes input[type="checkbox"]:checked + label:before {
3946 margin-left: 5px;
3947 }
3948 .rtl .wpf_sidebar_checkboxes input[type="checkbox"] + label:before {
3949 margin-left: 2px;
3950 }
3951 .rtl button.wpf_filter:last-child {
3952 margin: -5px;
3953 }
3954 .rtl .wpf_comment_container button {
3955 margin: 0;
3956 }
3957 .rtl .wpf_icon_title,
3958 .rtl label.wpf_remove_login_label {
3959 text-align: right;
3960 }
3961 .rtl a.wpf_copy_task_icon {
3962 padding-right: 10px;
3963 }
3964 .rtl .wpf_comment_container span.wpf_tag_name {
3965 padding: 2px 8px 0 0px;
3966 }
3967 .rtl span.wpf_tag_name a {
3968 margin-right: 3px;
3969 line-height: 0px !important;
3970 }
3971 .rtl button.wpf_tag_submit_btn {
3972 left: 5px;
3973 right: auto;
3974 }
3975 .rtl label.wpf_remove_login_label:before,
3976 .rtl .wpf_filter_checkbox input + label:before,
3977 .rtl #wpf_launcher .wpf_general_task_thispage i.gg-add {
3978 margin-left: 5px;
3979 }
3980 .rtl #wpf_launcher .wpf_general_task_thispage {
3981 padding: 7px 0px 5px 10px;
3982 }
3983 .rtl .wpf_task_meta_details i.gg-thermostat {
3984 margin-right: 3px;
3985 }
3986 .rtl .wpf_task_meta_details i.gg-danger {
3987 margin-right: -1px;
3988 }
3989 .rtl a.wpf_filter_tab_btn i.gg-eye {
3990 margin-right: 3px;
3991 }
3992 .rtl .wpf_report_trigger a {
3993 margin-right: 0;
3994 }
3995 .rtl .wpf_report_trigger a:nth-child(3) {
3996 margin-right: 2% !important;
3997 }
3998 /* RTL */
3999
4000 .popover.wpf_comment_container:lang(he) {
4001 direction: rtl;
4002 }
4003 .wpf_comment_container .popover-body .close:lang(he),
4004 .wpf_comment_container .popover-content .close:lang(he),
4005 .wpf_topbar_right:lang(he) {
4006 float: left;
4007 }
4008 .wpf_topbar_left:lang(he) {
4009 float: right;
4010 }
4011 a.wpf_button_upload:lang(he) {
4012 margin-left: 10px;
4013 }
4014 .wpf_graphics_version:lang(he) {
4015 margin-right: 0;
4016 margin-left: 15px;
4017 }
4018 .wpf_graphics_button:lang(he) {
4019 margin-left: 10px;
4020 }
4021 #wpf_launcher a.wpf_filter_tab_btn i.gg-share:lang(he) {
4022 margin-right: 19px;
4023 }
4024 .wpf_comment_container .nav-tabs .nav-link i.gg-share:lang(he) {
4025 margin-right: 17px;
4026 }
4027 #wpf_launcher a.wpf_filter_tab_btn i.gg-eye:lang(he) {
4028 margin-right: 4px;
4029 }
4030 .wpf_body:lang(he) {
4031 margin-right: 300px;
4032 }
4033 body.wpf_graphics .wpf_topbar:lang(he) {
4034 right: 0;
4035 }
4036 ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:lang(he):after,
4037 div#wpf_wizard_notifications input:checked + label:lang(he):after,
4038 div#wpf_task_visibility input[type="checkbox"]:checked + label:lang(he):after,
4039 .wpf_filter_checkbox input:checked + label:lang(he):after {
4040 right: 10px;
4041 top: 3px;
4042 }
4043 .wpf_remove_login_box input:checked + label:lang(he):after,
4044 .wpf_filter_checkbox input:checked + label:lang(he):after {
4045 right: 7px;
4046 }
4047 .wpf_filter_checkbox input + label:lang(he):before,
4048 .wpf_sidebar_checkboxes input[type="checkbox"] + label:lang(he):before {
4049 margin-left: 3px;
4050 }
4051 ul.wp_feedback_filter_checkbox.user input[type="checkbox"] + label:lang(he):before,
4052 div#wpf_wizard_notifications input + label:lang(he):before,
4053 label.wpf_remove_login_label:lang(he):before {
4054 margin-left: 5px !important;
4055 }
4056 .wpf_icon_title:lang(he),
4057 label.wpf_remove_login_label:lang(he) {
4058 text-align: right !important;
4059 }
4060 a.wpfb-point.complete .gg-check:lang(he) {
4061 margin-right: 8px;
4062 }
4063 .complete .wpf_task_number i.gg-check:lang(he) {
4064 margin-right: 4px;
4065 }
4066 .wpf_report_trigger a:lang(he) {
4067 margin-right: 0;
4068 }
4069 .wpf_report_trigger a:lang(he):nth-child(3) {
4070 margin-right: 2%;
4071 }
4072 .wpf_task_meta_details i.gg-danger:lang(he) {
4073 margin-right: -1px;
4074 }
4075 .wpf_task_meta_details i.gg-thermostat:lang(he) {
4076 margin-right: 4px;
4077 }
4078 .anim-slider label:lang(he) {
4079 float: right;
4080 }
4081 .anim-slider label:lang(he):last-of-type::after {
4082 left: auto;
4083 transition: 0.5s;
4084 }
4085 .anim-slider input:checked:nth-of-type(1) ~ label:lang(he):last-of-type::after {
4086 right: 9%;
4087 }
4088 .anim-slider input:checked:nth-of-type(2) ~ label:lang(he):last-of-type::after {
4089 right: 35%;
4090 }
4091 .anim-slider input:checked:nth-of-type(3) ~ label:lang(he):last-of-type::after {
4092 right: 59%;
4093 }
4094 .anim-slider input:checked:nth-of-type(4) ~ label:lang(he):last-of-type::after {
4095 right: 85%;
4096 }
4097 .popover.wpf_comment_container .popover-body .form-group button.wpf_upload_button:lang(he) {
4098 margin-right: 0 !important;
4099 margin-left: 10px;
4100 }
4101 button.wpf_upload_button i:lang(he) {
4102 margin-right: 10px;
4103 }
4104 label.wpf_filter_title:lang(he),
4105 label.wpf_reports_title:lang(he),
4106 label.wpf_visibility_title:lang(he),
4107 .wpf_sidebar_checkboxes label:lang(he) {
4108 text-align: right;
4109 }
4110
4111 /*===== Bug Fixes ===========*/
4112
4113 .wpf_comment_container .tab-content ul:not(.meassage_area_main ul) {
4114 margin: 0 !important;
4115 padding: 0 !important;
4116 padding-top: 5px !important;
4117 margin-bottom: 10px !important;
4118 overflow-x: hidden;
4119 background-color: #fff !important;
4120 }
4121 ul.wpf_current_chat_box:empty {
4122 display: none;
4123 }
4124 .wpfb-point.active_comment {
4125 pointer-events: none;
4126 }
4127 .popover.wpf_comment_container a.ui-slider-handle.ui-state-default.ui-corner-all {
4128 background: var(--main-wpf-color) !important;
4129 cursor: pointer;
4130 }
4131 .popover.wpf_comment_container .ui-slider-range.ui-widget-header.ui-slider-range-min {
4132 background: var(--main-wpf-color) !important;
4133 }
4134 div#wpf_general_comment .meassage_area_main {
4135 color: #000000;
4136 }
4137 input#search-field {
4138 box-sizing: unset;
4139 }
4140 .popover.wpf_comment_container .popover-content {
4141 padding: .5rem .75rem;
4142 color: #212529;
4143 }
4144 .wpf_sidebar_header.wpf_col2 button.wpf_tab_sidebar {
4145 width: 50%;
4146 }
4147 .popover.wpf_comment_container ul li a .fa {
4148 margin: 0px;
4149 }
4150 .popover.wpf_comment_container .chat_text {
4151 color: #272d3c;
4152 font-size: 14px;
4153 font-weight: 400;
4154 line-height: normal;
4155 }
4156 .wpf-comment-container .meassage_area_main {
4157 width: 380px;
4158 max-width: 100%;
4159 }
4160 .popover.wpf_comment_container .chat_text p, .wpf_wizard_container.wpf_comment_container .chat_text p {
4161 margin: 5px 0 10px 0 !important;
4162 font-size: 14px !important;
4163 font-weight: 400;
4164 line-height: 1.4 !important;
4165 }
4166 .wpf_update_error {
4167 font-size: 12px;
4168 font-weight: bold;
4169 color: #cc1816;
4170 }
4171 .fusion-modal.modal .modal-header {
4172 display: flow-root;
4173 }
4174 /*Conflict with WooCommerce TM Extra Product Options plugin setting Backend*/
4175
4176 .transition.tm-animated {
4177 animation-fill-mode: initial !important;
4178 }
4179
4180 .wpf_sidebar_container ul li.complete_custom .wpf_task_number,
4181 .wpf_sidebar_container ul li.complete .wpf_task_number {
4182 color: rgba(0,0,0,0.9) !important;
4183 font-weight: 500;
4184 }
4185
4186 .open_custom .wpf_task_number, .pending-review_custom .wpf_task_number, .in-progress_custom .wpf_task_number, .complete_custom .wpf_task_number, .wpf_task_number {
4187 width: 32px;
4188 min-width: 32px;
4189 height: 32px;
4190 order: 2;
4191 font-size: 12px;
4192 color: rgba(255,255,255,0.9);
4193 font-family: 'Roboto', sans-serif;
4194 font-weight: 700 !important;
4195 display: flex;
4196 align-items: center;
4197 justify-content: center;
4198 position: relative;
4199 margin: 0;
4200 overflow: hidden;
4201 border-radius: 15% 50% 50% 50%;
4202 transition: all 0.2s ease-in !important;
4203 background: var(--main-wpf-color);
4204 }
4205 .wpf_sidebar_container ul li.complete_custom .wpf_task_number,
4206 .wpf_sidebar_container ul li.complete .wpf_task_number {
4207 background-color: #69dc9e;
4208 }
4209
4210 .anim-slider input.low_radio + .low_label {
4211 color: #3ed696;
4212 }
4213 .anim-slider input.medium_radio + .medium_label {
4214 color: #fcd227;
4215 }
4216 .anim-slider input.high_radio + .high_label {
4217 color: #ffa532;
4218 }
4219 .anim-slider input.critical_radio + .critical_label {
4220 color: #ff5a48;
4221 }
4222 .anim-slider input.open_radio + .open_label {
4223 color: #363D4D ;
4224 }
4225 .anim-slider input.in_progress_radio + .in_progress_label {
4226 color: #ffa532 ;
4227 }
4228 .anim-slider input.pending_radio + .pending_label {
4229 color: #fcd227 ;
4230 }
4231 .anim-slider input.complete_radio + .complete_label {
4232 color: #3ed696 ;
4233 }
4234 .wpf_sidebar_content .wpf_container .wpf_task_sum {
4235 width: calc(100% - 35px);
4236 }
4237 /* Version 2.0 */
4238 .wpf_green_btn, .wpf_blue_btn, .wpf_red_btn, .wpf_screenshot_button {
4239 height: 36px !important;
4240 padding: 0 12px !important;
4241 display: flex;
4242 border-radius: 5px !important;
4243 border: 0 !important;
4244 font-size: 14px !important;
4245 color: #272d3c !important;
4246 align-items: center;
4247 background: #69DC9D !important;
4248 letter-spacing: 0.05em !important;
4249 font-family: 'Roboto', sans-serif !important;
4250 outline: none !important;
4251 text-decoration: none !important;
4252 cursor: pointer !important;
4253 text-transform: none !important;
4254 font-weight: 400 !important;
4255 margin-bottom: 0 !important;
4256 }
4257 .wpf_blue_btn img,
4258 .wpf_blue_btn svg,
4259 .wpf_red_btn img,
4260 .wpf_red_btn svg {
4261 height: 12px;
4262 margin-right: 6px;
4263 fill: transparent;
4264 }
4265 .wpf_green_btn svg {
4266 height: 12px;
4267 margin-right: 6px;
4268 }
4269 a#wpf_comment_mode_general_task {
4270 text-decoration: unset !important;
4271 }
4272 a#wpf_comment_mode_general_task img {
4273 margin-right: 5px;
4274 }
4275 .wpf_green_btn:hover,.wpf_green_btn:focus {
4276 background: #63d598;
4277 outline: none;
4278 }
4279 button#open_approve_modal {
4280 pointer-events: none;
4281 margin-left: 10px;
4282 }
4283 .wpf_not_approved {
4284 background: transparent !important;
4285 pointer-events: all !important;
4286 color: #272D3C !important;
4287 border: 2px solid #69DC9E !important;
4288 height: 36px;
4289 padding: 10px;
4290 margin-left: 10px;
4291 border-radius: 5px;
4292 font-weight: 500 !important;
4293 }
4294 .wpf_not_approved svg {
4295 display: none;
4296 }
4297 .wpf_screenshot_button, #wpf_bottom_bar .wpf_report_trigger a {
4298 background: #3c424f;
4299 font-size: 12px;
4300 color: rgba(255,255,255,0.99);
4301 justify-content: center;
4302 }
4303 #wpf_bottom_bar .wpf_report_trigger a {
4304 border-radius: 4px;
4305 text-decoration: none;
4306 }
4307 .wpf_blue_btn {
4308 color: rgba(255,255,255,0.99);
4309 background: #363c4d;
4310 position: relative;
4311 outline: none;
4312 }
4313 .wpf_blue_btn:hover,.wpf_blue_btn:focus,
4314 .wpf_screenshot_button:hover,.wpf_screenshot_button:focus,
4315 #wpf_bottom_bar .wpf_report_trigger a:hover,
4316 #wpf_bottom_bar .wpf_report_trigger a:focus {
4317 background: #2c3242;
4318 outline: none;
4319 color: rgba(255,255,255,0.99);
4320 }
4321 .wpf_red_btn {
4322 color: rgba(255,255,255,0.99);
4323 background: #f3325c;
4324 }
4325 .wpf_red_btn:hover,.wpf_red_btn:focus {
4326 background: #e32851;
4327 outline: none;
4328 color: rgba(255,255,255,0.99);
4329 }
4330 .wpf_bottom_right .tasks-btn .number {
4331 position: absolute;
4332 right: 1px;
4333 top: 3px;
4334 height: 22px;
4335 min-width: 22px;
4336 border: 0;
4337 background: #279af1;
4338 border-radius: 50px;
4339 font-size: 12px;
4340 font-weight: 500;
4341 color: #fff;
4342 display: flex;
4343 align-items: center;
4344 justify-content: center;
4345 letter-spacing: 0;
4346 padding: 0 4px;
4347 box-sizing: border-box;
4348 }
4349
4350 /* popup icons design start here */
4351 .wpf_comment_container .nav-tabs .nav-item.show .nav-link,
4352 .wpf_comment_container .nav-tabs .nav-link.active,
4353 .wpf_comment_container .tab-content>.active {
4354 border: 0;
4355 padding: 0;
4356 }
4357 .wpf_comment_container .nav-tabs .nav-link {
4358 padding: 0;
4359 border: 0;
4360 outline: none;
4361 box-shadow: none;
4362 position: relative;
4363 }
4364 .wpf_comment_container .nav-tabs {
4365 padding-bottom: 10px;
4366 }
4367 .wpf_comment_container .nav-tabs .nav-item {
4368 margin-right: 18px;
4369 }
4370 .wpf_comment_container .nav-tabs .nav-item svg {
4371 height: 18px;
4372 width: auto;
4373 }
4374 .popover.wpf_comment_container {
4375 box-shadow: 0 0 15px rgba(0,0,0,0.20);
4376 border-color: #fff;
4377 }
4378
4379 .wpf_comment_container .wpf_upload_button {
4380 margin-right: 10px;
4381 padding: 0;
4382 background: transparent !important;
4383 border: 0;
4384 color: #002157 !important;
4385 width: 20px;
4386 }
4387 .wpf_comment_container .wpf_upload_button img {
4388 width: 20px;
4389 margin-top: 2px;
4390 }
4391 .wpf_comment_container .arrow.wpf_arrow:after {
4392 display: none;
4393 }
4394 /*Filter*/
4395 .wpf_comment_container .tab-pane .anim-slider {
4396 margin-bottom: 8px;
4397 border-bottom: 0;
4398 }
4399 .wpf_comment_container .tab-pane .anim-slider label {
4400 font-size: 12px;
4401 }
4402 .wpf_comment_container .tab-pane .anim-slider::after {
4403 content: '';
4404 display: table;
4405 width: 100%;
4406 clear: both;
4407 background: #eaeaea;
4408 height: 8px;
4409 margin-bottom: -12px;
4410 border-radius: 8px;
4411 }
4412 .wpf_comment_container .tab-pane .anim-slider label:last-of-type::after {
4413 background: #363d4d;
4414 border: 2px solid #fff;
4415 height: 20px;
4416 width: 20px;
4417 bottom: -15px;
4418 pointer-events: none;
4419 }
4420 .wpf_comment_container .anim-slider input.low_radio + .low_label,
4421 .wpf_comment_container .anim-slider input.medium_radio + .medium_label,
4422 .wpf_comment_container .anim-slider input.high_radio + .high_label,
4423 .wpf_comment_container .anim-slider input.critical_radio + .critical_label {
4424 font-size: 12px;
4425 }
4426 .wpf_comment_container .anim-slider input:checked + label {
4427 text-decoration: none;
4428 pointer-events:none;
4429 }
4430 .wpf_comment_container .anim-slider input:checked + label:before {
4431 content: "";
4432 background-color: #373e4e;
4433 width: 5px;
4434 height: 5px;
4435 display: inline-block;
4436 margin-right: 5px;
4437 border-radius: 50%;
4438 }
4439 .wpf_comment_container .wpf_remove_login_box input[type="checkbox"] + label, .wpf_comment_container .wpf_remove_login_box input[type="radio"] + label {
4440 padding-left: 0;
4441 display: flex;
4442 align-items: center;
4443 }
4444 .wpf_comment_container .wpf_tag_autocomplete input[type=text] {
4445 border: 1px solid #e3ebf6;
4446 padding: 7px;
4447 margin: 0;
4448 height: 36px;
4449 box-sizing: border-box;
4450 }
4451 .wpf_comment_container .wpf_tag_autocomplete input[type=text]:focus {
4452 box-shadow: none !important;
4453 outline: none !important;
4454 }
4455 .wpf_comment_container .wpf_tag_autocomplete button {
4456 height: 36px;
4457 border: 0;
4458 }
4459 .wpf_comment_container .wpf_tag_autocomplete button i {
4460 top: 6px;
4461 color: #3c424f;
4462 }
4463 /*Filter*/
4464 /* comment part design start here */
4465 .wpf_comment_container .wpf_current_chat_box .wpf_author,
4466 .wpf_comment_container .wpf_current_chat_box .wpf_author .is_info,
4467 .wpf_comment_container .wpf_current_chat_box .is_image{
4468 width: 100%;
4469 border-radius: 0px 8px 8px 8px;
4470 padding: 10px 0px !important;
4471 border: 0;
4472 font-family: 'Roboto', sans-serif;
4473 }
4474
4475 .wpf_comment_container .wpf_current_chat_box .wpf_author {
4476 width: 95%;
4477 }
4478
4479 /* rich text editor css by Pratap */
4480 .wpf-editor {
4481 min-height: 80px;
4482 width: 100%;
4483 background: #ecf3f9;
4484 border-radius: 8px;
4485 font-family: 'Roboto', sans-serif !important;
4486 color: #4a5568 !important;
4487 font-size: 14px !important;
4488 text-transform: unset;
4489 font-weight: normal;
4490 height: auto;
4491 line-height: 1.2 !important;
4492 max-width: 100%;
4493 min-width: 100%;
4494 display: block;
4495 box-shadow: none !important;
4496 outline: none !important;
4497 box-sizing: border-box;
4498 }
4499 .wpf-editor .ql-editor {
4500 min-height: 80px;
4501 max-height: 80px;
4502 overflow-y: auto;
4503 overflow-x: hidden;
4504 padding: 10px 15px 10px 15px;
4505 }
4506 .wpf-editor .ql-editor p {
4507 font-family: 'Roboto', sans-serif !important;
4508 color: #4a5568 !important;
4509 font-size: 14px !important;
4510 text-transform: unset;
4511 font-weight: normal;
4512 line-height: 1.2 !important;
4513 }
4514 .wpf-tc-editor {
4515 min-height: 100px;
4516 border: none;
4517 width: 100%;
4518 box-sizing: border-box;
4519 }
4520 .wpf-tc-editor .ql-editor {
4521 min-height: 100px;
4522 max-height: 100px;
4523 overflow-y: auto;
4524 overflow-x: hidden;
4525 padding: 10px;
4526 }
4527 .ql-tooltip-editor input[type="text"] {
4528 margin-top: 0 !important;
4529 }
4530 .meassage_area_main ol, .meassage_area_main ul {
4531 padding-inline-start: 12px;
4532 }
4533 .meassage_area_main ol {
4534 margin-left: 2px;
4535 }
4536 .meassage_area_main ul {
4537 list-style-type: disc;
4538 margin-left: 4px;
4539 }
4540 #wpf_comment {
4541 display: none;
4542 }
4543 .wpf_comment_container .form-group textarea.form-control {
4544 display: none;
4545 font-family: 'Roboto', sans-serif !important;
4546 color: #4a5568 !important;
4547 font-size: 12px !important;
4548 }
4549
4550 .wpf_comment_container .wpf_current_chat_box .is_image {
4551 padding: 0;
4552 max-width: 95%;
4553 overflow: hidden;
4554 }
4555 li.wpf_other.is_image a {
4556 display: block;
4557 }
4558 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main {
4559 border-radius: 8px;
4560 background: #edf3ff;
4561 max-width: 100%;
4562 width: auto !important;
4563 overflow: hidden;
4564 padding: 5px;
4565 position: relative;
4566 }
4567 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main:hover:before {
4568 content: "";
4569 background-color: rgb(59 54 106 / 50%);
4570 position: absolute;
4571 height: 100%;
4572 width: 100%;
4573 top: 0;
4574 bottom: 0;
4575 left: 0;
4576 right: 0;
4577 z-index: 1;
4578 -webkit-animation-name: fadeIn;
4579 animation-name: fadeIn;
4580 -webkit-animation-duration: 0.5s;
4581 animation-duration: 0.5s;
4582 -webkit-animation-fill-mode: both;
4583 animation-fill-mode: both;
4584 }
4585
4586 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main .wpf_image_open {
4587 position: absolute;
4588 left: 48%;
4589 top: 50%;
4590 transform: translate(-50%, -50%);
4591 display: flex;
4592 cursor: pointer;
4593 opacity: 0;
4594 margin-left: 10px;
4595 -webkit-transition: all 0.2s ease-out;
4596 -moz-transition: all 0.2s ease-out;
4597 -ms-transition: all 0.2s ease-out;
4598 -o-transition: all 0.2s ease-out;
4599 transition: all 0.2s ease-out;
4600 }
4601 span.wpf_image_open:hover:after {
4602 content: "Open Image in New Window";
4603 position: absolute;
4604 width: 170px;
4605 background-color: #fff;
4606 margin-left: -60px;
4607 text-align: center;
4608 border-radius: 5px;
4609 margin-top: 30px;
4610 }
4611 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main .wpf_image_open svg {
4612 height: 24px;
4613 width: auto;
4614 }
4615 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main .wpf_image_download {
4616 position: absolute;
4617 left: 40%;
4618 top: 50%;
4619 transform: translate(-50%, -50%);
4620 display: flex;
4621 cursor: pointer;
4622 opacity: 0;
4623 -webkit-transition: all 0.2s ease-out;
4624 -moz-transition: all 0.2s ease-out;
4625 -ms-transition: all 0.2s ease-out;
4626 -o-transition: all 0.2s ease-out;
4627 transition: all 0.2s ease-out;
4628 }
4629 span#wpf_push_media:hover:after {
4630 content: "Push Image to Media Folder";
4631 position: absolute;
4632 width: 170px;
4633 background-color: #fff;
4634 margin-left: -60px;
4635 text-align: center;
4636 border-radius: 5px;
4637 margin-top: 30px;
4638 }
4639
4640 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main .wpf_image_download svg {
4641 height: 24px;
4642 width: auto;
4643 }
4644 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main .wpf_image_delete {
4645 position: absolute;
4646 top: 6px;
4647 right: 6px;
4648 cursor: pointer;
4649 opacity: 0;
4650 -webkit-transition: all 0.2s ease-out;
4651 -moz-transition: all 0.2s ease-out;
4652 -ms-transition: all 0.2s ease-out;
4653 -o-transition: all 0.2s ease-out;
4654 transition: all 0.2s ease-out;
4655 }
4656 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main .wpf_image_delete svg {
4657 height: 16px;
4658 width: 16px;
4659 fill: #fff;
4660 color: #fff;
4661 }
4662 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main:hover .wpf_image_download,
4663 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main:hover .wpf_image_delete,
4664 .wpf_comment_container .wpf_current_chat_box .is_image .meassage_area_main:hover .wpf_image_open {
4665 opacity: 1;
4666 z-index: 1;
4667 }
4668 .wpf_current_chat_box .meassage_area_main img:hover {
4669 box-shadow: none;
4670 }
4671 .wpf_comment_container .wpf_current_chat_box .task-author {
4672 font-weight: 500;
4673 line-height: 1;
4674 font-size: 14px;
4675 color: #A4ABC5;
4676 display: flex;
4677 justify-content: space-between;
4678 }
4679 .wpf_comment_container .wpf_current_chat_box .task-author .author-name {
4680 max-width: 150px;
4681 line-height: 18px;
4682 position: relative;
4683 overflow: hidden;
4684 white-space: nowrap;
4685 text-overflow: ellipsis;
4686 }
4687 .wpf_comment_container .wpf_current_chat_box .task-author span {
4688 margin-top: 2px;
4689 margin-right: 0;
4690 font-size: 14px;
4691 color: #A4ABC5;
4692 font-weight: 400;
4693 text-transform: lowercase !important;
4694 }
4695 .wpf_comment_container .wpf_current_chat_box .is_info {
4696 border-radius: 5px !important;
4697 width: 95% !important;
4698 text-align: left !important;
4699 }
4700 .wpf_comment_container .wpf_current_chat_box .is_info level.task-author {
4701 float: right !important;
4702 }
4703 .wpf_comment_container .wpf_current_chat_box .is_info .task-author,
4704 .wpf_comment_container .wpf_current_chat_box .is_info p {
4705 color: #4a5568;
4706 }
4707 .wpf_comment_container .wpf_current_chat_box .is_info .meassage_area_main span.taskStatusMsg {
4708 font-weight: 700;
4709 }
4710 .wpf_comment_container .wpf_current_chat_box .is_info .meassage_area_main {
4711 text-align: left;
4712 }
4713 .wpf_comment_container .form-group {
4714 position: relative;
4715 }
4716 .wpf_comment_container .form-group textarea.form-control {
4717 background: #ecf3f9;
4718 border-radius: 8px;
4719 padding: 15px;
4720 border: 0;
4721 }
4722 /* Menu bar CSS start by Pratap */
4723 .avc_menu_wrapper {
4724 position: inherit;
4725 top: 32px;
4726 left: -72px;
4727 width: 70px !important;
4728 height: 100% !important;
4729 background: #2f326a;
4730 overflow-x: hidden;
4731 transition: 0.8s !important;
4732 }
4733 .avc_menu_wrapper::-webkit-scrollbar {
4734 width: 5px;
4735 }
4736 .avc_menu_wrapper::-webkit-scrollbar-thumb {
4737 background: #e3ebf6c9;
4738 border-radius: 50px;
4739 }
4740 .avc_menu_wrapper::-webkit-scrollbar-track {
4741 background: white;
4742 }
4743 .avc_menu_container {
4744 padding-top: 10px !important;
4745 width: 100%;
4746 height: inherit;
4747 box-sizing: border-box;
4748 }
4749 .avc_menu_container a {
4750 outline: none !important;
4751 line-height: 0px !important;
4752 width: 100%;
4753 text-align: center;
4754 }
4755 .avc_each_menu {
4756 position: relative;
4757 cursor: pointer;
4758 display: flex;
4759 padding: 12px 0px !important;
4760 justify-content: center;
4761 }
4762 .avc_each_menu:hover {
4763 background-color: rgba(0, 0, 0, 0.15) !important;
4764 }
4765 .avc-menu-beta-tag {
4766 top: 4px;
4767 color: #fff;
4768 display: inline-block;
4769 padding: 1px 4px;
4770 position: absolute;
4771 font-size: 10px;
4772 font-family: Roboto, Helvetica, Arial, sans-serif;
4773 font-weight: 700;
4774 margin-left: 17px;
4775 border-radius: 3px;
4776 line-height: 12px;
4777 background-color: #279AF1;
4778 }
4779 @media (max-width: 1500px) {
4780 .avc_menu_wrapper {
4781 top: 45px;
4782 }
4783 }
4784 /* Menu bar CSS ends */
4785
4786 /* Bottom Bar */
4787 #wpf_bottom_bar {
4788 background: #fff;
4789 position: fixed;
4790 left: 0;
4791 right: 0;
4792 bottom: 0;
4793 width: 100%;
4794 max-width: 100vw !important;
4795 padding: 0;
4796 display: flex;
4797 flex-wrap: wrap;
4798 align-items: center;
4799 z-index: 2147483647;
4800 transition: 0.8s !important;
4801 border-top: 1px solid #efefef;
4802 }
4803 #wpf_bottom_bar .wpf_row {
4804 display: flex;
4805 height: 54px;
4806 margin-top: 4px;
4807 width: 100%;
4808 align-items: center;
4809 justify-content: space-between;
4810 font-family: 'Roboto', sans-serif !important;
4811 }
4812 #wpf_bottom_bar .wpf_progress_bar {
4813 width: 100%;
4814 display: flex;
4815 position: absolute;
4816 top: 0;
4817 }
4818 #wpf_bottom_bar .wpf_progress_bar .red-pb,
4819 #wpf_bottom_bar .wpf_progress_bar .blue-pb,
4820 #wpf_bottom_bar .wpf_progress_bar .yellow-pb,
4821 #wpf_bottom_bar .wpf_progress_bar .green-pb {
4822 height: 5px;
4823 }
4824 #wpf_bottom_bar .wpf_progress_bar .red-pb {
4825 background: #e54f6d;
4826 }
4827 #wpf_bottom_bar .wpf_progress_bar .blue-pb {
4828 background: #363c4d;
4829 }
4830 #wpf_bottom_bar .wpf_progress_bar .orange-pb {
4831 background: #ffa532;
4832 }
4833 #wpf_bottom_bar .wpf_progress_bar .yellow-pb {
4834 background: #fcd227;
4835 }
4836 #wpf_bottom_bar .wpf_progress_bar .green-pb {
4837 background: #69dc9e;
4838 }
4839 .wpf_btn_hover:hover {
4840 background-color: #ECF3F9 !important;
4841 }
4842 #wpf_bottom_bar .footer-logo {
4843 margin-left: 10px;
4844 max-height: 35px;
4845 max-width: 120px;
4846 overflow: hidden;
4847 display: flex;
4848 justify-content: center;
4849 align-items: center;
4850 }
4851 #wpf_bottom_bar .footer-logo a {
4852 line-height: normal !important;
4853 }
4854 #wpf_bottom_bar .footer-logo img {
4855 width: 100%;
4856 }
4857 #wpf_bottom_bar .arrow-down, #wpf_bottom_bar #wpf_app_dashboard {
4858 border: 1px solid #A4ABC5;
4859 background: #fff;
4860 height: 36px;
4861 width: 36px;
4862 border-radius: 5px;
4863 display: flex;
4864 align-items: center;
4865 justify-content: center;
4866 cursor: pointer;
4867 margin-left: 10px;
4868 outline: none;
4869 }
4870 #wpf_bottom_bar .arrow-down:hover,#wpf_bottom_bar .arrow-down:focus {
4871 outline: none;
4872 }
4873 #wpf_bottom_bar .arrow-down img {
4874 width: 22px;
4875 }
4876 #wpf_bottom_bar .wpf_bottom_left,
4877 #wpf_bottom_bar .wpf_bottom_right,
4878 #wpf_bottom_bar .wpf_bottom_middle {
4879 display: flex;
4880 flex-wrap: wrap;
4881 align-items: center;
4882 }
4883 #wpf_bottom_bar .wpf_bottom_middle {
4884 justify-content: center;
4885 }
4886 #wpf_bottom_bar .wpf_bottom_right {
4887 justify-content: flex-end;
4888 }
4889 #wpf_bottom_bar .tasks-btn {
4890 margin: 0 10px;
4891 }
4892 #wpf_bottom_bar .wpf_comment_btn {
4893 margin: 0 12px;
4894 }
4895 a#wpf_comment_mode_general_task svg path {
4896 stroke: #363d4d !important;
4897 }
4898 .wpf_bottom_middle .icons-block {
4899 text-align: center;
4900 margin: 0;
4901 padding: 0;
4902 list-style: none;
4903 display: flex;
4904 align-items: flex-end;
4905 }
4906 .wpf_bottom_middle .icons-block li {
4907 text-align: center;
4908 margin: 0 12px;
4909 }
4910 .wpf_bottom_middle .icons-block li a {
4911 color: #4a5568;
4912 font-family: 'Roboto', sans-serif;
4913 font-size: 12px;
4914 text-decoration: none;
4915 }
4916 .wpf_bottom_middle .icons-block li a:hover span,
4917 .wpf_bottom_middle .icons-block li a.wpf_active span {
4918 color: #279af1;
4919 }
4920 .wpf_bottom_middle .icons-block li svg {
4921 display: flex;
4922 margin: 0 auto;
4923 height: 16px;
4924 width: auto;
4925 margin-bottom: 3px;
4926 fill: transparent;
4927 }
4928 .wpf_bottom_middle .icons-block .pro svg {
4929 height: 16px;
4930 width: 16px;
4931 }
4932 .wpf_bottom_middle .icons-block li span {
4933 display: block;
4934 line-height: normal;
4935 }
4936 .wpf_icon_box .wpf_icon_title {
4937 display: flex;
4938 align-items: center;
4939 }
4940 .wpf_icon_title svg {
4941 width: auto;
4942 height: 18px;
4943 margin-right: 6px;
4944 }
4945 /* Share version 2 css by Pratap start */
4946 .avc_invite_share_wrapper {
4947 position: fixed;
4948 top: 0;
4949 left: 0;
4950 display: none;
4951 justify-content: center;
4952 align-items: center;
4953 height: 100vh;
4954 width: 100vw;
4955 background-color: rgba(255, 255, 255, 0.85) !important;
4956 }
4957 .avc_close_share_container {
4958 position: -webkit-sticky;
4959 position: sticky;
4960 top: -10px;
4961 text-align: end;
4962 margin-bottom: 5px;
4963 margin-top: -10px;
4964 }
4965 .avc_close_share_container span {
4966 display: inline-block;
4967 color: #e54f6d !important;
4968 font-size: 38px;
4969 line-height: 18px !important;
4970 transform: rotate(45deg);
4971 text-shadow: 0 1px 0 #fff;
4972 cursor: pointer;
4973 margin-right: -10px;
4974 }
4975 .avc_invite_share_icon {
4976 text-align: center;
4977 line-height: 0px;
4978 }
4979 .avc_invite_share_icon img {
4980 width: 60px;
4981 height: 60px;
4982 }
4983 .avc_invite_title {
4984 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
4985 font-style: normal;
4986 font-weight: 500;
4987 font-size: 18px;
4988 line-height: 23px;
4989 color: #272D3C;
4990 text-align: center;
4991 margin-top: 15px;
4992 margin-bottom: 10px;
4993 }
4994 .avc_invite_subtitle {
4995 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
4996 font-style: normal;
4997 font-weight: 400;
4998 font-size: 14px;
4999 line-height: 16px;
5000 color: #272D3C;
5001 text-align: center;
5002 margin-bottom: 25px;
5003 }
5004 .avc_invite_share_container {
5005 width: 90%;
5006 max-height: 90vh;
5007 max-width: 672px;
5008 box-shadow: 0em 0em 3em 0em rgba(0,0,0,0.13);
5009 padding: 25px !important;
5010 border-radius: 10px;
5011 border: 1px solid #ECF3F9;
5012 background-color: #fff !important;
5013 overflow-y: auto;
5014 -ms-overflow-style: none;
5015 scrollbar-width: none;
5016 -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
5017 animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
5018 box-sizing: border-box;
5019 }
5020 .avc_invite_share_container::-webkit-scrollbar {
5021 display: none;
5022 }
5023 .avc_invite_wrapper {
5024 max-height: 20vh;
5025 overflow: auto;
5026 }
5027 .avc_invite_wrapper::-webkit-scrollbar, .avc_shared_user_list::-webkit-scrollbar {
5028 width: 5px;
5029 }
5030 .avc_invite_wrapper::-webkit-scrollbar-thumb, .avc_shared_user_list::-webkit-scrollbar-thumb {
5031 background: #e3ebf6c9;
5032 border-radius: 50px;
5033 }
5034 .avc_invite_wrapper::-webkit-scrollbar-track, .avc_shared_user_list::-webkit-scrollbar-track {
5035 background: white;
5036 }
5037 .avc_each_invite {
5038 display: flex;
5039 justify-content: space-between;
5040 align-items: center;
5041 padding: 10px !important;
5042 border: 1px solid #EFF2F6;
5043 border-radius: 5px;
5044 }
5045 .avc_each_invite:not(:first-child) {
5046 margin-top: 5px;
5047 }
5048 .avc_invite_fields {
5049 display: flex;
5050 width: 87%;
5051 }
5052 .avc_each_invite input {
5053 min-height: 36px !important;
5054 padding: 0 8px !important;
5055 line-height: 2;
5056 font-size: 14px !important;
5057 border-radius: 4px !important;
5058 border: 1px solid rgba(0, 0, 0, 0.23) !important;
5059 background-color: #fff !important;
5060 color: #2c3338 !important;
5061 width: 50% !important;
5062 box-sizing: border-box;
5063 }
5064 .avc_each_invite input::-webkit-input-placeholder { /* Edge */
5065 color: #ccc;
5066 font-weight: 400 !important;
5067 font-size: 14px;
5068 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5069 }
5070 .avc_each_invite input:-ms-input-placeholder { /* Internet Explorer 10-11 */
5071 color: #ccc;
5072 font-weight: 400 !important;
5073 font-size: 14px;
5074 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5075 }
5076 .avc_each_invite input::placeholder {
5077 color: #ccc;
5078 font-weight: 400 !important;
5079 font-size: 14px;
5080 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5081 }
5082 .avc_invite_name {
5083 margin-right: 10px;
5084 }
5085 .avc_add_remove_invite {
5086 display: flex;
5087 justify-content: flex-end;
5088 align-items: center;
5089 flex: 1;
5090 }
5091 .avc_add_invite, .avc_remove_invite {
5092 border-radius: 50% !important;
5093 color: #000 !important;
5094 font-size: 0.875rem !important;
5095 box-shadow: 0px 0px 0px 0px !important;
5096 box-sizing: border-box !important;
5097 transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms !important;
5098 font-family: "Roboto", "Helvetica", "Arial", sans-serif !important;
5099 font-weight: 500 !important;
5100 letter-spacing: 0.02857em !important;
5101 text-transform: uppercase;
5102 border: 0 !important;
5103 margin: 0 !important;
5104 display: inline-flex !important;
5105 outline: 0 !important;
5106 position: relative;
5107 align-items: center;
5108 user-select: none;
5109 vertical-align: middle;
5110 -moz-appearance: none;
5111 justify-content: center;
5112 -webkit-appearance: none;
5113 -webkit-tap-highlight-color: transparent;
5114 padding: 1px 6px !important;
5115 cursor: pointer !important;
5116 }
5117 .avc_add_invite {
5118 width: 36px !important;
5119 height: 36px !important;
5120 background-color: #ECF3F9 !important;
5121 }
5122 .avc_remove_invite {
5123 visibility: hidden;
5124 background-color: unset !important;
5125 padding-right: 0px !important;
5126 }
5127 .avc_add_invite:hover {
5128 background-color: #D5E2F3 !important;
5129 }
5130 .avc_add_inivite_svg, .avc_remove_inivite_svg {
5131 fill: currentColor;
5132 width: 1em;
5133 display: inline-block;
5134 font-size: 1.2rem;
5135 transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
5136 flex-shrink: 0;
5137 user-select: none;
5138 }
5139 .avc_add_inivite_svg {
5140 height: 1em;
5141 }
5142 #send_invite {
5143 display: flex;
5144 justify-content: center;
5145 align-items: center;
5146 background-color: #ECF3F9;
5147 color: rgba(0, 0, 0, 0.26);
5148 font-weight: 500;
5149 font-size: 14px;
5150 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5151 border-radius: 5px;
5152 padding: 0px 16px !important;
5153 width: 100%;
5154 min-height: 36px;
5155 width: 110px !important;
5156 margin-top: 15px;
5157 margin-bottom: 15px;
5158 margin-left: auto;
5159 box-sizing: border-box;
5160 }
5161 .send_invite_active {
5162 background-color: #3ed696 !important;
5163 color: #272d3c !important;
5164 cursor: pointer;
5165 }
5166 .send_invite_active:hover {
5167 background-color: #33bf84 !important;
5168 }
5169 .avc_invite_error_container, .avc_suc_err_container {
5170 position: fixed;
5171 top: 50px;
5172 right: -375px;
5173 }
5174 .avc_invite_error_msg1, .avc_invite_error_msg2, .avc_invite_error_msg3, .avc_invite_error_msg4 {
5175 display: flex;
5176 align-items: center;
5177 font-size: 16px;
5178 font-weight: 400;
5179 color: #272D3C;
5180 box-shadow: 0 4px 4px 0 rgba(0,0,0,.25);
5181 padding: 15px 15px !important;
5182 margin-bottom: 20px;
5183 border-radius: 5px;
5184 background-color: #fff;
5185 }
5186 .avc_succ_icon {
5187 width: 26px;
5188 height: 26px;
5189 background-color: #3ed696;
5190 position: relative;
5191 border-radius: 50%;
5192 margin-right: 10px;
5193 }
5194 .avc_succ_icon:before {
5195 content: '';
5196 position: absolute;
5197 width: 9px;
5198 height: 4px;
5199 background-color: white;
5200 top: 13px;
5201 -webkit-transform: rotate(45deg);
5202 -moz-transform: rotate(45deg);
5203 transform: rotate(45deg);
5204 left: 4px;
5205 border-radius: 1px;
5206 }
5207 .avc_succ_icon:after {
5208 content: '';
5209 position: absolute;
5210 width: 14px;
5211 height: 4px;
5212 background-color: white;
5213 top: 11px;
5214 -webkit-transform: rotate(-45deg);
5215 -moz-transform: rotate(-45deg);
5216 transform: rotate(-45deg);
5217 right: 4px;
5218 border-radius: 1px;
5219 }
5220 .avc_err_icon {
5221 width: 26px;
5222 height: 26px;
5223 background-color: #E72D67;
5224 position: relative;
5225 border-radius: 50%;
5226 margin-right: 10px;
5227 }
5228 .avc_err_icon:before {
5229 content: '';
5230 position: absolute;
5231 width: 16px;
5232 height: 4px;
5233 background-color: white;
5234 top: 11px;
5235 -webkit-transform: rotate(45deg);
5236 -moz-transform: rotate(45deg);
5237 transform: rotate(45deg);
5238 left: 5px;
5239 border-radius: 1px;
5240 }
5241 .avc_err_icon:after {
5242 content: '';
5243 position: absolute;
5244 width: 16px;
5245 height: 4px;
5246 background-color: white;
5247 top: 11px;
5248 -webkit-transform: rotate(-45deg);
5249 -moz-transform: rotate(-45deg);
5250 transform: rotate(-45deg);
5251 right: 5px;
5252 border-radius: 1px;
5253 }
5254 .avc_red_border {
5255 border: 2px solid #e54f6d !important;
5256 }
5257 .avc_shared_container {
5258 margin-bottom: 25px;
5259 }
5260 .avc_shared_user_list {
5261 max-height: 25vh;
5262 overflow: auto;
5263 }
5264 .avc_share_or, .avc_invited_user_title {
5265 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5266 color: #272D3C;;
5267 width: 100%;
5268 height: 22px;
5269 font-size: 14px;
5270 font-weight: 500;
5271 margin-bottom: 10px;
5272 }
5273 .avc_invited_user {
5274 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5275 padding: 10px !important;
5276 border: 1px solid #EFF2F6;
5277 border-radius: 5px;
5278 }
5279 .avc_invited_user:not(:last-child) {
5280 margin-bottom: 5px;
5281 }
5282 .avc_ivi_user_img {
5283 min-width: 45px;
5284 height: 45px;
5285 width: 45px;
5286 border-radius: 50%;
5287 display: flex;
5288 align-items: center;
5289 justify-content: center;
5290 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5291 font-size: 18px;
5292 font-weight: 500;
5293 line-height: 1;
5294 color: #fff;
5295 text-transform: uppercase;
5296 background-color: rgb(103, 174, 63);
5297 }
5298 .avc_ivi_user_info {
5299 display: flex;
5300 align-items: center;
5301 flex-grow: 1;
5302 }
5303 .avc_ivi_user_name {
5304 margin-left: 15px;
5305 font-size: 14px;
5306 font-weight: 400;
5307 color: #A4ABC5;
5308 }
5309 .avc_ivi_user_name span {
5310 color: #272D3C;
5311 }
5312 .avc_user_share_action {
5313 display: flex;
5314 align-items: center;
5315 margin-left: auto;
5316 font-size: 14px !important;
5317 font-weight: 500 !important;
5318 }
5319 .avc_delete_ivi_user {
5320 cursor: pointer;
5321 margin-right: 15px;
5322 color: #E72D67;
5323 }
5324 .avc_share_button {
5325 width: 130px;
5326 }
5327 .avc_share_page_link_input {
5328 position: absolute;
5329 z-index: -999;
5330 opacity: 0;
5331 }
5332 .avc_copy_link_icon {
5333 display: flex;
5334 align-items: center;
5335 text-decoration: unset !important;
5336 padding: 8px 12px !important;
5337 border: 1px solid#8791B2;
5338 border-radius: 5px;
5339 height: 36px !important;
5340 box-sizing: border-box;
5341 color: #272D3C !important;
5342 }
5343 .avc_copy_link_icon:hover {
5344 background-color: #ECF3F9;
5345 }
5346 .avc_copy_link_icon img {
5347 margin-right: 5px;
5348 }
5349 .avc_share_page_container {
5350 display: flex;
5351 align-items: center;
5352 border: 1px solid #EFF2F6;
5353 height: 45px;
5354 border-radius: 5px;
5355 }
5356 .avc_share_page_icon {
5357 width: 45px;
5358 border-right: 1px solid #EFF2F6;
5359 display: flex;
5360 align-items: center;
5361 justify-content: center;
5362 height: 100%;
5363 }
5364 .avc_share_page_icon img {
5365 width: 18px;
5366 height: 18px;
5367 }
5368 .avc_share_link_container {
5369 display: flex;
5370 flex-grow: 1;
5371 align-items: center;
5372 justify-content: space-between;
5373 padding: 5px 5px 5px 15px !important;
5374 box-sizing: border-box;
5375 }
5376 .avc_share_link {
5377 font-family: "Roboto", "Helvetica", "Arial", sans-serif;
5378 font-size: 14px;
5379 font-weight: 500;
5380 color: #A4ABC5;
5381 }
5382 .avc_copy_pagelink {
5383 display: flex !important;
5384 align-items: center !important;
5385 justify-content: center !important;
5386 text-decoration: unset !important;
5387 font-family: "Roboto", "Helvetica", "Arial", sans-serif !important;
5388 font-size: 14px !important;
5389 font-weight: 500 !important;
5390 color: #272D3C !important;
5391 width: 55px !important;
5392 height: 36px !important;
5393 background-color: #3ED696 !important;
5394 border-radius: 5px !important;
5395 }
5396 a.avc_copy_pagelink {
5397 color: #272D3C !important;
5398 }
5399 .avc_invite_success, .avc_delete_success, .avc_invite_fail {
5400 display: none;
5401 align-items: center;
5402 font-size: 16px;
5403 font-weight: 400;
5404 color: #272D3C;
5405 box-shadow: 0 4px 4px 0 rgba(0,0,0,.25);
5406 padding: 15px 15px !important;
5407 margin-bottom: 20px;
5408 border-radius: 5px;
5409 background-color: #fff;
5410 }
5411 .avc_hidden_user_structure {
5412 display: none;
5413 }
5414 /* End */
5415
5416 .wpf-graphics-modal .wpf_inner_container,
5417 .wpf_inner_container .img_desc {
5418 text-align:left;
5419 }
5420 .wpf_inner_container .img_desc {
5421 margin-top: 15px;
5422 display: inline-block;
5423 width: 100%;
5424 }
5425
5426
5427 /*wpf_bottom_filter-Desing css Start-*/
5428 #wpf_bottom_bar #wpf_bottom_filter {
5429 position: relative;
5430 width: 100%;
5431 }
5432 #wpf_bottom_bar #wpf_bottom_filter .wpf_list, #wpf_bottom_bar #wpf_site_milestone_wpf_list {
5433 position: absolute;
5434 border-radius: 5px 5px 0px 0px;
5435 padding: 0 8px 10px;
5436 max-width: 350px;
5437 width: 100%;
5438 background: #fff;
5439 font-family: 'Roboto', sans-serif !important;
5440 }
5441
5442 #wpf_bottom_bar #wpf_bottom_filter .wpf_list.wpf_active, #wpf_bottom_bar #wpf_site_milestone_wpf_list.wpf_active {
5443 animation: fade-in-bottom 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
5444 border: 1px solid #d3d4d4;
5445 border-bottom: none;
5446 bottom: 46px;
5447 }
5448 #wpf_bottom_bar #wpf_site_milestone_wpf_list > .milestone_item_container > .milestone_item_container_header {
5449 display: flex;
5450 justify-content: space-between;
5451 }
5452 #wpf_bottom_bar #wpf_bottom_filter #wpf_task_status_filter_btn{
5453 margin-left: -91px;
5454 }
5455 #wpf_bottom_bar #wpf_bottom_filter #wpf_task_priority_filter_btn{
5456 margin-left: -32px;
5457 }
5458 #wpf_bottom_bar #wpf_bottom_filter #wpf_task_visibility {
5459 margin-left: -35px;
5460 }
5461 #wpf_bottom_bar #wpf_bottom_filter #wpf_report_btn {
5462 margin-left: 33px;
5463 }
5464 #wpf_bottom_bar #wpf_bottom_filter #wpf_share_page_btn {
5465 margin-left: 93px;
5466 }
5467 #wpf_bottom_bar #wpf_site_milestone_wpf_list {
5468 margin-left: 18em;
5469 }
5470 ul.wp_feedback_filter_checkbox label {
5471 display: flex !important;
5472 justify-content: flex-start;
5473 align-items: center;
5474 font-size: 14px !important;
5475 }
5476 .wpf_comment_btn {
5477 background : #69DC9E !important;
5478 color: #272d3c !important;
5479 margin-left: 10px;
5480 font-weight: 500 !important;
5481 font-size: 16px !important;
5482 height: 40px !important;
5483 }
5484 .wpf_comment_btn.task_comment {
5485 height: 35px !important;
5486 width: 35px !important;
5487 font-size: 16px !important;
5488 position: relative;
5489 padding: 0px !important;
5490 display: flex;
5491 justify-content: center;
5492 align-items: center;
5493 }
5494 .wpf_comment_btn.task_comment img {
5495 height: 24px;
5496 }
5497 .wpf_comment_btn.task_comment.guest_comment {
5498 width: 95px !important;
5499 }
5500 .wpf_comment_btn:hover {
5501 background : #56c78a !important;
5502 }
5503 #wpf_bottom_bar .wpf_comment_btn {
5504 background : var(--main-wpf-color) !important;
5505 color: #fff !important;
5506 }
5507 #wpf_bottom_bar .wpf_comment_btn img {
5508 height: 18px;
5509 margin-right: 5px;
5510 }
5511 .wpf_comment_btn svg {
5512 color: white;
5513 height: 20px;
5514 }
5515 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_filter_title,
5516 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_visibility_title,
5517 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_sidebar_checkboxes label,
5518 #wpf_bottom_bar #wpf_bottom_filter .wpf_list label.wpf_reports_title,
5519 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_icon_title {
5520 font-family: 'Roboto';
5521 font-style: normal;
5522 font-weight: 400;
5523 font-size: 14px;
5524
5525 }
5526 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_filter_title {
5527 margin-bottom: 0;
5528 }
5529 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_sidebar_checkboxes label {
5530 padding-left: 0;
5531 display: flex;
5532 align-items: center;
5533 }
5534 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_filter_title svg {
5535 height: 12px;
5536 width: auto;
5537 }
5538 #wpf_bottom_bar #wpf_bottom_filter .wpf_filter_checkbox {
5539 padding: 0;
5540 margin: 0;
5541 }
5542 #wpf_bottom_bar #wpf_bottom_filter .wpf_filter_checkbox input + label:before,
5543 #wpf_bottom_bar .wpf_remove_login_box label.wpf_remove_login_label:before,
5544 #wpf_bottom_bar #wpf_bottom_filter .wpf_sidebar_checkboxes input[type="checkbox"] + label:before,
5545 .wpf_comment_container .tab-content label.wpf_remove_login_label::before
5546
5547 {
5548 margin-left: 0;
5549 margin-bottom: 0;
5550 margin-right: 6px;
5551 }
5552 .wpf_visibility_container {
5553 height: 36px;
5554 width: 36px;
5555 box-sizing: border-box;
5556 border: 1px solid #A4ABC5;
5557 border-radius: 5px;
5558 display: flex;
5559 justify-content: center;
5560 align-items: center;
5561 cursor: pointer;
5562 margin-left: 10px;
5563 position: relative;
5564 }
5565 #wpf_task_visibility {
5566 position: absolute;
5567 top: -130px;
5568 right: 0;
5569 height: 110px;
5570 width: 165px;
5571 background: #FFFFFF;
5572 box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.27);
5573 border-radius: 5px;
5574 transition: opacity 244ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 163ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
5575 padding: 15px !important;
5576 box-sizing: border-box;
5577 display: none;
5578 flex-direction: column;
5579 justify-content: space-between;
5580 }
5581 #wpf_task_visibility .wpf_sidebar_checkboxes input[type="checkbox"] + label:before {
5582 min-height: 18px;
5583 min-width: 18px;
5584 }
5585 #wpf_task_visibility input[type=checkbox] + label {
5586 font-family: 'Roboto';
5587 font-style: normal;
5588 font-weight: 400;
5589 font-size: 14px !important;
5590 color: #000;
5591 }
5592 .wpf_comment_mode_general_task {
5593 height: 36px;
5594 color: #272D3C !important;
5595 border: 2px solid #69DC9E !important;
5596 width: 100px;
5597 display: flex;
5598 justify-content: center;
5599 align-items: center;
5600 border-radius: 5px;
5601 font-family: 'Roboto' !important;
5602 font-style: normal;
5603 font-weight: 500 !important;
5604 font-size: 14px !important;
5605 box-sizing: border-box;
5606 margin-left: 10px;
5607 }
5608
5609 #wpf_bottom_bar #wpf_bottom_filter .wpf_filter_checkbox input:checked + label::after,
5610 .wpf_comment_container .tab-content .wpf_remove_login_box input:checked + label::after
5611 {
5612 top: 3px;
5613 left: 7px;
5614 }
5615
5616 #wpf_bottom_bar #wpf_bottom_filter .wpf_filter_checkbox input[type=radio] + label, #wpf_bottom_bar .wpf_remove_login_box input[type=checkbox] + label, #wpf_bottom_bar .wpf_remove_login_box input[type=radio] + label {
5617 padding-left: 0;
5618 display: flex;
5619 align-items: center;
5620 font-weight: 700;
5621 letter-spacing: 0.5px;
5622 }
5623
5624 /*--checkbox---design start here-*/
5625 ul.wp_feedback_filter_checkbox.user label {
5626 padding-left: 0;
5627 margin: 0;
5628 margin-top: 5px;
5629 padding: 0;
5630 }
5631 ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:before,
5632 div#wpf_wizard_notifications input:checked + label:before {
5633 margin-left: 0;
5634 height: 15px;
5635 width: 16px;
5636 }
5637 ul.wp_feedback_filter_checkbox.user input[type="checkbox"]:checked + label:after {
5638 left: 7px !important;
5639 top: 3px !important;
5640 }
5641 div#wpf_wizard_notifications input:checked + label:after {
5642 left: 6px;
5643 }
5644 /*--Circle---design start here-*/
5645 .pending-review_custom {
5646 font-weight: 500;
5647 color: rgba(0,0,0,0.9) !important;
5648 }
5649 .wpf_tasks-list .wpf_task_meta {
5650 display: none;
5651 }
5652 /**/
5653
5654 /*Chat box radius*/
5655 .wpf_current_chat_box .wpf_other {
5656 border-radius: 8px 0px 8px 8px;
5657 }
5658 .wpf_page_loader {
5659 position: absolute;
5660 z-index: 1999;
5661 width: 100%;
5662 overflow: visible;
5663 margin: auto;
5664 top: 0;
5665 left: 0;
5666 bottom: 0;
5667 right: 0;
5668 background-image: url(../images/Loader-slider-WPFeedback.svg);
5669 background-repeat: no-repeat;
5670 background-position: center center;
5671 background-color: rgba(255, 255, 255, 0.5);
5672 background-size: 40px;
5673 }
5674 /*Chat box radius End*/
5675
5676 /* Scroll */
5677 .wpf_sidebar_content::-webkit-scrollbar, .wpf_comment_container .tab-content ul::-webkit-scrollbar, .scrollbar-outer::-webkit-scrollbar {
5678 width: 7px;
5679 }
5680
5681 .wpf_sidebar_content::-webkit-scrollbar-thumb, .wpf_comment_container .tab-content ul::-webkit-scrollbar-thumb, .scrollbar-outer::-webkit-scrollbar-thumb {
5682 background: #e3ebf6c9;
5683 border-radius: 50px;
5684 }
5685
5686 .wpf_sidebar_content::-webkit-scrollbar-track, .wpf_comment_container .tab-content ul::-webkit-scrollbar-track, .scrollbar-outer::-webkit-scrollbar-track {
5687 background: white;
5688 }
5689 /* END */
5690
5691
5692 @media (min-width: 1500px) {
5693 #wpf_bottom_bar .wpf_bottom_left,
5694 #wpf_bottom_bar .wpf_bottom_right {
5695 width: calc(50% - 135px);
5696 }
5697 #wpf_enable_comment .wpf_bottom_left {
5698 width: auto;
5699 }
5700 }
5701 @media (min-width: 1014px) and (max-width: 1135px) {
5702 .wpf_bottom_middle .icons-block li {
5703 margin: 0px 12px;
5704 }
5705
5706 }
5707 @media (max-width: 1180px) {
5708 .wpf_bottom_middle .icons-block li {
5709 margin: 0px 8px;
5710 }
5711
5712 #wpf_bottom_bar .tasks-btn span.title, .wpf_responsive_icons_bar {
5713 display: none !important;
5714 }
5715
5716 a#wpf_comment_mode_general_task svg, #wpf_bottom_bar .tasks-btn svg {
5717 height: 16px;
5718 width: 16px;
5719 margin: 0;
5720 }
5721
5722 .wpf_bottom_middle .icons-block {
5723 font-size: 12px;
5724 }
5725
5726 #wpf_bottom_bar #wpf_bottom_filter #wpf_task_visibility {
5727 margin-left: -30px;
5728 }
5729 #wpf_bottom_bar #wpf_bottom_filter #wpf_report_btn {
5730 margin-left: 30px;
5731 }
5732 #wpf_bottom_bar #wpf_bottom_filter #wpf_share_page_btn {
5733 margin-left: 82px;
5734 }
5735 }
5736 @media (max-width: 767px) {
5737 #wpf_bottom_bar .wpf_row {
5738 flex-wrap: wrap;
5739 height: auto;
5740 padding: 15px 0;
5741 }
5742 #wpf_bottom_bar #wpf_bottom_filter .wpf_list {
5743 bottom: 75px;
5744 max-width: 100%;
5745 }
5746 #wpf_bottom_bar #wpf_bottom_filter #wpf_task_filter_btn,
5747 #wpf_bottom_bar #wpf_bottom_filter #wpf_task_visibility,
5748 #wpf_bottom_bar #wpf_bottom_filter #wpf_report_btn,
5749 #wpf_bottom_bar #wpf_bottom_filter #wpf_share_page_btn {
5750 margin-left: 0;
5751 }
5752 #wpf_bottom_bar #wpf_bottom_filter #wpf_task_status_filter_btn, #wpf_bottom_bar #wpf_bottom_filter #wpf_task_priority_filter_btn {
5753 margin-left: 0;
5754 }
5755 #wpf_bottom_bar #wpf_bottom_filter .wpf_list {
5756 border-radius: 8px;
5757 border: 1px solid #e3e3e3;
5758 }
5759 #wpf_bottom_bar #wpf_bottom_filter .wpf_list:before {
5760 display: none;
5761 }
5762 #wpf_enable_comment .wpf_bottom_left .message {
5763 width: 100%;
5764 font-size: 12px;
5765 }
5766 }
5767 @media (max-width: 1024px) {
5768 #wpf_bottom_bar .footer-logo, #wpf_bottom_bar .arrow-down {
5769 max-width: 85px !important;
5770 }
5771 }
5772 @media (max-width: 558px) {
5773 #wpf_bottom_bar .footer-logo, #wpf_bottom_bar .arrow-down {
5774 display: none !important;
5775 }
5776 }
5777 @media (max-width: 722px) {
5778 div#wpf_site_milestone {
5779 display: none !important;
5780 }
5781 button.wpf_green_btn.approve-page {
5782 margin-left: 10px;
5783 }
5784 #wpf_enable_comment .wpf_bottom_left .message {
5785 width: 100%;
5786 margin-bottom: 5px;
5787 }
5788 a#wpf_comment_mode_general_task {
5789 margin-left: 15px;
5790 }
5791 .wpf_bottom_left {
5792 max-width: 100%;
5793 }
5794 #wpf_bottom_bar .wpf_comment_btn {
5795 margin: 0;
5796 margin-right: -10px;
5797 }
5798
5799 }
5800 @media (max-width: 360px) {
5801 #wpf_bottom_bar .tasks-btn span.title {
5802 display: none !important;
5803 }
5804 #wpf_bottom_bar .tasks-btn svg {
5805 margin: 0;
5806 }
5807 }
5808 /*21-01-2020 */
5809 .popover-body textarea, #wpf_general_comment_tabs textarea {
5810 margin: 0 0 5px 0;
5811 }
5812 .popover-body .bottom_buttons, #wpf_general_comment_tabs .bottom_buttons {
5813 margin-top: 13px;
5814 display: flex;
5815 justify-content: space-between;
5816 align-items: center;
5817 }
5818 .wpf_button_section1, .wpf_button_section2 {
5819 display: flex;
5820 }
5821 .mark_as_complete_lable {
5822 order: 0;
5823 flex: 1 1 auto;
5824 align-self: auto;
5825 }
5826 a.wpfb-point.complete .gg-check {
5827 margin-left: 4px;
5828 margin-top: 4px;
5829 color: #fff !important;
5830 }
5831 .wpf_sidebar_content .complete .gg-check {
5832 margin-top: 2px;
5833 margin-left: 1px;
5834 color: #fff;
5835 transition: all 0.2s ease-in !important;
5836 }
5837 div#wpf_thispage .complete .wpf_task_number:hover .gg-check {
5838 color: transparent;
5839 }
5840 body .wpf_checkbox_label {
5841 padding-left: 0 !important;
5842 display: flex !important;
5843 align-items: center;
5844 font-size: 14px !important;
5845 color: #272d3c !important;
5846 position: relative !important;
5847 text-align: left;
5848 font-weight: normal;
5849 line-height: 1.5;
5850 letter-spacing: 0px !important;
5851 margin-bottom: 0;
5852 cursor: pointer;
5853 }
5854 body .wpf_checkbox {
5855 width: 0 !important;
5856 margin: 0 !important;
5857 padding: 0 !important;
5858 display: none !important;
5859 }
5860 div#wpf_initial_settings_third_step label.wpf_checkbox_label {
5861 margin-bottom: 10px !important;
5862 }
5863 html body .wpf_checkbox_label::before
5864 {
5865 content: '';
5866 display: inline-block;
5867 width: 15px;
5868 height: 15px;
5869 border-radius: 3px;
5870 border: 2px solid #363d4d !important;
5871 opacity: 0.6;
5872 transition: all .12s, border-color .08s !important;
5873 margin-left: 0 !important;
5874 margin-bottom: 0 !important;
5875 margin-right: 5px !important;
5876 box-sizing: content-box !important;
5877 }
5878 table.form-table.wpf_fields .wpf_checkbox {
5879 display: inline-block !important;
5880 margin-bottom: 10px !important;
5881 margin-right: 5px !important;
5882 }
5883 table.form-table.wpf_fields .wpf_checkbox_label {
5884 display: inline-block !important;
5885 margin-bottom: 10px !important;
5886 }
5887 table.form-table.wpf_fields .wpf_checkbox_label:before {
5888 display: none !important;
5889 }
5890 .img_desc {
5891 margin-bottom: 10px;
5892 display: block;
5893 }
5894 .wpf_title_secondery {
5895 margin: 10px 0;
5896 display: flex;
5897 align-items: center;
5898 }
5899 .wpf_title_secondery a ,.wpfeedback_powered_by .wpf_title a,.wpf_settings_col .wpf_title a{
5900 margin-left: 3px !important;
5901 display: inline-flex;
5902 }
5903 .wpfeedback_powered_by .wpf_title ,.wpf_settings_col .wpf_title{
5904 display: flex;
5905 align-items: center;
5906 }
5907 #wpf_sidebar_filter_task_status li:first-child label {
5908 color: #363D4D !important;
5909 }
5910 #wpf_sidebar_filter_task_status li:nth-child(2) label {
5911 color: #ffa532 !important;
5912 }
5913 #wpf_sidebar_filter_task_status li:nth-child(3) label {
5914 color: #fcd227 !important;
5915 }
5916 #wpf_sidebar_filter_task_status li:nth-child(4) label {
5917 color: #3ed696 !important;
5918 }
5919 #wpf_filter_taskpriority li:first-child label {
5920 color: #3ed696 !important;
5921 }
5922 #wpf_filter_taskpriority li:nth-child(2) label {
5923 color: #fcd227 !important;
5924 }
5925 #wpf_filter_taskpriority li:nth-child(3) label {
5926 color: #ffa532 !important;
5927 }
5928 #wpf_filter_taskpriority li:nth-child(4) label {
5929 color: #ff5a48 !important;
5930 }
5931 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_filter_title,
5932 #wpf_bottom_bar #wpf_bottom_filter .wpf_visibility_title,
5933 #wpf_bottom_bar #wpf_bottom_filter .wpf_reports_title,
5934 #wpf_bottom_bar #wpf_bottom_filter .wpf_icon_title {
5935 font-weight: 700;
5936 }
5937 #wpf_bottom_bar #wpf_bottom_filter .wpf_list .wpf_filter_title svg,
5938 #wpf_bottom_bar #wpf_bottom_filter .wpf_visibility_title svg,
5939 #wpf_bottom_bar #wpf_bottom_filter .wpf_reports_title svg,
5940 #wpf_bottom_bar #wpf_bottom_filter .wpf_icon_title svg{
5941 margin-right: 5px !important;
5942 display: inline-block;
5943 }
5944 .wpf_comment_container .anim-slider input:checked + label.in_progress_label {
5945 color: #ffa532 !important;
5946 }
5947 #wpf_bottom_bar #wpf_bottom_filter .wpf_visibility_title svg,
5948 #wpf_bottom_bar #wpf_bottom_filter .wpf_icon_title svg,
5949 #wpf_bottom_bar #wpf_bottom_filter .wpf_icon_title svg
5950 {
5951 width: 20px;
5952 }
5953 #wpf_bottom_bar #wpf_bottom_filter .wpf_visibility_title svg {
5954 width: 16px !important;
5955
5956 }
5957 #wpf_bottom_bar #wpf_bottom_filter .wpf_visibility_title,
5958 #wpf_bottom_bar #wpf_bottom_filter .wpf_reports_title,
5959 #wpf_bottom_bar #wpf_bottom_filter .wpf_icon_title {
5960 display: flex;
5961 align-items: center;
5962 }
5963 #wpf_bottom_bar #wpf_bottom_filter .wpf_reports_title svg {
5964 width: 16px;
5965 }
5966 #wpf_bottom_bar .tasks-btn {
5967 border: 1px solid #A4ABC5 !important;
5968 background: #fff;
5969 border-radius: 5px;
5970 height: 36px;
5971 width: 36px;
5972 display: flex;
5973 justify-content: center;
5974 align-items: center;
5975 box-sizing: border-box;
5976 }
5977 .wpf_other .meassage_area_main a {
5978 height: 100%;
5979 }
5980 .meassage_area_main a {
5981 color: var(--main-wpf-color) !important;
5982 }
5983
5984 .bottom_buttons input.mark_as_complete_checkbox:checked + label.mark_as_complete_lable:after {
5985 content: '';
5986 display: block;
5987 position: absolute;
5988 top: 5px;
5989 left: 6px;
5990 width: 5px;
5991 height: 12px;
5992 border: solid #363d4d;
5993 border-width: 0 2px 2px 0;
5994 transform: rotate(45deg);
5995 box-sizing: content-box !important;
5996 }
5997
5998 span#wpf_image_download {
5999 display: none;
6000 }
6001
6002 .wpf_bottom_left {
6003 max-width: calc(100% - 225px);
6004 }
6005
6006 .pickr .pcr-button{
6007 border-radius: 5px !important;
6008 border:solid;
6009 width:100% !important;
6010 height: 3.5em !important;
6011 z-index: 2 !important;
6012 }
6013
6014 body.active_comment div, body.active_comment span, body.active_comment, body.active_comment header, body.active_comment footer, body.active_comment section {
6015 cursor: crosshair !important;
6016 }
6017
6018 #wpf_comment_mode_general_task span, #disable_comment_a span {
6019 cursor: pointer !important;
6020 line-height: 18px !important;
6021 }
6022
6023 body.active_comment.wpf_remap div, body.active_comment.wpf_remap span, body.active_comment.wpf_remap, body.active_comment.wpf_remap header, body.active_comment.wpf_remap footer, body.active_comment.wpf_remap section {
6024 cursor: move !important;
6025 }
6026
6027 a#wpf_comment_mode_general_task {
6028 position: relative !important;
6029 }
6030 .wpf_share_btn {
6031 width: 85px;
6032 height: 36px;
6033 border: 1px solid #A4ABC5;
6034 border-radius: 5px;
6035 display: flex;
6036 justify-content: center;
6037 align-items: center;
6038 font-family: 'Roboto';
6039 font-style: normal;
6040 font-weight: 500;
6041 font-size: 14px;
6042 color: #272D3C;
6043 cursor: pointer;
6044 }
6045 .wpf_share_btn img {
6046 margin-right: 5px;
6047 }
6048 a#disable_comment_a {
6049 position: relative !important;
6050 }
6051
6052 a#disable_comment_a svg {
6053 position: absolute;
6054 top: 0;
6055 height: 100%;
6056 left: 0;
6057 width: 100%;
6058 padding-right: calc(100% - 15px);
6059 padding-left: 5px;
6060 padding-top: 6px !important;
6061 padding-bottom: 7px !important;
6062 box-sizing: border-box !important;
6063 opacity:0;
6064 }
6065
6066 /* ------------ Mobile ------------ */
6067 @media (max-width: 1025px) {
6068 .wpf_bottom_left {
6069 flex-grow: 1;
6070 }
6071 }
6072 @media (max-width: 601px) {
6073 .wpf_share_btn, .wpf_visibility_container, .footer-logo {
6074 display: none !important;
6075 }
6076 }
6077 @media (max-width: 782px) {
6078 .logged-in #wpf_launcher {
6079 top: 46px;
6080 }
6081 .logged-in .wpf_sidebar_container {
6082 height: calc(100vh - 46px);
6083 top: 46px !important;
6084 }
6085
6086 .wpf_comment_container .form-group textarea.form-control:focus {
6087 font-size: 16px !important;
6088 }
6089 }
6090 @media (max-width: 400px) {
6091 div#wpf_enable_comment {
6092 margin: auto;
6093 width: 300px;
6094 left: 10px;
6095 }
6096 .popover.wpf_comment_container {
6097 margin: 0;
6098 opacity: 0;
6099 top: auto !important;
6100 position: fixed !important;
6101 bottom: 80px !important;
6102 left: 15px !important;
6103 transform: none !important;
6104 width: calc(100% - 30px);
6105 display: inline-block;
6106 max-height: 80vh;
6107 overflow-y: auto;
6108 }
6109 }
6110 .wpf_current_chat_box {
6111 max-height: 30vh;
6112 }
6113 ul.task_comments_content:empty {
6114 display: none;
6115 }
6116 ul.task_comments_content {
6117 max-height: 350px;
6118 overflow-y: auto;
6119 margin-bottom: 10px;
6120 border: 1px solid #dee2e6;
6121 border-radius: 5px;
6122 padding: 10px;
6123 }
6124 .wpf_loader {
6125 position: absolute;
6126 z-index: 1999;
6127 width: 95%;
6128 overflow: visible;
6129 margin: auto;
6130 top: 0;
6131 left: 0;
6132 bottom: 0;
6133 right: 0;
6134 background-image: url(../images/Loader-slider-WPFeedback.svg);
6135 background-repeat: no-repeat;
6136 background-position: center center;
6137 background-color: rgba(255, 255, 255, 0.5);
6138 background-size: 60px;
6139 }
6140 .wpf_sidebar_loader {
6141 position: absolute;
6142 z-index: 1999;
6143 width: 100%;
6144 overflow: visible;
6145 margin: auto;
6146 top: 0;
6147 left: 0;
6148 bottom: 0;
6149 right: 0;
6150 background-image: url(../images/Loader-slider-WPFeedback.svg);
6151 background-repeat: no-repeat;
6152 background-position: center center;
6153 background-color: rgba(255, 255, 255, 0.5);
6154 background-size: 60px;
6155 }
6156 .wpf_loading {
6157 color: #A4ABC5;
6158 width: 100%;
6159 height: 25px;
6160 padding: 5px 0px !important;
6161 font-size: 14px;
6162 text-align: center;
6163 font-family: Roboto, Helvetica, Arial, sans-serif;
6164 font-weight: 500;
6165 line-height: 1.334;
6166 letter-spacing: 0em;
6167 display: none;
6168 }
6169 .wpf_report_trigger a {
6170 background-color: #dee2e6;
6171 width: 49%;
6172 display: inline-block;
6173 border-radius: 50px;
6174 color: var(--main-wpf-color);
6175 font-size: 12px;
6176 transition: 0.2s !important;
6177 padding: 8px 0;
6178 text-align: center;
6179 margin-right: 2%;
6180 line-height: 1.4;
6181 }
6182 .wpf_report_trigger a:hover {
6183 background-color: #b0b7bf;
6184 }
6185 .wpf_report_trigger a:nth-child(3) {
6186 margin-right: 0;
6187 }
6188 label.wpf_reports_title {
6189 display: block;
6190 text-align: left;
6191 color: var(--main-wpf-color);
6192 font-weight: 700;
6193 margin-top: 10px;
6194 font-size: 12px;
6195 line-height: 1.4;
6196 margin-bottom: 5px;
6197 }
6198 span#wpf_front_report_sent_span {
6199 color: #fff;
6200 font-size: 12px;
6201 font-weight: 700;
6202 letter-spacing: 0.015em;
6203 background-color: #3ed696;
6204 padding: 10px !important;
6205 border: 1px solid #dee2e6;
6206 border-radius: 5px;
6207 line-height: 1.3;
6208 width: calc(100% - 20px);
6209 margin-top: 5px;
6210 text-align: left;
6211 -webkit-transition: all 0.2s ease-out;
6212 -moz-transition: all 0.2s ease-out;
6213 -ms-transition: all 0.2s ease-out;
6214 -o-transition: all 0.2s ease-out;
6215 transition: all 0.2s ease-out !important;
6216 position: absolute;
6217 bottom: 10px;
6218 -moz-box-sizing: border-box;
6219 -webkit-box-sizing: border-box;
6220 box-sizing: border-box;
6221 }
6222 .wpf_list svg {
6223 fill: transparent !important;
6224 }
6225 /* Cursor text style => v2.0.9 */
6226 .wpf_cursor_note {
6227 background-color: #4a5568 !important;
6228 color: #fff !important;
6229 font-family: roboto,sans-serif !important;
6230 font-size: 12px !important;
6231 border-radius: 5px !important;
6232 padding: 2px 6px !important;
6233 width: 150px;
6234 }
6235
6236
6237 /*are checkout fix*/
6238 .woocommerce-checkout .wpf_uploadfile {
6239 display: block !important;
6240 }
6241 .woocommerce-checkout .wfacp_footer_sec_for_script {
6242 display: block;
6243 }
6244 /* Approve Page Modal */
6245 .wpf_approve_modal label {
6246 font-size: 14px !important;
6247 margin: 0 !important;
6248 cursor: pointer;
6249 margin-left: 5px !important;
6250 }
6251 .wpf_approve_check {
6252 display: flex;
6253 justify-content: center;
6254 align-items: center;
6255 padding: 7px 7px 7px 7px;
6256 border: 1px solid #dee2e6;
6257 border-radius: 4px;
6258 margin: 15px 0;
6259 }
6260 .wpf_approve_modal button.approve-page {
6261 width: 100%;
6262 justify-content: center;
6263 }
6264 .wpf_approve_modal svg {
6265 width: 75px;
6266 height: 75px;
6267 background-color: #69dc9d;
6268 border-radius: 50%;
6269 padding: 15px;
6270 color: #fff;
6271 margin: auto;
6272 margin-bottom: 20px;
6273 display: block;
6274 }
6275 .wpf_wizard_title {
6276 color: rgba(54,61,77,0.99) !important;
6277 margin-bottom: 15px;
6278 }
6279 #approve_error{
6280 font-size: 12px;
6281 font-weight: bold;
6282 color: #cc1816;
6283 }
6284 .wpf_comment_container ul.nav.nav-tabs {
6285 background: white;
6286 }
6287 /*Edit Delete feature*/
6288 .wpfb-edit-comment-wrapper{
6289 display: none;
6290 width: 100%;
6291 }
6292
6293 /* ---------- SUpport fix ---------- */
6294 .wpf_comment_container .tab-content>*:not(.active):not(.tab-pane) {
6295 display: block;
6296 padding: 0 !important;
6297 }
6298 .wpf_comment_container .tab-content .tab-pane {
6299 padding: 0 !important;
6300 }
6301 /* ------------ Project Stages ------------ */
6302 #wpf_bottom_bar #wpf_site_milestone_wpf_list.wpf_active {
6303 bottom: 55px;
6304 }
6305 div#wpf_site_milestone_wpf_list .wpf_loader_3.wpf_active {
6306 padding: 30px 15px;
6307 position: initial;
6308 }
6309 .wpf_milestone_popover {
6310 position: relative;
6311 }
6312 div#wpf_site_milestone_wpf_list:before {
6313 content: "";
6314 width: 0;
6315 height: 0;
6316 border-style: solid;
6317 border-width: 6px 6px 0px 6px;
6318 border-color: #ffffff transparent transparent transparent;
6319 line-height: 0px;
6320 position: absolute;
6321 bottom: -6px;
6322 z-index: 999;
6323 left: 35%;
6324 }
6325
6326 .wpf_milestone_item_container_header {
6327 display: flex;
6328 justify-content: space-between;
6329 }
6330 .wpf_milestone_item_container_header a {
6331 color: #E72D67 !important;
6332 text-decoration: none !important;
6333 font-size: 30px;
6334 line-height: 1;
6335 }
6336 .wpf_milestone_item_container {
6337 font-size: 12px !important;
6338 }
6339 #wpf_site_milestone {
6340 display: flex;
6341 flex-flow: row;
6342 align-items: center;
6343 justify-content: space-between;
6344 margin-left: 10px !important;
6345 cursor: pointer;
6346 }
6347 #wpf_site_milestone > .wpf_milestone_content {
6348 display: flex;
6349 flex-flow: column;
6350 justify-content: center;
6351 align-items: flex-start;
6352 margin-left: 5px;
6353 }
6354
6355 .wpf_countdown_title {
6356 font-size: 14px;
6357 overflow: hidden;
6358 max-width: 130px;
6359 white-space: nowrap;
6360 text-overflow: ellipsis;
6361 line-height: 1.2;
6362 }
6363 .wpf_countdown_timer {
6364 font-size: 22px;
6365 font-weight: 700;
6366 line-height: 1;
6367 }
6368 .wpf_milestone_item > ul {
6369 list-style-type: none;
6370 padding: 0;
6371 display: flex;
6372 flex-flow: row;
6373 justify-content: space-between;
6374 align-items: center;
6375 margin: 5px 0 !important;
6376 }
6377
6378 .wpf_milestone_item > ul.completed {
6379 text-decoration: line-through;
6380 }
6381 .wpf_milestone_item > ul > li {
6382 display: flex !important;
6383 align-items: center !important;
6384 }
6385 .wpf_milestone_item > ul > li > span {
6386
6387 margin-right: 0.5rem;
6388 font-size: 1.1rem;
6389 line-height: 1.1rem;
6390 }
6391 .wpf_milestone_item > ul > li > span > svg {
6392 fill: var(--wp--preset--color--foreground) !important;
6393 }
6394 .wpf_milestone_item > ul > li.wpf_in_progress {
6395 color: #E72D67 !important;
6396 }
6397 .wpf_milestone_item > ul > li.wpf_in_progress > span > svg {
6398 fill: #E72D67 !important;
6399 }
6400 .wpf_milestone_item > ul > li.wpf_done > span {
6401
6402 color: #56DBA3 !important;
6403 }
6404 .wpf_milestone_item > ul > li.wpf_done > span > svg {
6405 fill: #56DBA3 !important;
6406 }
6407 .wpf_milestone_item > ul > li:last-child {
6408 color: #A4ABC5;
6409 }
6410
6411 /* Upgrade popup css by Pratap */
6412 .wpf-uf-pop-wrapper, .wpf-le-pop-wrapper {
6413 display: none;
6414 position: fixed;
6415 width: 100%;
6416 background-color: rgba(255, 255, 255, 0.95);
6417 height: 100%;
6418 font-size: 14px !important;
6419 color: #363d4d !important;
6420 text-decoration: none !important;
6421 font-family: 'Roboto', sans-serif;
6422 z-index: 2147483659 !important;
6423 top: 0;
6424 left: 0;
6425 }
6426 .wpf-uf-pop-container, .wpf-le-pop-container {
6427 display: flex;
6428 align-items: center;
6429 height: 100%;
6430 }
6431 .wpf-uf-popup, .wpf-le-popup {
6432 box-shadow: 0em 0em 3em 0em rgb(0 0 0 / 13%);
6433 border-radius: 5px;
6434 border: 1px solid #e3ebf6;
6435 background-color: #fff !important;
6436 max-width: 98%;
6437 box-sizing: border-box;
6438 margin: 0 auto;
6439 position: relative;
6440 max-height: 90vh;
6441 overflow-y: auto;
6442 -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
6443 animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both !important;
6444 }
6445 .wpf-uf-popup {
6446 width: 750px;
6447 padding: 20px;
6448
6449 }
6450 .wpf-le-popup {
6451 padding: 45px 80px;
6452 width: 530px;
6453 text-align: center;
6454 }
6455 .wpf-uf-close-popup, .wpf-le-close-popup {
6456 position: absolute;
6457 top: 15px;
6458 right: 20px;
6459 color: #E72D67 !important;
6460 cursor: pointer;
6461 }
6462 .wpf-uf-popup-title {
6463 line-height: 0.9 !important;
6464 font-size: 22px;
6465 font-weight: 700;
6466 }
6467 .wpf-le-title {
6468 font-size: 17px;
6469 font-weight: 700;
6470 color: #272D3C;
6471 margin-top: 20px;
6472 margin-bottom: 16px;
6473 }
6474 .wpf-le-detail {
6475 margin-bottom: 30px;
6476 }
6477 .wpf-uf-popup p {
6478 font-size: 14px !important;
6479 line-height: 1.5 !important;
6480 margin: 1em 0 0 0 !important;
6481 }
6482 .wpf-uf-popup-plans, .wpf-le-popup-plans {
6483 display: flex;
6484 align-items: center;
6485 justify-content: space-between;
6486 }
6487 .wpf-uf-popup-image {
6488 flex: auto 1 0;
6489 width: 480px;
6490 max-width: 100%;
6491 margin-left: -20px;
6492 position: relative;
6493 }
6494 .wpf-uf-popup-image:before {
6495 width: 40%;
6496 height: 10%;
6497 display: block;
6498 content: "";
6499 left: 30%;
6500 top: 45%;
6501 position: absolute;
6502 box-shadow: 0px 0px 90px 80px #292170;
6503 z-index: -1;
6504 border-radius: 50%;
6505 }
6506 .wpf-uf-popup-image img {
6507 max-width: 100%;
6508 }
6509 .wpf-uf-plan, .wpf-le-plan {
6510 width: 100%;
6511 min-height: 200px;
6512 border-radius: 5px 5px;
6513 display: flex;
6514 background-color: #fff;
6515 flex-direction: column;
6516 justify-content: space-between;
6517 box-sizing: border-box;
6518 }
6519 .wpf-uf-plan {
6520 padding: 15px 15px;
6521 border: 1px solid #e3ebf6;
6522 }
6523 .wpf-uf-plan-title {
6524 font-size: 18px !important;
6525 font-weight: 700;
6526 }
6527 .wpf-uf-plan-detail {
6528 font-size: 14px !important;
6529 line-height: 24px !important;
6530 font-weight: 400 !important;
6531 margin: 5px 0 10px 0;
6532 }
6533 .wpf-uf-plan a, .wpf-le-plan a {
6534 color: #272d3c !important;
6535 text-decoration: none !important;
6536 }
6537 .wpf-uf-plan a:focus, .wpf-le-plan a:focus {
6538 box-shadow: none;
6539 }
6540 .wpf-uf-plan-btn, .wpf-le-plan-btn {
6541 color: #272d3c !important;
6542 background-color: #3ed696;
6543 border-radius: 5px;
6544 font-size: 14px;
6545 font-family: 'Roboto', sans-serif;
6546 font-weight: 500;
6547 cursor: pointer;
6548 height: 36px;
6549 padding: 0 20px;
6550 border: none;
6551 box-sizing: border-box;
6552 display: flex;
6553 align-items: center;
6554 justify-content: center;
6555 -webkit-transition: all 0.2s ease-in;
6556 -moz-transition: all 0.2s ease-in;
6557 -ms-transition: all 0.2s ease-in;
6558 -o-transition: all 0.2s ease-in;
6559 transition: all 0.2s ease-in;
6560 }
6561 .wpf-uf-plan-btn :hover, .wpf-le-plan-btn :hover {
6562 background-color: #33bf84;
6563 }
6564 .wpf-uf-webmaster-notice, .wpf-uf-otheruser-notice {
6565 color: #E72D67;
6566 }
6567 @media only screen and (max-width: 700px) {
6568 .wpf-uf-popup-image {
6569 width: 100%;
6570 margin: auto;
6571 }
6572 .wpf-uf-popup-plans, .wpf-le-popup-plans {
6573 display: block;
6574 }
6575 }