/* Container for the property items */
.property-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Four columns */
    gap: 20px; /* Spacing between items */
    padding: 20px;
    box-sizing: border-box;
}


 
        .custom-post-grid-container {
            width: 100%;
            max-width: 100%;
            padding: 0;
            margin: 0 auto;
            box-sizing: border-box;
        }
        .custom-post-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
            width: 100vw;
            box-sizing: border-box;
            padding: 0;
            margin: 0;
        }
        .custom-post-item {
            border: 1px solid #ddd;
            padding: 15px;
            border-radius: 5px;
            background-color: #f9f9f9;
            height:100%;
        }
        .custom-post-thumbnail {
            position: relative;
            height: 200px;
            overflow: hidden;
        }
        .custom-post-thumbnail img {
            width: 100%;
            height: 200px;
            object-fit: cover;
            object-position: center;
            display: block;
            image-rendering: -webkit-optimize-contrast;
            image-rendering: crisp-edges;
            image-rendering: high-quality;
            -ms-interpolation-mode: nearest-neighbor;
            transform: translateZ(0);
            backface-visibility: hidden;
            border-radius: 5px;
            margin-bottom: 10px;
           
        }
        
        .thumbnail-price {
    position: absolute;
    bottom: 10px;
    left: 10px;
    background-color: #fff; /* White background */
    color: #000; /* Black text */
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Optional shadow for a neat effect */
    z-index: 2;
}

.custom-post-content h3 {
   margin-top:20px;
   color: #000;
   font-size: 20px;
   margin-bottom: 7px;
}

.custom-post-content p {
    margin: 0;
     color: #000;
}
        @media (max-width: 768px) {
            .custom-post-grid {
                grid-template-columns: 1fr;
                width: 100%;
            }
        }
        

/* Responsive styles */
@media (max-width: 1200px) {
    .property-grid {
        grid-template-columns: repeat(3, 1fr); /* Three columns */
    }
}

@media (max-width: 768px) {
    .property-grid {
        grid-template-columns: repeat(2, 1fr); /* Two columns */
    }
}

@media (max-width: 480px) {
    .property-grid {
        grid-template-columns: 1fr; /* Single column */
    }
}