web/wp-content/themes/mozilla-builders/templates/pages/404.twig

{% extends "layouts/base.twig" %}

{% block pageBody %}

<div class="flex flex-col flex-1 justify-center my-6 md:my-24">
  <div class="max-md:flex max-md:flex-col max-md:gap-4 max-md:px-grid-site-margin md:grid md:grid-site py-site centered-page">
    {% if options.error_page_image.id %}
    <div class="md:col-start-5 md:col-span-6 max-md:w-1/2 max-md:self-center">
      {% include "components/lazy-img.twig" with { img: get_image(options.error_page_image.id) } %}
    </div>
    {% endif %}
    <div class="md:col-start-13 md:col-span-10 md:flex md:flex-col md:justify-center">
      <h1 class="type-sans-2xl">{{ options.error_page_title ?: '404 Not Found' }}</h1>
      {% if options.error_page_content %}
        <div class="prose mt-3">
          {{ options.error_page_content }}
        </div>
      {% endif %}
    </div>
  </div>
</div>

{% endblock %}