:root {
	--main-color: #11144f;
	--color-dark-bg: #fff;
	--color-dark-red:#dd240f;
	--summary-property-margin: 5px 0 0 0;
	--summary-property-width:100%;
}

*, *::before, *::after {
	box-sizing: border-box;
}

body {
	font-family: 'Montserrat', sans-serif;
	color: var(--main-color);
}
.dark-red{
	color:var(--color-dark-red);
}

.property-address{
	font-size:15px;
}
.px-2 {
	padding-left: 2em;
	padding-right: 2em;
}

.f-properties h1, .main-content h1{
	margin:20px 0 30px;
}
.no-cursor {
    cursor: default;
    pointer-events: auto;
}
.site-header-fixed {
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 999;
	background: #fff; /* or your navbar background */
}

.mobile-logo img, .navbar-brand img{
	width: 300px;
}
.navbar-brand{
    height:auto !important;
}

#header-full-top {
	text-align: center;
	margin: 30px 0;
}

#header .navbar-nav > li > a {
    
	display: block;
	padding: 20px 15px;
	line-height: 20px;
	height: 60px;
	box-sizing: border-box;
}

#header .navbar-nav > li > a:hover {
	padding: 20px 15px; /* No change on hover */
}

.navbar-default {
    background: transparent;
    box-shadow: 0 9px 10px 5px rgba(0, 0, 0, 0.2);
    border: 0 !important;
    margin-bottom: 0;
}

.navbar-default .navbar-nav > li > a {
	color: #13144f !important;
	border-bottom:2px solid #fff;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a.active {
	border-bottom: 2px solid #13144f !important;
	background: none !important;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
	color: white;
	background: none !important;
}

.navbar-nav .dropdown > a::after {
	content: none;
}
.navbar-nav > li > ul {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 999;
    display: none;
    background: white; /* or your background color */
    padding:0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.15); /* optional */
    pointer-events: none;
    transition: opacity 0.2s ease;
    opacity: 0;
}


.navbar-nav > li:hover > ul {
    pointer-events: auto;
    opacity: 1;
    display: block;
}

.navbar-nav > li {
    position: relative; /* important so the submenu is positioned relative to the parent li */
}


.dropdown-menu {
	background: #ad2017;
	color: white;
}

.dropdown-menu > li > a {
	padding: 10px 20px;
	color: white;
	background: var(--color-dark-red);
}

#navbar li a {
	margin-top: 5px;
}

#navbar li ul {
	top: 53px;
}

#navbar li:hover,
#navbar li a:hover {
	background: #130f4c;
	color: white;
}

.custom-nav {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
	text-transform: uppercase;
	padding-left: 0;
	margin: 0;
	list-style: none;
}

.custom-nav > li {
	text-align: center;
	margin: 0 10px;
}

.custom-nav > li > a {
	display: inline-block;
	padding: 10px 15px;
	border-bottom: 2px solid transparent;
	transition: border-color 0.3s;
}

.custom-nav > li.active > a,
.custom-nav > li > a:hover {
	border-bottom: 2px solid #13144f;
}

#property-search-form {
	background-color: var(--main-color);
	box-shadow: 0 -9px 10px 5px rgba(0, 0, 0, 0.2);
	padding: 30px 0;
}

#property-search-form .form-control {
	height: 45px;
}

#property-search-form .btn-search, .contact-btn {
	background-color: var(--color-dark-red) !important;
	color: var(--color-dark-bg) !important;
	height: 45px;
	padding: 0 30px;
}
#property-search-form .btn-search:hover,
.contact-btn:hover {
    filter: brightness(90%);
}


.mt-15 {
	margin-top: 15px;
}

.main-content{
    padding-top:20px;
    margin-bottom: 30px;
    min-height:300px;
}

.featured-properties {
	padding: 60px 0;
	background-color: #f9f9f9;
}

.featured-properties .container, .f-properties .container,
footer .container {
	width: 1300px;
	padding: 0;
}

.featured-properties h2 {
	text-align: center;
	margin-bottom: 40px;
}

.featured-properties .row > div[class*='col-'] , .f-properties .row > div[class*='col-'] {
	padding: 0 7px;
}

.featured-properties .row > div[class*='col-']:nth-child(4n+1) {
	padding-left: 0;
}

