@import 'style-footer.css';
/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/
/* fonts */

@font-face {
  font-family: 'Gilroy-Light';
  src: url('../fonts/gilroy/Gilroy-Light.eot');
  src: url('../fonts/gilroy/Gilroy-Light.eot?#iefix') format('embedded-opentype'),
      url('../fonts/gilroy/Gilroy-Light.woff2') format('woff2'),
      url('../fonts/gilroy/Gilroy-Light.woff') format('woff'),
  url('../fonts/gilroy/Gilroy-Light.ttf') format('truetype'),
      url('../fonts/gilroy/Gilroy-Light.svg#Gilroy-Light') format('svg');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family:  'Gilroy-Regular';
  src: url('../fonts/gilroy/Gilroy-Regular.eot');
  src: url('../fonts/gilroy/Gilroy-Regular.eot?#iefix') format('embedded-opentype'),
      url('../fonts/gilroy/Gilroy-Regular.woff2') format('woff2'),
      url('../fonts/gilroy/Gilroy-Regular.woff') format('woff'),
  url('../fonts/gilroy/Gilroy-Regular.ttf') format('truetype'),
      url('../fonts/gilroy/Gilroy-Regular.svg#Gilroy-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy-Medium';
  src: url('../fonts/gilroy/Gilroy-Medium.eot');
  src: url('../fonts/gilroy/Gilroy-Medium.eot?#iefix') format('embedded-opentype'),
      url('../fonts/gilroy/Gilroy-Medium.woff2') format('woff2'),
      url('../fonts/gilroy/Gilroy-Medium.woff') format('woff'),
  url('../fonts/gilroy/Gilroy-Medium.ttf') format('truetype'),
      url('../fonts/gilroy/Gilroy-Medium.svg#Gilroy-Medium') format('svg');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy-Semibold';
  src: url('../fonts/gilroy/Gilroy-Semibold.eot');
  src: url('../fonts/gilroy/Gilroy-Semibold.eot?#iefix') format('embedded-opentype'),
      url('../fonts/gilroy/Gilroy-Semibold.woff2') format('woff2'),
      url('../fonts/gilroy/Gilroy-Semibold.woff') format('woff'),
  url('../fonts/gilroy/Gilroy-Semibold.ttf') format('truetype'),
      url('../fonts/gilroy/Gilroy-Semibold.svg#Gilroy-Semibold') format('svg');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy-Bold';
  src: url('../fonts/gilroy/Gilroy-Bold.eot');										/* IE9 + later */
  src: url('../fonts/gilroy/Gilroy-Bold.eot?#iefix') format('embedded-opentype'),  	/* IE6 to IE8  */
      url('../fonts/gilroy/Gilroy-Bold.woff2') format('woff2'),						/* Newer browsers */
      url('../fonts/gilroy/Gilroy-Bold.woff') format('woff'),						/* Old Standard */
  url('../fonts/gilroy/Gilroy-Bold.ttf') format('truetype'),						/* Safari og iOS, Chrome, Android, Firefox and Opera except Opera Mini  */
      url('../fonts/gilroy/Gilroy-Bold.svg#Gilroy-Bold') format('svg'); 				/*IE og iOS earlier than version 5*/
  font-weight: bold; 
  font-style: normal;
  font-display: swap;
}


/*------------------------------------*\
	DEBUGGING
\*------------------------------------*/
.debug-output-screen {
  position: absolute;
  right: 0;
  top: 0;
  width: 25%;
  z-index: 10;
  background-color: rgba(255,255,255,0.9);
  padding:10px;
}
pre, 
.debug-output-screen pre { font-size:0.35em; line-height: 1em; white-space: pre-wrap; } 

pre h1,
.debug-output-screen pre h1 {
  font-size: 0.5rem;
}

/*------------------------------------*\
	BOOSTRAP OVERRIDES
\*------------------------------------*/

:root,
[data-bs-theme=light] {
  --bs-font-sans-serif: Arial, Helvetica, sans-serif;
  --bs-body-font-family: var(--bs-font-sans-serif);
  
  --bs-body-font-size: 20px;
  --bs-body-font-family: 'Gilroy-Regular', var(--bs-font-sans-serif);
  --bs-body-color: #001823;
  --bs-border-color: #dee2e6;
}

/*------------------------------------*\
  DEFAULTS AND STRUCTURE
\*------------------------------------*/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body,html { font-size: 20px; }

h1 { font-size: 4.7rem; font-family: 'Gilroy-SemiBold'; line-height: 0.86em; }
h2 { font-size: 3.2rem; font-family: 'Gilroy-Medium'; line-height:1.2em; }
h3 { font-size: 2rem; font-family: 'Gilroy-Medium'; line-height:1.2em; }

b, strong { font-family: 'Gilroy-Bold'; }

.nav-logo { width: 1.5rem; }

header {
  height: calc( 1rem + 1.875rem );
}

.navbar { 
  font-size: 0.8rem;
  position: fixed;
  width: 100%;
  z-index: 10;
}

.navbar-toggler {
  padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
  padding-right: 0;
  border: none; 
}

.navbar-toggler:focus {
  text-decoration: none;
  outline: 0;
  box-shadow: none;
}

.nav-link {
  padding: 0.45rem 1.6rem;
  font-family: "Gilroy-Medium";
  font-size: 0.7rem;
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
}
/* .nav-item:first-of-type .nav-link { 
  padding-left: 0; 
} */

.nav-link:hover, 
.nav-link:focus {
  /* font-family: "Gilroy-Semibold"; */
  opacity: 0.8;
}

.nav-link.active {
  font-family: "Gilroy-Semibold";
}

.navbar-expand-lg .navbar-nav .nav-link.btn {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  box-shadow: none;
  color: #4F0089;
  background-color: #F2E205;
  border: 2px solid #F2E205;
  border-radius: 5px;
  -webkit-border-radius: 5px;
}

.navbar-expand-lg .navbar-nav .nav-link.btn-transparent {
  font-size: 16px;
  line-height: 15px;
  opacity: 1;
  text-decoration: none;
  text-transform: uppercase;
  padding: 10px 20px;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  box-shadow: none;
  color: #fff;
  background-color: transparent;
  border: 2px solid #fff;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  margin-left: 0.5rem;
}

@media (max-width:991px){
  .navbar-expand-lg .collapse.show .navbar-nav .nav-link.btn-transparent {
    margin-left: 0rem;
    margin-top: 0.5rem;
  }
}

/*------------------------------------*\
	COMPONENTS / ELEMENTS
\*------------------------------------*/

#summary {
  font-size: 14px;
  line-height: 1.5;
}

