Theme Editor

Mode

Production Development
English
- English
- Ghana
- Arabic

Network Information

License Key SEPHP-7fc1405d2c133a21
Created August 7, 2025
Version 7.8.0

More info: See KB article

Active Theme

Clone Save Changes

Harmony

v7.8.0

by SocialEngine Core

Editing File:

/* ADD YOUR CUSTOM CSS HERE */
:root {
  --theme-main-width:1300px ;
  --theme-content-columns-left-width:350px;
  --theme-content-columns-right-width:350px;
}
html .layout_core_menu_mini #core_menu_mini_menu > ul > li.core_mini_language .language_btn{
  color: var(--theme-header-menu-link-color);
}
.layout_left > div > .generic_layout_container, 
.layout_right > div > .generic_layout_container, 
.layout_middle > .generic_layout_container, 
.layout_core_container_tabs > .generic_layout_container, 
.layout_content, .block {
  border-width: 0;
}

/* hotel search css */
.ehotel_sidebar_search_field_main_item > label > span {
  font-weight: 700!important;
}
.ehotel_sidebar_search_field_item {
  padding: 5px 0;
}
.ehotel_sidebar_search_field_item input {
  height: 20px;
  width: 20px!important;
  margin: 0px 10px 0px 0px;
}
.ehotel_sidebar_search_field_label {
  font-size: 15px !important;
}
.ehotel_sidebar_search_field .al-range-slider__knob {
  border: 0px;
  box-shadow: none !important;
}
.al-range-slider__knob:hover, .al-range-slider__knob_active {
  border: 0px !important;
  box-shadow: none !important;
}
.ehotel_sidebar_search_field_main_item > label > span {
  font-weight: 600!important;
  font-size: 14px;
}

/* browse page css  */
#global_page_ehotel-index-browse .layout_ehotel_custom_banner {
  height: 500px;
}
#global_page_ehotel-index-browse .layout_ehotel_custom_banner::before {
  position: absolute;
  content: "";
  height: 500px;
  width: 100%;
  left: 0;
  background-color: rgba(0 ,0 ,0,0.4) !important;
  z-index: 2;
}
#global_page_ehotel-index-browse {
  background-color: var(--theme-list-background-color);
}
#global_page_ehotel-index-browse .sesbasic_view_type {
  border: 0;
  padding: 15px;
  margin-bottom: 15px;
  border-radius: 15px;
  background-color: var(--theme-list-background-color-alt);
}
#global_page_ehotel-index-browse .ehotel_list_wrapper {
  padding: 30px 15px 20px 15px;
  border-radius: 15px;
  margin-bottom: 15px;
  margin-inline: 0;
  background-color: var(--theme-list-background-color-alt);
}
div#ehotel_filters_badge_clearall a {
  border-radius: 5px;
  font-size: 12px;
  transition: all .2s linear;
}
div#ehotel_filters_badge_clearall a:hover {
  color: var(--theme-link-color-hover);
  background: transparent;
  border: 1px solid var(--theme-link-color-hover);
}
.sps_facilities a, 
.sps_meal_type a, 
.sps_rating a, 
#ehotel_filters_badge_price a {
  padding: 5px 8px;
  border-radius: 5px;
  font-size: 12px;
  color: var(--theme-button-font-color);
  background-color: var(--theme-button-background-color);
  border: 1px solid var(--theme-button-border-color);
  transition: all .2s linear;
}
.sps_facilities a:hover, 
.sps_meal_type a:hover, 
.sps_rating a:hover, 
#ehotel_filters_badge_price a:hover {
  color: var(--theme-link-color-hover);
  background: transparent;
  border: 1px solid var(--theme-link-color-hover);
}
#global_page_ehotel-index-browse .ehotel_list_wrapper .ehotel_grid_cols {
  padding: 10px 7px 15px 7px;
}
@media (max-width: 767px) {
  #global_page_ehotel-index-browse .layout_ehotel_custom_banner {
    height: 600px;
  }
  #global_page_ehotel-index-browse .ehotel_list_wrapper {
    padding: 30px 10px;
  }
}

