wyd/index.html

<!DOCTYPE html>
<!-- <html class="no-js" lang="en"> -->
<html lang="en" data-theme="light">
  <head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="scaffolded-by" content="https://github.com/dart-lang/sdk" />
<link rel="icon" type="image/png" href="/images/favicon.ico" />
<link rel="stylesheet" href="/styles/styles.css" />

<meta property="og:title" content="Fœderatio Internationalis Juventutem | juventutem.org">
<meta property="og:description" content="Juventutem is an international Catholic movement for the sanctification of young people through the Roman traditions of the Church.">
<meta property="og:image" content="https://www.juventutem.org/images/logo.png">
<meta property="og:url" content="https://www.juventutem.org/">
<script defer src="/main.dart.js"></script>
<link
  rel="stylesheet"
  href="https://bulma.io/vendor/fontawesome-free-6.5.2-web/css/all.min.css"
/>

<link
  rel="stylesheet"
  href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
/> 
<meta
  name="description"
  content="A historic listing of World Youth Day reports which Juventutem groups attended from around the world."
/>
<style>
    h3,h4,h5 {
      margin-bottom: 1rem;
    }
    p {
      margin-bottom: 1.8rem;
    }
    h1, h2 {
      font-size: 1.8rem;
    }
    h3, h4, h5 {
      color: var(--bulma-title-color);
      font-size: 1.5rem;
      font-weight: 600;
      line-height: var(--bulma-title-line-height);
    }
  </style>     <title>World Youth Day Reports | juventutem.org</title>
    
  </head>

  <body>
<nav
  class="navbar is-fixed-top"
  role="navigation"
  aria-label="main navigation"
  style="z-index: 5"
>
  <div class="navbar-brand">
    <a class="navbar-item" style="height: 70px" href="/">
      <img
        src="/images/logo.png"
        width="50px"
        height="60px"
        style="max-height: unset"
      />
      <span class="title is-5 ml-2 has-text-primary">Juventutem</span>
    </a>

    <a
      role="button"
      class="navbar-burger"
      aria-label="menu"
      aria-expanded="false"
      data-target="navbarBasicExample"
    >
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
    </a>
  </div>

  <div id="navbarBasicExample" class="navbar-menu">
    <div class="navbar-start">
      <div class="navbar-item has-dropdown is-hoverable">
        <a class="navbar-link" href="/about/"> About </a>
        <div class="navbar-dropdown">
          <!-- <hr class="navbar-divider" /> -->
          <a class="navbar-item" href="/about/"> About Juventutem </a>
          <a class="navbar-item" href="/commitments/"> The Commitments </a>
          <a class="navbar-item" href="/approvals/"> The Approvals </a>
        </div>
      </div>

      <a class="navbar-item" href="/chapters/"> Chapters </a>
      <a class="navbar-item" href="/affiliate/"> Affiliate </a>
      <div class="navbar-item has-dropdown is-hoverable">
        <a class="navbar-link" href="/books/"> Resources </a>
        <div class="navbar-dropdown">
          <!-- <hr class="navbar-divider" /> -->
          <a
            class="navbar-item"
            href="https://assets.ctfassets.net/8e6y7fam3t8b/tKr4IVC8jJzqXvSlg5cRZ/a7c602e07b55d98a2985d7a69be40b20/2008-02-19-Charte-EN.-revised.pdf"
          >
            Charter
          </a>
          <a class="navbar-item" href="/books/"> Books </a>
          <!-- TODO -->
          <a class="navbar-item" href="/videos/"> Videos </a>
          <a class="navbar-item" href="/wyd/"> WYD Reports </a>
        </div>
      </div>
    </div>
    <style>
      #facebook:hover {
        color: #476bfc !important;
      }
      #instagram:hover {
        color: #9f1184 !important;
      }
      #twitter-x:hover {
        color: #000000 !important;
      }
    </style>
    <div class="navbar-end">
      <div class="navbar-item">
        <div
          class="is-flex is-flex-direction-row is-justify-content-flex-start"
        >
          <!--  -->
          <a
            title="Follow on X"
            href="https://x.com/FIJuventutem?t=MFXkDYXfOWohaRfGes-seA&s=09"
            class="m-1"
          >
            <i id="twitter-x" class="fa-brands fa-x-twitter has-text-primary title is-3"></i>
          </a>
          <!--  -->
          <a
            title="Follow on Instagram"
            href="https://www.instagram.com/fijuventutem?igsh=MXM0cWRtenc2NzZn"
            class="m-1"
          >
            <i id="instagram" class="fa-brands fa-instagram has-text-primary title is-3"></i>
          </a>
          <!--  -->

          <a
            title="Follow on Facebook"
            href="https://www.facebook.com/fijuventutem"
            class="m-1"
          >
            <i id="facebook" class="fa-brands fa-facebook has-text-primary title is-3"></i>
          </a>
          <!--  -->
          <!-- <a
            title="Follow on Youtube"
            href="https://www.youtube.com/channel/UCAx7fXOY34ZzYuY_tTrhLnA"
            class="m-2"
          >
            <i class="fa-brands fa-youtube has-text-primary title is-4"></i>
          </a> -->
        </div>
      </div>
      <div class="navbar-item">
        <a class="button is-info" href="/contact/">
          <strong>Contact</strong>
        </a>
      </div>
    </div>
  </div>