#summary p.collapse:not(.show) {
    height: 42px !important;
    overflow: hidden;
  
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;  
}

#summary p.collapsing {
    min-height: 42px !important;
}

#summary a.collapsed:after  {
    content: '+ Read More';
}

#summary a:not(.collapsed):after {
    content: '- Read Less';
}

.box-shadow {
  -webkit-box-shadow: 2px 2px 3px #bdbfbe;
    -moz-box-shadow: 2px 2px 3px #bdbfbe;
    box-shadow: 2px 2px 3px #bdbfbe;
}
.box-shadow-soft {
  -webkit-box-shadow: 1px 1px 5px #bdbfbe;
    -moz-box-shadow: 1px 1px 5px #bdbfbe;
    box-shadow: 1px 1px 5px #bdbfbe;
}

.placement-space-desktop { display: block; }
.placement-space-mobile { display: none; }

.Heading {
  font-family: 'Gilroy-Semibold', Courier, monospace;
  color: #ff5e35;
  font-size: 40px;
  line-height: 1.1em;
}
.AgentHeading {
  font-family: 'Gilroy-Semibold', Courier, monospace;
  color: #ff5e35;
  font-size: 16px;
}
.AgentSubHeadingLine {
  font-family: 'Gilroy-Medium', Courier, monospace;
  color: #001823;
  font-size: 12px;
}
.SubHeading {
  font-family: 'Gilroy-Medium', Courier, monospace;
  color: #ff5e35;
  font-size: 32px;
  line-height: 1.1em;
}
.OurMarkets {
  font-family: 'Gilroy-Bold', Courier, monospace;
  color: #001823;
  font-size: 20px;
  line-height:1.1em;
  font-weight: 600;
}
.SubHeadingLine {
  font-family: 'Gilroy-Semibold', Courier, monospace;
  color: #001823;
  font-size: 20px;
  line-height:1.1em;
}
.StrongText {
  font-family: 'Gilroy-Regular', Courier, monospace;
  color: #385261;
  font-size: 16px;
}
.TextLine {
  font-family: 'Gilroy-Regular', Courier, monospace;
  color: #385261;
  font-size: 14px;
}
.DisclaimerTextLine {
  font-family: 'Gilroy-Regular', Courier, monospace;
  color: #BDBFBE;
  font-size: 16px;
  display: inline-block;
  line-height: 1rem;
}


