:root { --bbpc_brand_color: var(--bbpc_brand_color_opt,#0866ff); --border_on_white: #e6edf0; --border_on_highlight: #e6edf0; --body_bg: #fff; --bs-white : #fff; --white_op20: rgba(255, 255, 255, 0.2); --black_25: #f9f9f9; --black_50: #f2f2f2; --black_75: #eeeeee; --black_100: #d6d9dc; --black_150: #c8ccd0; --black_200: #bbc0c4; --black_300: #9fa6ad; --black_350: #9199a1; --black_400: #848d95; --black_500: #6a737c; --black_600: #535a60; --black_700: #3c4146; --black_750: #2f3337; --black_800: #242729; --black_900: #0c0d0e; --bs_sm: 0 1px 2px rgb(0 0 0 / 5%), 0 1px 4px rgb(0 0 0 / 5%), 0 2px 8px rgb(0 0 0 / 5%); --bs_md: 0 1px 3px rgb(0 0 0 / 6%), 0 2px 6px rgb(0 0 0 / 6%), 0 3px 8px rgb(0 0 0 / 9%); --bs_lg: 0 1px 4px rgb(0 0 0 / 9%), 0 3px 8px rgb(0 0 0 / 9%), 0 4px 13px rgb(0 0 0 / 13%); } /** * BBP Core plugin main css file */ .bbpc-attachment-lightbox { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.8); z-index: 9999; width: 100%; margin: auto; padding: 100px 0; display: flex; justify-content: center; align-items: center; box-sizing: border-box; } .bbpc-attachment-lightbox-inner { position: relative; max-width: 85%; display: flex; align-items: center; } .bbpc-attachment-lightbox > .bbpc-attachment-lightbox-inner > span { color: white; font-size: 23px; line-height: 22px; background: red; display: block; height: 28px; border-radius: 19px; width: 28px; text-align: center; top: -15px; right: -15px; bottom: 100%; z-index: 9999999999; position: absolute; cursor: pointer; } /* Voting button CSS */ .bbpc-agree-disagree-buttons button { background: #f0f8ff; border: 1px solid #cee1ef; padding: 0px 15px; height: 45px; color: #333; font-weight: 600; transition: all 0.3s; border-right: none; box-sizing: border-box; display: inline-block; line-height: 9px !important; border-top-right-radius: 0; border-bottom-right-radius: 0; } .bbpc-agree-disagree-buttons button.active:hover:not(.active) { background: #f0f8ff; border-color: #cee1ef; } .bbpc-agree-disagree-buttons button.active { background: var(--bbpc_brand_color); color: #fff; } .bbpc-agree-disagree-buttons span.bbpc-reactions-btn-counter { font-size: 16px; background: #ffffff; border: 1px solid #c0cad2; padding: 0 15px; margin-right: 10px; color: #333; font-weight: 600; transition: all 0.3s; display: inline-block; line-height: 43px; border-left-color: #d5d5d5; width: 42px; text-align: center; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } /* Voting layout css */ .bbpc-voting-liked-wrap { display: grid; grid-template-columns: auto auto; grid-gap: 10px; } .bbpc-voting-liked-wrap .bbpc-voting-liked a { color: #333; font-weight: 600; text-decoration: none; text-transform: capitalize; margin: 5px 0 12px; display: block; padding: 10px; background: #f0f8ff; border: #cee1ef 1px solid !important; box-sizing: border-box; } span.bbpc-agree-disagree-counter-wrap { margin: 18px 0 5px; display: block; } span.bbpc-agree-disagree-counter-wrap .fa-thumbs-up { color: green; font-size: 20px; } span.bbpc-agree-disagree-counter-wrap .fa-thumbs-down { color: red; font-size: 20px; } .bbpc-voting-liked::after, .bbpc-voting-liked-wrap::after { content: ''; display: block; clear: both; } .bbpc-voting-liked-wrap.single-topic-wrap { grid-template-columns: auto; } #bbp-user-body .bbpc-no-voting-wrap:not(:last-child) { display: none; } .bbpc-no-voting-wrap { background: #f1f1f1; padding: 10px 15px; font-weight: 500 !important; font-size: 16px !important; } .bbpc-footer-actions { padding-top: 20px; margin-bottom: 10px; display: flex; flex-direction: column; gap: 15px; } @media screen and (max-width: 768px) { .bbpc-footer-actions, .bbpc-voting-liked-wrap { grid-template-columns: auto; grid-gap: 5px; justify-content: end; position: unset; display: flow-root; } .bbpc-agree-disagree-buttons { display: grid; grid-template-columns: auto auto; grid-gap: 5px; } } .bbpc-agree-disagree-buttons button { position: relative; } .bbpc-agree-disagree-buttons button .bbpc-preloader::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.8; z-index: 9999; background: aliceblue; } .bbpc-agree-disagree-buttons button .bbpc-preloader::after { content: ""; position: absolute; top: 20px; left: 32px; transform: translate(-50%, -50%); border: 5px solid #969696; border-top: 5px solid #bc002b; border-radius: 50%; width: 30px; height: 30px; animation: geo_spin 1s linear infinite; z-index: 10000; right: 0px; margin: auto; text-align: center; background: #ffffff; } @keyframes geo_spin { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } } .bbpc-voting-heading { font-size: 20px; display: block; margin: 0 0 15px; font-weight: 500; } /** === FORUM Info CSS === **/ .bbpc-widget-forum-info { table { img { display: inline; } tr td:last-child { text-align: right; } } } .show_subscribe { .icon_action { font-family: ElegantIcons; font-style: normal; vertical-align: middle; &::before { content: "\e012"; } } } .bbpc-widget-forum-info tr i { vertical-align: middle; margin-right: 5px; } .bbp__success-subscribe .is-subscribed a.subscription-toggle { background: transparent !important; color: #4c4cf1 !important; margin: 0; padding: 0 !important; } .bbp__success-subscribe.alert { border: 1px solid #94e3a1; text-align: center; } .image-details .media-modal-content .search-form button{ transform: scaleX(1); }