.featured-properties .row > div[class*='col-']:nth-child(4n) {
	padding-right: 0;
}

.property-card {
    background: #f4f3ee;
    border: 1px solid #ddd;
    margin-bottom: 30px;
    box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.2);
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.property-card img {
	width: 100%;
}

.imgprop {
	height: 195px;
	object-fit: cover;
}

.property-card .price-tag {
	position: absolute;
	top: 10px;
	left: 10px;
	background-color: #00204a;
	color: var(--color-dark-bg);
	padding: 5px 10px;
	font-size: 12px;
	text-transform: uppercase;
}

.property-card .details {
	padding: 20px;
}

.property-card .price,
.property-card .mls {
	font-weight: bold;
	color: var(--main-color);
	line-height: 20px;
}

.property-card .price {
	font-size: 17px;
}

.property-card .mls {
	font-size: 16px;
}

.property-card .stats {
	margin: 15px 0;
}

.property-card .stats ul li {
	display: inline-block;
	margin-right: 10px;
}

.property-card .property-address {
	margin: 5px 0 0;
}

.property-card ul li.prop-title, .property-address {
	font-weight: bold;
	font-size: 18px;
	width: 100%;
}
.property-card ul li.prop-title{
	margin: 10px 0 0;
}
.home-propertytext1, .home-propertytext2, .city-propertytext1, .city-propertytext2, 
.search-propertytext1,  .search-propertytext2{
    margin:var(--summary-property-margin) !important;
    width:var(--summary-property-width);
}

ul.property-list{
	list-style-type:none;
	padding:0;
	margin-bottom:20px;
}
.property-list li{display:inline;margin-right:11px;}

.bjqs-wrapper{
	width: 720px;
	height: 488px;
	overflow: hidden;
	position: relative;
}

