/* ----------------------------------------------------------------
	Canvas: Real Estate
-----------------------------------------------------------------*/

:root {
  --cnvs-themecolor: #c81614;
  --cnvs-themecolor-rgb: 200, 22, 20;
  --cnvs-secondary-color: #000;
  --cnvs-body-font: 'Prompt', sans-serif;
  --cnvs-primary-font: 'Taviraj', serif;
  --cnvs-secondary-font: 'Comfortaa', cursive;
}

#header {
  --cnvs-primary-menu-font-weight: 500;
  --cnvs-primary-menu-font-size: 1rem;
  --cnvs-primary-menu-submenu-font-weight: 400;
  --cnvs-primary-menu-submenu-hover-font-weight: 500;
}

#footer {
  background: var(--cnvs-themecolor);
}

@media (min-width: 992px) {
  #header {
    --cnvs-primary-menu-tt: default;
    --cnvs-primary-menu-ls: 1px;
    --cnvs-primary-menu-submenu-tt: default;
    --cnvs-primary-menu-color: var(--cnvs-contrast-800);
    --cnvs-primary-menu-hover-color: var(--cnvs-contrast-900);
  }

  #header.header-size-md + .include-header.include-topbar {
    margin-top: calc(-80px - 2px - 46px);
  }

  #top-bar.transparent-topbar {
    background: transparent;
    z-index: 399;
  }

  .top-links-container > .top-links-item {
    border: 0;
  }

  .red {
    color: var(--cnvs-themecolor);
  }

  .top-links-container > .top-links-item > a {
    padding-left: 17px;
    padding-right: 17px;
    color: #eee;
    font-weight: normal;
    /*		text-transform: capitalize;*/
    font-size: 0.875rem;
  }

  .top-links-container > .top-links-item:hover {
    background-color: transparent;
  }

  .top-links-container > .top-links-item.top-bar-highlight > a {
    margin-top: 7px;
    margin-bottom: 7px;
    padding-top: 5px;
    padding-bottom: 5px;
    border: 1px solid #eee;
    border-radius: 16px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }

  .top-links-container > .top-links-item.top-bar-highlight:hover > a {
    background-color: #fff;
    color: #222;
  }

  .top-links-item a {
    font-family: var(--cnvs-primary-font);
  }

  .sub-menu-container:not(.mega-menu-column) {
    width: 210px;
    padding: 0 !important;
    border-radius: 3px;
    border: 0;
    background-color: var(--cnvs-themecolor);
  }

  .sub-menu-container .menu-item:not(:first-child) {
    border-top: 1px dotted rgba(255, 255, 255, 0.1) !important;
  }

  .sub-menu-container .menu-item > .menu-link {
    font-size: 12px;
    letter-spacing: 1px;
    font-weight: 400;
    padding: 12px 17px;
    color: #fff;
    font-family: var(--cnvs-primary-font) !important;
  }

  .sub-menu-container .menu-item:hover > .menu-link {
    padding-left: 20px;
  }

  .dark .primary-menu:not(.not-dark) .sub-menu-container,
  .dark .primary-menu:not(.not-dark) .mega-menu-content,
  .primary-menu.dark .sub-menu-container,
  .primary-menu.dark .mega-menu-content {
    background-color: var(--cnvs-themecolor);
  }

  .dark
    .primary-menu:not(.not-dark)
    .sub-menu-container
    .menu-item
    > .menu-link,
  .primary-menu.dark .sub-menu-container .menu-item > .menu-link {
    color: #ccc !important;
  }

  .dark
    .primary-menu:not(.not-dark)
    .sub-menu-container
    .menu-item:hover
    > .menu-link,
  .primary-menu.dark .sub-menu-container .menu-item:hover > .menu-link {
    background-color: rgba(255, 255, 255, 0.025);
    color: var(--cnvs-secondary-color) !important;
    border-radius: 3px;
  }
}

.dark #header:not(.transparent-header),
#header.dark:not(.transparent-header),
#header.dark.sticky-header.transparent-header #header-wrap:not(.not-dark),
#footer.dark {
  background-color: var(--cnvs-themecolor);
}
#footer.black {
  background-color: var(--cnvs-secondary-color);
  color: #fff;
}