.listing-card-info-container {
  padding: 35px 25px 30px 25px;
}

@media (max-width:1080px){
  .listing-card-info-container { padding: 0.75rem 1rem; }
}
@media (max-width:950px){
  .listing-card-info-container {
    padding: 0.4rem 0.5rem;
  }
}
@media (max-width:480px){
  .listing-card-info-container { min-width: 100%; }
}

.TextAgentHeading {
  font-family: 'Gilroy-Semibold', Courier, monospace;
  color: #001823;
  font-size: 1.5rem;
  line-height: 1.1em;
}
.TextAgentPar {
  font-family: 'Gilroy-Medium', Courier, monospace;
  color: #001823;
  font-size: 0.7rem;
}
.TextAgentEmail {
  font-family: 'Gilroy-Medium', Courier, monospace;
  color: #001823;
  font-size: 0.7rem;
  text-decoration: none;
  width: 100%;
  display: block;
}
.TextAgentCallLink {
  font-family: 'Gilroy-Medium', Courier, monospace;
  color: #ff5e35;
  font-size: 20px;
  text-decoration: none;
}
.TextAgentLink {
  font-family: 'Gilroy-Medium', Courier, monospace;
  color: #ff5e35;
  font-size: 0.7rem;
  text-decoration: underline;
  width: 100%;
  display: block;
}
.TextAgentLinknoUnderline {
  font-family: 'Gilroy-Medium', Courier, monospace;
  color: #000000;
  font-size: 0.65rem;
  text-decoration: none;
}
.TextLineBold {
  font-family: 'Gilroy-Regular', Courier, monospace;
  color: #000000;
  font-size: 16px;
  font-weight: 600;
}
.TextLineAgentLookup {
  font-family: 'Gilroy-Regular', Courier, monospace;
  color: #000000;
  font-size: 1rem;
  font-weight: 600;
  width: calc( 32% - 8px );
  margin-bottom: 0.25rem;
  text-decoration: none;
}

.TextLineAgentLookup-container {
  display: flex;
  flex-wrap: wrap;
  column-gap: 12px;
}
.TextLineAgentLookup-container:nth-of-type(2) { flex-basis: 48%; flex-grow: 3; }
.TextLineAgentLookup-container:nth-of-type(3) { flex-basis: 32%; flex-grow: 2; }
.TextLineAgentLookup-container:nth-of-type(4) { flex-basis: 16%; flex-grow: 1; }


.heartWishTop img {
  float: right;
  margin-top: 15px;
}
.asListedOnBottom img {
  float: right;
}

.badge-on-image-top {
  position: absolute;
  top: 0; /* position where you want it */
  left: 0;
}
  .badge-on-image-top img {
    width: 2rem;
  }
