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 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 All 212 releases
charitable / assets / css / campaign-builder / builder-ui-general.css

builder-ui-general.css in Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) 1.8.13, at assets/css/campaign-builder/builder-ui-general.css

1,913 lines 62.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 #charitable-builder .charitable-toolbar {
2 font-family: "Inter", sans-serif !important;
3 background: #ffffff;
4 box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
5 height: 76px;
6 padding: 0;
7 position: fixed;
8 text-align: center;
9 top: var(--charitable-admin-bar-height);
10 width: 100%;
11 z-index: 50;
12 -webkit-transform: translateZ(0);
13 transform: translateZ(0);
14 transition-property: top;
15 transition-duration: 0.25s;
16 transition-timing-function: ease-out;
17 }
18 #charitable-builder .charitable-toolbar .charitable-left {
19 align-items: center;
20 border-right: 1px solid #dddddd;
21 display: flex;
22 height: 100%;
23 justify-content: center;
24 left: 0;
25 position: absolute;
26 top: 0;
27 width: 95px;
28 }
29 #charitable-builder .charitable-toolbar .charitable-left .mascot:before {
30 /* font-family: charitable !important;
31 content: "\e601";
32 font-size: 65px;
33 position: absolute;
34 color: #f99d33; */
35 }
36 #charitable-builder .charitable-toolbar .charitable-left .mascot {
37 height: 50px;
38 width: 50px;
39 background-image: url("../../../assets/images/charitable-logo.svg");
40 background-size: cover;
41 background-repeat: no-repeat;
42 }
43 #charitable-builder .charitable-toolbar .charitable-center {
44 font-size: 18px;
45 font-weight: 400;
46 margin: 21px 450px 0 114px;
47 max-width: calc(100% - 750px);
48 text-align: left;
49 }
50 #charitable-builder .charitable-toolbar .charitable-center-form-name {
51 cursor: pointer;
52 }
53 #charitable-builder .charitable-toolbar .charitable-form-name {
54 font-weight: 600;
55 }
56 #charitable-builder .charitable-toolbar .charitable-title-edit img {
57 top: 3px;
58 position: relative;
59 }
60 #charitable-builder .charitable-toolbar .charitable-right {
61 align-items: center;
62 display: flex;
63 height: 100%;
64 justify-content: flex-end;
65 position: absolute;
66 right: 0;
67 top: 0;
68 }
69 #charitable-builder .charitable-toolbar .charitable-right .charitable-btn-toolbar {
70 font-size: 14px;
71 font-weight: 500;
72 height: 42px;
73 line-height: 40px;
74 margin: 0 20px 0 0;
75 padding: 0 15px;
76 text-decoration: none;
77 text-transform: capitalize;
78 color: #545660;
79 }
80 #charitable-builder .charitable-toolbar .charitable-right .charitable-btn-toolbar i {
81 color: #a6a6a6;
82 margin-right: 8px;
83 }
84 #charitable-builder .charitable-toolbar #charitable-preview-btn:not(.charitable-alone) {
85 margin-right: 8px;
86 }
87 #charitable-builder .charitable-toolbar #charitable-embed,
88 #charitable-builder .charitable-toolbar #charitable-view-btn,
89 #charitable-builder .charitable-toolbar #charitable-preview-btn {
90 border: 0;
91 margin-right: 10px;
92 background-color: transparent;
93 position: relative;
94 }
95 #charitable-builder .charitable-toolbar #charitable-embed img.topbar_icon,
96 #charitable-builder .charitable-toolbar #charitable-view-btn img.topbar_icon,
97 #charitable-builder .charitable-toolbar #charitable-preview-btn img.topbar_icon {
98 float: left;
99 margin-top: 13px;
100 margin-right: 8px;
101 }
102 #charitable-builder .charitable-toolbar #charitable-preview-btn img.topbar_icon {
103 margin-top: 13px;
104 margin-right: 10px;
105 }
106 #charitable-builder .charitable-toolbar #charitable-embed {
107 margin-right: 3px;
108 }
109 #charitable-builder .charitable-toolbar #charitable-view-btn {
110 padding-right: 5px;
111 padding-left: 5px;
112 margin-right: 0px;
113 }
114 #charitable-builder .charitable-toolbar #charitable-view-btn img.topbar_icon {
115 margin-top: 12px;
116 margin-right: 8px;
117 }
118 #charitable-builder .charitable-toolbar #charitable-status {
119 position: relative;
120 padding: 0;
121 }
122 #charitable-builder .charitable-toolbar #charitable-status #charitable-status-button {
123 max-height: 42px;
124 margin-right: 10px;
125 margin-left: 0px;
126 }
127 #charitable-builder .charitable-toolbar #charitable-status #charitable-status-button.active {
128 background-color: #eee;
129 border-color: #eee;
130 }
131 #charitable-builder .charitable-toolbar #charitable-status .text {
132 padding-right: 25px;
133 border-right: 1px solid #E9EAEC;
134 margin-right: 10px;
135 height: 42px;
136 display: inline-block;
137 }
138 #charitable-builder .charitable-toolbar #charitable-status ul {
139 position: absolute;
140 top: 50px;
141 width: 180px;
142 left: 0;
143 border-radius: 3px;
144 background-color: #ffffff;
145 padding: 15px;
146 margin: 0;
147 border: 1px solid #DDD;
148 }
149 #charitable-builder .charitable-toolbar #charitable-status ul li {
150 margin: 0;
151 padding: 0;
152 width: 100%;
153 text-align: left;
154 }
155 #charitable-builder .charitable-toolbar #charitable-status ul li a {
156 color: #545660;
157 font-size: 14px;
158 line-height: 32px;
159 text-decoration: none;
160 font-weight: 500;
161 }
162 #charitable-builder .charitable-toolbar #charitable-status ul li a:hover {
163 color: black;
164 text-decoration: underline;
165 }
166 #charitable-builder .charitable-toolbar #charitable-save {
167 border-radius: 6px;
168 position: relative;
169 color: white;
170 }
171 #charitable-builder .charitable-toolbar #charitable-save i {
172 color: rgba(255, 255, 255, 0.65);
173 }
174 #charitable-builder .charitable-toolbar #charitable-save img.topbar_icon {
175 float: left;
176 margin-top: 13px;
177 margin-right: 8px;
178 }
179 #charitable-builder .charitable-toolbar #charitable-exit {
180 align-items: center;
181 background-color: #ffffff;
182 border-bottom: none;
183 border-left: 1px solid #dddddd;
184 border-right: none;
185 border-top: none;
186 color: #a6a6a6;
187 cursor: pointer;
188 display: flex;
189 font-size: 28px;
190 height: 76px;
191 justify-content: center;
192 right: 0;
193 text-decoration: none;
194 top: 0;
195 width: 66px;
196 }
197 #charitable-builder .charitable-toolbar #charitable-exit:hover {
198 background-color: #f8f8f8;
199 color: #777777;
200 }
201
202 .charitable-panels-toggle {
203 display: flex;
204 flex-direction: column;
205 background: #2d2d2d;
206 color: #ffffff;
207 min-height: calc(100vh - 76px - var(--charitable-admin-bar-height));
208 max-height: calc(100vh - 76px - var(--charitable-admin-bar-height));
209 left: 0;
210 margin: 76px -100px 0 0;
211 overflow-x: hidden;
212 overflow-y: auto;
213 padding: 0;
214 position: fixed;
215 text-align: left;
216 top: var(--charitable-admin-bar-height);
217 transform: translateZ(0);
218 width: 95px;
219 z-index: 15;
220 transition-property: top;
221 transition-duration: 0.25s;
222 transition-timing-function: ease-out;
223 }
224 .charitable-panels-toggle button {
225 background: none;
226 border: none;
227 border-bottom: 1px solid #444444;
228 cursor: pointer;
229 display: block;
230 margin: 0 0 0 0;
231 padding: 18px 11px;
232 width: 100%;
233 }
234 .charitable-panels-toggle button.active, .charitable-panels-toggle button.active:hover {
235 background-color: #5AA152;
236 }
237 .charitable-panels-toggle button.active .fa, .charitable-panels-toggle button.active:hover .fa {
238 color: #ffffff;
239 }
240 .charitable-panels-toggle button:hover {
241 background-color: #444444;
242 }
243 .charitable-panels-toggle button.disabled, .charitable-panels-toggle button.disabled:hover {
244 background-color: none;
245 opacity: 0.2;
246 cursor: default;
247 }
248 .charitable-panels-toggle button.disabled .fa, .charitable-panels-toggle button.disabled:hover .fa {
249 color: #ffffff;
250 }
251 .charitable-panels-toggle button .fa {
252 color: #999999;
253 display: block;
254 font-size: 30px;
255 margin: 0 auto 5px auto;
256 text-align: center !important;
257 }
258 .charitable-panels-toggle button span {
259 color: #ffffff;
260 font-weight: 400;
261 display: block;
262 font-size: 14px;
263 line-height: 23px;
264 max-width: 100%;
265 overflow: hidden;
266 text-overflow: ellipsis;
267 white-space: nowrap;
268 }
269
270 .charitable-panels-toggle button[data-panel=template] {
271 padding-top: 20px;
272 padding-bottom: 15px;
273 }
274
275 .charitable-panel {
276 display: none;
277 }
278 .charitable-panel.active {
279 display: block;
280 }
281
282 .charitable-panel-full-content .charitable-panel-content-wrap,
283 .charitable-panel-sidebar-content .charitable-panel-content-wrap {
284 background-color: #6d6d6d;
285 bottom: 0;
286 left: 95px;
287 overflow: auto;
288 padding: 50px;
289 position: fixed;
290 right: 0;
291 top: calc(76px + var(--charitable-admin-bar-height));
292 z-index: 10;
293 transition-property: top, left;
294 transition-duration: 0.25s, 0.15s;
295 transition-timing-function: ease-out, ease-in-out;
296 }
297 .charitable-panel-full-content .charitable-panel-content,
298 .charitable-panel-sidebar-content .charitable-panel-content {
299 background-color: #ffffff;
300 box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);
301 min-height: 100%;
302 padding: 30px;
303 border-radius: 5px;
304 }
305
306 .charitable-panel-sidebar-content .charitable-panel-sidebar-toggle-icon {
307 align-items: center;
308 background-image: url(../../images/campaign-builder/toggle-tab-bg.svg);
309 background-size: 100% 58px;
310 background-repeat: no-repeat;
311 border-radius: 5px 5px 0 0;
312 color: #86919e;
313 display: flex;
314 font-size: 20px;
315 height: 58px;
316 left: 495px;
317 cursor: pointer;
318 position: absolute;
319 top: calc(50% + 24px);
320 width: 15px;
321 z-index: 15;
322 transition-property: left, width;
323 transition-duration: 0.15s;
324 transition-timing-function: ease-in-out;
325 }
326 .charitable-panel-sidebar-content .charitable-panel-sidebar-toggle-icon:hover {
327 color: #444444;
328 }
329 .charitable-panel-sidebar-content .charitable-panel-sidebar-toggle-icon:hover i {
330 left: -3px;
331 }
332 .charitable-panel-sidebar-content .charitable-panel-sidebar-toggle-icon i {
333 left: 0;
334 position: relative;
335 transition-property: transform, left;
336 transition-duration: 0.15s;
337 transition-timing-function: ease-in-out;
338 }
339 .charitable-panel-sidebar-content .charitable-panel-content-wrap {
340 left: 495px;
341 }
342 .charitable-panel-sidebar-content .charitable-panel-sidebar {
343 background-color: #ebf3fc;
344 bottom: 0;
345 left: 95px;
346 overflow: auto;
347 position: fixed;
348 top: calc(76px + var(--charitable-admin-bar-height));
349 width: 400px;
350 }
351
352 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar-toggle-vertical-line {
353 position: absolute;
354 border-right: 3px solid #ebf3fb;
355 top: calc(76px + var(--charitable-admin-bar-height));
356 height: 100%;
357 left: 95px;
358 z-index: 0;
359 cursor: pointer;
360 transition-property: z-index;
361 transition-duration: 0.15s;
362 transition-timing-function: ease-in-out;
363 }
364 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar-toggle-vertical-line:hover {
365 z-index: 15;
366 }
367 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar-toggle-icon {
368 justify-content: center;
369 left: 95px;
370 }
371 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar-toggle-icon i {
372 transform: rotate(180deg);
373 }
374 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar,
375 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar .charitable-tabs {
376 left: -305px;
377 }
378 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-content-wrap {
379 left: 95px;
380 }
381 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar-toggle:hover .charitable-panel-sidebar-toggle-vertical-line {
382 z-index: 15;
383 }
384 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar-toggle:hover .charitable-panel-sidebar-toggle-icon {
385 width: 18px;
386 }
387 #charitable-panel-design .charitable-panel-sidebar-content.charitable-panel-sidebar-closed .charitable-panel-sidebar-toggle:hover .charitable-panel-sidebar-toggle-icon i {
388 left: 0;
389 }
390
391 .charitable-panel-field {
392 margin-bottom: 20px;
393 max-width: 95%;
394 display: table;
395 width: 95%;
396 }
397 .charitable-panel-field.wide, .charitable-panel-field.charitable-panel-field-tinymce, .charitable-panel-field.charitable-panel-field-warning {
398 max-width: 800px;
399 }
400 .charitable-panel-field.campaign-builder-textarea-fullwidth, .charitable-panel-field.campaign-builder-textarea-fullwidth div.ql-editor {
401 width: 100%;
402 max-width: 100%;
403 min-width: auto;
404 }
405 .charitable-panel-field.campaign-builder-textarea-tall {
406 min-height: 900px;
407 }
408 .charitable-panel-field.campaign-builder-textarea-tall div.campaign-builder-htmleditor {
409 min-height: 900px;
410 }
411 .charitable-panel-field.campaign-builder-textarea-tall div.ql-editor {
412 min-height: auto;
413 }
414 .charitable-panel-field input[type=text],
415 .charitable-panel-field input[type=url],
416 .charitable-panel-field textarea {
417 width: 100%;
418 }
419 .charitable-panel-field input[type=range] {
420 display: inline-block;
421 }
422 .charitable-panel-field.charitable-panel-field-number-slider {
423 /***** Track Styles *****/
424 /***** Chrome, Safari, Opera, and Edge Chromium *****/
425 /******** Firefox ********/
426 /***** Thumb Styles *****/
427 /***** Chrome, Safari, Opera, and Edge Chromium *****/
428 /***** Firefox *****/
429 /***** Focus Styles *****/
430 /* Removes default focus */
431 /***** Chrome, Safari, Opera, and Edge Chromium *****/
432 /******** Firefox ********/
433 }
434 .charitable-panel-field.charitable-panel-field-number-slider input[type=range] {
435 float: left;
436 margin-left: 0;
437 -webkit-appearance: none;
438 appearance: none;
439 background: transparent;
440 cursor: pointer;
441 }
442 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]:focus {
443 box-shadow: none;
444 border: 0;
445 }
446 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]::-webkit-slider-runnable-track {
447 background: #2B66D1;
448 height: 4px;
449 }
450 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]::-moz-range-track {
451 background: #2B66D1;
452 height: 4px;
453 }
454 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]::-webkit-slider-thumb {
455 -webkit-appearance: none; /* Override default look */
456 appearance: none;
457 margin-top: -6px; /* Centers thumb on the track */
458 background-color: white;
459 border: 2px solid #2B66D1;
460 border-radius: 50%;
461 height: 16px;
462 width: 16px;
463 }
464 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]::-moz-range-thumb {
465 border: none; /*Removes extra border that FF applies*/
466 background-color: white;
467 border: 2px solid #2B66D1;
468 border-radius: 50%;
469 height: 16px;
470 width: 16px;
471 }
472 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]:focus {
473 outline: none;
474 }
475 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]:focus::-webkit-slider-thumb {
476 border: 2px solid #2B66D1;
477 outline: 1px solid transparent;
478 outline-offset: 0.125rem;
479 }
480 .charitable-panel-field.charitable-panel-field-number-slider input[type=range]:focus::-moz-range-thumb {
481 border: 2px solid #2B66D1;
482 outline: 1px solid transparent;
483 outline-offset: 0.125rem;
484 }
485 .charitable-panel-field.charitable-panel-field-number-slider .charitable-number-slider-hint {
486 float: left;
487 margin-left: 10px;
488 }
489 .charitable-panel-field.charitable-panel-field-number-slider .charitable-number-slider-hint small {
490 font-size: 11px;
491 line-height: 11px;
492 color: transparent;
493 display: block;
494 }
495 .charitable-panel-field.charitable-panel-field-number-slider .charitable-number-slider-hint.min-reach {
496 color: red;
497 }
498 .charitable-panel-field.charitable-panel-field-number-slider .charitable-number-slider-hint.min-reach small {
499 color: red;
500 }
501 .charitable-panel-field input[type=number] {
502 width: 20%;
503 }
504 .charitable-panel-field select {
505 max-width: 100%;
506 width: 100%;
507 }
508 .charitable-panel-field input[readonly].readonly-active {
509 background-color: white;
510 }
511 .charitable-panel-field input[type=number] {
512 height: auto;
513 }
514 .charitable-panel-field div.ql-container {
515 height: auto !important;
516 }
517 .charitable-panel-field div.ql-editor {
518 height: auto !important;
519 min-height: 150px;
520 }
521 .charitable-panel-field .row {
522 clear: both;
523 display: block;
524 margin-bottom: 6px;
525 width: 100%;
526 }
527 .charitable-panel-field label {
528 display: block;
529 font-size: 14px;
530 font-weight: 400;
531 margin: 0 0 10px 0;
532 vertical-align: text-top;
533 }
534 .charitable-panel-field label.inline {
535 display: inline-block;
536 font-weight: 400;
537 margin: 0 0 0 10px;
538 }
539 .charitable-panel-field p {
540 font-size: 14px;
541 margin: 0;
542 }
543 .charitable-panel-field p.charitable-campaign-builder-field-textarea-description, .charitable-panel-field p.charitable-campaign-builder-field-uploader-description {
544 font-style: italic;
545 margin-top: 5px;
546 margin-bottom: 5px;
547 }
548 .charitable-panel-field p.charitable-campaign-builder-field-checkbox-description {
549 margin-top: 10px;
550 font-style: italic;
551 font-size: 12px;
552 line-height: 14px;
553 }
554 .charitable-panel-field .ql-editor p {
555 margin: revert;
556 }
557 .charitable-panel-field p.note {
558 color: #777777;
559 font-size: 12px;
560 margin: 10px 0 0 0;
561 }
562 .charitable-panel-field-anti-spam-disallowed-keys textarea {
563 height: 200px;
564 }
565 .charitable-panel-field.charitable-panel-field-donation-amounts-clone th.description-col,
566 .charitable-panel-field.charitable-panel-field-donation-amounts-clone td.description-col {
567 display: none;
568 }
569 .charitable-panel-field.charitable-panel-field-donation-amounts-clone .default_amount-col {
570 width: 25%;
571 }
572 .charitable-panel-field.charitable-panel-field-donation-amounts-clone .charitable-button {
573 display: block;
574 text-align: center;
575 margin: 10px 0;
576 }
577 .charitable-panel-fields-group .charitable-panel-fields-group-title {
578 font-size: 16px;
579 font-weight: 600;
580 line-height: 19px;
581 margin-bottom: 25px;
582 margin-top: 30px;
583 }
584 .charitable-panel-fields-group .charitable-panel-fields-group-description {
585 color: #777777;
586 font-size: 14px;
587 line-height: 17px;
588 margin-bottom: 20px;
589 }
590 .charitable-panel-fields-group .charitable-panel-fields-group-inner {
591 margin-bottom: 20px;
592 }
593 .charitable-panel-fields-group .charitable-panel-fields-group-inner .charitable-panel-field-headline {
594 margin-top: 50px;
595 }
596 .charitable-panel-fields-group .charitable-panel-fields-group-inner .charitable-campaign-builder-headline-light {
597 font-weight: 500;
598 }
599 .charitable-panel-fields-group .charitable-panel-fields-group-border-top {
600 border-top: 1px solid #dddddd;
601 margin-bottom: 20px;
602 margin-top: 20px;
603 }
604 .charitable-panel-fields-group .charitable-panel-fields-group-border-bottom {
605 border-top: 1px solid #dddddd;
606 margin-bottom: 20px;
607 margin-top: 20px;
608 }
609 .charitable-panel-fields-group.charitable-builder-notifications-advanced .charitable-panel-fields-group-border-top {
610 margin: 0 20px 10px;
611 }
612 .charitable-panel-fields-group.charitable-builder-notifications-advanced.unfoldable .charitable-panel-fields-group-title {
613 padding: 10px 20px;
614 }
615 .charitable-panel-fields-group.charitable-builder-notifications-advanced.unfoldable .charitable-panel-fields-group-title i {
616 right: 20px;
617 }
618 .charitable-panel-fields-group.unfoldable .charitable-panel-fields-group-border-top {
619 margin-bottom: 10px;
620 }
621 .charitable-panel-fields-group.unfoldable .charitable-panel-fields-group-title {
622 cursor: pointer;
623 font-size: 16px;
624 font-weight: 600;
625 margin-bottom: 10px;
626 padding: 10px 0;
627 position: relative;
628 }
629 .charitable-panel-fields-group.unfoldable .charitable-panel-fields-group-title i {
630 color: #bbbbbb;
631 position: absolute;
632 right: 0;
633 top: calc(50% - 7px);
634 transition-property: transform;
635 transition-duration: 0.15s;
636 transition-timing-function: ease-in;
637 }
638 .charitable-panel-fields-group.unfoldable.opened .charitable-panel-fields-group-title i {
639 transform: rotate(90deg);
640 }
641
642 .charitable-panel-content-section-general .charitable-panel-fields-group.unfoldable .charitable-panel-fields-group-title {
643 margin-bottom: 0;
644 padding-bottom: 0;
645 }
646 .charitable-panel-content-section-general .charitable-panel-fields-group.unfoldable .charitable-panel-fields-group-title i {
647 top: calc(50% - 2px);
648 }
649 .charitable-panel-content-section-general .charitable-panel-fields-group.unfoldable.opened .charitable-panel-fields-group-title {
650 margin-bottom: 10px;
651 padding: 10px 0;
652 }
653 .charitable-panel-content-section-general .charitable-panel-fields-group.unfoldable.opened .charitable-panel-fields-group-title i {
654 top: calc(50% - 7px);
655 }
656
657 .charitable-panel-fields-group.charitable-highlight {
658 margin-left: -30px;
659 padding-left: 30px;
660 margin-right: -30px;
661 padding-right: 30px;
662 padding-bottom: 30px;
663 background-color: yellow;
664 animation-name: bckanim;
665 animation-fill-mode: forwards;
666 animation-duration: 3s;
667 animation-delay: 0s;
668 }
669
670 @keyframes bckanim {
671 0% {
672 background-color: yellow;
673 }
674 100% {
675 background-color: transparent;
676 }
677 }
678 @media screen and (max-width: 1200px) {
679 .charitable-panel-field {
680 max-width: 98%;
681 }
682 .charitable-panel-field.wide, .charitable-panel-field.charitable-panel-field-tinymce, .charitable-panel-field.charitable-panel-field-warning {
683 max-width: auto;
684 }
685 }
686 .charitable-panel-sidebar-section {
687 border-bottom: 1px solid #ced7e0;
688 color: #444444;
689 display: block;
690 font-size: 16px;
691 line-height: 18px;
692 margin: 0;
693 outline: 0;
694 padding: 17px 20px 17px 20px;
695 position: relative;
696 text-decoration: none;
697 }
698 .charitable-panel-sidebar-section:hover {
699 background-color: #e0e8f0;
700 color: #444444;
701 }
702 .charitable-panel-sidebar-section.icon {
703 padding: 28px 20px 28px 79px;
704 }
705 .charitable-panel-sidebar-section.education-modal {
706 opacity: 0.5;
707 }
708 .charitable-panel-sidebar-section.education-modal .charitable-panel-sidebar-recommended {
709 margin-left: 5px;
710 }
711 .charitable-panel-sidebar-section.default {
712 display: none;
713 }
714 .charitable-panel-sidebar-section.active, .charitable-panel-sidebar-section.active:hover {
715 background-color: #036aab;
716 color: #ffffff;
717 }
718 .charitable-panel-sidebar-section .fa-angle-right {
719 color: #b0b6bd;
720 float: right;
721 font-size: 16px;
722 line-height: 16px;
723 text-align: center;
724 }
725 .charitable-panel-sidebar-section .fa-check-circle-o {
726 color: transparent;
727 float: right;
728 font-size: 18px;
729 margin: 0 20px;
730 }
731 .charitable-panel-sidebar-section .fa-check-circle-o:before {
732 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23B0B6BD'%3E%3Cdefs/%3E%3Cpath d='M8 .25a7.75 7.75 0 100 15.5A7.75 7.75 0 008 .25zm0 1.5a6.25 6.25 0 110 12.5 6.25 6.25 0 010-12.5zm4.38 4.1l-.72-.72c-.13-.16-.38-.16-.54 0L6.72 9.5 4.84 7.62a.36.36 0 00-.53 0l-.72.7c-.12.15-.12.4 0 .52l2.85 2.88c.15.15.37.15.53 0l5.4-5.35c.13-.15.13-.4 0-.53z'/%3E%3C/svg%3E");
733 background-repeat: no-repeat;
734 }
735 .charitable-panel-sidebar-section.active .fa-angle-right {
736 color: #7897CD;
737 }
738 .charitable-panel-sidebar-section.active .fa-check-circle-o:before {
739 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23fff'%3E%3Cdefs/%3E%3Cpath d='M8 .25a7.75 7.75 0 100 15.5A7.75 7.75 0 008 .25zm0 1.5a6.25 6.25 0 110 12.5 6.25 6.25 0 010-12.5zm4.38 4.1l-.72-.72c-.13-.16-.38-.16-.54 0L6.72 9.5 4.84 7.62a.36.36 0 00-.53 0l-.72.7c-.12.15-.12.4 0 .52l2.85 2.88c.15.15.37.15.53 0l5.4-5.35c.13-.15.13-.4 0-.53z'/%3E%3C/svg%3E");
740 }
741 .charitable-panel-sidebar-section.active img {
742 border-color: #005387;
743 }
744 .charitable-panel-sidebar-section img {
745 border: 1px solid #b0b6bd;
746 border-radius: 4px;
747 left: 20px;
748 position: absolute;
749 top: 15px;
750 width: 44px;
751 }
752 .charitable-panel-sidebar-section .charitable-panel-sidebar-recommended {
753 background-color: #00a32a;
754 border-radius: 4px;
755 color: #ffffff;
756 font-size: 10px;
757 font-weight: 700;
758 line-height: 1;
759 padding: 4px 5px;
760 margin-left: 10px;
761 display: inline-block;
762 position: relative;
763 top: -2px;
764 text-transform: uppercase;
765 }
766 .charitable-panel-sidebar-section .charitable-panel-sidebar-recommended i {
767 opacity: 0.8;
768 }
769 .charitable-panel-sidebar-section .charitable-builder-sidebar-icon {
770 position: relative;
771 width: auto;
772 left: auto;
773 top: auto;
774 float: left;
775 margin-right: 20px;
776 width: 44px;
777 height: 44px;
778 }
779 .charitable-panel-sidebar-section.marketing-request, .charitable-panel-sidebar-section.payment-request {
780 font-style: italic;
781 text-transform: capitalize;
782 }
783
784 #charitable-panel-marketing .charitable-panel-sidebar,
785 #charitable-panel-payment .charitable-panel-sidebar {
786 /* display: table; */
787 }
788 #charitable-panel-marketing .charitable-panel-sidebar-section,
789 #charitable-panel-payment .charitable-panel-sidebar-section {
790 display: table;
791 width: 100%;
792 vertical-align: middle;
793 line-height: 44px;
794 }
795 #charitable-panel-marketing .charitable-panel-sidebar-section .fa-angle-right,
796 #charitable-panel-payment .charitable-panel-sidebar-section .fa-angle-right {
797 position: relative;
798 top: 15px;
799 }
800 #charitable-panel-marketing .charitable-panel-sidebar-section .charitable-payment-recommended,
801 #charitable-panel-payment .charitable-panel-sidebar-section .charitable-payment-recommended {
802 text-transform: uppercase;
803 font-size: 11px;
804 line-height: 20px;
805 font-weight: 600;
806 padding-left: 25px;
807 background-image: url("../../images/icons/recommended.svg");
808 background-repeat: no-repeat;
809 background-position: left;
810 height: 20px;
811 display: table;
812 float: right;
813 position: relative;
814 width: auto;
815 top: 15px;
816 padding-right: 20px;
817 }
818 #charitable-panel-marketing .charitable-panel-sidebar-section.active .charitable-payment-recommended,
819 #charitable-panel-payment .charitable-panel-sidebar-section.active .charitable-payment-recommended {
820 color: white;
821 }
822
823 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior,
824 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior {
825 text-align: center;
826 }
827 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .header-content h2,
828 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .header-content h2 {
829 font-size: 21px;
830 line-height: 24px;
831 font-weight: 600;
832 }
833 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior img.charitable-builder-sidebar-icon,
834 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior img.charitable-builder-sidebar-icon {
835 height: auto;
836 max-width: 40%;
837 max-height: 140px;
838 }
839 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .header-content,
840 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content,
841 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .header-content,
842 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content {
843 width: 75%;
844 margin-left: auto;
845 margin-right: auto;
846 }
847 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .header-content h2 strong,
848 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content h2 strong,
849 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .header-content h2 strong,
850 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content h2 strong {
851 font-weight: 800;
852 }
853 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-images,
854 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-images {
855 clear: both;
856 display: table;
857 margin: 25px auto;
858 text-align: center;
859 width: 75%;
860 }
861 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-images img,
862 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-images img {
863 width: 40%;
864 max-width: 600px;
865 }
866 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-images.type-custom img,
867 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-images.type-custom img {
868 width: auto;
869 max-width: 600px;
870 }
871 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-images .charitable-marketing-image,
872 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-images .charitable-payment-image,
873 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-images .charitable-marketing-image,
874 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-images .charitable-payment-image {
875 margin-left: 10px;
876 margin-right: 10px;
877 border: 1px solid #DDD;
878 padding: 5px;
879 }
880 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content,
881 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content {
882 text-align: center;
883 }
884 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content ul li,
885 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content ul li {
886 background-image: url("../../images/icons/bullet_check.svg");
887 background-repeat: no-repeat;
888 background-position: 0 5px;
889 padding-left: 25px;
890 width: 45%;
891 display: inline-table;
892 margin: 15px;
893 text-align: left;
894 }
895 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-buttons,
896 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-buttons {
897 margin: 40px auto;
898 }
899 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-buttons h2,
900 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-buttons h2 {
901 margin-bottom: 25px;
902 }
903 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .education-buttons.top,
904 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .education-buttons.top {
905 margin-top: 20px;
906 }
907 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .button-link,
908 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .button-link {
909 background-color: #5AA152;
910 color: #ffffff;
911 margin-left: 4px;
912 padding: 10px 30px;
913 position: relative;
914 top: 0;
915 text-decoration: none;
916 border-radius: 5px;
917 text-shadow: none;
918 font-weight: 600;
919 font-family: "Inter";
920 font-size: 16px;
921 line-height: normal;
922 cursor: pointer;
923 }
924 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .button-link:hover,
925 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .button-link:hover {
926 color: white;
927 }
928 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior button,
929 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior button {
930 background-color: #e27730;
931 border: 0;
932 color: #fff;
933 font-weight: 600;
934 text-transform: uppercase;
935 -webkit-transition: background 0.1s;
936 transition: background 0.1s;
937 padding: 10px 20px;
938 min-width: 83px;
939 border-radius: 5px;
940 font-size: 16px;
941 line-height: 20px;
942 outline: none;
943 cursor: pointer;
944 }
945 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .charitable-form-confirmation,
946 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .charitable-form-confirmation {
947 border: 1px solid #DDD;
948 padding: 10px;
949 margin: 50px auto !important;
950 text-align: center;
951 }
952 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .charitable-form-confirmation h2,
953 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .charitable-form-confirmation h2 {
954 text-align: center;
955 margin-left: auto;
956 margin-right: auto;
957 }
958
959 .charitable-feedback-form-interior-confirmation {
960 padding-bottom: 15px;
961 }
962
963 @media only screen and (min-width: 640px) and (max-width: 1600px) {
964 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .header-content,
965 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content,
966 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .header-content,
967 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content {
968 width: 90%;
969 }
970 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content,
971 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content {
972 text-align: center;
973 }
974 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content ul,
975 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content ul {
976 width: 90%;
977 margin-left: auto;
978 margin-right: auto;
979 }
980 .charitable-panel-content-section-parent-marketing .charitable-panel-content-section-interior .main-content ul li,
981 .charitable-panel-content-section-parent-payment .charitable-panel-content-section-interior .main-content ul li {
982 width: 95%;
983 display: inline-table;
984 }
985 }
986 .charitable-panel-content-section {
987 font-family: "Inter", sans-serif;
988 display: none;
989 }
990 .charitable-panel-content-section .illustration {
991 height: 260px;
992 margin: 0 auto 30px auto;
993 width: 350px;
994 }
995 .charitable-panel-content-section .illustration.illustration-marketing {
996 background: url("../../images/campaign-builder/illustration-marketing.svg") no-repeat center center;
997 background-size: 313px 260px;
998 }
999 .charitable-panel-content-section .illustration.illustration-payments {
1000 background: url("../../images/campaign-builder/illustration-payments.svg") no-repeat center center;
1001 background-size: 269px 255px;
1002 }
1003 .charitable-panel-content-section h5.charitable-campaign-builder-setting-subheading {
1004 margin-bottom: 8px;
1005 font-weight: 500;
1006 font-size: 14px;
1007 line-height: 18px;
1008 }
1009 .charitable-panel-content-section table.active {
1010 background-color: aliceblue;
1011 animation: background_fade 3s forwards;
1012 }
1013 @keyframes background_fade {
1014 from {
1015 background-color: rgb(242, 245, 169);
1016 }
1017 to {
1018 background-color: rgba(242, 245, 169, 0);
1019 }
1020 }
1021
1022 .charitable-panel-content-section-title {
1023 font-family: "Inter", sans-serif;
1024 border-bottom: 1px solid #ECECEF;
1025 color: #2B2E39;
1026 font-size: 21px;
1027 font-weight: 600;
1028 line-height: 30px;
1029 margin-bottom: 30px;
1030 padding: 0 0 30px 0;
1031 }
1032 .charitable-panel-content-section-title button,
1033 .charitable-panel-content-section-title .button {
1034 background-color: #036aab;
1035 border: none;
1036 border-radius: 4px;
1037 box-shadow: none;
1038 color: #ffffff;
1039 cursor: pointer;
1040 float: right;
1041 font-size: 14px;
1042 font-weight: 600;
1043 height: auto;
1044 line-height: 17px;
1045 margin-left: 10px;
1046 margin-top: -5px;
1047 padding: 10px 15px;
1048 text-decoration: none;
1049 appearance: none;
1050 -webkit-appearance: none;
1051 }
1052 .charitable-panel-content-section-title button:hover, .charitable-panel-content-section-title button:focus,
1053 .charitable-panel-content-section-title .button:hover,
1054 .charitable-panel-content-section-title .button:focus {
1055 background-color: #215d8f;
1056 color: #ffffff;
1057 box-shadow: none;
1058 }
1059 .charitable-panel-content-section-title button i,
1060 .charitable-panel-content-section-title .button i {
1061 margin: 0 10px 0 0;
1062 }
1063 .charitable-panel-content-section-title > a > i:before {
1064 cursor: pointer;
1065 }
1066 .charitable-panel-content-section-title .charitable-help-tooltip {
1067 font-size: 24px !important;
1068 vertical-align: 1px;
1069 }
1070
1071 .charitable-panel-content-section-description {
1072 border-bottom: 1px solid #dddddd;
1073 font-size: 14px;
1074 font-weight: 400;
1075 line-height: 20px;
1076 margin-bottom: 20px;
1077 max-height: 350px;
1078 overflow: hidden;
1079 padding-bottom: 20px;
1080 position: relative;
1081 transition-property: all;
1082 transition-duration: 0.25s;
1083 transition-timing-function: ease-in-out;
1084 }
1085 .charitable-panel-content-section-description.out {
1086 margin-bottom: 0;
1087 max-height: 0;
1088 opacity: 0;
1089 padding-bottom: 0;
1090 }
1091 .charitable-panel-content-section-description p {
1092 line-height: 20px;
1093 margin: 20px 30px 0 0;
1094 }
1095 .charitable-panel-content-section-description p:first-of-type {
1096 margin-top: 0;
1097 }
1098 .charitable-panel-content-section-description .charitable-dismiss-button {
1099 position: absolute;
1100 right: -3px;
1101 top: -3px;
1102 }
1103
1104 .charitable-panel-content-section-default {
1105 background: url("../../images/campaign-builder/default-arrow.svg") no-repeat 0 0;
1106 background-size: 96px 81px;
1107 }
1108
1109 .charitable-panel-content-section-default,
1110 .charitable-panel-content-section-info {
1111 align-content: center;
1112 min-height: calc(100vh - var(--charitable-admin-bar-height) - 195px);
1113 padding: 50px 0;
1114 text-align: center;
1115 display: flex;
1116 flex-direction: column;
1117 justify-content: center;
1118 align-items: center;
1119 }
1120 .charitable-panel-content-section-default h5,
1121 .charitable-panel-content-section-info h5 {
1122 color: #444444;
1123 font-size: 24px;
1124 font-weight: 600;
1125 line-height: normal;
1126 margin: 0 auto 10px auto;
1127 max-width: 600px;
1128 }
1129 .charitable-panel-content-section-default p,
1130 .charitable-panel-content-section-info p {
1131 color: #777777;
1132 font-size: 16px;
1133 margin: 0 auto 20px auto;
1134 max-width: 600px;
1135 }
1136 .charitable-panel-content-section-default p:last-of-type,
1137 .charitable-panel-content-section-info p:last-of-type {
1138 margin: 0 auto 0 auto;
1139 }
1140 .charitable-panel-content-section-default .charitable-btn,
1141 .charitable-panel-content-section-info .charitable-btn {
1142 margin: 20px auto;
1143 }
1144
1145 .charitable-panel-field:last-child,
1146 .charitable-builder-settings-block:last-child {
1147 margin-bottom: 0 !important;
1148 }
1149
1150 .charitable-layout-options-tab-general .charitable-layout-options-group-inner .charitable-panel-field {
1151 display: none;
1152 }
1153 .charitable-layout-options-tab-general .charitable-layout-options-group-inner .charitable-panel-field.active {
1154 display: block;
1155 }
1156
1157 .charitable-setup-title {
1158 font-size: 20px;
1159 font-weight: 600;
1160 margin: 30px 30px 0px 30px;
1161 color: #444444;
1162 }
1163
1164 #charitable-builder .secondary-text {
1165 color: #777777;
1166 font-size: 14px;
1167 margin: 10px 30px 30px 30px;
1168 }
1169
1170 #charitable-template-container {
1171 align-items: stretch;
1172 border-top: 1px solid #dddddd;
1173 display: flex;
1174 flex-grow: 2;
1175 justify-content: space-between;
1176 margin: 0 30px;
1177 padding: 0 0 30px 0;
1178 }
1179 #charitable-template-container .charitable-setup-templates-sidebar {
1180 border-right: 1px solid #dddddd;
1181 padding: 30px 30px 0 0;
1182 width: 199px;
1183 box-sizing: content-box;
1184 }
1185 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-search-wrap {
1186 position: relative;
1187 }
1188 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-search-wrap i.fa-search {
1189 color: #bbbbbb;
1190 display: block;
1191 font-size: 16px;
1192 left: 12px;
1193 position: absolute;
1194 top: 12px;
1195 width: 16px;
1196 }
1197 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-search-wrap i.fa-close {
1198 color: #bbbbbb;
1199 font-size: 16px;
1200 right: 10px;
1201 position: absolute;
1202 top: 12px;
1203 width: 16px;
1204 cursor: pointer;
1205 display: none;
1206 }
1207 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-search-wrap #charitable-setup-template-search::placeholder {
1208 color: #bbbbbb;
1209 font-weight: 400;
1210 }
1211 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-search-wrap #charitable-setup-template-search {
1212 font-size: 16px;
1213 font-weight: 400;
1214 height: 40px;
1215 line-height: 20px;
1216 padding-left: 35px;
1217 padding-right: 25px;
1218 width: 100%;
1219 color: #444444;
1220 border: 1px solid #cccccc;
1221 border-radius: 4px;
1222 box-shadow: none;
1223 }
1224 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-search-wrap #charitable-setup-template-search.highlighted {
1225 border: 1px solid rgba(0, 128, 0, 0.5);
1226 background-color: rgba(0, 128, 0, 0.1);
1227 }
1228 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-categories {
1229 border-bottom: 1px solid #ddd;
1230 margin-top: 30px;
1231 width: 199px;
1232 box-sizing: content-box;
1233 list-style: none;
1234 margin-block-end: 0;
1235 margin-inline-end: 0;
1236 margin-inline-start: 0;
1237 padding: 0 0 25px 0;
1238 }
1239 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-categories li {
1240 border-radius: 4px;
1241 color: #444444;
1242 cursor: pointer;
1243 font-size: 14px;
1244 font-weight: 600;
1245 line-height: 16px;
1246 margin: 0;
1247 padding: 10px;
1248 }
1249 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-categories li.active {
1250 background: #ebf3fc;
1251 color: #0399ed;
1252 position: relative;
1253 }
1254 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-categories li.divider {
1255 border-bottom: 1px solid #dddddd;
1256 margin: 30px 0;
1257 padding: 0;
1258 }
1259 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-categories li span {
1260 float: right;
1261 color: #777777;
1262 opacity: 0.5;
1263 font-weight: 400;
1264 }
1265 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-feedback {
1266 background-color: #f5f5f5;
1267 padding: 15px 15px;
1268 margin: 25px 0;
1269 }
1270 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-feedback h6 {
1271 font-size: 16px;
1272 line-height: 21px;
1273 margin: 0 0 15px 0;
1274 }
1275 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-feedback a {
1276 display: inline;
1277 margin: 15px 0;
1278 color: #6A6C75;
1279 padding: 0;
1280 font-weight: 400;
1281 font-size: 14px;
1282 line-height: 21px;
1283 text-decoration: underline;
1284 }
1285 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-feedback a:hover {
1286 color: #0399ed;
1287 }
1288 #charitable-template-container .charitable-template-list {
1289 margin-bottom: -30px;
1290 padding-top: 30px;
1291 width: calc(100% - 225px);
1292 position: relative;
1293 max-width: 1024px;
1294 margin-right: auto;
1295 }
1296 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container {
1297 position: absolute;
1298 top: 0;
1299 width: 100%;
1300 z-index: 9999991;
1301 transition: opacity 0.35s;
1302 opacity: 0;
1303 visibility: hidden;
1304 }
1305 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container.active {
1306 opacity: 1;
1307 visibility: visible;
1308 }
1309 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-form {
1310 margin-left: auto;
1311 margin-right: auto;
1312 background: white;
1313 padding: 0px;
1314 border-radius: 10px 10px 0 0;
1315 }
1316 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-form label {
1317 font-weight: 500;
1318 font-size: 14px;
1319 line-height: 20px;
1320 }
1321 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-form-row {
1322 margin-top: 10px;
1323 margin-bottom: 10px;
1324 }
1325 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-feedback-form-header {
1326 background-color: #282937;
1327 color: #E7E7E9;
1328 padding: 30px 0 30px 30px !important;
1329 font-size: 18px;
1330 font-weight: 600;
1331 border-radius: 10px 10px 0 0;
1332 }
1333 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-feedback-form-header .charitable-feedback-form-title {
1334 color: white;
1335 user-select: none;
1336 font-size: inherit;
1337 font-family: inherit;
1338 display: inline-block;
1339 vertical-align: middle;
1340 }
1341 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-feedback-form-interior {
1342 padding: 20px;
1343 }
1344 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-feedback-form-required {
1345 color: red;
1346 font-size: 13px;
1347 line-height: 21px;
1348 }
1349 #charitable-template-container .charitable-template-list .charitable-feedback-preview-container .charitable-templates-close-icon {
1350 color: white;
1351 padding-top: 5px;
1352 padding-right: 10px;
1353 font-size: 40px !important;
1354 height: 20px;
1355 width: 20px;
1356 position: absolute;
1357 top: 10px;
1358 right: 10px;
1359 cursor: pointer;
1360 opacity: 0.6;
1361 text-align: center;
1362 font-size: 27px !important;
1363 line-height: 14px !important;
1364 z-index: 1;
1365 }
1366 #charitable-template-container .charitable-template-list .charitable-template-list-container {
1367 display: flex;
1368 flex-wrap: wrap;
1369 margin-left: 30px;
1370 }
1371 #charitable-template-container .charitable-template-list .charitable-template-list-container.disabled {
1372 opacity: 0.15;
1373 pointer-events: none;
1374 }
1375 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item {
1376 width: 30%;
1377 display: inline-flex;
1378 margin: 10px;
1379 }
1380 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template {
1381 font-family: "Inter", sans-serif !important;
1382 border-radius: 3px;
1383 margin-bottom: 30px;
1384 margin-left: auto;
1385 margin-right: auto;
1386 min-height: 122px;
1387 padding: 15px;
1388 position: relative;
1389 max-width: 270px;
1390 box-shadow: 0 0 0 1px #DADADE;
1391 transition: box-shadow 0.15s ease-in-out;
1392 }
1393 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item.charitable-template-is-new .charitable-template {
1394 background-color: #ffebc7;
1395 }
1396 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail {
1397 background-color: transparent;
1398 width: 100%;
1399 text-align: center;
1400 display: table;
1401 height: 160px;
1402 vertical-align: middle;
1403 max-width: 240px;
1404 padding: 0;
1405 margin: 0;
1406 }
1407 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .charitable-template-thumbnail {
1408 width: 240px;
1409 height: 160px;
1410 margin: 0 auto;
1411 background-size: cover;
1412 border-radius: 0;
1413 background-repeat: no-repeat;
1414 background-position: top;
1415 display: table;
1416 position: absolute;
1417 top: 15px;
1418 left: 15px;
1419 max-width: calc(100% - 30px);
1420 }
1421 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .charitable-template-thumbnail.charitable-template-thumbnail-simple-1-col, #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .charitable-template-thumbnail.charitable-template-thumbnail-simple-2-col, #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .charitable-template-thumbnail.charitable-template-thumbnail-simple-2-col-header {
1422 background-position: center;
1423 }
1424 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons {
1425 width: 240px;
1426 height: 160px;
1427 margin: 0 auto;
1428 display: table-cell;
1429 vertical-align: middle;
1430 top: 15px;
1431 left: 15px;
1432 visibility: hidden;
1433 opacity: 0;
1434 z-index: 999;
1435 }
1436 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons a {
1437 width: 75%;
1438 margin: 5px auto;
1439 color: #2d2d2d;
1440 padding-top: 6px;
1441 padding-bottom: 6px;
1442 font-weight: 600;
1443 visibility: hidden;
1444 opacity: 0;
1445 transition: opacity 0.35s ease-in-out;
1446 }
1447 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons a.create-campaign, #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons a.update-campaign {
1448 border: 0;
1449 background-color: #639F4F !important;
1450 color: #ffffff;
1451 }
1452 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons a.preview-campaign {
1453 border: 1px solid #A4A4AB;
1454 background-color: transparent !important;
1455 color: #ffffff;
1456 }
1457 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons a.create-campaign:hover, #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons a.update-campaign:hover {
1458 border: 0;
1459 background-color: #346225 !important;
1460 transition: background-color 0.5s ease;
1461 color: #ffffff;
1462 }
1463 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .template-thumbnail .template-buttons a.preview-campaign:hover {
1464 border: 1px solid #A4A4AB;
1465 background-color: rgba(255, 255, 255, 0.85) !important;
1466 transition: background-color 0.5s ease;
1467 color: #2d2d2d;
1468 }
1469 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template h4 {
1470 font-weight: 500;
1471 font-size: 16px;
1472 line-height: 24px;
1473 margin: 10px 0 5px 0;
1474 padding: 0;
1475 color: #3F414C;
1476 }
1477 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template p {
1478 margin: 0;
1479 color: #6A6C75;
1480 padding: 0;
1481 font-weight: 400;
1482 font-size: 14px;
1483 line-height: 21px;
1484 }
1485 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template:hover .template-buttons .template-thumbnail a {
1486 display: block;
1487 line-height: 31px;
1488 font-weight: 600;
1489 color: white;
1490 font-size: 14px;
1491 }
1492 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .charitable-banner-container {
1493 left: 20px;
1494 position: absolute;
1495 top: 20px;
1496 display: block;
1497 border-radius: 7px;
1498 background-color: #5aa152;
1499 padding: 5px 8px;
1500 border: 0;
1501 z-index: 2;
1502 }
1503 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template .charitable-banner {
1504 color: #fff;
1505 border: 0;
1506 font-weight: 400;
1507 font-size: 14px;
1508 line-height: 16px;
1509 }
1510
1511 /* "NEW" pill — sits inline next to the template title, beneath the thumbnail.
1512 Matches the small sidebar pill style so it stays unobtrusive but visible. */
1513 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template h4 .charitable-template-label-new {
1514 display: inline-block;
1515 background: #f59e0b;
1516 color: #fff;
1517 font-size: 9px;
1518 font-weight: 700;
1519 line-height: 1;
1520 letter-spacing: 0.04em;
1521 padding: 3px 5px;
1522 border-radius: 3px;
1523 margin-left: 6px;
1524 vertical-align: middle;
1525 text-transform: uppercase;
1526 }
1527
1528 /* Sidebar "NEW" pill placed BEFORE a category label.
1529 Override the float: right that the global "li span" rule applies, so the
1530 pill sits inline immediately to the left of the label name. The -39px
1531 margin-left nudges the pill into the sidebar's row gutter so the label
1532 text stays aligned with the other categories. */
1533 #charitable-template-container .charitable-setup-templates-sidebar .charitable-setup-templates-categories li span.charitable-template-category-new {
1534 float: none;
1535 display: inline-block;
1536 background: #f59e0b;
1537 color: #fff;
1538 opacity: 1;
1539 font-size: 9px;
1540 font-weight: 700;
1541 line-height: 1;
1542 letter-spacing: 0.04em;
1543 padding: 3px 5px;
1544 border-radius: 3px;
1545 margin-left: -39px;
1546 margin-right: 6px;
1547 vertical-align: middle;
1548 text-transform: uppercase;
1549 }
1550 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template:hover:not(.active) {
1551 cursor: pointer;
1552 }
1553 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template:hover:not(.active) .template-thumbnail .charitable-template-thumbnail {
1554 display: table;
1555 z-index: 2;
1556 background-color: rgba(0, 0, 0, 0.7);
1557 background-blend-mode: darken;
1558 transition: background-color 0.5s ease;
1559 }
1560 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template:hover:not(.active) .template-thumbnail .template-buttons {
1561 visibility: visible;
1562 opacity: 1;
1563 }
1564 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template:hover:not(.active) .template-thumbnail .template-buttons a {
1565 visibility: visible;
1566 opacity: 1;
1567 display: block;
1568 z-index: 99;
1569 position: relative;
1570 }
1571 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template[data-template-code=lite-to-pro] .charitable-template-thumbnail {
1572 background-position: center;
1573 }
1574 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template.active:hover .template-buttons, #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item .charitable-template.active:active .template-buttons {
1575 opacity: 0;
1576 }
1577 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-section {
1578 width: 100%;
1579 margin: 0 25px;
1580 }
1581 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-section h4 {
1582 font-weight: 500;
1583 font-size: 16px;
1584 line-height: 18px;
1585 margin: 0 0 15px 0;
1586 }
1587 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-section.with-line {
1588 border-bottom: 1px solid #cccccc;
1589 }
1590 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner {
1591 background: rgba(226, 119, 48, 0.15);
1592 border-radius: 6px;
1593 display: flex;
1594 flex-direction: row;
1595 justify-content: space-between;
1596 align-items: center;
1597 padding-right: 20px;
1598 margin: 0 0 25px 0px;
1599 /* width: 910px; */
1600 }
1601 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner .charitable-template-content {
1602 padding: 20px;
1603 width: 80%;
1604 color: #444444;
1605 }
1606 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner .charitable-template-content h3 {
1607 font-weight: 600;
1608 font-size: 16px;
1609 line-height: 23px;
1610 margin-top: 0;
1611 margin-bottom: 5px;
1612 }
1613 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner .charitable-template-content p {
1614 font-weight: 400;
1615 font-size: 14px;
1616 line-height: 18px;
1617 margin: 0;
1618 }
1619 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner .charitable-template-upgrade-button {
1620 width: 20%;
1621 text-align: right;
1622 }
1623 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner .charitable-template-upgrade-button a {
1624 min-height: 13px;
1625 }
1626 @media screen and (max-width: 1279px) {
1627 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner #charitable-setup-templates-list .charitable-template-upgrade-banner .charitable-template-upgrade-button a {
1628 box-sizing: border-box;
1629 width: 100%;
1630 }
1631 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner .charitable-template-upgrade-button {
1632 width: auto;
1633 }
1634 }
1635 #charitable-template-container .charitable-templates-no-results {
1636 padding: 0 30px;
1637 }
1638
1639 .charitable-feedback-form-container {
1640 position: absolute;
1641 top: 200px;
1642 left: 0;
1643 right: 0;
1644 width: 100%;
1645 z-index: 9999991;
1646 transition: opacity 0.35s;
1647 opacity: 0;
1648 visibility: hidden;
1649 }
1650 .charitable-feedback-form-container.active {
1651 opacity: 1;
1652 visibility: visible;
1653 }
1654 .charitable-feedback-form-container .charitable-form {
1655 margin-left: auto;
1656 margin-right: auto;
1657 background: white;
1658 padding: 0px;
1659 border-radius: 10px 10px 0 0;
1660 }
1661 .charitable-feedback-form-container .charitable-form label {
1662 font-weight: 500;
1663 font-size: 14px;
1664 line-height: 20px;
1665 }
1666 .charitable-feedback-form-container .charitable-form-row {
1667 margin-top: 10px;
1668 margin-bottom: 10px;
1669 }
1670 .charitable-feedback-form-container .charitable-feedback-form-header {
1671 background-color: #282937;
1672 color: #E7E7E9;
1673 padding: 30px 0 30px 30px !important;
1674 font-size: 18px;
1675 font-weight: 600;
1676 border-radius: 10px 10px 0 0;
1677 }
1678 .charitable-feedback-form-container .charitable-feedback-form-header .charitable-feedback-form-title {
1679 color: white;
1680 user-select: none;
1681 font-size: inherit;
1682 font-family: inherit;
1683 display: inline-block;
1684 vertical-align: middle;
1685 }
1686 .charitable-feedback-form-container .charitable-feedback-form-interior {
1687 padding: 20px;
1688 }
1689 .charitable-feedback-form-container .charitable-feedback-form-required {
1690 color: red;
1691 font-size: 13px;
1692 line-height: 21px;
1693 }
1694 .charitable-feedback-form-container .charitable-templates-close-icon {
1695 color: white;
1696 padding-top: 5px;
1697 padding-right: 10px;
1698 font-size: 40px !important;
1699 height: 20px;
1700 width: 20px;
1701 position: absolute;
1702 top: 10px;
1703 right: 10px;
1704 cursor: pointer;
1705 opacity: 0.6;
1706 text-align: center;
1707 font-size: 27px !important;
1708 line-height: 14px !important;
1709 z-index: 1;
1710 }
1711
1712 @media screen and (max-width: 1300px) {
1713 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner {
1714 flex-direction: column;
1715 padding: 0 20px 20px 20px;
1716 margin: 0 0 25px 0;
1717 text-align: center;
1718 }
1719 #charitable-template-container .charitable-template-list .charitable-template-upgrade-banner .charitable-template-content {
1720 width: 100%;
1721 padding: 0;
1722 margin: 25px;
1723 }
1724 }
1725 @media (min-width: 990px) and (max-width: 1300px) {
1726 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item {
1727 width: 45%;
1728 }
1729 }
1730 @media (max-width: 990px) {
1731 #charitable-template-container .charitable-template-list .charitable-template-list-container .charitable-template-list-container-item {
1732 width: 90%;
1733 }
1734 }
1735 #charitable-builder .charitable-builder-modal {
1736 position: absolute;
1737 top: 0;
1738 width: 100%;
1739 z-index: 9999991;
1740 transition: opacity 0.65s ease-in-out;
1741 opacity: 0;
1742 visibility: hidden;
1743 transition: opacity 0.5s;
1744 display: flex;
1745 align-items: center;
1746 width: 100%;
1747 height: 100%;
1748 }
1749 #charitable-builder .charitable-builder-modal.active {
1750 opacity: 1;
1751 visibility: visible;
1752 z-index: 99999;
1753 }
1754 #charitable-builder .charitable-builder-modal .charitable-form {
1755 margin-left: auto;
1756 margin-right: auto;
1757 background: white;
1758 padding: 20px;
1759 border: 1px solid #ccc;
1760 max-width: 1000px;
1761 max-height: 1600px;
1762 width: 100%;
1763 }
1764 #charitable-builder .charitable-builder-modal .charitable-feedback-form-required {
1765 color: red;
1766 font-size: 13px;
1767 line-height: 21px;
1768 }
1769 #charitable-builder .charitable-builder-modal .charitable-templates-close-icon {
1770 color: #545660;
1771 padding-top: 5px;
1772 padding-right: 10px;
1773 font-size: 40px !important;
1774 height: 20px;
1775 width: 20px;
1776 position: absolute;
1777 top: 10px;
1778 right: 10px;
1779 cursor: pointer;
1780 opacity: 0.6;
1781 text-align: center;
1782 font-size: 27px !important;
1783 line-height: 14px !important;
1784 z-index: 1;
1785 }
1786 #charitable-builder .charitable-builder-modal .button-link {
1787 background-color: #5AA152;
1788 text-transform: capitalize;
1789 font-weight: 500;
1790 padding: 15px 25px;
1791 font-size: 16px;
1792 line-height: 20px;
1793 color: #ffffff !important;
1794 margin-left: 4px;
1795 position: relative;
1796 top: 0;
1797 text-decoration: none;
1798 border-radius: 5px;
1799 text-shadow: none;
1800 font-family: "Inter";
1801 line-height: normal;
1802 cursor: pointer;
1803 }
1804 #charitable-builder .charitable-builder-modal .button-link:hover,
1805 #charitable-builder .charitable-builder-modal .button-link:active {
1806 color: white;
1807 }
1808 #charitable-builder .charitable-builder-modal .charitable-templates-preview-headline {
1809 font-size: 32px;
1810 line-height: 32px;
1811 margin-bottom: 0;
1812 margin-top: 0;
1813 }
1814 #charitable-builder .charitable-builder-modal.charitable-builder-modal-template-preview .charitable-form {
1815 margin-left: auto;
1816 margin-right: auto;
1817 background: #fff;
1818 padding: 20px;
1819 border: 1px solid #ccc;
1820 max-width: 1000px;
1821 position: absolute;
1822 top: 125px;
1823 left: 0;
1824 right: 0;
1825 bottom: 75px;
1826 }
1827 #charitable-builder .charitable-builder-modal.charitable-builder-modal-template-preview .charitable-form .charitable-feedback-form-row-button {
1828 position: absolute;
1829 bottom: 0;
1830 left: 0;
1831 right: 0;
1832 background-color: white;
1833 margin-top: 0;
1834 margin-bottom: 0;
1835 padding: 25px 0;
1836 }
1837 #charitable-builder .charitable-builder-modal.charitable-builder-modal-template-preview .charitable-form .charitable-feedback-form-row-button a {
1838 margin: 0;
1839 width: 75%;
1840 margin-left: auto;
1841 margin-right: auto;
1842 display: block;
1843 }
1844 #charitable-builder .charitable-builder-modal.charitable-builder-modal-template-preview .charitable-form .charitable-form-row.charitable-feedback-form-preview-image {
1845 height: calc(100% - 160px);
1846 margin-top: 0;
1847 }
1848 #charitable-builder .charitable-builder-modal.charitable-builder-modal-template-preview .charitable-form .charitable-form-row.charitable-feedback-form-preview-image img {
1849 width: auto !important;
1850 max-width: 100%;
1851 height: 100%;
1852 margin-left: auto;
1853 margin-right: auto;
1854 display: block;
1855 }
1856 #charitable-builder .charitable-builder-modal.charitable-builder-modal-template-preview .charitable-form .charitable-templates-preview-description p {
1857 margin: 10px 0;
1858 }
1859
1860 .charitable-edit-campaign-title-area {
1861 position: relative;
1862 display: inline-block;
1863 width: calc(100% - 250px);
1864 }
1865 .charitable-edit-campaign-title-area input.charitable-form-name {
1866 font-size: 18px;
1867 font-weight: 400;
1868 padding: 10px 35px 10px 10px;
1869 display: inline-block;
1870 margin-right: 10px;
1871 border: 1px solid #cccccc;
1872 border-radius: 4px;
1873 width: 100%;
1874 }
1875 .charitable-edit-campaign-title-area input.charitable-form-name::-webkit-input-placeholder {
1876 font-weight: lighter;
1877 }
1878 .charitable-edit-campaign-title-area input.charitable-form-name::-moz-placeholder {
1879 font-weight: lighter;
1880 }
1881 .charitable-edit-campaign-title-area input.charitable-form-name::-ms-input-placeholder {
1882 font-weight: lighter;
1883 }
1884 .charitable-edit-campaign-title-area input.charitable-form-name[disabled] {
1885 pointer-events: none;
1886 }
1887 .charitable-edit-campaign-title-area input.charitable-form-name:focus {
1888 border: 1px solid #036aab;
1889 box-shadow: 0 0 0 1px #036aab;
1890 outline: none;
1891 }
1892 .charitable-edit-campaign-title-area input.charitable-form-name:hover {
1893 text-decoration: none;
1894 }
1895 .charitable-edit-campaign-title-area.edit input.charitable-form-name {
1896 border: none;
1897 box-shadow: none;
1898 margin-right: 20px;
1899 }
1900 .charitable-edit-campaign-title-area.edit input.charitable-form-name:focus {
1901 border: none;
1902 }
1903
1904 @media screen and (max-width: 1320px) {
1905 .charitable-edit-campaign-title-label {
1906 display: none;
1907 }
1908 .charitable-edit-campaign-title-area {
1909 width: 100%;
1910 margin-top: -5px;
1911 }
1912 }
1913