.property-card {
display: flex;
background-color: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
margin: 20px 0;
}
.property-image img {
width: 300px;
height: auto;
object-fit: cover;
}
.property-details {
padding: 20px;
flex: 2;
}
.property-details h2 {
color: #0077b6;
margin-bottom: 10px;
font-size: 24px;
}
.property-details p {
color: #666;
margin: 5px 0;
line-height: 1.6;
}
.property-details h3 {
color: #444;
margin-top: 20px;
font-size: 20px;
}
.view-more {
padding: 10px 20px;
background-color: #0077b6;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
margin-top: 10px;
}
.view-more:hover {
background-color: #005f87;
}
.property-info {
padding: 20px;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.property-info ul {
list-style: none;
padding: 0;
}
.property-info li {
font-size: 18px;
margin: 5px 0;
}
.property-info i {
margin-right: 5px;
} .details-container {
display: flex;
gap: 20px;
max-width: 1200px;
margin: auto;
background-color: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
padding: 20px;
}
.image-gallery {
flex: 1;
}
.main-image {
width: 100%;
height: auto;
border-radius: 8px;
margin-bottom: 20px;
}
.thumbnail-gallery {
display: flex;
gap: 10px;
}
.thumbnail {
width: 100%;
max-width: 177px !important;
height: 80px;
cursor: pointer;
border-radius: 4px;
border: 1px solid #ddd;
}
.property-info {
flex: 1.5;
padding: 0 20px;
}
.property-info h1 {
color: #0077b6;
font-size: 28px;
margin-bottom: 10px;
}
.address, .price, .description {
color: #666;
margin-bottom: 20px;
}
.features-list {
list-style: none;
padding: 0;
margin: 0 0 20px 0;
}
.features-list li {
font-size: 18px;
margin: 10px 0;
}
.contact-form {
display: flex;
flex-direction: column;
gap: 10px;
}
.contact-form label {
font-size: 16px;
color: #333;
}
.contact-form input, 
.contact-form textarea {
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 16px;
}
.contact-form button {
padding: 10px;
background-color: #0077b6;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
margin-top: 10px;
}
.contact-form button:hover {
background-color: #005f87;
} #properties-container.loading {
opacity: 0.5; pointer-events: none;
}
.pagination {
text-align: center;
margin: 20px 0;
}
.pagination button {
display: inline-block;
margin: 5px;
padding: 8px 12px;
background-color: #0073aa;
color: #fff;
border: none;
cursor: pointer;
}
.pagination .current-page {
display: inline-block;
margin: 5px;
padding: 8px 12px;
background-color: #333;
color: #fff;
border: none;
}
.pagination span {
display: inline-block;
margin: 5px;
padding: 8px 12px;
background-color: transparent;
color: #333;
border: none;
}  .content {
width: 70%;
}
.sidebar {
width: 30%; padding-left: 20px;
}
h1 {
color: #333;
}
.subtitle, .price {
color: #666;
font-size: 16px;
}
.content img {
width: 100px;
height: auto;
margin-top: 10px;
}
button {
margin-top: 20px;
padding: 10px 20px;
font-size: 16px;
color: white;
background-color: #007BFF;
border: none;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}
a {
text-decoration: none;
color: #007BFF;
}
a:hover {
text-decoration: underline;
} .property-container{
max-width:1170px;
margin:0 auto;
font-family:"Lato", Sans-serif !important;
padding:30px 0;
}
.property-container .tittle{
font-size: 48px;
font-weight: 700;
text-align:center;
text-transform:uppercase;
color:#0076a5;
}
.property-container .sub-tittle, .container-loop .sub-tittle{
color:#0076A5 !important;
font-size:27px !important;
font-weight:700;
text-align:center;
}
.property-details-imgArea {
margin:32px 0 0;
text-align: center;
}
.property-details-imgArea .img-fluid{
width:100%;
}
.property-details-content{
padding:60px 0;
}
.property-details-content table {
border-collapse: collapse;
margin: 25px 0 0;
}
.property-details-content table th {
background:#0078A7;
color: #fff;
}
.property-details-content table th, .property-details-content table td{
text-align:center;
border:1px solid #e5e5e5;
}
.property-details-content table tr td:first-child{
background-color:#f8f8f8;
}
.property-details-content table td a {
font-weight: bold;
color: #0481b3;
}
.property-details-content table thead{
position: sticky;
top:125px;
height: 100%;
width: 100%;
}
.container-loop-lists .container-loop{
max-width:100%;
margin:0 0 40px;
}
.container-loop .table-section table {
border-collapse: collapse;
margin: 0 0 6px;
}
.container-loop .table-section table th, .container-loop .table-section table td {
text-align: center;
border: 1px solid #e5e5e5;
}
.container-loop .table-section table th {
background: #0078A7;
color: #fff;
}
.container-loop .table-section table tr td:first-child {
background-color:#f8f8f8;
}
.container-loop .table-section table td a {
font-weight:bold;
color:#0481b3;
text-decoration:none;
}
.container-loop .header .sub-tittle{
text-align:left;
}
.container-loop .table-section h3{font-size:20px;}
.container-loop .table-section .total{ color: #2f2f2f;
font-size: 20px;
}
.container-loop .view-release-btn {
text-decoration: none !important;
padding: 11px 46px;
font-size: 16px;
border-radius: 5px;
background: #009edb;
transition:all 0.65s ease;
border:1px solid #009edb;
}
.container-loop .view-release-btn:hover{
background: #fff;
color:#009edb;
border:1px solid #009edb;
}
.container-loop .info-section {
padding: 15px 0 0;
}
.container-loop .print-release {
margin: 19px 0 0;
font-weight: 500;
color: #0186ba;
}
.container-loop .print-release:hover{
text-decoration:none;
}
.property-container .details-container .tittle{
text-transform:inherit;
font-size:39px;
text-align:left;
margin:0;
}
.details-container .sidebar{ padding: 25px;
}
.details-container .sidebar .agent-details h3 {
color: #0076a5;
margin: 0 0 12px;
}
.details-container .sidebar .agent-details{
background: #f5f5f5;
padding: 20px;
}
.details-container .sidebar .agent-details p{
color:#000;
margin:0;
}
.agent-btns-area {
display: flex;
flex-wrap:wrap;
row-gap: 2px;
column-gap: 7px;
margin:25px 0 0;
}
.agent-btns-area button{
width:100%;
margin:11px 0 0;
color: white;
background-color: #aea87f;
border:1px solid transparent;
transition:all 0.65s ease;
padding:13px 11px;
}
.agent-btns-area button:hover{
background-color: #748d00;
color:#0076a5;
border:1px solid #0076a5;
}
.property-container .details-container .subtitle{
margin:0 0 17px;
}
.details-container .price {
font-size: 27px;
font-weight: 600;
color: #000;
margin:0 0 26px;
}
.details-container .lotArea {
margin: 0 0 4px;
font-size: 19px;
font-weight: bold;
}
.details-container .image-gallery{
margin:0;
}
.details-container .image-gallery .thumbnail-gallery {
padding: 0;
flex-wrap: wrap !important;
}
.details-container .image-gallery .thumbnail-gallery img {
width: 25% !important;
height: 125px !important;
max-width: 100% !important;
object-fit: contain;
background: #efefef;
padding: 7px;
}
.details-container .apleyText {
font-size: 19px;
font-weight: bold;
margin: 30px 0 11px;
}
.details-container iframe{
margin:30px 0 0 !important;
}
.container-loop .map-section{margin:0;}
.container-loop .map-section img{padding:0;}
@media(max-width:767px){
.property-details-content table thead{
top:62px;
}
.property-details-content table th{
font-size:13px;
line-height:19px;            
}
.property-details-content table td{
padding:4px;
}
.property-container .tittle{
font-size:36px;
}
.property-details-imgArea {
margin: 19px 0 0;
}
.container-loop .print-release{
text-align:left;
}
.details-container{
flex-wrap:wrap;
}
.details-container .content{
width:100%;
}
.details-container .sidebar{
width:100%;
}
.property-container .details-container .tittle{font-size:36px; line-height:45px;}
}