<style type="text/css">
.agreement_text{
  text-align:justify;
  font-size:11px;
  line-height:15px; 
  width:1100px;
  height:500px;
  padding:2px;
  overflow:scroll;
  border:1px solid black;
}
@media print {
  .agreement_text {
    height:auto;
    overflow:visible;
    width:auto;
  }
}
</style>

<div class="xactions top">
  <a href="#" onclick="window.print(); return false;"><img src="<%-req.jshsite.publicurl%>images/icon_print.png" alt="Print" title="Print" />Print</a>
</div>

<div class="step1"><!-- step1 container -->
<script type="text/javascript" src="/js/agreement.form.js"></script>
<script type="text/javascript">
<%=req.jshsite.instance%>.App.Agreement = new jsHarmonyAgreement(<%=req.jshsite.instance%>);
<%=req.jshsite.instance%>.App.Agreement.Init();
</script>
<div class="agreement_text">
<%-cms_agreement%>
</div>

<table style="padding-left:9px;margin-top:20px;" cellpadding="2">
  <tr><td colspan="2" style="padding-bottom:10px;"><label><input autocomplete="off" type="checkbox" name="a_accept" class="a_accept"> (E-signature) I accept the terms of this agreement, and verify that the information below is correct.</label> </td></tr>
  <tr><td style="width:200px;">Today's Date:</td><td><input autocomplete="off" type="text" name="a_date" class="a_date" style="width:100px;" maxlength="10" readonly="readonly" /></td></tr>
  <tr><td>Signed Name:</td><td><input autocomplete="off" type="text" name="a_name" class="a_name" style="width:230px;" maxlength="72" /></td></tr>
  <tr><td>Date of Birth:</td><td><input autocomplete="off" type="text" name="a_dob" class="a_dob" style="width:100px;" maxlength="10" /> (MM/DD/YYYY)</td></tr>
</table>

<a href="#"  onclick="<%=req.jshsite.instance%>.App.Agreement.step1_submit(); return false;" style="display:inline-block;background-color:#426cc2;color:#fff;padding:7px 25px;margin-top:15px;margin-left:220px;">Continue -></a>
<div class="clear" style="margin-top:20px;"></div>

</div><!-- step1 container -->