Mode
Production
Development
English
Spanish
French
Arabic
Home
Manage
Members
Member Levels
Networks
Announcements
Email All Members
Abuse Reports
Manage Invites
Manage Tags
Manage Comments
Manage Verifications
Support Inbox
Settings
General Settings
Locale Settings
Profile Questions
Signup Process
Activity Feed Settings
Emoticons
Social Menus
Spam & Banning Tools
Mail Templates
Friendship Settings
Mail Settings
Performance & Caching
Admin Password
Task Scheduler
Iframely Integration
Default Notification Alerts
Default Email Alerts
Storage System
Redirection Settings
TinyMCE Editor Settings
SEO Settings
Plugins
Appearance
Layout Editor
Theme Editor
File & Media Manager
Language Manager
Menu Editor
Banner Manager
Monetization
Ads
Member Subscription Settings
Billing Settings
Orders
Stats
Site-wide Statistics
Referring URLs
Server Information
Log Browser
Facebook Clone Theme
Network Information
Created
January 11, 2020
Version
6.5.2
Home
Appearance
Theme Editor
Theme Editor
More info:
See KB article
Active Theme
Revert
Clone
Save Changes
Facebook Clone Theme
v6.5.2
by SocialEngine Core
Editing File:
theme.css
constants.css
fbclone-custom.css
@include "constants.css"; @include "~/application/modules/Core/externals/styles/main.css"; @scan "application/modules" "externals/styles/main.css" "Core"; /* GLOBAL STYLES, FONTS & RESETS */ html{ min-height:100%; margin-bottom:1px; } body{ background-color:$theme_body_background_color; overflow-x:hidden; font-size:$theme_body_font_size; } *{ padding:0; margin:0; border:none; border-style:solid; border-width:0; border-color:$theme_border_color; box-sizing:border-box; } *::before, *::after{ box-sizing:border-box; } table{ border-collapse:collapse; } br{ clear:both; } ul{ list-style-type:none; } a{ color:$theme_link_color; text-decoration:none; } a:hover{ color:$theme_link_color_hover; text-decoration:none; } *{ font-family:$theme_font_family; } b, strong{ font-weight:600 !important; } *[dir="rtl"]{ direction:rtl; unicode-bidi:embed; } div, td{ color:$theme_font_color; line-height:150%; text-align:$theme_text_align; letter-spacing:0.5px; font-weight:400 !important; } *[dir="rtl"] div, *[dir="rtl"] td{ direction:rtl; unicode-bidi:embed; text-align:right; } h2, h3, h4{ color:$theme_headline_color; font-weight:normal; } h2{ font-size:$theme_headline_size_large; margin-bottom:10px; line-height:130%; font-weight:700; } h3{ font-size:$theme_headline_size_medium; padding:.4em 0; } h4{ font-weight:400; border-bottom:1px solid $theme_border_color; padding:.5em 0px .5em 0px; margin-bottom:10px; font-size:110%; } h3.sep{ display:block; overflow:hidden; margin-bottom:1em; height:1em; } h3.sep > span{ display:block; overflow:hidden; position:absolute; padding:5px 10px 5px 0px; font-weight:600 !important; } [dir="rtl"] h3.sep > span{ padding:5px 0px 5px 10px; } /*GENERAL LAYOUT*/ .generic_layout_container > h3{ text-transform:capitalize; margin:-15px -15px 0; padding:15px; position:relative; font-weight:600 !important; font-family:$theme_box_header_font_family; font-size:$theme_box_header_font_size; background-color:$theme_list_background_color; border-radius:$theme_widget_radius $theme_widget_radius 0 0; } .layout_left > .generic_layout_container, .layout_middle > .generic_layout_container, .layout_right > .generic_layout_container, .layout_core_container_tabs > div.generic_layout_container{ padding:15px; background-color:$theme_list_background_color; margin-bottom:$theme_box_space; border-radius:$theme_widget_radius; +boxborder; } #global_wrapper .layout_middle > .layout_core_container_tabs{ border-width:0 !important; background:none !important; padding:0 !important; box-shadow:inherit !important; } .layout_core_container_tabs .activity-post-container{ border-radius:$theme_widget_radius; } .layout_left{ float:left; width:$theme_content_columns_left_width; padding:0px 20px 0px 0; vertical-align:top; } [dir="rtl"] .layout_left{ float:right; padding:0px 0 0px 20px; } .layout_middle{ overflow:hidden; padding:0; vertical-align:top; } .layout_right{ float:right; width:$theme_content_columns_right_width; padding:0px 0 10px 20px; vertical-align:top; } [dir="rtl"] .layout_right{ float:left; padding:0px 20px 10px 0; margin-left:0px; } #global_wrapper{ text-align:center; padding-top:20px; } #global_content{ overflow:hidden; min-height:90vh; box-sizing:border-box; margin:0 auto; width:$theme_content_width; } #global_content_simple{ display:inline-block; overflow:hidden; } /* Header */ .layout_page_header{ background-color:$theme_topbar_background_color; position:fixed; top:0; right:0; left:0; z-index:9; box-shadow:0 1px 3px rgba(17, 24, 39, .1); } .layout_page_header .container{ max-width:100%; padding:0 15px; } .fbclone_header_inner{ display:flex; align-items:center; justify-content:space-between; } .header_left{ display:flex; align-items:center; justify-content:flex-start; } /*Header Logo*/ .header_logo_contrast, .dark_mode .header_logo, .light_mode .header_logo{ display:none; } .dark_mode .header_logo_contrast, .light_mode .header_logo_contrast{ display:block; } .header_logo a, .header_logo_contrast{ font-size:1.2rem; font-weight:600 !important; color:$theme_topbar_menu_link_hover_color; } .header_logo a:hover, .header_logo_contrast:hover{ text-decoration:none; } .header_logo img{ max-width:100%; max-height:46px; } .header_logo_contrast img{ width:100%; max-height:46px; } /*Header Search*/ .header_search{ margin-left:15px; } [dir="rtl"] .header_search{ margin-left:0; margin-right:15px; } .layout_core_search_mini #global_search_form{ padding:0; position:relative; margin:auto; background:none !important; } .layout_core_search_mini #global_search_field{ outline:none; border-width:0; padding:10px 15px; border-radius:50px; padding-right:38px; min-height:40px; background-color:$theme_header_search_background_color; color:$theme_header_search_font_color; width:220px; border:0px solid $theme_header_search_background_color !important; transition:0.5s; } [dir="rtl"] .layout_core_search_mini #global_search_field{ padding-right:15px; padding-left:38px; } .layout_core_search_mini #global_search_form button{ background-color:transparent; border-width:0; color:$theme_header_search_font_color; height:38px; width:38px; font-size:15px; border-width:0 !important; top:50%; transform:translateY(-50%); padding:0 !important; margin:0 !important; } .layout_core_search_mini #global_search_form button *{ color:$theme_font_color_light !important; } /*Main Menu*/ .fbclone_main_menu .layout_core_menu_main .navbar{ padding:0; } .fbclone_main_menu .navigation{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; } .fbclone_main_menu .navigation > li{ position:relative; } .fbclone_main_menu .navigation > li + li{ margin-left:2px; } [dir="rtl"] .fbclone_main_menu .navigation > li + li{ margin-left:0px; margin-right:2px; } .fbclone_main_menu .navigation > li > .menu_core_main{ +noselect; padding:0px 6px; margin:0; outline:none; font-weight:400; display:flex; align-items:center; position:relative; color:$theme_topbar_menu_link_color; font-size:$theme_topbar_menu_link_size; } .layout_core_menu_main .navigation > li .main_menu_focused{ pointer-events:none; } .layout_core_menu_main .navigation > li a:focus-visible{ color:$theme_topbar_menu_link_color; } .layout_core_menu_main .navigation > li > a:link, .layout_core_menu_main .navigation > li > a:visited{ color:$theme_topbar_menu_link_color; } .fbclone_main_menu .navigation > li > .menu_core_main > i{ font-family:"Font Awesome 5 Free"; } .fbclone_main_menu .navigation > li > .menu_core_main > span{ font-family:$theme_topbar_menu_font_family; min-height:54px; display:flex; align-items:center; padding:0 5px; } .fbclone_main_menu .navigation > li:hover > .menu_core_main, .fbclone_main_menu .navigation > li.active > a, .fbclone_main_menu .navigation > li.active > a *{ color:$theme_topbar_menu_link_hover_color !important; } .fbclone_main_menu .navigation > li.active > a{ border-bottom:3px solid $theme_topbar_menu_link_hover_color !important; } .fbclone_main_menu .navigation > li.more_tab > a > i{ font-size:0.75em; vertical-align:middle; } .fbclone_main_menu .mobile_navigation{ display:none; } /*Main Menu Sub Menu*/ ul.main_menu_submenu{ background-color:$theme_list_background_color; -webkit-filter:drop-shadow(0 2px 4px rgba(44, 101, 144, 0.5)); filter:drop-shadow(0 2px 4px rgba(44, 101, 144, 0.5)); position:absolute; min-width:150px; z-index:98; max-height:80vh; overflow:auto; right:0; top:55px; border-radius:5px; display:none; padding:10px 0; } [dir="rtl"] ul.main_menu_submenu{ right:auto; left:0; } ul.main_menu_submenu.showmenu{ display:block; } ul.main_menu_submenu > li > a{ position:relative; display:block; outline:none; overflow:hidden; white-space:nowrap; text-decoration:none; text-transform:capitalize; padding:8px 15px; color:$theme_topbar_menu_link_color; font-size:$theme_topbar_menu_link_size; } ul.main_menu_submenu > li > a:hover{ background-color:$theme_list_background_color_hover; } ul.main_menu_submenu > li > a:hover *{ color:$theme_topbar_menu_link_hover_color !important; } ul.main_menu_submenu > li > a > i{ color:$theme_font_color_light; opacity:.8; margin-right:3px; } [dir="rtl"] ul.main_menu_submenu > li > a > i{ margin-left:3px; margin-right:0; } ul.main_menu_submenu > li > a span{ font-family:$theme_topbar_menu_font_family; } /*Mini Menu*/ .layout_core_menu_mini{ display:flex; justify-content:space-between; align-items:center; } #core_menu_mini_menu > ul{ display:flex; align-items:center; justify-content:flex-start; } #core_menu_mini_menu > ul > li{ position:relative; } #core_menu_mini_menu > ul > li + li{ margin-left:8px; } [dir="rtl"] #core_menu_mini_menu > ul > li + li{ margin-left:0px; margin-right:8px; } #core_menu_mini_menu > ul > li a.show_icons{ display:block; font-size:1em; width:38px; height:38px; line-height:38px; border-radius:50px; text-align:center; color:$theme_topbar_minimenu_icon_font_color; background-color:$theme_topbar_minimenu_icon_background_color; font-family:$theme_topbar_menu_font_family; transition:0.5s; } #core_menu_mini_menu > ul > li a.show_icons:hover{ color:$theme_topbar_minimenu_icon_font_hover_color; background-color:$theme_topbar_minimenu_icon_background_hover_color; text-decoration:none; } #core_menu_mini_menu > ul > li.core_mini_menu_profile > a > .bg_thumb_icon{ border-width:0; margin:0; width:100% !important; height:100% !important; background-color:transparent !important; } #core_menu_mini_menu > ul > li.core_mini_menu_profile > a > .bg_thumb_icon:before{ font-size:0.9em; color:$theme_topbar_minimenu_icon_font_color; } #core_menu_mini_menu > ul > li.core_mini_menu_profile > a:hover > .bg_thumb_icon:before{ color:$theme_topbar_minimenu_icon_font_hover_color; } #core_menu_mini_menu > ul > li.core_mini_menu_profile > a ._linktxt:after{ content:"\\f0dd"; font-family:'Font Awesome 5 Free'; font-weight:700; margin-left:3px; line-height:0; position:relative; top:-1px; } [dir="rtl"] #core_menu_mini_menu > ul > li.core_mini_menu_profile > a ._linktxt:after{ margin-left:0; margin-right:3px; } #core_menu_mini_menu > ul > li a:focus-visible{ outline:0; } #core_menu_mini_menu > ul > li .show_icons i.minimenu_icon{ width:100% !important; height:100% !important; } #core_menu_mini_menu > ul > li .show_icons i.minimenu_icon:before{ padding:0; border-radius:0; font-weight:900; display:flex; align-items:center; justify-content:center; } #core_menu_mini_menu > ul > li a.show_icons span._linktxt{ display:none; } .core_settings_dropdown{ width:230px; margin-left:-186px; } [dir="rtl"] .core_settings_dropdown{ margin-left:0; margin-right:-186px; } #core_menu_mini_menu > ul > li a.show_icons i.minimenu_icon:before{ font-size:1em !important; } #core_menu_mini_menu > ul .core_mini_auth, #core_menu_mini_menu > ul .core_mini_signup{ padding:10px 18px; border-radius:5px !important; height:38px !important; line-height:normal !important; align-items:center; } #core_menu_mini_menu .core_settings_dropdown > ul > li i.menuicon{ width:34px; height:34px; color:$theme_topbar_minimenu_icon_font_color; background-color:$theme_topbar_minimenu_icon_background_color; } #core_menu_mini_menu .core_settings_dropdown > ul > li i.menuicon::before, #core_menu_mini_menu .core_settings_dropdown > ul > li > a i.menuicon span.bg_thumb_icon:before{ color:$theme_topbar_minimenu_icon_font_color !important; } .core_settings_dropdown > ul > li > * > span{ color:$theme_topbar_minimenu_icon_font_color !important; } #core_menu_mini_menu > ul > li a.core_mini_auth, .light_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons{ background-color:$theme_button_background_color !important; color:$theme_button_font_color !important; border-color:$theme_button_background_color !important; border-width:1px !important; } #core_menu_mini_menu > ul > li a.core_mini_auth *, .light_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons *, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons *{ color:$theme_button_font_color !important; } #core_menu_mini_menu > ul > li a.core_mini_auth:hover, .light_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons:hover, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons:hover{ background-color:$theme_button_background_color_hover !important; color:$theme_button_font_color !important; } #core_menu_mini_menu > ul > li a.core_mini_auth:hover *, .light_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons:hover *, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_auth.show_icons:hover *{ color:$theme_button_font_color !important; } #core_menu_mini_menu > ul > li a.core_mini_signup, .light_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons{ background-color:$theme_lp_signup_button_color !important; color:$theme_lp_signup_button_font_color !important; border-color:$theme_lp_signup_button_border_color !important; border-width:1px !important; } #core_menu_mini_menu > ul > li a.core_mini_signup *, .light_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons *, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons *{ color:$theme_lp_signup_button_font_color !important; } #core_menu_mini_menu > ul > li a.core_mini_signup:hover, .light_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons:hover, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons:hover{ background-color:$theme_lp_signup_button_hover_color !important; color:$theme_lp_signup_button_hover_font_color !important; } #core_menu_mini_menu > ul > li a.core_mini_signup:hover *, .light_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons:hover *, .dark_mode #core_menu_mini_menu > ul > li a.core_mini_signup.show_icons:hover *{ color:$theme_lp_signup_button_hover_font_color !important; } #core_menu_mini_menu > ul .core_mini_auth i, #core_menu_mini_menu > ul .core_mini_signup i{ display:none !important; } #core_menu_mini_menu > ul > li.core_mini_menu_accessibility .show_icons i.minimenu_icon:before{ font-size:1.2em !important; } /*Count Bubble*/ .minimenu_update_count_bubble, .minimenu_message_count_bubble{ width:16px; height:16px; min-width:16px; font-size:9px; text-align:center !important; line-height:15px; padding:0; margin-left:1px; left:50%; margin-top:-3px !important; z-index:1; } [dir="rtl"] .minimenu_update_count_bubble, [dir="rtl"] .minimenu_message_count_bubble{ margin-left:auto; margin-right:1px; right:50%; left:auto; } .minimenu_update_count_bubble_active, .minimenu_message_count_bubble{ display:block; } /*Mini Menu Pulldown*/ .header_menu_mini .pulldown_contents_wrapper{ right:0; margin-right:0 !important; margin-left:0 !important; } [dir="rtl"] .header_menu_mini .pulldown_contents_wrapper{ right:auto; left:0; } .core_pulldown_header{ font-weight:600 !important; } .pulldown_contents > ul > li:hover, .pulldown_contents > ul > .notifications_unread, ul.notifications > li.notifications_unread, .pulldown_contents > ul > .pulldown_content_list_highlighted{ background-color:$theme_list_background_color_alt !important; transition:0.5s; } .header_menu_mini .pulldown_contents_wrapper, .core_settings_dropdown{ margin-top:52px; } .pulldown_options a:hover{ text-decoration:none; } .header_menu_mini .mini_menu_currency_chooser .dropdown-menu{ margin-top: 12px !important; } /* Footer */ #global_footer{ background-color:$theme_footer_background_color; } .layout_page_footer{ margin:0px auto; } .footer_link_bottom{ margin-top:15px; } .footer_link_bottom li a{ margin-top:20px; display:block; padding-left:22px; position:relative; transition:0.5s; } [dir="rtl"] .footer_link_bottom li a{ padding-left:0; padding-inline-start:22px; } .footer_link_bottom li a::after{ content:''; position:absolute; width:14px; height:14px; border-radius:50px; background-color:$theme_base_color; top:4px; left:0; opacity:0.15; } [dir="rtl"] .footer_link_bottom li a::after{ left:auto; right:0; } .footer_link_bottom li a::before{ content:'\\f101'; position:absolute; color:$theme_base_color; top:6px; left:3.5px; font-family:"Font Awesome 5 Free"; font-weight:900 !important; font-size:9px; line-height:normal !important; } [dir="rtl"] .footer_link_bottom li a::before{ content:'\\f100'; left:auto; right:3px; } .footer_link_bottom li a:hover{ color:$theme_base_color; text-decoration:none; } .layout_core_menu_footer a{ color:$theme_footer_link_color; } .layout_page_footer *{ color:$theme_footer_link_color; } .layout_page_footer .footer_copyright{ color:$theme_footer_font_color; } .fbclone_footer_contact_inner{ margin-top:15px; } .fbclone_footer_contact_inner li{ margin-top:20px; display:block; position:relative; transition:0.5s; display:flex; align-items:center; } .fbclone_footer_contact_inner li i{ width:24px; height:24px; border-radius:50px; display:inline-flex; align-items:center; justify-content:center; font-size:0.85em; margin-right:8px; color:$theme_button_font_color !important; background-color:$theme_button_background_color !important; } [dir="rtl"] .fbclone_footer_contact_inner li i{ margin-left:8px; margin-right:0; } .fbclone_footer_contact_inner li span{ flex:1; } .fbclone_footer_bottom{ padding:16px 0; } .fbclone_footer_bottom_inner{ display:flex; align-items:center; } .fbclone_footer_bottom_left{ display:flex; align-items:center; justify-content:flex-start; font-size:$theme_font_size_small; flex-wrap:wrap; } .fbclone_footer_bottom_left .menu_core_footer{ margin-left:30px; position:relative; text-decoration:none; } [dir="rtl"] .fbclone_footer_bottom_left .menu_core_footer{ margin-left:0; margin-right:30px; } .fbclone_footer_bottom_left .menu_core_footer::after{ content:''; position:absolute; width:6px; height:6px; border-radius:50px; left:-20px; top:6px; background-color:$theme_footer_link_color; transition:0.5s; } [dir="rtl"] .fbclone_footer_bottom_left .menu_core_footer::after{ left:auto; right:-20px; } .fbclone_footer_bottom_left .menu_core_footer:hover::after{ background-color:$theme_base_color; } .fbclone_footer_bottom .language_chooser .language_chooser_btn{ border-color:$theme_footer_link_color; color:$theme_footer_link_color; font-size:$theme_font_size_small; padding:5px 10px; margin:0 0 0 6px; } [dir="rtl"] .fbclone_footer_bottom .language_chooser .language_chooser_btn{ margin:0 6px 0 0px; } .footer_donotsell{ margin-top:6px; font-weight:400; font-size:0.9rem; display:flex; align-items:center; font-size:$theme_font_size_small; } .footer_donotsell input{ margin-top:0 !important; } .fbclone_footer_bottom_right{ flex:1; justify-content:flex-end; margin-left:15px; display:flex; } [dir="rtl"] .fbclone_footer_bottom_right{ margin-left:0; margin-right:15px; } .footer_social_links{ padding:0 5px; } .footer_social_links h6{ font-weight:600 !important; color:$theme_footer_font_color; } .footer_social_links .navigation{ display:flex; align-items:center; justify-content:flex-start; margin:0px -6px 0; } .footer_social_links .navigation li{ padding:0 6px; } .footer_social_links .navigation li a{ width:34px; height:34px; display:flex; align-items:center; justify-content:center; border-radius:50px; background-color:$theme_list_background_color; color:$theme_base_color; font-size:16px; box-shadow:0 0 6px rgba(0, 0, 0, .15); transition:0.5s; border-width:1px; } .footer_social_links .navigation li a:hover{ text-decoration:none; opacity:0.8; } .footer_social_links .navigation li a *{ color:$theme_base_color !important; } .footer_social_links .navigation li a i{ font-style:normal; font-family:"Font Awesome 5 Brands"; line-height:normal; } .footer_social_links .navigation li .core_social_site_twitter svg{ width:16px; height:16px; fill:$theme_base_color; } .footer_social_links .navigation li .core_social_site_twitter i::before{ display:none; } .layout_core_mobile_apps_links{ padding-bottom:16px; } .layout_core_mobile_apps_links h3{ text-align:center !important; background:transparent !important; } .layout_page_footer .core_mobile_app_link{ display:flex; justify-content:center } /* GLOBAL NOTICES (OUTSIDE FORMS) Used to show a message or notice with an icon on a page, usually above content, not within a form. */ .tip{ overflow:hidden; clear:both; } .tip > span{ border-radius:5px; background-color:$theme_list_background_color_alt; border-width:1px; display:inline-block; padding:.5em .9em; float:left; margin-bottom:15px; } .tip > span:before{ content:"\\f0eb"; font-family:'Font Awesome 5 Free'; margin-right:5px; color:$theme_base_color; } [dir="rtl"] .tip > span{ float:right; } [dir="rtl"] .tip > span:before{ margin-right:0px; margin-left:5px; } .tip > span > a{ color:$theme_button_background_color; } /* GLOBAL FORM RESPONSES Used to show feedback from form submissions, i.e. error/result messages. */ ul.form-errors, ul.form-notices{ margin:0px 0px 20px 0px; overflow:hidden; } * + ul.form-errors, * + ul.form-notices{ margin-top:20px; } ul.form-errors > li, ul.form-notices > li{ + rounded; margin:7px 5px 7px 5px; padding:10px 15px 10px 15px; max-width:600px; overflow:hidden; border:1px solid #ccc; color:#464646 !important; box-sizing:border-box; } [dir="rtl"] ul.form-errors > li, [dir="rtl"] ul.form-notices > li{ float:right; clear:right; } ul.form-errors > li > b, ul.form-notices > li > b{ text-transform:uppercase; font-size:90%; } ul.form-errors > li > ul > li, ul.form-notices > li > ul > li{ font-size:90%; font-weight:600 !important; } ul.form-errors > li{ background-color:#f5f0db; border:none; } ul.form-errors > li:before{ content:"\\f071"; font-family:'Font Awesome 5 Free'; margin-right:5px; color:#FF9800; font-weight:900 !important; float:left; } [dir="rtl"] ul.form-errors > li:before{ margin-right:0px; margin-left:5px; } ul.form-notices > li{ background-color:#e9faeb; border:none; } ul.form-notices > li:before{ content:"\\f00c"; font-family:'Font Awesome 5 Free'; margin-right:5px; color:#4CAF50; font-weight:900 !important; } [dir="rtl"] ul.form-notices > li:before{ margin-right:0px; margin-left:5px; } /* GLOBAL FORM ELEMENTS Used for most forms throughout the site. */ button{ border-radius:$theme_widget_radius; background-color:$theme_button_background_color; color:$theme_button_font_color; padding:.5em .8em; font-size:100%; border:none; transition:all .2s ease-in-out; outline:none !important; } button:hover, button:focus-visible{ background-color:$theme_button_background_color_hover; cursor:pointer; opacity:.8; transition:all .2s ease-in-out; } button:active{ background-color:$theme_button_background_color_active; background-image:none; } .btn-primary{ font-size:0.85em; padding:10px; } .btn-primary i{ font-size:0.90em; } input[type=text], input[type=email], input[type=password], input.text, textarea, .global_form .selectize-input{ background-color:$theme_input_background_color; color:$theme_input_font_color; border-width:1px; border-color:$theme_input_border_colors; padding:10px 15px; resize:none; box-sizing:border-box; outline-width:0; border-radius:$theme_widget_radius; min-height:44px; box-shadow:inherit !important; font-size:$theme_body_font_size; } input[type=password]{ font-family:Arial, Helvetica, sans-serif; } .global_form .selectize-input input{ color:$theme_input_font_color; min-height:auto; } .global_form .selectize-input.items.has-options{ display:flex; align-items:center; flex-wrap:wrap; } input:focus-visible, select:focus-visible, textarea:focus-visible, select:focus-visible{ outline:none; } /* ::placeholder{ color:$theme_input_font_color; opacity:1; } */ input[type=checkbox], input[type=radio]{ border:none; padding:0px; margin:4px 5px 0 0; width:auto; display:block; float:left; } [dir="rtl"] input[type=checkbox], [dir="rtl"] input[type=radio]{ margin:4px 0 0 5px; float:right; } input[type=checkbox] + label, input[type=radio] + label{ display:block; cursor:pointer; } textarea{ width:100%; resize:none; } textarea.codebox{ width:95%; min-height:200px; font-family:courier new, courier, serif; } select{ + rounded(2px); background-color:$theme_input_background_color; color:$theme_input_font_color; border-width:1px; border-color:$theme_input_border_colors; padding:10px 15px; padding-right:20px; box-sizing:border-box; outline-width:0; border-radius:$theme_widget_radius; min-height:48px; font-size:$theme_body_font_size; font-family:Arial, Helvetica, sans-serif; } [dir="rtl"] select{ padding:10px 15px; padding-right:20px; } select option{ padding:0px 10px 0px 3px; font-family:Arial, Helvetica, sans-serif; } [dir="rtl"] select option{ padding:0px 3px 0px 10px; } a.buttonlink{ display:inline-block; font-size:$theme_font_size; } a.buttonlink_right{ font-weight:600 !important; display:inline-block; } a.buttonlink:hover a.buttonlink_right:hover{ text-decoration:none; } br.multi-text-separator{ margin-bottom:8px; } .selectize-control .selectize-dropdown{ border-width:0; } /*IM text area */ textarea.im_menu_convo_input{ padding:0px !important; } [id*='_index-create'] .selectize-dropdown-content{ border-width:1px; } /* LARGE BOX FORM These styles are for large forms that are given an exclusive page. They are not intended for smaller forms that are embedded elsewhere. Examples:Signup form, member settings form, etc. */ /* form container */ .global_form{ clear:both; } /* external form border */ .global_form > div{ margin:0px auto 0px auto; } /* internal form border */ .global_form > div > div{ border:0px solid $theme_form_border_color; padding:0px; background-color:$theme_form_background_color; box-sizing:border-box; } .global_form > div > div h3{ font-family:$theme_box_header_font_family; margin:-20px -20px 20px; padding:20px 20px 0; border-radius:$theme_widget_radius; font-size:$theme_headline_size_medium; font-weight:600; } .global_form > div .form-elements{ overflow:hidden; } /* form headline */ .global_form div.form-wrapper-heading{ font-weight:600 !important; border-bottom:1px solid $theme_foreground_border_color_light; min-height:2em; margin-bottom:15px; } .global_form div.form-wrapper-heading > span{ display:block; position:absolute; overflow:hidden; padding:4px 6px 4px 0px; font-size:110%; background:$theme_list_background_color; } [dir="rtl"] .global_form div.form-wrapper-heading > span{ padding:4px 0px 4px 6px; } #messages_compose .overTxtLabel{ margin-top:8px; } .layout_user_browse_search .browse-range-wrapper select{ width:46%; margin-right:5px; } .global_form div.form-wrapper + div.form-wrapper-heading{ margin-top:10px; } .activity-post-container .compose-body select{ min-width:100%; } #compose-video-body button#compose-video-form-submit{ padding:12px 30px; } .messages_compose_popup #compose-link-body{ display:flex; align-items:flex-start; flex-wrap:wrap; } [dir="rtl"] #compose-photo-form-fancy-file{ float:right; } .messages_compose_popup div#compose-music-menu{ margin-top:10px; } /* form instructions (after title) */ .global_form > div > div > h3 + p{ font-size:0.90em; margin-top:2px; max-width:100%; line-height:140%; box-sizing:border-box; } /* container row for a label (left) and element (right) */ .global_form div.form-wrapper{ clear:both; overflow:hidden; } /* left-side element label container */ .global_form div.form-label{ padding:4px 15px 0px 0; margin-bottom:5px; overflow:hidden; font-weight:400 !important; color:$theme_form_label_font_color; letter-spacing:0.5px; } [dir="rtl"] .global_form div.form-label{ padding-right:4px 0 0px 15px; } /* right-side form element container */ .global_form div.form-element{ min-width:600px; max-width:600px; text-align:left; margin-bottom:10px; overflow:hidden; float:left; clear:none; } [dir="rtl"] .global_form div.form-element{ text-align:right; float:right; } /* all paragraphs of text in the form */ .global_form div > p{ padding-bottom:10px; } /* paragraphs of text that come after an input element */ .global_form div > input + p, .global_form div > select + p{ margin-top:5px; font-size:$theme_font_size_small; } /* all text inputs in form */ .global_form input[type=text], .global_form input[type=email], .global_form input[type=password], .global_form .selectize-input, .global_form select{ width:100%; } /* only for text inputs that come after other text inputs */ /* i.e. for when there is a vertical list of text inputs */ .global_form input[type=text] + input[type=text]{ display:block; margin-top:5px; } /* all checkboxes and radios in form */ .global_form div.form-element .form-options-wrapper{ width:100%; } .global_form input[type=checkbox], .global_form input[type=radio]{ clear:left; } [dir="rtl"] .global_form input[type=checkbox], [dir="rtl"] .global_form input[type=radio]{ clear:right; } /* for clickable labels that appear to the right of elements */ /* such as checkboxes or radios */ .global_form input + label{ float:left; display:block; margin-top:0px; margin-left:2px; } [dir="rtl"] .global_form input + label{ float:right; margin-left:0px; margin-right:2px; } /* all textareas in form */ .global_form textarea{ padding:8px; max-width:100%; min-height:120px; } .global_form p.description{ margin:5px 0px; padding:0; font-size:$theme_font_size_small; } .global_form #submit-element{ margin-bottom:0px; } .global_form button[type=submit]{ margin-right:3px; } [dir="rtl"] .global_form button[type=submit]{ margin-right:0px; margin-left:3px; } /* Required field asterisk */ .form-label .required::after, label.required::after{ content:' *'; color:#f00; } #global_page_user-signup-index .form-label .required::after, #global_page_user-signup-index label.required::after{ position:absolute } /* SMALL BOX FORM These styles are for small box forms, such as the login box found by default on the main index page. Form names and inputs are stacked vertically (not floated) to fit into small-width content areas. */ .global_form_box{ + foreground; + rounded; width:auto; } .global_form_box > div > ul > li + li, .global_form_box .form-wrapper + .form-wrapper{ margin-top:10px; } .global_form_box .form-label{ padding:0px; width:auto; float:none; clear:both; margin:0px; } .global_form_box label{ text-align:left; display:block; margin-bottom:2px; } [dir="rtl"] .global_form_box label{ text-align:right; } .global_form_box .form-element{ overflow:hidden; } /* FILTER FORM These styles are for small, transparent forms that contain search boxes or filter fields. They are usually found on browse pages. */ form.filters{ + foreground; + rounded; } form.filters div.form-label{ margin-bottom:3px; font-size:90%; } form.filters div.form-element{ margin-top:2px; margin-bottom:10px; } form.filters button{ margin-top:4px; } form.filters dt{ font-size:90%; padding-bottom:2px; } form.filters dd{ margin-bottom:8px; } /* POPUP FORM These are used to style popup (i.e. smoothbox) forms. Also used to style popup response messages, etc. */ #smoothbox_window body{ background-color:$theme_list_background_color; } .global_form_popup{ padding:10px 10px 10px 13px; overflow:hidden; } [dir="rtl"] .global_form_popup{ padding:10px 13px 10px 10px; float:right; } .global_form_popup #submit-wrapper, .global_form_popup #cancel-wrapper{ float:left; overflow:hidden; } [dir="rtl"] .global_form_popup #submit-wrapper, [dir="rtl"] .global_form_popup #cancel-wrapper{ float:right; } .global_form_popup #buttons-wrapper{ margin-top:10px; } .global_form_popup #buttons-wrapper button{ margin-right:4px; } [dir="rtl"] .global_form_popup #buttons-wrapper button{ margin-right:0px; margin-left:4px; } .global_form_popup_message{ display:block; padding:1em; text-align:center; font-weight:600 !important; } /* UPLOAD FORM Styles the file upload form. */ #form-upload #submit-wrapper{ display:none; } #form-upload #demo-status a.buttonlink{ margin-right:15px; } /* SEARCH PAGE Used to style the main search page. */ #searchform{ padding:5px; } #searchform input[type=text]{ width:300px; min-height:46px; } #searchform select{ min-height:46px; } #searchform #query-label{ display:none; } #searchform #query-wrapper{ float:left; overflow:hidden; padding:3px; } [dir="rtl"] #searchform #query-wrapper{ float:right; } #searchform #submit-label{ display:none; } #searchform #submit-wrapper{ float:left; overflow:hidden; margin-left:1px; } [dir="rtl"] #searchform #submit-wrapper{ float:right; margin-right:1px; margin-left:0px; } .search_result{ overflow:hidden; width:100%; border-top-width:1px; padding:10px; display:flex; align-items:flex-start; justify-content:flex-start; flex-wrap:wrap; } .search_result .search_photo{ display:block; float:left; overflow:hidden; margin-right:10px; } [dir="rtl"] .search_result .search_photo{ float:right; margin-right:0; margin-left:10px; } .search_result .search_info{ display:block; overflow:hidden; flex:1; } .search_result .search_info p{ margin-bottom:0px; font-size:90%; } .search_result .search_title{ font-size:100%; } .search_result .highlighted-text{ font-weight:600 !important; } #searchform button#submit{ padding:12px 22px; } #searchform + br{ display:none; } /* COMMENTS These styles are used everywhere comments appear. */ .comments{ margin:5px -15px 0; } .comments .comments_options{ margin:0 10px 10px; } .comments .comments_options > span, .comments .comments_options > a{ margin:0 5px; } .comments > ul{ border-radius:0 0 $theme_widget_radius $theme_widget_radius; background-color:$theme_comments_background_color; overflow:hidden; } .comments > ul > li{ background-image:none; padding:10px 15px; overflow:hidden; } .comments > ul > li + li{ border-top-width:1px; border-color:$theme_border_color; } .comments ul ul > li{ display:inline-block; vertical-align:middle; } .comments .comments_author a{ font-weight:600 !important; margin-right:2px; } [dir="rtl"] .comments .comments_author a{ margin-right:0px; margin-left:2px; } [dir="rtl"] .comments_author{ float:right; } .comments .comments_author_photo{ float:left; overflow:hidden; line-height:0px; font-size:0px; } [dir="rtl"] .comments .comments_author_photo{ float:right; } .comments .comments_options{ font-weight:600 !important; font-size:$theme_font_size_small; color:$theme_font_color_light; } .comments .comments_comment_options > a{ font-size:$theme_font_size_small; font-weight:600 !important; margin-top:5px; overflow:hidden; } .comments .comments_info{ font-size:$theme_font_size_small; padding-left:10px; overflow:hidden; } [dir="rtl"] .comments .comments_info{ padding-left:0px; padding-right:5px; } .comments .comments_date{ font-size:$theme_font_size_small; color:$theme_font_color_light; overflow:hidden; padding-top:2px; } .comments .comments_date li.sep{ margin:0 2px; } .comments .comments_date li > a:before{ display:none; } .comments > form{ background-image:none; border-width:1px 0 0; padding:10px 15px; } .comments > form .compose-content{ border-width:1px; padding:10px; border-radius:$theme_widget_radius; } .comments > form > textarea{ width:100%; min-height:50px !important; } .comments > form > button{ display:block; margin-top:7px; padding:8px 14px; } div.comments_comment_likes_tips{ border:1px solid $theme_foreground_border_color; padding:4px 7px; background-color:$theme_foreground_background_color; color:$theme_font_color_light; font-size:0.9em; } /* HEADLINE Used at the top of most browse pages. Often contains button-style tabs. */ .headline h2{ margin:0px 20px 0px 0; display:inline-block; vertical-align:middle; font-size:1.4rem; font-weight:600; } [dir="rtl"] .headline h2{ margin:0px 0 12px 0px; } /* TABS (BUTTON STYLE, DEFAULT) */ .tabs{ overflow:hidden; display:inline-block; vertical-align:middle; margin-left:20px; } [dir="rtl"] .tabs{ margin-left:0px; margin-right:20px; } .tabs > ul{ display:inline-block; vertical-align:middle; } .tabs > ul > li{ margin-right:5px; display:inline-block; vertical-align:middle; } [dir="rtl"] .tabs > ul > li{ margin-right:0px; margin-left:5px; } .tabs > ul > li > a{ display:inline-block; color:$theme_buttontabs_font_color; background-color:$theme_buttontabs_background_color; padding:8px 15px; font-size:$theme_tabs_font_size; font-family:$theme_buttontabs_font_family; transition:0.5s; border-radius:5px; } .tabs > ul > li.active > a, .tabs > ul > li > a:hover{ color:$theme_buttontabs_font_color_active !important; background-color:$theme_buttontabs_background_color_active !important; text-decoration:none; } .tabs > ul > li > a:focus-visible{ color:$theme_buttontabs_font_color_active !important; background-color:$theme_buttontabs_background_color_active !important; outline-offset:unset !important; outline:inherit !important; } .tabs > ul > li.active > a:hover{ text-decoration:none; } /* TABS (TAB STYLE, NON-DEFAULT) */ .tabs_alt{ background-color:transparent; background-image:none; padding:0px; -moz-user-select:none; -webkit-user-select:none; } .tabs_alt > ul{ border-width:1px; display:flex; align-items:center; justify-content:flex-start; margin:0 0 15px; padding:8px 5px; background:$theme_list_background_color; border-radius:+rounded($theme_widget_radius); overflow:hidden; } .tabs_alt > ul > li + li{ margin-left:4px; } [dir="rtl"] .tabs_alt > ul > li + li{ margin-left:0; margin-right:4px; } .tabs_alt > ul > li > a:focus-visible{ color:$theme_tabs_font_color_active; background-color:$theme_tabs_background_active_color; } .tabs_alt > ul > li > a{ text-decoration:none; color:$theme_tabs_font_color; outline:none; padding:10px 15px !important; display:inline-block; font-weight:normal; margin-bottom:-1px; transition:0.5s; font-family:$theme_tabs_font_family; font-size:$theme_tabs_font_size; border-bottom:3px solid transparent !important; } .tabs_alt > ul > li.tab_active > a, .tabs_alt > ul > li.active > a, .tabs_alt > ul > li > a:hover{ border-bottom:3px solid $theme_tabs_border_color_active !important; color:$theme_tabs_font_color_active !important; position:relative; } .tabs_alt > ul > li.active > a:hover{ border-bottom:3px solid $theme_tabs_border_color_active !important; } .tabs_alt > ul > li > a:focus-visible{ border-bottom:3px solid $theme_tabs_border_color_active; color:$theme_tabs_font_color_active !important; } .tabs_alt > ul > li > a span{ font-size:90%; font-weight:normal; margin-left:4px; border:none; } [dir="rtl"] .tabs_alt > ul > li > a span{ margin-left:0px; margin-right:4px; } .tab_container_inactive{ display:none; } .tabs_alt > ul > li.tab_open > a{ border-bottom:none; background-color:$theme_pulldown_background_color_active !important; color:$theme_pulldown_font_color_active !important; position:relative; padding:7px 9px 7px 9px; } .tabs_alt > ul > li.tab_open > a:focus-visible{ background-color:$theme_pulldown_background_color_active !important; } .tab_pulldown_contents_wrapper{ +rounded(3px, true, false, false, false); overflow:hidden; margin-top:0px !important; display:none; } .tab_pulldown_contents{ +boxborder; border-radius:5px; overflow:hidden; background:$theme_pulldown_contents_background_color; position:absolute; z-index:1; } .tab_pulldown_contents > ul{ min-width:150px; } .tab_pulldown_contents > ul > li{ font-family:$theme_buttontabs_font_family; } .tab_pulldown_contents > ul > li a{ display:block; padding:10px; font-size:0.8rem; } .tab_pulldown_contents > ul > li.active a{ background-color:$theme_pulldown_contents_list_background_color_active; color:$theme_pulldown_contents_list_font_color_active; } .tab_pulldown_contents > ul > li + li a{ border-top:1px solid $theme_border_color; } .tab_pulldown_contents > ul > li:hover a{ background-color:$theme_pulldown_contents_list_background_color_hover; color:$theme_pulldown_contents_list_font_color_active; text-decoration:none; } .tab_pulldown_contents > ul > li a:focus-visible{ background-color:$theme_pulldown_contents_list_background_color_hover; color:$theme_pulldown_contents_list_font_color_active; outline:none; } .tabs_alt > ul > li.tab_open .tab_pulldown_contents_wrapper{ display:block; } [dir="rtl"] .tabs_alt > ul > li.tab_open .tab_pulldown_contents_wrapper{ left:0; } /* TAGS Styles lists of tags that are used for message recipients, lists of friend lists, etc. Each tag has its own remove link. */ .tag{ + rounded(3px); display:inline-block; background-color:$theme_tag_background_color; font-weight:600 !important; display:inline-block; float:left; padding:.4em .6em .4em .6em; margin:0px 10px 5px 0px; font-size:90%; } [dir="rtl"] .tag{ float:right; margin:0px 0px 5px 10px; } .tag > a{ text-decoration:none; padding-left:6px; text-transform:uppercase; } [dir="rtl"] .tag > a{ float:left; padding-left:0px; padding-right:6px; } /*Activity Feed Css*/ .layout_middle .layout_activity_feed > h3{ border-width:1px 1px 0 1px; margin:0 0 0px; box-shadow:none !important; } .activity-post-container{ border-radius:0 0 $theme_widget_radius $theme_widget_radius; margin-bottom:$theme_box_space; border:1px solid $theme_border_color; } .compose-content{ +rounded($theme_widget_radius); border-width:0; padding:1em; background:$theme_list_background_color; box-sizing:border-box; } .layout_page_messages_messages_view .compose-content{ border-width:1px; } .compose-container .overTxtLabel{ padding:14px 0px 0px 14px; } [dir="rtl"] .compose-container .overTxtLabel{ right:0; left:4px; } .compose-content-counter{ text-align:center !important; font-size:$theme_font_size_small; } .activity-post-container .compose-menu{ border-top-width:1px; padding:10px 0 0; } div.compose-menu a.compose-activator{ border-radius:5px; padding:5px 10px; margin-top:3px; margin-right:3px; } div.compose-menu a.compose-activator:hover{ background:$theme_list_background_color_hover; } .compose-menu .privacy_list, .compose-menu #compose-submit{ border-radius:5px; } .layout_activity_feed{ border-width:0 !important; margin-bottom:25px !important; } ul.feed .feed_item_username{ font-weight:600 !important; } html ul.feed .feed_item_photo{ margin-right:10px; } .feed .item_icon_group .timestamp{ left:95px !important; } [dir="rtl"] .feed .item_icon_group .timestamp{ left:auto !important; right:95px !important; } ul.feed .feed_item_attachments{ padding:0 1px !important; } ul.feed .activity-item{ +boxborder; background:$theme_list_background_color; padding:15px 15px 0; margin-bottom:$theme_box_space; border-radius:$theme_widget_radius; position:relative; overflow:visible; } html ul.feed .feed_item_date::before{ vertical-align:baseline; } .feed_attachment_album_photo img{ border:0; max-width:100%; max-height:inherit; } .feed_item_posted, .feed_item_generated{ display:block; min-height:50px; margin-bottom:10px; } ul.feed > li > #activity-feed{ padding:0; } ul.feed .feed_item_icon{ margin:15px -15px 0; padding:10px 10px 2px; border-top-width:1px; border-color:$theme_border_color; } ul.feed .feed_item_icon > ul > li + li{ margin-left:8px; } [dir="rtl"] ul.feed .feed_item_icon > ul > li + li{ margin-left:0px; margin-right:8px; } ul.feed .feed_item_icon > ul > li > span{ display:none; } .guest-user ul.feed .feed_item_icon{ margin-top:0; padding:0; border-top-width:0; } ul.feed .feed_item_icon > ul > li > a{ border-radius:5px; position:relative; display:flex; align-items:center; justify-content:center; height:35px; padding:0 10px; font-size:1.08em; } ul.feed .feed_item_icon > ul > li > a::before{ font-family:'Font Awesome 5 Free'; display:inline-block; margin-right:6px; display:inline-flex; align-items:center; justify-content:center; border-radius:50px; font-size:0.8rem; transition:0.5s; } [dir="rtl"] ul.feed .feed_item_icon > ul > li > a::before{ margin-right:0; margin-left:6px; } ul.feed .feed_item_icon > ul > .feed_item_option_unlike a{ color:$theme_base_color; } ul.feed .feed_item_icon > ul > .feed_item_option_comment a::before{ content:'\\f075'; } .feed_item_icon > ul > .feed_item_option_like a::before, ul.feed .feed_item_icon > ul > .feed_item_option_unlike a::before{ content:'\\f164'; } ul.feed .feed_item_icon > ul > .feed_item_option_unlike a::before{ color:$theme_base_color; font-weight:bold; } ul.feed .feed_item_icon > ul > .feed_item_option_edit a::before{ content:'\\f044'; } ul.feed .feed_item_icon > ul > .feed_item_option_share a::before{ content:'\\f14d'; } ul.feed .feed_item_icon > ul > .feed_item_option_delete a::before{ content:'\\f2ed'; } ul.feed .feed_item_icon > ul > .feed_item_option_report a::before{ content:'\\f024'; } ul.feed .feed_item_icon > ul a:hover{ background-color:$theme_list_background_color_hover; text-decoration:none; } .comment-likes-activity-feed{ border-top-width:1px; margin-top:20px; padding-top:10px; } .comment-likes-activity-feed > div{ font-size:100% !important; } .comment-likes-activity-feed > div ul > li{ margin-right:15px; } .comment-compose-container .overTxtLabel{ padding:10px; } .comment-compose-container #compose-link-body{ border-width:1px; border-radius:10px; padding:10px; } #compose-link-body #compose-link-form-input{ width:100%; } .activity-post-container .compose-music-link, .activity-post-container .compose-music-link-playing{ border-width:1px; border-radius:10px; padding:15px 10px; display:block; } .activity-post-container .compose-music-link:before{ background-color:#3f4e61; padding:8px; border-radius:5px; color:#fff; font-size:1.2em; } .activity-post-container .compose-music-link-playing:before{ font-family:'Font Awesome 5 Free'; font-weight:600; margin-right:5px; } [dir="rtl"] .activity-post-container .compose-music-link-playing:before{ margin-left:5px; margin-right:0; } .activity-post-container #compose-link-body button{ padding:12px 30px; } ul.feed .feed_item_attachments .feed_attachment_core_link{ padding:10px; display:block; border-width:1px; border-radius:$theme_widget_radius; } ul.feed .feed_attachment_photo a > span{ width:160px; } ul.feed .feed_item_bodytext{ font-size:0.9rem; } ul.feed .feed_item_bodytext a{ color:$theme_base_color; } ul.feed .feed_attachment_classified, ul.feed .feed_attachment_travel, ul.feed .feed_attachment_group, ul.feed .feed_attachment_blog, ul.feed .feed_attachment_bizlist, ul.feed .feed_attachment_event, ul.feed .feed_attachment_employment, ul.feed .feed_poll_rich_content{ border-radius:$theme_widget_radius; border-width:1px; } ul.feed .feed_attachment_event{ display:block; overflow:hidden; } ul.feed .feed_attachment_classified > div > a, ul.feed .feed_attachment_travel > div > a, ul.feed .feed_attachment_group > div > a, ul.feed .feed_attachment_blog > div > a, ul.feed .feed_attachment_bizlist > div > a, ul.feed .feed_attachment_event > div > a, ul.feed .feed_attachment_employment > div > a{ background-color:$theme_list_background_color_alt; text-align:center; } ul.feed .feed_attachment_classified > div > a img, ul.feed .feed_attachment_travel > div > a img, ul.feed .feed_attachment_group > div > a img, ul.feed .feed_attachment_blog > div > a img, ul.feed .feed_attachment_bizlist > div > a img, ul.feed .feed_attachment_event > div > a img, ul.feed .feed_attachment_employment > div > a img, ul.feed .feed_poll_rich_content > div > a img{ border-width:0; max-width:100%; max-height:200px; object-fit:contain; } ul.feed .feed_attachment_employment, ul.feed .feed_poll_rich_content{ padding:10px; } ul.feed .feed_attachment_classified > div > div, ul.feed .feed_attachment_travel > div > div, ul.feed .feed_attachment_group > div > div, ul.feed .feed_attachment_blog > div > div, ul.feed .feed_attachment_bizlist > div > div, ul.feed .feed_attachment_event > div > div{ padding:10px; } .feed_item_attachments .video_thumb_wrapper, ul.feed .feed_item_attachments .video_object{ border-width:1px; border-bottom-width:0; border-radius:$theme_widget_radius $theme_widget_radius 0 0; overflow:hidden; } ul.feed .feed_item_attachments .video_info{ border-width:1px; border-top-width:0; border-radius:0 0 $theme_widget_radius $theme_widget_radius; padding:15px 10px 12px; margin-top:-10px; } ul.feed .music_player_wrapper{ padding:0px 10px; border-radius:$theme_widget_radius; border-width:1px; margin-top:12px; } ul.feed .music_player_wrapper .playlist_short_player, ul.feed .music_player_wrapper .music_player{ border-radius:$theme_widget_radius; padding:10px; } .playlist_short_player .music_player_button_play{ margin-right:10px; } [dir="rtl"] .playlist_short_player .music_player_button_play{ margin-left:10px; margin-right:auto; } div.feed_viewmore{ border-width:0; background-color:$theme_list_background_color; border-radius:$theme_widget_radius; margin-bottom:20px; padding:8px 10px; } ul.feed .feed_item_link_desc{ font-size:0.82rem; } body#global_page_activity-index-view ul.feed .activity-item{ border-radius:0 0 $theme_widget_radius $theme_widget_radius; } /*Member Home Page*/ .layout_user_home_links .home-links-user{ display:none; } .layout_user_home_links .quicklinks, .blogs_gutter_options{ overflow:visible; margin:0 -15px; } .layout_user_home_links .quicklinks ul{ margin-bottom:0; } .layout_user_home_links .quicklinks ul li, ul.blogs_gutter_options li{ position:relative; padding:0; margin:0; } .layout_user_home_links .quicklinks ul li .buttonlink, ul.blogs_gutter_options .buttonlink{ font-size:$theme_font_size; color:$theme_font_color; padding:5px 0 5px 35px; display:block; } [dir="rtl"] .layout_user_home_links .quicklinks ul li .buttonlink, [dir="rtl"] ul.blogs_gutter_options .buttonlink{ padding:5px 35px 5px 0px; } .layout_user_home_links .quicklinks ul li .buttonlink:hover, ul.blogs_gutter_options .buttonlink:hover{ color:$theme_font_color; background-color:$theme_list_background_color_hover; } .layout_user_home_links .quicklinks ul li a:before, ul.blogs_gutter_options .buttonlink:before{ position:absolute; left:5px; text-align:center !important; width:24px; } [dir="rtl"] .layout_user_home_links .quicklinks ul li a:before, [dir="rtl"] ul.blogs_gutter_options .buttonlink:before{ left:auto; right:5px; } .layout_user_list_online div{ padding:0; } .layout_user_list_online .whosonline_thumb{ margin:0px 2px 4px; } .layout_user_list_online .whosonline_thumb .bg_thumb_icon{ height:52px; width:52px; position:relative; } .layout_user_list_online .whosonline_thumb .bg_thumb_icon::after{ content:''; position:absolute; background-color:#00ba00; width:10px; height:10px; border-radius:50px; bottom:5px; right:1px; } [dir="rtl"] .layout_user_list_online .whosonline_thumb .bg_thumb_icon::after{ right:auto; left:1px; } .layout_core_statistics ul{ padding:0; margin:0 -10px; } .layout_core_statistics ul > li{ padding:6px 5px; display:flex; align-items:center; justify-content:flex-start; overflow:hidden; } .layout_core_statistics ul > li div{ text-transform:capitalize; white-space:nowrap; overflow:hidden; display:inline-block; vertical-align:middle; float:none; text-overflow:ellipsis; flex:1; font-size:1em; } .layout_core_statistics ul > li span{ float:right; margin:0 0 0 5px; font-size:1em; float:none; order:1; } [dir="rtl"] .layout_core_statistics ul > li span{ float:none; margin-left:0; margin-right:5px; } [dir="rtl"] .layout_core_statistics ul > li div{ float:none; } /*Member Cover Photo Page*/ #global_content .layout_user_cover_photo, #global_content .layout_event_cover_photo, #global_content .layout_group_cover_photo, .profile_cover_photo_empty, .profile_cover_wrapper{ border-radius:$theme_widget_radius !important; } .layout_page_user_profile_index .layout_top{ margin-bottom:20px; } /*Browse Members*/ .browsemembers_results h3{ font-size:1.2em; } .browsemembers_criteria{ padding:0; } .browsemembers_criteria > ul > li{ font-size:100%; } .browsemembers_criteria > ul > li + li{ margin-top:8px; } .browsemembers_criteria > ul > li.browse-separator-wrapper, .browseclassifieds_criteria > ul > li.browse-separator-wrapper, .browsetravels_criteria > ul > li.browse-separator-wrapper{ border:0; margin:0; } .browsemembers_criteria ul li input[type=checkbox]{ margin-top:5px; } .browsemembers_results h3{ padding:0; margin-bottom:5px; } .layout_core_banner > div{ border-radius:$theme_widget_radius; overflow:hidden; } .layout_core_banner a{ border-radius:10px !important; } .browsemembers_results .member_grid > a{ border-radius:$theme_widget_radius; overflow:hidden; } .browsemembers_results div.browsemembers_results_info{ text-transform:capitalize; text-align:center !important; } .browsemembers_results div.browsemembers_results_info > a{ font-weight:600 !important; font-size:1.2em; } .browsemembers_results_links a.buttonlink{ width:100%; padding:12px 10px; transition:0.5s; border-radius:$theme_widget_radius; border-width:1px; } .browsemembers_results_links a.buttonlink:hover{ background-color:$theme_list_background_color_hover; } .browsemembers_criteria button{ width:100%; } .layout_left #find-wrapper, .layout_right #find-wrapper{ margin-top:10px; } .layout_left button, .layout_right button{ width:100%; margin-top:5px; } .browsemembers_criteria select{ width:100%; } .browseclassifieds_criteria > ul > li.browse-range-wrapper input[type="text"], .browsetravels_criteria > ul > li.browse-range-wrapper input[type="text"]{ width:48% !important; } /*Forgot Page*/ .layout_page_user_auth_forgot{ width:550px; margin:auto; } .layout_page_user_auth_forgot .global_form > div{ float:none !important; } .layout_page_user_auth_forgot .global_form > div > div h3{ padding:5px 0; font-weight:700 !important; font-size:1.5em; margin:0 0 15px; border-width:0; } .layout_page_user_auth_forgot .global_form div.form-element{ min-width:100%; max-width:100%; } .layout_page_user_auth_forgot div#buttons-wrapper div#buttons-label{ display:none; } .layout_page_user_auth_forgot div#buttons-wrapper button{ padding:12px 15px; } .layout_page_user_auth_forgot div#buttons-wrapper a{ margin-top:5px; } body#global_page_user-auth-forgot .layout_page_user_auth_forgot .tip > span{ margin-bottom:0; } /*Login Page*/ #global_page_user-auth-login #core_menu_mini_menu li .core_mini_auth{ display:none !important; } #global_page_user-auth-login #global_content .layout_core_content, #global_page_otpsms-index-login #global_content .layout_core_content{ padding:0 !important; border:0 !important; max-width:400px; margin:35px auto 50px; border-radius:8px; box-shadow:0 2px 4px rgba(0, 0, 0, .1), 0 8px 16px rgba(0, 0, 0, .1); } #global_page_user-auth-login #global_content .user_login_page, #global_page_otpsms-index-login #global_content .user_login_page{ padding:0 20px; } .user_login_page .user_login_bg{ display:none !important; } #global_page_user-auth-login .user_login_page .user_login_form{ padding:30px 0 !important; } #global_page_user-auth-login #global_content .user_login_page .user_login_form > h3, #global_page_otpsms-index-login #global_content .user_login_page .user_login_form > h3, .layout_page_core_error_requireuser #user_form_login h3, .ajaxsmoothbox_main .user_login_page .user_login_form > h3{ margin:0; padding:0; font-size:1.4em; text-transform:capitalize; text-align:center; font-weight:normal; } .layout_page_core_error_requireuser #user_form_login h3{ margin-bottom:10px; } .required_login_form .global_form > div > div > h3 + p{ font-size:0.85em; } #global_page_user-auth-login #global_content .global_form, #global_page_otpsms-index-login #global_content .global_form{ padding:20px 0 0 !important; font-size:13px; margin-bottom:12px; } .user_login_page form > div{ float:none !important; } .user_login_page form > div ul.form-errors{ margin-top:0; } .ajaxsmoothbox_main .user_login_page .user_login_form{ padding:30px 0; min-width:60%; } .user_login_page .user_login_form .global_form > div > div{ border:0; padding:0 !important; } #global_page_core-error-requireuser .layout_core_content #user_form_login #submit-label, #global_page_user-auth-login #global_content .global_form > div > div > h3{ display:none !important; } .user_login_page .user_login_form div.form-wrapper{ margin-bottom:15px; } #global_page_user-auth-login #global_content .global_form div.form-label, #global_page_otpsms-index-login #global_content .global_form div.form-label, .required_login_form .global_form div.form-label{ font-weight:normal !important; } #global_page_user-auth-login #global_content .global_form div.form-element, #global_page_otpsms-index-login #global_content .global_form div.form-element, .ajaxsmoothbox_main .user_login_form .global_form div.form-element{ margin:0 !important; min-width:100%; max-width:100%; } .layout_page_core_error_requireuser .global_form input[type=email], .layout_page_core_error_requireuser .global_form input[type=password], .layout_page_core_error_requireuser .global_form input[type=text], .user_login_page .user_login_form input[type=email], .user_login_page .user_login_form input[type=password], .user_login_page .user_login_form input[type=text]{ margin-bottom:5px !important; padding:10px; width:100%; min-height:42px; } .user_login_page #user_form_login #forgot-element a, .layout_page_core_error_requireuser #user_form_login #forgot-element a{ color:$theme_button_background_color; font-size:0.95em; } .user_login_page #submit-element button, .layout_page_core_error_requireuser .global_form #submit-element button{ width:100%; margin:0; background:$theme_button_background_color !important; color:$theme_button_font_color !important; border:1px solid $theme_button_background_color; font-size:110% !important; font-weight:400 !important; } .user_login_page .user_login_form div.form-wrapper div#forgot-wrapper{ margin:0; } .user_login_page .user_login_form > a{ font-size:0.95em; color:$theme_button_background_color; } #global_page_user-auth-login #global_content .global_form .user_showhidepassword > i, #global_page_otpsms-index-login #global_content .global_form .user_showhidepassword > i, .ajaxsmoothbox_main .user_login_form .global_form .user_showhidepassword > i{ margin-top:-50px; } .required_login_form .global_form .user_showhidepassword > i{ margin-top:-52px; } /*Sign Up Page*/ #global_page_user-signup-index #core_menu_mini_menu li .user_signup_link{ display:none !important; } .layout_page_user_signup_index .layout_core_content{ width:600px; margin:0 auto 30px; padding:5px 15px 15px !important; border:0 !important; } .layout_page_user_signup_index .layout_core_content .global_form > div > div h3{ padding:5px 0; font-weight:700 !important; font-size:1.8em; margin:0 0 15px; border-width:0; } .layout_page_user_signup_index .global_form > div .form-elements > div{ margin-bottom:10px; } .layout_page_user_signup_index #terms-wrapper #terms-label{ display:none; } .layout_page_user_signup_index #terms-wrapper #terms-element{ margin:6px 0 12px; } .layout_page_user_signup_index #submit-wrapper #submit-label{ display:none; } .layout_page_user_signup_index #submit-wrapper button{ width:100%; padding:12px 20px; } .user_signup_details .birthday_wrapper .form-element{ flex-wrap:inherit !important; } .user_signup_details .birthday_wrapper .form-element select{ max-width:32.80% !important; min-width:32.80% !important; } .layout_page_user_signup_index .twostep_verify_message{ max-width:100%; } .layout_page_user_signup_index div#code-element input{ min-width:100%; } .layout_page_user_signup_index #SignupForm #current-element .user_edit_photo_main{ width:220px; height:220px; } .layout_page_user_signup_index #SignupForm #current-element .user_edit_photo_main img{ width:100%; height:100%; } .layout_page_user_signup_index #SignupForm div.preview-thumbnail{ margin:20px 0 0; } .layout_page_user_signup_index #SignupForm div.thumbnail-controller{ margin:20px 0 0 10px; } [dir="rtl"] .layout_page_user_signup_index #SignupForm div.thumbnail-controller{ margin:20px 10px 0 0; } [dir="rtl"] .user_login_page .user_login_form input[type="password"], [dir="rtl"] #global_page_core-error-requireuser input[type="password"], [dir="rtl"] #global_page_user-signup-index input[type="password"], [dir="rtl"] #global_page_user-settings-password input[type="password"]{ padding-right:8px; } .layout_page_user_signup_index .user_showhidepassword{ top:16px !important; } .layout_page_user_signup_index .user_showhidepassword > i{ font-size:14px; } #passwordroutine_specialcharacters .special_char_overlay{ margin-top:-150px; } .layout_page_user_signup_index #SignupForm div#current-element br{ display:none; } .layout_page_user_signup_index .global_form div.form-element{ min-width:100%; max-width:100%; } .layout_page_user_signup_index .global_form input[type=text], .layout_page_user_signup_index .global_form input[type=email], .layout_page_user_signup_index .global_form input[type=password], .layout_page_user_signup_index .global_form select{ max-width:100%; width:100%; min-width:100%; } .layout_page_user_signup_index #skiplink{ margin-top:16px; } .layout_page_user_signup_index #SignupForm .form-elements div#Filedata-wrapper{ margin-bottom:18px; } .layout_page_user_signup_index .form-elements button{ padding:12px 20px; } .layout_page_user_signup_index .global_form div > input + p, .layout_page_user_signup_index .global_form div > select + p{ padding:0; margin:5px 0 0; } /*Authentication page*/ .twostep_auth_form h3{ padding:5px 0; font-weight:600 !important; font-size:1.8em; margin:0 0 15px; border-width:0; } .layout_page_user_signup_index .twostep_verify_message *{ color:#3c763d !important; } #global_content .layout_page_user_signup_index .twostep_auth_form .form-elements, #global_content .layout_page_user_signup_index .twostep_auth_form .form-elements *{ text-align:left !important; } [dir="rtl"] #global_content .layout_page_user_signup_index .twostep_auth_form .form-elements, [dir="rtl"] #global_content .layout_page_user_signup_index .twostep_auth_form .form-elements *{ text-align:right !important; } #global_content .layout_page_user_signup_index .twostep_auth_form .form-elements button, [dir="rtl"] #global_content .layout_page_user_signup_index .twostep_auth_form .form-elements button{ text-align:center !important; width:100%; } /*Reset Page*/ #global_page_user-auth-reset .layout_middle > .generic_layout_container{ max-width:600px; margin:0 auto 25px; } #global_page_user-auth-reset .global_form div.form-element{ min-width:100%; max-width:100%; } #global_page_user-auth-reset .global_form button[type=submit]{ padding:10px 20px; } /*Fillter Form*/ form.filters dt, form.filters div.form-label{ font-size:100%; margin-bottom:0; } .layout_left .global_form_box label, .layout_right .global_form_box label, .browsemembers_criteria ul li label, .browsemembers_criteria > ul > li > span, .browsetravels_criteria > ul > li.browse-range-wrapper > span, form.filters .form-label label, form.filters dt label, .employments_browse_filters .browse-range-wrapper span.hint, .browseclassifieds_criteria .browse-range-wrapper span.hint{ margin-bottom:5px; } #filter_form input[type=text], #filter_form input[type=email], #filter_form input[type=password], #filter_form input.text, #filter_form select, .field_search_criteria input[type="text"], .field_search_criteria select, #filter_form input[type="text"], #filter_form input.text, #filter_form select, form.filters input[type="text"], form.filters input.text, form.filters select{ height:40px !important; min-height:auto; padding-top:5px; padding-bottom:5px; } .layout_left #filter_form #find-label, .layout_right #filter_form #find-label, .layout_left form.filters #find-label, .layout_right form.filters #find-label{ display:none; } #filter_form button, .field_search_criteria button, form.filters button{ padding:10px; } .browsetravels_criteria > ul > li.browse-range-wrapper, .browsetravels_criteria #category_id-wrapper, .employments_browse_filters #category_id-wrapper, .browseclassifieds_criteria .browse-range-wrapper, .browseclassifieds_criteria #category_id-wrapper{ margin-top:8px; } .bizlists_browse_filters ul div#category_id-wrapper{ margin-bottom:8px; } .layout_page_forum_index_index #global_search_form button{ padding:12px 20px; } /*Common Plugin Page*/ .blogs_browse span h3, .blogs_browse_info_title h3, .bizlists_browse_item .bizlists_browse_info_title h3, .bizlists_manage .bizlists_browse_info_title h3, .polls_browse_info h3, .events_browse .events_title > h3, .grid_wrapper > div .groups_title > h3, ul.albums_manage .albums_manage_info h3, .classifieds_browse_info_title h3, .classified_top > .classified_right h2, .travels_browse_item .travels_browse_info_title h3, .travels_manage .travels_browse_info_title h3, .employments_browse_info_title h3, ul.list_wrapper .groups_title h3, .videos_browse .video_title, ul.videos_manage .video_info h3, .music_browse_info_title h3{ font-size:1.3em; line-height:24px; padding:0; font-weight:600 !important; } .classified_top > .classified_right h2, .bizlist_top > .bizlist_right h2, .layout_page_blog_index_view .layout_core_content h2, .travel_right h2, .employment_top h2, .cover_photo_profile_information h2, #global_page_forum-forum-view .layout_middle > .generic_layout_container > h2, .layout_page_video_index_view .layout_core_content h2, .layout_page_music_playlist_view .layout_core_content h2{ font-size:1.6em; line-height:24px; font-weight:600 !important; } .polls_browse_info_date{ margin-top:0 !important; } .blogs_browse_info_blurbm, .bizlists_browse_info_des, .polls_browse_info_desc{ font-size:$theme_font_size_small; } .bizlist_right > h2{ font-size:1.5em } .bizlists_browse_filters > ul > li button{ margin-top:0; } .events_browse .events_browse_inner .events_info{ padding-top:10px; } .grid_wrapper > div .groups_title{ margin-top:0; } #chat_content_layout .chat_input_wrapper{ box-shadow:none !important; padding:5px 10px; } .global_form div#starttime-element, .global_form div#endtime-element{ display:flex; } .global_form div#starttime-element select, .global_form div#endtime-element select, .global_form div#starttime-element .event_calendar_container, .global_form div#endtime-element .event_calendar_container{ width:25% !important; } #global_page_blog-index-view .blogs_owner_icon + .blogs_gutter_name{ bottom:40px; } .blogs_browse > .blogs_browse_inner .blogs_browse_info_title a, .blogs_browse > .blogs_browse_inner .blogs_browse_info_title h3, .polls_browse_item > .polls_browse_item_inner .polls_browse_info_title a, .polls_browse_item > .polls_browse_item_inner .polls_browse_info_title h3{ font-weight:600 !important; } .layout_group_browse_search #find-label{ display:none; } .layout_group_browse_search div#find-element{ min-width:100%; max-width:100%; } .generic_list_wrapper, ul.generic_list_widget{ margin-bottom:0; } .layout_user_list_popular .popularmembers_name, ul.generic_list_widget .title, .layout_user_list_signups .newestmembers_name{ font-weight:600 !important; } /*Create Form*/ [class*='_index_create'] .global_form #buttons-label, [Id*='_create_form'] #buttons-label, [Id*='index-create'] #submit-wrapper #submit-label, [Id*='playlist-edit'] #submit-wrapper #submit-label, [Id*='index-create'] #upload-wrapper #upload-label, [Id*='index-edit'] #submit-label, [Id*='index-edit'] #buttons-label, [Id*='group-edit'] #buttons-label, [Id*='poll-edit'] #buttons-label, [Id*='index-upload'] #submit-label{ display:none; } [class*='_index_create'] .global_form button[type=submit], [Id*='_create_form'] button[type=submit], [Id*='index-create'] #submit-wrapper button[type=submit], [Id*='playlist-edit'] #submit-wrapper button, [Id*='index-edit'] button[type=submit], [Id*='group-edit'] button[type=submit], [Id*='poll-edit'] button[type=submit], [Id*='index-upload'] button[type=submit], [Id*='album-editphotos'] button[type=submit], [Id*='album-edit'] button[type=submit], [Id*='global_page_forum'] button[type=submit]{ padding:12px 20px; margin-top:5px; } [Id*='-edit'] .selectize-input > *{ vertical-align:top; } /*Music*/ .music_player_button_play{ font-size:18px; display:flex; align-items:center; justify-content:center; } #uploaded-file-list .file-name, #uploaded-file-list .file-remove b{ font-weight:500 !important; } /*Group*/ #global_page_group-group-edit form{ padding:0; margin:0; background-color:transparent !important; } /*Fourm*/ ul.forum_categories > li > div > h3{ font-size:1.3em; } ul.forum_categories .forum_title{ padding-top:12px; } ul.forum_categories .forum_title h3{ font-size:1.2em; } /*Travel*/ body#global_page_travel-photo-upload h2, body#global_page_bizlist-photo-upload h2, body#global_page_classified-photo-upload h2{ display:none; } /*Employment*/ .employments_browse_filters .browse-separator-wrapper{ border:0; margin:0; } /*Hastag Page*/ .layout_core_show_search_hashtags h3{ padding:0 !important; border:0; } /*User Setting Page*/ .user_setting_main_page_main .layout_middle > .user_invite_tabs{ padding:10px !important; margin-bottom:12px !important; } .user_setting_global_form .global_form > div > div h3, .dark_mode .user_setting_global_form .global_form > div > div h3, .light_mode .user_setting_global_form .global_form > div > div h3{ background-color:transparent !important; } .notifications_layout_head .btn i{ font-style:normal; } .rich_content_body a{ color:$theme_base_color; } .light_mode .user_setting_global_form .btn-primary *{ color:#fff !important; } .user_setting_global_form .global_form div.form-label{ color:$theme_font_color; } @-moz-document url-prefix(){ body{ display:none !important; } } /*Pages*/ .paginationControl > li > a{ text-decoration:none !important; font-weight:400 !important; } /*Videos Plugin*/ #global_page_video-index-view h2{ line-height:1.6; } /*Member Home Page*/ #global_page_user-index-home #global_content{ width:100%; padding:0 5px; } #global_page_user-index-home #global_wrapper .layout_left > div, #global_page_user-index-home #global_wrapper .layout_right > div, #global_page_user-index-home #global_wrapper .layout_left > div > ul, #global_page_user-index-home #global_wrapper .layout_right > div > ul, #global_page_user-index-home #global_wrapper .layout_left > div > div, #global_page_user-index-home #global_wrapper .layout_right > div > div{ background:none !important; border-width:0 !important; border-radius:0 !important; margin:0 !important; } #global_page_user-index-home #global_wrapper .layout_left > div, #global_page_user-index-home #global_wrapper .layout_right > div{ border-bottom-width:1px !important; border-color:$theme_input_border_color; } #global_page_user-index-home #global_wrapper .layout_left .generic_layout_container > h3, #global_page_user-index-home #global_wrapper .layout_right .generic_layout_container > h3, #global_page_user-index-home #global_wrapper .generic_list_wrapper > ul{ background:none !important; } @media (min-width:1400px){ #global_page_user-index-home .layout_middle > .generic_layout_container{ max-width:700px; margin:auto !important; } } /*Member Profile Page*/ .layout_page_event_profile_index .layout_top .layout_middle, .layout_page_group_profile_index .layout_top .layout_middle, #global_page_user-profile-index .layout_top > .layout_middle{ overflow:visible; } /* COVER PHOTO */ #global_page_user-profile-index .layout_left, #global_page_user-profile-index .layout_right{ width:320px !important; } #global_page_user-profile-index .profile_cover_photo_tabs .tabs_alt ul{ border:0 !important; padding:0 !important; } /*Dashboard Page*/ .layout_fbclone_dashboard_links{ background-color:transparent !important; border-width:0 !important; padding:0 !important; } .user_dashboard_links{ padding:0 15px; } .dashboard_explore_links_v + .dashboard_explore_links_v{ padding-bottom:8px !important; } .dashboard_explore_links_v > p, .dashboard_explore_links_h > p{ padding:10px 5px 8px; margin-bottom:0; font-weight:600; color:$theme_dashboard_font_color; overflow:hidden; font-size:110%; } .dashboard_explore_links_v > ul > li{ position:relative; } .dashboard_explore_links_v > ul > ._profile span .verified_icon{ display:none; } .user_dashboard_links .edit_profile_dropdown.toggle_open{ display:block !important; } .dashboard_explore_links_v > ul > li > a{ padding:10px 25px 10px 5px; display:flex; align-items:center; color:$theme_dashboard_link_color; border:1px solid transparent !important; font-weight:400; } [dir="rtl"] .dashboard_explore_links_v > ul > li > a{ padding:10px 5px 10px 25px; } .dashboard_explore_links_v > ul > li > a:hover, .dashboard_explore_links_v > ul > li.active > a{ color:$theme_dashboard_link_color !important; background-color:$theme_dashboard_list_background_color_hover !important; border-radius:8px; } .dashboard_explore_links_v > ul > li > a:focus-visible{ color:$theme_dashboard_link_color !important; background-color:$theme_dashboard_list_background_color_hover !important; border-radius:8px; outline:0; } .dashboard_explore_links_v ul li > a > img, .dashboard_explore_links_v ul li > a > i{ width:26px; height:26px; object-fit:cover; margin-right:10px; text-align:center; font-size:18px; border-radius:0; display:flex; align-items:center; justify-content:center; } .dashboard_explore_links_v ul li > a > img{ width:32px; height:32px; } [dir="rtl"] .dashboard_explore_links_v ul li > a > img, [dir="rtl"] .dashboard_explore_links_v ul li > a > i{ float:right; margin-left:10px; margin-right:0; text-align:center; } .dashboard_explore_links_v ul li a span{ display:block; overflow:hidden; line-height:20px; white-space:nowrap; text-overflow:ellipsis; } .dashboard_explore_links_v ._profile > a > img{ border-radius:50%; } .dashboard_explore_links_v ._profile > span, .dashboard_explore_links_v ._op > span{ position:absolute; right:0; top:5px; height:30px; width:30px; display:block; text-align:center; color:$theme_dashboard_font_color; font-size:105%; font-weight:600; } .dashboard_explore_links_v ._profile > span{ display:flex; align-items:center; justify-content:center; } .dashboard_explore_links_v ._profile > span > a{ font-size:1em; } [dir="rtl"] .dashboard_explore_links_v ._profile > span, [dir="rtl"] .dashboard_explore_links_v ._op > span{ right:auto; left:0; } .dashboard_explore_links_v ._profile > span > a:before, .dashboard_explore_links_v ._op > span > a:before{ font-size:16px; top:6px; right:6px; position:relative; } .dashboard_explore_links_v ._op > span > a{ display:none; } .dashboard_explore_links_v ._op > span > a.showoption, .dashboard_explore_links_v > ul > ._op:hover > span > a{ display:block; } #global_page_user-index-home #global_wrapper .layout_left > div .dashboard_explore_links_v .edit_profile_dropdown, #global_page_user-index-home #global_wrapper .layout_right > div .dashboard_explore_links_v .edit_profile_dropdown, html .dashboard_explore_links_v .edit_profile_dropdown{ background-color:$theme_list_background_color !important; box-shadow:0 0 20px rgba(0, 0, 0, .1) !important; position:absolute; right:0px; top:30px; padding:5px 0; border-radius:8px !important; z-index:2; } [dir="rtl"] .dashboard_explore_links_v .edit_profile_dropdown{ right:inherit; left:0px; } .dashboard_explore_links_v .edit_profile_dropdown li a{ padding:7px 20px; font-size:90%; width:100%; display:block; color:$theme_dashboard_link_color; } .dashboard_explore_links_v .edit_profile_dropdown li a:hover{ background-color:$theme_button_background_color; color:$theme_button_font_color !important; } .dashboard_explore_links_h{ margin-bottom:10px; } .dashboard_explore_links_h > ul{ padding:0 5px; display:flex; flex-wrap:wrap; } .dashboard_explore_links_h li{ display:block; margin:5px 15px 5px 0; } [dir="rtl"] .dashboard_explore_links_h li{ margin-left:15px; margin-right:0; } .dashboard_explore_links_h li a{ color:$theme_dashboard_link_color; } .dashboard_explore_links_h li a img, .dashboard_explore_links_h li a i{ height:20px; width:20px; margin-right:4px; vertical-align:middle; text-align:center; font-size:16px; display:inline-flex; align-items:center; } .dashboard_explore_links_h li a i{ margin-right:1px; } [dir="rtl"] .dashboard_explore_links_h li a img, [dir="rtl"] .dashboard_explore_links_h li a i{ margin-right:0px; margin-left:4px; } [dir="rtl"] .dashboard_explore_links_h li a i{ margin-right:0px; margin-left:1px; } .dashboard_explore_links_h li a span{ font-size:.95em; } .dashboard_explore_links_v #sesshortcut_allmenus li a img{ border-radius:50%; } .social_login_btn{ border-radius:$theme_border_color !important; } /*Branding*/ #global_footer .layout_branding, #global_footer .layout_branding *{ text-align:center !important; } #global_footer .layout_branding h3{ padding:0 0 2px; font-size:15px; font-weight:500; } /*Hastag*/ .layout_core_show_search_hashtags h3{ margin:0 !important; } .layout_page_core_hashtag_index .tabs_alt > ul{ padding:0; } /*Message body*/ .layout_page_messages_messages_compose .compose-tray{ margin-top:16px; } .layout_page_messages_messages_view div#compose-video-body select, .layout_page_messages_messages_view #compose-link-body #compose-link-form-input, .layout_page_messages_messages_compose div#compose-video-body select, .layout_page_messages_messages_compose #compose-link-body #compose-link-form-input{ min-width:350px; width:auto; } .layout_page_messages_messages_compose #compose-link-body button{ margin:0 8px; padding:10px 20px; } .layout_page_messages_messages_view #compose-video-form-input input#compose-form-input, .layout_page_messages_messages_compose #compose-video-form-input input#compose-form-input{ width:100%; margin-top:10px; } .layout_page_messages_messages_view #compose-video-form-description, .layout_page_messages_messages_compose #compose-video-form-description{ font-size:0.9em; margin:8px 0; } .messages_list ul > li + li{ border-top-width:1px; border-color:$theme_border_color; padding-top:15px; } .layout_page_messages_messages_view .video_thumb_wrapper{ overflow:hidden; margin-top:6px; display:block; width:100%; background-color:transparent; height:230px; } .layout_page_messages_messages_view .video_thumb_wrapper .bg_item_photo.thumb_video_activity{ width:45%; background-color:transparent; } .layout_page_messages_messages_view .message_attachment .video_info > a{ color:$theme_font_color; } .user_setting_global_form .global_form .form-wrapper > div.form-label{ font-size:1em; } .user_setting_notification_form .form-elements .form-options-wrapper li label{ font-size:0.9em; } .messages_compose_popup div#submit-wrapper div#submit-label{ display:none; } .messages_compose_popup div#submit-wrapper div#submit-element{ margin-top:10px; } .user_settings_page{ margin-bottom:20px; } .layout_core_hashtags_cloud ul > li > a{ border-color:$theme_border_color; } #global_page_event-index-create select, #global_page_event-index-edit select{ min-height:44px; } /*Commpose Message*/ html#smoothbox_window #global_page_messages-messages-compose .layout_page_messages_messages_compose .layout_core_content{ border:0; } html#smoothbox_window #global_page_messages-messages-compose .layout_messages_menu{ padding:0; border:0; } .core_switch_account_list_item .members_tab_item ._cont{ font-size:.85em; } .core_settings_dropdown .members_tab_item > ._img i{ background-color:transparent; color:$theme_topbar_minimenu_icon_font_color !important; } .viewlink{ font-size:0.85em; } /*Recent Login*/ .recent_login_list_item ._close i{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; margin-left:1px; } /*Contact Page*/ .layout_page_core_help_contact .layout_core_content{ max-width:600px; margin:0 auto 25px; } .layout_page_core_help_contact .global_form > div > div h3{ padding:0; margin:0 0 10px; } .layout_page_core_help_contact .global_form div.form-element{ max-width:100%; min-width:100%; } .layout_page_core_help_contact .layout_core_content #submit-label{ display:none; } .layout_page_core_help_contact .layout_core_content #submit-element button{ padding:10px 20px; } .layout_page_core_help_contact .layout_core_content .form-errors{ margin-top:0; } /*Responsive CSS*/ @include "responsive.css"; @include "fbclone-custom.css";
Save Changes
Available Themes
Facebook Clone Theme
v6.5.2
by SocialEngine Core
(this is your current theme)