.dark #header:not(.transparent-header),
#header.dark:not(.transparent-header) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.menu-link {
  padding-left: 17px;
  padding-right: 17px;
  font-weight: 400;
  font-size: 13px;
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* ----------------------------------------------------------------
	Advanced Property Search
-----------------------------------------------------------------*/

.advanced-real-estate-tabs.tabs,
.advanced-real-estate-tabs .canvas-tabs {
  --bs-nav-tabs-border-width: 0;
  --bs-nav-link-padding-x: 20px;
  --cnvs-tabs-bg-color: var(--cnvs-themecolor);
  --bs-nav-link-color: #fff;
  --bs-nav-link-font-size: 15px;
  --bs-nav-link-font-weight: 600;
  --cnvs-tabs-active-bg-color: var(--cnvs-secondary-color);
  --cnvs-tabs-active-color: #fff;
}

.advanced-real-estate-tabs .nav-tabs .nav-item .nav-link {
  padding: 0 20px;
  height: 42px;
  line-height: 42px;
  font-family: var(--cnvs-primary-font);
  letter-spacing: 1px;
  text-transform: uppercase;
}

.advanced-real-estate-tabs .nav-tabs .nav-item .nav-link:hover,
.advanced-real-estate-tabs .nav-tabs .nav-item .nav-link:focus {
  color: #fff;
}

.advanced-real-estate-tabs .nav-tabs .nav-item.ui-tabs-active .nav-link {
  top: 0;
  background-color: var(--bs-nav-pills-link-active-bg);
}

.advanced-real-estate-tabs
  .nav-tabs
  .nav-item.ui-tabs-active
  .nav-link
  .badge.bg-warning {
  background-color: var(--cnvs-themecolor);
}

.advanced-real-estate-tabs .nav-tabs .nav-item .badge {
  margin-left: 5px;
}

.advanced-real-estate-tabs .tab-content {
  padding: 30px;
  background-color: rgba(255, 255, 255, 0.95);
  border-top: 3px solid var(--cnvs-secondary-color);
}

.advanced-real-estate-tabs.tabs label {
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: 1px;
}

#slider + .advanced-real-estate-tabs {
  top: -42px;
  margin-bottom: -42px;
  z-index: 3;
}

#slider + .advanced-real-estate-tabs .tab-content {
  background-color: var(--cnvs-contrast-200);
  padding: 50px;
}

.promo.bg-color .button:not(:hover) {
  color: #fff;
  background-color: var(--cnvs-secondary-color);
  border-color: var(--cnvs-secondary-color);
}

.promo.bg-color .button:hover {
  background-color: #fff;
  color: var(--cnvs-themecolor);
  text-shadow: none;
}

/* ----------------------------------------------------------------
	Real Estate Items
-----------------------------------------------------------------*/

.owl-carousel .owl-nav [class*='owl-'] {
  border-color: transparent;
  color: #fff;
  background-color: var(--cnvs-themecolor);
}

.owl-carousel.real-estate .owl-nav [class*='owl-']:hover {
  background-color: var(--cnvs-secondary-color) !important;
}

.real-estate-item {
  position: relative;
}

.real-estate-item-image {
  position: relative;
  width: 100%;
}

.real-estate-item-image::before {
  position: absolute;
  content: '';
  pointer-events: none;
  z-index: 1;
  opacity: 0.9;
  top: auto;
  bottom: 0;
  width: 100%;
  height: 50%;
  background: -moz-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.85) 100%
  ); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%, rgba(0, 0, 0, 0)),
    color-stop(100%, rgba(0, 0, 0, 0.85))
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.85) 100%
  ); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.85) 100%
  ); /* Opera 11.10+ */
  background: -ms-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.85) 100%
  ); /* IE10+ */
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.85) 100%
  ); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
}

.real-estate-item-image > a,
.real-estate-item-image > img {
  display: block;
  width: 100%;
  height: auto;
}

.real-estate-item-image .badge {
  display: block;
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 1;
  font-size: 11px;
  padding: 5px 8px;
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 1px;
}

.real-estate-item-price {
  position: absolute;
  right: 20px;
  bottom: 20px;
  z-index: 1;
  font-size: 26px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1;
  color: #fff;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}

.real-estate-item-price span {
  display: block;
  margin-top: 3px;
  font-weight: 300;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.85);
  text-align: right;
}

