{{#with data}}
<div class="bs4--card clearfix bs4--mb-3 bs4--pb-3 bs4--row bs4--mx-0">
	<div class="bs4--col-12">
		<h2 class="headline-5 bs4--font-weight-normal bs4--my-0 bs4--py-2">All Listings in {{area.shortName}}</h2>
		<hr />
		<ul class="nav nav-tabs bs4--mb-1" role="tablist">
			<li class="active "><a class="paint-first-lighter-border-b-selectable" data-toggle="tab" href="#{{@root/dom/divPZListings}}"  role="tab" aria-controls="{{@root/dom/divPZListings}}" aria-selected="true">Listings</a></li>
			<li><a class="paint-first-lighter-border-b-selectable" data-toggle="tab" href="#{{@root/dom/divPZOpenHouses}}" id="{{@root/dom/aOpenHouseToggle}}"  aria-controls="{{@root/dom/divPZOpenHouses}}" aria-selected="false">Open Houses</a></li>

		</ul>
		<div class="tab-content clearfix">
			<div id="{{@root/dom/divPZListings}}" class="tab-pane fade in active bs4--col-12" role="tabpanel" aria-labelledby="{{@root/dom/aListingToggle}}">
				<div class="bs4--clearfix bs4--row">
					{{#each listings}}
					<div class="bs4--col-12 bs4--col-sm-6 bs4-py-0 bs4--px-1 list-pref-zip-pa-item  bs4--mb-1 bs4--h-100 bs4--w-100">
						<div class="list-pref-zip-pa-item-outer bs4--position-relative" data-placard-version="2">
							<div id="{{@root/dom/divListings}}_{{@index}}" class="full-width full-height list-pref-zip-pa-item-inner"  data-index="{{@index}}"></div>
						</div>
					</div>
					{{/each}}
				</div>
				<div class="text-center mt-10">
					<a href="{{@root/data/url}}" class="btn btn-primary btn-md ph-20  paint-first-background paint-base-font entity-details-pref-zips-view-more" id="{{@root/dom/aAllHomes}}"> View All Homes In {{area.shortName}}</a>
				</div>
			</div>
			<div id="{{@root/dom/divPZOpenHouses}}" class="tab-pane bs4--col-12 fade " role="tabpanel" aria-labelledby="">
				{{#if openHouses}}
				<div class="bs4--clearfix bs4--row">
					{{#each openHouses}}
					<div class="bs4--col-12 bs4--col-sm-6 bs4-py-0 bs4--px-1 list-pref-zip-pa-item  bs4--mb-1 bs4--h-100 bs4--w-100">
						<div class="list-pref-zip-pa-item-outer bs4--position-relative" data-placard-version="2">
							<div id="{{@root/dom/divOpenHouses}}_{{@index}}" class="full-width full-height list-pref-zip-pa-item-inner"  data-index="{{@index}}"></div>
						</div>
					</div>

					{{/each}}
				</div>
				<div class="bs4--text-center mt-10">
					<a href="{{@root/data/openHouseUrl}}" class="btn btn-primary btn-md ph-20  paint-first-background paint-base-font entity-details-pref-zips-view-more" id="{{@root/dom/aAllOpenHouses}}"> View All Open Houses In {{area.shortName}}</a>
				</div>
				{{else}}
				<p class="mh-15 text-center empty-list-message text-grey"><span>No Results Found </span><br>We couldn't find any open houses in {{area.shortName}}. </p>
				{{/if}}
			</div>
		</div>
	</div>
</div>
{{/with}}