.filter_brach_area_frame { margin: 15px 0 0 5%; }
.branches_filter { width: 100%; font-weight: bold; background-color: #ffffff;
padding: 8px 10px;
border: 1px solid #d0d0d0; }
.map_container { clear: both; max-width: 100%; overflow: hidden; border: 1px solid #e0e0e0; display: flex;}
#map { height: 500px; width: 65%; order: 2; }
#branches_list { width: 32%; height: 500px; overflow: hidden; order: 1; margin-right: 3%;}

.branches_filter-search{ width: 100%; border: 1px solid #e0e0e0; background-color:#ffffff; padding: 6px 4px; border-bottom: none; box-sizing: border-box; }

.branch_item { padding: 15px 5%; border-bottom: 1px solid #e0e0e0; transition: all 0.2s ease; display: flex;}
.branch_item:hover { background: #f0f0f0; cursor: pointer; }
.branch_item a { color: rgb(110, 110, 110);  }
.branch_item .first-line {  }
.branch_item .branchCity { font-weight: bold; }
.branch_item:last-child { margin-bottom: 80px; }

.select_branch_radio{ margin-right: 15px; }
#branch_delivery_description_in{ padding: 10px 20px; background: #f0f0f0; }

#branches_list_items { overflow: scroll; margin-top: 20px; height: 100%; }

.branch_distict { padding: 15px 5%; margin-bottom: 10px; border-bottom: 1px solid #e0e0e0; font-weight: bold; color:#00a500;}

#btn_close, #btn_confirm_branch{ padding: 10px 30px; border: 1px solid #f0f0f0; background: none; cursor: pointer; letter-spacing: 1px;}
#btn_close { background: #909090; color: #ffffff; }
#btn_confirm_branch { background: #de230f; color: #ffffff; font-weight: bold; width: 50%; letter-spacing: 2px; }

@media only screen and (max-width: 480px) {
  .map_container { display: block; }
  #map { width: 100%; }
  #branches_list { width: 100%; }
}