## -*- coding: utf-8 -*-

<%inherit file="base.html"/>
<%page args="strings, rtl=False, lang='en', imgstr=0, captcha_challenge=0, **kwargs"/>

<div class="container-narrow"
     id="captchaSubmissionContainer"
     style="width: 90%; align: center; margin: auto;">
  <div class="container-fluid"
       style="width: 100%; align: center; padding: 5%">
    <div class="box" style="padding: 5% 15% 5% 15%;">
      <p style="align: center;">
        <img width="400" height="125"
             alt="${_(strings.CAPTCHA[0])}"
             src="${imgstr}" />
      </p>

    <div class="box"
         style="align: center; width: 50% margin: auto;">
      <div class="container-fluid"
           style="width: 98%; align: center; padding: 1%;">
        <form class="bs-component"
              id="captchaSubmission"
              action=""
              method="POST">
          <fieldset>
            <div class="form-group">
                 <!--style="width: 100%; align: center;">-->
              <div class="input-group" style="height: 60%;">
                <input type="hidden"
                       form="captchaSubmission"
                       name="captcha_challenge_field"
                       id="captcha_challenge_field"
                       value="${challenge_field}"></input>
                <input class="form-control"
                       form="captchaSubmission"
                       name="captcha_response_field"
                       id="captcha_response_field"
                       value=""
                       autocomplete="off"
                       type="text"
                       placeholder="${_(strings.CAPTCHA[1])}"
                       accesskey="t" autofocus ></input>
                <span class="input-group-btn">
                  <button class="btn btn-primary"
                          form="captchaSubmission"
                          type="submit"
                          name="submit"
                          value="submit"
                          accesskey="s">
                    <i class="icon-level-down icon-rotate-90"></i>
                  </button>
                </span>
              </div>
            </div>
          </fieldset>
        </form>
      </div>
    </div>
    </div>
  </div>
</div>
<hr />