#slides{display:block;margin:20px 0 0 0;position:relative;}
#slides .caption{
    background: rgba(0, 0, 0, 0.5);
    bottom: 0;
    position: absolute;
    color: #fff;
    padding: 10px;
    width: 100%;
    font-size: 17px;
    min-height: 37px;
}
.slidesjs-previous{background:url('/static/images/elements/image-left-arrow.png') no-repeat;color:#FFFFFF;left:0;position:absolute;top:180px;text-decoration:none;width:50px;height:70px;font-size:0px;display:block;z-index:20;}
.slidesjs-next{background:url('/static/images/elements/image-right-arrow.png') no-repeat;color:#FFFFFF;right:0;position:absolute;top:180px;text-decoration:none;width:50px;height:75px;font-size:0px;display:block;z-index:20;}


.row-eq-height{
    display: flex;
    flex-wrap: wrap;
}

.row-eq-height > [class*="col-"] {
    display: flex;
    flex-direction: column;
}

.modern-table {
	width: 100%;
	border-collapse: collapse;
	margin: 25px 0;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
	border-radius: 8px;
	overflow: hidden;
}
.modern-table thead tr {
	background-color: #11144f;
	color: #ffffff;
	text-align: left;
}
.modern-table th,
.modern-table td {
	padding: 12px 15px;
	border-bottom: 1px solid #dddddd;
}
.modern-table tbody tr {
	background-color: #f3f3f3;
}
.modern-table tbody tr:nth-of-type(even) {
	background-color: #ffffff;
}
.modern-table tbody tr:last-of-type {
	border-bottom: 2px solid #11144f;
}
.modern-table tbody tr.group-header {
	font-weight: bold;
	background-color: #e0e0e0;
	color: #333;
}
.modern-table a {
	color: #11144f;
	text-decoration: none;
}
.modern-table a:hover {
	text-decoration: underline;
}

.faq-container {
	width: 100%;
	margin:0 auto;
}
.faq-item {
	background-color: #ffffff;
	border: 1px solid #ddd;
	border-radius: 8px;
	margin-bottom: 25px; /* Increased spacing between FAQ items */
	overflow: hidden;
	box-shadow: 0 2px 4px rgba(0,0,0,0.05);
	padding: 20px;
}
.faq-question {
	font-weight: bold;
	color: #11144f;
	font-size: 1.2em;
	margin-bottom: 10px; /* Spacing between question and answer */
}
.faq-answer p {
	margin-bottom: 10px; /* Spacing between paragraphs in answer */
	line-height: 1.6;
}
.faq-answer ul {
	margin-bottom: 10px;
	padding-left: 20px;
}
.faq-answer li {
	margin-bottom: 5px;
}

.people-box{
	background: #fff;
    border-radius: 5px;
    padding-top: 20px;
    padding-bottom: 20px;

	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	align-items: start; /* Prevent push-downs */
}
.read-more-bio{
	background:#ad2017;
	color:white !important;
	padding:5px;
}
.associates-grid{margin:15px 0;}
.heading-associate{margin:0 0 20px 0;}


footer {
	background: #f4f3ee;
	color: var(--main-color);
	padding: 40px 0;
}

footer .logo-footer {
	max-width: 200px;
	margin-bottom: 20px;
}

footer h5 {
	font-weight: bold;
}

footer ul {
	list-style: none;
	padding: 0;
}

footer ul li {
	margin: 10px 0;
}

footer ul li a {
	color: var(--main-color);
}

.footer-bottom {
	background-color: var(--main-color);
	padding: 15px 0;
	text-align: center;
	color: var(--color-dark-bg);
}

.footer-bottom p {
	margin-bottom: 0;
}

.footer-bottom p a {
	color: var(--color-dark-bg);
}

footer .row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#mobile-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9999;
	background-color: #fff;
}

@media (max-width: 1349px) {
	.featured-properties .container, .f-properties .container, footer .container {
		width: 1200px;
	}
}
@media (max-width: 1260px) {
	.featured-properties .container, .f-properties .container, footer .container {
		width: 1130px;
	}
}
@media (max-width: 1199px) {
    .featured-properties .container, .f-properties .container, footer .container{
        width: 990px;
    }
    .property-card .mls {
        float: left !important;
        width: 100%;
        margin-bottom: 10px;
    }
}

@media (max-width: 992px) {
    #property-search-form .col-md-8 .row > .col-md-4:nth-child(2) {
        margin-top: 15px;
        margin-bottom: 15px;
    }
}
@media (max-width: 991px) {
    .mobile-logo{
		float:none!important;
        padding: 15px 0;
    }
    .featured-properties .container, .f-properties .container, footer .container {
        width: 800px;
    }
    .featured-properties .row > div[class*='col-'] {
        padding: 0 7px;
    }
    
    .featured-properties .row > div[class*='col-']:nth-child(2n) {
        padding-right: 0;
    }
    .featured-properties{
        padding-bottom:0;
    }
    .featured-properties .row > div[class*='col-']:nth-child(2n+1) {
        padding-left: 0;
    }

    footer .container{
        width: auto;
        overflow:hidden;
    }
    .featured-properties .container, .f-properties .container{
        width: 610px;
    }
    .featured-properties .row > div[class*='col-'] {
        padding: 0 7px;
    }
    
    .featured-properties .row > div[class*='col-']:nth-child(2n) {
        padding-right: 0;
    }
    
    .featured-properties .row > div[class*='col-']:nth-child(2n+1) {
        padding-left: 0;
    }
}
@media (max-width: 768px) {
	.people-box {
		grid-template-columns: 1fr 1fr;
	}
}
@media (min-width: 768px) {
	.navbar-nav .dropdown:hover > .dropdown-menu {
		display: block;
		visibility: visible;
		opacity: 1;
	}

	.navbar-collapse {
		flex-grow: 1;
		width: 100%;
	}

	.navbar-header {
		width: 100%;
		text-align: center;
	}

	.navbar-header .navbar-brand {
		float: none;
		display: inline-block;
	}

	.navbar-nav {
		width: 100%;
		display: flex;
		justify-content: center;
		justify-content: space-between;
	}

	.navbar-toggle {
		z-index: 9999;
		position: relative;
	}

	.text-center-desktop {
		text-align: center;
	}
}

