PluginProbe ʕ •ᴥ•ʔ
Flex Import / 2.4
Flex Import v2.4
2.9 trunk 1.2 1.3 1.4 1.5 1.6 1.7 1.8 1.9 2.0 2.1 2.2 2.3 2.4 2.5 2.6 2.7 2.8
flex-import / assets / css / admin-style.css
flex-import / assets / css Last commit date
admin-style.css 10 months ago dashboard-banner.css 10 months ago fleximp-license-style.css 10 months ago
admin-style.css
1755 lines
1
2 @font-face {
3 font-family: 'Segoe UI Bold';
4 src: url('../font/Segoe UI Bold.ttf') format('truetype');
5 font-style: normal;
6 font-stretch: normal;
7 font-display: swap;
8 }
9 @font-face {
10 font-family: 'Segoe UI';
11 src: url('../font/Segoe UI.ttf') format('truetype');
12 font-style: normal;
13 font-stretch: normal;
14 font-display: swap;
15 }
16 @font-face {
17 font-family: 'Segoe UI Semibold';
18 src: url('../font/Segoe UI Semibold.ttf') format('truetype');
19 }
20
21
22
23 .fleximp-setup-card {
24 background: #fff;
25 border: 1px solid #ddd;
26 padding: 20px;
27 margin-top: 20px;
28 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
29 border-radius: 5px;
30 }
31 .fleximp-setup-card p {
32 font-size: 14px;
33 color: #444;
34 }
35 .fleximp-setup-card .button-primary {
36 background-color: #0073aa;
37 border-color: #0073aa;
38 color: #fff;
39 text-decoration: none;
40 }
41 .fleximp-card-nav {
42 margin-bottom: 15px;
43 gap: 10px;
44 }
45 .fleximp-card-button {
46 max-width: 180px;
47 width: 100%;
48 font-size: 14px;
49 font-family: sans-serif;
50 font-weight: 600;
51 margin-right: 5px;
52 cursor: pointer;
53 }
54 .fleximp-card-content {
55 margin-top: 20px;
56 padding: 15px;
57 border-radius: 5px;
58 background-color: #0000;
59 text-align: center;
60 }
61 .fleximp-card-content {
62 margin-top: 0px;
63 }
64 #fleximp-start-now {
65 padding: 5px 20px;
66 font-size: 16px;
67 margin-top: 20px;
68 }
69 .fleximp-card-all #fleximp-next-step,
70 .fleximp-card-all button#fleximp-import-pages-data,
71 .fleximp-card-all .fleximp-btn-wrapper button#fleximp-start-import,
72 .fleximp-card-all button#fleximp-install-plugins {
73 padding: 0px 30px;
74 font-size: 16px;
75 border-radius: 6px;
76 background: #fff;
77 color: #2271b1;
78 border: 2px solid #2271b1;
79 font-size: 17px !important;
80 }
81 #fleximp-start-import {
82 padding: 5px 20px;
83 font-size: 16px;
84 margin-top: 20px;
85 }
86 button#fleximp-import-pages-data {
87 margin-bottom: 10px;
88 }
89 button.button {
90 border: 1px solid #2271b1;
91 }
92 .fleximp-card p {
93 font-size: 16px;
94 }
95 .fleximp-card-nav {
96 display: flex;
97 justify-content: center;
98 margin-bottom: 0px;
99 align-items: center;
100 padding: 20px 0px;
101 }
102 .fleximp-loader {
103 border: 4px solid #f3f3f3;
104 border-top: 4px solid #3498db;
105 border-radius: 50%;
106 width: 40px;
107 height: 40px;
108 animation: spin 2s linear infinite;
109 margin: 20px auto;
110 }
111 @keyframes spin {
112 0% {
113 transform: rotate(0deg);
114 }
115 100% {
116 transform: rotate(360deg);
117 }
118 }
119 /* demo import modal */
120 .fleximp-btn-wrapper button#fleximp-start-import {
121 margin: 0px;
122 }
123 .fleximp-btn-wrapper {
124 display: flex;
125 align-items: center;
126 justify-content: center;
127 gap: 0px 10px;
128 }
129 .fleximp-card-header {
130 display: flex;
131 align-items: center;
132 background: #fff;
133 padding: 10px 20px;
134 box-sizing: border-box;
135 margin: 0 auto 0 auto;
136 justify-content: center;
137 border-bottom: 1px solid #ccc;
138 font-size: 25px;
139 line-height: 20px;
140 height: 80px;
141 font-family: inherit;
142 }
143 button.fleximp-card-button span {
144 width: 13px;
145 height: 13px;
146 display: inline-block;
147 background: #a7aaad;
148 border-radius: 50%;
149 }
150 button.button {
151 font-size: 18px !important;
152 }
153 .fleximp-card-content p {
154 font-size: 18px;
155 font-weight: 500;
156 }
157 .fleximp-card-content input[type="text"] {
158 width: 100%;
159 height: 50px;
160 font-size: 20px;
161 text-align: center;
162 margin-top: 20px;
163 }
164 .fleximp-card-content input[type="text"] {
165 width: 100%;
166 height: 50px;
167 font-size: 20px;
168 text-align: center;
169 margin-top: 20px;
170 border: 1px solid rgba(44, 51, 56, 0.5);
171 color: #000;
172 }
173 form#fleximp_license_form {
174 max-width: 500px;
175 margin: 0px auto;
176 }
177 form#fleximp_license_form label {
178 font-size: 18px;
179 }
180 button.fleximp-card-button.active span {
181 background: #2271b1;
182 }
183 .card-inner {
184 box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
185 }
186 .plugin-item {
187 display: flex;
188 align-items: center;
189 justify-content: space-between;
190 gap: 0px 10px;
191 padding: 10px;
192 }
193 .plugin-item h4 {
194 margin: 0px 0px;
195 }
196 .plugin-item:nth-child(odd) {
197 background: #2271b142;
198 }
199 .fleximp-card-header h2 {
200 color: #2271b1;
201 font-size: 24px;
202 }
203 div#required-plugins-list {
204 max-width: 65%;
205 margin: 0px auto;
206 }
207 button.fleximp-card-button.active {
208 color: #2271b1;
209 }
210 button#fleximp-import-pages-data {
211 padding: 5px 20px;
212 }
213 .fleximp-card {
214 position: relative;
215 min-width: 255px;
216 background: #0000;
217 max-width: 70%;
218 margin: 50px auto 0px;
219 }
220 .fleximp-card-content {
221 padding: 25px 15px;
222 border: 1px solid #ccc;
223 border-radius: 5px;
224 background-color: #fff;
225 border: none;
226 text-align: center;
227 }
228 #fleximp-install-elementor {
229 padding: 6px 20px;
230 font-size: 16px;
231 }
232 .fleximp-card-nav {
233 display: flex;
234 justify-content: center;
235 padding: 29px 0px 0px;
236 margin: 0px;
237 }
238 .plugin-item h4 {
239 font-size: 16px;
240 font-weight: 400;
241 }
242 @media (max-width: 991px) {
243 button.fleximp-card-button span {
244 width: 10px;
245 height: 10px;
246 display: inline-block;
247 background: #a7aaad;
248 border-radius: 50%;
249 }
250 .circles > div {
251 width: 40px;
252 top: -10px;
253 left: -10px;
254 }
255 }
256 @media (max-width: 575px) {
257 .fleximp-card-all {
258 width: 90% !important;
259 margin: 0px auto;
260 background: #0000 !important;
261 }
262 .fleximp-card-button {
263 gap: 10px;
264 }
265 .fleximp-card-button {
266 padding: 10px;
267 }
268 div#required-plugins-list {
269 max-width: 100%;
270 margin: 0px auto;
271 }
272 }
273 /* loader */
274 .loader {
275 font-size: 16px;
276 margin-top: 10px;
277 font-weight: bold;
278 color: #555;
279 }
280 .plugin-names p {
281 margin: 5px 0;
282 color: green;
283 }
284 #fleximp-loader {
285 color: #0073aa;
286 font-size: 16px;
287 margin-top: 10px;
288 }
289 .fleximp-card-button svg {
290 width: 30px;
291 height: 30px;
292 margin-bottom: 10px;
293 }
294 .fleximp-card-button svg path {
295 fill: #2cff05 !important;
296 stroke: #2cff05;
297 }
298 .fleximp-card-button {
299 margin-right: 5px;
300 padding: 20px;
301 border: none;
302 border-radius: 6px;
303 text-transform: capitalize;
304 font-size: 13px;
305 margin-top: 0px;
306 background-color: #0000 !important;
307 }
308 .fleximp-card-button {
309 max-width: 180px;
310 width: 100%;
311 display: flex;
312 flex-direction: column;
313 gap: 20px;
314 justify-content: space-between;
315 height: 90px;
316 align-items: center;
317 }
318 .fleximp-card-button {
319 max-width: 180px;
320 width: 100%;
321 }
322 .fleximp-card-all {
323 width: 60%;
324 margin: 0px auto;
325 background: #0000 !important;
326 }
327 /* end */
328 .fleximp-from-btn-wrap {
329 margin: 20px 0px 10px;
330 }
331 .loader {
332 display: inline-block;
333 vertical-align: middle;
334 }
335 .loader img {
336 width: 20px;
337 height: 20px;
338 }
339 /* for notices */
340 .fleximp-card-all .fs-notice.updated {
341 display: none !important;
342 }
343 button.fleximp-card-button.active .circles {
344 visibility: visible;
345 }
346 .circles {
347 height: 10px;
348 width: 10px;
349 position: relative;
350 visibility: hidden;
351 }
352 .circles > div {
353 animation: growAndFade 3s infinite ease-out;
354 background-color: dodgerblue;
355 border-radius: 50%;
356 height: 40px;
357 opacity: 0;
358 position: absolute;
359 width: 40px;
360 top: -13px;
361 left: -13px;
362 }
363 .circles .circle1 {
364 animation-delay: 1s;
365 }
366 .circles .circle2 {
367 animation-delay: 2s;
368 }
369 .circles .circle3 {
370 animation-delay: 3s;
371 }
372 @keyframes growAndFade {
373 0% {
374 opacity: 0.25;
375 transform: scale(0);
376 }
377 100% {
378 opacity: 0;
379 transform: scale(1);
380 }
381 }
382 .loader .spinner-border {
383 width: 1rem;
384 height: 1rem;
385 border: 0.2em solid #007bff; /* Adjust the color as needed */
386 border-top-color: transparent; /* Transparent top to create spinning effect */
387 animation: spin 0.6s linear infinite;
388 }
389 @keyframes spin {
390 0% {
391 transform: rotate(0deg);
392 }
393 100% {
394 transform: rotate(360deg);
395 }
396 }
397 .fleximp-dash-box {
398 padding: 20px;
399 border-radius: 8px;
400 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
401 }
402 .fleximp-dash-box {
403 background-color: #ffffff;
404 padding: 20px;
405 border-radius: 8px;
406 }
407 .flex-nav-tab-links .nav-link.active {
408 color: #ff1f5f !important;
409 background-color: #fff;
410 border-color: none;
411 border: none;
412 }
413 .flex-nav-tab-links .nav-link {
414 font-weight: bold;
415 }
416 .flex-nav-tab-links .nav-link:focus {
417 box-shadow: none;
418 outline: none;
419 }
420 .flex-nav-tab-links .nav-link:hover {
421 border: none;
422 }
423 .flex-nav-tab-links a.nav-link {
424 font-weight: bold;
425 color: #000 !important;
426 border: 0;
427 align-self: center;
428 font: 900 22px / 27px Segoe UI Bold;
429 }
430 .flex-imp-nav-box .nav-tabs .nav-item{
431 margin: 0px;
432 }
433 .flex-imp-nav-box .flex-demo-buttons a{
434 border-radius: 10px !important
435 }
436 .flex-nav-tab-links {
437 border: 0px !important;
438 }
439 .flex-demo-btn {
440 border: 1px solid #707070 !important;
441 border-radius: 10px;
442
443 font-weight: bold !important;
444 }
445 .flex-gap {
446 gap: 130px;
447 }
448 @media screen and (min-width: 753px) and (max-width: 1024px) {
449 .flex-menu-btn {
450 gap: 0px;
451 }
452 .flex-gap {
453 gap: 0px;
454 justify-content: space-evenly;
455 }
456 }
457 .fleximp-dash-box.fleximp-dash-box-4.flex-dashboard-box {
458 background-color: #fff;
459 border: 1px solid;
460 }
461 .flex-dashboard-box {
462 background-color: #fff;
463 padding: 20px;
464 border: 1px solid;
465 border-radius: 8px;
466 box-shadow: none;
467 }
468 h3.flex-support-title {
469 font-size: 18px;
470 color: #000;
471 font-weight: bold;
472 margin: 0;
473 line-height: 18px;
474 align-self: center;
475 font: 900 18px / 25px Segoe UI Bold;
476 }
477 .fleximp-subscription-box h3.flex-support-title,.fleximp-blog-sidebar-main-box h3.flex-support-title {
478 font: 900 22px / 25px Segoe UI Bold;
479 }
480 .flex-support-div.d-flex {
481 gap: 10px;
482 }
483 .flex-contact-btn {
484 border-radius: 5px;
485 color: #000;
486 font-size: 22px;
487 }
488 p.flex-supoort-description {
489 color: #707070;
490 font-size: 18px;
491 font: 900 18px / 25px Segoe UI Semibold;
492 }
493 .subscription-title.text-center {
494 background-color: #ff1f5f;
495 padding: 20px 10px;
496 border-radius: 15px 15px 0px 0px;
497 }
498 .flex-subscription {
499 padding-bottom: 18px;
500 border: 1px solid #707070;
501 border-radius: 15px;
502 }
503 .flex-gap-11 {
504 display: grid;
505 grid-template-columns: auto auto auto;
506 gap: 10px;
507 }
508 .subscription-title h3 {
509 color: #fff;
510 font: normal normal bold 28px / 40px Segoe UI;
511 margin: 0;
512 }
513 p.flex-price {
514 color: #fff;
515 margin: 0px;
516 font: normal normal 600 38px / 50px Segoe UI;
517 }
518 .flex-feature-list {
519 display: flex;
520 gap: 0px;
521 padding: 10px 0px;
522 }
523 p.flex-feature-title.m-0 {
524 font-size: 18px;
525 color: #000;
526 font-weight: 600;
527 text-align: left;
528 align-self: center;
529 font: 900 15px / 20px Segoe UI !important;
530 }
531 .flex-container-1 {
532 border: 1px solid #707070;
533 padding: 16px;
534 border-radius: 10px;
535 }
536 a.nav-link {
537 font-size: 20px;
538 }
539 .flex-demo-btn {
540 font-size: 20px !important;
541 }
542 .flex-dash-plugin-logo {
543 height: 80px;
544 }
545 .flex-dash-plugin-logo img{
546 width: 100%;
547 height: 100%;
548 object-fit: contain;
549 }
550 .flex-container-1 {
551 display: flex;
552 flex-direction: column;
553 justify-content: center;
554 height: fit-content;
555 }
556 .flex-nav-tab-links {
557 gap: 15px;
558 }
559 h3.flex-wp-xyz-theme {
560 font-size: 25px;
561 color: #000;
562 font-weight: bold;
563 font: normal normal bold 25px/33px Segoe UI Bold;
564 }
565 h3.flex-template {
566 font-size: 28px;
567 font-weight: 600;
568 color: #000;
569 font: normal normal 600 28px/33px Segoe UI;
570 }
571 p.flex-content-1 {
572 font-size: 18px;
573 font-weight: 600;
574 color: #707070;
575 font: 900 18px / 25px Segoe UI Semibold;
576 }
577 .flex-dashboard-box .fleximp-dash-box-8{
578 padding: 0px 0px 20px 0px;
579 }
580 .fleximp-dash-box {
581 /* padding: 15px 0px 15px 0px; */
582 border-radius: 8px;
583 box-shadow: none;
584 }
585 .fleximp-subscription-box .fleximp-dash-box {
586 padding: 15px 0px 15px 0px;
587 }
588 .flex-demo-btn:hover {
589 color: #000 !important;
590 text-decoration: none !important;
591 }
592 /* *************video-slider-css******* */
593 .swiper-container-2 {
594 position: relative;
595 width: 100%;
596 margin: auto;
597 overflow: hidden;
598 }
599 .swiper-wrapper {
600 display: flex;
601 }
602 .video-slide {
603 position: relative;
604 cursor: pointer;
605 }
606 .video-image-box{
607 width: 308px;
608 }
609 .video-slide img {
610 width: 100%;
611 height: auto;
612 }
613 .play-icon {
614 position: absolute;
615 top: 0;
616 left: 0;
617 right: 0;
618 bottom: 0;
619 margin: auto;
620 /* width: 60px; */
621 height: fit-content;
622 border-radius: 50%;
623 display: flex;
624 align-items: center;
625 justify-content: center;
626 }
627 .play-icon::before {
628 content: "\25BA"; /* Play icon */
629 color: #ff1f5f;
630 font-size: 30px;
631 }
632 .swiper-container-2 .swiper-button-next::after,
633 .swiper-container-2 .swiper-button-prev::after {
634 font-size: 24px; /* Adjust size */
635 color: white; /* Ensure icon color */
636 font-family: "Swiper Icons"; /* Required for Swiper navigation */
637 }
638 /* Navigation Buttons - Both at Top Right */
639 .swiper-container-2 .swiper-button-next,
640 .swiper-container-2 .swiper-button-prev {
641 position: absolute;
642 top: 10px; /* Adjusted to be at the top */
643 width: 40px;
644 height: 40px;
645 background: #000;
646 color: white;
647 border-radius: 7px;
648 display: flex;
649 align-items: center;
650 justify-content: center;
651 z-index: 10;
652 }
653 .swiper-container-2 .swiper-button-next {
654 right: 10px;
655 }
656 .swiper-container-2 .swiper-button-prev {
657 right: 60px; /* Moved to the right, next to next button */
658 }
659 /* *****************05/04/2025************ */
660 .blog-content {
661 display: flex;
662 gap: 20px;
663 }
664 p.flex-blog-content {
665 font-size: 20px;
666 font-weight: 600;
667 color: #707070;
668 }
669 a.btn.flex-view-more-btn {
670 border: 1px solid #707070;
671 border-radius: 10px;
672 padding: 8px 30px;
673 font-size: 18px;
674 font-weight: 600;
675 font: normal normal 600 18px/24px Segoe UI;
676 }
677 .play-icon::before {
678 content: "\25BA"; /* Play icon */
679 color: #ff1f5f;
680 font-size: 50px;
681 position: relative;
682 /* bottom: 86%; */
683 }
684 .swiper-container-2 .swiper-button-next::after,
685 .swiper-container-2 .swiper-button-prev::after {
686 font-size: 24px; /* Adjust size */
687 color: white; /* Ensure icon color */
688 font-family: "Swiper Icons"; /* Required for Swiper navigation */
689 }
690 .swiper-button-next::after {
691 content: "\003E";
692
693 /* Unicode right arrow → */
694 font-weight: bold;
695 }
696 .swiper-button-prev::after {
697 content: "\003C";
698 /* Unicode left arrow ← */
699 font-weight: bold;
700 }
701 .flex-wp-social-media-icons {
702 display: flex;
703 gap: 15px;
704 align-items: center;
705 }
706 .flex-wp-social-media-icons img {
707 width: 50px;
708 max-width: 45px !important;
709 max-height: 45px !important;
710 }
711 .flex-swipper-nav-btn {
712 display: flex;
713 justify-content: end;
714 gap: 10px;
715 position: absolute;
716 z-index: 1;
717 right: 23px;
718 top: -55px;
719 }
720 .swiper-button-next i, .swiper-button-prev i {
721 font-weight: bold;
722 background: #000;
723 padding: 8px 12px;
724 border-radius: 7px;
725 color: #fff;
726 font-size: 20px;
727 }
728 .swiper-button-next::after,
729 .swiper-button-prev::after {
730 content: none;
731 }
732 p.flex-video-content {
733 color: #707070;
734 font-size: 16px;
735 /* padding-top: 10px; */
736 padding-top: 18px;
737 font-weight: 600;
738 margin: 0;
739 font: 900 18px / 25px Segoe UI Semibold;
740 }
741 .flex-nav-tab-links .nav-link {
742 background-color: #fff !important;
743 }
744 @media screen and (max-width: 575px) {
745 .flex-dashboard-box-1 {
746 margin: 20px 0px;
747 }
748 }
749 @media screen and (min-width: 769px) and (max-width: 991px) {
750 .flex-dashboard-box-1 {
751 margin-top: 0px !important;
752 }
753 }
754 @media screen and (min-width: 1024px) and (max-width: 1199px) {
755 .swiper-container-2 .swiper-slide img {
756 width: 240px;
757 }
758 }
759 @media screen and (min-width: 1200px) and (max-width: 1810px) {
760 .video-slide img {
761 width: 200px;
762 }
763 }
764 @media screen and (max-width: 768px) {
765 .flex-gap-11 {
766 display: block !important;
767 }
768 }
769 /* *************07/04/02025***************** */
770 @media screen and (max-width: 768px) {
771 a.nav-link {
772 font-size: 18px;
773 }
774 .flex-demo-btn {
775 font-size: 18px !important;
776 }
777 img.logo-img {
778 width: 50px;
779 height: 50px;
780 }
781 .flex-demo-buttons {
782 text-align: center;
783 }
784 }
785 @media screen and (max-width: 441px) {
786 a.btn.flex-demo-btn.flex-btn-space {
787 margin-top: 10px;
788 }
789 }
790 @media screen and (min-width: 562px) and (max-width: 768px) {
791 a.nav-link {
792 padding: 5px;
793 }
794 .flex-nav-tab-links {
795 gap: 0px;
796 }
797 }
798 @media screen and (min-width: 769px) and (max-width: 1200px) {
799 .flex-demo-buttons {
800 text-align: center;
801 }
802 a.nav-link {
803 padding: 5px;
804 }
805 .flex-nav-tab-links {
806 gap: 0px;
807 }
808 .flex-demo-btn {
809 font-size: 18px !important;
810 }
811 a.nav-link {
812 font-size: 18px;
813 }
814 }
815 @media screen and (min-width: 769px) and (max-width: 1592px) {
816 .flex-demo-buttons {
817 text-align: center;
818 }
819 a.nav-link {
820 padding: 5px;
821 }
822 .flex-nav-tab-links {
823 gap: 0px;
824 }
825 .flex-demo-btn {
826 font-size: 18px !important;
827 }
828 a.nav-link {
829 font-size: 18px;
830 }
831 }
832 .nav-link svg {
833 width: 20px;
834 }
835 .flex-icons {
836 display: flex;
837 }
838 .nav-link.active svg {
839 fill: #ff1f5f !important;
840 }
841 .nav-link {
842 padding: 0 7px;
843 display: block;
844 }
845 .flex-nav-tab-links {
846 justify-content: space-evenly;
847 }
848 /* ************************template tab css***************** */
849 .widget-social-media {
850 border: 1px solid;
851 padding: 10px;
852 border-radius: 15px 0px 0px 15px;
853 margin-top: 30px;
854 }
855 .templates-imgs img {
856 width: 50px !important;
857 }
858 p.plugin-img {
859 margin: 25px 0px;
860 }
861 button.install-btn {
862 background: #000;
863 color: #fff;
864 padding: 10px 20px;
865 border-radius: 7px;
866 font-size: 24px;
867 font-weight: bold;
868 }
869 .install-btn svg {
870 fill: #fff;
871 width: 27px;
872 }
873 .pagination {
874 justify-content: center;
875 }
876 .grid-item {
877 padding: 0px 0px 15px 0px !important;
878 }
879 .grid-item {
880 background: #fff;
881 border: 1px solid #707070;
882 padding: 15px;
883 text-align: center;
884 border-radius: 8px;
885 box-shadow: none;
886 }
887 .grid-container {
888 display: grid;
889 grid-template-columns: repeat(4, 1fr);
890 gap: 20px;
891 max-width: 100%;
892 margin: auto;
893 }
894 .buttons a {
895 display: inline-block;
896 margin: 5px;
897 padding: 9px 10px;
898 background: none;
899 color: #000000;
900 font-size: 12px;
901 font-weight: 600;
902 border-radius: 4px;
903 text-decoration: none;
904 border: 1px solid #707070 !important;
905 }
906 .buttons {
907 display: flex;
908 }
909
910 a.flex-template-buttons {
911 display: flex;
912 gap: 5px;
913 overflow: hidden;
914 display: -webkit-box;
915 -webkit-box-orient: vertical;
916 -webkit-line-clamp: 1;
917 align-self: center;
918 }
919 a.flex-template-buttons svg {
920 width: 13px;
921 margin-right: 5px;
922 }
923 .import-btn {
924 display: flex !important;
925 gap: 10px;
926 border: 1px solid #707070 !important;
927 }
928 .import-btn svg {
929 width: 12px !important;
930 margin-right: 0px;
931 }
932 p.template-title {
933 font-size: 14px !important;
934 margin: 10px 0px 10px 10px;
935 font-weight: bold;
936 color: #000;
937 white-space: nowrap;
938 overflow: hidden;
939 text-overflow: ellipsis;
940 width: 152px;
941 }
942 .flex-buttons {
943 display: flex;
944 padding: 0px 10px;
945 align-content: center;
946 justify-content: space-between;
947 }
948 .flex-template-categories {
949 font-size: 24px;
950 font-weight: bold;
951 color: #000;
952 }
953 .content input {
954 display: none;
955 }
956 .content {
957 display: flex;
958 }
959 .flex-templates {
960 display: flex;
961 align-content: center;
962 flex-direction: row;
963 align-items: center;
964 gap: 20px;
965 }
966 p.flex-template-title {
967 font-size: 30px;
968 font-weight: bold;
969 margin: 0px;
970 }
971 .flex-templates svg {
972 height: 40px;
973 width: 40px;
974 }
975 input.fname {
976 border: none;
977 }
978 input#flex-templates-search {
979 border: none;
980 }
981 .flex-search.text-right {
982 display: flex;
983 justify-content: flex-end;
984 }
985 .search-flex {
986 border: 1px solid #707070;
987 padding: 10px 15px;
988 border-radius: 15px;
989 }
990 input:focus {
991 box-shadow: 0 0 0 1px #2271b100 !important;
992 }
993 input.fname {
994 width: 389px;
995 font: 400 16px / 16px Segoe UI;
996 }
997 input#flex-templates-search {
998 width: 389px;
999 font: 400 16px / 16px Segoe UI;
1000 }
1001 .grid-container {
1002 display: grid;
1003 grid-template-columns: repeat(4, 1fr);
1004 gap: 20px;
1005 }
1006
1007 .my_grid_container{
1008 grid-template-columns: repeat(3, 1fr);
1009 }
1010
1011
1012 .grid-item {
1013 overflow: hidden;
1014 background: #fff;
1015 border: 1px solid #707070;
1016 background: #fff;
1017
1018 padding: 15px;
1019 text-align: center;
1020 border-radius: 17px;
1021 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
1022 }
1023 .grid-item img {
1024 max-width: 100%;
1025 }
1026 .pagination {
1027 text-align: center;
1028 margin: 30px 0;
1029 }
1030 .pagination a {
1031 margin: 0 6px;
1032 padding: 6px 12px;
1033 color: #eee;
1034 background: #333;
1035 text-decoration: none;
1036 border-radius: 4px;
1037 }
1038 .pagination a.active {
1039 background: #333;
1040 color: #fff;
1041 }
1042 .list {
1043 border: 1px solid #707070;
1044
1045 border-radius: 15px 0px 15px 0px;
1046 }
1047 .list.col-2 {
1048 border: 1px solid #707070;
1049 padding: 20px;
1050 border-radius: 15px 0px 15px 0px;
1051 }
1052 .line {
1053 border-bottom: 1px solid;
1054 margin-top: 13px;
1055 }
1056 .list label {
1057 padding: 0px 20px;
1058 }
1059 @media screen and (max-width: 1366px){
1060 .flex-nav-tab-links a.nav-link {
1061 font-weight: bold;
1062 color: #000 !important;
1063 border: 0;
1064 align-self: center;
1065 font: 900 20px / 20px Segoe UI Bold;
1066 }
1067 }
1068 @media screen and (min-width: 769px) and (max-width: 1199px) {
1069 .grid-container {
1070 grid-template-columns: repeat(2, 1fr) !important;
1071 }
1072 .content .list label {
1073 line-height: 37px;
1074 font-size: 17px;
1075 }
1076 }
1077 @media screen and (min-width: 700px) and (max-width: 768px) {
1078 .grid-container {
1079 grid-template-columns: repeat(2, 1fr) !important;
1080 }
1081 }
1082
1083 @media screen and (min-width: 1200px) and (max-width: 1440px) {
1084 .grid-container {
1085 grid-template-columns: repeat(3, 1fr) !important;
1086 }
1087 .content .list label {
1088 line-height: 36px !important;
1089 font-size: 18px;
1090 }
1091 }
1092 @media screen and (max-width: 767px) {
1093 .content {
1094 display: block !important;
1095 }
1096 .grid-container {
1097 grid-template-columns: repeat(1, 1fr) !important;
1098 }
1099 .flex-search.text-right {
1100 display: block !important;
1101 justify-content: flex-end;
1102 }
1103 }
1104 p.flex-plugin-title {
1105 font-size: 30px;
1106 font-weight: bold;
1107 }
1108
1109 p.flex-plugin-title {
1110 margin: 25px 0px;
1111 }
1112 .plugin-table-head th {
1113 font-size: 20px;
1114 font-weight: bold;
1115 }
1116 .plugin-input input[type="checkbox"] {
1117 width: 30px;
1118 height: 30px;
1119 margin: -67px 0px;
1120 }
1121 .plugin-input input[type="checkbox"]:checked::before {
1122 margin: -0.1875rem 0 0 -0.25rem;
1123 width: 30px !important;
1124 height: 30px !important;
1125 }
1126 .plugin-tbl .table-striped tbody tr:nth-child(odd) {
1127 background-color: transparent;
1128 }
1129 .plugin-tbl .table-striped tbody tr:nth-child(n + 2):nth-child(even) {
1130 background-color: #e8e8e8;
1131 border: 1px solid #ccc;
1132 }
1133 .plugin-img svg {
1134 height: 37px;
1135 }
1136 thead.plugin-table-head {
1137 background: #e8e8e8;
1138 }
1139 .table-responsive-1 {
1140 width: 100%;
1141 overflow-x: auto;
1142 }
1143 /* ********************widget css************ */
1144 .widget-list {
1145 border: 1px solid #707070;
1146 border-radius: 15px 0px 0px 15px;
1147 }
1148 .vt-tab-btn {
1149 padding: 15px;
1150 cursor: pointer;
1151 font-size: 20px;
1152 font-weight: bold;
1153 }
1154 .buttons.widgets-btn {
1155 display: flex;
1156 justify-content: space-evenly;
1157 align-items: center;
1158 }
1159 .vt-tab-btn.vt-active {
1160 color: #ff1f5f;
1161 font-weight: bold;
1162 }
1163 .vt-content-area {
1164 flex: 3;
1165 padding: 20px;
1166 background: white;
1167 border: 1px solid #707070;
1168 border-radius: 0px 15px 15px 0px;
1169 }
1170 .vt-content {
1171 display: none;
1172 }
1173
1174 .vt-content.vt-active {
1175 display: block;
1176 }
1177 .vt-content-area-1 {
1178 border: none;
1179 }
1180 .widgets-btn a:hover {
1181 text-decoration: none;
1182 color: #000;
1183 }
1184 .widgets-btn a:hover {
1185 text-decoration: none;
1186 color: #000;
1187 box-shadow: none;
1188 }
1189
1190 .flex-plugin-title-1 {
1191 font-size: 30px;
1192 font-weight: bold;
1193 vertical-align: middle !important;
1194 }
1195 .flex-align {
1196 vertical-align: middle !important;
1197 }
1198
1199 @media screen and (max-width: 767px) {
1200 .flex-nav-tab-links {
1201 flex-direction: column;
1202 align-content: center;
1203 }
1204 }
1205 @media screen and (min-width: 992px) and (max-width: 1880px) {
1206 .flex-wp-social-media-icons {
1207 display: flex;
1208 gap: 10px;
1209 }
1210 .templates-imgs img {
1211 width: 20px !important;
1212 }
1213 }
1214 /* *****************modal-csss************** */
1215 .flex-model-div-main {
1216 display: flex !important;
1217 gap: 10px;
1218 }
1219 p#modal-template-title {
1220 font-size: 40px;
1221 font-weight: bold;
1222 font: 900 40px / 55px Segoe UI Bold !important;
1223 }
1224 p.flex-modal-content {
1225 font-size: 20px;
1226 font-weight: 400;
1227 color: #707070;
1228 font: 900 18px / 25px Segoe UI Semibold;
1229 }
1230 .flex-plugin-main-file {
1231 display: none;
1232 }
1233 .loader {
1234 width: 15px;
1235 height: 15px;
1236 border: 2px solid #ccc;
1237 border-top: 2px solid #000;
1238 border-radius: 50%;
1239 display: inline-block;
1240 animation: spin 1s linear infinite;
1241 }
1242 .loader-success {
1243 border: 2px solid green;
1244 border-radius: 50%;
1245 display: inline-block;
1246 }
1247 .loader-active {
1248 border: 2px solid blue;
1249 border-radius: 50%;
1250 display: inline-block;
1251 }
1252 @keyframes spin {
1253 0% {
1254 transform: rotate(0deg);
1255 }
1256
1257 100% {
1258 transform: rotate(360deg);
1259 }
1260 }
1261 .import-modal-main {
1262 display: flex;
1263 }
1264 .flex-modal-icons svg {
1265 height: 18px;
1266 width: 18px;
1267 margin-right: 5px;
1268 position: relative;
1269 top: 10px;
1270 }
1271 .flex-insatlling-pluins-title {
1272 font-size: 22px;
1273 font-weight: bold;
1274 }
1275 .flex-modal-icons li {
1276 display: flex;
1277 gap: 5px;
1278 }
1279 .flex-modal-template-mobile-title {
1280 font-size: 40px;
1281 color: #000;
1282 font-weight: bold;
1283 }
1284 .importing-process-title-1 {
1285 font-size: 18px;
1286 font-weight: bold;
1287 }
1288 @media screen and (max-width: 700px) {
1289 .flex-import-modal-step {
1290 width: 350px !important;
1291 }
1292 .import-modal-main {
1293 display: block;
1294 }
1295 p#modal-template-title {
1296 font-size: 20px;
1297 }
1298 .flex-modal-template-mobile-title {
1299 font-size: 20px;
1300 }
1301 .view-btton-div {
1302 flex-direction: column;
1303 }
1304 .flex-model-div-main {
1305 flex-direction: column;
1306 }
1307 }
1308 .flex-import-btn svg {
1309 width: 18px;
1310 height: 18px;
1311 fill: #fff;
1312 margin-left: 7px;
1313 }
1314 button.flex-import-btn {
1315 background-color: #000;
1316 border: none;
1317 font-size: 18px;
1318 font-weight: bold;
1319 font: 900 16px / 25px Segoe UI Bold;
1320 padding: 8px 30px;
1321 border-radius: 6px;
1322 }
1323 #step-done p {
1324 font-size: 38px;
1325 font-weight: bold;
1326 text-align: center;
1327 }
1328 .steps-done {
1329 font-size: 32px;
1330 font-weight: bold;
1331 }
1332 .view-site {
1333 background-color: #000 !important;
1334 color: #fff !important;
1335 border: none !important;
1336 border-radius: 7px !important;
1337 font-size: 15px !important;
1338 font-weight: bold !important;
1339 padding: 4px 13px !important;
1340 }
1341 .view-site svg {
1342 height: 18px;
1343 width: 28px;
1344 fill: #fff;
1345 }
1346 .view-btton-div {
1347 display: flex;
1348 justify-content: center;
1349 gap: 20px;
1350 text-align: center;
1351 }
1352 .flex-template-buttons {
1353 padding: 9px 4px;
1354 }
1355 .import-btn {
1356 padding: 5px 5px;
1357 }
1358 @media screen and (min-width: 1514px) and (max-width: 1528px) {
1359 a.btn.flex-template-buttons {
1360 padding: 8px !important;
1361 }
1362 }
1363 @media screen and (min-width: 1500px) and (max-width: 1513px) {
1364 a.btn.flex-template-buttons {
1365 padding: 9px 6px !important;
1366 }
1367 }
1368 @media screen and (min-width: 1200px) and (max-width: 1484px) {
1369 a.btn.flex-template-buttons {
1370 padding: 4px 16px !important;
1371 }
1372 }
1373 @media screen and (min-width: 992px) and (max-width: 1078px) {
1374 a.btn.flex-template-buttons {
1375 padding: 4px 16px !important;
1376 }
1377 }
1378 @media screen and (min-width: 1448px) and (max-width: 2000px) {
1379 a.btn.flex-template-buttons {
1380 padding: 4px 16px !important;
1381 }
1382 }
1383
1384 /* *********************22/04/2025*********** */
1385 @media screen and (min-width: 1250px) and (max-width: 1600px) {
1386 .templates-imgs img {
1387 width:30px !important;
1388 }
1389 .flex-wp-social-media-icons {
1390
1391 gap: 2px;
1392 }
1393 }
1394
1395 @media screen and (min-width: 992px) and (max-width: 1249px) {
1396 .templates-imgs img {
1397 width:20px !important;
1398 }
1399 .flex-wp-social-media-icons {
1400
1401 gap: 2px;
1402 }
1403 }
1404
1405
1406
1407 h3.flex-categories-list {
1408 font-size: 24px !important;
1409 color: #000;
1410 font-weight: bold;
1411 }
1412 .flex-template-categories-list li {
1413 font-size: 20px;
1414 font-weight: bold;
1415 color: #707070;
1416 padding: 15px 10px;
1417 margin: 0;
1418 cursor: pointer;
1419 }
1420
1421
1422
1423 .flex-template-categories-list li:hover {
1424 color: #ff1f5f;
1425 }
1426
1427 .col-sm-12.col-lg-10.px-md-0.px-lg-2.p-0.pt-md-2.pt-sm-2.grid-container-column {
1428 padding: 0 15px 0 15px !important;
1429 }
1430 .import-btn {
1431 padding: 0px !important;
1432 align-items: center;
1433 }
1434 .flex-template-buttons {
1435 margin: 0px !important;
1436 align-items: center;
1437 padding: 4px 16px !important;
1438 font-weight: 600 !important;
1439 font-size: 16px !important;
1440 }
1441 .flex-gap-div{
1442 gap:4px;
1443 width: 225px;
1444 justify-content: center;
1445 }
1446 .vt-tab-btn{
1447 font-size: 20px;
1448 font-weight: bold;
1449 color:#707070;
1450 }
1451 button.download-btn {
1452 width: 180px;
1453 background-color: #000;
1454 color: #fff;
1455 padding: 10px;
1456 border-radius: 4px;
1457 font-size: 20px;
1458 font-weight: bold;
1459 }
1460 .flex-template-form {
1461 padding-right: 16px;
1462 }
1463 .col-sm-12.col-lg-10.px-md-0.px-lg-2.flex-widgets-display{
1464 padding: 0px 20px !important;
1465 }
1466 .flex-widget-title{
1467 width:auto !important;
1468 }
1469 /* *************23/04/2025********** */
1470 .video-slide {
1471 cursor: pointer;
1472 }
1473 a.plugin-posts {
1474 display: flex;
1475 gap: 20px;
1476 align-items: center;
1477 }
1478 .plugin-item {
1479 background: none !important;
1480 }
1481
1482 a.plugin-posts:hover {
1483 color: #0056b3;
1484 text-decoration: none;
1485 }
1486 .plugin-post-title {
1487 font-size: 17px;
1488 font-weight: 600;
1489 color: #707070;
1490 font: 900 18px / 25px Segoe UI Semibold;
1491 }
1492 .swiper-container-2 .swiper-wrapper {
1493 display: flex;
1494 gap: 50px;
1495 }
1496 .swiper-container-2 .swiper-slide.video-slide {
1497 width: auto !important;
1498 margin: 0px !important;
1499 }
1500 .swiper-container-2 img{
1501 cursor: default;
1502 }
1503 .swiper-container-2 video {
1504 width: 100%;
1505 height: 100%;
1506 position: absolute;
1507 top: 0px;
1508 margin: 0px;
1509 bottom: 10px !important;
1510 }
1511
1512 @media screen and (max-width: 1366px){
1513 .search-flex {
1514 border: 1px solid #707070;
1515 padding: 6px 15px;
1516 border-radius: 10px;
1517 }
1518 }
1519 @media screen and (max-width: 575px){
1520 .flex-swipper-nav-btn{
1521 right: 8px;
1522 }
1523 input#flex-templates-search {
1524 width: 100%;
1525 }
1526 }
1527
1528
1529 #modal-template-mobile-image {
1530 width: 150px;
1531 }
1532
1533 /* for coming soon in widget tab */
1534
1535 .coming-soon {
1536 text-align: center;
1537 padding: 100px 0;
1538 background-color: #f5f5f5;
1539 }
1540
1541 .coming-soon h1 {
1542 font-size: 64px;
1543 font-weight: bold;
1544 color: #333;
1545 }
1546
1547 /* new add */
1548
1549 .fleximp-dash-btn.fleximp-dash-btn-contact.flex-demo-btn.p-2.px-4.flex-contact-btn {
1550 /* font-size: 14px !important; */
1551 border-radius: 8px;
1552 font: 900 14px / 16px Segoe UI Semibold !important;
1553 }
1554 .fleximp-dash-btn.fleximp-dash-btn-review.flex-demo-btn.p-2.px-4.flex-contact-btn {
1555 font-size: 14px !important;
1556 border-radius: 8px;
1557 }
1558
1559
1560
1561
1562
1563
1564
1565 /* home css */
1566 .fleximp-subscription-main-box .flex-feature-list-main{
1567 width: fit-content;
1568 margin: auto;
1569 }
1570 .fleximp-subscription-main-box .flex-feature-list-main .flex-feature-list img{
1571 width: 35px;
1572 }
1573 .fleximp-subscription-main-box .flex-feature-list-main .flex-feature-list {
1574 display: flex;
1575 gap: 5px;
1576 padding: 8px 0px;
1577 }
1578 .fleximp-subscription-main-box .flex-feature-list-main .flex-feature-list .flex-feature-title {
1579 font-size: 16px;
1580 }
1581 .fleximp-subscription-main-box .flex-demo-btn{
1582 padding: 6px 30px;
1583 border-radius: 8px;
1584 font: normal normal 600 18px / 18px Segoe UI !important;
1585 }
1586 .fleximp-subscription-main-box{
1587 gap: 30px;
1588 }
1589 .fleximp-social-box .flex-wp-social-media-icons {
1590 display: flex;
1591 gap: 20px;
1592 }
1593 .fleximp-blog-sidebar-main-box .plugin-item {
1594 padding: 10px 0px
1595 }
1596 .flex-imp-sidebar-image-box {
1597 height: 70px;
1598 width: 150px;
1599 }
1600 .fleximp-blog-sidebar-main-box .plugin-item img{
1601 width: 100%;
1602 height: 100%;
1603 object-fit: cover;
1604 border-radius: 10px;
1605 max-width: unset !important;
1606 max-height: unset !important;
1607 }
1608 .fleximp-dash-box .fleximp-temp-btn{
1609 padding: 12px 20px;
1610 border-radius: 10px;
1611 font: normal normal 600 18px / 24px Segoe UI;
1612 }
1613
1614
1615 /* template */
1616 #wpbody-content .tab-content{
1617 padding: 0px 1%;
1618 }
1619 .fleximp-template-main-box .flex-template-title,.fleximp-widgets-main-box .flex-template-title,.fleximp-plugin-main-box .flex-template-title {
1620 font-size: 22px;
1621 color: #000;
1622 font: 900 24px / 27px Segoe UI Bold;
1623 }
1624 .fleximp-template-main-box .flex-templates svg {
1625 height: 35px;
1626 width: 35px;
1627 }
1628 .fleximp-template-main-box .flex-template-categories-list li{
1629 font-size: 18px;
1630 font: normal normal bold 19px/30px Segoe UI Bold;
1631 }
1632 .fleximp-template-main-box .line {
1633 border-bottom: 1px solid;
1634 margin-top: 0px;
1635 }
1636 .fleximp-template-main-box .flex-template-categories {
1637 font-size: 18px;
1638 align-self: center;
1639 font: normal normal bold 20px/30px Segoe UI Bold;
1640 }
1641 .flex-template-categories-icon{
1642 font-size: 30px;
1643 color: #000000;
1644 }
1645 .fleximp-template-main-box .my_grid_container {
1646 grid-template-columns: repeat(3, 1fr);
1647 }
1648 .fleximp-template-main-box .grid-item {
1649 padding: 0px 0px 0px 0px !important;
1650 }
1651 .btn.flex-template-buttons:hover {
1652 background: transparent linear-gradient(90deg, #A279B6 0%, #465BA9 100%) 0% 0% no-repeat padding-box;
1653 color: white;
1654 }
1655 .btn.flex-template-buttons:hover svg {
1656 fill: white;
1657 }
1658 .fleximp-template-main-box p.template-title {
1659 font-size: 14px !important;
1660 /* margin: 10px 0px 10px 10px; */
1661 font-weight: bold;
1662 color: #000;
1663 white-space: nowrap;
1664 overflow: hidden;
1665 text-overflow: ellipsis;
1666 width: 200px;
1667 margin: 0;
1668 text-align: start;
1669 font: 900 16px / 26px Segoe UI Bold !important;
1670 }
1671 #plugins-list .table thead th {
1672 font: 900 22px / 20px Segoe UI Bold;
1673 }
1674 .fleximp-template-main-box .flex-wp-social-media-icons > img{
1675 width: 50px !important;
1676 margin-right: 20px;
1677 }
1678 .fleximp-template-main-box .flex-wp-social-media-icons img{
1679 width: 40px !important;
1680 gap: 20px !important;
1681 }
1682
1683 /* plugin tab */
1684 .fleximp-plugin-main-box .table tr td:nth-child(1){
1685 display: block !important;
1686 margin: 14px 0px;
1687 border: none !important;
1688 }
1689 .fleximp-plugin-main-box .flex-plugin-title{
1690 color: #000 !important;
1691 }
1692 .fleximp-plugin-main-box .flex-plugin-title {
1693 margin: 14px 0px;
1694 }
1695 .fleximp-plugin-main-box .flex-plugin-title {
1696 font-size: 18px;
1697 font-weight: bold;
1698 font: 900 19px / 20px Segoe UI Bold;
1699 }
1700 .fleximp-plugin-main-box td {
1701 font-size: 18px;
1702 font: 900 19px / 20px Segoe UI Bold;
1703 }
1704 .fleximp-plugin-main-box button.download-btn {
1705 width: 180px;
1706 background-color: #000;
1707 color: #fff;
1708 padding: 10px;
1709 border-radius: 4px;
1710 font-size: 16px;
1711 font-weight: bold;
1712 }
1713 .fleximp-plugin-main-box button.install-btn {
1714 font-size: 18px;
1715 }
1716
1717 .fleximp-template-main-box .fleximp-temp-buttons{
1718 padding: 10px
1719 }
1720
1721
1722 /* video add */
1723 .video-container {
1724 /* position: absolute; */
1725 top: 0;
1726 bottom: 0;
1727 height: 100%;
1728 width: 100%;
1729 left: 0;
1730 right: 0;
1731 }
1732 /* end */
1733
1734 /* .video-container .video-iframe-wrapper {
1735 height: 180px;
1736 } */
1737
1738 .video-iframe-wrapper{
1739 height: 100%;
1740 }
1741
1742 /* new add for */
1743 #categories-list .category-item.active {
1744 /* background-color: #ff1f5f; */
1745 color: #ff1f5f;
1746 font-weight: bold;
1747 border-radius: 4px;
1748 }
1749
1750 .no-templates-message {
1751 text-align: center;
1752 padding: 40px;
1753 font-size: 18px;
1754 color: #999;
1755 }