.areas .golden_bg { background: #CFBEAC; }
.areas .breadcrumb_img { margin-right: 70px; }
.areas .breadcurmb_wrapper { padding: 96px 15px;}
.area_list li.active {
    color: var(--golden);
}
.suburb-search-form {
    position: relative;
    max-width:452px;z-index: 1;
    margin: 20px 0 10px;
}
.suburb-search-form input[type="search"] {
    margin: 0;
    width: 507px;
    max-width: 100%;
    padding-right: 60px;
    height:44px;
    padding: 20px 85px 20px 20px;
    font-size: 13px;
    border: 0px solid var(--blue-color);
    border-radius: 50px;
    font-weight: 600;
    color: #000;
}

.suburb-search-form button {
    position: absolute;
    top: 0;
    right: 0;
    background:var(--dark-blue);
    border: 0px solid transparent;
    width: 80px;
    height: 44px;
    font-size: 12px;
    border-radius:  50px;
    bottom: 0;
    margin: auto 0;
    color: var(--white);
    font-weight: 600;
    letter-spacing: 1px;
}
.suburb-search-form button:hover{background: var(--golden);}
.ctent_wrap .btnlist { margin-top: 30px;}
/*.areapg .hm_keyfactor { padding: 0;}*/
.area_list { margin-bottom: 35px;}
.area_list li { width: 33.3%; float: left; flex: 0 0 33.3%;}
.dlist li:not(:last-child) { margin-bottom: 15px;}
.area_listing p { margin-bottom: 30px;}
.area_map { height: 450px; margin-bottom: 45px;}

.area_detail .ctent_wrap {
    text-align: left;
    max-width: 100%;
}
.area_detail  .flex-row-reverse .ctent_block { padding-left: 0; padding-right: 100px;}
.area_detail .center_ctent {
    max-width: 100%;
    margin: 0 0px 0 auto;
}
.area_detail .pl_100 { padding-left: 65px; }
.area_detail .vertical_wrap { left: 0;}
.area_detail .flex-container:not(:first-child) { margin-top: 80px; }

.step_list{ margin-top: 50px; }
.step_box { display: flex;}
.step_no { width: 60px; color: #1A4263; font-size: 16px; letter-spacing: 0.2px; margin-top: -6px;}
.step_desc { width: calc(100% - 60px); padding-left: 65px; position: relative; padding-bottom: 28px;}
.step_desc:after { position: absolute; content: ""; background: url(../images/half-cricle-shape.png); width: 19px; height: 14px; left: 12px; top: 0; }
.step_desc:before {position: absolute; content: ""; background: #D9C9B2; width: 1px; height: 100%; left: 20px; top: 0; }
.step_list li:last-child .step_desc:before { content: none;}
.step_list li:last-child .step_desc { padding-bottom: 0;}
.ask_question { padding: 80px 0 0; margin: 80px 0 0; border-top: 1px solid #D9C9B2;}

.page-template-areas .areapg .area_listing{margin:90px 0 20px;}


.suburb-search-form .ui-autocomplete {
    border-radius: 10px 10px 0 0;
    box-shadow: 0px 4px 10px rgb(0 0 0 / 10%);
}
#suburb-search-popup-content{padding: 30px;}

.areapg .content_bottom {padding: 80px 0;}


/* ====================== */

@media (max-width: 1599.98px) {

}

@media (max-width: 1439.98px) {
  
   
}

@media (max-width: 1199.98px) {
    .areas .breadcurmb_wrapper{padding: 50px 15px;}
    .ask_question {padding: 30px 0 0;margin: 30px 0 0;}
    .area_detail .flex-row-reverse .ctent_block {
        padding-right: 90px;
    }
    .page-template-areas .areapg .area_listing{margin:40px 0 10px;}
    .areapg .content_bottom {padding: 40px 0;}
}
@media (max-width: 991.98px) {
    .area_list li{width: 50%;flex: 0 0 50%;}
    .area_map{height: 350px;}
    .dlist li:not(:last-child) {margin-bottom: 10px;}
    .area_detail .pl_100 {
        padding-left: 0;
    }
    .area_detail .flex-row-reverse .ctent_block { padding-right : 0}
    .area_detail .flex-container:not(:first-child) {
        margin-top: 70px;
    }
}

@media (max-width: 767.98px) {
    .area_list li{width: 100%;flex: 0 0 100%;}
    .area_detail .flex-container:not(:first-child) {margin-top: 60px;}
    #suburb-search-popup-content {padding: 15px;}
}

@media (max-width: 575.98px) {
    .suburb-search-form{max-width: 100%;width: 100%;}
    .suburb-search-form input[type="search"]{width: 100%;}
    .area_detail .flex-container:not(:first-child) {
        margin-top: 40px;
    }

    .step_desc { width: 100%; padding-left: 40px;}
    .step_no { width: 100%; margin-bottom: 5px;}
    .step_box { flex-wrap: wrap;}
    .step_list li { margin-bottom: 15px;}
}