@media only screen and (min-width: 641px) and (max-width: 1080px) {
    .nav-links {
        flex-direction: row; 
        justify-content: center; 
        text-align: center; 
        gap: 20px;
    }

    .nav-links a {
        font-size: 16px; 
        
    }

    .nav-links i {
       display: none;
    }
    /* -------------- */
    .logo {
        flex-direction: column; 
        text-align: center; 
    }

    .logo p {
        font-size: 18px; 
        text-align: center;
    }

    .logo p:first-child {
        margin-bottom: 10px; 
    }
    /* ----------- */
    .nav-bar {
        flex-direction: row; 
        justify-content: space-around;
        align-items: center;
    }

    .nav-bar li {
        width: auto; 
    }

    .nav-bar li:not(:last-child)::after {
        display: block;
        width: 1px;
        height: 50%;
        background-color: #ccc; 
        position: absolute;
        right: 0;
        top: 25%;
    }

    .nav-bar a {
        padding: 10px 20px;
        text-align: center;
    }
    /* .nav-bar a:hover{
        display: block;
    }
    .nav-bar a:active, .nav-bar a:focus{
        display: block;
    } */
    /* ---------------- */
    .container {
        flex-direction: row;
        justify-content: space-between;
        padding: 20px;
        

    }

    .left-section {
        margin: 100px;
        text-align: left;
        flex: 1;
    }

    .left-section h1 {
        font-size: 30px; 
        
    }

    .right-section {
        margin: 50px;
        padding: 20px;
        width: 300px; 
        height: 500px;
    }

    .find {
        font-size: 20px; 
    }

    .buy {
        font-size: 14px; 
    }

    input[type="text"],
    input[type="number"] {
        width: 95%; 
        padding: 10px;
    }

    .search {
        width: 100%; 
        padding: 15px;
    }

    .grid-container {
        grid-template-columns: 1fr 1fr; 
        gap: 10px;
    }
    /* ------------------ */

    .best-sale-homes {
        text-align: center;
        background-color: #f8f8f8;
        margin: 25px; 
        /* background-color: #ebe8e8; */
    }

    .section-title {
        font-size: 28px; 
        margin-bottom: 12px;
        padding: 18px; 
        color: #d4a373;
    }

    .sales-home {
        font-size: 28px; 
        margin-bottom: 40px; 
    }
    /* ---------- */
    .home-cards {
        display: flex;
        flex-direction: row; 
        /* flex-wrap: wrap;  */
        justify-content: center; 
        align-items: flex-start; 
        color: #c1bfbe;
    }

    .home-card {
        width: calc(50% - 20px); 
        height: auto;
        margin: 10px; 
        padding: 20px; 
    }

    .featured-tag,
    .sale-tag,
    .sale-tag2 {
        position: absolute; 
        margin-bottom: 15px; 
    }

    img {
        height: 180px; 
        margin-bottom: 15px; 
    }

    .price {
        position: absolute;
        text-align: center;
        font-size: 20px;
        margin-bottom: 15px; 
        padding: 5px 10px; 
    }

    .small-container {
        display: flex; 
        flex-direction: column;
    }

    .reno {
        font-size: 20px; 
        margin-bottom: 10px; 
    }

    .add {
        font-size: 16px;
        margin-bottom: 15px; 
    }

    .home-features {
        display: flex; 
        flex-direction: row; 
        justify-content: center; 
        font-size: 12px; 
        margin: 0;
    }

    .home-features li {
        border-right: 1px solid #ccc; 
        padding-right: 10px; 
    }

    .home-features li:last-child {
        border-right: none; 
    }

    .apart {
        margin-top: 10px; 
    }
    /* ------------ */
    .container1 {
        display: flex;
        flex-direction: row; 
        justify-content: space-between; 
        align-items: flex-start; 
        padding: 30px; 
        background-color: #fff;
    }

    .text-section {
        flex: 1; 
        text-align: left; 
        margin-right: 20px;
    }

    .rent {
        margin-top: 10px;
        font-size: 16px; 
        color: #c49c6b;
    }

    .modern {
        font-size: 28px; 
        margin-bottom: 20px;
    }

    .more {
        font-size: 16px; 
        line-height: 1.5; 
        margin-bottom: 30px; 
        color: rgb(180, 176, 176);
    }

    .features {
        display: flex;
        flex-direction: row; 
        justify-content: space-between; 
        flex-wrap: wrap; 
        margin-bottom: 30px; 
    }

    .feature {
        display: flex;
        flex-direction: column;
        align-items: center; 
        margin-bottom: 20px;
    }

    .feature img {
        width: 40px; 
        height: 50px;
        margin-bottom: 10px; 
    }

    .names {
        font-size: 14px; 
    }

    .rentpro {
        background-color: #c49c6b;
        color: white;
        border: none;
        padding: 12px 24px; 
        cursor: pointer;
        font-size: 16px; 
    }

    .image-section {
        flex: 1; 
    }

    .image-section img {
        width: 100%;
        height: auto; 
    }
    /* ----------- */
    .best-sale-homes1 {
        text-align: center;
        background-color: #f8f8f8;
        margin: 20px; 
        
        /* flex-wrap: wrap;  */
    }

    .section-title1 {
        font-size: 28px; 
        margin-bottom: 10px; 
        padding: 18px; 
        color: #d4a373;
    }

    .sales-home1 {
        font-size: 28px; 
        margin-bottom: 40px; 
        flex-wrap: wrap; 

    }

    .home-cards1 {
        display: flex;
        flex-direction: row; 
        flex-wrap: wrap; 
        justify-content: center; 
        align-items: flex-start;
        color: #c1bfbe;
    }

    .home-card1 {
        width: calc(50% - 20px); 
        height: auto;
        margin: 10px; 
        padding: 20px;
        position: relative; 
    }

    .featured-tag1,
    .sale-tag1,
    .sale-tag2 {
        position: absolute; 
        margin-bottom: 15px; 
    }

    img {
        height: 180px; 
        margin-bottom: 15px; 
    }

    .price1 {
        position: absolute;
        text-align: center;
        font-size: 20px; 
        margin-bottom: 15px; 
        padding: 5px 10px; 
    }

    .small-container1 {
        display: flex; 
        flex-direction: column; 
    }

    .reno1 {
        font-size: 20px;
        margin-bottom: 10px; 
    }

    .add1 {
        font-size: 16px;
        margin-bottom: 15px;
    }

    .home-features1 {
        display: flex; 
        flex-direction: row;
        justify-content: center; 
        font-size: 12px; 
        margin: 0;
    }

    .home-features1 li {
        border-right: 1px solid #ccc; 
        padding-right: 10px; 
    }

    .home-features1 li:last-child {
        border-right: none; 
    }

    .apart1 {
        margin-top: 10px; 
    }
    /* --------container 3 -------- */








    /* ----------------------- */

    .rent-sec {
        text-align: center;
        margin-top: 40px; 
        width: 100%; 
        max-width: 100%; 
        margin-left: auto;
        margin-right: auto;
    }

    .img-container {
        display: grid;
        margin-top: 30px; 
        grid-template-columns: repeat(auto-fill, minmax(calc(50% - 20px), 1fr 1fr)); 
        gap: 15px; 
    }

    .img1 {
        width: 100%;
        height: 250px;
        margin-bottom: 15px; 
        /* background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5));  */
    }
    /* --------big para */
    .big-para {
        text-align: center;
        background-color: #ffffff;
        height: auto;
        padding: 30px; 
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .icon1 {
        width: 40px; 
        height: 40px; 
        margin-top: 25px; 
        margin-bottom: 15px; 
    }

    .big {
        margin-top: 15px; 
        color: rgb(180, 176, 176);
        font-size: 16px; 
    }

    .name {
        font-size: 22px; 
        margin-top: 15px; 
    }

    .client {
        font-size: 14px; 
        color: #c49c6b;
    }

    .container9 {
        display: flex;
        flex-direction: row; 
        justify-content: space-around;
        align-items: center;
        height: auto; 
        padding: 20px;
        background-color: #2c2c2c;
    }

    .item {
        text-align: center;
        color: white;
        margin-bottom: 20px;
    }

    .icon {
        width: 100px; 
        height: 100px; 
        margin-bottom: 15px; 
    }

    .team {
        text-align: center;
        margin-top: 30px; 
        width: 100%;
        padding: 0 20px; 
    }

    .team1 {
        font-size: 24px; /
        margin-top: 20px; 
        color: #c49c6b;
    }

    .lead {
        margin-top: 15px;
    }

    .img {
        width: 100%;
        height: auto; 
        margin-top: 20px; 
        margin-bottom: 20px;
        background-color: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5));
    }

    .best-sale-homes5 {
        text-align: center;
        background-color: #f8f8f8;
        padding: 20px;
    }

    .section-title5 {
        font-size: 22px; 
        margin-bottom: 15px; 
        padding: 20px; 
        color: #d4a373;
    }

    .sales-home5 {
        font-size: 32px; 
        margin-bottom: 40px; 
        
    }

    .home-cards5 {
        display: flex;
        flex-direction: row; 
        flex-wrap: wrap; 
        justify-content: space-around; 
        align-items: flex-start;
        color: #c1bfbe;
    }

    .home-card5 {
        width: 30%; 
        height: auto; 
        margin: 15px; 
        padding: 20px; 
        position: relative;
    }

    img {
        height: 180px; 
        margin-bottom: 15px; 
    }

    .home-details5 {
        text-align: left;
        color: rgb(180, 176, 176);
    }

    .reno5 {
        font-size: 14px; 
        color: rgb(180, 176, 176);
    }

    .add5 {
        font-size: 20px; 
        margin-top: 15px; 
        color: #2d2c2c;
    }

    .apart5 {
        margin-top: 15px; 
    }

    .nametag {
        margin-top: 20px; 
        color: #2d2c2c;
    }
