PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 1.5.3
Visualizer – Tables & Charts Manager with Built-in AI Generator v1.5.3
4.0.8 4.0.7 4.0.6 4.0.5 4.0.4 4.0.3 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.1 3.1.2 3.1.3 3.10.0 3.10.1 3.10.10 3.10.11 3.10.12 3.10.13 3.10.14 3.10.15 3.10.2 3.10.3 All 149 releases
← All changes | css/frame.css +704 -1877 4.0.31.5.3 View file →
@@ -1,1877 +1,704 @@
1 -#content {
2 - overflow: auto;
3 - position: absolute;
4 - z-index: 75;
5 - top: 0;
6 - right: 0;
7 - bottom: 60px;
8 - left: 0;
9 - width: auto;
10 - background-color: white;
11 -}
12 -
13 -#canvas {
14 - position: absolute;
15 - top: 10px;
16 - right: 310px;
17 - bottom: 10px;
18 - left: 10px;
19 -}
20 -#control_wrapper_canvas:not(:empty) {
21 - margin: 15px 0 0 5px;
22 - position: relative;
23 - z-index: 1;
24 -}
25 -#control_wrapper_canvas:not(:empty) + #canvas .google-visualization-table {
26 - top: 60px;
27 -}
28 -.vz-vertical .google-visualization-table {
29 - left: 70px;
30 -}
31 -.google-visualization-controls-categoryfilter label.google-visualization-controls-label {
32 - vertical-align: middle;
33 -}
34 -.google-visualization-controls-categoryfilter li.goog-inline-block {
35 - margin: 0 0.2em;
36 -}
37 -.google-visualization-controls-categoryfilter li {
38 - padding: 0 0.2em;
39 -}
40 -.goog-combobox input {
41 - min-height: auto;
42 -}
43 -.loader {
44 - position: absolute;
45 - top: 50%;
46 - left: 50%;
47 - margin-top: -16px;
48 - margin-left: -16px;
49 -}
50 -
51 -/******************************************************************************/
52 -/******************************** SIDEBAR ***********************************/
53 -/******************************************************************************/
54 -
55 -#sidebar {
56 - overflow-x: hidden;
57 - overflow-y: auto;
58 - position: absolute;
59 - z-index: 80;
60 - top: 0;
61 - right: 0;
62 - bottom: 60px;
63 - width: 350px;
64 - border-left: 1px solid #ddd;
65 - background: #f8f9fa;
66 - overscroll-behavior: contain;
67 -}
68 -
69 -.viz-group {
70 - margin: 0;
71 - font-size: 12px;
72 - line-height: 18px;
73 - list-style: none;
74 -}
75 -
76 -.viz-group .viz-group-header .viz-group-title {
77 - margin: 10px 0;
78 - padding: 15px 20px;
79 - border-top: 1px solid #ddd;
80 - border-bottom: 1px solid #ddd;
81 - color: #555d66;
82 - background: #fff;
83 -}
84 -
85 -.viz-group-wrapper ul .viz-group-title {
86 - border-top: 1px solid #e5e5e5;
87 -}
88 -
89 -.viz-group-wrapper ul li {
90 - border-top: 1px solid #e5e5e5;
91 -}
92 -
93 -.viz-group-wrapper ul ul li.viz-subsection {
94 - margin: 5px;
95 - border: 1px solid #ddd;
96 -}
97 -
98 -.viz-group-wrapper .viz-group .viz-group .viz-group-title {
99 - position: relative;
100 - margin: 0;
101 - padding: 12px 36px 12px 16px;
102 - border-top: none;
103 - border-bottom: none;
104 - border-left: 4px solid transparent;
105 - color: #555d66;
106 - background-color: #fff;
107 - font-size: 13px;
108 - font-weight: 600;
109 - line-height: 1.4;
110 - cursor: pointer;
111 - transition: 0.15s color ease-in-out, 0.15s background-color ease-in-out, 0.15s border-color ease-in-out;
112 -}
113 -
114 -.viz-title-small {
115 - font-size: smaller;
116 -}
117 -
118 -.viz-group-wrapper .viz-group .viz-group:hover .viz-group-title,
119 -.viz-group-wrapper .viz-group .viz-group.open .viz-group-title {
120 - border-left-color: #0073aa;
121 - color: #0073aa;
122 - background: #f3f3f5;
123 -}
124 -
125 -.viz-group-wrapper .viz-group .viz-group .viz-group-title:after {
126 - position: absolute;
127 - z-index: 1;
128 - top: 50%;
129 - right: 12px;
130 - transform: translateY(-50%);
131 - color: inherit;
132 - font: 400 18px/1 dashicons;
133 - content: "\f345";
134 - opacity: 0.6;
135 -}
136 -
137 -.viz-group-wrapper .viz-group .viz-group.open .viz-group-title:after {
138 - content: "\f347";
139 -}
140 -
141 -.viz-group-wrapper .viz-group .customize-section-back {
142 - display: block;
143 - float: left;
144 - width: 42px;
145 - height: 49px;
146 - margin: 0 15px 0 0;
147 - padding: 0;
148 - border: none;
149 - border-top: 1px solid #ddd;
150 - border-right: 1px solid #ddd;
151 - border-left: 4px solid #fff;
152 - background: #fff;
153 - box-shadow: none;
154 - cursor: pointer;
155 - transition: color 0.15s ease-in-out,border-color 0.15s ease-in-out,background 0.15s ease-in-out;
156 -}
157 -
158 -.viz-group-wrapper .viz-group .customize-section-back:hover {
159 - border-left-color: #0073aa;
160 - outline: 0;
161 - color: #0073aa;
162 - background: #f3f3f5;
163 -}
164 -
165 -.viz-group-wrapper .viz-group .customize-section-back:before {
166 - position: relative;
167 - top: -11px;
168 - left: -2px;
169 - font: 400 20px/72px dashicons;
170 - content: "\f341";
171 -}
172 -
173 -.viz-group-wrapper.full-height {
174 - float: left;
175 - position: relative;
176 - width: 100%;
177 - height: 100%;
178 - margin: 0;
179 - padding-bottom: 60px;
180 -}
181 -
182 -.viz-group.bottom-fixed {
183 - display: block;
184 - position: fixed;
185 - width: 350px;
186 - padding: 12px;
187 - margin: 0 auto;
188 -}
189 -
190 -.viz-group ul li h2,
191 -.viz-group ul li h3 {
192 - padding: 7px 15px 7px 35px;
193 -}
194 -
195 -.viz-group h2 .dashicons,
196 -.viz-group h3 .dashicons {
197 - margin-right: 5px;
198 - vertical-align: -5px;
199 -}
200 -
201 -.viz-group-content {
202 - display: none;
203 - margin: 0;
204 - padding: 0;
205 - background-color: #fff;
206 -}
207 -
208 -div.viz-group-content {
209 - padding: 15px;
210 -}
211 -
212 -.viz-group.open > .viz-group-content {
213 - display: block;
214 -}
215 -
216 -.viz-group-description {
217 - margin: 0;
218 - padding: 5px;
219 - color: #555;
220 - font-size: 12px;
221 - text-align: left;
222 -}
223 -
224 -div.viz-group-content .viz-group-description {
225 - padding: 5px;
226 - font-family: "Montserrat",sans-serif;
227 - font-weight: 300;
228 -}
229 -
230 -.initial-screen .viz-group-description {
231 - padding: 0;
232 - padding: 10px 20px 20px;
233 - font-family: "Montserrat",sans-serif;
234 - font-weight: 300;
235 -}
236 -
237 -.viz-section-title {
238 - display: block;
239 - position: relative;
240 - margin-bottom: 0;
241 - padding: 10px 36px 10px 16px;
242 - border-top: 1px solid #e5e5e5;
243 - border-left: 3px solid transparent;
244 - background-color: #f8f9fa;
245 - font-size: 12px;
246 - font-weight: 600;
247 - color: #555d66;
248 - text-transform: uppercase;
249 - letter-spacing: 0.4px;
250 - cursor: pointer;
251 - transition: border-left-color 0.15s ease-in-out, color 0.15s ease-in-out, background-color 0.15s ease-in-out;
252 -}
253 -
254 -.viz-section-title:hover,
255 -.viz-section-title.open {
256 - border-left-color: #0073aa;
257 - color: #0073aa;
258 - background-color: #f0f6fb;
259 -}
260 -
261 -.viz-group-wrapper ul ul li .viz-section-title {
262 - border-left: 3px solid transparent;
263 -}
264 -
265 -.viz-section-title::after {
266 - position: absolute;
267 - top: 50%;
268 - right: 10px;
269 - transform: translateY(-50%);
270 - color: inherit;
271 - font: 400 16px/1 dashicons;
272 - content: "\f345";
273 - opacity: 0.6;
274 -}
275 -
276 -.viz-section-title.open::after {
277 - content: "\f347";
278 -}
279 -
280 -.section-items,
281 -.viz-section-items {
282 - display: none;
283 - padding: 15px;
284 -}
285 -
286 -.viz-section-items.open {
287 - display: block;
288 -}
289 -
290 -.more-info {
291 - display: none;
292 - float: right;
293 - color: #21759b;
294 - font-size: 85%;
295 - font-weight: normal;
296 - text-decoration: none;
297 -}
298 -
299 -.viz-info-msg {
300 - font-weight: bold !important;
301 - font-style: italic;
302 -}
303 -
304 -.viz-info-msg::before {
305 - font-family: dashicons;
306 - content: "\f488";
307 - margin-right: 5px;
308 -}
309 -
310 -.viz-section-description {
311 - margin: 0;
312 - /*display: none;*/
313 - padding: 0;
314 - color: gray;
315 - font-size: 11px;
316 -}
317 -
318 -.viz-section-table {
319 - width: 100%;
320 -}
321 -
322 -.section-delimiter,
323 -.viz-section-delimiter {
324 - margin: 15px 0;
325 - border-top: 1px solid #e5e5e5;
326 -}
327 -
328 -.viz-section-table-column {
329 - width: 50%;
330 - padding: 0 1px;
331 - text-align: left;
332 - vertical-align: top;
333 -}
334 -
335 -.viz-section-item {
336 - margin-bottom: 10px;
337 -}
338 -
339 -.control-select,
340 -.control-text {
341 - width: 100%;
342 -}
343 -
344 -.control-check {
345 - float: right;
346 -}
347 -
348 -.control-check::after {
349 - clear: both;
350 -}
351 -
352 -.viz-section-description ul {
353 - margin: 0 0 0 25px;
354 - list-style: circle;
355 -}
356 -
357 -.viz-section-description li {
358 - margin: 0;
359 - list-style: circle;
360 -}
361 -
362 -#rate-the-plugin {
363 - margin-top: 40px;
364 - padding: 20px;
365 - border-top: 1px solid #e5e5e5;
366 - text-align: center;
367 -}
368 -
369 -.rate-the-plugin {
370 - width: 40% !important;
371 - margin-top: -5px;
372 -}
373 -
374 -#rate-stars {
375 - width: 100px;
376 - height: 20px;
377 - margin: 15px auto;
378 - background-image: url("../images/star.png");
379 - background-repeat: repeat-x;
380 - background-position: right center;
381 -}
382 -
383 -#rate-link {
384 - font-family: "Montserrat",sans-serif;
385 - font-weight: 400;
386 - text-decoration: none;
387 -}
388 -
389 -#flattr {
390 - margin-top: 15px;
391 - text-align: center;
392 -}
393 -
394 -#viz-tabs {
395 - display: none;
396 -}
397 -
398 -#viz-tabs.done {
399 - display: block;
400 -}
401 -
402 -#viz-tabs .ui-tabs-panel {
403 - padding: 0;
404 -}
405 -
406 -#viz-tabs .wp-color-picker {
407 - width: 4rem !important;
408 -}
409 -
410 -/* Modern flat tab nav */
411 -#viz-tabs .ui-tabs-nav {
412 - display: flex;
413 - padding: 0;
414 - margin: 0;
415 - background: #fff;
416 - border: none;
417 - border-bottom: 2px solid #e5e5e5;
418 - border-radius: 0;
419 - box-shadow: none;
420 -}
421 -
422 -#viz-tabs .ui-tabs-nav li {
423 - flex: 1;
424 - margin: 0;
425 - border: none;
426 - border-bottom: 2px solid transparent;
427 - border-radius: 0;
428 - background: transparent;
429 - top: 2px;
430 - transition: border-color 0.15s ease-in-out;
431 -}
432 -
433 -#viz-tabs .ui-tabs-nav li a {
434 - display: block;
435 - width: 100%;
436 - padding: 10px 0;
437 - color: #555d66;
438 - font-size: 13px;
439 - font-weight: 500;
440 - text-align: center;
441 - box-sizing: border-box;
442 -}
443 -
444 -#viz-tabs .ui-tabs-nav li:hover a {
445 - color: #0073aa;
446 -}
447 -
448 -#viz-tabs .ui-tabs-nav .ui-state-active {
449 - border-bottom-color: #0073aa;
450 - background: transparent;
451 -}
452 -
453 -#viz-tabs .ui-tabs-nav .ui-state-active a {
454 - color: #0073aa;
455 - font-weight: 600;
456 -}
457 -
458 -#viz-tabs .ui-tabs-nav li a:focus,
459 -#viz-tabs .ui-tabs-nav li.ui-state-focus a {
460 - outline: none;
461 - box-shadow: none;
462 - border-radius: 2px;
463 -}
464 -
465 -.viz-info-panel {
466 - display: flex;
467 - flex-direction: column;
468 - padding: 16px;
469 - gap: 14px;
470 - background: #fff;
471 - border-bottom: 1px solid #e5e5e5;
472 -}
473 -
474 -.viz-info-panel label {
475 - margin: 0;
476 - padding: 0;
477 - font-weight: bold;
478 -}
479 -
480 -.viz-info-panel input {
481 - flex: 1;
482 -}
483 -
484 -.viz-info-panel .viz-info-item {
485 - display: flex;
486 - flex-direction: column;
487 - flex: 1;
488 - gap: 3px;
489 -}
490 -
491 -.viz-info-panel .viz-info-row {
492 - display: flex;
493 - flex-direction: row;
494 - gap: 5px;
495 -}
496 -
497 -/******************************************************************************/
498 -/******************************** TOOLBAR ***********************************/
499 -/******************************************************************************/
500 -
501 -#toolbar {
502 - overflow: hidden;
503 - position: absolute;
504 - z-index: 100;
505 - right: 0;
506 - bottom: 0;
507 - left: 0;
508 - height: 36px;
509 - padding: 12px 16px;
510 - border-top: 1px solid #dfdfdf;
511 - box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
512 - text-align: center;
513 -}
514 -
515 -#toolbar .push-right {
516 - float: right;
517 - margin-right: 10px;
518 -}
519 -
520 -#toolbar .push-left {
521 - float: left;
522 -}
523 -
524 -.toolbar-div a {
525 - float: left;
526 -}
527 -
528 -.toolbar-div {
529 - display: inline-block;
530 - float: left;
531 - width: 30%;
532 - vertical-align: top;
533 -}
534 -
535 -#chart-select {
536 - display: flex;
537 - padding: 12px 8px;
538 - justify-content: center;
539 - align-items: center;
540 - gap: 12px;
541 -}
542 -
543 -#chart-select label {
544 - font-weight: bold;
545 -}
546 -
547 -/******************************************************************************/
548 -/******************************** TYPE PICKER ******************************/
549 -/******************************************************************************/
550 -
551 -.type-box span {
552 - display: block;
553 - position: absolute;
554 - right: 0;
555 - bottom: 0;
556 - width: 100%;
557 - padding: 6px 0;
558 - border-top: 1px solid #e5e5e5;
559 - background-color: #fff;
560 - font-weight: 600;
561 - font-size: 12px;
562 - text-align: center;
563 - color: #555d66;
564 -}
565 -
566 -.type-box .pro-upsell {
567 - color: #d63638;
568 -}
569 -
570 -#type-picker {
571 - max-width: 960px;
572 - margin: 30px auto;
573 - padding: 0 16px;
574 - display: flex;
575 - flex-wrap: wrap;
576 - gap: 16px;
577 -}
578 -
579 -.type-box {
580 - position: relative;
581 - border: 1px solid #ddd;
582 - border-left: 3px solid transparent;
583 - background-color: #fff;
584 - box-shadow: 0 1px 3px rgba(0,0,0,0.08);
585 - border-radius: 2px;
586 - overflow: hidden;
587 - transition: border-left-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
588 -}
589 -
590 -.type-box:hover,
591 -.type-box:has(.type-label-selected) {
592 - border-left-color: #0073aa;
593 - box-shadow: 0 2px 6px rgba(0,114,170,0.15);
594 -}
595 -
596 -.type-box.viz-hidden {
597 - display: none;
598 -}
599 -
600 -.type-box .pro-upsell .visualizder-pro-label {
601 - display: inline;
602 - position: absolute;
603 - top: 0;
604 - width: 74px;
605 - height: 17px;
606 - border: none;
607 - color: #fff;
608 - z-index: 4;
609 - background: #d63638;
610 - font-size: 10px;
611 - font-weight: 600;
612 - letter-spacing: 0.5px;
613 - line-height: 17px;
614 - text-align: center;
615 -}
616 -
617 -.type-label {
618 - display: block;
619 - width: 270px;
620 - height: 205px;
621 - padding: 15px;
622 - border: none;
623 - background-color: #f9f9f9;
624 - background-image: url(../images/chart_types_v395.png);
625 - background-repeat: no-repeat;
626 - background-position: center center;
627 - background-size: 900px 1150px;
628 - filter: grayscale(100%);
629 - cursor: pointer;
630 - transition: filter 0.15s ease-in-out, background-color 0.15s ease-in-out;
631 -}
632 -
633 -#type-picker.lib-ChartJS .type-label {
634 - background-image: url(../images/chart_types_chartjs.png);
635 -}
636 -
637 -#type-picker.lib-DataTable .type-label {
638 - background-image: url(../images/chart_types_datatable.png);
639 -}
640 -
641 -.type-label-selected,
642 -.type-box .type-label:hover {
643 - filter: grayscale(0);
644 - background-color: #f0f7fb;
645 -}
646 -
647 -.type-label:focus,
648 -.viz-group-title:focus,
649 -.viz-section-title:focus {
650 - outline: 2px solid #2271b1;
651 - outline-offset: 2px;
652 -}
653 -
654 -.type-box-area .type-label {
655 - background-position: -8px -225px;
656 -}
657 -
658 -.type-box-line .type-label {
659 - background-position: -600px 0;
660 -}
661 -
662 -.type-box-scatter .type-label {
663 - background-position: -300px 0;
664 -}
665 -
666 -.type-box-pie .type-label {
667 - background-position: 0 0;
668 -}
669 -
670 -.type-box-gauge .type-label {
671 - background-position: -7px -450px;
672 -}
673 -
674 -.type-box-geo .type-label {
675 - background-position: -600px -450px;
676 -}
677 -
678 -.type-box-candlestick .type-label {
679 - background-position: -304px -450px;
680 -}
681 -
682 -.type-box-bar .type-label {
683 - background-position: -300px -225px;
684 -}
685 -
686 -.type-box-bubble .type-label {
687 - background-position: -604px -906px;
688 -}
689 -
690 -.type-box-column .type-label {
691 - background-position: -600px -225px;
692 -}
693 -
694 -.type-box-dataTable .type-label,
695 -.type-box-table .type-label,
696 -.type-box-tabular .type-label {
697 - background-position: -301px -670px;
698 -}
699 -
700 -.type-box-timeline .type-label {
701 - background-position: -8px -670px;
702 -}
703 -
704 -.type-box-combo .type-label {
705 - background-position: -606px -670px;
706 -}
707 -
708 -.type-box-polarArea .type-label {
709 - background-position: -2px -912px;
710 -}
711 -
712 -.type-box-radar .type-label {
713 - background-position: -301px -899px;
714 -}
715 -
716 -/******************************************************************************/
717 -/******************************** OTHER STYLES ******************************/
718 -/******************************************************************************/
719 -
720 -#thehole {
721 - position: absolute;
722 - top: 0;
723 - left: 0;
724 - width: 1px;
725 - height: 1px;
726 - border: 0;
727 - opacity: 0;
728 -
729 - filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
730 - -moz-opacity: 0;
731 -}
732 -
733 -.locker,
734 -.locker-loader {
735 - position: absolute;
736 - top: 0;
737 - left: 0;
738 -}
739 -
740 -.locker {
741 - z-index: 1000;
742 - opacity: 0.8;
743 - background-color: white;
744 -
745 - -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
746 - filter: alpha(opacity=80);
747 -}
748 -
749 -.locker-loader {
750 - z-index: 1001;
751 - background: url(../images/ajax-loader.gif) no-repeat center center;
752 -}
753 -
754 -.file-wrapper {
755 - display: inline-block;
756 - width: auto;
757 - max-width: 133px;
758 -}
759 -
760 -.file {
761 - position: fixed;
762 - max-width: 138px;
763 - margin-top: -6px;
764 - margin-left: -33px;
765 - opacity: 0;
766 - font-size: 22px;
767 - cursor: pointer;
768 -
769 - filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
770 - -moz-opacity: 0;
771 -}
772 -
773 -#remote-file {
774 - display: inline-block;
775 - float: right;
776 - margin-left: 6px;
777 -}
778 -
779 -.form-inline {
780 - display: table;
781 - /*margin: 0 auto;*/
782 - width: 100%;
783 - vertical-align: middle;
784 -}
785 -
786 -.computer-btn {
787 - overflow: hidden;
788 - left: -18px;
789 - padding-left: 27px !important;
790 - border: medium none rgb(100, 100, 100) !important;
791 - border: 1px solid #b0b0b0 !important;
792 - color: #646464 !important;
793 - background: #e6e6e6 url("../images/computer.png") no-repeat scroll 7px 1px !important;
794 - box-shadow: none !important;
795 - text-shadow: none!important;
796 - font-family: "Open Sans",sans-serif;
797 - font-weight: 700;
798 - transition: all 0.3s ease 0s;
799 -}
800 -
801 -.computer-btn:hover {
802 - padding-left: 27px !important;
803 - border: 1px solid #2f8cea !important;
804 - color: white !important;
805 - background: #2f8cea url("../images/computer.png") no-repeat scroll 7px -36px !important;
806 - box-shadow: 0 1px 0 rgba(171, 171, 171, 0.5) inset, 0 1px 0 rgba(0, 0, 0, 0.15) !important;
807 - box-shadow: none !important;
808 - transition: all 0.3s ease 0s;
809 - transition: all 0.3s ease;
810 -}
811 -
812 -.from-web {
813 - margin-top: 0;
814 - margin-bottom: 15px !important;
815 -}
816 -
817 -.from-web-btn {
818 - padding-left: 25px !important;
819 - border: medium none #646464 !important;
820 - border: 1px solid #b0b0b0 !important;
821 - color: #646464 !important;
822 - background: #e6e6e6 url("../images/web.png") no-repeat scroll 7px 1px !important;
823 - box-shadow: none !important;
824 - font-family: "Open Sans",sans-serif;
825 - font-weight: 700;
826 - transition: all 0.3s ease 0s;
827 - /*margin-left: 2px !important;*/
828 -}
829 -
830 -.from-web-btn:hover {
831 - padding-left: 25px !important;
832 - /*margin-left: 2px !important;*/
833 - border: 1px solid #89b158 !important;
834 - color: white !important;
835 - background: #89b158 url("../images/web.png") no-repeat scroll 7px -38px !important;
836 - box-shadow: none !important;
837 - transition: all 0.3s ease 0s;
838 - transition: all 0.3s ease;
839 -}
840 -
841 -.preview {
842 - width: 100%;
843 -}
844 -
845 -#sidebar > ul > div.initial-screen > div {
846 - padding: 0 20px;
847 -}
848 -
849 -.from-chart-btn {
850 - padding-left: 25px !important;
851 - border: medium none #646464 !important;
852 - border: 1px solid #b0b0b0 !important;
853 - color: #646464 !important;
854 - background: #e6e6e6 url("../images/from_chart.png") no-repeat scroll 7px 1px !important;
855 - box-shadow: none !important;
856 - font-family: "Open Sans",sans-serif;
857 - font-weight: 700;
858 - transition: all 0.3s ease 0s;
859 - /*margin-left: 2px !important;
860 - margin-top: 2px !important;*/
861 -}
862 -
863 -.from-chart-btn:hover {
864 - padding-left: 25px !important;
865 - /*margin-left: 2px !important;*/
866 - border: 1px solid #10aecb !important;
867 - color: white !important;
868 - background: #10aecb url("../images/from_chart.png") no-repeat scroll 7px -36px !important;
869 - box-shadow: none !important;
870 - transition: all 0.3s ease 0s;
871 - transition: all 0.3s ease;
872 - /*margin-top: 2px !important;*/
873 -}
874 -
875 -input#existing-chart {
876 - /*left: 18px;
877 - width: 110px;
878 - position: relative;*/
879 - }
880 -
881 -select#chart-id {
882 - float: right;
883 - width: 146px;
884 - margin-right: 14px;
885 -}
886 -
887 -button#editor-chart-button {
888 - display: block;
889 - margin: 0 auto;
890 - border: 1px solid #2c80d6 !important;
891 - color: white !important;
892 - background-color: #2f8cea !important;
893 - box-shadow: none !important;
894 - text-shadow: none;
895 - transition: all 0.3s ease;
896 -}
897 -
898 -.preview-btn {
899 - border: 1px solid #2c80d6 !important;
900 - color: white !important;
901 - background-color: #2f8cea !important;
902 - box-shadow: none !important;
903 - font-family: "Open Sans",sans-serif;
904 - font-weight: 700;
905 - transition: all 0.3s ease;
906 -}
907 -
908 -.preview-btn:hover {
909 - border: 1px solid #2c80d6 !important;
910 - color: white !important;
911 - background-color: #2c80d6 !important;
912 - box-shadow: none !important;
913 - font-family: "Open Sans",sans-serif;
914 - font-weight: 700;
915 - transition: all 0.3s ease;
916 -}
917 -
918 -.show-live-btn {
919 - width: 100%;
920 - margin-top: 15px !important;
921 - border-color: #e98b00 !important;
922 - background-color: #f90 !important;
923 - box-shadow: none !important;
924 - font-family: "Open Sans",sans-serif;
925 - font-weight: 700;
926 -}
927 -
928 -.show-live-btn:hover {
929 - width: 100%;
930 - margin-top: 15px !important;
931 - border-color: #e98b00 !important;
932 - background-color: #ea8c00 !important;
933 - box-shadow: none !important;
934 - font-family: "Open Sans",sans-serif;
935 - font-weight: 700;
936 - transition: all 0.3s ease;
937 -}
938 -
939 -.check-pro-btn {
940 - display: block;
941 - width: 245px;
942 - height: 40px;
943 - margin: 0 auto;
944 -}
945 -
946 -.advanced-settings-btn,
947 -.return-settings-btn {
948 - display: block;
949 - height: auto;
950 - margin: 0 auto;
951 - margin-top: 5px;
952 - margin-bottom: 20px;
953 - border-radius: 3px;
954 - font-size: 17px;
955 - line-height: 34px;
956 - cursor: pointer;
957 -}
958 -
959 -.return-settings-btn {
960 - width: 90%;
961 -}
962 -
963 -.advanced-settings-btn {
964 - width: 100%;
965 -}
966 -
967 -.return-settings-btn {
968 - margin: 10px auto;
969 -}
970 -
971 -.hidden-setting {
972 - display: none;
973 -}
974 -
975 -.viz-select-library {
976 - color: #0085ba;
977 -}
978 -.viz-select-library.viz-hide-library {
979 - display: none;
980 -}
981 -
982 -.viz-select-library option:first-child {
983 - font-weight: bold;
984 -}
985 -
986 -/* ====== RESPONSIVE ====== */
987 -
988 -@media (max-width: 1366px) {
989 - #rate-stars {
990 - margin: 3px 0 10px 40%;
991 - }
992 -
993 - .rate-the-plugin {
994 - margin-left: -8%;
995 - }
996 -}
997 -
998 -@media screen and (max-width: 782px) {
999 - .button.button-primary.file-wrapper.computer-btn,
1000 - #remote-file,
1001 - #existing-chart {
1002 - height: 28px;
1003 - margin-bottom: 4px;
1004 - padding: 0 10px 1px;
1005 - font-size: 13px;
1006 - line-height: 26px;
1007 - vertical-align: middle;
1008 - }
1009 -}
1010 -
1011 -#vz-chart-settings h2:hover,
1012 -#vz-chart-permissions h2:hover,
1013 -.sidebar-footer-link h2:hover,
1014 -#vz-chart-review a:hover {
1015 - text-decoration: none;
1016 -}
1017 -
1018 -#vz-chart-review a {
1019 - color: #00a0d2;
1020 - text-decoration: none;
1021 -}
1022 -
1023 -#vz-chart-settings h2,
1024 -#vz-chart-permissions h2,
1025 -.sidebar-footer-link h2,
1026 -#vz-chart-review h2 {
1027 - padding: 0;
1028 - border: none;
1029 - font-size: 12px;
1030 - font-weight: 400;
1031 -}
1032 -
1033 -#vz-chart-review {
1034 - right: 0;
1035 - bottom: 10px;
1036 - box-sizing: border-box;
1037 - width: 40%;
1038 - padding-right: 6px;
1039 - text-align: right;
1040 -}
1041 -
1042 -#vz-chart-settings.bottom-fixed h2 {
1043 - padding-left: 6px;
1044 -}
1045 -
1046 -#vz-chart-settings {
1047 - bottom: 40px;
1048 - left: 0;
1049 - box-sizing: border-box;
1050 - width: 33%;
1051 - text-align: left;
1052 -}
1053 -
1054 -#vz-chart-permissions:not(.open) h2 {
1055 - display: inline-block;
1056 - width: 100%;
1057 - margin: 0;
1058 - text-align: right;
1059 -}
1060 -
1061 -#vz-chart-permissions {
1062 - right: 0;
1063 - bottom: 40px;
1064 - box-sizing: border-box;
1065 - width: 33%;
1066 - text-align: left;
1067 -}
1068 -
1069 -#vz-chart-permissions h2,
1070 -#vz-chart-settings h2,
1071 -.sidebar-footer-link h2 {
1072 - display: inline;
1073 - color: #00a0d2;
1074 - background: none;
1075 - font-family: "Open Sans",sans-serif;
1076 - cursor: pointer;
1077 -}
1078 -
1079 -.sidebar-footer-link,
1080 -#vz-chart-review,
1081 -#vz-chart-permissions,
1082 -#vz-chart-settings {
1083 - display: inline;
1084 - background: none;
1085 - cursor: pointer;
1086 -}
1087 -
1088 -.sidebar-footer-link > ul,
1089 -#vz-chart-source > ul,
1090 -#vz-chart-permissions > ul,
1091 -#vz-chart-settings > ul {
1092 - position: relative;
1093 - z-index: 10;
1094 - border-bottom: 1px solid #ddd;
1095 -}
1096 -
1097 -#vz-chart-copyright {
1098 - bottom: 60px;
1099 - text-align: center;
1100 - z-index: 999;
1101 - background: #f3f3f3;
1102 -}
1103 -
1104 -/* Import steps — stepped data-source + schedule flow */
1105 -.vz-import-step-btn {
1106 - width: 100%;
1107 - margin-bottom: 4px !important;
1108 - text-align: left;
1109 -}
1110 -
1111 -.vz-import-step-toggle {
1112 - display: flex;
1113 - justify-content: space-between;
1114 - align-items: center;
1115 - width: 100%;
1116 - margin: 0;
1117 - padding: 5px 10px;
1118 - background: #f0f0f1;
1119 - border: 1px solid #c3c4c7;
1120 - border-radius: 2px;
1121 - cursor: pointer;
1122 - font-size: 13px;
1123 - color: #50575e;
1124 - line-height: 2;
1125 -}
1126 -
1127 -.vz-import-step-toggle:hover {
1128 - background: #e5e5e5;
1129 - border-color: #a7aaad;
1130 -}
1131 -
1132 -.vz-import-step-toggle .dashicons {
1133 - transition: transform 0.2s ease;
1134 - flex-shrink: 0;
1135 -}
1136 -
1137 -.vz-import-step-toggle[aria-expanded="true"] .dashicons {
1138 - transform: rotate(180deg);
1139 -}
1140 -
1141 -#vz-wp-sync-options,
1142 -#vz-db-sync-options {
1143 - padding-top: 8px;
1144 -}
1145 -
1146 -#sidebar {
1147 - border-left: 1px solid #ddd;
1148 - background: #f3f3f3;
1149 -}
1150 -
1151 -#vz-chart-permissions.open h2 {
1152 - position: absolute;
1153 - right: 6px;
1154 - bottom: 28px;
1155 - left: auto;
1156 - width: 50%;
1157 - text-align: right;
1158 -}
1159 -
1160 -#vz-chart-settings.open h2 {
1161 - position: absolute;
1162 - bottom: 28px;
1163 - left: 6px;
1164 -}
1165 -
1166 -#vz-chart-permissions .viz-group-header,
1167 -#vz-chart-settings.open .viz-group-header {
1168 - display: block;
1169 -}
1170 -
1171 -#vz-chart-permissions .viz-group-header,
1172 -#vz-chart-settings .viz-group-header {
1173 - display: none;
1174 -}
1175 -
1176 -.sidebar-footer-link.open h2 {
1177 - position: absolute;
1178 - bottom: 28px;
1179 - left: 20px;
1180 -}
1181 -
1182 -.sidebar-footer-link.open .viz-group-header {
1183 - display: block;
1184 -}
1185 -
1186 -.sidebar-footer-link .viz-group-header {
1187 - display: none;
1188 -}
1189 -
1190 -#vz-csv-file-form,
1191 -#vz-one-time-import,
1192 -#vz-schedule-import,
1193 -#vz-permissions .only-pro-content,
1194 -.edit-data-content {
1195 - text-align: center;
1196 -}
1197 -
1198 -#csv-file {
1199 - margin: 15px 0;
1200 - padding: 0;
1201 -}
1202 -
1203 -.visualizer-input,
1204 -.visualizer-select {
1205 - width: 100%;
1206 - margin: 0 0 15px;
1207 -}
1208 -
1209 -.viz-group .dashicons-lock {
1210 - display: none;
1211 -}
1212 -
1213 -.only-pro-feature .dashicons-lock {
1214 - display: inline;
1215 -}
1216 -
1217 -.viz-section-title .dashicons,
1218 -.viz-group-title .dashicons {
1219 - width: 18px;
1220 - height: 18px;
1221 - margin-left: 3px;
1222 - font-size: 18px;
1223 -}
1224 -
1225 -.only-pro-feature input,
1226 -.only-pro-feature button,
1227 -.only-pro-feature select {
1228 - cursor: not-allowed !important;
1229 - pointer-events: none;
1230 -}
1231 -
1232 -.only-pro-feature > div {
1233 - position: relative;
1234 -}
1235 -
1236 -.only-pro-content {
1237 - position: absolute;
1238 - top: 0;
1239 - bottom: 0;
1240 - left: 0;
1241 - width: 100%;
1242 - opacity: 0;
1243 - pointer-events: none;
1244 - background: rgba(253,253,253,0.9);
1245 - transition: 0.5s ease;
1246 -}
1247 -
1248 -.only-pro-feature:hover .only-pro-content {
1249 - opacity: 1;
1250 - pointer-events: auto;
1251 -}
1252 -
1253 -.only-pro-container {
1254 - display: flex;
1255 - align-items: center;
1256 - justify-content: center;
1257 - width: 100%;
1258 - height: 100%;
1259 -}
1260 -
1261 -.only-pro-inner {
1262 - display: flex;
1263 - flex-direction: column;
1264 - align-items: center;
1265 - justify-content: center;
1266 - gap: 12px;
1267 -}
1268 -
1269 -.only-pro-content p {
1270 - margin: 0;
1271 - font-size: 14px;
1272 - font-weight: 700;
1273 -}
1274 -
1275 -.only-pro-content a {
1276 - display: inline-block;
1277 - padding: 7px 12px;
1278 - color: #fff;
1279 - background: #3F57E1;
1280 - font-weight: 600;
1281 - text-decoration: none;
1282 - transition: 0.1s ease;
1283 - border-width: 1px;
1284 - border-style: solid;
1285 - border-radius: 3px;
1286 -}
1287 -
1288 -.only-pro-content a:hover {
1289 - background: #2D419B;
1290 -}
1291 -
1292 -.only-pro-anchor {
1293 - position: relative;
1294 -}
1295 -
1296 -#sidebar::-webkit-scrollbar {
1297 - width: 4px;
1298 -}
1299 -
1300 -#sidebar::-webkit-scrollbar-thumb {
1301 - background: #999;
1302 -}
1303 -
1304 -span.viz-section-error {
1305 - color: #ff0000;
1306 -}
1307 -
1308 -#visualizer-error-manual {
1309 - color: #ff595e;
1310 -}
1311 -
1312 -#vz-chart-permissions {
1313 - width: 43%;
1314 -}
1315 -
1316 -#vz-chart-permissions {
1317 - color: #ce484c;
1318 -}
1319 -
1320 -#vz-chart-permissions {
1321 - right: 6px;
1322 - bottom: 40px;
1323 - width: 35%;
1324 -}
1325 -
1326 -#permissions-form .only-pro-feature > ul {
1327 - position: relative;
1328 - text-align: center;
1329 -}
1330 -
1331 -/******************************************************************************/
1332 -/******************************** DB WIZARD ***********************************/
1333 -/******************************************************************************/
1334 -.db-wizard-condition .select-condition {
1335 - display: none;
1336 -}
1337 -
1338 -.db-wizard-condition .select-condition.active {
1339 - display: block;
1340 - max-width: 50%;
1341 - margin-top: 10px;
1342 - padding-top: 10px;
1343 - border-top: 1px solid #eee;
1344 - font-weight: 500;
1345 -}
1346 -
1347 -.db-wizard-results {
1348 - width: calc(100% - 350px);
1349 -}
1350 -
1351 -#db-wizard-form {
1352 - padding: 25px;
1353 -}
1354 -
1355 -.db-wizard-query label {
1356 - display: block;
1357 - min-width: 150px;
1358 - padding: 20px 0 5px;
1359 - color: rgba(0,0,0,0.85);
1360 - font-size: 18px;
1361 - font-weight: 500;
1362 -}
1363 -
1364 -.db-wizard-query .db-wizard-where label,
1365 -.db-wizard-query .db-wizard-from label {
1366 - padding-top: 0;
1367 -}
1368 -
1369 -.db-wizard-query > div:not(:last-child) {
1370 - margin-bottom: 15px;
1371 -}
1372 -
1373 -.db-wizard-query .select-condition > div {
1374 - display: block;
1375 -}
1376 -
1377 -.db-wizard-query .chosen-container {
1378 - width: auto;
1379 -}
1380 -
1381 -.db-wizard-query .chosen-container-single .chosen-single {
1382 - border: 1px solid #ccc;
1383 - background: #fff;
1384 - box-shadow: none;
1385 - font-size: 13px;
1386 - font-weight: 500;
1387 -}
1388 -
1389 -.db-wizard-templates,
1390 -.db-wizard-templates > div {
1391 - display: block;
1392 -}
1393 -
1394 -.db-wizard-templates > div {
1395 - box-sizing: border-box;
1396 - width: 50%;
1397 - margin-top: 20px;
1398 - padding: 20px;
1399 - border: 1px solid #efefef;
1400 -}
1401 -
1402 -.db-wizard-templates > div:first-child {
1403 - margin-top: 0;
1404 -}
1405 -
1406 -.db-wizard-query .chosen-container-multi .chosen-choices {
1407 - padding: 5px;
1408 - border-color: #ccc;
1409 - background: #fff;
1410 - box-shadow: none;
1411 -}
1412 -
1413 -.db-wizard-results .dataTables_wrapper .dataTables_filter input,
1414 -.db-wizard-query .select-condition-operand input,
1415 -.db-wizard-limit input {
1416 - width: 50%;
1417 - padding-left: 7px;
1418 - border: 1px solid #ccc;
1419 - border-radius: 6px;
1420 - background: #fff;
1421 - box-shadow: none;
1422 - font-size: 13px;
1423 -}
1424 -
1425 -.db-wizard-limit input {
1426 - display: inline;
1427 - width: 150px;
1428 - margin: 0 0 20px 20px;
1429 -}
1430 -
1431 -.db-wizard-limit label {
1432 - display: inline;
1433 -}
1434 -
1435 -.db-wizard-query .select-condition-operand input::-webkit-input-placeholder {
1436 - color: #cdcdcd;
1437 -}
1438 -
1439 -.db-wizard-query .select-condition-operand input:-ms-input-placeholder {
1440 - color: #cdcdcd;
1441 -}
1442 -
1443 -.db-wizard-query .select-condition-operand input::placeholder {
1444 - color: #cdcdcd;
1445 -}
1446 -
1447 -.db-wizard-query .chosen-container-multi .chosen-choices li.search-choice {
1448 - padding: 5px 30px 5px 5px;
1449 - border-color: #ccc;
1450 - background: #fff;
1451 - box-shadow: none;
1452 - font-weight: 600;
1453 -}
1454 -
1455 -.db-wizard-results table > thead > tr > th {
1456 - padding: 15px 8px;
1457 - border: none;
1458 - color: #252422;
1459 - background: #fff;
1460 - font-size: 18px;
1461 - font-weight: 500;
1462 - text-align: left;
1463 -}
1464 -
1465 -.db-wizard-results table > tbody > tr > td,
1466 -.dataTables_info {
1467 - padding: 15px 8px;
1468 - border-top: 1px solid #a2a2a2;
1469 - color: #252422;
1470 - font-size: 14px;
1471 - font-weight: 300;
1472 -}
1473 -
1474 -.db-wizard-results table > tbody > tr.odd {
1475 - background-color: #f7f7f7;
1476 -}
1477 -
1478 -.db-wizard-results table.dataTable.no-footer {
1479 - border: none;
1480 -}
1481 -
1482 -.db-wizard-results .dataTables_wrapper .dataTables_info {
1483 - border-top: 1px solid #ccc5b9;
1484 - color: #a2a2a2;
1485 - font-size: 12px;
1486 - font-weight: 500;
1487 -}
1488 -
1489 -.db-wizard-results .dataTables_filter label {
1490 - font-size: 18px;
1491 - font-weight: 500;
1492 -}
1493 -
1494 -.db-wizard-where-template-remove,
1495 -.db-wizard-where-template-add {
1496 - width: auto;
1497 - height: 25px;
1498 - margin-top: 10px;
1499 - border: none;
1500 - border-radius: 3px;
1501 - color: #fff;
1502 - font-size: 12px;
1503 - cursor: pointer;
1504 - transition: 0.3s ease;
1505 -}
1506 -
1507 -.db-wizard-where-template-remove:hover,
1508 -.db-wizard-where-template-add:hover {
1509 - opacity: 0.8;
1510 -}
1511 -
1512 -.db-wizard-results .dataTables_wrapper .dataTables_filter {
1513 - float: none;
1514 - text-align: left;
1515 -}
1516 -
1517 -.db-wizard-where-template-add {
1518 - background-color: #34a85e;
1519 -}
1520 -
1521 -.db-wizard-where-template-remove {
1522 - background-color: #ff0d00;
1523 -}
1524 -
1525 -#db-query-form .CodeMirror-wrap {
1526 - height: 200px;
1527 - padding: 15px;
1528 - color: #fff;
1529 - background: #282923;
1530 - font-size: 15px;
1531 -}
1532 -
1533 -#db-query-form .CodeMirror-wrap .CodeMirror-cursor {
1534 - border-left: 1px solid #fff !important;
1535 -}
1536 -
1537 -#db-query-form .CodeMirror-wrap .CodeMirror-placeholder {
1538 - color: #fff;
1539 -}
1540 -
1541 -#db-query-form .CodeMirror-wrap pre {
1542 - color: #fff !important;
1543 -}
1544 -
1545 -#db-query-form .CodeMirror-wrap pre .cm-keyword {
1546 - color: #FF6188 !important;
1547 -}
1548 -
1549 -#db-query-form .CodeMirror-wrap pre .cm-builtin {
1550 - color: #78DCE8 !important;
1551 -}
1552 -
1553 -#db-query-form .CodeMirror-wrap pre .cm-comment {
1554 - color: #74705d !important;
1555 -}
1556 -
1557 -#db-query-form .CodeMirror-wrap pre .cm-number,
1558 -#db-query-form .CodeMirror-wrap pre .cm-string {
1559 - color: #A9DC76 !important;
1560 -}
1561 -
1562 -.visualizer-db-query-form > div {
1563 - display: block;
1564 - width: 15%;
1565 - vertical-align: middle;
1566 -}
1567 -
1568 -#visualizer-db-query {
1569 - padding: 20px;
1570 -}
1571 -
1572 -.visualizer-db-query-form > div:first-child {
1573 - width: 100%;
1574 - margin-bottom: 20px;
1575 -}
1576 -
1577 -.db-wizard-error {
1578 - color: #f00;
1579 - padding: 16px 0;
1580 -}
1581 -
1582 -.db-wizard-hints,
1583 -.json-wizard-hints,
1584 -.html-table-editor-hints {
1585 - margin-bottom: 30px;
1586 - color: #0085ba;
1587 -}
1588 -
1589 -.db-wizard-hints .visualizer-emboss,
1590 -.db-wizard-hints a,
1591 -.html-table-editor-hints a,
1592 -.json-wizard-hints .visualizer-emboss,
1593 -.json-wizard-hints a {
1594 - color: #f92472;
1595 -}
1596 -
1597 -.db-wizard-hints ul,
1598 -.html-table-editor-hints ul,
1599 -.json-wizard-hints ul {
1600 - list-style: square;
1601 - padding: 0 16px;
1602 -}
1603 -
1604 -.db-wizard-results .dataTables_wrapper .dataTables_info {
1605 - width: calc(100% - 17px);
1606 -}
1607 -
1608 -
1609 -/******************************************************************************/
1610 -/************************ manual config JSON editor *************************/
1611 -/******************************************************************************/
1612 -code.viz-manual-config-example {
1613 - display: block;
1614 - white-space: pre;
1615 - background: #f5f5f5;
1616 - border: 1px solid #e0e0e0;
1617 - border-radius: 3px;
1618 - padding: 6px 8px;
1619 - margin-top: 6px;
1620 - font-size: 11px;
1621 - line-height: 1.5;
1622 -}
1623 -
1624 -
1625 -textarea[name="manual"] + .CodeMirror {
1626 - background: #282923;
1627 - color: #f8f8f2;
1628 - border-radius: 4px;
1629 - height: 200px;
1630 - font-size: 13px;
1631 -}
1632 -
1633 -textarea[name="manual"] + .CodeMirror .CodeMirror-scroll {
1634 - min-height: 200px;
1635 -}
1636 -
1637 -textarea[name="manual"] + .CodeMirror .CodeMirror-gutters {
1638 - background: #1e1f1c;
1639 - border-right: 1px solid #404040;
1640 - color: #75715e;
1641 -}
1642 -
1643 -textarea[name="manual"] + .CodeMirror .CodeMirror-linenumber {
1644 - color: #75715e;
1645 -}
1646 -
1647 -textarea[name="manual"] + .CodeMirror .CodeMirror-cursor {
1648 - border-left: 1px solid #f8f8f0;
1649 -}
1650 -
1651 -textarea[name="manual"] + .CodeMirror .CodeMirror-selected {
1652 - background: #49483e;
1653 -}
1654 -
1655 -textarea[name="manual"] + .CodeMirror pre.CodeMirror-line,
1656 -textarea[name="manual"] + .CodeMirror pre.CodeMirror-line-like {
1657 - color: #f8f8f2;
1658 -}
1659 -
1660 -textarea[name="manual"] + .CodeMirror .cm-string {
1661 - color: #A9DC76;
1662 -}
1663 -
1664 -textarea[name="manual"] + .CodeMirror .cm-number {
1665 - color: #AB9DF2;
1666 -}
1667 -
1668 -textarea[name="manual"] + .CodeMirror .cm-atom {
1669 - color: #78DCE8;
1670 -}
1671 -
1672 -textarea[name="manual"] + .CodeMirror .cm-punctuation,
1673 -textarea[name="manual"] + .CodeMirror .cm-bracket {
1674 - color: #f8f8f2;
1675 -}
1676 -
1677 -/******************************************************************************/
1678 -/******************************** data tables *******************************/
1679 -/******************************************************************************/
1680 -.db-wizard-results .dt-button {
1681 - display: none !important;
1682 -}
1683 -
1684 -.dt-button.buttons-print {
1685 - display: none;
1686 -}
1687 -
1688 -/******************************************************************************/
1689 -/******************************** json table *********************************/
1690 -/******************************************************************************/
1691 -#json-conclude-form .results {
1692 - min-width: 10px !important;
1693 -}
1694 -
1695 -#json-conclude-form .json-table {
1696 - width: 85%;
1697 -}
1698 -
1699 -#vz-import-json-url,
1700 -#vz-import-json-root,
1701 -#vz-import-json-paging {
1702 - width: 75%;
1703 -}
1704 -
1705 -#json-conclude-form .json-table,
1706 -#json-conclude-form button#visualizer-json-conclude {
1707 - display: inline-block;
1708 - vertical-align: middle;
1709 -}
1710 -
1711 -.viz-editor-table tbody tr:first-child {
1712 - background-color: #ececec !important;
1713 -}
1714 -
1715 -.viz-editor-table tr th {
1716 - background-color: #cccccc;
1717 -}
1718 -
1719 -.viz-editor-table thead tr th:nth-child(n+1) {
1720 - cursor: move !important;
1721 -}
1722 -
1723 -#json-conclude-form .json-wizard-hints .info,
1724 -.html-table-editor-hints .info {
1725 - margin: 1% 0px;
1726 -}
1727 -
1728 -.viz-step.ui-state-active {
1729 - border-color: #0085BA !important;
1730 - background: #0085BA !important;
1731 - color: #ffffff;
1732 -}
1733 -
1734 -.viz-substep {
1735 - outline: 0 !important;
1736 - border: 0 !important;
1737 - background: none !important;
1738 - text-transform: uppercase;
1739 -}
1740 -
1741 -.viz-substep.ui-state-active {
1742 -}
1743 -
1744 -.viz-substep ~ .ui-accordion-content {
1745 - outline: 0 !important;
1746 - border: 0 !important;
1747 - font-size: smaller;
1748 -}
1749 -
1750 -.viz-substep ~ div {
1751 - display: table;
1752 -}
1753 -
1754 -.viz-substep ~ div > div {
1755 - display: table-row;
1756 -}
1757 -
1758 -.viz-substep ~ div > div div {
1759 - display: table-cell;
1760 - padding: 5px;
1761 -}
1762 -
1763 -.json-wizard-header .field-title {
1764 - position: absolute;
1765 - left: 30px;
1766 -}
1767 -/******************************************************************************/
1768 -/******************************** html table editor **************************/
1769 -/******************************************************************************/
1770 -.viz-simple-editor-type,
1771 -.viz-simple-editor {
1772 - display: none;
1773 -}
1774 -
1775 -.viz-table-editor {
1776 - width: 75%;
1777 - margin-left: 2%;
1778 -}
1779 -
1780 -.viz-html-table,
1781 -button#visualizer-save-html-table {
1782 - display: inline-block;
1783 - vertical-align: middle;
1784 -}
1785 -
1786 -
1787 -/******************************************************************************/
1788 -/******************************** text area editor **************************/
1789 -/******************************************************************************/
1790 -.viz-text-editor {
1791 - padding: 20px;
1792 - z-index: 9999;
1793 - box-sizing: border-box;
1794 - padding-right: 320px;
1795 -}
1796 -
1797 -.viz-text-editor textarea {
1798 - width: 85%;
1799 - overflow: auto;
1800 - background: #282923;
1801 - color: #ffffff;
1802 - padding: 15px;
1803 - height: 400px;
1804 - font-size: 15px;
1805 -}
1806 -
1807 -.viz-text-editor textarea,
1808 -button#viz-text-editor-button {
1809 - display: inline-block;
1810 - vertical-align: middle;
1811 -}
1812 -
1813 -.viz-simple-editor .viz-html-table {
1814 - width: 95%;
1815 -}
1816 -
1817 -/******************************************************************************/
1818 -/******************************** chartjs ***********************************/
1819 -/******************************************************************************/
1820 -
1821 -canvas.chartjs-render-monitor {
1822 - height: 500px !important;
1823 -}
1824 -
1825 -/******************************************************************************/
1826 -/******************************** Frontend Actions ***********************************/
1827 -/******************************************************************************/
1828 -#vz-frontend-actions .only-pro-inner, #vz-data-controls .only-pro-inner {
1829 - text-align: center;
1830 -}
1831 -
1832 -/******************************************************************************/
1833 -/******************************** chart type box upsell ***********************/
1834 -/******************************************************************************/
1835 -
1836 -.pro-upsell .pro-upsell-overlay {
1837 - position: absolute;
1838 - width: 100%;
1839 - height: 100%;
1840 - left: 0;
1841 - top: 0;
1842 - display: grid;
1843 - place-items: center;
1844 - background-color: rgba(255, 255, 255, 0.7);
1845 - z-index: 1;
1846 - opacity: 0;
1847 - visibility: hidden;
1848 - transition: all .3s ease-in-out;
1849 -}
1850 -.pro-upsell:hover .pro-upsell-overlay{
1851 - opacity: 1;
1852 - visibility: visible;
1853 -}
1854 -
1855 -.pro-upsell .pro-upsell-overlay .button {
1856 - width: 155px;
1857 - height: 39px;
1858 - background: #007CBA;
1859 - border-radius: 4px;
1860 - display: flex;
1861 - align-items: center;
1862 - text-align: center;
1863 - color: #FFFFFF;
1864 - justify-content: center;
1865 -}
1866 -.pro-upsell .pro-upsell-overlay .button.button-secondary{
1867 - background: #ffffff;
1868 - color: #007CBA;
1869 -}
1870 -.pro-upsell .pro-upsell-overlay .pro-upsell-action {
1871 - display: flex;
1872 - gap: 20px;
1873 -}
1874 -.pro-upsell .pro-upsell-overlay .pro-upsell-action .button{
1875 - width: 100%;
1876 - text-align: center;
1877 -}
1 +#content {
2 + position: absolute;
3 + top: 0;
4 + right: 0;
5 + bottom: 60px;
6 + left: 0;
7 + z-index: 75;
8 + overflow: auto;
9 + background-color: white;
10 +}
11 +
12 +#canvas {
13 + position: absolute;
14 + left: 10px;
15 + right: 310px;
16 + top: 10px;
17 + bottom: 10px;
18 +}
19 +
20 +.loader {
21 + position: absolute;
22 + left: 50%;
23 + top: 50%;
24 + margin-left: -16px;
25 + margin-top: -16px;
26 +}
27 +
28 +/******************************************************************************/
29 +/******************************** SIDEBAR ***********************************/
30 +/******************************************************************************/
31 +
32 +#sidebar {
33 + position: absolute;
34 + top: 0;
35 + right: 0;
36 + bottom: 60px;
37 + width: 299px;
38 + z-index: 75;
39 + background: whitesmoke;
40 + border-left: 1px solid #DFDFDF;
41 + overflow: auto;
42 + -webkit-overflow-scrolling: touch;
43 +}
44 +
45 +.group-wrapper {
46 + border-top: 1px solid #DFDFDF;
47 + margin: 0;
48 + padding: 0;
49 + list-style: none;
50 +}
51 +
52 +.group {
53 + margin: 0;
54 + list-style: none;
55 + font-size: 12px;
56 + line-height: 18px;
57 +}
58 +
59 +.group.open {
60 + border-bottom: 1px solid #DFDFDF;
61 +
62 +}
63 +
64 +.group-title {
65 + border-top: 1px solid white;
66 + border-bottom: 1px solid #DFDFDF;
67 + position: relative;
68 + cursor: pointer;
69 + -webkit-user-select: none;
70 + -moz-user-select: none;
71 + -ms-user-select: none;
72 + user-select: none;
73 + margin: 0;
74 + padding: 10px 20px;
75 + font-size: 15px;
76 + font-family: Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
77 + font-weight: normal;
78 + text-shadow: 0 1px 0 white;
79 + background: whiteSmoke;
80 + background-image: -webkit-gradient(linear, left bottom, left top, from(#EEE), to(whiteSmoke));
81 + background-image: -webkit-linear-gradient(bottom, #EEE, whiteSmoke);
82 + background-image: -moz-linear-gradient(bottom, #EEE, whiteSmoke);
83 + background-image: -o-linear-gradient(bottom, #EEE, whiteSmoke);
84 + background-image: -ms-linear-gradient(bottom, #EEE, whiteSmoke);
85 + background-image: linear-gradient(bottom, #EEE, whiteSmoke);
86 + font-family: "Open Sans",sans-serif;
87 + font-weight: 700;
88 +}
89 +
90 +.group-title:hover,
91 +.group.open .group-title {
92 + color: white;
93 + text-shadow: 0 -1px 0 #333;
94 + background: gray;
95 + background-image: -webkit-gradient(linear, left bottom, left top, from(#6D6D6D), to(gray));
96 + background-image: -webkit-linear-gradient(bottom, #6D6D6D, gray);
97 + background-image: -moz-linear-gradient(bottom, #6D6D6D, gray);
98 + background-image: -o-linear-gradient(bottom, #6D6D6D, gray);
99 + background-image: -ms-linear-gradient(bottom, #6D6D6D, gray);
100 + background-image: linear-gradient(bottom, #6D6D6D, gray);
101 + font-family: "Open Sans", sans-serif;
102 + font-weight: 700;
103 +}
104 +
105 +.group-title::after {
106 + content: '';
107 + width: 0;
108 + height: 0;
109 + border-color: #CCC transparent;
110 + border-style: solid;
111 + border-width: 6px 6px 0;
112 + position: absolute;
113 + top: 15px;
114 + right: 20px;
115 + z-index: 1;
116 +}
117 +
118 +.group-title:hover::after,
119 +.group.open .group-title::after {
120 + border-color: #EEE transparent;
121 +}
122 +
123 +.group:hover .group-title {
124 + border-top-color: gray;
125 +}
126 +
127 +.group.open .group-title {
128 + border-top-color: #6D6D6D;
129 +}
130 +
131 +.group.open .group-title::after {
132 + border-width: 0 6px 6px;
133 +}
134 +
135 +.group-content {
136 + margin: 0;
137 + display: none;
138 + background-color: #FDFDFD;
139 + padding: 10px 0 20px 0;
140 + overflow: hidden;
141 +}
142 +
143 +div.group-content {
144 + padding: 10px 20px 20px;
145 +}
146 +
147 +.group.open .group-content {
148 + display: block;
149 +}
150 +
151 +.group-description {
152 + font-size: 12px;
153 + color: #555;
154 + padding: 5px 20px 10px;
155 + margin: 0;
156 +}
157 +
158 +div.group-content .group-description {
159 + padding: 0;
160 + font-weight: 300;
161 + font-family: "Montserrat",sans-serif;
162 +}
163 +
164 +.initial-screen .group-description {
165 + padding: 0;
166 + font-weight: 300;
167 + font-family: "Montserrat",sans-serif;
168 + padding: 10px 20px 20px;
169 +}
170 +
171 +.section-title {
172 + display: block;
173 + font-weight: bold;
174 + position: relative;
175 + cursor: pointer;
176 + padding: 4px 20px;
177 + margin-bottom: 5px;
178 + background-color: rgba(0, 0, 0, 0.02);
179 + border-top: 1px solid #eeeeee;
180 + -webkit-box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
181 + box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
182 + border-bottom: 1px solid #eeeeee;
183 +}
184 +
185 +.section-title::after {
186 + content: '';
187 + width: 0;
188 + height: 0;
189 + border-color: #CCC transparent;
190 + border-style: solid;
191 + border-width: 4px 4px 0;
192 + position: absolute;
193 + top: 13px;
194 + right: 20px;
195 + z-index: 1;
196 +}
197 +
198 +.section-title.open::after {
199 + border-width: 0 4px 4px;
200 +}
201 +
202 +.section-items {
203 + display: none;
204 + padding: 5px 20px 10px 20px;
205 +}
206 +
207 +.section-items.open {
208 + display: block;
209 +}
210 +
211 +.more-info {
212 + text-decoration: none;
213 + color: #21759B;
214 + font-size: 85%;
215 + font-weight: normal;
216 + float: right;
217 + display: none;
218 +}
219 +
220 +.section-description {
221 + /*display: none;*/
222 + padding: 0;
223 + margin: 0;
224 + font-size: 11px;
225 + color: gray;
226 +}
227 +
228 +.section-table {
229 + width: 100%;
230 +}
231 +
232 +.section-delimiter {
233 + margin: 15px 0;
234 + border-top: 1px dashed #ccc;
235 +}
236 +
237 +.section-table-column {
238 + width: 50%;
239 + text-align: left;
240 + vertical-align: top;
241 + padding: 0 1px;
242 +}
243 +
244 +.section-item {
245 + margin-bottom: 10px;
246 +}
247 +
248 +.control-select,
249 +.control-text {
250 + width: 100%;
251 +}
252 +
253 +.section-description ul {
254 + margin: 0 0 0 25px;
255 + list-style: circle;
256 +}
257 +
258 +.section-description li {
259 + list-style: circle;
260 + margin: 0;
261 +}
262 +
263 +#rate-the-plugin {
264 + margin-top: 40px;
265 + padding: 20px;
266 + border-top: 1px dashed #ddd;
267 + text-align: center;
268 +}
269 +
270 +.rate-the-plugin{
271 + width: 40% !important;
272 + margin-top: -5px;
273 +}
274 +
275 +#rate-stars {
276 + margin: 15px auto;
277 + width: 100px;
278 + height: 20px;
279 + background-image: url('../images/star.png');
280 + background-repeat: repeat-x;
281 + background-position: right center;
282 +}
283 +
284 +#rate-link {
285 + text-decoration: none;
286 + font-family: "Montserrat",sans-serif;
287 + font-weight: 400;
288 +}
289 +
290 +#flattr {
291 + margin-top: 15px;
292 + text-align: center;
293 +}
294 +
295 +/******************************************************************************/
296 +/******************************** TOOLBAR ***********************************/
297 +/******************************************************************************/
298 +
299 +#toolbar {
300 + height: 36px;
301 + padding: 12px 16px;
302 + position: absolute;
303 + z-index: 100;
304 + left: 0;
305 + right: 0;
306 + bottom: 0;
307 + border-top: 1px solid #DFDFDF;
308 + overflow: hidden;
309 + -webkit-box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
310 + box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
311 +}
312 +
313 +#toolbar .push-right {
314 + float: right;
315 +}
316 +
317 +.toolbar-div{
318 + display: inline-block;
319 + vertical-align: top;
320 + width: 30%;
321 +}
322 +
323 +/******************************************************************************/
324 +/******************************** TYPE PICKER ******************************/
325 +/******************************************************************************/
326 +
327 +#type-picker {
328 + margin: 50px auto;
329 + width: 952px;
330 +}
331 +
332 +.type-box {
333 + float: left;
334 + margin: 0 20px 20px 0;
335 + border: 1px dashed #ddd;
336 + -webkit-box-shadow: 0px 0px 8px #ddd;
337 + box-shadow: 0px 0px 8px #ddd;
338 + background-color: #efefef;
339 +}
340 +
341 +.type-box:nth-child(3n+3) {
342 + margin-right: 0px;
343 +}
344 +
345 +.type-label {
346 + display: block;
347 + width: 270px;
348 + height: 195px;
349 + padding: 15px;
350 + background-color: white;
351 + background-image: url(../images/chart_types_g.png);
352 + background-repeat: no-repeat;
353 + background-position: center center;
354 + border: 1px solid #e0e0e0;
355 +}
356 +
357 +.type-label-selected,
358 +.type-label:hover {
359 + background-image: url(../images/chart_types.png);
360 +}
361 +
362 +.type-box-area .type-label {
363 + background-position: 0px -225px;
364 +}
365 +
366 +.type-box-line .type-label {
367 + background-position: -600px 0px;
368 +}
369 +
370 +.type-box-scatter .type-label {
371 + background-position: -300px 0px;
372 +}
373 +
374 +.type-box-pie .type-label {
375 + background-position: 0px 0px;
376 +}
377 +
378 +.type-box-gauge .type-label {
379 + background-position: 0px -450px;
380 +}
381 +
382 +.type-box-geo .type-label {
383 + background-position: -600px -450px;
384 +}
385 +
386 +.type-box-candlestick .type-label {
387 + background-position: -300px -450px;
388 +}
389 +
390 +.type-box-bar .type-label {
391 + background-position: -300px -225px;
392 +}
393 +
394 +.type-box-column .type-label {
395 + background-position: -600px -225px;
396 +}
397 +
398 +/******************************************************************************/
399 +/******************************** OTHER STYLES ******************************/
400 +/******************************************************************************/
401 +
402 +#thehole {
403 + position: absolute;
404 + left: 0;
405 + top: 0;
406 + width: 1px;
407 + height: 1px;
408 + border: 0;
409 + opacity: 0;
410 + -moz-opacity: 0;
411 + filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
412 +}
413 +
414 +.locker, .locker-loader {
415 + left: 0;
416 + top: 0;
417 + position: absolute;
418 +}
419 +
420 +.locker {
421 + z-index: 1000;
422 + background-color: white;
423 + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
424 + filter: alpha(opacity=80);
425 + opacity: 0.8;
426 +}
427 +
428 +.locker-loader {
429 + z-index: 1001;
430 + background: url(../images/ajax-loader.gif) no-repeat center center;
431 +}
432 +
433 +.file-wrapper {
434 + position: relative;
435 + overflow: hidden;
436 +}
437 +
438 +.file {
439 + font-size: 200px;
440 + position: absolute;
441 + top: 0;
442 + right: 0;
443 + opacity: 0;
444 + -moz-opacity: 0;
445 + filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
446 + cursor: pointer;
447 +}
448 +
449 +#remote-file {
450 + float: right;
451 + clear: both;
452 +}
453 +
454 + .form-inline {
455 + margin: 0 auto;
456 + display: table;
457 + vertical-align: middle;
458 + }
459 +
460 + .computer-btn{
461 + color: #646464 !important;
462 + border: medium none rgb(100, 100, 100) !important;
463 + background: #E6E6E6 url("../images/computer.png") no-repeat scroll 7px 1px !important;
464 + padding-left: 27px !important;
465 + transition: all 0.3s ease 0s;
466 + font-family: "Open Sans",sans-serif;
467 + font-weight: 700;
468 + border: 1px solid #B0B0B0 !important;
469 + box-shadow: none !important;
470 + text-shadow:none!important;
471 +
472 + }
473 +
474 + .computer-btn:hover{
475 + color: white !important;
476 + background: #2f8cea url("../images/computer.png") no-repeat scroll 7px -36px !important;
477 + transition: all 0.3s ease 0s;
478 + padding-left: 27px !important;
479 + -webkit-transition: all .3s ease;
480 + -moz-transition: all .3s ease;
481 + -ms-transition: all .3s ease;
482 + -o-transition: all .3s ease;
483 + transition: all .3s ease;
484 + box-shadow: 0px 1px 0px rgba(171, 171, 171, 0.5) inset, 0px 1px 0px rgba(0, 0, 0, 0.15) !important;
485 + border: 1px solid #2f8cea !important;
486 + box-shadow: none !important;
487 +
488 +
489 + }
490 +
491 + .just-on-pro{
492 + background: #FFF url("../images/available_pro.png") no-repeat scroll 0px 1px !important;
493 + width: 250px;
494 + height: 100px;
495 + cursor:not-allowed;
496 + opacity: 0.8;
497 + margin-bottom: 10px;
498 + }
499 +
500 +
501 +
502 + .from-web{
503 + margin-top: 0px;
504 + margin-bottom: 15px !important;
505 +}
506 +
507 + .from-web-btn{
508 + color: #646464 !important;
509 + border: medium none #646464 !important;
510 + background: #E6E6E6 url("../images/web.png") no-repeat scroll 7px 1px !important;
511 + padding-left: 25px !important;
512 + transition: all 0.3s ease 0s;
513 + border: 1px solid #B0B0B0 !important;
514 + box-shadow: none !important;
515 + font-family: "Open Sans",sans-serif;
516 + font-weight: 700;
517 + margin-left: 2px !important;
518 +}
519 +
520 + .from-web-btn:hover{
521 + color: white !important;
522 + background: #89B158 url("../images/web.png") no-repeat scroll 7px -38px !important;
523 + transition: all 0.3s ease 0s;
524 + padding-left: 25px !important;
525 + -webkit-transition: all .3s ease;
526 + -moz-transition: all .3s ease;
527 + -ms-transition: all .3s ease;
528 + -o-transition: all .3s ease;
529 + transition: all .3s ease;
530 + margin-left: 2px !important;
531 + border: 1px solid #89B158 !important;
532 + box-shadow: none !important;
533 +}
534 +
535 +.preview{
536 + width: 100%;
537 +}
538 +.from-chart-btn{
539 + color: #646464 !important;
540 + border: medium none #646464 !important;
541 + background: #E6E6E6 url("../images/from_chart.png") no-repeat scroll 7px 1px !important;
542 + padding-left: 25px !important;
543 + transition: all 0.3s ease 0s;
544 + border: 1px solid #B0B0B0 !important;
545 + box-shadow: none !important;
546 + font-family: "Open Sans",sans-serif;
547 + font-weight: 700;
548 + margin-left: 2px !important;
549 + margin-top: 2px !important;
550 +}
551 +
552 + .from-chart-btn:hover{
553 + color: white !important;
554 + background: #10aecb url("../images/from_chart.png") no-repeat scroll 7px -36px !important;
555 + transition: all 0.3s ease 0s;
556 + padding-left: 25px !important;
557 + -webkit-transition: all .3s ease;
558 + -moz-transition: all .3s ease;
559 + -ms-transition: all .3s ease;
560 + -o-transition: all .3s ease;
561 + transition: all .3s ease;
562 + margin-left: 2px !important;
563 + border: 1px solid #10aecb !important;
564 + box-shadow: none !important;
565 + margin-top: 2px !important;
566 + }
567 +
568 + input#existing-chart {
569 + left: 18px;
570 + width: 110px;
571 + position: relative;
572 + }
573 +
574 + select#chart-id {
575 + left: 44px;
576 + position: relative;
577 + width: 120px;
578 + }
579 +
580 + button#editor-chart-button {
581 + width: 260px;
582 + margin: 0 auto;
583 + display: block;
584 + background-color: #2f8cea !important;
585 + color: white !important;
586 + border: 1px solid #2c80d6 !important;
587 + box-shadow: none !important;
588 + -webkit-transition: all .3s ease;
589 + -moz-transition: all .3s ease;
590 + -ms-transition: all .3s ease;
591 + -o-transition: all .3s ease;
592 + transition: all .3s ease;
593 + text-shadow: none;
594 + }
595 +
596 +.preview-btn{
597 + font-family: "Open Sans",sans-serif;
598 + font-weight: 700;
599 + background-color: #2f8cea !important;
600 + color: white !important;
601 + border: 1px solid #2c80d6 !important;
602 + box-shadow: none !important;
603 + -webkit-transition: all .3s ease;
604 + -moz-transition: all .3s ease;
605 + -ms-transition: all .3s ease;
606 + -o-transition: all .3s ease;
607 + transition: all .3s ease;
608 +}
609 +
610 +.preview-btn:hover{
611 + font-family: "Open Sans",sans-serif;
612 + font-weight: 700;
613 + background-color: #2c80d6 !important;
614 + color: white !important;
615 + border: 1px solid #2c80d6 !important;
616 + box-shadow: none !important;
617 + -webkit-transition: all .3s ease;
618 + -moz-transition: all .3s ease;
619 + -ms-transition: all .3s ease;
620 + -o-transition: all .3s ease;
621 + transition: all .3s ease;
622 +}
623 +
624 +.show-live-btn{
625 + margin-top: 15px !important;
626 + width: 100%;
627 + background-color: #F90 !important;
628 + border-color: #E98B00 !important;
629 + font-family: "Open Sans",sans-serif;
630 + font-weight: 700;
631 + box-shadow: none !important;
632 +}
633 +
634 +
635 +.show-live-btn:hover{
636 + margin-top: 15px !important;
637 + width: 100%;
638 + background-color: #ea8c00 !important;
639 + border-color: #E98B00 !important;
640 + font-family: "Open Sans",sans-serif;
641 + font-weight: 700;
642 + box-shadow: none !important;
643 + -webkit-transition: all .3s ease;
644 + -moz-transition: all .3s ease;
645 + -ms-transition: all .3s ease;
646 + -o-transition: all .3s ease;
647 + transition: all .3s ease;
648 +}
649 +
650 +.check-pro-btn {
651 + height: 40px;
652 + width: 245px;
653 + display: block;
654 + margin: 0 auto;
655 +}
656 +
657 +.advanced-settings-btn, .return-settings-btn {
658 + cursor: pointer;
659 + display: block;
660 + margin: 0 auto;
661 + width: 260px;
662 + line-height: 34px;
663 + font-size: 17px;
664 + width: 260px;
665 + height: auto;
666 + -webkit-border-radius: 3px;
667 + -moz-border-radius: 3px;
668 + border-radius: 3px;
669 + margin-bottom: 20px;
670 + margin-top:5px;
671 +}
672 +
673 +.return-settings-btn {
674 + margin: 10px auto;
675 +}
676 +
677 +.hidden-setting {
678 + display:none;
679 +}
680 +
681 +
682 +
683 +/* ====== RESPONSIVE ====== */
684 +
685 +
686 +@media (max-width: 1366px) {
687 + .group-title {
688 + padding: 4px 20px;
689 + font-weight: 400;
690 + font-size: 14px;
691 + }
692 + .group-title::after {
693 + top: 10px;
694 + }
695 + #rate-stars {
696 + margin: 3px 0 10px 40%;
697 + }
698 + .rate-the-plugin {
699 + margin-left: -8%;
700 + }
701 +
702 +
703 +
704 +}