<div class="container center-layout" data-role="content">
  <div class="row action-title">
    <div class="col-md-offset-3 col-md-3">
      <h3>Login</h3>
    </div>
    <div class="col-md-3">
      <span class="pull-right title-side-text"> or <a href="/register" id="btn-signup">create a new account</a></span>
    </div>
  </div>
  <div class="row">
    <div class="col-md-offset-3 col-md-6 col-xs-12">
      <div class="relative-helper input-container">
        <input type="text" class="form-control" placeholder="User name or Email" name="username" value="{{username}}" />
      </div>
      <div class="relative-helper input-container">
        <input type="password" class="form-control" placeholder="Password" name="password" />
      </div>
      <div class="relative-helper input-container">
        <span class="vertical-center-helper">
        <input  id="remember" type="checkbox" name="remember"/>
        <label  for="remember">
          Remember me
        </label>
        </span>
        <button id="btn-signin" class="btn btn-primary right-float-helper ladda-button" data-spinner-color="#008cba"><span class="ladda-label">Sign In</span></button>
      </div>
      <div class="relative-helper input-container">
        <span><a href="/reset-password">Forgot your password?</a></span>
      </div>
    </div>
  </div>
</div>