@media (max-width: 767px) {
    body{
        padding-top:80px;
    }
    .site-header-fixed{
        position:fixed;
    }
    .featured-properties .container, .f-properties .container{
        width: 310px;
    }
    .featured-properties .row > div[class*='col-'],
    .f-properties .row > div[class*='col-'] {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 15px; /* Optional: adds spacing between stacked items */
    }
	.mobile-logo{
		float:left!important;
		padding:0;
	}
	.navbar-default .navbar-nav .open .dropdown-menu>li>a {
		color: #fff;
		padding: 15px 30px;
	}
	/* Force the dropdown to show when .open is added */
	.navbar-nav > li.open > ul,
	.navbar-nav > li.open > .dropdown-menu {
		display: block !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		position: static; /* For mobile, submenu should not be absolute */
		background: #f5f5f5;
		box-shadow: none;
	}
    .featured-properties .row > div[class*='col-'],
    .f-properties .row > div[class*='col-'] {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 15px; /* Optional: adds spacing between stacked items */
    }

	.mobile-header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 1050;
		background: #fff;
		padding: 10px 15px;
        box-shadow: -1px 1px 5px 1px rgba(0, 0, 0, 0.2);
	}

	.mobile-logo {
		float: left;
	}

	.navbar-toggle {
		margin-top: 10px;
		margin-right: 0;
	}

	.navbar.navbar-default {
		background: #fff;
		position:absolute;
        width: 100%;
        top: 80px;
	}

	.navbar-collapse {
		background: #fff;
	}

	.navbar-nav > li {
		float: none;
		border-bottom: 1px solid #eee;
	}

	.navbar-nav > li > a {
		padding: 10px 15px;
		display: block;
	}

	.navbar-nav .dropdown-menu {
		display: none !important;
	}

	.navbar-nav .dropdown.open > .dropdown-menu {
		display: block !important;
	}
	/* Hide .navbar-static-top by default */
	.navbar.navbar-default.navbar-static-top {
		display: none;
	}
	.navbar.navbar-default.navbar-static-top.show {
		display: block;
	}
	/* Add caret icon to menu items with dropdown */
	.navbar-nav .dropdown > a::after {
		content: " ▼";
		float: right;
		font-size: 12px;
	}

}

@media (max-width: 600px) {
    .footer-bottom p {
        float:none !important;
        padding:5px 0;
    }
	.modern-table {
		border: 0;
	}
	.modern-table thead {
		display: none;
	}
	.modern-table, .modern-table tbody, .modern-table tr, .modern-table td {
		display: block;
		width: 100%;
	}
	/* Make each row a card */
	.modern-table tr {
		margin-bottom: 15px;
		border: 1px solid #ddd;
		border-radius: 8px;
		padding: 0;
		box-shadow: 0 2px 4px rgba(0,0,0,0.05);
		overflow: hidden;
	}
	/* Hide group header tr card-styling */
	.modern-table tr.group-header {
		 box-shadow: none;
		 border: none;
		 border-radius: 0;
		 margin: 0;
		 padding: 0;
	}
	.modern-table td {
		text-align: left;
		padding: 12px 15px;
		border-bottom: 1px solid #f0f0f0;
	}
	.modern-table td:last-of-type {
		border-bottom: 0;
	}
	.modern-table td::before {
		content: attr(data-label);
		display: block;
		font-weight: bold;
		margin-bottom: 6px;
		color: #11144f;
	}
	/* Group header cell styling */
	.modern-table tr.group-header td {
		background-color: #f0f0f0;
		text-align: center;
		font-weight: bold;
		padding: 12px 15px;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		margin-top: 5px;
	}
	.modern-table tr.group-header td::before {
		display: none;
	}
}

@media (max-width: 539px) {
	
	h1{
		font-size:30px;
	}
	h2{
		font-size:27px;
	}
	h3{
		font-size:25px;
	}
	h4{
		font-size:23px;
	}
	h5{
		font-size:18px;
	}
	h6{
		font-size:19px;
	}
    .footer-bottom p {
        float:none !important;
        padding:5px 0;
    }
    footer{
        padding: 20px 0;
    }
    footer .row{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        flex-direction: column;
        width: 50%;
        margin: 0 auto;
        text-align: center;
    }
}
@media (max-width: 500px) {
	.people-box {
		grid-template-columns: 1fr;
	}
}
@media (max-width: 450px) {
	.mobile-header .container-fluid{
		padding-left:0;
		padding-right:0;
	}
    .mobile-logo img, .navbar-brand img {
        width: 250px;
    }
}

@media (max-width: 380px) {
	.mobile-logo img, .navbar-brand img {
        width: 200px;
        margin: 6px 0;
    }
	.featured-properties .container, .f-properties .container {
        width: 280px;
    }

}