{{#with data.areaStats}}
<div class="bs4--container main-container">
    <div class="bs4--row">
        <div class="bs4--col-12 ph-20">
            <h3 class="border-bottom-grey">{{areaName}} Residential Market Stats</h3>
            {{#if timePeriodStartDateTime.monthDayYear}}
            <p id="{{@root/dom/pTimePeriod}}">
                Week of {{timePeriodStartDateTime.monthDayYear}}
            </p>
            {{/if}}
        </div>
        <ul class="bs4--col-12 list-unstyled mb-15 ph-20 ">

            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">New Listings (last 4 weeks)</span>
                <span class="pull-right">{{newListings.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Homes for Sale</span>
                <span class="pull-right">{{homesForSale.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Condos for Sale</span>
                <span class="pull-right">{{homesForSaleCondo.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Detached for Sale</span>
                <span class="pull-right">{{homesForSaleDetached.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Townhouse for Sale</span>
                <span class="pull-right">{{homesForSaleTownhouse.commas}}</span>
            </li>

            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Median List Price</span>
                <span class="pull-right">{{medianListPrice.dollars}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Median Sales Price</span>
                <span class="pull-right">{{medianSalesPrice.dollars}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Median Sales Price Change</span>
                <span class="pull-right">{{medianSalesPriceChange.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Price Changes</span>
                <span class="pull-right">{{priceChanges.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Months of Inventory</span>
                <span class="pull-right">{{monthsInventory.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix ">
                <span class="text-grey pull-left">Contracts</span>
                <span class="pull-right">{{contracts.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Sales</span>
                <span class="pull-right">{{sales.commas}}</span>
            </li>
            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Sales Change</span>
                <span class="pull-right">{{salesChange.commas}}</span>
            </li>

            <li class="border-bottom-grey clearfix">
                <span class="text-grey pull-left">Average Days on Market</span>
                <span class="pull-right">{{daysOnMarket.commas}}</span>
            </li>
        </ul>
        <div class="bs4--col-12 ph-20 text-grey">
            <p> In {{areaName}} there are currently {{homesForSale.commas}} homes for sale, of those {{homesForSaleCondo.commas}} are condos, {{homesForSaleDetached.commas}} are detached homes, and  {{homesForSaleTownhouse.commas}} are townhomes.
                The median list price is {{medianListPrice.dollars}} and the median sales price is {{#if medianSalesPrice}}{{medianSalesPrice.dollars}}{{else}}-{{/if}}. There have been {{newListings.commas}} new listings in the last 4 weeks and  {{sales.commas}} sales. </p>
        </div>
    </div>
</div>
{{/with}}