/* browse list view css  */
.ehotel_list {
	border-radius: 15px !important;
}
.ehotel_list_image a span {
	border-radius: 15px 0 0 15px !important;
}
.ehotel_list_title a {
  font-size: 18px;
  line-height: 25px;
}
.ehotel_card_facilities li {
  font-size: 13px;
  padding-right: 15px;
}
.ehotel_list_image a span {
  border: 0;
}
.ehotel_list_price p {
  font-size: 20px;
}
.ehotel_list_price_inner span {
  color: #d4111e;
}
@media (max-width: 767px) {
  .ehotel_list_title a {
    font-size: 14px;
    line-height: 20px;
  }
  .ehotel_list_price p {
    font-size: 16px;
  }
}

/* Browse page Grid View css  */
.ehotel_grid {
  border-radius: 15px !important;
}
.ehotel_grid_image a span {
  border-radius: 15px 15px 0 0;
}
.ehotel_title a {
  font-size: 18px;
  line-height: 25px;
}
.ehotel_price p {
  font-size: 20px;
}
.ehotel_price_inner span {
  font-size: 13px;
  color: #d4111e;
}
.ehotel_grid_image a span {
  border: 0;
}
.ehotel_card_facilities {
  flex: inherit !important;
}
.ehotel_card_facilities li {
  padding-right: 7px !important;
  margin-right: 7px !important;
  border-right: 1px solid var(--theme-border-color);
  padding-bottom: 0px !important;
  margin-bottom: 3px !important;
}
.ehotel_card_facilities li:last-child {
  border: 0px !important;
  padding-right: 0px !important;
  margin-right: 0px !important;
}
.ehotel_rating_reviews {
  flex: 1 !important;
  align-items: flex-end !important;
  padding-top: 0px !important;
}

/* facilities css */
.ehotel_facilities_type span {
  font-size: 16px;
  font-weight: 600;
}

/* login page css  */
.layout_page_user_auth_login {
	max-width: 600px;
}
.user_login_page {
	display: flex;
	flex-direction: column;
}
.user_login_page .user_login_bg {
	height: 300px;
}

/* landing page css  */
.harmony_landingpage .harmony_title,
#global_page_user-index-home .harmony_title {
	font-size: 30px;
  font-weight: 600 !important;
  color: var(--theme-font-color);
  padding: 0;
  margin-bottom: 20px;
  line-height: 1.5;
}
.harmony_landingpage .harmony_title::before,
.harmony_landingpage .harmony_title::after,
#global_page_user-index-home .harmony_title::before,
#global_page_user-index-home .harmony_title::after {
	display: none;
}
#global_page_core-index-index #global_wrapper .layout_middle .generic_layout_container,
#global_page_user-index-home #global_wrapper .layout_middle .generic_layout_container {
  margin-bottom: 50px !important;
}

/* Landing page banner css  */
.harmony_landingpage .layout_ehotel_custom_banner,
#global_page_user-index-home .layout_ehotel_custom_banner {
  height: 500px;
  position: relative;
}
.ehotel_banner_search_wrapper{
  height: 500px;
}
#global_page_user-index-home .ehotel_banner_search_wrapper {
  height: 500px;
  top: 0;
}
.harmony_landingpage .layout_ehotel_custom_banner::before {
  position: absolute;
  content: "";
  top: 0;
  height: 100%;
  width: 100%;
  left: 0;
  background-color: rgba(0 ,0 ,0,0.4) !important;
  z-index: 2;
}
#global_page_user-index-home .layout_ehotel_custom_banner::before {
  position: absolute;
  content: "";
  top: 0;
  height: 500px;
  width: 100%;
  left: 0;
  background-color: rgba(0 ,0 ,0,0.4) !important;
  z-index: 2;
}
.ehotel_banner_search_content h1 {
  padding-bottom: 15px;
}
.ehotel_banner_search_content p {
  padding-bottom: 25px;
}
.ehotel_banner_search_content {
  position: relative;
  z-index: 3;
}
@media (max-width: 768px) {
  #global_page_core-index-index.harmony_landingpage .layout_ehotel_custom_banner,
  #global_page_user-index-home .layout_ehotel_custom_banner {
    height: 600px !important;
  }
  .ehotel_banner_search_wrapper {
    height: 600px !important;
  }
  .ehotel_banner_search_content {
    padding-top: 80px;
  }
}