.badge-on-image-bottom {
  position: absolute;
  bottom: 0; /* position where you want it */
  right: 0;
  background: #ff5e35;
  color: #fff;
  font-size: 0.9rem;
  padding: 0.4rem 0.6rem;
}
span.badge-on-image-bottom.badge-on-image-dark,
.badge-on-listing-top.badge-on-image-dark {
  background: #ff5e35;
}

body.property > section:first-of-type {
  position: relative;
}

@media (max-width:480px){
  body.property section .container {
    padding-left: 0;
    padding-right: 0;
  }
  body.property .listing-card-info-container, 
  body.property .listing-card-wishlist-container {
    padding: 0.75rem 0.75rem;
  }
}
.move-up-for-btn {
  width: 100%;
  top: -55px;
  position: relative;
}
.property .badge-on-listing-top {
  box-shadow: 4px 4px 4px #00000050;
}
.textRight {
  text-align: right;
}
.badge-on-listing-top {
  position: absolute;
  top: 20px;
  z-index: 2;
  font-size: 1rem;
  padding: 0.7rem 1.0rem;
  background: #ff5e35;
  color: #fff;
}

.CenterImg {
  display: flex;
  justify-content: center;
}

.jumbotron {
  opacity: 1;
  /* position:relative;
  overflow:hidden;
  min-height: 360px; */
}
.jumbotron .container {
  position:relative;
  z-index:2;
  /* padding:2rem; */
}

.colorOrange {
color: #ff5e35;
}

.img-fluid {
  width: 100%;
}

.bg-orange-banner {

  background: #3ADD87;
  /* background: rgb(255,102,0);
  background: -moz-linear-gradient(270deg, rgba(255,102,0,1) 0%, rgba(232,70,7,1) 100%);
  background: -webkit-linear-gradient(270deg, rgba(255,102,0,1) 0%, rgba(232,70,7,1) 100%);
  background: linear-gradient(270deg, rgba(255,102,0,1) 0%, rgba(232,70,7,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff6600",endColorstr="#e84607",GradientType=1); */
  height: 100%;
}

.bi::before {
  display: inline-block;
  content: "";
  vertical-align: -0.125em;
  background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z' clip-rule='evenodd'/></svg>");
  background-repeat: no-repeat;
  background-size: 1rem 1rem;
}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
}

.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



/* .btn-outline-orange {
  --bs-btn-color: #FFFFFF !important;
  --bs-btn-border-color: #FFFFFF !important;
  --bs-btn-hover-color: #ff5e35 !important;
  --bs-btn-hover-bg: #FFFFFF !important;
  --bs-btn-hover-border-color: #FFFFFF !important;
  --bs-btn-focus-shadow-rgb: 13, 110, 253 !important;
  --bs-btn-active-color: #ff5e35 !important;
  --bs-btn-active-bg: #FFFFFF !important;
  --bs-btn-active-border-color: #FFFFFF !important;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125) !important;
  --bs-btn-disabled-color: #FFFFFF !important;
  --bs-btn-disabled-bg: transparent !important;
  --bs-btn-disabled-border-color: #FFFFFF !important;
  --bs-gradient: none !important;
} */

.col {
  padding: 15px;
}

#exampleSelect {
  background-color: transparent;
  color: #FFFFFF;
}

.tab-content .col {
  max-width: 250px;
}

.tab-content .col.col-double, 
.tab-content .col.col-double .col {
  max-width: inherit;
}

.icon-image-right {
  float: right;
  margin-top: 5px;
}

.DropDownImageWhite::after {
  display: block;
  margin-left: 0.255em;
  /* vertical-align: 0.255em; */
  content: url(/images/icons/plus-filter-white.svg);
  width: 15px;
  height: 15px;
  float: right;
  transition: all 350ms ease-in-out;
}
.DropDownImageWhite:hover::after, .DropDownImageWhite:focus::after {
  content: url(/images/icons/plus-filter-white.svg);
}

