PluginProbe
Forumax – AI Powered Advanced Community Forum Plugin / 1.3.2
Forumax – AI Powered Advanced Community Forum Plugin v1.3.2
2.4.4 2.4.3 2.4.2 2.4.1 2.4.0 trunk 1.0.8 1.1.0 1.2.1 1.2.2 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.4.0 1.4.1 2.0.0 2.1.0 All 29 releases
bbp-core / assets / frontend / css / el-widgets.css

el-widgets.css in Forumax – AI Powered Advanced Community Forum Plugin 1.3.2, at assets/frontend/css/el-widgets.css

1,916 lines 42.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*----------------------------------------------------
2 @File: Default Styles
3
4 This file contains the styling for the actual template, this
5 is the file you need to edit to change the look of the
6 template.
7 ---------------------------------------------------- */
8 /*=====================================================================
9 @Template Name: Ama
10
11 @Default Styles
12 Table of Content:
13 01/ Variables
14 92/ Predefine
15 03/ forumPosts
16 04/ forum
17 05/ forums
18
19
20 =====================================================================*/
21 :root {
22 --rob: "Roboto", sans-serif;
23 --great: "Great Vibes", cursive;
24 --bg_gradient: linear-gradient(45deg, #F5FDFF, #FEEFEC);
25 --bbpc_brand_color: var(--bbpc_brand_color_opt);
26 --h_title: #1d2746;
27 --p_color: #6b707f;
28 --bs-white: #fff;
29 --black_25: #f9f9f9;
30 --black_50: #f2f2f2;
31 --black_75: #eeeeee;
32 --black_90: #e0e6f0;
33 --black_100: #d6d9dc;
34 --black_150: #c8ccd0;
35 --black_200: #bbc0c4;
36 --black_300: #9fa6ad;
37 --black_350: #9199a1;
38 --black_400: #848d95;
39 --black_500: #6a737c;
40 --black_600: #535a60;
41 --black_700: #3c4146;
42 --black_750: #2f3337;
43 --black_800: #242729;
44 --black_900: #0c0d0e;
45 --bbpc_color: #078669;
46 --baseColor2: #4a6ee0;
47 }
48
49 /*font Variables*/
50 /**=== Functions ===**/
51 .col-md-offset-right-1,
52 .col-lg-offset-right-1 {
53 margin-right: 8.33333333%;
54 }
55
56 .community-post {
57 border-radius: 6px;
58 box-shadow: 0 2px 4px 0 rgba(2, 47, 57, 0.1);
59 padding: 23px 30px;
60 display: flex;
61 background: var(--bs-white);
62 align-items: center;
63 justify-content: space-between;
64 margin-bottom: 10px;
65 transition: all 0.3s ease-in-out;
66 border: 1px solid var(--black_50);
67 }
68 .community-post:hover {
69 box-shadow: 0 24px 40px 0 rgba(2, 47, 57, 0.12);
70 border-color: #eef3f6;
71 transform: translateX(10px);
72 }
73 .community-post .post-content {
74 display: flex;
75 align-items: center;
76 flex-wrap: wrap;
77 }
78 .community-post .post-content .author-avatar {
79 margin-right: 25px;
80 border-radius: 50%;
81 overflow: hidden;
82 margin-top: -2px;
83 }
84 .community-post .post-content .entry-content {
85 color: var(--black_600);
86 font-size: 16px;
87 font-family: "Roboto", sans-serif;
88 }
89 .community-post .post-content img {
90 border-radius: 50%;
91 }
92
93 .community-post.forum-item {
94 padding: 23px 15px;
95 }
96 .community-post.forum-item .post-content p {
97 font-size: 14px;
98 line-height: 1.3;
99 }
100 @media (max-width: 667px) {
101 .community-post {
102 display: block;
103 }
104 }
105 @media (max-width: 420px) {
106 .community-post {
107 padding: 20px 15px;
108 }
109 }
110 .community-post .post-content .author-avatar.forum-icon {
111 border-radius: 0;
112 }
113 .community-post .post-content .author-avatar.forum-icon img {
114 padding: 2px;
115 }
116 @media (max-width: 667px) {
117 .community-post .post-content .author-avatar {
118 margin-right: 20px;
119 }
120 }
121 @media (max-width: 420px) {
122 .community-post .post-content .author-avatar {
123 margin-right: 15px;
124 }
125 }
126 .community-post .post-content .entry-content {
127 flex: 2;
128 }
129 .community-post .post-content .entry-content .post-title {
130 font-size: 18px;
131 font-weight: 500;
132 margin: auto;
133 margin-bottom: 0;
134 line-height: 1.7;
135 }
136 .community-post .post-content .entry-content .post-title a {
137 text-decoration: none;
138 }
139 .community-post .post-content .entry-content .post-title a:hover {
140 color: var(--bbpc_brand_color);
141 }
142 .community-post .post-content .entry-content p {
143 margin: 0;
144 }
145 @media (max-width: 667px) {
146 .community-post .post-meta-wrapper {
147 margin-top: 15px;
148 margin-left: 70px;
149 }
150 }
151 .community-post .post-meta-wrapper .post-meta-info {
152 margin: 0;
153 padding: 0;
154 list-style: none;
155 }
156 @media (max-width: 991px) {
157 .community-post .post-meta-wrapper .post-meta-info li:not(:last-child) {
158 margin-right: 20px;
159 }
160 }
161 .community-post .post-meta-wrapper .post-meta-info li a {
162 display: block;
163 color: var(--black_600);
164 }
165 .community-post .post-meta-wrapper .post-meta-info li a i {
166 margin-right: 10px;
167 }
168 .community-post .post-meta-wrapper .post-meta-info li a:hover {
169 color: var(--bbpc_brand_color);
170 }
171 .community-post.style-two {
172 margin-bottom: 0;
173 border-radius: 0;
174 box-shadow: none;
175 position: relative;
176 }
177 .community-post.style-two .entry-content .post-title {
178 font-size: 16px;
179 }
180 .community-post.style-two .post-meta-wrapper .post-meta-info li i {
181 transition: all 0.3s ease-in-out;
182 }
183 .community-post.style-two .post-meta-wrapper .post-meta-info li:nth-child(2):hover a {
184 color: #b1b5c0;
185 }
186 .community-post.style-two .post-meta-wrapper .post-meta-info li:nth-child(2):hover i {
187 color: #f9ae44;
188 }
189 .community-post.style-two .com-featured {
190 position: absolute;
191 right: 0;
192 top: -2px;
193 height: 30px;
194 width: 30px;
195 z-index: 2;
196 text-align: center;
197 color: #fff;
198 padding: 0 15px;
199 }
200 .community-post.style-two .com-featured i {
201 z-index: 22;
202 position: relative;
203 font-size: 14px;
204 }
205 .community-post.style-two .com-featured:after {
206 content: "";
207 top: 0;
208 position: absolute;
209 right: 0;
210 width: 0;
211 height: 0;
212 border-left: 30px solid transparent;
213 border-right: 0 solid transparent;
214 border-top: 30px solid #00ae69;
215 z-index: 1;
216 }
217 .community-post.style-two .cat-wrap {
218 display: inline-block;
219 vertical-align: 3px;
220 }
221 .community-post .meta {
222 margin: 0;
223 padding: 0;
224 list-style: none;
225 }
226 .community-post .meta li img {
227 display: inline-block;
228 vertical-align: -2px;
229 }
230 .community-post .meta li i,
231 .community-post .meta li img {
232 margin-right: 10px;
233 font-size: 14px;
234 }
235 .community-post .meta li a {
236 font-size: 14px;
237 color: #838793;
238 }
239 .community-post .meta li a:hover {
240 color: var(--bbpc_brand_color);
241 }
242
243 .community-post .post-meta-wrapper .post-meta-info li:first-child {
244 margin-right: 40px;
245 }
246
247 .community-post .post-meta-wrapper .post-meta-info li {
248 display: inline-block;
249 }
250
251 .forum-post-content .forum-post-btm .taxonomy i,
252 .forum-post-content .forum-post-btm .taxonomy img,
253 .community-post .post-meta-wrapper .post-meta-info li a i,
254 .community-post .post-meta-wrapper .post-meta-info li a img,
255 .community-post.style-two .meta li i,
256 .community-post.style-two .meta li img {
257 margin-right: 5px;
258 }
259
260 .post-header .category-menu li i,
261 .community-post .post-meta-wrapper .post-meta-info li a i {
262 font-size: 14px;
263 }
264
265 .forum-category-area .col-custom {
266 width: 20%;
267 }
268 .forum-category-area .single-category-widget {
269 box-shadow: 0 1.6px 3.5px 0 rgba(51, 77, 114, 0.1490196078), 0 0.5px 1px 0 rgba(51, 77, 114, 0.1019607843);
270 background-color: #fff;
271 border-radius: 10px;
272 text-align: center;
273 padding: 25px;
274 transition: all 0.3s ease-out;
275 }
276 .forum-category-area .single-category-widget:hover {
277 box-shadow: 0 20px 20px 0 rgba(51, 77, 114, 0.0901960784);
278 }
279 .forum-category-area .single-category-widget:hover h5 {
280 color: var(--bbpc_brand_color) !important;
281 }
282 .forum-category-area .single-category-widget h5 {
283 font-size: 18px;
284 text-transform: capitalize;
285 font-family: var(--rob);
286 font-weight: 500;
287 line-height: 1.3;
288 color: #171d24;
289 margin-bottom: 0;
290 margin-top: 23px;
291 transition: all 0.3s ease-out;
292 }
293
294 .forum-category-area .col-custom {
295 margin-bottom: 30px;
296 }
297 .forum-category-area .col-custom.wow.fadeInUp {
298 padding: 0 12px;
299 }
300
301 .communities-boxes {
302 display: flex;
303 flex-wrap: wrap;
304 margin: 0 -30px;
305 gap: 30px;
306 }
307 @media (max-width: 1025px) {
308 .communities-boxes {
309 margin: 0 -10px;
310 }
311 }
312 @media (max-width: 992px) {
313 .communities-boxes {
314 flex-wrap: wrap;
315 justify-content: center;
316 width: calc(100% + 30px);
317 }
318 }
319 @media (max-width: 420px) {
320 .communities-boxes {
321 width: calc(100% + 15px);
322 }
323 }
324 .communities-boxes .com-box {
325 text-align: center;
326 margin-bottom: 57px;
327 width: 20%;
328 flex: 0 0 200px;
329 }
330 @media (max-width: 1200px) {
331 .communities-boxes .com-box {
332 flex: 0 0 165px;
333 }
334 }
335 @media (max-width: 991px) {
336 .communities-boxes .com-box {
337 flex: 0 0 180px;
338 }
339 }
340 @media (max-width: 768px) {
341 .communities-boxes .com-box {
342 flex: 0 0 185px;
343 }
344 }
345 @media (max-width: 426px) {
346 .communities-boxes .com-box {
347 flex: 0 0 170px;
348 margin-bottom: 30px;
349 }
350 }
351 .communities-boxes .com-box .icon-container {
352 border-radius: 6px;
353 background: var(--bs-white);
354 box-shadow: 0 40px 70px 0 rgba(2, 47, 57, 0.1);
355 display: flex;
356 align-items: center;
357 justify-content: center;
358 height: 100px;
359 width: 100px;
360 margin: 0 auto 20px;
361 }
362 .communities-boxes .com-box .com-box-content .title {
363 font-size: 20px;
364 line-height: 26px;
365 font-weight: 500;
366 color: var(--black_800);
367 margin-bottom: 5px;
368 transition: all 0.3s ease-in-out;
369 letter-spacing: normal;
370 margin-top: 10px;
371 }
372 .communities-boxes .com-box .com-box-content .title a {
373 color: var(--black_800);
374 }
375 .communities-boxes .com-box .com-box-content .title a:hover {
376 color: var(--bbpc_brand_color);
377 text-decoration: none;
378 }
379 .communities-boxes .com-box .com-box-content .title:hover {
380 color: var(--bbpc_brand_color);
381 }
382 .communities-boxes .com-box .com-box-content .total-post {
383 color: var(--p_color);
384 font-size: 14px;
385 margin-top: 0;
386 }
387
388 .more-communities {
389 padding: 22px 0;
390 border-top: 1px solid #e8ecee;
391 border-bottom: 1px solid #e8ecee;
392 }
393 .more-communities .collapse-wrap {
394 margin-top: 80px;
395 display: none;
396 }
397 .more-communities .collapse-btn-wrap {
398 text-align: center;
399 display: table;
400 color: var(--black_600);
401 font-weight: 500;
402 margin: auto;
403 }
404 .more-communities .collapse-btn-wrap:hover {
405 text-decoration: none;
406 color: var(--black_800);
407 }
408 .more-communities .collapse-btn-wrap svg {
409 position: relative;
410 vertical-align: middle;
411 display: inline;
412 }
413 .more-communities .collapse-btn-wrap .icon_plus path, .more-communities .collapse-btn-wrap .icon_plus line, .more-communities .collapse-btn-wrap .icon_minus path, .more-communities .collapse-btn-wrap .icon_minus line {
414 stroke: var(--bbpc_brand_color);
415 }
416 .more-communities .collapse-btn-wrap .icon_minus {
417 display: none;
418 }
419 .more-communities .collapse-btn-wrap.active .icon_plus {
420 display: none;
421 }
422 .more-communities .collapse-btn-wrap.active .icon_minus {
423 display: initial;
424 }
425
426 body.body_dark .communities-boxes .com-box .com-box-content .title a {
427 color: #fff;
428 }
429 body.body_dark .communities-boxes .com-box .com-box-content .title a:hover {
430 color: var(--bbpc_brand_color);
431 }
432 body.body_dark .communities-boxes .com-box .com-box-content .total-post {
433 color: #8b8b8b;
434 }
435 body.body_dark .more-communities {
436 border-color: #272727;
437 }
438 body.body_dark .single-forum-post-widget .post-info div {
439 color: #848d95;
440 }
441 body.body_dark .single-forum-post-widget .post-info .post-category a {
442 color: #848d95;
443 }
444 body.body_dark .single-forum-post-widget .post-info .post-category a:hover {
445 color: var(--bbpc_brand_color);
446 }
447 body.body_dark .community-area .nav-tabs .nav-item button.active {
448 color: #fff;
449 }
450
451 /** === Widgets === **/
452 .widget_display_stats dl dt {
453 float: left;
454 clear: left;
455 margin: 0 0 10px;
456 font-weight: 500;
457 }
458
459 .widget_display_stats dl dd {
460 float: right;
461 margin: 0;
462 }
463
464 .widget_display_replies li:before {
465 font-family: eleganticons;
466 content: "w";
467 font-size: 15px !important;
468 margin: 0 12px 0 0 !important;
469 padding: 0px !important;
470 line-height: 23px;
471 }
472
473 .widget_display_topics li div {
474 color: var(--black_400);
475 }
476 .widget_display_topics li::before {
477 font-family: eleganticons;
478 content: "b";
479 margin: -3px 12px 0 0;
480 font-size: 15px;
481 color: var(--black_800);
482 position: absolute;
483 left: 0;
484 top: 0;
485 }
486
487 .widget_display_topics .bbp-forum-title,
488 .widget_display_replies .bbp-forum-title {
489 display: inline-block;
490 line-height: 1.36;
491 color: var(--black_900);
492 }
493
494 .widget_display_topics li {
495 padding-left: 30px;
496 }
497
498 .widget_display_topics li,
499 .widget_display_replies li {
500 position: relative;
501 margin-bottom: 10px;
502 padding-bottom: 10px;
503 border-bottom: 1px solid #e5e7e9;
504 font-size: 16px;
505 }
506 .widget_display_topics li time,
507 .widget_display_replies li time {
508 color: var(--black_400);
509 display: block;
510 font-size: 14px;
511 }
512 .widget_display_topics li div,
513 .widget_display_replies li div {
514 font-size: 14px;
515 }
516
517 .widget_display_topics li a,
518 .widget_display_replies li a {
519 color: var(--black_800);
520 }
521 .widget_display_topics li a .bbp-author-avatar img,
522 .widget_display_replies li a .bbp-author-avatar img {
523 border-radius: 50px;
524 }
525
526 .widget_display_replies li .bbp-author-avatar {
527 margin-right: 5px;
528 }
529
530 .widget_display_topics li a:hover,
531 .widget_display_replies li a:hover {
532 color: var(--bbpc_brand_color);
533 }
534
535 .bbp-logged-in .avatar {
536 float: left;
537 margin: 0 15px 0 0;
538 border-radius: 99%;
539 }
540
541 .bbp-logged-in h4 {
542 font-weight: normal;
543 font-size: 18px;
544 clear: none;
545 margin: 0 0 5px;
546 }
547
548 .bbp-logged-in h4 a {
549 color: #333;
550 font-weight: 500;
551 }
552
553 .bbp-logged-in a.button.logout-link:hover,
554 .bbp-logged-in h4 a:hover {
555 color: var(--bbpc_brand_color);
556 }
557
558 .bbp-logged-in a.button.logout-link:hover,
559 .bbp-logged-in a.button.logout-link {
560 color: #666;
561 }
562
563 .forum-post-content .content img {
564 max-width: 100%;
565 height: auto;
566 }
567
568 ul.bbp-topics-widget.newness img {
569 border-radius: 50%;
570 margin: 5px;
571 }
572
573 .bbp-submit-wrapper {
574 float: left;
575 margin-top: 0;
576 }
577
578 .forum-post-content .forum-post-btm .taxonomy.forum-post-cat {
579 display: flex;
580 }
581
582 .bbp-topic-reply-link {
583 padding: 6px 20px;
584 font-weight: 400;
585 border-radius: 2px;
586 transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.18s ease-in-out;
587 background: #fff;
588 border: 1px solid #d0d8dc;
589 color: var(--black_800);
590 height: 26px;
591 font-size: 12px;
592 line-height: 26px;
593 }
594
595 .comment-content .bbp-topic-reply-link:hover {
596 background: #fff;
597 border: 1px solid var(--black_800);
598 color: var(--black_800);
599 }
600
601 .page-numbers {
602 cursor: pointer !important;
603 }
604
605 .pagination-wrapper .page-numbers.next {
606 display: flex;
607 align-items: center;
608 justify-content: center;
609 padding-bottom: 2px;
610 }
611
612 .post-header .support-total-info li a {
613 font-weight: 400;
614 }
615
616 .post-header .support-total-info li a {
617 color: #6b707f;
618 }
619
620 .post-header .support-total-info li a.open-data.loading {
621 color: var(--black_800);
622 font-weight: 500;
623 }
624
625 #tagList {
626 padding-left: 40px;
627 }
628
629 .userlist {
630 padding-left: 15px;
631 }
632
633 .post-header .category-menu .all-users a {
634 position: relative;
635 }
636
637 .post-header .category-menu .all-users a .count {
638 background: #ebedf0;
639 border-radius: 10px;
640 color: #838793;
641 font-size: 12px;
642 position: absolute;
643 margin-left: 5px;
644 padding: 1px 5px 0;
645 top: 8px;
646 width: auto;
647 height: auto;
648 }
649
650 /*=========== Forum Post Widget css ==========*/
651 .forum-post-widget .widget-header h2 {
652 font-size: 40px;
653 font-weight: 700;
654 line-height: 50px;
655 color: #000;
656 }
657 .forum-post-widget .widget-header .action_btn {
658 padding-bottom: 8px;
659 padding-top: 8px;
660 box-shadow: none;
661 }
662 .forum-post-widget .widget-header .action_btn:hover {
663 box-shadow: 0 20px 30px 0 rgba(17, 166, 131, 0.24);
664 }
665 .forum-post-widget .post-filter-widget {
666 box-shadow: 0 1.6px 3.5px 0 rgba(51, 77, 114, 0.1490196078), 0 0.5px 1px 0 rgba(51, 77, 114, 0.1019607843);
667 border-radius: 10px;
668 background-color: #fff;
669 padding: 16.5px 30px;
670 display: flex;
671 flex-wrap: wrap;
672 margin-bottom: 20px;
673 }
674 .forum-post-widget .post-filter-widget .single-filter-item {
675 margin-right: 30px;
676 display: flex;
677 align-items: center;
678 }
679 .forum-post-widget .post-filter-widget .single-filter-item a.data-active {
680 color: var(--bbpc_brand_color);
681 }
682 .forum-post-widget .post-filter-widget .single-filter-item i {
683 margin-right: 5px;
684 font-size: 12px;
685 }
686 @media (max-width: 1200px) and (min-width: 992px) {
687 .forum-post-widget .post-filter-widget .single-filter-item {
688 margin-right: 20px;
689 }
690 }
691 .forum-post-widget .post-filter-widget .single-filter-item:last-child {
692 margin-right: 0;
693 }
694 .forum-post-widget .post-filter-widget .single-filter-item input[type=radio] {
695 display: none;
696 }
697 .forum-post-widget .post-filter-widget .single-filter-item input[type=radio]:checked {
698 display: none;
699 }
700 .forum-post-widget .post-filter-widget .single-filter-item input[type=radio]:checked ~ label {
701 color: var(--bbpc_brand_color);
702 }
703 .forum-post-widget .post-filter-widget .single-filter-item input[type=radio]:checked ~ label .main-img {
704 display: none;
705 }
706 .forum-post-widget .post-filter-widget .single-filter-item input[type=radio]:checked ~ label .hover-img {
707 display: block;
708 }
709 .forum-post-widget .post-filter-widget .single-filter-item label {
710 display: flex;
711 align-items: center;
712 cursor: pointer;
713 font-size: 14px;
714 font-weight: 400;
715 line-height: 16px;
716 color: #6a737c;
717 }
718 .forum-post-widget .post-filter-widget .single-filter-item label img {
719 margin-right: 8.5px;
720 margin-bottom: 1px;
721 }
722 .forum-post-widget .post-filter-widget .single-filter-item label .main-img {
723 display: block;
724 }
725 .forum-post-widget .post-filter-widget .single-filter-item label .hover-img {
726 display: none;
727 }
728
729 .single-forum-post-widget {
730 box-shadow: 0 1.6px 3.5px 0 rgba(51, 77, 114, 0.1490196078), 0 0.5px 1px 0 rgba(51, 77, 114, 0.1019607843);
731 border-radius: 10px;
732 background-color: #fff;
733 transition: all 0.3s ease-out;
734 padding: 22px 35px 18px 30px;
735 display: flex;
736 align-items: center;
737 justify-content: space-between;
738 margin-top: 10px;
739 }
740 .single-forum-post-widget:first-child {
741 margin-top: 0;
742 }
743 .single-forum-post-widget:hover {
744 box-shadow: 0 20px 45px 0 rgba(51, 77, 114, 0.1490196078);
745 transform: translateX(2px);
746 }
747 .single-forum-post-widget:hover .post-title h6 a {
748 color: var(--bbpc_brand_color);
749 }
750 .single-forum-post-widget .post-title {
751 margin-bottom: 10px;
752 }
753 .single-forum-post-widget .post-title h6 {
754 margin-top: 0;
755 margin-bottom: 0;
756 line-height: 22px;
757 font-size: 16px;
758 font-weight: 500;
759 }
760 .single-forum-post-widget .post-title h6 a {
761 color: #171d24;
762 font-size: 18px;
763 }
764 .single-forum-post-widget .post-title i {
765 font-size: 15px;
766 color: #2ed83f;
767 vertical-align: middle;
768 margin-left: 6px;
769 }
770 .single-forum-post-widget .post-info {
771 display: flex;
772 flex-wrap: wrap;
773 }
774 .single-forum-post-widget .post-info > div {
775 margin-right: 15px;
776 color: var(--black_600);
777 font-size: 14px;
778 font-weight: 400;
779 line-height: 16px;
780 }
781 .single-forum-post-widget .post-info > div img {
782 margin-right: 5px;
783 height: 15px;
784 width: 15px;
785 margin-top: 0px;
786 }
787 .single-forum-post-widget .post-info .post-category a {
788 color: #4a6ee0;
789 }
790 .single-forum-post-widget .post-tags {
791 display: flex;
792 }
793 .single-forum-post-widget .post-tags .single-tag {
794 padding: 3px 9.5px;
795 border-radius: 3px;
796 font-size: 12px;
797 font-weight: 400;
798 line-height: 14px;
799 color: #fff;
800 margin: 12px 10px 0 0;
801 }
802 .single-forum-post-widget .post-tags .single-tag:last-child {
803 margin-right: 0;
804 }
805 .single-forum-post-widget .post-tags .single-tag.tag-jq {
806 background-color: #f7ab40;
807 }
808 .single-forum-post-widget .post-tags .single-tag.tag-php {
809 background-color: #7543e0;
810 }
811 .single-forum-post-widget .post-tags .single-tag.tag-wp {
812 background-color: #6078ce;
813 }
814 .single-forum-post-widget .post-tags .single-tag.tag-js {
815 background-color: #ff7245;
816 }
817 .single-forum-post-widget .post-tags .single-tag.tag-dvlp {
818 background-color: #48a6ea;
819 }
820 .single-forum-post-widget .post-tags .single-tag.tag-ecmrc {
821 background-color: #333333;
822 }
823 .single-forum-post-widget .post-tags .single-tag.tag-foram {
824 background-color: var(--bbpc_brand_color);
825 }
826 .single-forum-post-widget .post-tags .single-tag.tag-hlp {
827 background-color: #2c53df;
828 }
829 .single-forum-post-widget .post-tags .single-tag.tag-sprt {
830 background-color: #0cc72a;
831 }
832 .single-forum-post-widget .post-reach {
833 border-left: 1px solid #e6e6e6;
834 padding-left: 10px;
835 }
836 .single-forum-post-widget .post-reach > div {
837 font-size: 12px;
838 font-weight: 400;
839 line-height: 14px;
840 color: #848d95;
841 margin-top: 10px;
842 display: flex;
843 align-items: center;
844 }
845 .single-forum-post-widget .post-reach > div:first-child {
846 margin-top: 0;
847 }
848 .single-forum-post-widget .post-reach > div img {
849 margin-right: 5px;
850 }
851
852 .single-forum-post-widget .post-category img {
853 width: 20px;
854 height: auto;
855 border-radius: 50%;
856 }
857
858 .single-filter-item a {
859 color: var(--black_600);
860 }
861 .single-filter-item a:hover {
862 text-decoration: none;
863 }
864
865 .single-forum-post-widget .post-content .post-category a {
866 font-size: 14px;
867 color: var(--black_600);
868 gap: 5px;
869 }
870 .single-forum-post-widget .post-content .post-category a:hover {
871 color: var(--bbpc_brand_color);
872 text-decoration: none;
873 }
874
875 body.body_dark .forum-post-widget .post-filter-widget .single-filter-item svg, body.body_dark .forum-post-widget .post-filter-widget .single-filter-item path {
876 fill: darkgrey;
877 }
878
879 #aj-post-filter-widget svg circle.bbpc-preloader {
880 stroke: var(--bbpc_brand_color) !important;
881 }
882
883 .ama-search-widget {
884 position: relative;
885 margin-left: auto;
886 margin-right: auto;
887 }
888 .ama-search-widget .header_search_keyword {
889 text-align: left;
890 display: flex;
891 flex-wrap: wrap;
892 align-items: center;
893 font-weight: 500;
894 justify-content: center;
895 margin-top: 10px;
896 }
897 .ama-search-widget .header_search_keyword span {
898 font-size: 14px;
899 margin-right: 10px;
900 }
901 .ama-search-widget .header_search_keyword ul {
902 margin: 0;
903 }
904 .ama-search-widget .header_search_keyword ul li {
905 display: inline-block;
906 margin: 0 3px 0;
907 }
908 .ama-search-widget .header_search_keyword ul li a {
909 display: block;
910 font-size: 13px;
911 padding: 0 19px;
912 border-radius: 45px;
913 background: var(--bbpc_color);
914 color: #fff;
915 font-weight: normal;
916 }
917 .ama-search-widget .header_search_keyword ul li a.header-search-form__keywords-label {
918 color: var(--black_800);
919 }
920 .ama-search-widget .search-box {
921 z-index: 99;
922 position: relative;
923 }
924 .ama-search-widget .search-box svg {
925 position: absolute;
926 right: 8px;
927 top: 49.59999%;
928 transform: translateY(-50%);
929 line-height: 22px;
930 padding: 10px;
931 border-radius: 4px;
932 border-left-color: transparent;
933 box-sizing: border-box;
934 color: var(--bbpc_brand_color);
935 }
936 .ama-search-widget .search-box input#searchInput {
937 border: 0 solid transparent;
938 box-shadow: none;
939 }
940 .ama-search-widget .search-box input {
941 width: 100%;
942 border-radius: 4px;
943 line-height: 35px;
944 text-indent: 15px;
945 padding-right: 43px;
946 }
947 .ama-search-widget .search-box #searchInput + .spinner {
948 position: absolute;
949 right: 45px;
950 top: 50% !important;
951 transform: translateY(-55%);
952 display: none;
953 background: #fff;
954 z-index: 999;
955 }
956 .ama-search-widget .search-box #searchInput + .spinner img {
957 width: 22px;
958 }
959 .ama-search-widget .elementor img {
960 height: auto;
961 max-width: 100%;
962 border: none;
963 border-radius: 0;
964 -webkit-box-shadow: none;
965 box-shadow: none;
966 }
967
968 ul.list-unstyled {
969 padding-left: 0;
970 }
971
972 .ama-search-keyword-wrapper .header_search_keyword ul li a {
973 color: var(--black_600);
974 background: var(--black_50);
975 font-weight: normal;
976 }
977
978 /* ------- Forum & Search -------- */
979 .single-forum-post-widget .post-category img {
980 width: 15px;
981 height: auto;
982 }
983
984 .single-filter-item a {
985 color: var(--black_600);
986 }
987
988 /** === Doc search form result === **/
989 #bbpc-search-result {
990 position: absolute;
991 width: 100%;
992 background: var(--bs-white);
993 font-size: 14px;
994 font-weight: 400;
995 display: none;
996 transition: all 0.4s;
997 margin-top: 2px;
998 border: 1px solid var(--black_50);
999 border-radius: 4px;
1000 box-shadow: 0 3px 4px 0 rgba(4, 73, 89, 0.06);
1001 padding: 20px 25px;
1002 top: 45px;
1003 }
1004 #bbpc-search-result::before {
1005 content: "";
1006 width: 12px;
1007 height: 12px;
1008 background: var(--bs-white);
1009 position: absolute;
1010 top: -6px;
1011 transform: rotate(45deg);
1012 left: 40px;
1013 border-left: 1px solid var(--black_50);
1014 border-top: 1px solid var(--black_50);
1015 }
1016 #bbpc-search-result .searchbar-tabs {
1017 padding: 0 10px 15px 0;
1018 }
1019 #bbpc-search-result a {
1020 text-decoration: none;
1021 }
1022 #bbpc-search-result.ajax-search {
1023 display: block;
1024 }
1025 #bbpc-search-result .not-found-text,
1026 #bbpc-search-result .bbpc-not-found-text {
1027 display: none;
1028 font-weight: 700;
1029 font-size: 20px;
1030 margin: 12px 0 5px;
1031 letter-spacing: 0.1px;
1032 }
1033
1034 .search-results-tab .bbpc-search-title {
1035 font-size: 16px;
1036 color: var(--h_title);
1037 display: block;
1038 border-bottom: 1px solid var(--black_50);
1039 font-weight: 500;
1040 text-align: left;
1041 padding-left: 8px;
1042 margin: 12px 0 0;
1043 padding-bottom: 8px;
1044 text-transform: capitalize;
1045 }
1046
1047 /*
1048 keywords
1049 */
1050 .bbpc-search-keyword {
1051 display: block;
1052 text-align: center;
1053 margin: 15px 0 5px;
1054 }
1055 .bbpc-search-keyword.left {
1056 text-align: left;
1057 }
1058 .bbpc-search-keyword.right {
1059 text-align: right;
1060 }
1061 .bbpc-search-keyword ul {
1062 list-style: none;
1063 margin: 0 2px;
1064 padding: 0;
1065 display: inline-block;
1066 }
1067 .bbpc-search-keyword ul li {
1068 list-style: none;
1069 margin: 0 2px;
1070 padding: 0;
1071 display: inline-block;
1072 }
1073 .bbpc-search-keyword ul li a {
1074 color: #fff;
1075 background: rgba(2, 1, 1, 0.2117647059);
1076 font-size: 14px;
1077 text-transform: capitalize;
1078 padding: 4px 12px;
1079 border-radius: 15px;
1080 font-weight: 400;
1081 text-decoration: none !important;
1082 }
1083
1084 .bbpc_search_form_wrapper {
1085 position: relative;
1086 }
1087 .bbpc_search_form_wrapper .input-wrapper {
1088 position: relative;
1089 }
1090 .bbpc_search_form_wrapper .input-wrapper .spinner {
1091 position: absolute;
1092 right: 30px;
1093 top: 50%;
1094 transform: translateY(-55%);
1095 display: none;
1096 background: #fff;
1097 z-index: 999;
1098 border-radius: 50%;
1099 height: 21px;
1100 width: 21px;
1101 line-height: 0;
1102 }
1103 .bbpc_search_form_wrapper .input-wrapper .spinner img {
1104 width: 22px;
1105 }
1106 .bbpc_search_form_wrapper .input-wrapper input {
1107 width: 100%;
1108 padding: 0.75em;
1109 }
1110 .bbpc_search_form_wrapper .input-wrapper input::-webkit-search-cancel-button {
1111 -webkit-appearance: auto;
1112 position: absolute;
1113 right: 30px;
1114 }
1115 .bbpc_search_form_wrapper .input-wrapper .submit-btn-left {
1116 position: absolute;
1117 right: 0;
1118 top: 0;
1119 bottom: 0;
1120 display: flex;
1121 margin: auto;
1122 align-items: center;
1123 }
1124 .bbpc_search_form_wrapper .input-wrapper .submit-btn-right {
1125 position: absolute;
1126 left: 0;
1127 top: 2px;
1128 bottom: 2px;
1129 margin: auto;
1130 display: flex;
1131 height: fit-content;
1132 }
1133 .bbpc_search_form_wrapper .input-wrapper button {
1134 background: transparent;
1135 border: none;
1136 outline: none;
1137 cursor: pointer;
1138 padding: 0;
1139 margin: 0;
1140 color: black;
1141 }
1142 .bbpc_search_form_wrapper .input-wrapper button svg {
1143 width: auto;
1144 max-width: 100%;
1145 height: auto;
1146 max-height: 80%;
1147 }
1148 .bbpc_search_form_wrapper .search-result-item {
1149 padding: 10px 15px;
1150 display: flex;
1151 align-items: center;
1152 width: 100%;
1153 flex: 100%;
1154 transition: all 0.3s;
1155 }
1156 .bbpc_search_form_wrapper .search-result-item a {
1157 color: var(--p_color);
1158 }
1159 .bbpc_search_form_wrapper .search-result-item:hover {
1160 background: rgba(143, 187, 237, 0.1);
1161 }
1162
1163 .searchbar-tabs .tab-item {
1164 font-size: 14px;
1165 font-weight: 500;
1166 padding: 11px 8px;
1167 margin-right: 20px;
1168 border: none;
1169 background: 0 0;
1170 color: var(--black_400);
1171 text-transform: capitalize;
1172 cursor: pointer;
1173 }
1174 .searchbar-tabs .tab-item.active {
1175 color: var(--bbpc_brand_color);
1176 border-bottom: 3px solid var(--bbpc_brand_color);
1177 }
1178 .searchbar-tabs .tab-item:hover {
1179 text-decoration: none;
1180 outline: none;
1181 }
1182 .searchbar-tabs .tab-item:focus {
1183 text-decoration: none;
1184 outline: none;
1185 }
1186
1187 .forum-card .forum-card-thumbnail-area {
1188 padding: 0 !important;
1189 }
1190
1191 body.body_dark input#searchInput.input_focused {
1192 background: #fff;
1193 }
1194 body.body_dark .not-found-text, body.body_dark .bbpc-not-found-text {
1195 color: black;
1196 }
1197
1198 /** === Focus Search Form === **/
1199 body.bbpc-search-overlay {
1200 opacity: 1;
1201 visibility: visible;
1202 }
1203
1204 body:not(.bbpc-search-overlay) #bbpc-search-result.ajax-search {
1205 display: none;
1206 }
1207
1208 .bbpc-search-overlay.active {
1209 display: none;
1210 position: fixed;
1211 top: 0;
1212 left: 0;
1213 width: 100%;
1214 height: 100%;
1215 background: rgba(0, 0, 0, 0.4); /* Semi-transparent black overlay */
1216 justify-content: center;
1217 align-items: center;
1218 z-index: 99;
1219 transition: 0.3s all;
1220 }
1221
1222 .forum-with-topics {
1223 border-radius: 30px;
1224 }
1225 .forum-with-topics .thumb-area .forum-thumbnail {
1226 border-radius: 8px 8px 0 0;
1227 width: 100%;
1228 }
1229 .forum-with-topics .thumb-area .forum-thumbnail img {
1230 width: 100%;
1231 z-index: -1;
1232 }
1233 .forum-with-topics .topic-table .topic-heading {
1234 display: flex;
1235 flex-wrap: wrap;
1236 background: var(--bs-white);
1237 box-shadow: 0 20px 60px -5px rgba(51, 77, 114, 0.12);
1238 padding: 16px 30px;
1239 border-radius: 0 0 8px 8px;
1240 border: 1px solid var(--black_50);
1241 }
1242 .forum-with-topics .topic-table .topic-heading .icon-text {
1243 color: var(--black_600);
1244 font-size: 14px;
1245 font-weight: 400;
1246 display: flex;
1247 align-items: center;
1248 }
1249 .forum-with-topics .topic-table .topic-heading .icon-text svg {
1250 margin-right: 5px;
1251 }
1252 .forum-with-topics .topic-table .topic-heading .topic {
1253 width: 54%;
1254 }
1255 .forum-with-topics .topic-table .topic-heading .voice {
1256 width: 13%;
1257 }
1258 .forum-with-topics .topic-table .topic-heading .replies {
1259 width: 8%;
1260 }
1261 .forum-with-topics .topic-table .topic-heading .freshness {
1262 width: 20%;
1263 }
1264 .forum-with-topics .topic-table .topic-contents {
1265 display: flex;
1266 background: var(--bs-white);
1267 box-shadow: 0 1.6px 3.5px 0 rgba(51, 77, 114, 0.1490196078), 0 0.5px 1px 0 rgba(51, 77, 114, 0.1019607843);
1268 margin: 10px 0;
1269 border-radius: 8px;
1270 padding: 16px 30px;
1271 border: 1px solid var(--black_50);
1272 align-items: center;
1273 }
1274 .forum-with-topics .topic-table .topic-contents .title {
1275 width: 50%;
1276 }
1277 .forum-with-topics .topic-table .topic-contents .title:hover a {
1278 text-decoration: none;
1279 }
1280 .forum-with-topics .topic-table .topic-contents .title p {
1281 margin-top: 0;
1282 margin-bottom: 0;
1283 font-size: 15px;
1284 }
1285 .forum-with-topics .topic-table .topic-contents .title h3 {
1286 font-size: 16px;
1287 margin-bottom: 5px;
1288 margin-top: 0;
1289 line-height: 20px;
1290 }
1291 .forum-with-topics .topic-table .topic-contents .title h3:hover {
1292 color: var(--bbpc_brand_color);
1293 }
1294 .forum-with-topics .topic-table .topic-contents .voice {
1295 width: 12%;
1296 }
1297 .forum-with-topics .topic-table .topic-contents .topics {
1298 width: 14%;
1299 }
1300 .forum-with-topics .topic-table .topic-contents .voice,
1301 .forum-with-topics .topic-table .topic-contents .topics {
1302 text-align: center;
1303 }
1304 .forum-with-topics .topic-table .topic-contents .user {
1305 width: 25%;
1306 margin-top: 2px;
1307 }
1308 .forum-with-topics .topic-table .topic-contents .user .user-data {
1309 display: flex;
1310 }
1311 .forum-with-topics .topic-table .topic-contents .user .user-img {
1312 margin-right: 10px;
1313 }
1314 .forum-with-topics .topic-table .topic-contents .user .user-img img {
1315 border-radius: 50%;
1316 }
1317 .forum-with-topics .topic-table .topic-contents .user .user-info span.bbp-author-name {
1318 font-size: 14px;
1319 font-weight: 400;
1320 color: var(--black_800);
1321 letter-spacing: normal;
1322 margin-bottom: 8px;
1323 display: inline-block;
1324 }
1325 .forum-with-topics .topic-table .topic-contents .user .user-info .date {
1326 font-size: 13px;
1327 margin: 0;
1328 line-height: 1.5;
1329 }
1330 .forum-with-topics .topic-table .topic-contents .user .user-info .date a {
1331 color: var(--black_400);
1332 }
1333 .forum-with-topics .topic-table .topic-contents .user .user-info .date a:hover {
1334 color: var(--bbpc_brand_color);
1335 text-decoration: none;
1336 }
1337 .forum-with-topics .topic-table .topic-contents .user .user-info h3 {
1338 line-height: 0.5;
1339 margin: 0;
1340 }
1341 .forum-with-topics .topic-table .topic-contents h3 a {
1342 color: #171D24 !important;
1343 font-size: 16px;
1344 }
1345 .forum-with-topics .topic-table .topic-contents h3 a:hover {
1346 text-decoration: none;
1347 color: var(--bbpc_brand_color) !important;
1348 }
1349 .forum-with-topics .topic-table .topic-contents h3 a:hover span {
1350 color: var(--bbpc_brand_color) !important;
1351 }
1352
1353 .forum-info {
1354 padding: 50px 30px;
1355 }
1356 .forum-info .title-area {
1357 align-items: center;
1358 }
1359 @media all and (max-width: 560px) {
1360 .forum-info .title-area {
1361 margin-top: 10px;
1362 }
1363 }
1364 .forum-info .title-area .title,
1365 .forum-info .title-area .subtitle {
1366 color: #fff;
1367 }
1368 .forum-info .title-area .title {
1369 font-size: 28px;
1370 text-transform: capitalize;
1371 margin: 0;
1372 letter-spacing: normal;
1373 }
1374 @media all and (max-width: 560px) {
1375 .forum-info .title-area .title {
1376 margin-bottom: 4px;
1377 }
1378 }
1379 .forum-info .title-area .subtitle {
1380 font-style: italic;
1381 }
1382
1383 .forum-meta {
1384 display: flex;
1385 position: absolute;
1386 list-style-type: none;
1387 top: 20px;
1388 right: 20px;
1389 margin: 0;
1390 }
1391 .forum-meta li {
1392 display: flex;
1393 margin-right: 10px;
1394 line-height: 1 !important;
1395 border-radius: 3px;
1396 margin-left: 0;
1397 }
1398 .forum-meta li.button {
1399 padding: 0;
1400 }
1401 .forum-meta li.button:hover {
1402 text-decoration: none;
1403 }
1404 .forum-meta li:hover a {
1405 text-decoration: none;
1406 }
1407 .forum-meta li:last-child {
1408 margin-right: 0;
1409 }
1410 .forum-meta .topics,
1411 .forum-meta .replies {
1412 color: #fff;
1413 display: inline-flex;
1414 align-items: center;
1415 background: rgba(255, 255, 255, 0.15);
1416 padding: 8px;
1417 font-size: 14px !important;
1418 margin-top: 0;
1419 }
1420 .forum-meta .topics:hover,
1421 .forum-meta .replies:hover {
1422 background: rgba(255, 255, 255, 0.3);
1423 }
1424 .forum-meta .topics svg,
1425 .forum-meta .replies svg {
1426 margin-right: 5px;
1427 }
1428 .forum-meta .button a {
1429 color: #ffffff;
1430 background: var(--bbpc_brand_color);
1431 padding: 8px 14px;
1432 font-size: 14px !important;
1433 border-radius: 3px;
1434 }
1435 .forum-meta .button a:hover {
1436 background: #085d4c;
1437 }
1438
1439 .forum-card {
1440 background: var(--bs-white);
1441 border-radius: 8px 8px 8px 8px;
1442 border: 1px solid var(--black_50);
1443 overflow: hidden;
1444 }
1445 .forum-card .card-body {
1446 padding: 25px;
1447 }
1448 .forum-card .card-body p {
1449 margin-bottom: 0;
1450 }
1451 .forum-card .card-title h3 {
1452 font-size: 18px;
1453 margin-bottom: 5px;
1454 margin-top: unset;
1455 }
1456 .forum-card .card-title h3:hover a {
1457 color: #0b589d;
1458 }
1459 .forum-card .card-title a {
1460 text-decoration: none;
1461 }
1462 .forum-card .forum-card-thumbnail-area {
1463 position: relative;
1464 border-radius: 30px 30px 0 0;
1465 padding: 10px 25px;
1466 }
1467 .forum-card .forum-card-thumbnail-area img {
1468 width: auto;
1469 }
1470 .forum-card .forum-meta {
1471 display: flex;
1472 position: absolute;
1473 bottom: 0;
1474 right: 20px;
1475 top: auto;
1476 margin-bottom: 20px;
1477 }
1478 .forum-card .forum-meta .topics, .forum-card .forum-meta .replies {
1479 background: rgba(23, 29, 36, 0.7);
1480 }
1481 .forum-card .forum-meta .topics:hover, .forum-card .forum-meta .replies:hover {
1482 background: rgba(23, 29, 36, 0.8);
1483 }
1484
1485 @media all and (max-width: 560px) {
1486 .topic-contents .voice,
1487 .topic-contents .topics,
1488 .topic-contents .user {
1489 display: none;
1490 }
1491 .topic-table .topic-heading .voice,
1492 .topic-table .topic-heading .replies,
1493 .topic-table .topic-heading .freshness {
1494 display: none !important;
1495 }
1496 .topic-table .topic-heading .topic,
1497 .topic-table .topic-contents .title {
1498 width: 100% !important;
1499 }
1500 }
1501 .home-forum-counter .elementor-element-populated {
1502 background-color: var(--bs-white);
1503 }
1504 .home-forum-counter .elementor-element-populated .elementor-counter-number {
1505 color: var(--black_900);
1506 }
1507
1508 .home-forum-posts .elementor-post__card {
1509 background-color: var(--bs-white) !important;
1510 }
1511 .home-forum-posts .elementor-post__card .elementor-post__title a {
1512 color: var(--black_900);
1513 }
1514
1515 .card {
1516 position: relative;
1517 display: flex;
1518 flex-direction: column;
1519 }
1520
1521 body.body_dark .forum-with-topics .topic-table .topic-contents h3 a {
1522 color: #fff !important;
1523 }
1524 body.body_dark .forum-with-topics .topic-table .topic-contents h3 a:hover {
1525 color: var(--bbpc_brand_color) !important;
1526 }
1527 body.body_dark .forum-with-topics .topic-table .topic-contents .title p {
1528 color: var(--black_400);
1529 }
1530 body.body_dark .forum-with-topics .forum-card .card-body .card-title h3 a {
1531 color: #fff !important;
1532 }
1533 body.body_dark .forum-with-topics .forum-card .card-body .card-title h3 a:hover {
1534 color: var(--bbpc_brand_color) !important;
1535 }
1536 body.body_dark .forum-with-topics .forum-card .card-body:not(.card-title) {
1537 color: var(--black_400);
1538 }
1539
1540 .single-forum-post-widget {
1541 box-shadow: 0 1.6px 3.5px 0 rgba(51, 77, 114, 0.1490196078), 0 0.5px 1px 0 rgba(51, 77, 114, 0.1019607843);
1542 border-radius: 10px;
1543 background-color: #fff;
1544 transition: all 0.3s ease-out;
1545 padding: 22px 35px 18px 30px;
1546 display: flex;
1547 align-items: center;
1548 justify-content: space-between;
1549 margin-top: 10px;
1550 }
1551 .single-forum-post-widget:first-child {
1552 margin-top: 0;
1553 }
1554 .single-forum-post-widget:hover {
1555 box-shadow: 0 20px 45px 0 rgba(51, 77, 114, 0.1490196078);
1556 transform: translateX(2px);
1557 }
1558 .single-forum-post-widget:hover .post-title h6 a {
1559 color: var(--bbpc_brand_color);
1560 }
1561 .single-forum-post-widget .post-title {
1562 margin-bottom: 15px;
1563 }
1564 .single-forum-post-widget .post-title h6 {
1565 margin-bottom: 0;
1566 line-height: 22px;
1567 font-size: 16px;
1568 font-weight: 500;
1569 text-transform: capitalize;
1570 }
1571 .single-forum-post-widget .post-title h6 a {
1572 color: #171d24;
1573 font-size: 18px;
1574 }
1575 .single-forum-post-widget .post-title h6 a:hover {
1576 text-decoration: none;
1577 }
1578 .single-forum-post-widget .post-title i {
1579 font-size: 15px;
1580 color: #2ed83f;
1581 vertical-align: middle;
1582 margin-left: 6px;
1583 }
1584 .single-forum-post-widget .post-info {
1585 display: flex;
1586 flex-wrap: wrap;
1587 margin-bottom: 5px;
1588 }
1589 .single-forum-post-widget .post-info > div {
1590 margin-right: 15px;
1591 display: flex;
1592 color: var(--black_600);
1593 font-size: 14px;
1594 font-weight: 400;
1595 line-height: 16px;
1596 }
1597 .single-forum-post-widget .post-info > div img {
1598 margin-right: 5px;
1599 height: 15px;
1600 width: 15px;
1601 }
1602 .single-forum-post-widget .post-info > div a {
1603 color: #545454;
1604 }
1605 .single-forum-post-widget .post-tags {
1606 display: flex;
1607 }
1608 .single-forum-post-widget .post-tags .single-tag {
1609 padding: 3px 9.5px;
1610 border-radius: 3px;
1611 font-size: 12px;
1612 font-weight: 400;
1613 line-height: 14px;
1614 color: #fff;
1615 margin: 12px 10px 0 0;
1616 }
1617 .single-forum-post-widget .post-tags .single-tag:last-child {
1618 margin-right: 0;
1619 }
1620 .single-forum-post-widget .post-tags .single-tag.tag-jq {
1621 background-color: #f7ab40;
1622 }
1623 .single-forum-post-widget .post-tags .single-tag.tag-php {
1624 background-color: #7543e0;
1625 }
1626 .single-forum-post-widget .post-tags .single-tag.tag-wp {
1627 background-color: #6078ce;
1628 }
1629 .single-forum-post-widget .post-tags .single-tag.tag-js {
1630 background-color: #ff7245;
1631 }
1632 .single-forum-post-widget .post-tags .single-tag.tag-dvlp {
1633 background-color: #48a6ea;
1634 }
1635 .single-forum-post-widget .post-tags .single-tag.tag-ecmrc {
1636 background-color: #333333;
1637 }
1638 .single-forum-post-widget .post-tags .single-tag.tag-foram {
1639 background-color: var(--bbpc_brand_color);
1640 }
1641 .single-forum-post-widget .post-tags .single-tag.tag-hlp {
1642 background-color: #2c53df;
1643 }
1644 .single-forum-post-widget .post-tags .single-tag.tag-sprt {
1645 background-color: #0cc72a;
1646 }
1647 .single-forum-post-widget .post-reach {
1648 border-left: 1px solid #e6e6e6;
1649 padding-left: 15px;
1650 }
1651 .single-forum-post-widget .post-reach > div {
1652 font-size: 12px;
1653 font-weight: 400;
1654 line-height: 14px;
1655 color: #848d95;
1656 margin-top: 10px;
1657 display: flex;
1658 align-items: center;
1659 }
1660 .single-forum-post-widget .post-reach > div:first-child {
1661 margin-top: 0;
1662 }
1663 .single-forum-post-widget .post-reach > div img {
1664 margin-right: 5px;
1665 }
1666
1667 .community-area .nav-tabs {
1668 border-bottom: 1px solid #e6e6e6;
1669 }
1670 .community-area .nav-tabs .nav-item:hover button {
1671 color: var(--bbpc_brand_color);
1672 }
1673 .community-area .nav-tabs .nav-item button {
1674 background-color: transparent;
1675 font-size: 16px;
1676 font-weight: 400;
1677 line-height: 26px;
1678 color: #535a60;
1679 padding: 10px 0;
1680 margin-right: 30px;
1681 border: none;
1682 border-bottom: 2px solid transparent;
1683 cursor: pointer;
1684 }
1685 .community-area .nav-tabs .nav-item button.active {
1686 border-bottom-color: var(--bbpc_brand_color);
1687 color: #171d24;
1688 font-weight: 500;
1689 }
1690 .community-area .sec-btn-blue {
1691 border-radius: 26px;
1692 border: 1px solid rgba(74, 110, 224, 0.4);
1693 color: #4a6ee0;
1694 background-color: transparent;
1695 font-weight: 700;
1696 font-size: 16px;
1697 padding: 10px 37px;
1698 }
1699 .community-area .sec-btn-blue:hover {
1700 background-color: #4a6ee0;
1701 color: #fff;
1702 box-shadow: none;
1703 }
1704
1705 .community-topic-widget-box {
1706 box-shadow: 0 1.6px 3.5px 0 rgba(51, 77, 114, 0.1490196078), 0 0.5px 1px 0 rgba(51, 77, 114, 0.1019607843);
1707 border-radius: 10px;
1708 display: flex;
1709 padding: 40px;
1710 transition: all 0.3s ease-out;
1711 background-color: #fff;
1712 }
1713 .community-topic-widget-box:hover {
1714 box-shadow: 0 20px 45px 0 rgba(51, 77, 114, 0.1490196078);
1715 }
1716 .community-topic-widget-box img {
1717 margin-right: 24px;
1718 max-width: 48px;
1719 }
1720 .community-topic-widget-box h5 {
1721 font-size: 18px;
1722 font-weight: 500;
1723 line-height: 21px;
1724 color: #171d24;
1725 margin-bottom: 2px;
1726 margin-top: 0;
1727 text-transform: capitalize;
1728 }
1729 .community-topic-widget-box h5:hover a {
1730 color: var(--bbpc_brand_color);
1731 text-decoration: none;
1732 }
1733 .community-topic-widget-box span {
1734 font-size: 14px;
1735 font-weight: 400;
1736 line-height: 22px;
1737 color: #6a737c;
1738 display: inline-block;
1739 }
1740 .community-topic-widget-box span:nth-child(2) {
1741 padding-right: 8px;
1742 }
1743 .community-topic-widget-box span:nth-child(4) {
1744 padding-left: 8px;
1745 }
1746 .community-topic-widget-box span.vr-line {
1747 color: #bbc0c4;
1748 }
1749
1750 .nav {
1751 display: flex;
1752 flex-wrap: wrap;
1753 padding-left: 0;
1754 margin-bottom: 0;
1755 list-style: none;
1756 margin-left: 0;
1757 }
1758
1759 .bbpc-community-topic-widget-main-wrapper {
1760 --bs-gutter-x: 1.5rem;
1761 --bs-gutter-y: 0;
1762 display: grid;
1763 grid-template-columns: repeat(3, 1fr);
1764 grid-gap: 20px;
1765 }
1766 .bbpc-community-topic-widget-main-wrapper .bbpc-community-topic-widget-wrapper {
1767 display: contents;
1768 }
1769 @media (max-width: 1024px) {
1770 .bbpc-community-topic-widget-main-wrapper {
1771 grid-template-columns: repeat(2, 1fr);
1772 }
1773 }
1774 @media (max-width: 768px) {
1775 .bbpc-community-topic-widget-main-wrapper {
1776 grid-template-columns: repeat(1, 1fr);
1777 }
1778 }
1779
1780 .bbpc-show-more-btn-wrapper {
1781 width: 100%;
1782 text-align: center;
1783 }
1784 .bbpc-show-more-btn-wrapper .show-more-btn {
1785 display: inline-block;
1786 box-shadow: 0 1.6px 3.5px 0 rgba(51, 77, 114, 0.1490196078), 0 0.5px 1px 0 rgba(51, 77, 114, 0.1019607843);
1787 transition: all 0.3s ease-out;
1788 font-size: 18px;
1789 font-weight: 400;
1790 color: #4a6ee0;
1791 height: 50px;
1792 border-radius: 5px;
1793 line-height: 48px;
1794 padding: 0 40px;
1795 text-align: center;
1796 background-color: #fff;
1797 margin-top: 50px;
1798 }
1799 .bbpc-show-more-btn-wrapper .show-more-btn:hover {
1800 box-shadow: 0 10px 30px 0 rgba(51, 77, 114, 0.1215686275);
1801 color: #4a6ee0;
1802 }
1803 .bbpc-show-more-btn-wrapper .show-more-btn i {
1804 color: #4a6ee0;
1805 vertical-align: middle;
1806 }
1807 .bbpc-show-more-btn-wrapper .show-more-btn.show-more-round {
1808 height: 48px;
1809 border-radius: 24px;
1810 line-height: 47px;
1811 }
1812 .bbpc-show-more-btn-wrapper .show-more-btn:hover {
1813 text-decoration: none;
1814 }
1815
1816 /*------- Forum Tab widget tags --------*/
1817 .single-forum-post-widget .post-tags a {
1818 font-weight: 400;
1819 line-height: 14px;
1820 font-size: 12px;
1821 padding: 3px 10px;
1822 background: #6078ce;
1823 margin: 12px 10px 0 0;
1824 border-radius: 3px;
1825 color: #fff;
1826 text-decoration: none;
1827 }
1828 .single-forum-post-widget .post-tags a:hover {
1829 background: #4766d5;
1830 }
1831
1832 .tab-content {
1833 padding-top: 40px;
1834 }
1835 .tab-content .tab {
1836 display: none;
1837 }
1838 .tab-content.active {
1839 display: block;
1840 }
1841
1842 .community-area .tab-content:not(.active) {
1843 display: none;
1844 }
1845
1846 .alert-warning {
1847 color: #664d03;
1848 background-color: #fff3cd;
1849 border-color: #ffecb5;
1850 }
1851
1852 .alert {
1853 position: relative;
1854 padding: 1rem 1rem;
1855 margin-bottom: 1rem;
1856 border: 1px solid transparent;
1857 border-radius: 0.25rem;
1858 }
1859
1860 .dbl-arrow-upper {
1861 display: inline-block;
1862 }
1863 .dbl-arrow-upper .arrow-cont {
1864 cursor: pointer;
1865 position: relative;
1866 display: inline-block;
1867 height: 24px;
1868 width: 20px;
1869 margin-right: 3px;
1870 }
1871 .dbl-arrow-upper .arrow-cont svg {
1872 position: absolute;
1873 bottom: 0;
1874 margin-left: 0;
1875 background-size: contain;
1876 top: 8px;
1877 left: 0;
1878 }
1879 .dbl-arrow-upper .arrow-cont .second {
1880 margin-top: 5px;
1881 }
1882 .dbl-arrow-upper:hover svg {
1883 animation-name: bounceAlphaUp;
1884 animation-duration: 1.4s;
1885 animation-iteration-count: infinite;
1886 animation-timing-function: linear;
1887 }
1888 .dbl-arrow-upper:hover svg.first {
1889 animation-name: bounceAlphaUp;
1890 animation-duration: 1.4s;
1891 animation-delay: 0.2s;
1892 animation-iteration-count: infinite;
1893 animation-timing-function: linear;
1894 }
1895
1896 @keyframes bounceAlphaUp {
1897 0% {
1898 opacity: 1;
1899 transform: translateY(0) scale(1);
1900 }
1901 25% {
1902 opacity: 0;
1903 transform: translateY(10px) scale(0.9);
1904 }
1905 26% {
1906 opacity: 0;
1907 transform: translateY(-10px) scale(0.9);
1908 }
1909 55% {
1910 opacity: 1;
1911 transform: translateY(0) scale(1);
1912 }
1913 }
1914
1915 /*# sourceMappingURL=el-widgets.css.map */
1916