/* Landing page features css  */
.harmony_landingpage_features .row {
  align-items: center;
}
.harmony_landingpage_features a {
  background-color: #d7d7d7;
  background: transparent !important;
  border: 0px solid var(--theme-color);
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.harmony_landingpage_features_inner a:hover {
	background-color: #002766;
	background-color: inherit;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.harmony_landingpage_features_left img {
  border-radius: 30px;
}
.harmony_landingpage_features_inner:nth-child(2) a {
  background-color: #d2e3ff;
}
.harmony_landingpage_features_inner:nth-child(3) a {
  background-color: #d0daea;
}
.harmony_landingpage_features_inner:nth-child(4) a {
  background-color: #e9eef5;
}
.harmony_landingpage_features a figure {
  border: 2px solid var(--theme-color) !important;
}
.harmony_landingpage_features_inner a:hover h4,
.harmony_landingpage_features_inner a:hover p {
  color: var(--theme-font-color) !important;
}
.harmony_landingpage_features_inner:nth-child(2) a:hover {
  background-color: inherit;
}

.harmony_landingpage_features_inner:nth-child(3) a:hover {
  background-color: inherit;
}
.harmony_landingpage_features_inner:nth-child(4) a:hover {
  background-color: inherit;
}
.harmony_landingpage_features_inner:nth-child(2) a figure,
.harmony_landingpage_features_inner:nth-child(3) a figure,
.harmony_landingpage_features_inner:nth-child(4) a figure {
  border-color: var(--theme-color) !important;
}
@media (max-width: 767px) {
  .harmony_landingpage .layout_middle>.generic_layout_container,
  #global_page_user-index-home .layout_middle>.generic_layout_container {
    padding: 0 !important;
  }
  .harmony_landingpage_features {
    padding: 15px !important;
  }
  .harmony_landingpage_features_left {
    padding-right: 0 !important;
  }
}

/* Landing page why choose css  */
.harmony_landingpage_why_choose {
  max-width: var(--theme-main-width);
  margin: auto;
  border-radius: 0 var(--theme-widget-radius) var(--theme-widget-radius) 0;
}

.harmony_landingpage_why_choose_left {
  border-radius: var(--theme-widget-radius) 0 0 var(--theme-widget-radius);
}

/* Landing page counter css  */
.layout_harmony_landing_page_counter_section {
  padding: 0 !important;
  max-width: var(--theme-main-width);
  margin: auto;
}
.harmony_landingpage_counter {
  padding: 0px !important;
  background-image: inherit !important;
  border-radius: var(--theme-widget-radius);
}
.harmony_landingpage_counter::after {
  display: none;
}
@media (max-width: 767px) {
  .harmony_landingpage_counter {
    padding: 15px !important;
    padding-bottom: 0px !important;
  }
}

/* Landing page mobile app section css  */
#global_page_core-index-index #global_wrapper .layout_middle .layout_harmony_landing_page_app_section,
#global_page_user-index-home #global_wrapper .layout_middle .layout_harmony_landing_page_app_section {
  margin-bottom: 0px !important;
}
#global_page_core-index-index.harmony_landingpage .layout_harmony_landing_page_app_section,
#global_page_user-index-home .layout_harmony_landing_page_app_section {
  padding: 0 !important;
}
.layout_harmony_landing_page_app_section .container {
  padding: 0;
}
.harmony_landingpage_app_section {
  border-radius: var(--theme-widget-radius);
  padding: 0px 0px 30px 0px;
}
.harmony_landingpage_app_left {
  padding: 50px !important;
}
.harmony_landingpage_app_right {
  width: 300px;
  padding: 50px 30px 0px 30px;
  padding-top: 0;
}
.harmony_landingpage_app_right img {
  height: 230px !important;
}
.harmony_landingpage_app_section h3 {
  font-size: 30px !important;
  margin-bottom: 15px;
}
.harmony_landingpage_app_section p {
  font-size: 15px !important;
  padding-bottom: 10px;
}
.layout_harmony_landing_page_app_section:before {
  border: 0 !important;
}
@media (max-width: 767px) {
  .harmony_landingpage_app_section {
    padding: 15px !important;
  }
  .harmony_landingpage_app_right {
    width: 100%;
    margin-bottom: 30px;
  }
  .harmony_landingpage_app_left {
    padding: 10px !important;
  }
  .harmony_landingpage_app_section h3 {
    font-size: 22px !important;
  }
  .harmony_landingpage_app_section p {
    font-size: 14px !important;
  }
  .harmony_landingpage_app_right {
    padding: 0px;
  }
}

