index.html

---
layout: default
section_id: home
slides:
  - bg: images/header2.jpg
    class: animate-in
    title:
      text: Hank helps<br>medical coders
      animation: bottom-to-top
      class: medium-7 medium-offset-1
    buttons:
      animation: bottom-to-top slow
      class: medium-11 medium-offset-1
      items:
        - text: DOWNLOAD HANK
          url: signup.html
    infos:
      - text: "With Hank you'll code faster and more accurately, saving time and making more money."

---




<div class='advanced mod modDefaultSlider' >
  <div class='sequence mainseq' data-autostop='on' data-timeout='0' >
    <ul class='sequence-canvas'>
      {% for slide in page.slides %}

        <li class='frame {{class}}' >
          <div class='bg mainslide' style='background-image: url({{slide.bg}});background-position: top left;'></div>
          <div class='title {{slide.title.animation}}' style='color: rgb(255, 255, 255);'>
            <div class='row'>
              <div class='{{slide.title.class}} columns'>
                <div class='mytitle'>{{slide.title.text}}</div>
                <div class='btnspacing spacing'></div>
                {% for info in slide.infos %}
                <div class="header-text">{{info.text}}</div>
                {% endfor %}
              </div>
            </div>
          </div>

          <div class='buttons-wrapper {{slide.buttons.animation}}' style=''>
            <div class='row'>
              <div class='{{slide.buttons.class}} columns'>
                <div class='btnspacing spacing'></div>
                {% for button in slide.buttons.items %}
                  <a class='button mybtn signupbtn'>{{button.text}}</a>
                {% endfor %}
              </div>
            </div>
          </div>
        </li>
      {% endfor %}
    </ul>
  </div>
</div>

<div class="full fadein"  id="helphank" style='overflow: hidden; margin-top: -30px; margin-left: -25px;'>
  <div class="row max-width-1000px" style="margin-top: 0px;">
    <div class="small-12 columns">
      <h1 class="main-title"><span style="color:#f9b052;">Grow</span> With Hank</h1>
      <div class="box wfpic" style="width: 100%; text-align: left;">
        <img class="" src="images/hank-workflow.jpg" style="margin: auto;">
      </div>
    </div>
  </div>
  <div class="row max-width-1000px" style="margin-top: -60px;">
    <div class="small-4 columns">
      <div class="wftitle" align='center'>
        Coders
      </div>
      <p class="main-text">
        teach Hank</p>
    </div>
    <div class="small-5 columns">
      <div class="wftitle" align='center'>
        Hank
      </div>
      <p class="main-text">
        learns <b>really</b> fast</p>
    </div>
    <div class="small-3 columns">
      <div class="wftitle" align='center'>
        Together
      </div>
      <p class="main-text">
        we <span style="color:#f9b052;"><b>grow</b></span></p>
    </div>
  </div>

</div>




<div class="bg divider" style="background-image: url('images/cloud-bottom.png');background-position: bottom center;background-size: cover;overflow: hidden;"></div>
<div class="full alternate-row" id="productivity">
  <div class="row max-width-1000px">
    <div class="small-6 columns">
      <div class="spacing"></div>
 <h1 class="main-title"><span style="color:#595ad4;">Increase</span> Your Productivity</h1>

      <p class="main-text">
        Code faster and get more done with Hank.</p>
      <div class="spacing"></div>

    </div>
    <div class="small-6 columns">
      <div class="box secpic" style="width: 500px; text-align: left;">
        <img class="fadeinright" src="images/purplse-laptop.png" style="margin: auto;">
      </div>
    </div>
  </div>
</div>
<div class="bg divider" style="background-image: url('images/curve-bottom.png');background-position: top center;background-size: cover;overflow: hidden;"></div>

<div class="full"  id="accuracy" style='overflow: hidden;'>
  <div class="row max-width-1000px">
    <div class="small-6 columns">
      <div class="box secpic" style="width: 500px; text-align: left;">
        <img class="fadeinleft" src="images/computer-accuracy.png" >
      </div>
    </div>
    <div class="small-6 columns">
      <div class="two spacing"></div>
     <h1 class="main-title"><span style="color:#00cc6f;">Improve</span> Your Accuracy</h1>

      <p class="main-text">
        Code more accurately with Hank.</p>
    </div>
    <div class="four spacing"></div>
  </div>

</div>

<div class="bg divider" style="background-image: url('images/curve-bottom2.png');background-position: top center;background-size: cover;overflow: hidden;"></div>




<div class="full alternate-row" id="bottomline">
  <div class="row max-width-1000px">
    <div class="small-6 columns">
      <div class="spacing"></div>
 <h1 class="main-title"><span style="color:#d8124b;">Make</span> More Money</h1>

      <p class="main-text">
        Make More Money Today & Tomorrow With Hank.</p>
      <div class="spacing"></div>

    </div>
    <div class="small-6 columns">
      <div class="box secpic" style="width: 500px; text-align: left;">
        <img class="fadeinright" src="images/money-graph.png" style="margin: auto;">
      </div>
    </div>
  </div>
</div>
<div class="bg divider" style="background-image: url('images/cloud-bottom3.png');background-position: bottom center;background-size: cover;overflow: hidden;"></div>

<div class="full" id="fairshare" style="background-image: url('images/rocket.jpg');background-position: bottom left;background-size: cover;overflow: hidden;">
  <div class="box" style='width: 100%; min-height: 50px; background: #18cbfb; color: #18cbfb; margin-top: -110px'>x</div>
  <div class="row max-width-1000px">
    <div class="small-1 columns"><p></p></div>
    <div class="small-10 columns">
      <div class="spacing"></div>
      <div class="box" style="text-align: center; width: 100%; ">
       <h1 class="main-title"><span style="color:#fff;">Get Your Fair Share</span></h1>

      <p class="main-text" style="color:#fff !important;">
        Profit Sharing Options Available.</p>

      <div class='btnspacing spacing'></div>
      <div class='btnspacing spacing'></div>
      <div class="box" style="text-align: center; width: 100%; ">

        <a class="button mybtn signupbtn">Download Hank</a>
      </div>
      </div>
    <div class="small-1 columns"><p></p></div>
    </div>

  </div>

</div>