PluginProbe
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) / 1.8.11.3
Charitable – Donation & Fundraising Platform (Donation Forms, Recurring Donations & Fundraising Campaigns) v1.8.11.3
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 / campaign-builder / builder-fields.css

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

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