PluginProbe
Forumax – AI Powered Advanced Community Forum Plugin / 1.2.7
Forumax – AI Powered Advanced Community Forum Plugin v1.2.7
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 / css / el-widgets.css

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

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