_pages/estimator.html
---
title: Estimate Your Benefits
---
{% include head.html %}
<script src="{{site.baseurl}}/javascripts/estimator.js"></script>
<body class="no-js layout-estimator">
<a class="a-skip-to-main" href="#main">Skip to main content</a>
{% include site-header.html %}
<main role="main" id="main">
<div class="wrapper">
<h1>Estimate your benefits</h1>
<div id="estimator-form">
<form id="claim" name="claim">
<h1>Around what date would you like to <strong>start</strong> receiving benefits?</h1>
<p>Most people receive six weeks’ worth of benefits. You may want to select a start date on or around the date of a medical procedure, your delivery date, or the date you plan to take leave from work. </p>
<div class="field field-date">
<label>
<span class="label-text">Start date</span>
<input type="date" name="claim_start_date" id="start_date" value="">
</label>
</div>
<div id="earnings">
<h1>Assuming you file your claim 18 days before then, enter your earnings for the year prior to that, <strong><time id="start_date_formatted"></time> through <time id="end_date_formatted"></time>.</strong></h1>
<div class="field field-number">
<label>
<span class="label-text">Annual salary during your base period</span>
<input type="number" name="claim_annual_salary" id="annual_salary" max="1000000">
</label>
</div>
<button id="submit">Calculate</button>
</div>
</form>
</div>
<div id="estimator-results">
<h1>Your estimated weekly benefit is <strong>$<span id="estimated_benefit"></span>.</strong></h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
<a href="{{site.baseurl}}/estimator/" class="button">Start over</a>
<a href="{{site.baseurl}}/claims/new/" class="button">File a claim</a>
</div>
<aside class="secondary-content">
{% include estimator-aside.html %}
</aside>
</div>
</main>
{% include site-footer.html %}
</body>