.banner{background-image: url(../img/banner/third-banner.jpg);
width: 100%;
height: 600px;
background-repeat: no-repeat;
background-size:cover;
background-position: center;
position: relative;
}
 
.banner-layer{    background-image: linear-gradient(180deg,#053A63 0%,#01111B 100%);
    opacity: .62;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column; 
    text-align: center;
    }

    .text-banner{position: absolute;
    top: 0px;
bottom: 0px;
right: 0px;
left: 0px;
width: auto;
height: auto;
text-align: center;
color: white;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;}


    h1{font-family: open, sans-serif;
    font-weight: bold;
font-size: 50px;
line-height: 35px;
color: white;
opacity: 1;
letter-spacing: .6px;
width: 50%;
}

.text-banner h2{color: white;
    font-family:'poppins';
    font-weight: 400;
font-size: 17px;
line-height: 27px;
color: white;
opacity: 1;
letter-spacing: .5px;
margin:17px 20px;
width: 70%;}

/* start search section here */
.search-section{width: 100%;
background:transparent;
background-image: linear-gradient(180deg,#F2F8FE 0%,#FAFCFF 100%);
padding-bottom: 50px;
}

.search-box-di{
margin-top:-95px;
z-index: 1;
height: auto;
width: 100%;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
}

.project_recommended_o12s_main{
    /* width: 75%; */
    width: 100%;
    display: flex;
}



.searchbox-dii{background-color: white;
    width: 70%;
    /* box-shadow: 0 0 43px 0 rgba(7.0000000000000036,152.0000000000005,255,.25); */
    z-index: 1;
    border-radius: 8px;
    position: relative;
}

.first-search-one{
    cursor: pointer;
    display: block;
}

.down-arrow{  
    font-weight: 900;
    font-size: 11px;
    color: #606060;
    transition: transform 0.3s ease;
}

.rotated {
    transform: rotate(180deg);
}

.icon-down-flex{    display: flex;
    align-items: center;
    justify-content: end;
    width: 100%;
    margin-right: 11px;
margin-top: 2px;}

.drop-down-search{    position: absolute;
    width: 500px;
    height: fit-content;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
   background-color: #fff;
    top: 100%;
    bottom: 0px;
border-radius: 8px;
margin-left: -15px;
border-top-left-radius:0px;
border-top-right-radius:0px;
    width: 100%;
    left: 0px;
    right: 0px;
    margin-left: 0px;
    margin-top: -10px;
    transition: all .5s;
    visibility: hidden;
opacity: 0; 

}

#button-flat-id{width: 100%;
display: flex;
align-items: center;
justify-content: center;}

.bt-main-search{width: 70%;
display: flex;
justify-content: center;
align-items: center;
z-index:1;}

.bt-search{color:#1e1e1e;
    padding:11px 25px 11px 25px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin-right: 3px;
font-family:'Poppins';
letter-spacing: .5px;
font-weight: 500;
background-color: white;
font-size: 14px;
cursor: pointer;
}

.bt-searchtwo{background-color: #0074e1;
color: white;}

.bt-searchthree{background-color: #0074e1;
color: white;}

.search-formc{display:flex;
justify-content: center;
align-items: center;
margin-top: 15px;
margin-bottom: 15px;
width: 94%;
border: 1px solid #adadad;
border-radius: 29px;
margin-left: 3%;
margin-right: 3%;
padding-top: 10px;
padding-bottom: 10px;}

.first-search-one{width:41%;
    display: flex;
    align-items: center;
    padding-left: 2%;
    
 }

 .lable-showf{color: #0074e1;
    font-family:open, sans-serif;
    font-size: 15px;
    font-weight: bold;
    display: flex;
}

.search-icon-s{margin-right: 4px;
letter-spacing: .5px;}

.input-search-boxh{border: none;
border-right:1px solid #8b8b8b82;
padding: 7px 15px 7px 5px;
font-family: 'Poppins';
width: 100%;
outline: none;
}

input:focus{outline: none;
border: none;
border-right:1px solid #8b8b8b82;

}

input::placeholder{font-size:16px;
letter-spacing: .5px;
margin-left: 2px;}

.second-search-two{width: 22%;
padding-left: 10px;
}

#btbudgetjs{    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;}

.second-searchborder{border-right:1px solid #8b8b8b82;}

.selectsearchtwo{
    border: none;
border-right: 16px solid transparent;
padding: 7px 15px 7px 5px;
font-family: 'Poppins';
width:100%;
outline: none;
padding-left: 10px;
}

select:focus{outline: none;
    border: none;
    border-right:16px solid transparent;
    
    }
    
    select::placeholder{font-size:16px;
    letter-spacing: .5px;
    margin-left: 2px;}
    
#search-submit{border: none;
outline: none;
background-color: #0074e1;
color: white;
font-family: 'poppins';
font-size: 17px;
padding: 10px 15px;
border: 1px solid #0b6bc4;
border-radius: 28px;
margin-left: 1%;
transition: all .3s ease-out;
background-position: right bottom;
cursor: pointer;
}

#search-submit:hover{
    background-position: left bottom;
    background: linear-gradient(to right, #fff 50%, #0074e1 50%);
    background-size: 200% 100%;
    color:#0074e1;
}

.submit-searchicon{
margin-right: 3px;
font-size: 15px;
}

.input-checkbox{display: none;}

 .filter-heading{
        font-size: 14px;
    color: #606060;
    font-weight: 500;
    font-family: 'Poppins';
    letter-spacing: 0.6px;
    margin: 10px;
    margin-top: 20px;
    margin-left: 20px;
 }

 .label-checkbox{    font-size: 14px;
    color:#342c2c;
    font-family: 'Poppins';
    letter-spacing: 0.6px;
    margin: 10px;
    font-weight: 400;
    border: 1px solid #dbdbdb;
    cursor: pointer;
    display: inline-block;
    padding: 4px 15px;
    border-radius: 25px;
    margin-top: 0px;
    margin-right: 0px;
}

.input-checkbox:checked + .label-checkbox {background-color: #0074e140;
font-weight: bold;
color: #161616;}

.search-section-div{    margin-top: 20px;
    padding-left: 24px;}

.heading-ad{margin-top: 20px;
margin-bottom: 30px;
}

.first-heading-ad{display:flex;}

.first-heading-ad h4{
          font-family: 'Poppins';
    font-weight: normal;
    font-size: 14px;
    margin-left: 21px;
    letter-spacing: .7px;
    background-color: #0074e1;
    color: white;
    padding: 6px 10px;
    border-radius: 17px;
    display: flex;
    align-items: center;
}

.white{color: white;}

.down-arrowex{    display: flex;
    align-items: center;
    margin-left: 5px;}

.input-selecting-main{padding-left:.7%;
padding-right: 3%;
display: flex;
width: 94%;}

.input-section-down{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-left: 15px;
}

.input-checkbox-downad{cursor: pointer;
}

.lable-dadvance{    font-family: 'poppins';
    font-size: 13px;
    letter-spacing: .5px;
margin-left: 5px;
margin-top: 1px;
cursor: pointer;}

.second-heading-ad{display: none;
transition: all .3s;}

.budget-dropdown{    position: absolute;
    height: fit-content;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    background-color: #fff;
    top: 100%;
    bottom: 0px;
    border-radius: 8px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    width: 100%;
    left: 0px;
    right: 0px;
    margin-left: 0px;
    margin-top: -10px;
    transition: all .5s;
    visibility: hidden;
    opacity: 0; }

    .price-range{width: 100%;
    display: flex;
    padding:2% 5% 4% 5%;
    position: relative;
    }

    input[type='range']{
        width: 100%;
        appearance: none; 
        background-color:#EBECF0;
        height: 4px;
        cursor: pointer;
    }

.input-bgdiv{position: absolute;
width: 100%;
height: 4px;
background-color: #0073e1;}
 
/* end search section here */

/* start recomended project section here */
.project-recommended{
    width: 100%;
    background:transparent;
    background-image: linear-gradient(180deg,#F2F8FE 0%,#FAFCFF 100%);
    padding-bottom: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.heading-section-reco{padding-left: 5%;
padding-right: 5%;
width: 60%;}

.heading-section-reco h2{font-family:open,sans-serif;
    font-weight: bold;
    color: #01111B;
    letter-spacing: 1px;
    font-size: 27px;
    line-height: 30px;
    text-align: center;
    margin-top: 40px;
    margin-bottom: 10px;
    }


.heading-section-reco p{    color: #5c727d;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5em;
font-family: 'Roboto';
letter-spacing: .5px;
text-align: center;
}

.category-recom{display: flex;
width: 80%;
border:none;
margin-top: 15px;
margin-bottom: 30px;
justify-content: center;
display: none;}

.copy-category-div{
    font-family:open,sans-serif;
    letter-spacing: .5px;
    font-size: 15px; 
    font-weight: bold;
    background-color:#cfe6ff73;
    border-radius: 5px;
    color: #222;
    padding: 13px 24px;
    margin-left: 5px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.first-category-tip{color: #0d7ae3;
margin-left: 0px;}

.category-span{margin-right: 3px;
    font-family:open,sans-serif;
    letter-spacing: .5px;
    margin-top: 4px;
    font-size: 15px; }

.svg-cate{fill: #0d7ae3;
width: 17px;
height: 17px;}

.svg-colorbc{fill: #222;}

.project-details-h{width: 90%;
display: flex;
flex-wrap: wrap;
 /* align-items: center;  */
justify-content: center;
}

.copy-project-detailsh{width: 32%;
    box-shadow: 0 10px 31px 0 rgba(7, 152, 255, 0.09);
        margin-top: 30px;
        padding:10px 5px;
        border-radius: 5px;
    }

.img-project-section{position: relative;
    overflow: hidden;
width: 100%;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
text-align: left;
}

.img-project-section img{width: 100%;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    transition: all .4s;
}

.img-project-section img:hover{transform: scale(1.1);}

.top-project-show{position: absolute;
top: 15px;
display: flex;
width: 100%;
}

.bottom-project-show{position: absolute;
    bottom: 15px;
    display: flex;
    width: 100%;}

.top-project-show-one{width: 50%;}

.span-top-project{
    background-color: rgb(105 193 125 / 85%);
    color: #fff;
    font-family: open,sans-serif;
    font-size: 11px;
    padding: 5px 10px;
    border-radius: 2px;
    margin-left: 10%;
  }

  .top-project-show-two{width: 100%;
display:flex;
justify-content: end;
}

.span-top-project1{    background-color: rgb(105 193 125 / 85%);
    color: #fff;
    font-family: open,sans-serif;
    font-size: 11px;
    padding: 5px 10px;
    border-radius: 2px;
    margin-right:5%;
background-color: rgba(0, 115, 225, 0.85);
text-transform: capitalize;
}

.span-top-projectb{
    color: #fff;
    font-family: open,sans-serif;
    font-size: 15px;
    border-radius: 2px;
    padding:5px 5px 5px 5px;
}

.top-project-show-onebn{  color: #fff;
    font-family:'Poppins';
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 2px;
    margin-right:5%;
font-weight:500;
letter-spacing: .5px;
width: 100%;
}

.top-project-show-twob{width:50%;
    display:flex;
    justify-content: end;
}

.onepdsffsd{display:flex;
}

.description-sectionp{width: 100%;
    padding-left: 5%;
    padding-right: 2%;
    text-align: left;
}

.description-h2{font-family: 'Roboto',sans-serif;
font-size: 20px;
line-height: 25px;
text-transform: capitalize;
}

.description-h2 a{text-decoration: none;
color: #222;
display: block;
margin-top: 15px;
transition: all .2s;
}

.description-h2 a:hover{color: #0074e1;
}

.a-price-r{text-decoration: none;
    color: #0074e1;
    display: block;
    margin-top: 8px;
    transition: all .2s;
    font-family: 'Roboto',sans-serif;
    font-size: 18px;
    line-height: 20px;
    font-weight: bold;
}

.p-pricepara{font-family: 'Roboto';
font-size: 13px;
color: #878787;
margin-top: 10px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}

.five-section-in{
    display: flex;
    font-family: 'Poppins';
    letter-spacing: .5px;
    margin-top: 10px;
}

.two-paragraph-s{display:flex;
align-items: center;
font-size: 13px;
font-weight: 500;
color: #5c727d;
font-family: 'poppins';
}

.icon-project{display: flex;
margin-right: 4px;}

.svg-cated{fill:#5c727d;}

.two-paragraph-sm{margin-left: 10px;}

.read-big{ font-family: 'Poppins';
font-size: 15px;
font-weight: 400;
margin-top: 8px;
letter-spacing: .5px; 
color: #5c727d;
}

.load-more{width: 100%;
display: flex;
align-items: center;
justify-content: center;
margin-top: 25px;
display:none;
}

.load-more a{text-decoration: none;
    color: white;
    background-color: #0073e1;
    font-family: 'Roboto';
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .5px;
    padding: 10px 25px;
    border-radius: 4px;
    transition: all .3s ease-out;
background-position: right bottom;
}

.load-more a:hover{
    background-position: left bottom;
    background: linear-gradient(to right, white 50%, #0073e1 50%);
    background-size: 200% 100%;
    color:#0073e1;
    border:1px solid #0073e1;
}

/* end recomended project section here */


/* start recommended project for rent */
.slider-for-rent{width: 90%;}
/* end recommended project for rent */


/* some extra code for after the designing complete start here **** */

.main_project_recommended{
    /* display: flex; */
    background-image: linear-gradient(180deg,#F2F8FE 0%,#FAFCFF 100%);
}

.side_banner{
    width: 100%;
    background-color: transparent;
    top: 0px;
    position: sticky;
    height: 100%;
}

.side_banner_main{
    width: 25%;
    margin-left: 1%;
    background-color: transparent;
    top: 0px;
    position: sticky;
    height: 100%;
}

.side_banner img{
    width: 100%;
    margin-top:5px;
}

.project_recommended_sale{
    width: 75%;
}
/* some extra code for after the designing complete end here**** */


@media (max-width:900px){

    .main_project_recommended{
        flex-direction: column;
    }

    .side_banner{
        width: 98%;
        margin-left: 1%;
        
    }

    .banner{
        height: 500px;
    }

    h1{
        font-size: 36px;
        line-height: 45px;
        width:96%;
    }

    .text-banner h2{
        width: 96%;
    }


    /* start search section css here *** */

    .searchbox-dii{
        width: 94%;
    }

    .first-search-one{
        padding-left: 0px;
        width: 52%;
    }

    .second-search-two{display:none;}

    #search-submit{
        margin-left: 2%;
    }

    /* end search section css here *** */


/* start Properties Recommended *** */

.heading-section-reco{width: 96%;}

.heading-section-reco h2{
    font-size: 23px;
}

.category-recom{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

/* 
.category-recom::-webkit-scrollbar {
    display: none;
} */

.copy-category-div{
    margin-top: 10px;
}

.copy-project-detailsh{width: 100%;}

/* end Properties Recommended *** */


.project_recommended_o12s_main{
    flex-direction: column;
}

.project_recommended_sale{
    width: 100%;
}

.side_banner_main{
    width: 98%;
    margin-left: 1%;
    margin-right: 1%;
}



    
}