.real-estate-item-info {
  position: absolute;
  left: 20px;
  bottom: 20px;
  z-index: 1;
}

.real-estate-item-info a {
  display: block;
  float: left;
  color: #fff;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
  font-size: 12px;
  line-height: 1;
  text-align: center;
  padding: 8px;
  background-color: rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.real-estate-item-info a:hover {
  background-color: rgba(0, 0, 0, 0.75);
}

.real-estate-item-info a i {
  width: 12px;
  height: 12px;
}

.real-estate-item-info a:not(:first-child) {
  margin-left: 5px;
}

.real-estate-item-desc {
  position: relative;
  margin-top: 20px;
  padding: 0 20px;
}

.real-estate-item-desc h3 {
  font-size: 21px;
}

.real-estate-item-desc h3 + span {
  display: block;
  margin-top: -27px;
  color: #999;
}

.real-estate-item-desc h3 a {
  color: #333;
}

.real-estate-item-desc h3 a:hover {
  color: #555;
}

.real-estate-item-features {
  margin-top: 15px;
}

.real-estate-item-features [class^='col-'] {
  margin-top: 5px;
}

.real-estate-item-features i {
  position: relative;
  top: 1px;
  margin-left: 3px;
}

.real-estate-item-link {
  position: absolute;
  top: 2px;
  right: 20px;
  width: 32px;
  height: 32px;
  line-height: 30px;
  text-align: center;
  font-size: 16px;
  color: #555;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
  border: 1px solid #555;
  border-radius: 50%;
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.real-estate-item-link:hover {
  border-color: transparent;
  background-color: var(--cnvs-themecolor);
  color: #fff;
}

/* ----------------------------------------------------------------
	Real Estate City Properties
-----------------------------------------------------------------*/

.real-estate-properties [class^='col-'] {
  position: relative;
  margin-bottom: 30px;
}

.real-estate-properties [class^='col-'] > a {
  display: block;
  position: relative;
  height: 250px;
  background-color: #eee;
}

.real-estate-properties [class^='col-'] img {
  display: block;
}

.real-estate-properties [class^='col-'] > a::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.4);
  opacity: 0.4;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.real-estate-properties [class^='col-'] > a:hover::before {
  opacity: 1;
}

/* ----------------------------------------------------------------
	Real Estate Popular Links
-----------------------------------------------------------------*/

.widget_real_estate_popular {
  margin-left: 0;
}

.widget_real_estate_popular li::before {
  opacity: 0.5;
}

#side-panel {
  background-color: #fff;
}

body.side-panel-open #side-panel {
  -webkit-box-shadow: -5px 0px 20px -6px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: -5px 0px 20px -6px rgba(0, 0, 0, 0.15);
  box-shadow: -5px 0px 20px -6px rgba(0, 0, 0, 0.15);
}

@media (min-width: 992px) {
  #side-panel {
    right: -400px;
    width: 400px;
  }

  #side-panel .side-panel-wrap {
    width: 430px;
  }

  #side-panel .widget {
    width: 320px;
  }

  body.side-push-panel.side-panel-open.stretched #wrapper,
  body.side-push-panel.side-panel-open.stretched
    #header.sticky-header
    .container {
    right: 400px;
  }

  body.side-push-panel.side-panel-open.stretched .slider-inner {
    left: -400px;
  }
}

/* ----------------------------------------------------------------
	Real Estate Hero Slider Overlay
-----------------------------------------------------------------*/

.real-estate-video-overlay {
  background: -moz-linear-gradient(
    bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.5) 100%
  ); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left bottom,
    left bottom,
    color-stop(0%, rgba(0, 0, 0, 0)),
    color-stop(100%, rgba(0, 0, 0, 0.5))
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(
    bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.5) 100%
  ); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(
    bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.5) 100%
  ); /* Opera 11.10+ */
  background: -ms-linear-gradient(
    bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.5) 100%
  ); /* IE10+ */
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.5) 100%
  ); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
}

#gotoTop {
  background-color: var(--cnvs-themecolor);
  border-radius: 50%;
}

#gotoTop:hover {
  background-color: var(--cnvs-secondary-color) !important;
}

.color-2 {
  color: var(--cnvs-secondary-color) !important;
}
.bg-color2 {
  background-color: var(--cnvs-secondary-color) !important;
}