/* :Landing page cta section css  */
.layout_harmony_landing_page_cta_section {
  padding: 0 !important;
}
.layout_harmony_landing_page_cta_section .container {
  padding: 0 !important;
}
@media (max-width: 767px) {
  #global_page_core-index-index.harmony_landingpage .layout_harmony_landing_page_cta_section,
  #global_page_user-index-home .layout_harmony_landing_page_cta_section {
    padding: 15px !important;
  }
  .layout_harmony_landing_page_cta_section .container {
    padding: 0 !important;
  }
}

#global_page_user-index-home {
  background-color: var(--theme-list-background-color) !important;
}
#global_page_user-index-home #global_wrapper {
  padding-top: 0 !important;
}
#global_page_user-index-home .generic_layout_container > h3 {
  display: none !important;
}
.layout_harmony_landing_page_features {
  padding: 0 !important;
}

/* Header css  */
.harmony_main_menu .harmony_main_menu_nav > li > .menu_core_main > i {
  font-size: 1.3125rem;
}
.harmony_main_menu .harmony_main_menu_nav > li > .menu_core_main > span {
  font-size: 14px;
}
#core_menu_mini_menu > ul > li .show_icons i.minimenu_icon:before {
  font-size: 1.3125rem;
}
#core_menu_mini_menu>ul>li a.show_icons span._linktxt {
  font-size: 14px;
}
html .header_menu_mini .layout_core_menu_mini #core_menu_mini_menu > ul > li.core_mini_language .language_btn > i::before {
  font-size: 1.3125rem;
}
@media (max-width: 767px) {
  .header_left .header_logo {
    margin-top: 0 !important;
  }
  .mobile_navigation .mobile_menu {
    top: 13px !important;
  }
  .header_search .search_mobile_btn {
    top: 13px;
  }
  .harmony_main_menu .mobile_navigation_menu li.active > a, 
  .harmony_main_menu .mobile_navigation_menu li.active > a *, 
  .harmony_main_menu .mobile_navigation_menu li:hover > a {
    color: var(--theme-button-font-color) !important;
    background-color: var(--theme-color);
  }
  .harmony_header {
    padding: 15px 10px !important;
  }
  .mobile_navigation .mobile_navigation_menu {
    padding: 0px !important;
  }
  .harmony_main_menu .mobile_navigation_menu li > a {
    padding: 15px !important;
  }
}

/* Footer css  */
#global_footer {
  border-top: 1px solid var(--theme-border-color);
}
.harmony_footer .row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.harmony_footer .col-md-5 {
  width: 70%;
}
.harmony_footer .harmony_footer_left {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.harmony_footer .harmony_footer_logo {
  width: 30%;
  margin-bottom: 0;
}
.harmony_footer .footer_desc {
  width: 60%;
}
.harmony_footer .col-md-3 {
  width: 20%;
}
.harmony_footer_contact_inner {
  margin-top: 0;
}
.harmony_footer_contact_inner li:first-child {
  margin-top: 0;
}
.harmony_footer .custom_footer_heading {
  display: none;
}
.harmony_footer_logo img, .harmony_footer_logo_contrast img {
  max-height: 1.875rem !important;
}
@media (max-width: 767px) {
  .harmony_footer .harmony_footer_left {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: column;
  }
  .harmony_footer .harmony_footer_logo {
    width: 100%;
    margin-bottom: 18px;
  }
  .harmony_footer .footer_desc {
    width: 100%;
  }
  .harmony_footer .col-md-3 {
    width: 100%;
  }
}

Available Themes

Harmony

v7.8.0

by SocialEngine Core

(this is your current theme)