PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 2.1.3
Visualizer – Tables & Charts Manager with Built-in AI Generator v2.1.3
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 3.10.4 All 148 releases
visualizer / css / frame.css

frame.css in Visualizer – Tables & Charts Manager with Built-in AI Generator 2.1.3, at css/frame.css

999 lines 18.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
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 background-color: white;
10 }
11
12 #canvas {
13 position: absolute;
14 top: 10px;
15 right: 310px;
16 bottom: 10px;
17 left: 10px;
18 }
19
20 .loader {
21 position: absolute;
22 top: 50%;
23 left: 50%;
24 margin-top: -16px;
25 margin-left: -16px;
26 }
27
28 /******************************************************************************/
29 /******************************** SIDEBAR ***********************************/
30 /******************************************************************************/
31
32 #sidebar {
33 overflow: auto;
34 position: absolute;
35 z-index: 75;
36 top: 0;
37 right: 0;
38 bottom: 60px;
39 width: 299px;
40 border-left: 1px solid #dfdfdf;
41 background: whitesmoke;
42
43 -webkit-overflow-scrolling: touch;
44 }
45
46 .group {
47 margin: 0;
48 font-size: 12px;
49 line-height: 18px;
50 list-style: none;
51 }
52
53 .group .group-header .group-title {
54 margin: 10px 0;
55 padding: 15px 20px;
56 border-top: 1px solid #ddd;
57 border-bottom: 1px solid #ddd;
58 color: #555d66;
59 background: #fff;
60 }
61
62 .group-wrapper ul .group-title {
63 border-top: 1px solid #ddd;
64 }
65
66 .group-wrapper ul li {
67 border-top: 1px solid #ddd;
68 }
69
70 .group-wrapper ul ul li.subsection {
71 margin: 5px;
72 border: 1px solid #ddd;
73 }
74
75 .group-wrapper .group .group .group-title {
76 position: relative;
77 margin: 0;
78 padding: 10px 10px 11px 14px;
79 border-top: none;
80 border-bottom: none;
81 border-left: 4px solid #fff;
82 color: #555d66;
83 background-color: #fff;
84 font-size: 14px;
85 font-weight: 600;
86 line-height: 21px;
87 cursor: pointer;
88 -webkit-transition: 0.15s color ease-in-out,0.15s background-color ease-in-out,0.15s border-color ease-in-out;
89 transition: 0.15s color ease-in-out,0.15s background-color ease-in-out,0.15s border-color ease-in-out;
90 }
91
92 .group-wrapper .group .group:hover .group-title,
93 .group-wrapper .group .group.open .group-title {
94 border-left-color: #0073aa;
95 color: #0073aa;
96 background: #f3f3f5;
97 }
98
99 .group-wrapper .group .group .group-title:after {
100 position: absolute;
101 z-index: 1;
102 top: 11px;
103 right: 10px;
104 color: #a0a5aa;
105 font: 400 20px/1 dashicons;
106 content: "\f345";
107 }
108
109 .group-wrapper .group .group.open .group-title:after {
110 content: "\f347";
111 }
112
113 .group-wrapper .group .customize-section-back {
114 display: block;
115 float: left;
116 width: 42px;
117 height: 49px;
118 margin: 0 15px 0 0;
119 padding: 0;
120 border: none;
121 border-top: 1px solid #ddd;
122 border-right: 1px solid #ddd;
123 border-left: 4px solid #fff;
124 background: #fff;
125 -webkit-box-shadow: none;
126 box-shadow: none;
127 cursor: pointer;
128 -webkit-transition: color 0.15s ease-in-out,border-color 0.15s ease-in-out,background 0.15s ease-in-out;
129 transition: color 0.15s ease-in-out,border-color 0.15s ease-in-out,background 0.15s ease-in-out;
130 }
131
132 .group-wrapper .group .customize-section-back:hover {
133 border-left-color: #0073aa;
134 outline: 0;
135 color: #0073aa;
136 background: #f3f3f5;
137 }
138
139 .group-wrapper .group .customize-section-back:before {
140 position: relative;
141 top: -11px;
142 left: -2px;
143 font: 400 20px/72px dashicons;
144 content: "\f341";
145 }
146
147 .group-wrapper.full-height {
148 float: left;
149 position: relative;
150 width: 100%;
151 height: 100%;
152 margin: 0;
153 }
154
155 .group.bottom-fixed {
156 display: block;
157 position: absolute;
158 bottom: 0;
159 width: 100%;
160 }
161
162 .group ul li h2,
163 .group ul li h3 {
164 padding: 7px 15px 7px 35px;
165 }
166
167 .group h2 .dashicons {
168 margin-right: 5px;
169 vertical-align: -5px;
170 }
171
172 .group-content {
173 display: none;
174 margin: 0;
175 padding: 0;
176 background-color: #fdfdfd;
177 }
178
179 div.group-content {
180 padding: 15px;
181 }
182
183 .group.open > .group-content {
184 display: block;
185 }
186
187 .group-description {
188 margin: 0;
189 padding: 5px;
190 color: #555;
191 font-size: 12px;
192 text-align: left;
193 }
194
195 div.group-content .group-description {
196 padding: 5px;
197 font-family: "Montserrat",sans-serif;
198 font-weight: 300;
199 }
200
201 .initial-screen .group-description {
202 padding: 0;
203 padding: 10px 20px 20px;
204 font-family: "Montserrat",sans-serif;
205 font-weight: 300;
206 }
207
208 .section-title {
209 display: block;
210 position: relative;
211 margin-bottom: 5px;
212 padding: 4px 20px;
213 border-top: 1px solid #eee;
214 border-bottom: 1px solid #eee;
215 background-color: rgba(0, 0, 0, 0.02);
216 -webkit-box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
217 box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
218 font-weight: bold;
219 cursor: pointer;
220 }
221
222 .group-wrapper ul ul li .section-title {
223 margin-bottom: 0;
224 border: none;
225 -webkit-box-shadow: none;
226 box-shadow: none;
227 }
228
229 .section-title::after {
230 position: absolute;
231 z-index: 1;
232 top: 13px;
233 right: 20px;
234 width: 0;
235 height: 0;
236 border-width: 4px 4px 0;
237 border-style: solid;
238 border-color: #ccc transparent;
239 content: "";
240 }
241
242 .section-title.open::after {
243 border-width: 0 4px 4px;
244 }
245
246 .section-items {
247 display: none;
248 padding: 15px;
249 }
250
251 .section-items.open {
252 display: block;
253 }
254
255 .more-info {
256 display: none;
257 float: right;
258 color: #21759b;
259 font-size: 85%;
260 font-weight: normal;
261 text-decoration: none;
262 }
263
264 .section-description {
265 margin: 0;
266 /*display: none;*/
267 padding: 0;
268 color: gray;
269 font-size: 11px;
270 }
271
272 .section-table {
273 width: 100%;
274 }
275
276 .section-delimiter {
277 margin: 15px 0;
278 border-top: 1px dashed #ccc;
279 }
280
281 .section-table-column {
282 width: 50%;
283 padding: 0 1px;
284 text-align: left;
285 vertical-align: top;
286 }
287
288 .section-item {
289 margin-bottom: 10px;
290 }
291
292 .control-select,
293 .control-text {
294 width: 100%;
295 }
296
297 .control-check {
298 float: right;
299 }
300
301 .control-check::after {
302 clear: both;
303 }
304
305 .section-description ul {
306 margin: 0 0 0 25px;
307 list-style: circle;
308 }
309
310 .section-description li {
311 margin: 0;
312 list-style: circle;
313 }
314
315 #rate-the-plugin {
316 margin-top: 40px;
317 padding: 20px;
318 border-top: 1px dashed #ddd;
319 text-align: center;
320 }
321
322 .rate-the-plugin {
323 width: 40% !important;
324 margin-top: -5px;
325 }
326
327 #rate-stars {
328 width: 100px;
329 height: 20px;
330 margin: 15px auto;
331 background-image: url("../images/star.png");
332 background-repeat: repeat-x;
333 background-position: right center;
334 }
335
336 #rate-link {
337 font-family: "Montserrat",sans-serif;
338 font-weight: 400;
339 text-decoration: none;
340 }
341
342 #flattr {
343 margin-top: 15px;
344 text-align: center;
345 }
346
347 /******************************************************************************/
348 /******************************** TOOLBAR ***********************************/
349 /******************************************************************************/
350
351 #toolbar {
352 overflow: hidden;
353 position: absolute;
354 z-index: 100;
355 right: 0;
356 bottom: 0;
357 left: 0;
358 height: 36px;
359 padding: 12px 16px;
360 border-top: 1px solid #dfdfdf;
361 -webkit-box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
362 box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
363 text-align: center;
364 }
365
366 #toolbar .push-right {
367 float: right;
368 }
369
370 .toolbar-div a {
371 float: left;
372 }
373
374 .toolbar-div {
375 display: inline-block;
376 float: left;
377 width: 30%;
378 vertical-align: top;
379 }
380
381 /******************************************************************************/
382 /******************************** TYPE PICKER ******************************/
383 /******************************************************************************/
384
385 .type-box span {
386 display: block;
387 position: absolute;
388 right: 0;
389 bottom: -6px;
390 width: 100%;
391 padding: 4px 0;
392 border-top: 1px dashed #ddd;
393 border-bottom: 1px dashed #ddd;
394 background: #e0e0e0;
395 background-color: #efefef;
396 -webkit-box-shadow: 0 0 8px #ddd;
397 box-shadow: 0 0 8px #ddd;
398 font-weight: bold;
399 text-align: center;
400 }
401
402 .type-box .pro-upsell {
403 color: #c55555;
404 }
405
406 #type-picker {
407 width: 952px;
408 margin: 50px auto;
409 }
410
411 .type-box {
412 float: left;
413 position: relative;
414 margin: 0 20px 20px 0;
415 border: 1px dashed #ddd;
416 background-color: #efefef;
417 -webkit-box-shadow: 0 0 8px #ddd;
418 box-shadow: 0 0 8px #ddd;
419 }
420
421 .type-box:nth-child(3n+3) {
422 margin-right: 0;
423 }
424
425 .type-box .pro-upsell .visualizder-pro-label {
426 display: inline;
427 position: absolute;
428 top: 0;
429 width: 74px;
430 height: 10px;
431 height: 17px;
432 border: none;
433 color: #fff;
434 background: #c55555;
435 }
436
437 .type-label {
438 display: block;
439 width: 270px;
440 height: 205px;
441 padding: 15px;
442 border: 1px solid #e0e0e0;
443 background-color: white;
444 background-image: url(../images/chart_types_g.png);
445 background-repeat: no-repeat;
446 background-position: center center;
447 }
448
449 .type-label-selected,
450 .type-box > .type-label:hover {
451 background-image: url(../images/chart_types.png);
452 }
453
454 .type-box-area .type-label {
455 background-position: 0 -225px;
456 }
457
458 .type-box-line .type-label {
459 background-position: -600px 0;
460 }
461
462 .type-box-scatter .type-label {
463 background-position: -300px 0;
464 }
465
466 .type-box-pie .type-label {
467 background-position: 0 0;
468 }
469
470 .type-box-gauge .type-label {
471 background-position: 0 -450px;
472 }
473
474 .type-box-geo .type-label {
475 background-position: -600px -450px;
476 }
477
478 .type-box-candlestick .type-label {
479 background-position: -300px -450px;
480 }
481
482 .type-box-bar .type-label {
483 background-position: -300px -225px;
484 }
485
486 .type-box-column .type-label {
487 background-position: -600px -225px;
488 }
489
490 .type-box-table .type-label {
491 background-position: -301px -670px;
492 }
493
494 .type-box-timeline .type-label {
495 background-position: -2px -670px;
496 }
497
498 .type-box-combo .type-label {
499 background-position: -597px -670px;
500 }
501
502 /******************************************************************************/
503 /******************************** OTHER STYLES ******************************/
504 /******************************************************************************/
505
506 #thehole {
507 position: absolute;
508 top: 0;
509 left: 0;
510 width: 1px;
511 height: 1px;
512 border: 0;
513 opacity: 0;
514
515 filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
516 -moz-opacity: 0;
517 }
518
519 .locker,
520 .locker-loader {
521 position: absolute;
522 top: 0;
523 left: 0;
524 }
525
526 .locker {
527 z-index: 1000;
528 opacity: 0.8;
529 background-color: white;
530
531 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
532 filter: alpha(opacity=80);
533 }
534
535 .locker-loader {
536 z-index: 1001;
537 background: url(../images/ajax-loader.gif) no-repeat center center;
538 }
539
540 .file-wrapper {
541 display: inline-block;
542 width: auto;
543 max-width: 133px;
544 }
545
546 .file {
547 position: fixed;
548 max-width: 138px;
549 margin-top: -6px;
550 margin-left: -33px;
551 opacity: 0;
552 font-size: 22px;
553 cursor: pointer;
554
555 filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
556 -moz-opacity: 0;
557 }
558
559 #remote-file {
560 display: inline-block;
561 float: right;
562 margin-left: 6px;
563 }
564
565 .form-inline {
566 display: table;
567 /*margin: 0 auto;*/
568 width: 100%;
569 vertical-align: middle;
570 }
571
572 .computer-btn {
573 overflow: hidden;
574 left: -18px;
575 padding-left: 27px !important;
576 border: medium none rgb(100, 100, 100) !important;
577 border: 1px solid #b0b0b0 !important;
578 color: #646464 !important;
579 background: #e6e6e6 url("../images/computer.png") no-repeat scroll 7px 1px !important;
580 -webkit-box-shadow: none !important;
581 box-shadow: none !important;
582 text-shadow: none!important;
583 font-family: "Open Sans",sans-serif;
584 font-weight: 700;
585 -webkit-transition: all 0.3s ease 0s;
586 transition: all 0.3s ease 0s;
587 }
588
589 .computer-btn:hover {
590 padding-left: 27px !important;
591 border: 1px solid #2f8cea !important;
592 color: white !important;
593 background: #2f8cea url("../images/computer.png") no-repeat scroll 7px -36px !important;
594 -webkit-box-shadow: 0 1px 0 rgba(171, 171, 171, 0.5) inset, 0 1px 0 rgba(0, 0, 0, 0.15) !important;
595 -webkit-box-shadow: none !important;
596 box-shadow: 0 1px 0 rgba(171, 171, 171, 0.5) inset, 0 1px 0 rgba(0, 0, 0, 0.15) !important;
597 box-shadow: none !important;
598 -webkit-transition: all 0.3s ease 0s;
599 -webkit-transition: all 0.3s ease;
600 transition: all 0.3s ease 0s;
601 transition: all 0.3s ease;
602 }
603
604 .from-web {
605 margin-top: 0;
606 margin-bottom: 15px !important;
607 }
608
609 .from-web-btn {
610 padding-left: 25px !important;
611 border: medium none #646464 !important;
612 border: 1px solid #b0b0b0 !important;
613 color: #646464 !important;
614 background: #e6e6e6 url("../images/web.png") no-repeat scroll 7px 1px !important;
615 -webkit-box-shadow: none !important;
616 box-shadow: none !important;
617 font-family: "Open Sans",sans-serif;
618 font-weight: 700;
619 -webkit-transition: all 0.3s ease 0s;
620 transition: all 0.3s ease 0s;
621 /*margin-left: 2px !important;*/
622 }
623
624 .from-web-btn:hover {
625 padding-left: 25px !important;
626 /*margin-left: 2px !important;*/
627 border: 1px solid #89b158 !important;
628 color: white !important;
629 background: #89b158 url("../images/web.png") no-repeat scroll 7px -38px !important;
630 -webkit-box-shadow: none !important;
631 box-shadow: none !important;
632 -webkit-transition: all 0.3s ease 0s;
633 -webkit-transition: all 0.3s ease;
634 transition: all 0.3s ease 0s;
635 transition: all 0.3s ease;
636 }
637
638 .preview {
639 width: 100%;
640 }
641
642 #sidebar > ul > div.initial-screen > div {
643 padding: 0 20px;
644 }
645
646 .from-chart-btn {
647 padding-left: 25px !important;
648 border: medium none #646464 !important;
649 border: 1px solid #b0b0b0 !important;
650 color: #646464 !important;
651 background: #e6e6e6 url("../images/from_chart.png") no-repeat scroll 7px 1px !important;
652 -webkit-box-shadow: none !important;
653 box-shadow: none !important;
654 font-family: "Open Sans",sans-serif;
655 font-weight: 700;
656 -webkit-transition: all 0.3s ease 0s;
657 transition: all 0.3s ease 0s;
658 /*margin-left: 2px !important;
659 margin-top: 2px !important;*/
660 }
661
662 .from-chart-btn:hover {
663 padding-left: 25px !important;
664 /*margin-left: 2px !important;*/
665 border: 1px solid #10aecb !important;
666 color: white !important;
667 background: #10aecb url("../images/from_chart.png") no-repeat scroll 7px -36px !important;
668 -webkit-box-shadow: none !important;
669 box-shadow: none !important;
670 -webkit-transition: all 0.3s ease 0s;
671 -webkit-transition: all 0.3s ease;
672 transition: all 0.3s ease 0s;
673 transition: all 0.3s ease;
674 /*margin-top: 2px !important;*/
675 }
676
677 input#existing-chart {
678 /*left: 18px;
679 width: 110px;
680 position: relative;*/
681 }
682
683 select#chart-id {
684 float: right;
685 width: 146px;
686 margin-right: 14px;
687 }
688
689 button#editor-chart-button {
690 display: block;
691 margin: 0 auto;
692 border: 1px solid #2c80d6 !important;
693 color: white !important;
694 background-color: #2f8cea !important;
695 -webkit-box-shadow: none !important;
696 box-shadow: none !important;
697 text-shadow: none;
698 -webkit-transition: all 0.3s ease;
699 transition: all 0.3s ease;
700 }
701
702 .preview-btn {
703 border: 1px solid #2c80d6 !important;
704 color: white !important;
705 background-color: #2f8cea !important;
706 -webkit-box-shadow: none !important;
707 box-shadow: none !important;
708 font-family: "Open Sans",sans-serif;
709 font-weight: 700;
710 -webkit-transition: all 0.3s ease;
711 transition: all 0.3s ease;
712 }
713
714 .preview-btn:hover {
715 border: 1px solid #2c80d6 !important;
716 color: white !important;
717 background-color: #2c80d6 !important;
718 -webkit-box-shadow: none !important;
719 box-shadow: none !important;
720 font-family: "Open Sans",sans-serif;
721 font-weight: 700;
722 -webkit-transition: all 0.3s ease;
723 transition: all 0.3s ease;
724 }
725
726 .show-live-btn {
727 width: 100%;
728 margin-top: 15px !important;
729 border-color: #e98b00 !important;
730 background-color: #f90 !important;
731 -webkit-box-shadow: none !important;
732 box-shadow: none !important;
733 font-family: "Open Sans",sans-serif;
734 font-weight: 700;
735 }
736
737 .show-live-btn:hover {
738 width: 100%;
739 margin-top: 15px !important;
740 border-color: #e98b00 !important;
741 background-color: #ea8c00 !important;
742 -webkit-box-shadow: none !important;
743 box-shadow: none !important;
744 font-family: "Open Sans",sans-serif;
745 font-weight: 700;
746 -webkit-transition: all 0.3s ease;
747 transition: all 0.3s ease;
748 }
749
750 .check-pro-btn {
751 display: block;
752 width: 245px;
753 height: 40px;
754 margin: 0 auto;
755 }
756
757 .advanced-settings-btn,
758 .return-settings-btn {
759 display: block;
760 height: auto;
761 margin: 0 auto;
762 margin-top: 5px;
763 margin-bottom: 20px;
764 border-radius: 3px;
765 font-size: 17px;
766 line-height: 34px;
767 cursor: pointer;
768 }
769
770 .return-settings-btn {
771 width: 90%;
772 }
773
774 .advanced-settings-btn {
775 width: 100%;
776 }
777
778 .return-settings-btn {
779 margin: 10px auto;
780 }
781
782 .hidden-setting {
783 display: none;
784 }
785
786 /* ====== RESPONSIVE ====== */
787
788 @media (max-width: 1366px) {
789 #rate-stars {
790 margin: 3px 0 10px 40%;
791 }
792
793 .rate-the-plugin {
794 margin-left: -8%;
795 }
796 }
797
798 @media screen and (max-width: 782px) {
799 .button.button-primary.file-wrapper.computer-btn,
800 #remote-file,
801 #existing-chart {
802 height: 28px;
803 margin-bottom: 4px;
804 padding: 0 10px 1px;
805 font-size: 13px;
806 line-height: 26px;
807 vertical-align: middle;
808 }
809 }
810
811 #vz-chart-settings h2:hover,
812 #vz-chart-review a:hover {
813 text-decoration: underline;
814 }
815
816 #vz-chart-review a {
817 color: #00a0d2;
818 text-decoration: none;
819 }
820
821 #vz-chart-settings h2,
822 #vz-chart-review h2 {
823 padding: 0;
824 border: none;
825 font-size: 12px;
826 font-weight: 400;
827 }
828
829 #vz-chart-review {
830 right: 0;
831 bottom: 40px;
832 -webkit-box-sizing: border-box;
833 box-sizing: border-box;
834 width: 50%;
835 padding-right: 20px;
836 text-align: right;
837 }
838
839 #vz-chart-settings.bottom-fixed h2 {
840 padding-left: 20px;
841 }
842
843 #vz-chart-settings {
844 bottom: 40px;
845 left: 0;
846 -webkit-box-sizing: border-box;
847 box-sizing: border-box;
848 width: 50%;
849 text-align: left;
850 }
851
852 #vz-chart-review,
853 #vz-chart-settings h2 {
854 display: inline;
855 color: #00a0d2;
856 background: none;
857 font-family: "Open Sans",sans-serif;
858 cursor: pointer;
859 }
860
861 #vz-chart-settings {
862 display: inline;
863 background: none;
864 cursor: pointer;
865 }
866
867 #vz-chart-source > ul,
868 #vz-chart-settings > ul {
869 position: relative;
870 z-index: 10;
871 border-bottom: 1px solid #ddd;
872 }
873
874 #vz-chart-copyright {
875 bottom: 10px;
876 text-align: center;
877 }
878
879 #sidebar {
880 border-left: 1px solid #ddd;
881 background: #f3f3f3;
882 }
883
884 #vz-chart-settings.open h2 {
885 position: absolute;
886 bottom: 28px;
887 left: 20px;
888 }
889
890 #vz-chart-settings.open .group-header {
891 display: block;
892 }
893
894 #vz-chart-settings .group-header {
895 display: none;
896 }
897
898 #vz-csv-file-form,
899 #vz-one-time-import,
900 #vz-schedule-import,
901 .edit-data-content {
902 text-align: center;
903 }
904
905 #csv-file {
906 margin: 15px 0;
907 padding: 0;
908 }
909
910 .visualizer-input,
911 .visualizer-select {
912 width: 100%;
913 margin: 0 0 15px;
914 }
915
916 .group .dashicons-lock {
917 display: none;
918 }
919
920 .only-pro-feature .dashicons-lock {
921 display: inline;
922 }
923
924 .section-title .dashicons,
925 .group-title .dashicons {
926 width: 18px;
927 height: 18px;
928 margin-left: 3px;
929 font-size: 18px;
930 }
931
932 .only-pro-feature input,
933 .only-pro-feature button,
934 .only-pro-feature select {
935 cursor: not-allowed !important;
936 pointer-events: none;
937 }
938
939 .only-pro-feature > div {
940 position: relative;
941 }
942
943 .only-pro-content {
944 position: absolute;
945 top: 0;
946 bottom: 0;
947 left: 0;
948 width: 100%;
949 opacity: 0;
950 background: rgba(253,253,253,0.9);
951 -webkit-transition: 0.5s ease;
952 transition: 0.5s ease;
953 }
954
955 .only-pro-feature:hover .only-pro-content {
956 opacity: 1;
957 }
958
959 .only-pro-container {
960 display: table;
961 width: 100%;
962 height: 100%;
963 }
964
965 .only-pro-inner {
966 display: table-cell;
967 vertical-align: middle;
968 }
969
970 .only-pro-content p {
971 margin: 0 0 15px;
972 font-size: 14px;
973 font-weight: 700;
974 }
975
976 .only-pro-content a {
977 display: inline-block;
978 padding: 7px 12px;
979 color: #fff;
980 background: #ff595e;
981 font-weight: 600;
982 text-decoration: none;
983 text-transform: uppercase;
984 -webkit-transition: 0.1s ease;
985 transition: 0.1s ease;
986 }
987
988 .only-pro-content a:hover {
989 background: #ce484c;
990 }
991
992 #sidebar::-webkit-scrollbar {
993 width: 4px;
994 }
995
996 #sidebar::-webkit-scrollbar-thumb {
997 background: #999;
998 }
999