PluginProbe
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) / 1.8.13
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) v1.8.13
1.8.13 1.8.12.3 1.8.12.2 1.8.12.1 1.8.12 1.8.11.3 1.8.11.2 1.8.11.1 1.8.11 1.6.6 1.6.60 1.6.7 1.6.8 1.6.9 1.7.0 1.7.0.1 1.7.0.11 1.7.0.12 1.7.0.14 1.7.0.2 1.7.0.3 1.7.0.5 1.7.0.6 1.7.0.7 1.7.0.9 All 211 releases
charitable / assets / css / onboarding / checklist.css

checklist.css in Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) 1.8.13, at assets/css/onboarding/checklist.css

1,649 lines 41.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* page */
2 .charitable-setup-checklist {
3 max-width: 937px;
4 margin-left: auto;
5 margin-right: auto;
6 }
7
8 .charitable-setup-checklist h1 {
9 font-family: Inter;
10 font-size: 21px;
11 font-weight: 600;
12 line-height: 27.3px;
13 text-align: left;
14 color: rgba(25, 29, 45, 0.9);
15 }
16
17 .charitable-setup-checklist h1 + p {
18 font-family: Inter;
19 font-size: 16px;
20 font-weight: 500;
21 line-height: 24px;
22 text-align: left;
23 color: rgba(25, 29, 45, 0.7);
24 }
25
26 .charitable-main-header {
27 margin: 0 auto 20px auto;
28 }
29
30 .charitable-step-highlight {
31 background-color: rgb(255, 255, 77) !important;
32 }
33
34 /* sections */
35 section.charitable-step {
36 display: inline-block;
37 background-color: white;
38 margin-bottom: 20px;
39 width: 100%;
40 /* animation for background color */
41 transition: background-color 0.5s;
42 }
43 section.charitable-step header {
44 padding: 20px;
45 border-bottom: 1px solid rgb(235, 235, 235);
46 }
47 section.charitable-step h2 {
48 color: rgba(25, 29, 45, 0.9);
49 font-weight: 600;
50 font-size: 17px;
51 line-height: 20px;
52 display: inline-block;
53 margin: 0;
54 padding: 0;
55 }
56 section.charitable-step h2 small {
57 display: block;
58 font-weight: 100;
59 font-size: 14px;
60 line-height: 16px;
61 text-indent: 35px;
62 margin: 5px 0;
63 }
64
65 section.charitable-step header a {
66 display: block;
67 float: right;
68 font-size: 23px;
69 line-height: 23px;
70 }
71
72 section.charitable-step h2 {
73 font-family: Inter;
74 font-size: 17px;
75 font-weight: 600;
76 line-height: 22.1px;
77 text-align: left;
78 color: rgba(25, 29, 45, 0.9);
79 }
80
81 section.charitable-step p {
82 font-family: Inter;
83 font-size: 14px;
84 font-weight: 400;
85 line-height: 22.4px;
86 text-align: left;
87 color: rgba(25, 29, 45, 0.9);
88 }
89
90 .charitable-upgrade-cta {
91 background-color: #000;
92 border: 2px solid #e1e1e1;
93 border-top: 0;
94 border-bottom: 0;
95 color: #fff;
96 padding: 10px;
97 }
98 .charitable-upgrade-cta .block {
99 display: flex;
100 flex-direction: row;
101 padding: 40px;
102 justify-content: space-between;
103 }
104 .charitable-upgrade-cta h2 {
105 color: #fff;
106 font-size: 20px;
107 margin: 0 0 30px 0;
108 }
109 .charitable-upgrade-cta ul {
110 display: -ms-flex;
111 display: -webkit-flex;
112 display: flex;
113 -webkit-flex-wrap: wrap;
114 flex-wrap: wrap;
115 font-size: 15px;
116 margin: 0;
117 padding: 0;
118 }
119 .charitable-upgrade-cta ul li {
120 display: flex;
121 width: 50%;
122 margin: 0 0 8px 0;
123 padding: 0;
124 gap: 5px;
125 }
126 .charitable-upgrade-cta ul li .dashicons {
127 color: #008a20;
128 }
129 .charitable-upgrade-cta .left {
130 max-width: 600px;
131 }
132 .charitable-upgrade-cta .right {
133 text-align: center;
134 }
135 .charitable-upgrade-cta .right h2 {
136 text-align: center;
137 margin: 0 span;
138 margin-display: inline-block;
139 margin-border-bottom: 1px solid #555;
140 margin-padding: 0 15px 12px;
141 }
142 .charitable-upgrade-cta .right .price {
143 padding: 26px 0;
144 }
145 .charitable-upgrade-cta .right .price .amount {
146 font-size: 48px;
147 font-weight: 600;
148 position: relative;
149 display: inline-block;
150 }
151 .charitable-upgrade-cta .right .price .amount:before {
152 content: "$";
153 position: absolute;
154 top: -8px;
155 left: -16px;
156 font-size: 18px;
157 }
158 .charitable-upgrade-cta .right .price .term {
159 font-size: 12px;
160 display: inline-block;
161 }
162 .charitable-upgrade-cta .right a {
163 background-color: #e27730;
164 color: #fff;
165 font-size: 16px;
166 font-weight: 600;
167 padding: 12px 28px;
168 position: relative;
169 top: -4px;
170 text-decoration: none;
171 border-radius: 5px;
172 text-shadow: none;
173 line-height: 24px;
174 cursor: pointer;
175 margin-left: auto;
176 margin-right: auto;
177 display: block;
178 max-width: 80%;
179 text-align: center;
180 }
181
182 .charitable-more-links {
183 list-style-type: none;
184 margin: 0 0 0 0;
185 background: white;
186 padding: 20px;
187 }
188 .charitable-more-links li {
189 font-size: 14px;
190 line-height: 24px;
191 margin: 0 0 5px 0;
192 }
193 .charitable-more-links li span {
194 margin-right: 6px;
195 margin-top: 2px;
196 }
197
198 /* gateway / stripe */
199 .charitable-step-connect-payment .charitable-gateway-icon,
200 .charitable-step-connect-payment .charitable-gateway-info-column {
201 display: inline-block;
202 }
203 .charitable-step-connect-payment .charitable-gateway-info-column {
204 margin: 10px 0 0 20px;
205 max-width: 350px;
206 }
207 .charitable-step-connect-payment .charitable-gateway-info-column p {
208 margin-top: 5px;
209 }
210 .charitable-step-connect-payment .charitable-gateway-footer label {
211 font-size: 15px;
212 line-height: 16px;
213 }
214 .charitable-step-connect-payment .charitable-gateway-icon img {
215 border: 1px solid rgba(25, 29, 45, 0.14);
216 border-radius: 10px;
217 padding: 10px;
218 }
219 .charitable-step-connect-payment .wpcharitable-stripe-connect {
220 color: #fff;
221 font-size: 15px;
222 font-weight: bold;
223 text-decoration: none;
224 line-height: 1;
225 background-color: #635bff;
226 border-radius: 3px;
227 padding: 10px 20px;
228 display: inline-flex;
229 align-items: center;
230 }
231
232 /* opt-in */
233 .charitable-checklist-allow {
234 display: none;
235 }
236 .charitable-checklist-allow ul {
237 list-style: none;
238 padding: 0;
239 margin: 0;
240 }
241 .charitable-checklist-allow ul li {
242 display: flex;
243 align-items: top;
244 margin-bottom: 10px;
245 justify-content: flex-start;
246 align-content: flex-start;
247 }
248 .charitable-checklist-allow ul li .charitable-checklist-allow-icon {
249 /* select last span */
250 }
251 .charitable-checklist-allow ul li .charitable-checklist-allow-icon span {
252 display: inline-block;
253 background-color: white;
254 background-size: contain;
255 border-radius: 50%;
256 color: #fff;
257 font-size: 32px;
258 margin: -3px 0 0 0;
259 line-height: 42px;
260 text-align: center;
261 width: 40px;
262 height: 40px;
263 }
264 .charitable-checklist-allow ul li .charitable-checklist-allow-icon span:before {
265 margin: 0 auto;
266 color: #5aa152;
267 display: block;
268 text-align: center;
269 width: 35px;
270 height: 35px;
271 }
272 .charitable-checklist-allow ul li .charitable-checklist-allow-icon span.not-shared:before {
273 color: #dd0f0f;
274 }
275 .charitable-checklist-allow ul li .charitable-checklist-allow-text {
276 margin-left: 10px;
277 text-align: left !important;
278 width: 100%;
279 }
280 .charitable-checklist-allow ul li .charitable-checklist-allow-text h6 {
281 font-size: 15px;
282 line-height: 15px;
283 font-weight: 600;
284 margin: 0;
285 padding: 0;
286 }
287 .charitable-checklist-allow ul li .charitable-checklist-allow-text p {
288 font-size: 12px;
289 line-height: 18px;
290 margin: 2px 0;
291 }
292
293 /* buttons */
294 .charitable-setup-checklist input.charitable-button-primary[type=submit],
295 .charitable-setup-checklist a.charitable-button-primary {
296 background-color: #5aa152;
297 border-color: #5aa152;
298 color: #fff;
299 border-radius: 5px;
300 font-family: "Inter", sans-serif;
301 font-weight: 600;
302 font-size: 14px;
303 line-height: 14px;
304 padding: 15px 20px;
305 text-transform: capitalize;
306 text-decoration: none;
307 display: inline-block;
308 cursor: pointer;
309 min-height: 30px;
310 border-width: 1px;
311 border-style: solid;
312 -webkit-appearance: none;
313 border-radius: 3px;
314 white-space: nowrap;
315 box-sizing: border-box;
316 }
317
318 .charitable-setup-checklist input.charitable-button-primary[type=submit]:hover,
319 .charitable-setup-checklist a.charitable-button-primary:hover {
320 background-color: #5aa152;
321 border-color: #5aa152;
322 }
323
324 .charitable-setup-checklist input.charitable-button-primary[type=submit].alt,
325 .charitable-setup-checklist a.charitable-button-primary.alt {
326 background-color: #df7739;
327 border-color: #df7739;
328 border-radius: 4px;
329 text-decoration: none;
330 text-align: center;
331 vertical-align: middle;
332 white-space: nowrap;
333 box-shadow: none;
334 font-size: 16px;
335 font-weight: 600 !important;
336 line-height: 19px;
337 padding: 10px 20px;
338 background-color: #df7739;
339 text-transform: capitalize;
340 letter-spacing: normal;
341 }
342
343 .charitable-setup-checklist input.charitable-button-primary[type=submit].alt:hover,
344 .charitable-setup-checklist a.charitable-button-primary.alt:hover {
345 background-color: #df7739;
346 border-color: #df7739;
347 }
348
349 /* checks */
350 .charitable-checklist-checkbox {
351 background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="23" height="23" rx="11.5" stroke="%235AA152"/></svg>');
352 width: 24px;
353 height: 24px;
354 background-repeat: no-repeat;
355 background-size: contain;
356 display: inline-block;
357 position: relative;
358 top: 6px;
359 margin-right: 10px;
360 }
361
362 .charitable-checklist-checkbox.charitable-checklist-checked {
363 background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="23" height="23" rx="11.5" fill="%235AA152" stroke="%235AA152"/><path d="M10.3985 16.4489L6.27692 12.3273L7.3073 11.297L10.3985 14.3881L17.0327 7.75388L18.0631 8.78426L10.3985 16.4489Z" fill="white"/></svg>');
364 }
365
366 /* content */
367 body.charitable-checklist-page .charitable-toggle-container {
368 display: flex;
369 justify-content: space-between;
370 padding: 10px 20px;
371 box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
372 align-items: center;
373 }
374 body.charitable-checklist-page .charitable-toggle-container .charitable-bonus-step-container {
375 display: flex;
376 justify-content: space-between;
377 align-items: center;
378 width: 100%;
379 margin-top: 20px;
380 margin-bottom: 20px;
381 border-bottom: 1px solid rgba(25, 29, 45, 0.14);
382 padding-bottom: 20px;
383 }
384 body.charitable-checklist-page .charitable-toggle-container .charitable-bonus-step-container:first-child {
385 margin-top: 0;
386 }
387 body.charitable-checklist-page .charitable-toggle-container .charitable-bonus-step-container:last-child {
388 margin-bottom: 0;
389 border-bottom: 0;
390 padding-bottom: 0;
391 display: flex;
392 flex-direction: row;
393 align-items: stretch;
394 }
395 body.charitable-checklist-page .charitable-toggle-container .charitable-bonus-step-container a.charitable-button {
396 margin-left: 25px;
397 margin-top: 15px;
398 }
399 body.charitable-checklist-page .charitable-toggle-container .charitable-bonus-step-container a.charitable-button i {
400 font-weight: 100;
401 margin-left: 6px;
402 }
403 body.charitable-checklist-page .charitable-toggle-container .charitable-bonus-step-container p:first-child {
404 margin-top: 0;
405 }
406 body.charitable-checklist-page .charitable-toggle-container input[type=text],
407 body.charitable-checklist-page .charitable-toggle-container input[type=email] {
408 border: 1px solid rgba(25, 29, 45, 0.14);
409 width: 80%;
410 }
411 body.charitable-checklist-page section.charitable-step-opt-in .charitable-toggle-container {
412 align-items: baseline;
413 }
414 body.charitable-checklist-page section.charitable-step-opt-in a.charitable-button {
415 top: 20px;
416 position: relative;
417 }
418 body.charitable-checklist-page .charitable-toggle-container.charitable-column {
419 flex-direction: column;
420 }
421 body.charitable-checklist-page .charitable-toggle-container.charitable-column .charitable-reduced-width p {
422 max-width: 80%;
423 }
424 body.charitable-checklist-page .charitable-toggle-container.charitable-equal-flex .charitable-reduced-width p {
425 max-width: 80%;
426 }
427 body.charitable-checklist-page .charitable-toggle-container p {
428 color: rgba(25, 29, 45, 0.7);
429 font-family: Inter;
430 font-size: 14px;
431 font-weight: 500;
432 line-height: 22.4px;
433 }
434 body.charitable-checklist-page .charitable-toggle-container h4,
435 body.charitable-checklist-page .charitable-toggle-container h3 {
436 margin: 0;
437 }
438 body.charitable-checklist-page .charitable-toggle-container h4 .charitable-badge,
439 body.charitable-checklist-page .charitable-toggle-container h3 .charitable-badge {
440 left: 10px;
441 top: -5px;
442 position: relative;
443 }
444 body.charitable-checklist-page .charitable-toggle-container label {
445 color: rgba(25, 29, 45, 0.9);
446 margin-left: 7px;
447 font-family: Inter;
448 font-size: 14px;
449 font-weight: 400;
450 line-height: 22.4px;
451 text-align: left;
452 }
453 body.charitable-checklist-page .charitable-toggle-container.charitable-step-two-col-content div:first-child {
454 text-align: left;
455 }
456 body.charitable-checklist-page .charitable-toggle-container.charitable-step-two-col-content .charitable-reduced-width {
457 margin-right: 25px;
458 line-break: pretty !important;
459 }
460 body.charitable-checklist-page .charitable-toggle-container.charitable-step-two-col-content .charitable-reduced-width p {
461 max-width: 100%;
462 line-break: pretty !important;
463 }
464 body.charitable-checklist-page .charitable-toggle-container.charitable-step-two-col-content div:last-child {
465 text-align: right;
466 }
467 body.charitable-checklist-page .charitable-toggle-container.charitable-step-one-col-content .charitable-sub-container {
468 display: flex;
469 justify-content: space-between;
470 width: 100%;
471 align-items: center;
472 border-bottom: 1px solid rgb(235, 235, 235);
473 padding-bottom: 10px;
474 margin-bottom: 10px;
475 }
476 body.charitable-checklist-page .charitable-toggle-container.charitable-step-one-col-content .charitable-sub-container.charitable-column {
477 flex-direction: column;
478 }
479 body.charitable-checklist-page .charitable-toggle-container.charitable-step-one-col-content .charitable-sub-container:not(.charitable-column) div:first-child {
480 display: flex;
481 align-items: center;
482 }
483 body.charitable-checklist-page .charitable-sub-container-row {
484 width: 100%;
485 }
486 body.charitable-checklist-page .charitable-toggle-container.charitable-step-one-col-content .charitable-sub-container div.charitable-sub-container-row {
487 display: block;
488 }
489 body.charitable-checklist-page .charitable-toggle-container.charitable-step-one-col-content .charitable-sub-container img.wpchar-arrow {
490 position: relative;
491 top: 5px;
492 margin-left: 5px;
493 }
494 body.charitable-checklist-page .charitable-toggle-container.charitable-step-one-col-content .charitable-sub-container:last-of-type {
495 border-bottom: 0;
496 padding-bottom: 0;
497 margin-bottom: 0;
498 }
499 body.charitable-checklist-page .charitable-step-footer {
500 width: 100%;
501 text-align: center;
502 }
503 body.charitable-checklist-page .charitable-step-footer a {
504 margin: 20px auto 40px auto;
505 color: grey;
506 text-decoration: underline;
507 text-decoration-color: currentcolor;
508 text-decoration-style: solid;
509 text-decoration-thickness: auto;
510 text-decoration-color: grey;
511 text-decoration-thickness: 2px;
512 text-decoration-style: dotted;
513 text-underline-offset: 3px;
514 display: block;
515 font-size: 18px;
516 font-weight: 600;
517 }
518 body.charitable-checklist-page .charitable-gateway-icon,
519 body.charitable-checklist-page .charitable-gateway-info-column {
520 display: inline-block;
521 }
522 body.charitable-checklist-page .charitable-gateway-info-column {
523 margin: 20px 0 0 20px;
524 }
525 body.charitable-checklist-page .charitable-gateway-icon img {
526 border: 1px solid rgba(25, 29, 45, 0.14);
527 border-radius: 10px;
528 padding: 10px;
529 }
530 body.charitable-checklist-page .charitable-next-level-icon {
531 width: 58px;
532 }
533 body.charitable-checklist-page .charitable-angle-down {
534 transform: rotate(0deg);
535 transition: transform 0.1s linear;
536 }
537 body.charitable-checklist-page .charitable-angle-down.charitable-angle-right {
538 transform: rotate(-90deg);
539 transition: transform 0.1s linear;
540 }
541 body.charitable-checklist-page .charitable-learn-more a {
542 color: rgba(25, 29, 45, 0.5) !important;
543 display: inline-block;
544 text-decoration: none;
545 font-family: Inter;
546 font-size: 14px;
547 font-weight: 600;
548 line-height: 21px;
549 text-align: center;
550 margin: 15px auto;
551 }
552 body.charitable-checklist-page .charitable-learn-more a:hover {
553 color: rgba(25, 29, 45, 0.5) !important;
554 text-decoration: underline;
555 }
556 body.charitable-checklist-page .wpchar-disabled {
557 opacity: 0.35;
558 }
559 body.charitable-checklist-page .wpchar-disabled a {
560 pointer-events: none;
561 cursor: not-allowed;
562 }
563
564 /* widget */
565 @keyframes charitable-checklist-bar-shift {
566 0% {
567 background-position-x: 27px;
568 }
569 100% {
570 background-position-x: 0;
571 }
572 }
573 @keyframes charitable-checklist-dot-pulse {
574 0% {
575 box-shadow: 0 0 0 0 rgba(223, 119, 57, 0.6);
576 }
577 100% {
578 box-shadow: 0 0 0 10px rgba(223, 119, 57, 0);
579 }
580 }
581 #charitable-welcome .checklist {
582 border-radius: 2px;
583 box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1);
584 margin-bottom: 30px;
585 background: #444 url("../../images/onboarding/checklist/getting-started.png") center right no-repeat;
586 background-size: contain;
587 }
588 #charitable-welcome .checklist .block {
589 max-width: 480px;
590 }
591 #charitable-welcome .checklist h1 {
592 color: #ffffff;
593 text-align: left;
594 margin: 20px 0 22px;
595 }
596 #charitable-welcome .checklist h6 {
597 font-size: 17px;
598 font-weight: 400;
599 text-align: left;
600 color: #cccccc;
601 margin: 0 0 34px;
602 }
603
604 .charitable-checklist {
605 position: fixed;
606 right: 20px;
607 bottom: 0;
608 width: 230px;
609 z-index: 100110;
610 border-top-left-radius: 4px;
611 border-top-right-radius: 4px;
612 box-shadow: 0 0 30px rgba(0, 0, 0, 0.15);
613 }
614 .charitable-checklist p {
615 font-size: 14px;
616 line-height: 20px;
617 margin: 0 0 15px 0;
618 color: #222222;
619 }
620 .charitable-checklist b {
621 font-weight: 600;
622 }
623 .charitable-checklist .charitable-checklist-list-block {
624 border-top-left-radius: 4px;
625 border-top-right-radius: 4px;
626 padding: 26px 20px 20px 20px;
627 background-color: white;
628 overflow: hidden;
629 position: relative;
630 }
631 .charitable-checklist .charitable-checklist-list-block .list-block-button {
632 position: absolute;
633 color: #b6b6b6;
634 top: 10px;
635 cursor: pointer;
636 width: 16px;
637 height: 16px;
638 background-size: 16px 16px;
639 background-position: center center;
640 background-repeat: no-repeat;
641 opacity: 0.25;
642 z-index: 999;
643 }
644 .charitable-checklist .charitable-checklist-list-block .list-block-button:hover {
645 opacity: 0.5;
646 }
647 .charitable-checklist .charitable-checklist-list-block .list-block-button.checklist-toggle {
648 right: 30px;
649 background-image: url(../../images/onboarding/checklist/chevron-circle-down-regular.svg);
650 }
651 .charitable-checklist .charitable-checklist-list-block .list-block-button.checklist-skip {
652 right: 10px;
653 background-image: url(../../images/onboarding/checklist/times-circle-regular.svg);
654 color: #b6b6b6;
655 }
656 .charitable-checklist .charitable-checklist-list-block .list-block-button.checklist-cancel {
657 right: 10px;
658 background-image: url(../../images/onboarding/checklist/times-circle-regular.svg);
659 color: #b6b6b6;
660 }
661 .charitable-checklist .charitable-checklist-list-block.closed {
662 padding: 10px;
663 }
664 .charitable-checklist .charitable-checklist-list-block.closed p {
665 margin-bottom: 0;
666 }
667 .charitable-checklist .charitable-checklist-list-block.closed .list-block-button.checklist-toggle {
668 transform: rotate(180deg);
669 }
670 .charitable-checklist .charitable-checklist-list-block.closed .charitable-checklist-list {
671 display: block;
672 }
673 .charitable-checklist .charitable-checklist-list-block.closed .charitable-checklist-list li {
674 opacity: 0;
675 height: 0;
676 margin: 0;
677 }
678 .charitable-checklist .charitable-checklist-list {
679 list-style: none;
680 margin: 0;
681 font-size: 12px;
682 line-height: 16px;
683 display: flex;
684 flex-direction: column;
685 gap: 10px;
686 justify-content: flex-start;
687 }
688 .charitable-checklist .charitable-checklist-list li {
689 display: flex;
690 }
691 .charitable-checklist .charitable-checklist-list li span:before {
692 display: inline-block;
693 font-family: FontAwesome;
694 content: "\f1db";
695 font-size: 18px;
696 color: #b6b6b6;
697 margin-right: 8px;
698 line-height: 16px;
699 vertical-align: bottom;
700 border-radius: 50%;
701 }
702 .charitable-checklist .charitable-checklist-list li .dashicons-yes {
703 display: none;
704 vertical-align: middle;
705 }
706 .charitable-checklist .charitable-checklist-list li a {
707 text-decoration: none;
708 color: black;
709 }
710 .charitable-checklist .charitable-checklist-list li a:hover {
711 color: #df7739;
712 }
713 .charitable-checklist .charitable-checklist-list li.charitable-checklist-item-current {
714 font-weight: bold;
715 cursor: pointer;
716 }
717 .charitable-checklist .charitable-checklist-list li.charitable-checklist-item-current span:before {
718 color: #df7739;
719 content: "\f111";
720 font-size: 17.5px;
721 line-height: 1;
722 text-indent: 0.5px;
723 }
724 .charitable-checklist .charitable-checklist-list li.charitable-checklist-item-completed {
725 font-weight: initial;
726 text-decoration: line-through;
727 color: #777777;
728 }
729 .charitable-checklist .charitable-checklist-list li.charitable-checklist-item-completed span:before {
730 color: #74ae5e;
731 font-size: 18px;
732 background-color: white;
733 content: "\f058";
734 }
735 .charitable-checklist .charitable-checklist-list li.charitable-checklist-completed span:before {
736 background-size: contain;
737 color: transparent;
738 background-repeat: no-repeat;
739 background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="23" height="23" rx="11.5" fill="%235AA152" stroke="%235AA152"/><path d="M10.3985 16.4489L6.27692 12.3273L7.3073 11.297L10.3985 14.3881L17.0327 7.75388L18.0631 8.78426L10.3985 16.4489Z" fill="white"/></svg>');
740 }
741 .charitable-checklist .charitable-checklist-bar {
742 background-color: #dddddd;
743 }
744 .charitable-checklist .charitable-checklist-bar div {
745 width: 0;
746 height: 8px;
747 border-radius: 0;
748 background-image: url(../../images/onboarding/checklist/bar-bg.png);
749 background-size: auto 8px;
750 background-repeat: repeat-x;
751 animation: charitable-checklist-bar-shift 1.5s linear infinite;
752 }
753 .charitable-checklist .charitable-checklist-cancel {
754 float: right;
755 color: #909090;
756 font-size: 12px;
757 font-weight: 100;
758 }
759 .charitable-checklist .charitable-checklist-skip {
760 float: right;
761 color: #909090;
762 font-size: 12px;
763 font-weight: 100;
764 }
765 .charitable-checklist .charitable-btn {
766 cursor: pointer;
767 color: #ffffff;
768 border-radius: 2px;
769 }
770 .charitable-checklist .charitable-btn-md {
771 min-height: initial;
772 font-size: 11px;
773 font-weight: 600;
774 line-height: 15px;
775 padding: 5px 10px;
776 border: none;
777 }
778 .charitable-checklist .charitable-btn-orange {
779 background-color: #df7739;
780 }
781 .charitable-checklist .charitable-btn-orange:hover {
782 background-color: #d06e2d;
783 }
784 .charitable-checklist .charitable-btn-grey {
785 background-color: #555555;
786 }
787 .charitable-checklist .charitable-btn-grey:hover {
788 background-color: #777777;
789 }
790 .charitable-checklist .charitable-checklist-block-timer {
791 padding: 10px 0;
792 background-color: #222222;
793 box-sizing: border-box;
794 display: flex;
795 justify-content: center;
796 gap: 10px;
797 align-items: center;
798 line-height: 20px;
799 }
800 .charitable-checklist .charitable-checklist-block-timer img {
801 width: 40px;
802 height: 40px;
803 border-radius: 50%;
804 }
805 .charitable-checklist .charitable-checklist-block-timer h3 {
806 font-size: 15px;
807 font-weight: 600;
808 color: #ffffff;
809 margin: 0;
810 }
811 .charitable-checklist .charitable-checklist-block-timer p {
812 font-size: 14px;
813 font-weight: 300;
814 color: #ffffff;
815 opacity: 0.6;
816 margin: 0;
817 }
818 .charitable-checklist .charitable-checklist-block-under-status {
819 background-color: #2d2d2d;
820 text-align: center;
821 padding: 10px;
822 min-height: 24.4px;
823 }
824 .charitable-checklist .charitable-checklist-block-under-status a.charitable-btn {
825 display: inline-block;
826 border-radius: 4px;
827 cursor: pointer;
828 text-decoration: none;
829 text-align: center;
830 vertical-align: middle;
831 white-space: nowrap;
832 box-shadow: none;
833 font-size: 16px;
834 font-weight: 600 !important;
835 line-height: 19px;
836 padding: 10px 20px;
837 border: none;
838 background-color: #df7739;
839 color: #ffffff;
840 text-transform: capitalize;
841 letter-spacing: normal;
842 }
843
844 .charitable-checklist.charitable-checklist-start {
845 display: initial;
846 }
847
848 .charitable-checklist.paused .charitable-checklist-bar div {
849 animation-play-state: paused;
850 }
851
852 .charitable-checklist.charitable-checklist-completed .charitable-checklist-bar div {
853 animation-play-state: paused;
854 }
855 .charitable-checklist.charitable-checklist-completed .charitable-checklist-block-timer p {
856 color: #6ab255;
857 opacity: 1;
858 }
859 .charitable-checklist.charitable-checklist-completed .charitable-checklist-block-under-status .charitable-btn {
860 display: inline-block;
861 border-radius: 4px;
862 cursor: pointer;
863 text-decoration: none;
864 text-align: center;
865 vertical-align: middle;
866 white-space: nowrap;
867 box-shadow: none;
868 font-size: 16px;
869 font-weight: 600 !important;
870 line-height: 19px;
871 padding: 7px 16px;
872 border: none;
873 background-color: #df7739;
874 color: #ffffff;
875 text-transform: capitalize;
876 letter-spacing: normal;
877 }
878 .charitable-checklist.charitable-checklist-completed .charitable-checklist-block-under-status p {
879 margin: 0;
880 color: white;
881 }
882 .charitable-checklist.charitable-checklist-completed .charitable-checklist-block-under-status p a {
883 color: #df7739;
884 text-decoration: none;
885 }
886
887 span.charitable-checklist-dot {
888 display: inline-block;
889 width: 12px;
890 height: 12px !important;
891 padding: 0 !important;
892 border: 0 !important;
893 border-radius: 50%;
894 background-color: #df7739;
895 animation: charitable-checklist-dot-pulse 1.5s infinite !important;
896 }
897
898 span.charitable-checklist-dot.charitable-checklist-dot-step1 {
899 margin: 0 80px 0 20px;
900 position: absolute;
901 right: 1px;
902 }
903
904 span.charitable-checklist-dot.charitable-checklist-dot-step2 {
905 margin-left: 10px;
906 vertical-align: -2px;
907 }
908
909 span.charitable-checklist-dot.charitable-checklist-dot-step3 {
910 float: right;
911 margin-top: 5px;
912 }
913
914 span.charitable-checklist-dot.charitable-checklist-dot-step3.charitable-checklist-dot-completed {
915 margin-top: 2px;
916 background: transparent;
917 }
918
919 span.charitable-checklist-dot.charitable-checklist-dot-step4 {
920 margin-left: 24px;
921 vertical-align: middle;
922 }
923
924 span.charitable-checklist-dot.charitable-checklist-dot-step5 {
925 margin: 3px 10px;
926 }
927
928 span.charitable-checklist-dot.charitable-checklist-dot-next {
929 background-color: #3178a0;
930 box-shadow: 0 0 0 6px #eeeeee;
931 animation: none !important;
932 }
933
934 span.charitable-checklist-dot.charitable-checklist-dot-completed {
935 background-color: #ffffff;
936 width: 16px !important;
937 height: 16px !important;
938 box-shadow: none;
939 position: relative;
940 animation: none !important;
941 }
942 span.charitable-checklist-dot.charitable-checklist-dot-completed:before {
943 color: #74ae5e;
944 font-size: 18px;
945 line-height: 16px;
946 width: 14px;
947 height: 14px;
948 background-color: #ffffff;
949 content: "\f058";
950 font-family: FontAwesome;
951 position: absolute;
952 border-radius: 50%;
953 left: 0;
954 }
955
956 span.charitable-checklist-dot.charitable-checklist-dot-completed.charitable-checklist-dot-step1 {
957 position: absolute;
958 }
959
960 .wp-editor-tools span.charitable-checklist-dot.charitable-checklist-dot-step5 {
961 margin-top: 9px;
962 }
963
964 .charitable-checklist-tooltips {
965 display: none;
966 }
967
968 .charitable-checklist-popup-container {
969 display: none;
970 background-color: rgba(112, 128, 144, 0.6);
971 height: 100vh;
972 width: 100%;
973 position: fixed;
974 top: 0;
975 left: 0;
976 z-index: 100100;
977 overflow: hidden;
978 overflow-y: scroll;
979 transition: all 0.25s ease-out;
980 }
981
982 .charitable-checklist-popup {
983 display: none;
984 position: absolute;
985 top: 50%;
986 left: 50%;
987 transform: translate(-50%, -50%);
988 max-width: 600px;
989 border-radius: 8px;
990 overflow: hidden;
991 background-color: white;
992 box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
993 z-index: 9999;
994 }
995 .charitable-checklist-popup .charitable-checklist-popup-close {
996 font-size: 27px;
997 color: #a7aaad;
998 position: absolute;
999 right: 0;
1000 margin: 11px 10px 10px 10px;
1001 background-color: #ffffff;
1002 border-radius: 50%;
1003 cursor: pointer;
1004 }
1005 .charitable-checklist-popup .charitable-checklist-popup-close:hover {
1006 color: #777777;
1007 }
1008 .charitable-checklist-popup .charitable-checklist-popup-btn {
1009 display: inline-block;
1010 border-radius: 4px;
1011 cursor: pointer;
1012 text-decoration: none;
1013 text-align: center;
1014 vertical-align: middle;
1015 white-space: nowrap;
1016 box-shadow: none;
1017 font-size: 16px;
1018 font-weight: 600;
1019 line-height: 19px;
1020 padding: 10px 20px;
1021 border: none;
1022 background-color: #df7739;
1023 color: #ffffff;
1024 }
1025 .charitable-checklist-popup .charitable-checklist-popup-btn:hover {
1026 background-color: #b85a1b;
1027 }
1028 .charitable-checklist-popup .charitable-checklist-popup-btn .dashicons-external {
1029 margin-left: 6px;
1030 }
1031 .charitable-checklist-popup .charitable-checklist-popup-btn:last-child {
1032 margin-left: 20px;
1033 }
1034 .charitable-checklist-popup .charitable-checklist-popup-btn:disabled {
1035 cursor: default;
1036 opacity: 0.5;
1037 }
1038 .charitable-checklist-popup .charitable-checklist-popup-btn:disabled:hover {
1039 background-color: #df7739;
1040 }
1041 .charitable-checklist-popup .charitable-checklist-popup-btn.charitable-checklist-popup-contact-btn {
1042 margin-left: 0;
1043 }
1044 .charitable-checklist-popup .charitable-checklist-popup-btn.charitable-checklist-popup-rate-btn {
1045 margin-left: 0;
1046 }
1047 .charitable-checklist-popup .charitable-checklist-popup-flex {
1048 display: flex;
1049 flex-wrap: nowrap;
1050 justify-content: space-between;
1051 align-items: stretch;
1052 }
1053 .charitable-checklist-popup .charitable-checklist-popup-flex * {
1054 margin: 0 !important;
1055 }
1056 .charitable-checklist-popup .charitable-admin-popup-content {
1057 padding: 60px 50px;
1058 }
1059
1060 .charitable-checklist-popup-congrats {
1061 background: #fff url("../../images/onboarding/checklist/confetti.svg") repeat center;
1062 }
1063
1064 .charitable-checklist-popup-header {
1065 width: 100%;
1066 height: 212px;
1067 border-top-left-radius: 8px;
1068 border-top-right-radius: 8px;
1069 }
1070
1071 .charitable-checklist-popup-header-contact {
1072 background: #eee url("../../images/onboarding/checklist/popup-contact.png") no-repeat center;
1073 background-size: auto 57%;
1074 }
1075
1076 .charitable-checklist-popup-footer {
1077 padding: 40px;
1078 background: #f5f5f5;
1079 }
1080 .charitable-checklist-popup-footer h3 {
1081 font-size: 20px;
1082 line-height: 24px;
1083 color: #2c3338;
1084 margin: 0 0 20px;
1085 }
1086 .charitable-checklist-popup-footer h3 img {
1087 vertical-align: -4px;
1088 margin-left: 2px;
1089 }
1090 .charitable-checklist-popup-footer p {
1091 font-weight: normal;
1092 font-size: 16px;
1093 line-height: 24px;
1094 }
1095 .charitable-checklist-popup-footer a.charitable-checklist-popup-btn {
1096 margin-left: 0 !important;
1097 background: #2271b1;
1098 }
1099 .charitable-checklist-popup-footer a.charitable-checklist-popup-btn:hover {
1100 background: #215d8f;
1101 }
1102
1103 .charitable-checklist-popup-content {
1104 padding: 40px;
1105 -webkit-font-smoothing: antialiased;
1106 }
1107 .charitable-checklist-popup-content h3 {
1108 color: #df7739;
1109 margin: 0 0 10px 0;
1110 font-size: 24px;
1111 font-weight: 600;
1112 line-height: 30px;
1113 }
1114 .charitable-checklist-popup-content h3 img {
1115 vertical-align: -6px;
1116 margin-left: 6px;
1117 width: 32px;
1118 height: 32px;
1119 }
1120 .charitable-checklist-popup-content p {
1121 font-size: 16px;
1122 margin: 0 0 20px;
1123 color: #444444;
1124 line-height: 28px;
1125 }
1126 .charitable-checklist-popup-content b {
1127 font-weight: 600;
1128 }
1129 .charitable-checklist-popup-content .charitable-checklist-contact-message {
1130 box-shadow: none;
1131 resize: none;
1132 margin-bottom: 21px;
1133 width: 100%;
1134 min-height: 175px;
1135 padding: 10px;
1136 }
1137 .charitable-checklist-popup-content label {
1138 font-size: 13.8px;
1139 display: block;
1140 margin-bottom: 23px;
1141 }
1142 .charitable-checklist-popup-content input[type=checkbox] {
1143 margin-right: 8px;
1144 }
1145 .charitable-checklist-popup-content .rating-stars {
1146 color: #fdb72c;
1147 font-size: 18px;
1148 font-weight: bold;
1149 }
1150 .charitable-checklist-popup-content select {
1151 border-radius: 4px;
1152 border: 1px solid #d6d6d6;
1153 padding: 8px 12px;
1154 width: 320px;
1155 font-size: 14px;
1156 line-height: 21px;
1157 color: #777777;
1158 vertical-align: middle;
1159 }
1160 .charitable-checklist-popup-content select:focus {
1161 color: #777777;
1162 }
1163 .charitable-checklist-popup-content input[type=text] {
1164 border-radius: 4px;
1165 border: 1px solid #d6d6d6;
1166 padding: 8px 12px;
1167 width: 320px;
1168 font-size: 14px;
1169 line-height: 21px;
1170 color: #777777;
1171 vertical-align: middle;
1172 }
1173 .charitable-checklist-popup-content input[type=text]:focus {
1174 color: #777777;
1175 }
1176
1177 .charitable-checklist-popup.charitable-checklist-popup-plain {
1178 border-radius: 0;
1179 max-width: 550px;
1180 text-align: center;
1181 }
1182 .charitable-checklist-popup.charitable-checklist-popup-plain .charitable-checklist-popup-content {
1183 padding: 60px 50px;
1184 }
1185 .charitable-checklist-popup.charitable-checklist-popup-plain h3 {
1186 text-align: center;
1187 font-weight: bold;
1188 font-size: 24px;
1189 letter-spacing: 0;
1190 color: #444444;
1191 }
1192 .charitable-checklist-popup.charitable-checklist-popup-plain p {
1193 text-align: center;
1194 font-size: 18px;
1195 letter-spacing: 0;
1196 color: #777777;
1197 }
1198
1199 .charitable-checklist-tooltip.tooltipster-sidetip {
1200 z-index: 100099 !important;
1201 }
1202 .charitable-checklist-tooltip.tooltipster-sidetip .tooltipster-arrow-border {
1203 border: none;
1204 }
1205
1206 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-top .tooltipster-box {
1207 margin-bottom: 18px;
1208 }
1209 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
1210 top: 0;
1211 }
1212
1213 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-right .tooltipster-box {
1214 margin-left: 18px;
1215 }
1216 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
1217 left: 8px;
1218 }
1219
1220 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box {
1221 max-width: 260px;
1222 background: white;
1223 border: none;
1224 border-radius: 4px;
1225 box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
1226 }
1227 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .tooltipster-content {
1228 color: #444444;
1229 padding: 16px 20px 18px;
1230 text-align: center;
1231 }
1232 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .tooltipster-content div *:first-child {
1233 margin-top: 0 !important;
1234 }
1235 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .tooltipster-content h3 {
1236 font-size: 16px;
1237 letter-spacing: 0;
1238 line-height: 18px;
1239 margin: 0;
1240 color: #23282c;
1241 }
1242 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .tooltipster-content p {
1243 font-size: 14px;
1244 letter-spacing: 0;
1245 line-height: 18px;
1246 margin: 10px 0 0;
1247 color: #444444;
1248 }
1249 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .tooltipster-content a {
1250 color: #1d7bac;
1251 }
1252 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .charitable-checklist-done-btn {
1253 border-radius: 3px;
1254 cursor: pointer;
1255 text-decoration: none;
1256 text-align: center;
1257 vertical-align: middle;
1258 white-space: nowrap;
1259 box-shadow: none;
1260 font-size: 14px;
1261 font-weight: 600;
1262 letter-spacing: 0;
1263 padding: 7px 18px;
1264 border: none;
1265 background-color: #df7739;
1266 color: #ffffff;
1267 display: block;
1268 margin: 15px auto 0;
1269 }
1270 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .charitable-checklist-done-btn:hover {
1271 background-color: #b85a1b;
1272 }
1273 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .charitable-checklist-done-btn:disabled {
1274 cursor: default;
1275 opacity: 0.5;
1276 }
1277 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base .tooltipster-box .charitable-checklist-done-btn:disabled:hover {
1278 background-color: #df7739;
1279 }
1280
1281 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base.tooltipster-top .tooltipster-arrow-background {
1282 border-top-color: white;
1283 }
1284
1285 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base.tooltipster-right .tooltipster-arrow-background {
1286 border-right-color: white;
1287 }
1288
1289 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base.tooltipster-bottom .tooltipster-arrow-background {
1290 border-bottom-color: white;
1291 }
1292
1293 .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-base.tooltipster-left .tooltipster-arrow-background {
1294 border-left-color: white;
1295 }
1296
1297 .block-editor-page .edit-post-layout .components-notice-list > div {
1298 padding-left: 50px;
1299 }
1300 .block-editor-page .charitable-checklist-dot-step5 {
1301 position: absolute;
1302 top: 75px;
1303 left: 20px;
1304 z-index: 9999;
1305 }
1306 .block-editor-page .charitable-checklist-tooltip.charitable-checklist-tooltip-step5 {
1307 width: 260px !important;
1308 z-index: 1000002 !important;
1309 margin-top: 5px;
1310 }
1311 .block-editor-page .charitable-checklist-tooltip.charitable-checklist-tooltip-step5 .tooltipster-box {
1312 margin-top: 10px;
1313 }
1314 .block-editor-page .charitable-checklist-tooltip.charitable-checklist-tooltip-step5 .charitable-checklist-tooltips-red-arrow {
1315 position: absolute;
1316 display: block;
1317 width: 15px;
1318 height: 42px;
1319 top: -65px;
1320 left: 145px;
1321 background-image: url(../../images/onboarding/checklist/red-arrow.svg);
1322 background-size: 15px 42px;
1323 background-repeat: no-repeat;
1324 }
1325 .block-editor-page .charitable-checklist-tooltip.charitable-checklist-tooltip-step5.charitable-checklist-tooltip-step5-hide {
1326 z-index: -1 !important;
1327 }
1328
1329 .block-editor-page.is-fullscreen-mode .edit-post-layout .components-notice-list > div {
1330 padding-left: 125px;
1331 }
1332 .block-editor-page.is-fullscreen-mode .charitable-checklist-dot-step5 {
1333 left: 75px;
1334 }
1335 .block-editor-page.is-fullscreen-mode .charitable-checklist-tooltip .charitable-checklist-tooltips-red-arrow {
1336 left: 105px;
1337 }
1338
1339 #charitable-builder .charitable-setup-title.core {
1340 display: inline-block;
1341 padding-right: 15px;
1342 margin-right: 0;
1343 }
1344
1345 .charitable_page_charitable-builder .charitable-checklist {
1346 z-index: 100099;
1347 }
1348 .charitable_page_charitable-builder .charitable-checklist-tooltip.tooltipster-sidetip.tooltipster-right .tooltipster-arrow {
1349 left: 0;
1350 }
1351
1352 .charitable-invisible {
1353 opacity: 0 !important;
1354 }
1355
1356 @media all and (max-height: 900px) {
1357 #charitable-checklist-contact-popup {
1358 margin: 50px 0 20px;
1359 }
1360 }
1361 @media all and (max-width: 1023px) {
1362 .charitable-checklist-tooltip.tooltipster-sidetip {
1363 display: none !important;
1364 }
1365 .charitable-checklist {
1366 display: none !important;
1367 }
1368 }
1369 @media (max-width: 1024px) {
1370 .charitable-checklist {
1371 display: none !important;
1372 visibility: hidden !important;
1373 }
1374 .charitable-checklist * {
1375 display: none !important;
1376 visibility: hidden !important;
1377 }
1378 .charitable-checklist-dot {
1379 display: none !important;
1380 visibility: hidden !important;
1381 }
1382 .charitable-checklist-dot * {
1383 display: none !important;
1384 visibility: hidden !important;
1385 }
1386 .charitable-checklist-tooltips {
1387 display: none !important;
1388 visibility: hidden !important;
1389 }
1390 .charitable-checklist-tooltips * {
1391 display: none !important;
1392 visibility: hidden !important;
1393 }
1394 .charitable-checklist-tooltip {
1395 display: none !important;
1396 visibility: hidden !important;
1397 }
1398 .charitable-checklist-tooltip * {
1399 display: none !important;
1400 visibility: hidden !important;
1401 }
1402 .charitable-checklist-popup-container {
1403 display: none !important;
1404 visibility: hidden !important;
1405 }
1406 .charitable-checklist-popup-container * {
1407 display: none !important;
1408 visibility: hidden !important;
1409 }
1410 #charitable-welcome .checklist {
1411 display: none !important;
1412 visibility: hidden !important;
1413 }
1414 }
1415 /* Tour */
1416 .tippy-tooltip {
1417 box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
1418 }
1419
1420 .shepherd-content .shepherd-text p {
1421 text-align: center;
1422 font-size: 18px;
1423 line-height: 28px;
1424 letter-spacing: 0;
1425 color: #777777;
1426 }
1427 .shepherd-content .shepherd-text p.charitable-tour-tip {
1428 background-color: #5AA152;
1429 color: #fff;
1430 font-weight: 200;
1431 padding: 10px 30px;
1432 font-size: 16px;
1433 line-height: 24px;
1434 display: block;
1435 }
1436
1437 .shepherd-has-title .shepherd-content {
1438 padding: 15px 30px;
1439 }
1440 .shepherd-has-title .shepherd-content header.shepherd-header {
1441 background-color: transparent;
1442 text-align: center;
1443 padding-top: 15px;
1444 padding-bottom: 0px;
1445 }
1446 .shepherd-has-title .shepherd-content header.shepherd-header h3 {
1447 margin-top: 0;
1448 justify-content: center;
1449 text-align: center;
1450 font-weight: bold;
1451 font-size: 21px;
1452 letter-spacing: 0;
1453 color: #444444;
1454 }
1455 .shepherd-has-title .shepherd-content header.shepherd-header .shepherd-cancel-icon {
1456 color: grey;
1457 }
1458 .shepherd-has-title .shepherd-content .shephard-text {
1459 margin: 0 0 15px 0;
1460 }
1461 .shepherd-has-title .shepherd-cancel-icon {
1462 position: absolute;
1463 font-size: 1.25em;
1464 top: 5px;
1465 right: 9px;
1466 }
1467 .shepherd-has-title footer {
1468 justify-content: center;
1469 }
1470
1471 .wpchar-visual-campaign-builder-step-2 .shepherd-text {
1472 text-align: left;
1473 }
1474
1475 .shepherd-footer {
1476 justify-content: center;
1477 margin-top: 10px;
1478 margin-bottom: 5px;
1479 }
1480
1481 /* Progress */
1482 .shepherd-content .charitable-tour-progress-bar {
1483 display: block;
1484 border: 1px solid #e6e6e6;
1485 width: 50%;
1486 height: 5px;
1487 margin: 0 auto;
1488 }
1489 .shepherd-content .charitable-tour-progress {
1490 background-color: #5AA152;
1491 display: block;
1492 height: 5px;
1493 }
1494
1495 /* Buttons */
1496 .charitable-tour-btn-primary.shepherd-button {
1497 display: inline-block;
1498 border-radius: 4px;
1499 cursor: pointer;
1500 text-decoration: none;
1501 text-align: center;
1502 vertical-align: middle;
1503 white-space: nowrap;
1504 box-shadow: none;
1505 font-size: 16px;
1506 font-weight: 600 !important;
1507 line-height: 19px;
1508 padding: 10px 20px;
1509 border: none;
1510 background-color: #df7739;
1511 color: #ffffff;
1512 text-transform: capitalize;
1513 letter-spacing: normal;
1514 }
1515
1516 .charitable-tour-btn-primary.shepherd-button:hover {
1517 background-color: #f89d36;
1518 }
1519
1520 .charitable-tour-btn-disabled {
1521 opacity: 0.5;
1522 }
1523
1524 .shepherd.tippy-popper[x-placement^=bottom].shepherd-has-title .tippy-arrow {
1525 border-bottom-color: white !important;
1526 }
1527
1528 /* Step 0 */
1529 .wpchar-visual-campaign-builder-step-0 {
1530 padding: 20px 50px;
1531 }
1532 .wpchar-visual-campaign-builder-step-0 header {
1533 display: none;
1534 }
1535 .wpchar-visual-campaign-builder-step-0 .shepherd-text {
1536 text-align: center;
1537 }
1538 .wpchar-visual-campaign-builder-step-0 .shepherd-text h2 {
1539 margin-top: 0;
1540 text-align: center;
1541 font-weight: bold;
1542 font-size: 24px;
1543 letter-spacing: 0;
1544 color: #444444;
1545 }
1546 .wpchar-visual-campaign-builder-step-0 .shepherd-text p {
1547 text-align: center;
1548 font-size: 18px;
1549 line-height: 28px;
1550 letter-spacing: 0;
1551 color: #777777;
1552 }
1553 .wpchar-visual-campaign-builder-step-0 .shepherd-footer {
1554 justify-content: center;
1555 margin-top: 0px;
1556 }
1557 .wpchar-visual-campaign-builder-step-0 .shepherd-content .charitable-tour-progress,
1558 .wpchar-visual-campaign-builder-step-0 .shepherd-content .charitable-tour-progress-bar {
1559 border: 0;
1560 visibility: hidden;
1561 display: none !important;
1562 }
1563
1564 /* Video */
1565 /* Tour Blocks */
1566 #tippy-3 {
1567 max-width: 375px !important;
1568 }
1569
1570 #tippy-4 {
1571 max-width: 400px !important;
1572 }
1573
1574 #tippy-2,
1575 #tippy-5,
1576 #tippy-6,
1577 #tippy-7 {
1578 max-width: 400px !important;
1579 }
1580
1581 #tippy-9,
1582 #tippy-10,
1583 #tippy-11,
1584 #tippy-12,
1585 #tippy-13 {
1586 max-width: 300px !important;
1587 }
1588
1589 /* overrides for outside the visual builder */
1590 body.charitable-admin-settings-emails #tippy-2,
1591 body.charitable-admin-settings-emails #tippy-3 {
1592 max-width: 500px !important;
1593 }
1594
1595 @media screen and (max-width: 1500px) {
1596 body.charitable-admin-settings-emails #tippy-2,
1597 body.charitable-admin-settings-emails #tippy-3 {
1598 max-width: 450px !important;
1599 }
1600 }
1601 #charitable-tour-block-1,
1602 #charitable-tour-block-2,
1603 #charitable-tour-block-3 {
1604 background-color: transparent;
1605 display: block;
1606 left: 0;
1607 right: 0;
1608 position: absolute;
1609 width: 100%;
1610 }
1611
1612 #charitable-tour-block-1 {
1613 top: 0;
1614 height: 193px;
1615 }
1616
1617 #charitable-tour-block-2 {
1618 top: 193px;
1619 height: 350px;
1620 }
1621
1622 #charitable-tour-block-3 {
1623 top: 556px;
1624 height: 250px;
1625 }
1626
1627 #charitable-tour-block-4 {
1628 background-color: transparent;
1629 display: block;
1630 left: 0;
1631 right: 0;
1632 top: 0;
1633 position: absolute;
1634 width: 180px;
1635 height: 145px;
1636 z-index: 999999;
1637 }
1638
1639 #charitable-tour-block-5 {
1640 background-color: red;
1641 display: block;
1642 left: 0;
1643 right: 0;
1644 top: 0;
1645 position: absolute;
1646 height: 50px;
1647 z-index: 999999;
1648 }
1649