</nav>
<!-- Social card -->
<section
  class="has-background-light is-fullwidth p-2"
  style="height: 70px"
></section>    
    <section class="section" style="min-height: 500px;">
      <div class="columns">
        <div
          class="column is-offset-0-mobile is-12-mobile is-offset-2-desktop is-8-desktop dart-function-blinder"
 data-function="get(pages,
id:48lJS39s1gVLq22GCMHYGe)"        >
          <h1 class="title">*|title|*</h1>
 *|content|*         </div>
      </div>
    </section>
<footer class="footer">
  <div class="container">
    <div class="columns is-vcentered">
      <div class="column is-narrow">
        <figure class="image is-64x64">
          <img src="/images/logo.png" alt="Company Logo" />
        </figure>
      </div>
      <div class="column">
        <p>
          <strong>Fœderatio Internationalis Juventutem</strong> - © 2024 All Rights Reserved. 
          <br />
          juventutem.org | Email: secretary@juventutem.org | <i style="font-size: 0.75rem;"> build.r.1.0-2024.10.5.14.38 </i>
        </p>
      </div>
    </div>
  </div>
</footer>
<script>
  document.addEventListener("DOMContentLoaded", () => {
    // Get all "navbar-burger" elements
    const $navbarBurgers = Array.prototype.slice.call(
      document.querySelectorAll(".navbar-burger"),
      0
    );

    // Add a click event on each of them
    $navbarBurgers.forEach((el) => {
      el.addEventListener("click", () => {
        // Get the target from the "data-target" attribute
        const target = el.dataset.target;
        const $target = document.getElementById(target);

        // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
        el.classList.toggle("is-active");
        $target.classList.toggle("is-active");
      });
    });
  });
</script>
<!-- Contentful Client -->
<script
  src="https://cdn.jsdelivr.net/npm/contentful@latest/dist/contentful.browser.min.js"
  charset="utf-8"
></script>

<script>
  var exports = {}; // quick fix because 'exports' is not defined in rich-text bundle below
</script>
<!-- Rich Text Library -->
<script
  src="https://cdn.jsdelivr.net/npm/@contentful/rich-text-html-renderer@12.0.0/dist/rich-text-html-renderer.es5.min.js"
  charset="utf-8"
></script>
<script
  src="https://cdn.jsdelivr.net/npm/@contentful/rich-text-types@16.8.3/dist/blocks.min.js"
  charset="utf-8"
></script>
<script
  src="https://cdn.jsdelivr.net/npm/@contentful/rich-text-types@16.8.3/dist/inlines.min.js"
  charset="utf-8"
></script>  </body>
</html>