PluginProbe ʕ •ᴥ•ʔ
Spider Elements – Premium Elementor Widgets & Addons Library / 1.6.4
Spider Elements – Premium Elementor Widgets & Addons Library v1.6.4
trunk 1.0.0 1.1.0 1.5.0 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 1.6.6 1.6.7 1.7.0 1.8.0 1.9.0
spider-elements / assets / css / admin.css
spider-elements / assets / css Last commit date
admin.css 1 year ago admin.css.map 1 year ago elementor-editor.css 1 year ago extension.css 1 year ago extension.css.map 1 year ago main.css 1 year ago main.css.map 1 year ago rtl.css 1 year ago rtl.css.map 1 year ago
admin.css
1405 lines
1 /*=====================================================================
2 @Template Name: Spider Elements
3
4 @Default Styles
5 Table of Content:
6 01/ Notice
7
8 =====================================================================*/
9 .spider-elements-elementor-notice {
10 padding: 15px !important;
11 }
12 .spider-elements-elementor-notice .spider-elements-elementor-notice-inner {
13 display: flex;
14 justify-content: space-between;
15 align-items: center;
16 }
17 .spider-elements-elementor-notice .spider-elements-elementor-notice-inner .spider-elements-elementor-notice-content h3 {
18 margin: 0;
19 }
20 .spider-elements-elementor-notice .spider-elements-elementor-notice-inner .spider-elements-elementor-install-now .button {
21 padding: 6px 16px;
22 line-height: 1;
23 }
24
25 .ezd-grid {
26 display: grid;
27 grid-column-gap: 20px;
28 }
29
30 .ezd-grid-cols-12 {
31 grid-template-columns: repeat(12, minmax(0, 1fr));
32 }
33
34 .ezd-grid-column-full {
35 grid-column: 1/-1;
36 }
37
38 @media (max-width: 991px) {
39 [class^=ezd-lg-col] {
40 grid-column: 1/-1;
41 }
42 }
43 @media (min-width: 576px) {
44 .ezd-sm-col-4 {
45 grid-column: span 4/span 4;
46 }
47 .ezd-sm-col-3 {
48 grid-column: span 3/span 3;
49 }
50 .ezd-sm-col-5 {
51 grid-column: span 5/span 5;
52 }
53 .ezd-sm-col-6 {
54 grid-column: span 6/span 6;
55 }
56 .ezd-sm-col-7 {
57 grid-column: span 7/span 7;
58 }
59 .ezd-sm-col-8 {
60 grid-column: span 8/span 8;
61 }
62 .ezd-sm-col-9 {
63 grid-column: span 9/span 9;
64 }
65 .ezd-sm-col-10 {
66 grid-column: span 10/span 10;
67 }
68 .ezd-sm-col-2 {
69 grid-column: span 2/span 2;
70 }
71 .ezd-sm-col-11 {
72 grid-column: span 11/span 11;
73 }
74 .ezd-sm-col-12 {
75 grid-column: span 12/span 12;
76 }
77 }
78 @media (min-width: 768px) {
79 .ezd-md-col-4 {
80 grid-column: span 4/span 4;
81 }
82 .ezd-md-col-3 {
83 grid-column: span 3/span 3;
84 }
85 .ezd-md-col-5 {
86 grid-column: span 5/span 5;
87 }
88 .ezd-md-col-6 {
89 grid-column: span 6/span 6;
90 }
91 .ezd-md-col-7 {
92 grid-column: span 7/span 7;
93 }
94 .ezd-md-col-8 {
95 grid-column: span 8/span 8;
96 }
97 .ezd-md-col-9 {
98 grid-column: span 9/span 9;
99 }
100 .ezd-md-col-10 {
101 grid-column: span 10/span 10;
102 }
103 .ezd-md-col-11 {
104 grid-column: span 11/span 11;
105 }
106 .ezd-md-col-12 {
107 grid-column: span 12/span 12;
108 }
109 .ezd-md-col-2 {
110 grid-column: span 2/span 2;
111 }
112 }
113 @media (min-width: 992px) {
114 .ezd-lg-col-4 {
115 grid-column: span 4/span 4;
116 }
117 .ezd-lg-col-3 {
118 grid-column: span 3/span 3;
119 }
120 .ezd-lg-col-5 {
121 grid-column: span 5/span 5;
122 }
123 .ezd-lg-col-6 {
124 grid-column: span 6/span 6;
125 }
126 .ezd-lg-col-8 {
127 grid-column: span 8/span 8;
128 }
129 .ezd-lg-col-7 {
130 grid-column: span 7/span 7;
131 }
132 .ezd-lg-col-9 {
133 grid-column: span 9/span 9;
134 }
135 .ezd-lg-col-10 {
136 grid-column: span 10/span 10;
137 }
138 .ezd-lg-col-11 {
139 grid-column: span 11/span 11;
140 }
141 .ezd-lg-col-12 {
142 grid-column: span 12/span 12;
143 }
144 .ezd-lg-col-2 {
145 grid-column: span 2/span 2;
146 }
147 }
148 @media (min-width: 1200px) {
149 .ezd-xl-col-4 {
150 grid-column: span 4/span 4;
151 }
152 .ezd-xl-col-3 {
153 grid-column: span 3/span 3;
154 }
155 .ezd-xl-col-5 {
156 grid-column: span 5/span 5;
157 }
158 .ezd-xl-col-6 {
159 grid-column: span 6/span 6;
160 }
161 .ezd-xl-col-8 {
162 grid-column: span 8/span 8;
163 }
164 .ezd-xl-col-7 {
165 grid-column: span 7/span 7;
166 }
167 .ezd-xl-col-9 {
168 grid-column: span 9/span 9;
169 }
170 .ezd-xl-col-10 {
171 grid-column: span 10/span 10;
172 }
173 .ezd-xl-col-11 {
174 grid-column: span 11/span 11;
175 }
176 .ezd-xl-col-12 {
177 grid-column: span 12/span 12;
178 }
179 .ezd-xl-col-2 {
180 grid-column: span 2/span 2;
181 }
182 }
183 .ezd-list-unstyled {
184 list-style: none;
185 margin: 0;
186 padding-left: 0;
187 }
188
189 .ezd-text-center {
190 text-align: center;
191 }
192
193 .ezd-d-flex {
194 display: flex;
195 flex-wrap: wrap;
196 margin-left: -10px;
197 margin-right: -10px;
198 }
199 .ezd-d-flex [class*=ezd-colum-space-] {
200 padding-left: 10px;
201 padding-right: 10px;
202 }
203
204 .ezd-colum-space-6 {
205 width: 50%;
206 }
207
208 .ezd-colum-space-4 {
209 flex: 1;
210 width: 33.3333333333%;
211 box-sizing: border-box;
212 }
213
214 .spel_dashboard {
215 display: flex;
216 flex-wrap: wrap;
217 padding: 60px 20px;
218 margin-right: 20px;
219 }
220 @media (max-width: 1400px) {
221 .spel_dashboard {
222 padding: 40px 0;
223 }
224 }
225 .spel_dashboard .sidebar_navigation {
226 width: 18%;
227 margin-right: 30px;
228 }
229 .spel_dashboard .sidebar_navigation .sticky_sidebar {
230 background: #fff;
231 align-items: flex-start;
232 border-radius: 8px;
233 position: sticky;
234 top: 70px;
235 }
236 .spel_dashboard .sidebar_navigation .tab_left_content {
237 padding: 0;
238 margin: 0;
239 border-radius: 8px;
240 overflow: hidden;
241 }
242 .spel_dashboard .sidebar_navigation .tab_left_content li {
243 margin: 0;
244 }
245 .spel_dashboard .sidebar_navigation .tab_left_content li .icon {
246 background: #f0e9fc;
247 border-radius: 50%;
248 width: 35px;
249 height: 35px;
250 display: flex;
251 justify-content: center;
252 align-items: center;
253 margin-right: 12px;
254 color: #571fb7;
255 }
256 @media (max-width: 1400px) {
257 .spel_dashboard .sidebar_navigation .tab_left_content li .icon {
258 margin-right: 5px;
259 }
260 }
261 .spel_dashboard .sidebar_navigation .tab_left_content li .icon i {
262 font-size: 18px;
263 }
264 .spel_dashboard .sidebar_navigation .tab_left_content li:nth-child(2) .icon {
265 color: #ff70ee;
266 background: #fff0fe;
267 }
268 .spel_dashboard .sidebar_navigation .tab_left_content li:nth-child(3) .icon {
269 color: #1fb75c;
270 background: #e4fbd2;
271 }
272 .spel_dashboard .sidebar_navigation .tab_left_content li:nth-child(4) .icon {
273 color: #ff70ee;
274 background: #fff0fe;
275 }
276 .spel_dashboard .sidebar_navigation .tab_left_content li:nth-child(5) .icon {
277 color: #ffa30d;
278 background: #fbebd2;
279 }
280 .spel_dashboard .sidebar_navigation .tab_left_content li:nth-child(6) .icon {
281 color: #fb7f49;
282 background: #ffe9e2;
283 }
284 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link {
285 text-decoration: none;
286 }
287 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link:hover .tab_menu_contents {
288 background: #faf6ff;
289 }
290 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link .tab_menu_contents {
291 display: flex;
292 align-items: center;
293 padding: 18px 25px;
294 transition: all 0.3s linear;
295 }
296 @media (max-width: 1400px) {
297 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link .tab_menu_contents {
298 padding: 16px 10px;
299 }
300 }
301 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link .tab_menu_contents .content h3 {
302 margin-top: 0;
303 font-size: 18px;
304 font-weight: 500;
305 line-height: 24px;
306 color: #0c0d0e;
307 font-family: "Roboto", sans-serif;
308 margin-bottom: 2px;
309 }
310 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link .tab_menu_contents .content p {
311 margin-bottom: 0;
312 font-family: "Inter", sans-serif;
313 font-size: 14px;
314 font-weight: 400;
315 color: #6a737c;
316 line-height: 22px;
317 margin-top: 0;
318 }
319 @media (max-width: 1400px) {
320 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link .tab_menu_contents .content p {
321 font-size: 13px;
322 }
323 }
324 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link.active .tab_menu_contents {
325 background: linear-gradient(90deg, #7460ff 0%, #9d70ff 100%);
326 }
327 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link.active .tab_menu_contents .icon {
328 background: #fff;
329 color: #571fb7;
330 }
331 .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link.active .tab_menu_contents .content h3, .spel_dashboard .sidebar_navigation .tab_left_content .tab-menu-link.active .tab_menu_contents .content p {
332 color: #fff;
333 }
334 .spel_dashboard .tab_contents {
335 flex: 1;
336 max-width: 1200px;
337 }
338 .spel_dashboard .tab_contents .tab-box {
339 display: none;
340 }
341 .spel_dashboard .tab_contents .tab-box.active {
342 display: block;
343 opacity: 1;
344 }
345 .spel_dashboard .tab_contents .tab-box .support_item {
346 background: #fff;
347 border-radius: 8px;
348 padding: 40px;
349 margin-top: 20px;
350 }
351 .spel_dashboard .tab_contents .tab-box .support_item .icon {
352 width: 56px;
353 height: 56px;
354 background: rgba(240, 233, 252, 0.7411764706);
355 border-radius: 50%;
356 font-size: 24px;
357 color: #411789;
358 display: flex;
359 align-items: center;
360 justify-content: center;
361 margin-bottom: 20px;
362 }
363 .spel_dashboard .tab_contents .tab-box .support_item .dashboard_title {
364 margin-bottom: 15px;
365 }
366 .spel_dashboard .tab_contents .tab-box .support_item p {
367 font-size: 16px;
368 font-family: "Inter", sans-serif;
369 color: #535a60;
370 line-height: 32px;
371 margin-top: 0;
372 margin-bottom: 25px;
373 }
374 .spel_dashboard .tab_contents .tab-box .support_item.dashboard_img {
375 background: transparent;
376 padding-top: 10px;
377 padding-bottom: 10px;
378 }
379 .spel_dashboard .tab_contents .tab-box .support_item .note {
380 background: rgba(240, 233, 252, 0.5098039216);
381 padding: 12px 30px;
382 margin-top: 10px;
383 }
384 .spel_dashboard .tab_contents .tab-box .support_item .note p {
385 margin-bottom: 0;
386 font-size: 12px;
387 color: #2f3337;
388 font-family: "Inter", sans-serif;
389 line-height: 26px;
390 }
391 .spel_dashboard .tab_contents .tab-box .filter_content .element_right .link a img {
392 width: 12px;
393 height: 12px;
394 }
395 .spel_dashboard .tab_contents .dashboard_btn {
396 text-decoration: none;
397 padding: 15px 26px;
398 font-size: 16px;
399 font-weight: 500;
400 color: #524cff;
401 font-family: "Roboto", sans-serif;
402 border-radius: 4px;
403 border: 1px solid #524cff;
404 display: inline-block;
405 transition: all 0.3s;
406 cursor: pointer;
407 }
408 .spel_dashboard .tab_contents .dashboard_btn.save_btn {
409 color: #fff;
410 background: #6d27e5;
411 padding: 12px 24px;
412 }
413 .spel_dashboard .tab_contents .dashboard_btn.save_btn:hover {
414 background: #524cff;
415 }
416 .spel_dashboard .tab_contents .dashboard_btn:hover {
417 background: #524cff;
418 color: #fff;
419 }
420 .spel_dashboard .tab_contents .dashboard_banner {
421 background: url(../images/dashboard/dashboard_banner.png) no-repeat scroll center 0/cover;
422 padding: 60px 50px;
423 border-radius: 12px;
424 overflow: hidden;
425 }
426 .spel_dashboard .tab_contents .dashboard_banner.text-center {
427 text-align: center;
428 }
429 .spel_dashboard .tab_contents .dashboard_banner h2 {
430 color: #fff;
431 font-size: 36px;
432 font-weight: 700;
433 line-height: 1.1;
434 font-family: "Roboto", sans-serif;
435 margin-top: 0;
436 margin-bottom: 16px;
437 }
438 .spel_dashboard .tab_contents .dashboard_banner p {
439 font-family: "Inter", sans-serif;
440 color: #fff;
441 font-size: 16px;
442 line-height: 1.8;
443 margin-bottom: 0;
444 }
445 .spel_dashboard .tab_contents .widget_progress_item {
446 border-radius: 8px;
447 padding: 30px 40px;
448 background: #fff;
449 margin-top: 25px;
450 }
451 .spel_dashboard .tab_contents .widget_progress_item h3 {
452 margin: 0 0 10px;
453 font-size: 20px;
454 line-height: 28px;
455 font-weight: 600;
456 font-family: "Roboto", sans-serif;
457 color: #0c0d0e;
458 }
459 .spel_dashboard .tab_contents .widget_progress_item .progress_info_list {
460 display: flex;
461 justify-content: center;
462 margin-top: 6px;
463 }
464 .spel_dashboard .tab_contents .widget_progress_item .progress_info_list li {
465 font-size: 10px;
466 color: #6a737c;
467 font-family: "Roboto", sans-serif;
468 font-weight: 400;
469 margin-bottom: 0;
470 }
471 .spel_dashboard .tab_contents .widget_progress_item .progress_info_list li + li {
472 margin-left: 20px;
473 }
474 .spel_dashboard .tab_contents .widget_progress_item svg.radial-progress {
475 height: auto;
476 max-width: 130px;
477 padding: 0.5em;
478 transform: rotate(90deg);
479 }
480 .spel_dashboard .tab_contents .widget_progress_item svg.radial-progress circle {
481 fill: transparent;
482 stroke: #fff;
483 stroke-dashoffset: 219.9114857513;
484 stroke-width: 10px;
485 }
486 .spel_dashboard .tab_contents .widget_progress_item svg.radial-progress circle.incomplete {
487 opacity: 0.25;
488 }
489 .spel_dashboard .tab_contents .widget_progress_item svg.radial-progress circle.complete {
490 stroke-dasharray: 219.9114857513;
491 }
492 .spel_dashboard .tab_contents .widget_progress_item .circle_progress {
493 position: relative;
494 }
495 .spel_dashboard .tab_contents .widget_progress_item .circle_progress text {
496 color: #02a4ff;
497 font-size: 30px;
498 font-weight: 600;
499 text-anchor: middle;
500 font-family: "Roboto", sans-serif;
501 left: 50%;
502 top: 50%;
503 transform: translate(-50%, -50%);
504 position: absolute;
505 }
506 .spel_dashboard .tab_contents .widget_progress_item svg.radial-progress circle.complete {
507 stroke: #6bccfe;
508 stroke-linecap: round;
509 }
510 .spel_dashboard .tab_contents .widget_progress_item svg.radial-progress circle.incomplete {
511 stroke: #4fbaf0;
512 }
513 .spel_dashboard .tab_contents .dashboard_title {
514 font-size: 22px;
515 color: #031933;
516 font-weight: 700;
517 font-family: "Roboto", sans-serif;
518 line-height: 1.1;
519 margin-top: 0;
520 margin-bottom: 20px;
521 }
522 .spel_dashboard .tab_contents .premium_banner {
523 background: url(../images/dashboard/premium_banner.jpg) no-repeat scroll center 0/cover;
524 position: relative;
525 padding: 66px;
526 }
527 .spel_dashboard .tab_contents .premium_banner h2 {
528 font-size: 24px;
529 font-weight: 600;
530 margin-bottom: 12px;
531 }
532 .spel_dashboard .tab_contents .premium_banner p {
533 font-size: 14px;
534 font-weight: 500;
535 line-height: 24px;
536 margin-top: 0;
537 max-width: 405px;
538 margin-left: auto;
539 margin-right: auto;
540 }
541 .spel_dashboard .tab_contents .premium_banner .banner_btn {
542 color: #fff;
543 font-size: 14px;
544 font-weight: 500;
545 font-family: "Inter", sans-serif;
546 text-decoration: underline;
547 display: inline-block;
548 margin-top: 15px;
549 }
550 .spel_dashboard .tab_contents .premium_banner .rocket_img {
551 position: absolute;
552 top: 50%;
553 right: 100px;
554 transform: translateY(-50%);
555 }
556 .spel_dashboard .tab_contents .requirement_list li {
557 font-size: 14px;
558 font-family: "Roboto", sans-serif;
559 color: #535a60;
560 display: flex;
561 align-items: center;
562 margin-bottom: 0;
563 padding: 16px 24px;
564 background: #f5f5f5;
565 }
566 .spel_dashboard .tab_contents .requirement_list li strong {
567 font-size: 16px;
568 font-weight: 500;
569 color: #2f3337;
570 flex: 40%;
571 }
572 .spel_dashboard .tab_contents .requirement_list li span {
573 flex: 60%;
574 }
575 .spel_dashboard .tab_contents .requirement_list li span.invalid i {
576 background: #e9336b;
577 }
578 .spel_dashboard .tab_contents .requirement_list li i {
579 font-size: 8px;
580 width: 24px;
581 height: 24px;
582 display: inline-flex;
583 align-items: center;
584 justify-content: center;
585 background: #4caf50;
586 border-radius: 3px;
587 color: #fff;
588 margin-right: 12px;
589 }
590 .spel_dashboard .tab_contents .requirement_list li:nth-child(even) {
591 background: #fafafa;
592 }
593 .spel_dashboard .tab_contents .elements_pro_popup {
594 display: none;
595 position: fixed;
596 z-index: 9;
597 left: 0;
598 top: 0;
599 height: 100%;
600 width: 100%;
601 overflow: auto;
602 background-color: rgba(0, 0, 0, 0.6);
603 opacity: 1;
604 -webkit-transition: opacity 0.3s ease-in-out;
605 transition: opacity 0.3s ease-in-out;
606 }
607 .spel_dashboard .tab_contents .elements_pro_popup .message_content {
608 position: fixed;
609 top: 50%;
610 left: 50%;
611 z-index: 10001;
612 min-width: 300px;
613 padding: 50px 36px;
614 background: #fff;
615 border-radius: 10px;
616 text-align: center;
617 -webkit-animation: hide-popup 0.3s forwards;
618 animation: hide-popup 0.3s forwards;
619 text-align: center;
620 }
621 .spel_dashboard .tab_contents .elements_pro_popup .message_content .pro-close {
622 position: absolute;
623 right: 20px;
624 top: 20px;
625 cursor: pointer;
626 }
627 .spel_dashboard .tab_contents .elements_pro_popup .message_content h3 {
628 font-size: 28px;
629 font-family: "Roboto", sans-serif;
630 color: #242729;
631 font-weight: 700;
632 margin-bottom: 12px;
633 }
634 .spel_dashboard .tab_contents .elements_pro_popup .message_content p {
635 font-size: 16px;
636 font-weight: 500;
637 font-family: "Inter", sans-serif;
638 margin-top: 0;
639 }
640 .spel_dashboard .tab_contents .elements_pro_popup .message_content .dashboard_btn {
641 padding: 15px 27px;
642 margin-top: 8px;
643 }
644 .spel_dashboard .tab_contents .elements_pro_popup.popup-visible {
645 opacity: 1;
646 display: block;
647 }
648 .spel_dashboard .tab_contents .elements_pro_popup.popup-visible .message_content {
649 animation: show-popup 0.3s forwards;
650 }
651
652 @-webkit-keyframes show-popup {
653 0% {
654 -webkit-transform: translate(-50%, -50%) scale(0.7);
655 transform: translate(-50%, -50%) scale(0.7);
656 opacity: 0;
657 }
658 45% {
659 -webkit-transform: translate(-50%, -50%) scale(1.05);
660 transform: translate(-50%, -50%) scale(1.05);
661 opacity: 1;
662 }
663 80% {
664 -webkit-transform: translate(-50%, -50%) scale(0.95);
665 transform: translate(-50%, -50%) scale(0.95);
666 }
667 100% {
668 -webkit-transform: translate(-50%, -50%) scale(1);
669 transform: translate(-50%, -50%) scale(1);
670 }
671 }
672 @keyframes show-popup {
673 0% {
674 -webkit-transform: translate(-50%, -50%) scale(0.7);
675 transform: translate(-50%, -50%) scale(0.7);
676 opacity: 0;
677 }
678 45% {
679 -webkit-transform: translate(-50%, -50%) scale(1.05);
680 transform: translate(-50%, -50%) scale(1.05);
681 opacity: 1;
682 }
683 80% {
684 -webkit-transform: translate(-50%, -50%) scale(0.95);
685 transform: translate(-50%, -50%) scale(0.95);
686 }
687 100% {
688 -webkit-transform: translate(-50%, -50%) scale(1);
689 transform: translate(-50%, -50%) scale(1);
690 }
691 }
692 @-webkit-keyframes hide-popup {
693 0% {
694 -webkit-transform: translate(-50%, -50%) scale(1);
695 transform: translate(-50%, -50%) scale(1);
696 opacity: 1;
697 }
698 100% {
699 -webkit-transform: translate(-50%, -50%) scale(0.5);
700 transform: translate(-50%, -50%) scale(0.5);
701 opacity: 0;
702 }
703 }
704 @keyframes hide-popup {
705 0% {
706 -webkit-transform: translate(-50%, -50%) scale(1);
707 transform: translate(-50%, -50%) scale(1);
708 opacity: 1;
709 }
710 100% {
711 -webkit-transform: translate(-50%, -50%) scale(0.5);
712 transform: translate(-50%, -50%) scale(0.5);
713 opacity: 0;
714 }
715 }
716 .spel_dashboard {
717 /*============ qa_inner css ===============*/
718 }
719 .spel_dashboard .tab_contents .elements_tab_menu {
720 display: flex;
721 justify-content: space-between;
722 background: #fff;
723 padding: 24px;
724 border-radius: 5px;
725 }
726 .spel_dashboard .tab_contents .elements_tab_menu .tab_contents {
727 display: flex;
728 align-items: center;
729 transition: all 0.3s linear;
730 }
731 .spel_dashboard .tab_contents .elements_tab_menu .tab_contents .icon {
732 color: #fff;
733 border-radius: 50%;
734 width: 35px;
735 height: 35px;
736 display: flex;
737 justify-content: center;
738 align-items: center;
739 margin-right: 12px;
740 font-size: 18px;
741 background: linear-gradient(90deg, #7460ff 0%, #9d70ff 100%);
742 }
743 .spel_dashboard .tab_contents .elements_tab_menu .tab_contents .content h3 {
744 margin-top: 0;
745 font-size: 18px;
746 font-weight: 600;
747 line-height: 27px;
748 color: #0c0d0e;
749 font-family: "Roboto", sans-serif;
750 margin-bottom: 2px;
751 }
752 .spel_dashboard .tab_contents .elements_tab_menu .tab_contents.api_title_color .icon {
753 background: #fff0fe;
754 color: #ff70ee;
755 }
756 .spel_dashboard .tab_contents .elements_tab_menu .tab_contents.integration_title_color .icon {
757 background: #fbebd2;
758 color: #ffa30d;
759 }
760 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content {
761 display: flex;
762 align-items: center;
763 }
764 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content .plugin_active_switcher {
765 display: flex;
766 font-size: 12px;
767 font-family: "Roboto", sans-serif;
768 font-weight: 400;
769 color: #242729;
770 }
771 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content .plugin_active_switcher .toggler {
772 cursor: pointer;
773 }
774 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content .plugin_active_switcher input {
775 display: none;
776 }
777 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content .plugin_active_switcher input:checked + .switch {
778 background: #7fb71f;
779 }
780 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content .plugin_active_switcher input:checked + .switch::before {
781 transform: translateX(12px);
782 }
783 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content .plugin_active_switcher .switch {
784 width: 32px;
785 height: 18px;
786 background: #848d95;
787 border-radius: 45px;
788 position: relative;
789 display: block;
790 margin: 0 20px;
791 }
792 .spel_dashboard .tab_contents .elements_tab_menu .menu_right_content .plugin_active_switcher .switch::before {
793 width: 12px;
794 height: 12px;
795 border-radius: 50%;
796 content: "";
797 position: absolute;
798 background: #fff;
799 top: 3px;
800 left: 4px;
801 transition: all 0.2s;
802 }
803 .spel_dashboard .tab_contents .elements_tab_menu .dashboard_btn {
804 border: 0;
805 padding: 8px 21px;
806 font-size: 16px;
807 margin-left: 40px;
808 cursor: pointer;
809 }
810 .spel_dashboard .tab_contents .elements_tab {
811 background: #faf6ff;
812 padding: 15px 24px;
813 display: flex;
814 margin: 32px 0;
815 gap: 5px;
816 border-radius: 5px;
817 }
818 .spel_dashboard .tab_contents .elements_tab .filter_data {
819 font-size: 14px;
820 font-family: "Roboto", sans-serif;
821 color: #535a60;
822 padding: 10px 23px;
823 border-radius: 4px;
824 transition: all 0.3s;
825 cursor: pointer;
826 }
827 .spel_dashboard .tab_contents .elements_tab .filter_data:hover {
828 background: #e9dffa;
829 }
830 .spel_dashboard .tab_contents .elements_tab .filter_data i {
831 margin-right: 5px;
832 }
833 .spel_dashboard .tab_contents .elements_tab .filter_data.active {
834 background: #6d27e5;
835 color: #fff;
836 }
837 .spel_dashboard .tab_contents .element_box {
838 padding: 30px 25px;
839 border-radius: 8px;
840 background: #fff;
841 transition: all 0.2s linear;
842 }
843 .spel_dashboard .tab_contents .element_box:hover {
844 box-shadow: 0 5px 15px 0 rgba(51, 77, 114, 0.1);
845 }
846 .spel_dashboard .tab_contents .element_box:hover .element_right .link {
847 opacity: 1;
848 visibility: visible;
849 }
850 .spel_dashboard .tab_contents .element_box .element_right {
851 display: flex;
852 align-items: center;
853 }
854 .spel_dashboard .tab_contents .element_box .element_right a {
855 margin-right: 8px;
856 display: inline-block;
857 line-height: 1;
858 }
859 .spel_dashboard .tab_contents .element_box .element_right .link {
860 margin-right: 5px;
861 opacity: 0;
862 visibility: hidden;
863 transition: all 0.3s linear;
864 }
865 .spel_dashboard .tab_contents .element_box .element_right .link .tooltip-top {
866 position: relative;
867 display: inline-block;
868 text-decoration: none;
869 }
870 .spel_dashboard .tab_contents .element_box .element_right .link .tooltip-top::before {
871 content: attr(data-tooltip);
872 top: -40px;
873 left: -20px;
874 transform: translateX(-50%);
875 background-color: #333;
876 color: #fff;
877 text-align: center;
878 border-radius: 6px;
879 padding: 8px 8px;
880 opacity: 0;
881 visibility: hidden;
882 transition: opacity 0.2s;
883 position: absolute;
884 width: 190px;
885 }
886 .spel_dashboard .tab_contents .element_box .element_right .link .tooltip-top:hover::before {
887 opacity: 1;
888 visibility: visible;
889 }
890 .spel_dashboard .tab_contents .filter_content {
891 margin-left: -12px;
892 margin-right: -12px;
893 }
894 .spel_dashboard .tab_contents .filter_content .element_switch {
895 display: flex;
896 justify-content: space-between;
897 align-items: center;
898 position: relative;
899 overflow: hidden;
900 }
901 .spel_dashboard .tab_contents .filter_content .element_switch .badge {
902 width: 64px;
903 height: 64px;
904 text-align: center;
905 border-radius: 5px;
906 color: #fff;
907 position: absolute;
908 left: -36px;
909 top: -36px;
910 font-size: 12px;
911 font-family: "Roboto", sans-serif;
912 cursor: pointer;
913 background: #e9336b;
914 -webkit-transform: rotate(-45deg);
915 transform: rotate(-45deg);
916 text-transform: uppercase;
917 padding: 3px;
918 display: flex;
919 align-items: flex-end;
920 justify-content: center;
921 font-weight: 700;
922 }
923 .spel_dashboard .tab_contents .filter_content .element_switch .element_content {
924 font-size: 14px;
925 font-weight: 400;
926 font-family: "Roboto", sans-serif;
927 display: flex;
928 align-items: center;
929 }
930 .spel_dashboard .tab_contents .filter_content .element_switch .element_content i {
931 font-size: 32px;
932 color: #000000;
933 margin-right: 20px;
934 }
935 .spel_dashboard .tab_contents .filter_content .element_switch input {
936 display: none;
937 }
938 .spel_dashboard .tab_contents .filter_content .element_switch input:checked + .widget_switcher {
939 background: #7fb71f;
940 }
941 .spel_dashboard .tab_contents .filter_content .element_switch input:checked + .widget_switcher:before {
942 transform: translateX(19px);
943 }
944 .spel_dashboard .tab_contents .filter_content .element_switch .widget_switcher {
945 width: 40px;
946 height: 20px;
947 background: #848d95;
948 border-radius: 45px;
949 position: relative;
950 display: block;
951 }
952 .spel_dashboard .tab_contents .filter_content .element_switch .widget_switcher::before {
953 content: "";
954 width: 14px;
955 height: 14px;
956 border-radius: 50%;
957 left: 4px;
958 top: 3px;
959 position: absolute;
960 background: #fff;
961 transition: all 0.2s linear;
962 }
963 .spel_dashboard .tab_contents .filter_content .pro .badge {
964 position: relative;
965 }
966 .spel_dashboard .tab_contents .filter_content .pro .badge::before {
967 content: "Pro";
968 width: 62px;
969 height: 62px;
970 text-align: center;
971 border-radius: 5px;
972 color: #fff;
973 position: absolute;
974 left: -36px;
975 top: -36px;
976 font-size: 10px;
977 cursor: pointer;
978 background: #e9336b;
979 transform: rotate(-45deg);
980 text-transform: uppercase;
981 padding: 3px;
982 display: flex;
983 align-items: flex-end;
984 justify-content: center;
985 font-weight: 700;
986 }
987 .spel_dashboard .api_box {
988 padding: 24px;
989 }
990 .spel_dashboard .api_box h3 {
991 font-size: 16px;
992 font-weight: 600;
993 line-height: 24px;
994 font-family: "Roboto", sans-serif;
995 color: #242729;
996 margin-top: 0;
997 margin-bottom: 6px;
998 }
999 .spel_dashboard .api_box p {
1000 font-size: 12px;
1001 line-height: 18px;
1002 font-weight: 500;
1003 color: #535a60;
1004 font-family: "Inter", sans-serif;
1005 margin-top: 0;
1006 }
1007 .spel_dashboard .api_box .api_panel .api_inner h5 {
1008 font-size: 14px;
1009 font-weight: 500;
1010 line-height: 22px;
1011 color: #242729;
1012 font-family: "Roboto", sans-serif;
1013 margin-bottom: 12px;
1014 margin-top: 0;
1015 }
1016 .spel_dashboard .api_box .api_panel .api_inner input {
1017 width: 100%;
1018 border: 1px solid #bbc0c4;
1019 font-size: 14px;
1020 padding: 4px 10px;
1021 color: #242729;
1022 font-family: "Roboto", sans-serif;
1023 line-height: 30px;
1024 margin: 0;
1025 outline: none;
1026 box-shadow: none;
1027 }
1028 .spel_dashboard .api_box .api_panel .api_inner input.placeholder {
1029 color: #bbc0c4;
1030 }
1031 .spel_dashboard .api_box .api_panel .api_inner input:-moz-placeholder {
1032 color: #bbc0c4;
1033 }
1034 .spel_dashboard .api_box .api_panel .api_inner input::-moz-placeholder {
1035 color: #bbc0c4;
1036 }
1037 .spel_dashboard .api_box .api_panel .api_inner input::-webkit-input-placeholder {
1038 color: #bbc0c4;
1039 }
1040 .spel_dashboard .api_box .api_panel .api_inner input:focus {
1041 border-color: rgba(109, 39, 229, 0.6901960784);
1042 }
1043 .spel_dashboard .api_box .api_panel p {
1044 font-size: 12px;
1045 font-family: "Inter", sans-serif;
1046 line-height: 20px;
1047 color: #535a60;
1048 margin-top: 10px;
1049 }
1050 .spel_dashboard .api_box .api_panel + .api_panel {
1051 margin-top: 10px;
1052 }
1053 .spel_dashboard .integration_banner {
1054 text-align: left;
1055 padding: 45px;
1056 }
1057 .spel_dashboard .integration_item {
1058 margin-top: 20px;
1059 padding: 40px;
1060 }
1061 .spel_dashboard .integration_item img {
1062 width: 50px;
1063 height: auto;
1064 }
1065 .spel_dashboard .integration_item h3 {
1066 font-size: 18px;
1067 font-weight: 600;
1068 font-family: "Roboto", sans-serif;
1069 color: #0c0d0e;
1070 margin-top: 12px;
1071 margin-bottom: 10px;
1072 line-height: 1.3;
1073 }
1074 .spel_dashboard .integration_item p {
1075 font-size: 14px;
1076 color: #3c4146;
1077 line-height: 26px;
1078 font-family: "Inter", sans-serif;
1079 margin-bottom: 0;
1080 margin-top: 0;
1081 }
1082 .spel_dashboard .integration_item .dashboard_btn {
1083 padding: 9px 32px;
1084 margin-top: 25px;
1085 }
1086 .spel_dashboard .integration_item .dashboard_btn.active_btn {
1087 background: #848d95;
1088 cursor: not-allowed;
1089 }
1090 .spel_dashboard .integration_item .dashboard_btn.active_btn:hover {
1091 box-shadow: none;
1092 }
1093 .spel_dashboard .mt-25 {
1094 margin-top: 25px;
1095 }
1096 .spel_dashboard .pr_promo_box {
1097 background: #fff;
1098 border-radius: 8px;
1099 padding: 16px 16px 30px;
1100 margin-top: 25px;
1101 }
1102 .spel_dashboard .pr_promo_box h2 {
1103 font-weight: 700;
1104 font-size: 28px;
1105 color: #242729;
1106 font-family: "Roboto", sans-serif;
1107 margin-bottom: 18px;
1108 }
1109 .spel_dashboard .pr_promo_box p {
1110 font-size: 18px;
1111 line-height: 28px;
1112 color: #535a60;
1113 font-family: "Inter", sans-serif;
1114 margin-top: 0;
1115 }
1116 .spel_dashboard .pr_promo_box .demo_btn {
1117 font-size: 14px;
1118 font-weight: 500;
1119 color: #e9336b;
1120 font-family: "Inter", sans-serif;
1121 text-decoration: none;
1122 }
1123 .spel_dashboard .pr_promo_box .demo_btn i {
1124 margin-left: 4px;
1125 transition: all 0.2s linear;
1126 }
1127 .spel_dashboard .pr_promo_box .demo_btn:hover i {
1128 transform: translateX(5px);
1129 }
1130 .spel_dashboard .pr_promo_box .promo_video {
1131 background: #6d27e5;
1132 border-radius: 4px;
1133 padding: 12px;
1134 position: relative;
1135 }
1136 .spel_dashboard .pr_promo_box .promo_video img {
1137 width: 100%;
1138 border-radius: 4px;
1139 }
1140 .spel_dashboard .pr_promo_box .promo_video .popup_youtube {
1141 position: absolute;
1142 width: 40px;
1143 background: #fff;
1144 filter: drop-shadow(0 30px 60px rgba(0, 0, 0, 0.12));
1145 text-align: center;
1146 line-height: 38px;
1147 color: #0c0d0e;
1148 font-size: 18px;
1149 border-radius: 50%;
1150 height: 40px;
1151 top: 50%;
1152 left: 50%;
1153 transform: translate(-50%, -50%);
1154 border: 0;
1155 transition: all 0.3s;
1156 display: flex;
1157 align-items: center;
1158 justify-content: center;
1159 }
1160 .spel_dashboard .pr_promo_box .promo_video .popup_youtube::before, .spel_dashboard .pr_promo_box .promo_video .popup_youtube:after {
1161 content: "";
1162 width: 100%;
1163 height: 100%;
1164 border: 1.2px solid #fff;
1165 border-radius: 50%;
1166 opacity: 0.3;
1167 position: absolute;
1168 left: 50%;
1169 top: 50%;
1170 }
1171 .spel_dashboard .pr_promo_box .promo_video .popup_youtube::before {
1172 transform: translate(-50%, -50%) scale(1.32);
1173 }
1174 .spel_dashboard .pr_promo_box .promo_video .popup_youtube:after {
1175 border-radius: 50%;
1176 box-shadow: 0 1px 15px 1px rgba(255, 255, 255, 0.3);
1177 transform: scale(8);
1178 animation: spel_pulse 2s infinite;
1179 }
1180 .spel_dashboard .pr_promo_box .promo_video .popup_youtube:hover {
1181 transform: translate(-50%, -50%) scale(1.02);
1182 }
1183 .spel_dashboard .qa_inner {
1184 border-radius: 12px;
1185 background: #fff;
1186 padding: 48px 56px;
1187 flex-wrap: nowrap;
1188 align-items: start;
1189 }
1190 .spel_dashboard .qa_inner img {
1191 margin-right: 25px;
1192 }
1193 .spel_dashboard .qa_inner h2 {
1194 font-size: 24px;
1195 font-weight: 600;
1196 font-family: "Roboto", sans-serif;
1197 margin-bottom: 15px;
1198 color: #0c0d0e;
1199 }
1200 .spel_dashboard .qa_inner p {
1201 font-size: 16px;
1202 line-height: 32px;
1203 color: #2f3337;
1204 margin-top: 0;
1205 }
1206 .spel_dashboard .fancybox-slide--iframe .fancybox-content,
1207 .spel_dashboard .fancybox-slide--map .fancybox-content,
1208 .spel_dashboard .fancybox-slide--pdf .fancybox-content,
1209 .spel_dashboard .fancybox-slide--video .fancybox-content {
1210 width: 55%;
1211 height: 50%;
1212 }
1213
1214 .ezd-colum-space-4 {
1215 margin-bottom: 20px;
1216 }
1217
1218 /*============ keyframes animation =============*/
1219 @-webkit-keyframes spel_pulse {
1220 0% {
1221 opacity: 1;
1222 -webkit-transform: translate(-50%, -50%) scale(1);
1223 transform: translate(-50%, -50%) scale(1);
1224 }
1225 100% {
1226 opacity: 0;
1227 -webkit-transform: translate(-50%, -50%) scale(2);
1228 transform: translate(-50%, -50%) scale(2);
1229 }
1230 }
1231 @keyframes spel_pulse {
1232 0% {
1233 opacity: 1;
1234 -webkit-transform: translate(-50%, -50%) scale(1);
1235 transform: translate(-50%, -50%) scale(1);
1236 }
1237 100% {
1238 opacity: 0;
1239 -webkit-transform: translate(-50%, -50%) scale(2);
1240 transform: translate(-50%, -50%) scale(2);
1241 }
1242 }
1243 #spel_theme_builder_modal {
1244 display: none;
1245 position: fixed;
1246 top: 0;
1247 left: 0;
1248 width: 100%;
1249 height: 100%;
1250 background: rgba(0, 0, 0, 0.5);
1251 backdrop-filter: blur(5px);
1252 z-index: 9999;
1253 opacity: 0;
1254 visibility: hidden;
1255 transition: opacity 0.3s ease, visibility 0.3s ease;
1256 }
1257 #spel_theme_builder_modal.show-popup {
1258 opacity: 1;
1259 visibility: visible;
1260 }
1261
1262 .spel_theme_builder_wrapper.spel-modal.spel-fade {
1263 transition: opacity 0.15s linear;
1264 }
1265 .spel_theme_builder_wrapper.spel-modal .modal-dialog {
1266 width: 500px;
1267 margin: 0 auto;
1268 position: absolute;
1269 top: 50%;
1270 left: 50%;
1271 transform: translate(-50%, -50%);
1272 display: flex;
1273 align-items: center;
1274 transition: all 0.3s ease;
1275 }
1276 .spel_theme_builder_wrapper.spel-modal .modal-dialog.modal-dialog-centered {
1277 display: flex;
1278 align-items: center;
1279 min-height: calc(100% - 1rem);
1280 }
1281 .spel_theme_builder_wrapper.spel-modal form {
1282 width: 100%;
1283 }
1284 .spel_theme_builder_wrapper.spel-modal form .modal-content {
1285 position: relative;
1286 background-color: #fff;
1287 border: 1px solid #ccc;
1288 border-radius: 0.3rem;
1289 box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
1290 }
1291 .spel_theme_builder_wrapper.spel-modal form .modal-content.show-popup {
1292 opacity: 1;
1293 transform: scale(1);
1294 }
1295 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-title {
1296 margin: 0;
1297 line-height: 1.5;
1298 }
1299 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-close {
1300 background: transparent;
1301 border: none;
1302 font-size: 20px;
1303 cursor: pointer;
1304 }
1305 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-close:hover {
1306 color: red;
1307 }
1308 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-header,
1309 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-footer {
1310 display: flex;
1311 justify-content: space-between;
1312 align-items: center;
1313 padding: 15px;
1314 border-bottom: 1px solid #e9ecef;
1315 }
1316 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-footer {
1317 border-top: 1px solid #e9ecef;
1318 }
1319 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-body {
1320 position: relative;
1321 flex: 1 1 auto;
1322 padding: 1rem;
1323 }
1324 .spel_theme_builder_wrapper.spel-modal form .modal-content .modal-body .input-group {
1325 margin-bottom: 1rem;
1326 }
1327 .spel_theme_builder_wrapper.spel-modal form .modal-content .form-control {
1328 display: block;
1329 width: 100%;
1330 padding: 0.375rem 0.75rem;
1331 font-size: 1rem;
1332 line-height: 1.5;
1333 color: #495057;
1334 background-color: #fff;
1335 background-clip: padding-box;
1336 border: 1px solid #ced4da;
1337 border-radius: 0.25rem;
1338 transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
1339 }
1340 .spel_theme_builder_wrapper.spel-modal form .modal-content .btn.btn-default {
1341 color: #333;
1342 background-color: #fff;
1343 border-color: #ccc;
1344 }
1345 .spel_theme_builder_wrapper.spel-modal form .modal-content .btn.btn-default:hover {
1346 color: #333;
1347 background-color: #e6e6e6;
1348 border-color: #adadad;
1349 }
1350 .spel_theme_builder_wrapper.spel-modal form .modal-content .btn.btn-primary {
1351 color: #fff;
1352 background-color: #007bff;
1353 border-color: #007bff;
1354 }
1355 .spel_theme_builder_wrapper.spel-modal form .modal-content .btn.btn-primary:hover {
1356 color: #fff;
1357 background-color: #0056b3;
1358 border-color: #004085;
1359 }
1360 .spel_theme_builder_wrapper.spel-modal form .modal-content .switch-group {
1361 display: flex;
1362 align-items: center;
1363 }
1364 .spel_theme_builder_wrapper.spel-modal form .modal-content .switch-group .admin-input-switch {
1365 position: relative;
1366 display: inline-block;
1367 width: 50px;
1368 height: 25px;
1369 }
1370 .spel_theme_builder_wrapper.spel-modal form .modal-content .switch-group .admin-input-switch input {
1371 opacity: 0;
1372 width: 0;
1373 height: 0;
1374 }
1375 .spel_theme_builder_wrapper.spel-modal form .modal-content .switch-group .admin-input-switch .admin-control-label {
1376 position: absolute;
1377 cursor: pointer;
1378 top: 0;
1379 left: 0;
1380 right: 0;
1381 bottom: 0;
1382 background-color: #ccc;
1383 transition: 0.4s;
1384 border-radius: 25px;
1385 }
1386 .spel_theme_builder_wrapper.spel-modal form .modal-content .switch-group .admin-input-switch .admin-control-label:before {
1387 position: absolute;
1388 content: "";
1389 height: 21px;
1390 width: 21px;
1391 left: 2px;
1392 bottom: 2px;
1393 background-color: white;
1394 transition: 0.4s;
1395 border-radius: 50%;
1396 }
1397 .spel_theme_builder_wrapper.spel-modal form .modal-content .switch-group .admin-input-switch input:checked + .admin-control-label {
1398 background-color: #2196F3;
1399 }
1400 .spel_theme_builder_wrapper.spel-modal form .modal-content .switch-group .admin-input-switch input:checked + .admin-control-label:before {
1401 transform: translateX(25px);
1402 }
1403
1404 /*# sourceMappingURL=admin.css.map */
1405