.dropdown-toggle { position: relative; } 
.dropdown-toggle::after {
  content: url(/images/icons/drop-down-white.svg);
  display: inline-block;
  width: 0.5rem;
  padding: 0px 0 0px 4px;
  position: relative;
  transform: translateY(-3px);
}
.dropdown-toggle:hover::after, .dropdown-toggle:focus::after {
  content: url(/images/icons/drop-down-white.svg);
  /* transform: rotate(180deg); */
}

.navbar-nav .dropdown-menu {
  background: #4F0089;
  border-radius: 0;
}

.form-select-container { position: relative; }
.form-select-container::after {
  display: block;
  /* margin-left: 0.255em; */
  /* vertical-align: 0.255em; */
  content: url(/images/icons/drop-down-p.svg);
  position: absolute;
  right: 0.6rem;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  z-index: 0;
}
.form-select-container .form-select {
  z-index: 1;
  position: relative;
}


.DropDownImageWhiteBed::before, .DropDownImageWhiteBath::before {
  display: block;
  margin-left: 0.255em;
  /* vertical-align: 0.255em; */
  width: 15px;
  height: 15px;
  float: left;
}
.DropDownImageWhiteBed::before {
  display: block;
  width: 100%;
  background-image: url(/images/bed-white.svg);
  background-repeat: no-repeat;
  background-position: left 0.75rem center;
  background-size: 16px 12px;
}
.DropDownImageWhiteBath::before {
  display: block;
  width: 100%;
  background-image: url(/images/bath-white.svg);
  background-repeat: no-repeat;
  background-position: left 0.75rem center;
  background-size: 16px 12px;
}
.text-left {
  text-align: left !important;
}

.MinWidth400 {
  min-width: 400px !important;
}





/* About Us */
.mobile-about-reverse { flex-direction: row; }
.mobile-about-hide { display: block; }

.navbar-hide-on-desktop{
  display: none;
}
.navbar-hide-on-mobile {
  display: block;
}

.placement-space-mobile-toggle {
  /* flex-direction: row; */
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 1fr;
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  margin-bottom: 2rem;
}


.orange-arrow-right::after {
  content: "";
  display: inline-block;
  width: 13px;
  height: 12px;
  background-image: url(../images/icons/arrow-right-orange.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin-left: 0.3em;
  margin-bottom: -0.1em;
}
@media (max-width:1360px){
  
  header { height: calc( 2rem + 2rem ); }
  .navbar { padding-top: 1rem; padding-bottom: 1rem; }
}

@media (max-width:991px){
  .nav-link { padding-left: 0rem; padding-right: 0rem; }
}

@media (max-width:880px){
  .mobile-about-reverse { flex-direction: column-reverse; }
  .mobile-about-hide { display: none; }
  .navbar-hide-on-mobile {
    display: none;
  }
  .navbar-hide-on-desktop{
    display: block;
  }
  .placement-space-mobile-toggle {
    flex-direction: column;
  }
}

@media (max-width:768px){
  .placement-space-desktop { display: none; }
  .placement-space-mobile { display: block; }

  .placement-space-mobile-toggle .CenterImg {
      display: block;
  }
}

@media (max-width:480px){

  header { height: calc( 0.5rem + 2rem ); }
  .navbar {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }

  .nav-logo { width: 1rem; }
  .navbar-toggler-icon { height: 1.36em; }
  

  h1 { font-size: 1.7rem; font-family: 'Gilroy-SemiBold'; }
  h2 { font-size: 0.9rem; font-family: 'Gilroy-Medium'; }
  h3 { font-size: 0.9rem; font-family: 'Gilroy-Medium'; }

  .footer-logo-container { flex-basis: 100%;}
  .footer-nav-link { 
    width: calc( 50% - 8px ); 
  }
  .footer-nav-container {
    flex-basis: calc( 100% - 20px );
  }

  .mobile-space-y {
    margin: 1rem 0;
  }
}

@media (max-width:480px){
  .TextAgentEmail { }
}

@media (max-width:440px){
  .placement-space-mobile-toggle { grid-template-columns: repeat(1, 1fr); }
}