Mode
Production
Development
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
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
Inspira Theme
Network Information
Created
January 11, 2020
Version
6.5.1
Home
Appearance
Theme Editor
Theme Editor
More info:
See KB article
Active Theme
Revert
Clone
Save Changes
Inspira
v6.5.1
by
SocialEngine
Editing File:
theme.css
constants.css
inspira-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_font_size; border-color:$theme_border_color; } *{ padding:0; margin:0; border:none; border-style:solid; border-width:0px; border-color:$theme_border_color; } table{ border-collapse:collapse; } br{ clear:both; } ul{ list-style-type:none; } a:link, a:visited{ color:$theme_link_color; text-decoration:$theme_link_decoration; } a:hover{ color:$theme_link_color_hover; text-decoration:$theme_link_decoration_hover; } *{ font-family:$theme_font_family; } *[dir="rtl"]{ direction:rtl; unicode-bidi:embed; } div, td{ font-size:100%; color:$theme_font_color; text-align:$theme_text_align; } *[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; letter-spacing:-0.03em; margin-bottom:10px; } h3{ font-size:$theme_headline_size_medium; padding:.4em 0; font-weight:700; } h4{ font-weight:600; border-bottom:1px solid $theme_border_color; padding:.5em 0px .5em 0px; margin-bottom:10px; } h4>span{ display:inline-block; position:absolute; background-color:$theme_body_background_color; padding-right:6px; margin-top:-1px; } h3.sep{ display:block; border-bottom:1px solid $theme_border_color; overflow:hidden; margin-bottom:1em; height:1em; } h3.sep > span{ display:block; overflow:hidden; position:absolute; background:$theme_body_background_color; padding:5px 10px 5px 0px; font-weight:600; } html[dir="rtl"] h3.sep>span{ padding:5px 0px 5px 10px; } /* GENERAL LAYOUT */ .layout_left>.generic_layout_container, .layout_right>.generic_layout_container, .layout_middle>.generic_layout_container, .layout_core_container_tabs>.generic_layout_container{ +widget; } .layout_left .generic_layout_container > h3, .layout_right .generic_layout_container > h3, .layout_middle .generic_layout_container > h3{ border-radius:5px 5px 0 0; text-transform:capitalize; font-weight:600; position:relative; font-size:17px; padding:15px; margin:-15px -15px 10px; font-family:$theme_box_header_font_family; background:$theme_base_color; color:$theme_base_font_color; text-align:center; } .layout_middle .generic_layout_container > h3 > a{ color:$theme_base_font_color; } .layout_left{ float:left; width:$theme_content_columns_left_width; padding:0px 15px 0px 0px; vertical-align:top; margin-right:5px; } html[dir="rtl"] .layout_left{ float:right; padding:0px 0px 0px 15px; margin-right:0px; margin-left:5px; } .layout_middle{ overflow:hidden; vertical-align:top; } .layout_right{ float:right; width:$theme_content_columns_right_width; padding:0px 0px 0px 15px; vertical-align:top; margin-left:5px; } html[dir="rtl"] .layout_right{ float:left; padding:0px 15px 10px 0px; margin-left:0px; margin-right:5px; } #global_wrapper{ text-align:center; padding-top:20px; margin-top:155px; } #global_content{ overflow:hidden; min-height:500px; 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; text-align:center; padding:0px; clear:both; position:absolute; left:0; right:0; top:0; z-index:99; } .layout_page_header .layout_main{ width:$theme_topbar_width; padding:0; } .inspira_header, .inspira_header *{ box-sizing:border-box; } .inspira_header_container{ margin:auto; width:$theme_main_width; } .inspira_header .header-top{ display:flex; align-items:center; justify-content:space-between; padding:10px 0; } .inspira_header .header_menu_mini{ display:flex; align-items:center; justify-content:flex-end; position:relative; } /*Logo*/ .inspira_header .layout_core_menu_logo a{ color:$theme_topbar_logo_color !important; font-weight:bold; font-size:22px; } .inspira_header .layout_core_menu_logo a img{ max-height:70px; display:block; vertical-align:middle; } .header_logo .header_logo_contrast{ display:none; } .light_mode .header_logo .header_logo_contrast, .dark_mode .header_logo .header_logo_contrast{ display:block; } .light_mode .header_logo .header_logo_normal, .dark_mode .header_logo .header_logo_normal{ display:none; } /*Search*/ .header_search{ position:relative; flex:1; max-width:400px; margin:auto; } .header_search .layout_core_search_mini #global_search_form{ padding:0em 0; background-color:transparent !important; } .inspira_header #global_search_field{ border-radius:50px; padding:15px 46px 15px 15px; height:44px; background-color:$theme_topbar_menu_background_color_hover !important; border-color:transparent !important; } .inspira_header #global_search_field:focus-visible{ border-color:#000 !important; } .inspira_header #global_search_field, .inspira_header #global_search_field::placeholder{ color:#333 !important; } [dir="rtl"] .inspira_header #global_search_field{ padding:15px 15px 15px 46px; } .header_search > i{ position:absolute; right:15px; top:13px; font-size:18px; color:$theme_base_color !important; } [dir="rtl"] .header_search > i{ left:15px; right:auto; } .inspira_header .layout_core_search_mini.active #global_search_field{ width:100%; } .inspira_header .search_button a{ width:36px; height:36px; color:$theme_topbar_minimenu_link_color; background:$theme_topbar_link_background_color; border-color:$theme_topbar_link_background_color; border-radius:50px; display:flex; align-items:center; justify-content:center; padding:3px 10px; border-width:1px; font-size:15px; } .inspira_header .search_button a i{ color:$theme_topbar_minimenu_link_color !important; } [dir="rtl"] .inspira_header .search_button a{ margin-left:5px; } .search_button{ display:none; } .layout_core_search_mini #global_search_form button{ top:2px; right:2px; width:40px; height:40px; } [dir="rtl"] .layout_core_search_mini #global_search_form button{ right:auto; left:2px; } /*Main Manu*/ .inspira_header .navigation_button .toggle_button{ opacity:1; background-image:none; padding:0 10px 0 0; background-color:transparent !important; } [dir="rtl"] .inspira_header .navigation_button .toggle_button{ padding:0 0px 0 10px; } .inspira_header .navigation_button .toggle_button:focus-visible i{ border:1px solid #000; } .inspira_header .navigation_button .toggle_button i{ font-size:20px; width:36px; height:36px; border-radius:5px; display:flex; align-items:center; justify-content:center; padding:3px 10px; border-width:1px; color:$theme_topbar_minimenu_link_color !important; background:$theme_topbar_link_background_color; border-color:$theme_topbar_link_background_color; } .toggle_button:focus{ box-shadow:none } .header_left_panel{ background-color:$theme_topbar_menu_background_color; display:flex; justify-content:flex-start; flex-direction:column; width:0px; transition:.3s; position:fixed; overflow:auto; top:0px; z-index:9; bottom:0; left:0; } body:not(.header-open) .header_left_panel{ -ms-overflow-style:none; scrollbar-width:none; } body:not(.header-open) .header_left_panel::-webkit-scrollbar{ display:none; } [dir="rtl"] .header_left_panel{ justify-content:inherit; left:auto; right:0; } .header_left_panel.header-nav-open{ width:200px; } .header_left_panel > ul.navigation > li > a{ color:$theme_topbar_menu_link_color; padding:0px; position:relative; font-size:15px; font-weight:400; text-align:left; padding-left:20px; transition:.5s; height:50px; line-height:50px; display:flex; align-items:center; border-bottom:1px solid $theme_border_dark_color; } [dir="rtl"] .header_left_panel > ul.navigation > li > a{ padding-left:0px; padding-right:20px; text-align:right; } .inspira_header .header_left_panel ul.navigation > li.active > a, .inspira_header .header_left_panel ul.navigation>li:hover > a, .inspira_header .header_left_panel ul.navigation>li a.has_submenu{ background-color:$theme_topbar_menu_link_background_color_hover; color:$theme_topbar_menu_link_hover_color; } .inspira_header .header_left_panel ul.navigation > li > a:focus-visible{ background-color:$theme_topbar_menu_link_background_color_hover; color:$theme_topbar_menu_link_hover_color; outline:none; border:2px solid #000; } .header_left_panel ul.navigation > li > a > i{ padding-right:12px; } [dir="rtl"] .header_left_panel ul.navigation > li > a > i{ padding-right:0; padding-left:12px; } .header_left_panel > ul.navigation > li > a span{ flex:1; white-space:nowrap; text-overflow:ellipsis; } .inspira_header .header_left_panel .main_menu_submenu{ background:$theme_topbar_menu_link_background_color_hover; } .inspira_header .header_left_panel ul.navigation li a .open_submenu{ width:35px; height:66px; line-height:66px; text-align:center; } .inspira_header .header_left_panel ul.main_menu_submenu > li > a{ background-color:$theme_body_background_color; color:$theme_link_color; position:relative; font-size:14px; display:block; padding:10px 15px 10px 50px; border-bottom:1px solid $theme_border_color; } [dir="rtl"] .inspira_header ul.main_menu_submenu > li > a{ padding:15px 50px 15px 15px; } .inspira_header ul.main_menu_submenu > li:nth-last-child(1) > a{ border-bottom-width:0; } .inspira_header .header_left_panel ul.main_menu_submenu > li > a:hover, .inspira_header .header_left_panel ul.main_menu_submenu > li.selected_sub_main_menu > a{ background-color:$theme_topbar_menu_background_color; color:$theme_topbar_menu_link_color; } .inspira_header .header_left_panel ul.main_menu_submenu > li > a i{ position:absolute; left:22px; top:18px; } [dir="rtl"] .inspira_header .header_left_panel ul.main_menu_submenu > li > a i{ right:22px; left:auto; } .inspira_header .cross_button{ width:30px; height:30px; display:flex; justify-content:center; align-items:center; background:$theme_topbar_menu_link_color; color:$theme_topbar_menu_background_color; border:1px solid $theme_base_color; font-size:16px; border-radius:5px; position:absolute; top:0; right:0; z-index:9; cursor:pointer; } [dir="rtl"] .inspira_header .cross_button{ left:0; right:auto; } /*Horizonatl Header*/ .inspira_header_horizontal .inspira_main_menu{ background-color:$theme_topbar_menu_background_color; margin-top:15px; } .inspira_header_horizontal .inspira_main_menu_container{ width:$theme_topbar_menu_width; margin:0 auto; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal{ display:flex; flex-wrap:wrap; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li{ border-radius:0px; display:flex; align-items:center; position:relative; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li:hover .main_menu_submenu{ display:block; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li:hover > a, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li.active > a{ color:$theme_topbar_menu_link_hover_color !important; background:$theme_topbar_menu_link_background_color_hover !important; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a:focus-visible{ color:$theme_topbar_menu_link_hover_color !important; background:$theme_topbar_menu_link_background_color_hover !important; border:2px solid #000; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a:focus-visible > span, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a:focus-visible > i:not(.menu_icon){ color:$theme_topbar_menu_link_hover_color !important; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a{ +noselect; outline:none; font-size:17px; padding:12px 32px; border-radius:0px; font-weight:400; transition:0.5s; width:100%; display:flex; justify-content:center; align-items:center; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li a:link, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li a:visited{ color:$theme_topbar_menu_link_color; text-decoration:$theme_topbar_menu_link_decoration; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a > span, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a > i:not(.menu_icon){ color:$theme_topbar_menu_link_color !important; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li.active > a > span, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li.active > a > i:not(.menu_icon), .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li:hover > a > span, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li:hover > a > i:not(.menu_icon){ color:$theme_topbar_menu_link_hover_color !important; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a > i{ margin-right:5px; font-family:"Font Awesome 5 Free"; font-style:normal; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a > i.menu_icon{ margin-right:5px; } [dir="rtl"] .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a > i.menu_icon{ margin-right:0; margin-left:5px; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a > i:not(.menu_icon){ margin-left:5px; } [dir="rtl"] .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li > a > i:not(.menu_icon){ margin-left:0; margin-right:5px; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li .main_menu_submenu{ display:none; position:absolute; margin:0px; padding:0px; min-width:170px; z-index:99; top:45px; border-radius:0px; text-align:left; max-height:300px; overflow-x:hidden; overflow-y:auto; white-space:nowrap; background-color:$theme_list_background_color; box-shadow:0 0px 4px rgb(0 0 0 / 15%); min-width:100%; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li > a, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li > a:visited, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li > a:link{ padding:12px 15px !important; display:flex; align-items:center; border-bottom:1px solid $theme_border_dark_color; color:$theme_font_color; background-color:$theme_list_background_color; margin:0; font-size:14px; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li.active > a, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li:hover > a{ background:$theme_base_color !important; color:$theme_base_font_color !important; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li.active > a > i, .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li.active > a > span{ color:$theme_base_font_color !important; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li > a:hover{ background-color:$theme_base_color ; color:$theme_base_font_color; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li:last-child > a{ border-bottom:none; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li > a i{ position:initial; margin-right:5px; left:inherit !important; top:inherit !important; } [dir="rtl"] .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li > a i{ margin-left:5px; margin-right:0; } .inspira_header_horizontal .inspira_main_menu .navigation_horizontal > li.more_tab ul.main_menu_submenu li a.menu_core_main i:not(.menu_icon){ display:none; } .inspira_header_horizontal .header_left_panel, .inspira_header_horizontal .navigation_button{ display:none; } /*Landing Page Header*/ .inspira_landingpage .layout_inspira_header{ display:none; } #global_page_core-index-index .layout_inspira_landing_page_header{ display:block; position:absolute; left:0; right:0; margin:auto; top:0; background:transparent; border:none; z-index:9; padding:0 !important; border-radius:0; } #global_page_core-index-index .layout_inspira_landing_page_header.sticyheader{ background:#000; position:fixed; top:0; left:0; right:0; width:100%; } #global_page_core-index-index .inspira_header .layout_core_menu_logo a, .banner_main_left .layout_core_menu_logo a{ color:$theme_base_font_color !important; } .inspira_header.lp_header .header_menu_mini{ flex:inherit; padding:0; } [dir="rtl"] .inspira_header.lp_header .header_menu_mini{ padding:0; } .inspira_header.lp_header .inspira_main_menu{ background-color:transparent; padding:0 8px; margin-top:0; flex:1; } .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li{ flex-grow:initial; } .inspira_header.lp_header, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li.active, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li:hover{ background-color:transparent !important; } .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_signup_link.core_mini_signup, .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_auth_link.core_mini_auth, #global_page_user-auth-login .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_signup_link.core_mini_signup, #global_page_user-auth-login .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_auth_link.core_mini_auth, #global_page_user-signup-index .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_signup_link.core_mini_signup, #global_page_user-signup-index .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_auth_link.core_mini_auth{ padding:0 18px; line-height:42px !important; height:45px !important; border:1px solid $theme_base_font_color !important; } .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_auth_link.core_mini_auth{ border-color:$theme_topbar_link_background_color !important; } .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_signup_link.core_mini_signup{ border-color:$theme_base_font_color !important; background:transparent !important; } .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li a{ padding:5px 7px; background:transparent !important; } .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li .main_menu_submenu{ top:28px; } .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li:hover > a, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li.active > a, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li.active > .menu_core_main i, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li a{ border:none !important; transition:0s !important; } .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li.active > a > span, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li.active > a > i:not(.menu_icon), .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li:hover > a > span, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li:hover > a > i:not(.menu_icon){ color:$theme_base_font_color !important; } .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li:hover > a, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li:hover > i, .inspira_header.lp_header .inspira_main_menu .navigation_horizontal > li ul.main_menu_submenu > li:hover > span{ color:$theme_base_font_color !important; } .inspira_landingpage .header_search{ display:none; max-width:100%; position:absolute; left:0; top:50px; width:500px; } .inspira_landingpage .header_search.open{ display:block; } .inspira_landingpage .inspira_header .search_button{ display:block; margin-right:5px; } [dir="rtl"] .inspira_landingpage .inspira_header .search_button{ margin-right:0; margin-left:5px; } .inspira_landingpage .inspira_header form{ background:transparent !important; } .inspira_landingpage .inspira_header .search_button a{ color:$theme_topbar_link_background_color !important; background:$theme_topbar_minimenu_link_color; border-color:$theme_topbar_minimenu_link_color; } .inspira_landingpage .inspira_header .search_button a i{ color:$theme_topbar_link_background_color !important; } .inspira_landingpage .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_auth_link.core_mini_auth{ background:$theme_base_color !important; color:$theme_base_font_color !important; border-color:$theme_base_color !important; } .inspira_landingpage #global_search_field{ border:1px solid $theme_border_color !important; } .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_auth_link.core_mini_auth i, .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_auth_link.core_mini_auth span, .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_signup_link.core_mini_signup span, .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_signup_link.core_mini_signup i, .inspira_landingpage .inspira_header.lp_header .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_signup.show_icons span{ color:$theme_base_font_color !important; } .inspira_landingpage .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_signup.show_icons span{ color:$theme_base_color !important; } .inspira_header.lp_header .layout_core_menu_logo a{ font-size:28px; } .inspira_header /*Accessibility Options Horizontal*/ .inspira_menu_top{ position:fixed; top:180px; left:-173px; transition:0.5s; z-index:1; } [dir="rtl"] .inspira_menu_top{ left:auto; right:-173px; } .inspira_menu_top.active{ left:0px; } [dir="rtl"] .inspira_menu_top.active{ right:0px; left:auto; } .inspira_top_inner{ background:$theme_base_color; padding:10px 20px; width:170px; margin:auto; position:relative; } .inspira_menu_setting a{ border-radius:0px 5px 5px 0px; background:$theme_base_color; height:40px; width:40px; position:absolute; top:0px; display:flex; align-items:center; justify-content:center; color:#fff !important; font-size:18px; right:-40px; } [dir="rtl"] .inspira_menu_setting a{ right:auto; left:-40px; border-radius:5px 0px 0px 5px; } .inspira_menu_setting_inner .inspira_menu_top_settings ul{ display:flex; color:$theme_topbar_minimenu_link_color !important; flex-direction:column; } .inspira_menu_setting_inner .inspira_menu_top_settings >ul >li ul.color_modes li.color-label , .inspira_menu_setting_inner .inspira_menu_top_settings >ul >li ul.resizer li.resizer-label{ width:100%; padding-bottom:8px; font-size:17px; font-weight:bold; color:#fff; } .inspira_menu_setting_inner .inspira_menu_top_settings ul ul{ display:flex; flex-direction:inherit; justify-content:flex-start; margin:6px 0; flex-wrap:wrap; } .inspira_menu_setting_inner .inspira_menu_top_settings > ul > li ul.color_modes li a, .inspira_menu_setting_inner .inspira_menu_top_settings >ul >li ul.resizer li a{ color:#fff !important; padding:2px 10px; border:1px solid #fff !important; margin:0 3px; display:block; font-size:13px; } .inspira_menu_setting_inner .inspira_menu_top_settings > ul > li ul.color_modes li.active a, .inspira_menu_setting_inner .inspira_menu_top_settings > ul > li ul.resizer li.active a{ background:#000 !important; color:$theme_topbar_menu_link_color !important; } .inspira_menu_setting_inner .inspira_menu_top_settings > ul > li ul.color_modes li.active a i, .inspira_menu_setting_inner .inspira_menu_top_settings > ul > li ul.resizer li.active a i{ color:$theme_topbar_menu_link_color !important; } .inspira_menu_setting_inner .inspira_menu_top_settings > ul > li ul.color_modes li a i, .inspira_menu_setting_inner .inspira_menu_top_settings > ul > li ul.resizer li a i{ color:#fff !important; font-size:13px; } /*Mini Menu*/ .inspira_header div#core_menu_mini_menu > ul > li{ padding-left:5px; display:inline-block; overflow:visible; vertical-align:middle; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li > a{ display:block; color:$theme_topbar_minimenu_link_color; font-weight:600; font-size:15px; padding:0; text-transform:uppercase; } .layout_core_menu_mini #core_menu_mini_menu > ul > li.mini_menu_currency_chooser > a.show_icons{ width:auto !important; } .layout_core_menu_mini #core_menu_mini_menu > ul > li.mini_menu_currency_chooser > a.show_icons span{ color:$theme_topbar_minimenu_link_color !important; } .inspira_header div#core_menu_mini_menu > ul > li i.menuicon:before{ font-size:16px !important; border:none !important; padding:0 !important; } .layout_core_menu_mini #core_menu_mini_menu li#core_menu_mini_menu_update #updates_toggle{ margin:0; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_profile{ width:40px; height:40px; padding:0; text-align:center; border:0px solid; border-radius:5px; box-sizing:border-box; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_profile > .thumb_icon{ border-radius:50%; border:none; margin:0; width:40px; height:40px; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth.show_icons, .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_signup.show_icons{ border:1px solid; padding:0 12px; font-size:16px !important; vertical-align:middle; line-height:35px !important; height:40px !important; border-radius:50px; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a.user_signup_link.menu_core_mini.core_mini_signup.show_icons i{ background-color:transparent; border:none; width:auto !important; height:auto !important; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth.show_icons i:before, .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_signup.show_icons i:before{ font-size:14px !important; } .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_auth i, .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_signup i{ vertical-align:middle; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_auth span, .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_signup.show_icons span{ display:inline-block !important; text-transform:capitalize; font-weight:500; font-size:14px; color:$theme_base_color !important; vertical-align:middle; width:auto !important; height:auto !important; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_auth i, .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_sign i{ width:auto !important; height:auto !important; display:inline-block !important; vertical-align:middle; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a.show_icons, .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a.show_icons .minimenu_icon{ color:$theme_topbar_minimenu_link_color !important; background:$theme_topbar_link_background_color; border-color:$theme_topbar_link_background_color; display:flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50px; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a i.minimenu_icon:before{ display:flex; align-items:center; justify-content:center; padding:0; } .layout_core_menu_mini #core_menu_mini_menu > ul .core_mini_auth span{ color:$theme_topbar_minimenu_link_color !important; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a.menu_core_mini.core_mini_auth, .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a.menu_core_mini.core_mini_auth i{ color:$theme_topbar_minimenu_link_color !important; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a.menu_core_mini.core_mini_auth i{ border:none !important; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth.show_icons{ border-width:1px; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth.show_icons i{ background-color:transparent; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth.show_icons:hover i, .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .user_signup_link.menu_core_mini:hover i{ color:$theme_topbar_menu_link_color; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a.show_icons{ font-size:0; } .inspira_header .layout_core_menu_mini #core_menu_mini_menu > ul > li a:-webkit-any-link:focus-visible{ border:1px solid #000; outline:none; } .inspira_header .core_mini_profile > .bg_item_photo{ width:38px; height:38px; margin:0 !important; vertical-align:middle; border-radius:50px; background-color:transparent; border:none !important; } [dir="rtl"] .inspira_header .core_mini_profile > .bg_item_photo{ margin-right:0px !important; margin-left:-2px !important; } .inspira_header .bg_thumb_icon:before{ color:$theme_topbar_minimenu_link_color; } .minimenu_update_count_bubble, .minimenu_message_count_bubble{ padding:0; height:20px; margin-left:22px; width:20px; line-height:19px; margin-top:-8px !important; cursor:pointer; } [dir="rtl"] .minimenu_update_count_bubble, [dir="rtl"] .minimenu_message_count_bubble{ margin-left:0px; margin-right:22px !important; } .minimenu_message_count_bubble{ display:block; } .minimenu_update_count_bubble_active.show_icons{ display:block; } /* Footer */ #global_footer{ background-color:$theme_footer_background_color; background-size:cover; border-top:none; display:block; margin-top:20px; width:100%; padding:40px 0; position:relative; z-index:1; } #global_footer::after{ content:''; position:absolute; left:0; right:0; margin:auto; top:0; width:100%; height:100%; background:rgba(0, 0, 0, .60); } .layout_page_footer{ clear:both; text-align:center; overflow:visible; margin:0; z-index:1; position:relative; } .layout_page_footer .layout_main{ text-align:left; overflow:hidden; padding:10px; width:$theme_main_width; margin:0 auto; } .custom_footer_heading{ font-size:22px; font-weight:600; color:$theme_footer_font_color; position:relative; padding:0 0 10px; letter-spacing:1.2px; } .custom_footer_heading:after{ content:''; position:absolute; left:0; bottom:-2px; width:50px; height:4px; background-color:$theme_footer_link_hover_color; } [dir="rtl"] .custom_footer_heading:after{ left:auto; right:0; } .footer_left_links{ margin-right:15px ; } .footer_left_links a{ margin-left:8px; } #global_footer a, .footer_link_bottom a::after{ color:$theme_footer_link_color; transition:0.2s; } #global_footer a:hover, .footer_link_bottom a:hover::after{ color:$theme_footer_link_hover_color; } #global_footer p{ color:$theme_footer_font_color; } .inspira_footer_left{ padding-right:40px; } [dir="rtl"] .inspira_footer_left{ padding-right:0px; padding-left:40px; } .footer_logo img{ max-height:80px; max-width:100%; } .inspira_footer_left p{ margin:15px 0; } .inspira_footer_left ul{ padding-top:8px; } .inspira_footer_left ul li{ color:$theme_footer_font_color; display:block; margin-bottom:14px; } .inspira_footer_left ul li:last-child(1){ margin-bottom:0; } .inspira_footer_left ul li i{ padding-right:3px; width:20px; text-align:center; } [dir="rtl"] .inspira_footer_left ul li i{ padding-right:0px; padding-left:3px; } .footer_link_bottom{ margin-top:30px; } .footer_link_bottom a{ display:block; width:100%; margin-bottom:15px; font-size:15px; position:relative; padding-left:20px; } [dir="rtl"] .footer_link_bottom a{ padding-left:0; padding-right:20px; } .footer_link_bottom a:after{ content:"\\f101"; position:absolute; left:0; top:0; width:20px; height:20px; font-weight:600; color:$theme_footer_link_color; font-family:"Font Awesome 5 Free"; } [dir="rtl"] .footer_link_bottom a:after{ content:"\\f100"; left:auto; right:0; } .footer_social_links{ margin-top:20px; } .footer_social_links > ul{ display:flex; } .footer_social_links > ul li{ margin-right:10px; } [dir="rtl"] .footer_social_links > ul li{ margin-left:10px; margin-right:0; } .footer_social_links > ul li a{ border-radius:3px; border-width:1px; display:flex; align-items:center; justify-content:center; width:35px; height:35px; } .footer_social_links > ul li a i, .footer_social_links > ul li a i.fa:before{ font-style:normal; font-family:"Font Awesome 5 Brands"; } .footer_social_links > ul li a:hover{ background-color:$theme_button_background_color; color:$theme_button_font_color !important; } .footer_copyright_section{ display:flex; align-items:center; justify-content:space-between; color:$theme_footer_font_color; padding-top:20px; border-top:1px solid $theme_footer_border_color; margin-top:25px; } .footer_copyright_section form select#language{ border-color:$inspira_footer_border_color; color:$theme_footer_font_color; background-color:transparent; } .footer_copyright_section form select#language option{ background-color:$theme_footer_background_color !important; } .footer_donotsell{ color:$theme_footer_link_color !important; margin:0; } /* 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{ +rounded; background-color:$theme_list_background_color; display:inline-block; padding:.5em .9em; float:left; margin-bottom:15px; border:1px solid #e4dfc6; } .tip>span:before{ content:"\\f0eb"; font-family:'Font Awesome 5 Free'; margin-right:5px; color:#FF9800; } .tip>span:before{ content:"\\f0eb"; font-family:'Font Awesome 5 Free'; } [dir="rtl"] .tip>span{ float:right; } [dir="rtl"] .tip>span:before{ margin-right:0px; margin-left:5px; } /* 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:5px 15px 5px 15px; float:left; clear:left; overflow:hidden; border:1px solid #ccc; color:#323232; } html[dir="rtl"] ul.form-errors>li, html[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; color:#323232; } 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; } [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; } [dir="rtl"] ul.form-notices>li:before{ margin-right:0px; margin-left:5px; } /* GLOBAL FORM ELEMENTS Used for most forms throughout the site. */ button{ +rounded; padding:.5em .8em; font-size:100%; border:none; background-color:$theme_button_background_color; color:$theme_button_font_color; text-transform:uppercase; transition:all .2s ease-in-out; border-radius:50px; } button:hover{ background-color:$theme_button_background_color_hover ; cursor:pointer; opacity:.8; transition:all .2s ease-in-out; } button:focus-visible{ background-color:$theme_button_background_color_hover ; cursor:pointer; opacity:.8; transition:all .2s ease-in-out; outline:0; } button:active{ background-color:$theme_button_background_color_active; background-image:none; } input[type=text], input[type=email], input[type=password], input.text, textarea, select, html .selectize-input, html .selectize-control.single .selectize-input.input-active{ background-color:$theme_input_background_color; resize:none; box-sizing:border-box; color:$theme_font_color; border:1px solid $theme_input_border_colors; border-radius:5px; font-size:14px; display:block; padding:10px; max-width:100%; width:100%; outline:0; } input:focus-visible, select:focus-visible, textarea:focus-visible{ border-color:$theme_button_background_color !important; } html .selectize-input > input{ color:$theme_font_color; } ::placeholder{ color:$theme_input_font_color; opacity:1; } input[type=checkbox], input[type=radio]{ border:none; padding:0px; margin:2px 5px 0px 0px; width:auto; display:block; float:left; } html[dir="rtl"] input[type=checkbox], html[dir="rtl"] input[type=radio]{ margin:2px 0px 0px 5px; float:right; } input[type=checkbox]+label, input[type=radio]+label{ display:block; cursor:pointer; } textarea.codebox{ width:95%; min-height:200px; font-family:courier new, courier, serif; } html[dir="rtl"] select{ padding:6px 1px 6px 0px; } select option{ padding:0px 10px 0px 3px; } html[dir="rtl"] select option{ padding:0px 3px 0px 10px; } a.buttonlink{ display:inline-block; line-height:200%; } a.buttonlink_right{ font-weight:600; display:inline-block; } br.multi-text-separator{ margin-bottom:8px; } .global_form div#body-element #compose-container{ border:1px solid $theme_input_font_color; border-radius:5px; } textarea.im_menu_convo_input{ padding:0px !important; } /* 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 */ form.global_form{ clear:both; overflow:hidden; width:60%; } /* external form border */ .global_form>div{ overflow:hidden; } /* internal form border */ .global_form>div>div{ box-sizing:border-box; overflow:hidden; } /* form headline */ .global_form>div>div>h3{ font-size:20px; color:$theme_anchor_color; font-weight:600; margin:0; padding-bottom:0; } .global_form div.form-wrapper-heading{ font-weight:600; border-bottom:1px solid $theme_foreground_border_color_light; height:1em; margin-bottom:15px; } .global_form div.form-wrapper-heading>span{ display:block; position:absolute; overflow:hidden; padding:4px 6px 4px 0px; background:$theme_form_background_color; } html[dir="rtl"] .global_form div.form-wrapper-heading>span{ padding:4px 0px 4px 6px; } .global_form div.form-wrapper+div.form-wrapper-heading{ margin-top:10px; } /* form instructions (after title) */ .global_form>div>div>h3+p{ padding:0; margin-top:5px; line-height:140%; box-sizing:border-box; font-size:0.90em; } /* add some space above form elements if title/instructions precede */ .global_form>div>div>h3+div, .global_form>div>div>h3+p+div{ margin-top:20px; } /* 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{ margin-bottom:10px; color:$theme_form_label_font_color; font-weight:500; font-size:16px; } /* right-side form element container */ .global_form div.form-element{ margin-bottom:15px; overflow:hidden; } #global_page_user-edit-profile .global_form .form-elements{ position:relative; } #global_page_user-edit-profile .global_form .form-elements::after{ content:''; clear:both; display:block; position:relative; } #global_page_user-edit-profile .global_form div.form-element{ min-width:90%; max-width:90%; clear:none; float:left; } [dir="rtl"] #global_page_user-edit-profile .global_form div.form-element{ float:right; } /* all paragraphs of text in the form */ .global_form div>p{ padding-bottom:0px; margin-bottom:0; margin-top:5px; } /* paragraphs of text that come after an input element */ .global_form div>input+p{ margin-top:3px; font-size:10pt; } /* all text inputs in form */ /* 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 input[type=checkbox], .global_form input[type=radio]{ clear:left; } html[dir="rtl"] .global_form input[type=checkbox], html[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; } html[dir="rtl"] .global_form input+label{ float:right; margin-left:0px; margin-right:2px; } /* All Select Boxes in Form */ html[dir="rtl"] .global_form select{ padding:10px; } /* All Textareas in Form */ .global_form p.description{ margin:7px 0px 10px 0px; padding:0px; font-size:90%; } .global_form #submit-element{ margin-bottom:0px; } .global_form button[type=submit]{ margin-right:3px; } form.global_form_activity_edit_post .form-elements{ align-items:center; } html[dir="rtl"] .global_form button[type=submit]{ margin-right:0px; margin-left:3px; } /* Required field asterisk */ .form-label .required::after{ content:' *'; color:#f00; } /* 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{ padding:0px; width:auto; } .global_form_box .form-wrapper+.form-wrapper{ margin-top:5px; } .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; } html[dir="rtl"] .global_form_box label{ text-align:right; } .global_form_box .form-element{ overflow:hidden; } #filter_form label{ font-size:15px; } .layout_group_browse_search .global_form{ width:100%; } #filter_form .browse-range-wrapper input[type="text"], form.filters .browse-range-wrapper input[type="text"]{ width:50px !important; display:inline-block; } .layout_event_browse_search form.filters, .layout_group_browse_search form.filters{ background-color:transparent; } #filter_form input:focus-visible, #filter_form select:focus-visible, #filter_form textarea:focus-visible, form.filters input:focus-visible, form.filters select:focus-visible, form.filters textarea:focus-visible{ border-color:$theme_button_background_color !important; } div#searchform{ float:none; } div#searchform form{ display:flex; } div#searchform form button{ margin-left:10px; } div#searchform form select{ margin-left:10px; width:250px; } .layout_event_browse_search label, .layout_group_browse_search label{ font-size:16px; margin-bottom:4px; } .layout_event_browse_search div#search_text-wrapper, .layout_group_browse_search div#search_text-wrapper{ margin-bottom:15px; } form.filters dd{ margin-bottom:15px !important; } .global_form_box .form-element input, .global_form_box .form-element select, .layout_event_browse_search input, .layout_event_browse_search select, .layout_group_browse_search input, .layout_group_browse_search select{ border-radius:5px !important; border:1px solid $theme_input_border_colors; color:$theme_font_color; font-size:14px; padding:8px 10px; } .layout_event_browse_search .form-element button, .layout_group_browse_search .form-element button, .browseclassifieds_criteria.classifieds_browse_filters button{ border-radius:50px; padding:9px 22px; font-weight:600; font-size:16px; } .global_form_box .form-element button{ border-radius:5px; padding:9px 22px; font-weight:600; font-size:14px; } /* 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{ +rounded; padding:10px; } #filter_form .form-wrapper+.form-wrapper{ margin-top:15px; } form.filters div.form-label{ margin-bottom:3px; font-size:90%; } form.filters div.form-element{ margin-top:2px; } form.filters button{ margin-top:4px; } form.filters dt{ font-size:90%; padding-bottom:2px; } form.filters dd{ margin-bottom:8px; } #filter_form, form.filters{ font-size:90%; } /* POPUP FORM These are used to style popup (i.e. smoothbox) forms. Also used to style popup response messages, etc. */ .global_form_popup{ padding:10px 10px 10px 13px; overflow:hidden; } html[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; } html[dir="rtl"] .global_form_popup #submit-wrapper, html[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; } html[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; } .global_form select{ max-width:100%; width:100%; } .global_form .tox-tinymce{ width: 100% !important; } .global_form div.form-wrapper{ margin-bottom:10px; } .form-element .selectize-input{ box-shadow:none; padding:11px 10px; border-radius:5px; border-color:$theme_input_border_colors !important; } .form-element .selectize-input.focus{ box-shadow:none; } form#form-upload div.form-label label{ text-align:left; display:block; } [dir="rtl"] form#form-upload div.form-label label{ text-align:right; } a#upload_file_link:before{ margin-right:10px; } [dir="rtl"] a#upload_file_link:before{ margin-left:10px; margin-right:0; } .global_form button[type=submit]{ border-radius:50px; font-size:14px; font-weight:600; padding:14px 20px; } /* UPLOAD FORM Styles the file upload form. */ #form-upload #file-label{ display:none; } #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{ float:left; clear:right; padding:5px; } [dir="rtl"] #searchform{ float:right; clear:left; } #searchform input[type=text]{ width:300px; } #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; margin-top:10px; border-top-width:1px; padding-top:10px; display:flex; align-items:center; width:100%; } .search_result .search_photo{ display:block; float:left; overflow:hidden; margin-right:7px; } [dir="rtl"] .search_result .search_photo{ float:right; margin-right:0px; margin-left:7px; } .search_result .search_info{ display:block; overflow:hidden; } .search_result .search_title{ font-size:90%; } .search_result .highlighted-text{ font-weight:600; } /* COMMENTS These Styles are Used Everywhere Comments Appear. */ .feed_item_date + .comments{ margin-top:5px; } .comments{ width:100%; } .comments>ul{ overflow:hidden; } .comments>ul>li{ background-color:transparent; background-image:none; border:none; padding:8px 0; border-top:1px solid $theme_foreground_border_color; overflow:hidden; margin-bottom:1px; } .comments ul ul>li{ display:inline-block; vertical-align:middle; } .comments .comments_author a{ font-weight:600; margin-right:2px; } html[dir="rtl"] .comments .comments_author a{ margin-right:0px; margin-left:2px; } html[dir="rtl"] .comments_author{ float:right; } .comments .comments_author_photo{ float:left; overflow:hidden; line-height:0px; font-size:0px; } html[dir="rtl"] .comments .comments_author_photo{ float:right; } .comments .comments_author_photo img{ display:block; } .comments .comments_options{ font-weight:600; font-size:90%; color:$theme_font_color_light; margin-bottom:6px; } .comments .comments_comment_options>a{ font-size:90%; font-weight:600; margin-top:5px; overflow:hidden; } .comments .comments_info{ font-size:90%; padding-top:2px; padding-left:10px; overflow:hidden; } html[dir="rtl"] .comments .comments_info{ padding-left:0px; padding-right:10px; } .comments .comments_date{ font-size:.9em; color:$theme_font_color_light; overflow:hidden; } .comments .comments_likes, .comments .comments_viewall{ font-size:90%; } .comments .comments_likes a, .comments .comments_viewall a{ font-weight:600; } .comments>form{ background-image:none; border:none; padding:5px 10px 5px 5px; border-top:1px solid $theme_foreground_border_color; background-color:transparent; } html[dir="rtl"] .comments>form{ padding:5px 5px 5px 10px; } .comments>form>textarea{ width:100%; } .comments>form>button{ display:block; margin-top:7px; } 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; } ul#activity-feed .comments{ background:$comments_background_color; margin:0 -15px -15px; width:auto; padding:0px 15px; } ul#activity-feed .comments > form{ padding:5px 10px 15px 5px; } ul#activity-feed .comments label{ padding:8px; } /* HEADLINE Used at the top of most browse pages. Often contains button-style tabs. */ .headline{ overflow:hidden; } .headline h2{ margin-right:25px; margin-bottom:0px; margin-left:3px; display:inline-block; vertical-align:middle; float:none !important; } html[dir="rtl"] .headline h2{ float:right; margin-right:3px; margin-left:25px; } /* TABS (BUTTON STYLE, DEFAULT) */ .tabs{ overflow:hidden; display:inline-block; vertical-align:middle; margin-left:20px; } .tabs *{ font-family:$theme_buttontabs_font_family; } [dir="rtl"] .tabs{ margin-left:0px; margin-right:20px; } .tabs > ul{ display:inline-block; vertical-align:middle; } .tabs > ul > li{ margin-right:10px; display:inline-block; vertical-align:middle; } [dir="rtl"] .tabs > ul > li{ margin-right:0px; margin-left:10px; } .tabs > ul > li > a{ border:1px solid $theme_button_border_color; color:$theme_buttontabs_font_color; display:inline-block; padding:11px 21px; font-size:14px; border-radius:50px; font-weight:600; transition:0.5s; } .tabs > ul > li > a:hover{ background-color:$theme_buttontabs_background_color_hover; color:$theme_buttontabs_font_color_hover; } .tabs > ul > li.active > a{ background-color:$theme_buttontabs_background_color_active; color:$theme_buttontabs_font_color_active; } .tabs > ul > li > a:focus-visible{ background-color:$theme_buttontabs_background_color_active; color:$theme_buttontabs_font_color_active; outline:0; } .tabs > ul > li.active > a:hover{ text-decoration:none; } /* TABS (TAB STYLE, NON-DEFAULT) */ .tabs_alt{ background-color:transparent; background-image:none; +rounded(3px, false, false, true, true); padding:0px; -moz-user-select:none; -webkit-user-select:none; font-family:$theme_buttontabs_font_family; } .tabs_alt *{ font-family:$theme_buttontabs_font_family; } .tabs_alt > ul{ margin:0px; font-weight:600; padding:0; border:none !important; } .tabs_alt > ul > li > a{ text-decoration:none; color:$theme_tabs_font_color; outline:none; padding:7px 15px; border-radius:5px; display:block; border:2px solid $theme_tab_border_color !important; margin:2px 6px 0px 0; } .tabs_alt > ul > li > a:hover{ background-color:$theme_tabs_background_color_hover; color:$theme_tabs_font_hover_color; } .tabs_alt > ul >li.tab_active > a, .tabs_alt > ul > li.active > a{ background:$theme_tabs_background_color_active; color:$theme_tabs_font_color_active !important; } .tabs_alt > ul > li > a:focus-visible{ background:$theme_tabs_background_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-radius:5px !important; } .tab_pulldown_contents{ background:$theme_pulldown_contents_background_color; width:140px; max-height:500px; overflow-y:auto; } .tab_pulldown_contents > ul > li > a{ padding:8px 10px; font-size:90%; min-width:100px; max-width:250px; -moz-user-select:none; -webkit-user-select:none; font-family:$theme_buttontabs_font_family; display:block; } .tab_pulldown_contents > ul > li + li a{ border-top:1px solid $theme_tab_border_color; } .tab_pulldown_contents > ul > li:hover a{ background-color:$theme_tabs_background_color_hover; color:$theme_tabs_font_hover_color; } .tab_pulldown_contents > ul > li > a:focus-visible{ background-color:$theme_tabs_background_color_hover; color:$theme_tabs_font_hover_color; outline:0; } .tab_pulldown_contents > ul > li.active a{ background-color:$theme_tabs_background_color_active; color:$theme_tabs_font_color_active; } .tab_pulldown_contents_wrapper{ background-color:$theme_tabs_background_color_active; display:none; position:absolute; padding:2px; z-index:99; margin:0; border-radius:5px; margin-top:0px; } .tabs_alt > ul > li.tab_open .tab_pulldown_contents_wrapper{ display:block; } /*Tabs Container*/ .layout_core_container_tabs{ background:none !important; padding:0 !important; border:0px !important; } .layout_core_container_tabs>.tabs_alt{ +widget; } /* PULLDOWN SELECT BOX Styles the inline pulldown select popup box that is used as an alternative to regular input select boxes in some places. */ .pulldown > a, .pulldown_active > a{ display:inline-block; font-weight:600; padding:5px 7px 5px 18px; outline:none; font-size:90%; -moz-user-select:none; -webkit-user-select:none; } .pulldown > a{ +rounded(4px); background-color:$theme_button_background_color; color:$theme_button_font_color; text-decoration:none; display:flex; } .pulldown > a:hover{ background-color:$theme_button_background_color_hover; } .pulldown_active > a{ +rounded(4px, false, false, true, true); background-color:$theme_pulldown_background_color_active; color:$theme_pulldown_font_color_active; text-decoration:none; } #core_menu_mini_menu .pulldown_contents_wrapper:before, #core_menu_mini_menu .core_settings_dropdown:before{ content:""; position:absolute; border-left:10px solid transparent; border-right:10px solid transparent; border-bottom:10px solid $theme_list_background_color; top:-9px; left:50%; transform:translateX(-50%); } #core_menu_mini_menu .core_settings_dropdown:before{ right:0px; left:auto; } [dir="rtl"] #core_menu_mini_menu .core_settings_dropdown:before{ left:15px; right:auto; } .pulldown_active .pulldown_contents_wrapper{ display:block; } .pulldown_contents ul > li .bg_thumb_icon:before{ font-size:20px; color:$theme_font_color; } .pulldown_options a{ font-size:90%; text-align:center; display:block; } [dir="rtl"] .pulldown_options a{ text-align:center; } .pulldown_options a:last-child{ border-left-width:1px; } [dir="rtl"] .pulldown_options a:last-child{ border-left-width:0; border-right-width:1px; } .pulldown > a{ display:flex; } .pulldown > a:before, .pulldown_active > a:before{ font-family:'Font Awesome 5 Free'; font-size:14px; font-weight:600; content:"\\f0d7"; order:2; margin-left:5px; } [dir="rtl"] .pulldown > a:before{ margin-left:0; margin-right:5; } .core_mini_friends .pulldown_options{ display:block; } .core_mini_friends .pulldown_options > a{ border-width:0; } #core_menu_mini_menu .pulldown_contents_wrapper{ margin-left:-132px; } [dir="rtl"] #core_menu_mini_menu .pulldown_contents_wrapper{ margin-left:0px; margin-right:-132px; } /* PULLDOWN SELECT BOX FOR UPDATES Styles the inline pulldown select popup box used for updates that is used as an alternative to regular input select boxes in some places. */ #core_mini_updates_pulldown{ display:block !important; } .updates_pulldown>a.core_mini_update, .updates_pulldown_active>a.core_mini_update{ display:block; color:$theme_topbar_minimenu_link_color; font-weight:600; padding:0; text-transform:uppercase; } .updates_pulldown>a.core_mini_update{ display:block; +rounded(3px); font-weight:600; padding:0; margin-right:5px; text-transform:uppercase; outline:none; } .updates_pulldown>a.new_updates:hover{ +rounded(3px); color:$theme_topbar_minimenu_link_color; background-color:transparent; } .updates_pulldown_active>a.core_mini_update{ text-decoration:$theme_topbar_minimenu_link_hover_decoration; } .requests_menu > li{ display:flex; } .requests_menu > li .pulldown_item_photo{ margin-right:10px; } [dir="rtl"] .requests_menu > li .pulldown_item_photo{ margin-right:0px; margin-left:10px; } /* 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; display:inline-block; float:left; padding:.4em .6em .4em .6em; margin:0px 10px 5px 0px; font-size:90%; } html[dir="rtl"] .tag{ float:right; margin:0px 0px 5px 10px; } .tag>a{ text-decoration:none; padding-left:6px; text-transform:uppercase; } html[dir="rtl"] .tag>a{ float:left; padding-left:0px; padding-right:6px; } /*Pagination*/ .pages{ margin-top:20px; } .paginationControl{ border:1px solid $theme_border_color; } .paginationControl > li > a{ font-size:90%; font-weight:normal; } .paginationControl > li.selected{ background:$theme_base_color; } .paginationControl >li.selected > a{ color:$theme_button_font_color; font-weight:600; } .sharebox{ margin:10px; border:2px dashed $theme_border_color; } #explore_container{ display:block; height:0; left:0; overflow:visible; position:absolute; top:0; width:100%; z-index:9999; } .submenu{ display:none; height:auto !important; overflow:hidden; position:absolute; width:auto !important; } .submenu ul a{ color:#888 !important; display:block; font-size:12px; padding:10px 20px 10px 10px; } .submenu ul a:hover{ background-color:#eee; color:#464646 !important; text-decoration:none; } /* Request widget */ ul.requests_widget{ padding:0; } /* Popup */ #TB_window{ border-color:$theme_button_border_color; } #user_form_login.global_form_box #remember-wrapper label{ margin-top:0; } #user_form_login.global_form_box #remember-wrapper{ clear:both; padding-left:0; padding-right:0; } /* View more link */ .generic_list_wrapper{ margin-bottom:0; } .generic_list_wrapper > ul{ padding:0; } .viewlink{ color:$theme_base_color !important; font-size:15px; font-weight:600; } /*Profile Cover*/ .profile_cover_head_inner{ position:absolute !important; top:50%; transform:translate(0px, -50%); margin:auto !important; padding-bottom:0 !important; flex-direction:column; } .profile_main_photo_wrapper{ margin:auto; } .profile_cover_wrapper .cover_photo_profile_information{ margin:auto !important; flex-direction: column; justify-content:center; } .cover_photo_profile_status{ margin:10px auto 0 !important; text-align: center !important; width:100%; } .profile_cover_options .edit-button{ z-index: 2 !important; } .cover_photo_profile_information .profile_status_text, .cover_photo_profile_status > *, .cover_photo_profile_information .profile_status_text *, .cover_photo_profile_information .cover_photo_stats > span{ color:#fff !important; } .profile_status_scroll{ display:none; } .profile_main_photo #user_profile_photo, .profile_main_photo #group_profile_photo, .profile_main_photo #event_profile_photo, .profile_main_photo_wrapper #poll_profile_photo{ height:140px !important; width:140px !important; } /*Shimmer Effect*/ .shimmer_profile_cover_head_inner{ position:absolute !important; top:42%; transform:translate(0px, -42%); margin:auto !important; padding-bottom:0 !important; flex-direction:column; } .shimmer_profile_main_photo_wrapper{ margin:0 auto 10px !important; height:140px; width:140px; } .shimmer_cover_photo_profile_information{ margin:auto !important; flex-direction:column; justify-content:center; } .shimmer_cover_photo_profile_status .shimmer_cover_photo_stats{ margin:0 auto 8px !important; } .shimmer_coverphoto_navigation { margin:auto !important; } .shimmer_coverphoto_navigation ul > li > a, .shimmer_cover_photo_profile_status .shimmer_cover_photo_stats, .shimmer_cover_photo_profile_status > h2, .shimmer_profile_main_photo_wrapper{ background:#9d9d9d; background:linear-gradient(to right, #9d9d9d 8%, #a1a1a1 18%, #9d9d9d 33%) !important; } .light_mode .shimmer_coverphoto_navigation ul > li > a, .light_mode .shimmer_cover_photo_profile_status .shimmer_cover_photo_stats, .light_mode .shimmer_cover_photo_profile_status > h2, .light_mode .shimmer_profile_main_photo_wrapper{ background:#9d9d9d; background:linear-gradient(to right, #9d9d9d 8%, #a1a1a1 18%, #9d9d9d 33%) !important; } .dark_mode .shimmer_coverphoto_navigation ul > li > a, .dark_mode .shimmer_cover_photo_profile_status .shimmer_cover_photo_stats, .dark_mode .shimmer_cover_photo_profile_status > h2, .dark_mode .shimmer_profile_main_photo_wrapper{ background: #666666; background: linear-gradient(to right, #666666 8%, #676767 18%, #666666 33%) !important; } html .profile_cover_photo_empty:before{ position:absolute; left:0; content:''; top:0; height:99%; width:100%; background:rgba(0, 0, 0, .20); z-index:1; border-radius: 10px; } .profile_main_photo .profile_cover_options .profile_cover_btn i{ background-color:$theme_list_background_color !important; } ul.profile_options_pulldown{ background-color:$theme_list_background_color !important; } ul.profile_options_pulldown::before{ border-bottom-color:$theme_list_background_color !important; } .cover_photo_profile_information .profile_status_text{ text-align: center !important; } html .profile_cover_photo:before{ position:absolute; left:0; content:''; top:0; height:100%; width:100%; background:rgba(0, 0, 0, .20); z-index:1; } .profile_cover_photo.cover_photo_wap.b_dark.dragncrop.remove_overlay::before{ display:none; } .profile_cover_photo_tabs .tabs_alt{ box-shadow:inherit !important; border:1px solid $theme_border_color; border-radius:5px; } .generic_layout_container.layout_core_container_tabs.profile_cover_photo_tabs .tabs_alt > ul > li > a{ border:none !important; color:$theme_font_color; background:transparent; padding:20px; font-size:14px; font-weight:600; border-radius:0; } .generic_layout_container.layout_core_container_tabs.profile_cover_photo_tabs .tabs_alt > ul > li > a:hover{ color:$theme_base_color; } .generic_layout_container.layout_core_container_tabs.profile_cover_photo_tabs .tabs_alt > ul > li.active > a{ background:transparent !important; color:$theme_base_color !important; border-bottom:3px solid $theme_base_color !important; } .generic_layout_container.layout_core_container_tabs.profile_cover_photo_tabs .tabs_alt > ul > li > a:focus-visible{ background:transparent !important; color:$theme_base_color !important; border-bottom:3px solid $theme_base_color !important; } .generic_layout_container.layout_user_cover_photo{ padding:0 !important; border:none !important; } body#global_page_user-profile-index .profile_cover_photo_tabs .tabs_alt.tab_collapsed{ position:absolute; left:0; right:0; width:$theme_main_width; margin:auto; border:none; padding:0; border-bottom:3px solid $theme_border_color; margin-top:-95px; border-radius:0 !important; } .profile_cover_photo_tabs .tabs_alt.tab_collapsed{ border:none; padding:0; border-bottom:3px solid $theme_border_color; } .profile_cover_photo_tabs .tabs_alt.tab_collapsed > ul{ margin:0px 0 -2px !important; } #global_page_user-profile-index .layout_top + .layout_main .layout_middle{ margin-top:50px !important; } #global_page_user-profile-index .layout_top + .layout_main .layout_left, #global_page_user-profile-index .layout_top + .layout_main .layout_right{ margin-top:55px !important; } .layout_core_container_tabs .layout_activity_feed{ border:none !important; } .layout_user_list_online > div, ul.generic_list_widget, .layout_core_statistics ul, .generic_list_wrapper{ background-color:transparent; } .browsemembers_results .bg_item_photo{ border-radius:50%; } .chat_header .pulldown > a{ color:$theme_buttontabs_font_color_hover; background-color:$theme_buttontabs_background_color_hover; } .chat_header .pulldown > a:hover{ color:$theme_buttontabs_font_color_hover; background-color:$theme_buttontabs_background_color_hover; } ul.forum_categories .forum_topics>span, ul.forum_categories .forum_posts>span{ font-size:14px; } ul.list_wrapper .blogs_options{ width:130px; } .profile_main_photo_wrapper #user_profile_photo, .profile_main_photo_wrapper #group_profile_photo, .profile_main_photo_wrapper #event_profile_photo{ border:1px solid $theme_border_color; border-radius:50%; } .layout_event_profile_info{ margin:0; } #profile_photo img{ border-radius:50%; min-height:auto; } .profile_main_photo .item_photo{ border-radius:50%; min-height:auto; } .profile_cover_wrapper .profile_main_photo{ background-color:transparent; border:none; } .generic_layout_container.layout_group_cover_photo, .generic_layout_container.layout_event_cover_photo, .generic_layout_container.layout_poll_cover_photo{ border-radius:5px !important; background:$theme_list_background_color !important; padding:10px !important; border:1px solid $theme_border_color !important; } .layout_core_banner a:link, .layout_core_banner a:visited{ padding:10px 20px; font-size:16px; border-radius:5px; font-weight:500; } .layout_core_banner{ padding:5px !important; } .generic_layout_container.layout_user_browse_menu .headline h2{ font-size:22px; color:$theme_heading_color; font-weight:500; } .layout_core_banner > div > section{ height:400px; } .browsemembers_criteria label.optional{ font-size:14px; font-weight:500; } .browsemembers_criteria{ background-color:transparent; } .field_search_criteria input, .field_search_criteria select{ margin-top:6px; } .browsemembers_criteria li.browse-range-wrapper select{ display:inline-block; width:43%; margin:0 5px; } .browsemembers_criteria > ul > li + li{ margin-top:15px; } .browsemembers_results > ul > li{ border-width:0; } .browsemembers_results ul > li > a{ width:100%; height:auto; } .browsemembers_results a .bg_item_photo{ border:1px solid $theme_border_medium_color; padding-top:100%; display:block; } .browsemembers_results div.browsemembers_results_info{ padding:24px 0 10px 0; } .browsemembers_results div.browsemembers_results_info a{ font-size:17px; } .browsemembers_results_links a.buttonlink{ background:$theme_button_background_color; border:1px solid $inspira_button_border_color; color:$theme_button_font_color; border-radius:50px; font-weight:600; margin-bottom:16px; display:block; font-size:$theme_font_size; } .browsemembers_results_links a.buttonlink.icon_user_block{ background-color:transparent; color:$theme_button_background_color; } .browsemembers_results_links a.buttonlink:hover{ background-color:$theme_button_background_color_hover; color:$theme_button_font_hover_color; } .user_profile_info ul li{ border:none; border-bottom:1px solid $theme_border_color; border-radius:0; } .user_profile_info ul li:last-child{ border-bottom:0px; } /*Notification Page*/ [dir="rtl"] .notifications_item_delete > a{ right:auto; left:0; } div.notifications_layout h3.sep{ height:50px; border-color:$theme_button_border_color; margin-bottom:25px; } div.notifications_layout h3.sep > span{ background:$theme_base_color; color:$theme_base_font_color; padding:12px 15px; font-weight:600; } /*User Photo*/ .home-links-user{ margin:-15px -15px 10px; background:$theme_base_color; padding:25px 15px; display:flex; align-items:center; } .home-links-user .user{ padding-top:0; } [dir="rtl"] .home-links-user .user{ padding-left:0; padding-right:60px; } .home-links-user .user a{ font-size:18px; font-weight:600; text-transform:capitalize; color:$theme_base_font_color; } .home-links-user .image .bg_thumb_icon{ border:2px solid $theme_base_font_color !important; } .layout_user_home_photo > div > a > img, .layout_user_profile_photo div#profile_photo{ width:200px; height:200px; border-radius:50%; overflow:hidden; border:2px solid $theme_photo_border_color; display:block; margin:auto; } .layout_user_home_photo > div > a > span{ width:200px; height:200px; padding:0; margin:auto; text-align:center; display:block; border-radius:50%; border:5px solid $theme_base_color; } .layout_user_profile_photo div#profile_photo img{ border:none; width:100% !important; height:100% !important; } .layout_user_home_photo h3{ text-align:center; } .layout_user_list_online>div{ padding:0; } .layout_user_list_online .whosonline_thumb .bg_thumb_icon{ border-width:3px !important; } .layout_core_hashtags_cloud ul > li{ text-transform:capitalize; } .layout_core_hashtags_cloud ul > li > a{ color:$theme_button_background_color; border:1px solid $theme_button_border_color; background:transparent; padding:8px; border-radius:5px; transition:.5s; margin-bottom:8px; } .layout_core_hashtags_cloud ul > li > a:hover{ color:$theme_button_font_color; background:$theme_button_background_color; } /*Statics*/ .layout_core_statistics ul{ padding:0; margin:0; } .layout_core_statistics ul > li{ padding:10px 0; text-transform:capitalize; display:flex; align-items:center; border-bottom:1px solid $theme_border_color; } .layout_core_statistics ul > li:last-child{ border-bottom:0; } .layout_core_statistics ul li span{ background-color:$theme_button_background_color; color:$theme_button_font_color; min-width:28px; height:28px; text-align:center; border-radius:50px; font-size:15px; line-height:30px; margin:0 !important; padding:0 5px; order:1; } .layout_core_statistics ul > li div{ flex:1; order:2; padding-left:15px; } [dir="rtl"] .layout_core_statistics ul > li div{ padding-left:0; padding-right:15px; } /*Quick & Profile Links*/ .layout_user_home_links .quicklinks li, #profile_options li, ul.navigation.blogs_gutter_options li{ padding:0; } .layout_user_home_links .quicklinks li + li, #profile_options li + li, ul.navigation.blogs_gutter_options li + li{ border-top-width:0; margin-top:10px } .layout_user_home_links .quicklinks li a, #profile_options li a, ul.navigation.blogs_gutter_options li a{ border-width:1px; padding:3px 10px; border-radius:5px; transition:0.5s; display:block; font-size:15px; } .layout_user_home_links .quicklinks li a:hover, #profile_options li a:hover, ul.navigation.blogs_gutter_options li a:hover{ border-color:$theme_button_border_color; background-color:$theme_button_background_color; color:$theme_button_font_color; } .layout_user_home_links .quicklinks li a, ul.navigation.blogs_gutter_options li a{ color:$theme_widgets_box_list_color; transition:0.5s; } .layout_user_home_links .quicklinks li a.buttonlink:before, div#profile_options li a.buttonlink:before, .quicklinks li a:before, .blogs_gutter_options li a:before{ margin-right:10px; } [dir="rtl"] .layout_user_home_links .quicklinks li a.buttonlink:before, [dir="rtl"] div#profile_options li a.buttonlink:before, [dir="rtl"] .quicklinks li a:before, [dir="rtl"] .blogs_gutter_options li a:before{ margin-right:0px; margin-left:10px; } .home-links-user .image{ top:15px; left:15px; } [dir="rtl"] .home-links-user .image{ left:auto; right:15px; } /*home quicklinks*/ .layout_user_home_links .quicklinks li + li{ margin:0; } .layout_user_home_links .quicklinks ul li a{ border:none; border-bottom:1px solid $theme_border_color !important; padding:12px 0; border-radius:0; } .layout_user_home_links .quicklinks ul li:last-child a{ border-bottom:0 !important; } .layout_user_home_links .quicklinks ul li a.buttonlink:before{ background:$theme_base_color; width:35px; height:35px; text-align:center; border-radius:50px; font-size:15px; line-height:35px; color:$theme_base_font_color; } .layout_user_home_links .quicklinks li a:hover{ background-color:transparent; color:$theme_base_color ; } /*Chat*/ .im_item_friends_title{ padding-top:0; } .chat_container .chat_input{ height:49px; border-radius:0 !important; } .chat_container{ background:transparent; } .chat_users_wrapper{ background:transparent; } /*Activity Feed*/ .layout_activity_feed{ background:none !important; border-width:0 !important; padding:0 !important; } .activity-post-container{ border-radius:5px; border:1px solid $theme_border_color; background-color:$theme_list_background_color; margin-bottom:15px; } body#global_page_user-index-home .activity-post-container{ border-radius:0 0 5px 5px; } .activity-post-container > form{ border:0px solid rgba(201, 160, 160, 0.7); padding:10px 5px; } .activity-post-container .compose-content{ border:none; border-radius:0; background:$theme_list_background_color; } [dir="rtl"] .compose-container .overTxtLabel{ right:4px; left:auto; } .activity-post-container > form .compose-menu{ border-top:1px solid $theme_border_dark_color; padding-top:10px; } .activity-post-container .buttonlink{ font-size:14px; } .feed_viewmore{ border-width:0 !important; margin-bottom:15px; } .feed_viewmore a#feed_viewmore_link{ border-radius:5px; background-color:$theme_button_background_color; color:$theme_button_font_color; display:block; padding:10px; } html .layout_activity_feed h3{ border:none; padding:15px !important; margin:0 !important; background-color:$theme_base_color; color:$theme_base_font_color !important; text-align:left !important; position:relative; } html[dir="rtl"] .layout_activity_feed h3{ text-align:right !important; } /*Feed*/ ul.feed{ padding:0; } ul.feed > li{ +widget; } ul.feed .feed_item_date{ color:$theme_font_color_light; } ul.feed .feed_item_bodytext{ clear:both; margin-top:15px; } ul.feed .feed_item_attachments{ margin:auto; display:block; clear:both; padding:10px 0 3px 0; } ul.feed .feed_item_attachments img{ border-radius:5px; transform:scale(1.0); transition:0.5s; } ul.feed .feed_item_attachments img:hover{ transform:scale(1.02); } ul.feed .feed_attachment_photo a > span{ width:166px; } ul.feed li .activity-item .feed_attachment_photo a > span { width: 189px; } .feed_attachment_album_photo img{ max-width:100%; } ul.feed .feed_item_icon{ border-top-width:1px; margin-top:10px; padding-top:10px; clear:both; } ul.feed .feed_item_icon > ul > li{ margin:5px 10px 10px 0px; } [dir="rtl"] ul.feed .feed_item_icon > ul > li{ margin:5px 0 10px 10px; } ul.feed .feed_item_icon > ul > li a{ transition:0.5s; } ul.feed .feed_item_icon > ul > li a:before{ font-family:'Font Awesome 5 Free'; background:transparent; margin-right:8px; vertical-align:middle; font-weight:600; line-height:35px; width:35px; height:35px; display:inline-block; text-align:center; color:$theme_anchor_color; border-radius:50px; transition:0.5s; font-size:15px; border:1px solid $theme_border_color; } [dir="rtl"] ul.feed .feed_item_icon>ul>li a:before{ margin-left:8px; margin-right:0; } ul.feed .feed_item_icon > ul > li.feed_item_option_like a:before{ content:"\\f164"; } ul.feed .feed_item_icon > ul > li.feed_item_option_comment a:before{ content:"\\f086"; } ul.feed .feed_item_icon > ul > li.feed_item_option_delete a:before{ content:"\\f1f8"; } ul.feed .feed_item_icon > ul > li.feed_item_option_report a:before{ content:"\\f024"; } ul.feed .feed_item_icon > ul > li.feed_item_option_share a:before{ content:"\\f064"; } ul.feed .feed_item_icon > ul > li.feed_item_option_unlike a:before{ content:"\\f165"; } ul.feed .feed_item_icon > ul > li.feed_item_option_edit a:before{ content:"\\f044"; } ul.feed .feed_item_icon > ul > li > span{ font-size:0; } ul.feed .feed_item_icon > ul > li:hover a:before{ color:$theme_button_font_color; background-color:$theme_button_background_color; } ul.feed .feed_item_icon > ul > li a:hover{ color:$theme_button_background_color; transition:0.5s; } ul.feed .feed_item_icon > ul > li.feed_item_option_unlike a{ color:$theme_button_background_color; } ul.feed .feed_item_icon > ul > li.feed_item_option_unlike a:before{ color:$theme_button_font_color; background:$theme_button_background_color; } /*All Form Css */ .global_form div#submit-label, .global_form div#auth_invite-label, .global_form div#buttons-label, .global_form div#search-label, .global_form div#approval-label, .global_form div#networks-label, .global_form div#terms-label{ display:none; } ul.form-options-wrapper li label{ margin-bottom:6px; } .global_form div#auth_invite-element label.optional, div#approval-element label.optional{ margin-bottom:0; } .global_form div#search-element label.optional{ margin-bottom:0; } body#global_page_user-auth-login .user_showhidepassword > i{ margin-top:-48px; position:relative; } body#global_page_core-error-requireuser .user_showhidepassword{ max-width:100%; } body#global_page_core-error-requireuser .user_showhidepassword > i{ margin-top:-48px; } #passwordroutine_specialcharacters .special_char_overlay{ margin-top:-160px; } #passwordroutine_specialcharacters .special_char_overlay:before{ display:none; } #global_page_user-edit-profile div.field-privacy-selector{ vertical-align:middle; } #signup_account_form #terms-element{ display:flex; } #signup_account_form #terms-element input[type=checkbox]{ margin-top:5px; } #signup_account_form #terms-element label{ flex:1; } /*Landing Page 1 Start*/ /*Common Layout Start*/ body.inspira_landingpage{ background:$theme_list_background_color; } #global_page_core-index-index #global_wrapper{ padding:0; } body.inspira_landingpage #global_content{ width:100%; } body.inspira_landingpage .layout_main .layout_middle .generic_layout_container:nth-child(2n+2){ background-color:$theme_list_background_color_alt !important; } body.inspira_landingpage .layout_main .layout_middle .generic_layout_container > h3, body#global_page_core-index-index .layout_main .layout_middle .generic_layout_container > p, .custom_des{ color:$theme_headline_color !important; } body.inspira_landingpage .layout_main .layout_middle .generic_layout_container > h3:before, .custom_heading:before{ background:$theme_base_color; } body.inspira_landingpage .layout_main .layout_middle .generic_layout_container > h3:after, .custom_heading:after{ background-color:$theme_body_background_color; } body.inspira_landingpage .layout_main .layout_middle .generic_layout_container .container > p{ color:$theme_font_color; } /*Common Layout End*/ /*Banner Start*/ .landing_banner_content h1{ color:$theme_base_font_color; } .landing_banner_content p, .landing_banner_content span{ color:$theme_base_font_color !important; } .landing_banner_content .btn{ background:$theme_button_background_color; border:1px solid $theme_button_border_color; color:$theme_button_font_color; } .landing_banner_content .btn:hover{ background:$theme_list_background_color; color:$theme_button_font_secondry_color; } .landing_banner_content .btn.btn-info{ background:$theme_list_background_color; border:1px solid $theme_button_border_color; color:$theme_button_font_secondry_color; } .landing_banner_content .btn.btn-info:hover{ background:$theme_button_background_color; color:$theme_button_font_color; } /*Banner End*/ /*Features Start*/ .inspira_bg{ background:$theme_list_background_color; } body#global_page_core-index-index .container{ width:$theme_main_width; max-width:$theme_main_width; } .inspira_features_block .inspira_feature_bg a{ background:$theme_button_background_color; color:$theme_button_font_color; border:1px solid $theme_button_border_color; } .inspira_features_block .inspira_feature_bg a:hover{ background:$theme_list_background_color; color:$theme_button_font_secondry_color; } .inspira_features_block .inspira_feature_bg figure:after{ background-color:$theme_button_background_color; } .inspira_feature_item_icon i.icon_feature{ color:$theme_base_color !important; } /*Features End*/ /*Events Start*/ .landing_inspira_events .title > a{ color:$theme_base_font_color; } .landing_inspira_events .events_photo > a > span{ border-color:$theme_base_color !important; } .landing_inspira_events .events_photo:hover span{ border-color:$theme_base_font_color !important; } .landing_inspira_events_item .events_stats p{ background-color:$theme_base_color; color:$theme_base_font_color; } /*Events End*/ /*Albums Start*/ .landing_inspira_albums .title > a{ color:$theme_base_font_color; } .landing_inspira_albums .info .user a{ color:$theme_base_font_color; } .landing_inspira_albums_item .info:after{ background:$theme_base_color; } .albums_carousel_wrapper .owl-nav > div{ background:$theme_base_color; color:$theme_base_font_color; border-color:$theme_base_font_color; } /*Albums End*/ /*Counter Start*/ .landing_inspira_counter_box li{ background-color:$theme_base_color; } .landing_inspira_counter_detail h3, .landing_inspira_counter_detail p{ color:$theme_base_font_color; } body#global_page_core-index-index .layout_main .layout_middle .generic_layout_container.layout_inspira_landing_page_counter > h3{ color:$theme_base_font_color; } .counter_left > h3, .counter_left > p{ color:$theme_base_font_color !important; } /*Counter End*/ /*videos Start*/ .landing_inspira_videos .info{ background-color:$theme_base_color; } .landing_inspira_videos .videos_play_icon:after{ background-color:$theme_base_color; } .landing_inspira_videos .title > a{ color:$theme_base_font_color; } .landing_inspira_videos .title > a:hover{ color:$theme_base_color; } .landing_inspira_videos .info .user a{ color:$theme_base_font_color; } .landing_inspira_videos .videos_play_icon a{ background:$theme_base_color; color:$theme_base_font_color; } .landing_inspira_videos .videos_play_icon a:hover{ background:$theme_list_background_color; color:$theme_link_secondry_color; } /*videos Start*/ /*Music Start*/ .landing_inspira_music .title > a{ color:$theme_heading_color; } .landing_inspira_music .info .user > a{ color:$theme_font_color; } .landing_inspira_music .info{ background-color:$theme_list_background_color; } .landing_inspira_music .music_play_icon a{ background:$theme_base_color; color:$theme_base_font_color; } .landing_inspira_music .music_play_icon a:hover{ background:$theme_list_background_color; color:$theme_link_secondry_color; } .landing_inspira_music .music_lp_main:hover .info{ background-color:$theme_base_color; } .landing_inspira_music .music_lp_main:hover .info .user > a, .landing_inspira_music .music_lp_main:hover .info .title > a{ color:$theme_base_font_color !important; } /*Music Start*/ /*Groups Start*/ .landing_inspira_groups .info{ background-color:$theme_body_background_color; } .landing_inspira_groups .info .category a{ color:$theme_base_color !important; } .landing_inspira_groups .title > a{ color:$theme_heading_color; } .landing_inspira_groups .info .category{ color:$theme_font_color; } .landing_inspira_groups .groups_lp_main:hover .info{ background-color:$theme_base_color; } .landing_inspira_groups .groups_lp_main:hover .info .title > a, .landing_inspira_groups .groups_lp_main:hover .info .category > a, .landing_inspira_groups .groups_lp_main:hover .info .member > a{ color:$theme_base_font_color !important; } /*Groups End*/ /*Blog Start*/ .landing_inspira_blogs .title > a{ color:$theme_base_font_color; } .landing_inspira_blogs .user > a{ color:$theme_base_font_color; } .landing_inspira_blogs .info .category a{ color:$theme_link_secondry_color; } .landing_inspira_blogs_item .date_box{ background:$theme_base_color; color:$theme_base_font_color; } /*Blog End*/ /*Service Start*/ .lp_inspira_service_top{ background:$theme_list_background_color; } .lp_inspira_service_top:hover{ background:$theme_base_color !important; } .lp_inspira_service_icon{ background:$theme_base_color; border-color:$theme_base_font_color !important; } .lp_inspira_service_icon i{ color:$theme_base_font_color; } .lp_inspira_service_item:hover .title, .lp_inspira_service_item:hover .des{ color:$theme_base_font_color; } /*Service End*/ /*Member Start*/ .landing_page_member .inspira_member_box > a{ border-color:$theme_border_medium_color !important; } .landing_page_member .inspira_member_box{ border-color:$theme_border_dark_color !important; } .landing_page_member .owl-nav > div{ background:$theme_base_color; color:$theme_base_font_color; border-color:$theme_base_font_color; } .landing_page_member .info{ background:$theme_list_background_color; } .landing_page_member .inspira_member_box:hover .info{ background:$theme_base_color; } .landing_page_member .inspira_member_box .name > a{ color:$theme_headline_color; } .landing_page_member .inspira_member_box:hover .info .name > a, .landing_page_member .inspira_member_box:hover .info .friends{ color:$theme_base_font_color; } .landing_page_member .inspira_member_box .bg_item_photo{ background-color:$theme_body_background_color; } /*Member End*/ /*App Start*/ body.inspira_landingpage .layout_main .layout_middle .generic_layout_container.layout_inspira_landing_page_app{ background-color:transparent !important; } .lp_inspira_app_wrapper{ background-color:$theme_base_color; } .lp_inspira_app_wrapper h3, .lp_inspira_app_wrapper p{ color:$theme_base_font_color; } /*App End*/ /*Landing Page 1 End*/ /*Landing Page 2 Start*/ .banner_main_right .btn_group .login_btn{ background-color:$inspira_button_background_color; border-color:$theme_base_color !important; color:$theme_topbar_menu_link_color !important; } .banner_main_right .btn_group .login_btn span{ color:$theme_topbar_menu_link_color !important; } .banner_main_right .btn_group .login_btn:hover span{ color:$theme_base_color !important; } .banner_main_right .btn_group .login_btn:hover{ background-color:transparent; color:$theme_button_font_secondry_color !important; } .banner_main_right .btn_group .signup_btn{ color:$theme_button_font_secondry_color !important; } .banner_main_right .btn_group .signup_btn span{ color:$theme_base_color !important; } .banner_main_right .btn_group .signup_btn:hover span{ color:$theme_topbar_menu_link_color !important; } .banner_main_right .btn_group .signup_btn:hover{ background-color:$inspira_button_background_color; color:$theme_topbar_menu_link_color; } .banner_main_right #user_form_login #twitter-element i{ background-color:#1aa0ef !important; color:$theme_topbar_menu_link_color !important; } .banner_main_right #user_form_login #twitter-element{ text-align:center; } .user_login_page .user_login_form #facebook-element i{ background-color:#3b5998 !important; color:$theme_topbar_menu_link_color !important; } @media (max-width:767px){ .banner_main_left{ background:$theme_base_color; } } /*Landing Page 2 End*/ /*Default Landing Page*/ .core_landingpage_banner>section>div a{ background-color:$theme_button_background_color; color:$theme_button_font_color; } .layout_core_landing_page_features{ background:none !important; border-width:0 !important; } .layout_core_landing_page_features > h3{ background:none !important; color:$theme_font_color !important; font-size:25px !important; } .layout_core_parallax{ padding:0 !important; } /* THEME OVERRIDES Minor core style overrides just for this theme. These are mostly widget-specific overrides. */ /*Member Page */ .browse-separator-wrapper{ display:none; } /*Ggeneric Widget*/ ul.generic_list_widget .info{ padding:0 0 0 10px; } [dir="rtl"] ul.generic_list_widget .info{ padding:0 10px 0 0; } ul.generic_list_widget .description{ font-size:$theme_font_size; } ul.generic_list_widget > li{ padding:8px 0; } /*Events Page*/ form#event_create_form div#starttime-wrapper select , form#event_create_form div#endtime-wrapper select{ width:auto; display:inline-block; vertical-align:middle; } form#event_create_form div.event_calendar_container button.event_calendar{ float:none; background-repeat:no-repeat; } ul.grid_wrapper > li > .events_photo{ margin-bottom:0; } ul.grid_wrapper > li .events_info{ padding:10px 15px; } /*Group Page*/ ul.grid_wrapper > li .groups_title{ margin:0; } /*Video Page*/ .feed_item_attachments .video_thumb_wrapper, .feed_item_attachments .video_object_upload video{ background-color:#727272; width:100%; } .video_length{ background:$theme_base_color; opacity:1; } ul.grid_wrapper .video_thumb_wrapper{ margin-bottom:0; } .video_object.video_object_iframely{ display:block; } .video_create_form #Filedata-label, .video_create_form #upload-label{ display:none; } /*User Login Page*/ body#global_page_user-auth-login #global_wrapper{ padding:0 !important; } body#global_page_user-auth-login #global_footer{ margin-top:0 !important; } .layout_page_user_auth_login .layout_core_content{ border:none !important; background:$theme_list_background_color_alt !important; margin:0 !important; } body#global_page_user-auth-login div#global_content{ width:100%; padding:0; min-height:100%; } .layout_page_user_auth_login{ width:100%; margin:auto; } .user_login_page{ margin:auto; display:flex; align-items:center; justify-content:center; position:relative; } .user_login_page .user_login_bg{ width:100%; min-width:auto; position:absolute; height:100%; } .user_login_page .user_login_form{ padding:25px; min-width:auto; width:600px; background:rgba(0, 0, 0, .6); position:relative; left:0; right:0; margin:50px auto; } #global_page_user-auth-login .global_form{ width:100%; margin:auto; padding:30px 0; } .user_login_page .user_login_form > h3, .user_login_page .user_login_form div.form-label label, .user_login_page #user_form_login #forgot-element a, .user_login_page .user_login_form > a{ color:#fff !important; } #global_page_user-auth-login .user_login_page .user_login_form a b{ color:$theme_base_color !important; } #global_page_user-auth-login .user_showhidepassword{ max-width:100%; } #global_page_user-auth-login .user_login_page .user_login_form > h3{ font-weight:600; } .user_login_page #user_form_login #submit-wrapper{ margin:0 0 15px; } #global_page_user-auth-login .user_login_page #submit-element button{ display:block; width:100%; } .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]{ padding:15px; } .user_login_form .global_form #facebook-element{ width:100%; } .user_login_page .user_login_form #facebook-element, .user_login_page .user_login_form #twitter-element{ margin:0; } /*User SignUp Page*/ body#global_page_user-signup-index .layout_core_content{ background:transparent; border:none; } body#global_page_user-signup-index form.global_form{ width:700px; margin:auto; background:$theme_list_background_color; padding:40px; overflow:inherit; } body#global_page_user-signup-index .global_form > div{ overflow:inherit; } body#global_page_user-signup-index .global_form > div > div{ overflow:inherit; } body#global_page_user-signup-index .global_form > div > div h3{ background:$theme_base_color; color:$theme_base_font_color; padding:17px; margin:-40px -40px 30px; text-align:center; border-radius:5px 5px 0 0; text-transform:uppercase; } body#global_page_user-signup-index #signup_account_form input[type=email], body#global_page_user-signup-index #signup_account_form input[type=password], body#global_page_user-signup-index #signup_account_form input[type=text], body#global_page_user-signup-index #signup_account_form select{ padding:14px; } #signup_account_form #password_confirm_settings_group-wrapper .user_showhidepassword{ top:53px; } #signup_account_form .user_showhidepassword{ top:53px; } #signup_account_form .user_showhidepassword>i{ margin-top:0; } #pswd_info > ul > li{ width:100%; } body#global_page_user-signup-index .global_form #submit-wrapper .form-element button[type=submit]{ display:block; width:100%; } /**/ .mce-btn button{ background:transparent; } .mce-widget span, .mce-widget i{ color:#000 !important; } /*Invite Page*/ body#global_page_invite-index-index .global_form #submit-element{ margin-top:12px; } .user_setting_global_form .global_form div.form-wrapper label{ font-weight:600; } /*Responsive CSS*/ @include "responsive.css"; /*Custom CSS*/ @include "inspira-custom.css";
Save Changes
Available Themes
Inspira
v6.5.1
by
SocialEngine
(this is your current theme)