/*---------- */
    footer {
        padding: 20px 0; 
    }

    .footer-container {
        flex-direction: row; 
        padding: 0 30px; 
        justify-content: space-between; 
    }

    .footer-left,
    .footer-middle,
    .footer-right {
        flex: 1; 
        margin-bottom: 0; 
    }

    .footer-left .logo123 {
        justify-content: flex-start; 
    }

    .footer-left .logo123 .final-logo {
        width: 50px; 
        height: 50px; 
        margin-right: 10px; 
    }

    .footer-left p {
        margin: 10px 0;
        text-align: left; 
    }

    .social-icons a {
        margin-right: 10px; 
        font-size: 24px; 
    }

    .footer-middle p {
        margin: 10px 0; 
        font-size: 16px; 
        line-height: 1.6; 
    }

    .footer-right ul {
        padding: 0;
    }

    .footer-right ul li {
        margin-bottom: 10px; 
    }

    .footer-right ul li a {
        font-size: 16px; 
    }

    .footer-right .map {
        margin-top: 15px;
        margin-bottom: 15px; 
        text-align: left; 
    }

    .footer-bottom {
        flex-direction: row; 
        padding: 15px 30px; 
        text-align: left; 
    }

    .footer-bottom p {
        margin: 0; 
        font-size: 16px; 
    }

    .privacy-policy {
        flex-direction: row; 
        align-items: center; 
    }

    .privacy-policy button {
        margin-right: 15px; 
        padding: 8px 15px; 
    }

    .privacy-policy a {
        font-size: 16px; 
    }
}