PluginProbe
Smart Grid-Layout Design for Contact Form 7 / 4.12
Smart Grid-Layout Design for Contact Form 7 v4.12
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.12, at admin/css/cf7-grid-layout-post.css

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