PluginProbe
Smart Grid-Layout Design for Contact Form 7 / 4.11
Smart Grid-Layout Design for Contact Form 7 v4.11
4.18.0 4.17.0 3.2.0 3.2.1 3.3.0 3.3.1 3.3.2 3.3.3 3.3.4 3.3.5 3.3.6 3.3.7 3.3.8 4.0.0 4.0.1 4.1.0 4.1.1 4.1.2 4.1.3 4.1.4 4.10 4.11 4.12 4.13 4.14 All 119 releases
cf7-grid-layout / admin / css / cf7-grid-layout-post.css

cf7-grid-layout-post.css in Smart Grid-Layout Design for Contact Form 7 4.11, at admin/css/cf7-grid-layout-post.css

752 lines 18.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 #cf7sg-cache-limit + p {margin: 0;font-style: italic;}
2 #cf7sg-cache-limit + p > code {font-style:normal;}
3 #cf7sg-cache-limit {display: inline-block;}
4 #cf7sg-cached-time {max-width: 63px;}
5 #editors, #contact-form-editor {position: relative;}
6 #optional-editors {
7 display: inline-block;
8 position: absolute;
9 margin-top: 8px;
10 z-index:2;
11 }
12 .cf7sg-tutorial {
13 width: 100%;
14 min-height: 200px;
15 }
16 .cf7sg-tutorial p {
17 width: 220px;
18 vertical-align: top;
19 display: inline-block;
20 }
21 .cf7sg-tutorial .img {
22 background-image: url('./image/tutorial.png');
23 width: 220px;
24 height: 182px;
25 background-size: contain;
26 display: inline-block;
27 }
28 .cf7sg-tutorial .img:hover {
29 transform: scale(105%);
30 }
31 .cf7sg-pointer-dynamic_checkbox,
32 .cf7sg-pointer-tutorials_pointer,
33 .cf7sg-pointer-dynamic_dropdown,
34 .cf7sg-pointer-js_css_editors
35 {width:490px !important}
36 .cf7sg-pointer .wp-pointer-buttons a.close {
37 float: left;
38 }
39 .cf7sg-pointer .wp-pointer-content h3::before {
40 content: "\01F30A";
41 font: normal 22px/normal dashicons;
42 top: 10px;
43 width: 34px;
44 height: 32px;
45 }
46 .tag-generator-panel .insert-box input.tag{max-width: 490px;}
47 /** @since 4.11 disable tag buttons on grid with no open textarea */
48 .cf7-tag-generators.click-disabled a {
49 pointer-events: none;
50 color: grey;
51 }
52 *[dir="rtl"] #optional-editors {left: 0}
53 .codemirror-theme label:hover {
54 font-weight: bold;
55 }
56 .codemirror-theme label {
57 z-index: 10;
58 position: relative;
59 }
60 .codemirror-theme input {
61 display: inline-block;
62 margin: 0 2px;
63 border-radius: 30%;
64 }
65 #contact-form-editor .loading-screen{position:absolute;z-index: 100; padding: 100px 5px 850px 5px; width: calc(100% - 10px); background-color: white; text-align: center}
66 #contact-form-editor .loading-screen h2{font-size: 20px}
67 #contact-form-editor .loading-screen .spinner{visibility: visible; float:none}
68 #contact-form-editor .loading-screen .js-error p {text-align: left;font-size: 15px}
69 #contact-form-editor .loading-screen .error {color: #b90101}
70 #optional-editors a.button {font-weight: bold;}
71 #js-tags > li.show-events:not(#last-item) {
72 display: inline-block;
73 vertical-align: top;
74 border: solid 2px #007cba;
75 background: white;
76 padding: 5px 8px;
77 border-radius: 3px;
78 }
79 #last-item {
80 display: inline-block;
81 margin-top: 5px;
82 margin-left: 3px;
83 }
84 #js-tags > li:hover > span {
85 transform: rotate(90deg);
86 display: inline-block;
87 }
88 #js-tags > li > span {
89 font-weight:bold;
90 transition: 0.2s ease-out;
91 padding: 0 5px;
92 }
93 #js-tags > li > ul {display: none;}
94 #js-tags > li > ul>li {margin:0;}
95 #js-tags > li:hover > ul {
96 display: block;
97 position: absolute;
98 background: white;
99 padding: 5px 8px;
100 border: solid 1px;
101 border-radius: 3px;
102 z-index: 100;
103 }
104 #js-tags > li:hover > ul > li:hover{position: relative}
105 #js-tags > li:hover > ul > li:hover > span > span{
106 display:block;
107 position: absolute;
108 background: white;
109 padding: 5px 8px;
110 border: solid 1px;
111 border-radius: 3px;
112 z-index: 20;
113 width: 225px;
114 left: 4px;
115 top: -3px;
116 font-style: italic;
117 }
118 /* @since 4.4 .cf7sg-slider-section .cf7sg-collapsible .collapsible-row-label,
119 .cf7sg-accordion-rows .cf7sg-collapsible .collapsible-row-label, */
120 .columns.cf7sg-slider-section, .columns.cf7sg-accordion-rows {box-shadow: 0 0 6px #6a0080;}
121 .columns:not(.full) + .row-controls .grid-controls .make-grid{display:inline-block;}
122 .columns.full > .container:not(.cf7sg-collapsible) > .row:not(.cf7-sg-table) > .columns:not(.full) + .row-controls .grid-controls .make-grid,
123 .button.make-grid.display-none,
124 .display-none, #js-tags > li.display-none:not(.show-events) {display: none;}
125 .enable-grouping.grid-column > .grid-controls .grouping-option {
126 display: inline-block;
127 }
128 .codemirror-theme {
129 position: absolute;
130 top: -26px;
131 padding: 2px 0 2px 5px;
132 background: #eae9e9;
133 width: calc( 100% - 313px);
134 }
135 .codemirror-theme span.file {
136 margin-left: 10px;
137 vertical-align: middle;
138 background: #f7ecb1;
139 padding: 4px 8px;
140 color: black;
141 max-width: calc( 100% - 216px );
142 display: inline-block;
143 overflow-x: hidden;
144 height: 15px;
145 }
146 .codemirror-theme span.file:hover {
147 max-width: none;
148 overflow-x: visible;
149 position: absolute;
150 right: 0;
151 z-index: 10;
152 height: auto;
153 width: auto;
154 }
155 #cf7-codemirror,#cf7-js-codemirror,#cf7-css-codemirror {position: relative;}
156 label.grouping-option:hover + span.popup{
157 display: inline;
158 position: absolute;
159 background: white;
160 margin-left: 6px;
161 width: 200px;
162 border: solid 1px gray;
163 border-radius: 3px;
164 padding: 1px 5px;
165 color: inherit;
166 top: auto;
167 left: auto;
168 font-weight: normal;
169 }
170 #grid-form .js-help + .cf7sg-helper-list{margin-top:39px;}
171 span.js-icon.column-control{
172 background-image: url('./image/js-sprite.png');
173 width: 13px;
174 display: inline-block;
175 height: 10px;
176 background-size: 200%;
177 margin-top: 4px;}
178 .js-icon.column-control:hover {background-position-x: 13px;}
179 span.php-icon.column-control{
180 background-image: url('./image/php-sprite.png');
181 width: 26px;
182 display: inline-block;
183 height: 13px;
184 background-size: 200%;
185 margin-top: 2px;}
186 .php-icon.column-control:hover {background-position-x: 26px;}
187 a.helper {text-decoration: none;cursor: pointer;}
188 a.helper + span.helper {
189 display: none;
190 position: absolute;
191 background: white;
192 border: solid 1px;
193 padding: 2px;
194 margin-top: -25px;
195 color: black;
196 }
197 .helper .tag-colour { font-weight: bold;}
198 a.helper:hover + span.helper {display: inline;}
199 .wp-pointer-buttons a.close {
200 margin: 5px 0 0 20px;
201 }
202 #ajax-response.error-msg{
203 color:red;
204 }
205 #full-screen-cf7 {
206 position: absolute;
207 top: -2.4rem;
208 left: 160px;
209 z-index: 100;
210 }
211 #full-screen-cf7.full-screen {
212 position: absolute;
213 top: auto;
214 left: auto;
215 right: 0;
216 bottom: -58px;
217 }
218 *[dir="rtl"] #full-screen-cf7.full-screen {
219 right: auto;
220 left: 0;
221 }
222 #cf7sg-editor.full-screen {
223 top: 5px;
224 z-index: 10;
225 position: fixed;
226 overflow: auto;
227 height: 100%;
228 margin-left: -15px;
229 right:0;
230 width: calc( 100% - 170px);
231 }
232 .folded #cf7sg-editor.full-screen{
233 width: calc( 100% - 46px);
234 }
235 #form-editor-tabs ul.ui-tabs-nav {
236 border-bottom: 1px solid #ddd;
237 padding: 7px 0px 0 3px;
238 margin: 0;
239 min-width: 100%;
240 text-align: right;
241 z-index: 1;
242 position: relative;
243 }
244 #form-editor-tabs ul li.ui-state-disabled:first-child {
245 display: none;
246 }
247 #form-editor-tabs ul.ui-tabs-nav > li {
248 display: inline-block;
249 border: solid 1px #ddd;
250 padding: 3px 7px;
251 background-color: #d1d1d1;
252 margin: 0 0px -1px;
253 border-top-left-radius: 3px;
254 }
255 #form-editor-tabs ul.ui-tabs-nav > li.ui-tabs-active {
256 background: #f5f5f5;
257 border-bottom: none;
258 }
259 .tagsdiv .tagchecklist > span {
260 display: block;
261 margin: 0;
262 clear: both;
263 line-height: 15px;
264 }
265 .tagsdiv .tagchecklist button.ntdelbutton{
266 display:none;
267 }
268 .cf7sg-dynamic-list p.the-tagcloud a {
269 display: block;
270 line-height: 15px;
271 font-size: 13px !important;
272 text-decoration: none;
273 color: #669;
274 cursor:default;
275 }
276 #poststuff .cf7sg-dynamic-list p.the-tagcloud {
277 border: none;
278 padding: 0;
279 margin-left: 14px;
280 margin-top:0;
281 }
282 .cf7sg-dynamic-list button.tagcloud-link {
283 display: none;
284 }
285 .cf7sg-dynamic-list .hide-if-no-js {
286 margin-top: 0;
287 }
288 /*
289 grid layout
290 */
291 #html-script, #grid-col, #grid-helper,#grid-js-helper,
292 #grid-form .grid-controls,
293 #grid-form .row-controls .dashicons-no-alt,
294 #grid-form .grid-column > .dashicons-no-alt,
295 #grid-row, #grid-collapsible, #grid-tabs, .cf7-sg-hidden,
296 #grid-collapsible-with-toggle,
297 #grid-cf7-forms,
298 #grid-form .cf7sg-external-form-content,
299 #grid-form .table-row-button {
300 display: none;
301 }
302 /* footer table special styling */
303 #grid-form .row.cf7-sg-table .row-controls label.table-row-button {
304 display: block;
305 text-align: center;
306 }
307 #grid-form .cf7-sg-table-footer .row {
308 min-height: 66px;
309 }
310 .cf7-sg-table-footer .cf7-field-label.cf7-field-inner,
311 .cf7-sg-table-footer .cf7-field-type.cf7-field-inner,
312 .cf7-sg-table-footer .dashicons-move.row-control,
313 .cf7-sg-table-footer .button.make-grid.column-control,
314 .cf7-sg-table-footer .button.external-form {
315 display: none;
316 }
317 .cf7-sg-table-footer .cf7-field-tip.cf7-field-inner {
318 height: 42px;
319 }
320 #grid-form .form-select {
321 display: block;
322 margin: 0 auto;
323 }
324 #grid-form .form-controls {
325 position: relative;
326 padding: 22px;
327 }
328 #grid-form .cf7sg-external-form {
329 border: solid 1px #777;
330 background-color: #ddd;
331 margin: 3px 0;
332 border-radius: 3px;
333 }
334 textarea.grid-input {
335 width: 100%;
336 min-height: 65px;
337 }
338 #grid-form .grid-controls {
339 position: absolute;
340 background: #f1f1f1;
341 padding: 5px;
342 border: solid 1px grey;
343 width: 144px;
344 z-index:1008;
345 }
346 #grid-form .container,
347 #grid-form .table-row-button input {
348 max-width: 100%;
349 }
350 #grid-form .cf7sg-slider-controls .button.slider-control {
351 display: none;
352 }
353 #cf7-codemirror .CodeMirror,
354 #cf7-js-codemirror .CodeMirror,
355 #cf7-css-codemirror .CodeMirror {
356 height: calc( 100vh - 180px);
357 }
358 #grid-form .row.cf7-sg-table {
359 box-shadow: 0px 0px 4px #920a03;
360 }
361 #grid-form .grid-column {
362 background-color: #ddd;
363 }
364 #grid-form .dashicons:hover{
365 cursor:pointer;
366 color: blue;
367 }
368 #grid-form .dashicons{
369 clear:both;
370 }
371 #grid-form .columns {
372 border-top: solid 2px #ddd;
373 border-bottom: solid 2px #ddd;
374 }
375 #grid-form .columns.column-selected {
376 border-bottom-color: #0055d4;
377 border-top-color: #0055d4;
378 }
379 #grid-form .container {
380 padding: 0;
381 border: solid 1px #d7d7d7;
382 margin-top: 5px;
383 border-radius: 3px;
384 }
385 #grid-form .row {
386 padding: 4px 20px 4px 4px;
387 position: relative;
388 min-height: 90px;
389 }
390 #grid-form .row-controls{
391 position: absolute;
392 top:0;
393 right: 0;
394 width: 20px;
395 display: inline-block;
396 height: 100%;
397 background: #606060;
398 border-top-right-radius: 3px;
399 border-bottom-right-radius: 3px;
400 }
401 #grid-form .row-controls .grid-controls {
402 position: absolute;
403 top: 20px;
404 right: 0px;
405 text-align: right;
406 }
407 #grid-form .cf7sg-tag-dynamic_select:last-child {
408 margin: 0;
409 }
410 #grid-form .cf7sg-helper-list {
411 margin: 0;
412 margin-top: 22px;
413 padding: 2px 5px 8px 5px;
414 background: white;
415 }
416 #grid-form .php-icon {
417 position: relative;
418 }
419 #grid-form .php-icon + div.helper-popup,
420 #grid-form .js-icon + div.helper-popup {
421 position: absolute;
422 z-index: 9;
423 background: #d8d8d8;
424 border: solid 1px #787878;
425 width: max-content;
426 }
427 #grid-form .helper-popup p {
428 margin: 0;
429 position: absolute;
430 top: 0;
431 left: 0;
432 text-align: center;
433 width: 100%;
434 line-height: normal;
435 }
436 #grid-form .helper-popup .dashicons.dashicons-no-alt {
437 position: absolute;
438 right: -9px;
439 top: -8px;
440 background: white;
441 border-radius: 50%;
442 z-index: 9;
443 }
444 #grid-form .helper-popup .helper{
445 position: relative;
446 }
447 #grid-form .helper-popup .copy-helper {
448 display: none;
449 position: absolute;
450 top: -22px;
451 left: 20px;
452 background: #323232;
453 color: white;
454 padding: 2px 5px;
455 border-radius: 3px;
456 font-weight: bold;
457 min-width: 78px;
458 }
459 #grid-form .helper-popup .helper:hover .copy-helper {
460 display: inline-block;
461 }
462 .helper-list li, .cf7sg-se-option {
463 position: relative;
464 }
465 .helper-list li .helper::before{
466 content: 'Click to copy!';
467 display: none;
468 position: absolute;
469 top: -22px;
470 left: 10px;
471 background: #323232;
472 color: white;
473 padding: 2px 5px;
474 border-radius: 3px;
475 font-weight: bold;
476 }
477 .helper-list li .helper:hover::before,
478 .cf7sg-se-option .helper:hover::before {
479 display: inline-block;
480 }
481 .cf7sg-se-option .helper:hover::before {
482 bottom: 17px;
483 left: 28px;
484 }
485 .helper-list li.no-post-my-form{
486 display: none;
487 }
488 #grid-form .helper-popup .no-post-my-form{
489 display: none;
490 }
491 #grid-form .cf7sg-collapsible-title label {
492 padding-left: 4px;
493 }
494 #grid-form .row-selected .row-controls{
495 background-color: #0055d4;
496 }
497 #grid-form .row-controls .dashicons{
498 color: #ddd;
499 }
500 .dashicons.dashicons-plus.row-control::before, .dashicons.dashicons-plus.form-control::before {
501 position: relative;
502 top: 1px;
503 }
504 #grid-form .grid-column .dashicons-move {
505 margin-left: calc(50% - 65px);
506 }
507 #grid-form .columns.one .grid-column .dashicons-move {
508 margin-left: 0;
509 }
510 #grid-form .grid-column .icon-code.column-control {
511 float: right;
512 margin-right: 5px;
513 }
514 .icon-code{
515 background: url('image/code-sprite.png') 0px 0px;
516 width: 20px;
517 height: 15px;
518 background-repeat: no-repeat;
519 background-size: auto 20px;
520 display:inline-block;
521 }
522 #grid-form .grid-column .icon-code.column-control:hover {
523 background-position: -20px 0px;
524 cursor: pointer;
525 }
526 /*limit inner tables/tabs within tables/tabs */
527 #grid-form .container.cf7-sg-table .container .row-controls span.dashicons-edit,
528 #grid-form .container.cf7-sg-tabs-panel .row .row label.tabs-row-label {
529 display: none !important;
530 }
531 #grid-form .row-controls .dashicons {
532 margin-top: 3px;
533 }
534 #grid-form .row > div:nth-last-child(2) > .grid-column .dashicons-trash.column-control,
535 .container.cf7-sg-tabs-panel > .row > .row-controls .dashicons-plus,
536 .container.cf7-sg-tabs-panel > .row > .row-controls .dashicons-trash {display: none;}
537
538 #grid-form .row .columns + .columns > .grid-column .dashicons-trash.column-control {
539 display: inline-block;
540 }
541 #grid-form > .container > .row:first-child > .columns:first-child .dashicons-move.column-control {
542 margin-left: calc(50% - 45px);
543 }
544 #grid-form > .container:first-child >.row:first-child > .row-controls .dashicons-trash,
545 #grid-form > .cf7sg-external-form:first-child > .form-controls .dashicons-trash {
546 visibility:hidden;
547 }
548
549 .CodeMirror-wrap.cm-s-material-ocean .cm-shortcode {color: #4496ff;}
550 .CodeMirror-wrap.cm-s-paraiso-light .cm-shortcode {color: blue;}
551 .CodeMirror-wrap.cm-s-paraiso-light span.cm-string {color: #937c01;}
552 .CodeMirror-wrap.cm-s-paraiso-light span.cm-tag {color: #b70b0b;}
553 .CodeMirror-wrap.cm-s-material-ocean .cm-cf7sg-attr {color: #d300ff;}
554 .CodeMirror-wrap.cm-s-material-ocean .cm-cf7sg-attr + .cm-string {color: #00f900;}
555 .CodeMirror-wrap.cm-s-paraiso-light .cm-cf7sg-attr {color: #228f85;}
556 .CodeMirror-wrap.cm-s-paraiso-light .cm-cf7sg-attr + .cm-string {color: #f124ee;}
557
558 .disable-button{
559 text-decoration: none;
560 padding: 0 10px 1px;
561 color: #9b9b9b;
562 border: solid 1px #ccc;
563 background-color: #ccc;
564 height: 28px;
565 line-height: 26px;
566 vertical-align: top;
567 display: inline-block;
568 border-radius: 3px;
569 font-size: 13px;
570 margin: 0;
571 box-sizing: border-box;
572 white-space: nowrap;
573 }
574 .disable-button:hover {
575 color: #939393;
576 cursor: unset;
577 }
578 .disable-button.button:hover {
579 cursor: pointer;
580 color:inherit;
581 }
582 #top-grid-controls {
583 padding-top: 2px;
584 }
585 #grid-form > .container {
586 max-width: 100%;
587 }
588 .button.make-grid, .button.external-form {
589 width: 100%;
590 text-align: center;
591 margin-top: 5px;
592 }
593 #form-editor-tabs > ul li.ui-tabs-active > a {
594 color:inherit;
595 background-color: inherit;
596 }
597 #form-editor-tabs > ul li > a {
598 padding: 1px 8px;
599 display: block;
600 text-decoration: none;
601 min-width: 75px;
602 text-align: center;
603 background-color: #818a99;
604 color: white;
605 min-height: 25px;
606 }
607 div#form-editor-tabs > ul.ui-tabs-nav li {
608 padding: 0;
609 }
610 #form-editor-tabs ul.ui-tabs-nav > li.ui-tabs-active a:hover {
611 cursor: default;
612 }
613 .columns .row-controls .table-row-label,
614 .columns .row-controls .tabs-row-label,
615 .container.cf7-sg-table + .container > .row .row-controls .footer-row-label,
616 .container.cf7sg-slider + .container > .row .row-controls .slider-control-label{
617 display: inline-block;
618 }
619 #grid-form ul.cf7-sg-tabs-list{
620 margin: 0;
621 }
622 #grid-form ul.cf7-sg-tabs-list li{
623 display: inline-block;
624 background-color: #d7d7d7;
625 padding: 2px 2px 0 5px;
626 margin-bottom: -5px;
627 border-top-right-radius: 3px;
628 margin-top: 2px;
629 border-bottom-right-radius: 0px;
630 }
631 #grid-form input:disabled:hover, #grid-form .grid-controls label:hover {
632 cursor: default;
633 }
634 #grid-form .container.cf7-sg-tabs-panel, #grid-form .container.cf7sg-collapsible {
635 border: solid 2px #009cff;
636 }
637 #grid-form ul.cf7-sg-tabs-list li {
638 border-top: solid 2px #009cff;
639 border-left: solid 2px #009cff;
640 border-right: solid 2px #009cff;
641 }
642 #grid-form .two .grid-column .dashicons-move {
643 margin-left: -2px;
644 }
645 #grid-form .cf7-field-inner input,
646 #grid-form .cf7-field-inner textarea,
647 #grid-form .cf7-field-inner span.dashicons {
648 display: none;
649 }
650 #grid-form .cf7-field-inner span.dashicons {
651 position:absolute;
652 margin-top: 2px;
653 background: #a5a5a5;
654 padding: 3px 0 0px 0;
655 top: 0;
656 right: 0;
657 }
658 #grid-form .cf7-field-inner {
659 padding: 0px 10px;
660 background: #ededed;
661 margin: 0;
662 position: relative;
663 }
664 #grid-form .cf7-field-tip .content {
665 font-size: 90%;
666 color: #727272;
667 font-style: italic;
668 text-overflow: ellipsis;
669 overflow: hidden;
670 white-space: nowrap;
671 }
672 #grid-form .cf7-field-type .content {
673 border: solid 1px;
674 width: 100%;
675 display: block;
676 padding: 3px 0px 3px 3px;
677 border-radius: 2px;
678 text-align: center;
679 color: #999;
680 text-overflow: ellipsis;
681 overflow: hidden;
682 white-space: nowrap;
683 }
684 #grid-form p.content:hover {
685 cursor: pointer;
686 color: blue;
687 }
688 #grid-form .cf7-field-inner input,
689 #grid-form .cf7-field-inner textarea {
690 width: calc(100% - 10px);
691 }
692 #grid-form .cf7-field-type.textarea p.content {
693 padding: 35px 0;
694 }
695 #grid-form .cf7-field-inner p {
696 margin: 0;
697 min-height: 20px;
698 }
699 #grid-form .grid-column.submit-field .cf7-field-label,
700 #grid-form .grid-column.submit-field .cf7-field-tip {
701 display: none;
702 }
703 #grid-form .cf7-field-type.select .content::after,
704 #grid-form .cf7-field-type.dynamic-select .content::after {
705 content: '\25BC';
706 position: absolute;
707 right: 13px;
708 font-size: 1.1em;
709 line-height: 1px;
710 top: 12px;
711 }
712 #grid-form .cf7-field-type.radio .content::after {
713 content: '\25c9';
714 position: absolute;
715 left: 23px;
716 font-size: 1.3em;
717 line-height: 1px;
718 top: 12px;
719 }
720 #grid-form .cf7-field-type.checkbox .content::after {
721 content: '\25a1';
722 position: absolute;
723 left: 23px;
724 font-size: 1.3em;
725 line-height: 1px;
726 top: 12px;
727 }
728 .row-controls .dashicons-move.row-control, .row-controls .dashicons-move.form-control{
729 visibility: hidden;
730 }
731 .container + .container > .row > .row-controls .dashicons-move,
732 .container + .cf7sg-external-form > .form-controls .dashicons-move,
733 .cf7sg-external-form + .container > .row > .row-controls .dashicons-move {
734 visibility: visible;
735 }
736 .cf7sg-warning {
737 position: absolute;
738 display: block;
739 top: 0;
740 right: 50px;
741 background: white;
742 padding: 10px 20px;
743 border: 2px solid grey;
744 border-radius: 3px;
745 font-size: 1.2em;
746 margin-top: 50px;
747 }
748 [data-search="li.cf7sg-tag-all,li.cf7sg-tag-dynamic_select,li.cf7sg-tag-dynamic_select-filter"] + .helper-popup {
749 min-width: 300px;
750 }
751 body.disable-scroll{overflow:hidden;}
752