{% extends "base.html" %}

{% set styles = ('error-404',) %}

{% block bodyclass %}error{% endblock %}
{% block title %}{{ page_title(_('Not Found')) }}{% endblock %}

{% block content %}

<section id="content">
  <div class="wrap">
  <section id="content-main" class="full" role="main">
    <h1>Not Found</h1>
    <div id="beastainer">
      <img id="beast404le" src="{{ MEDIA_URL }}img/beast-404_LE.png" alt="">
      <img id="beast404re" src="{{ MEDIA_URL }}img/beast-404_RE.png" alt="">
      <img class="beast 404" src="{{ MEDIA_URL }}img/beast-404.png" alt="">
    </div>
    <p>We're sorry, we couldn't find what you were looking for.</p>
    <p>You can try a search or start over on the <a href="{{ url('home') }}">home page</a>.</p>
    <p>If you were following a documentation link, you can sign in and create the page. Otherwise, please <a href="https://bugzilla.mozilla.org/form.doc" rel="nofollow">file a bug</a>. Thanks!</p>

    <form class="browserid" action="{{url('users.browserid_verify') }}" method="POST">
        <input id="next" name="next" type="hidden" value="{{ next_url }}"/>
        {{ browserid_form }}

        <p class="clear">
          <a href="#" class="persona-button persona-login login-link" data-next="{{ next_url }}" data-service="Persona">
            <span class="persona-icon"><i aria-hidden="true"></i></span>
            <span class="signin">{{ _('Sign in with Persona') }}</span>
          </a>

          {% if waffle.flag('oauth_login') %}
            <a href="#" class="github-button login-link" data-next="{{ next_url }}" data-service="GitHub">
                <span class="github-icon"><i class="icon-github" aria-hidden="true"></i></span>
                <span class="signin">{{ _('Sign in with GitHub') }}</span>
              </a>
          {% endif %}
        </p>

    </form>

    <p class="attrib"><small><a href="http://theoatmeal.com/comics/state_web_summer#tumblr" rel="nofollow">Tumbeasts</a> by Matthew Inman of <a href="http://theoatmeal.com" rel="nofollow">The Oatmeal</a></small></p>
  </section>
</div>
</section>

{% endblock %}

{% block site_js %}
    {{ super() }}
    {{ js('framebuster') }}
{% endblock %}

{% block js %}
<script type="text/javascript">
mdn.analytics.trackError('404: ' + window.location);
</script>
{% endblock %}