html
<style>
  body {
    background-color: #ff0000;
    font-family: "Bloopers Sans", Arial, sans-serif;
  }

  .bloopers-container {
    margin: 0 auto;
    width: 800px;
    background-color: #000000;
    border: 4px solid #ffffff;
  }

  .bloopers-content {
    margin: 20px;
  }

  .bloopers-header {
    color: #ffffff;
    background-color: #000000;
    padding: 10px;
    border: 4px solid #000000;
    border-bottom: 4px solid #000000;
  }

  .bloopers-header a {
    color: #ffffff;
  }

  .bloopers-subheader {
    color: #ff0000;
    font-size: 18px;
    font-weight: bold;
  }

  .bloopers-subheader a {
    color: #ff0000;
  }

  .bloopers-list {
    list-style: none;
  }

  .bloopers-item {
    padding: 10px;
    margin: 10px;
    background-color: #333333;
    border: 4px solid #000000;
    border-bottom: 4px solid #000000;
    border-radius: 10px;
  }

  .bloopers-item a {
    color: #ffffff;
  }

  .bloopers-footer {
    background-color: #000000;
    padding: 10px;
    border: 4px solid #000000;
  }

  @media only screen and (max-width: 800px) {
    .bloopers-container {
      width: 95%;
      padding: 10px;
    }
  }
</style>

<div class="bloopers-container">
  <div class="bloopers-header">
    <h1>Bloopers</h1>
  </div>
  <div class="bloopers-subheader">
    <a href="/assets/BrilliantBloopers/FeaturedBloopers/RandomBloopers/">Random Bloopers</a>
  </div>
  <div class="bloopers-content">
    <ol class="bloopers-list">
      <li class="bloopers-item">
        <a href="/assets/BrilliantBloopers/FeaturedBloopers/RandomBloopers/bloopers-of-the-week/">
          <h2>Bloopers of the Week</h2>
        </a>
      </li>
      <li class="bloopers-item">
        <a href="/assets/BrilliantBloopers/FeaturedBloopers/RandomBloopers/bloopers-of-the-month/">
          <h2>Bloopers of the Month</h2>
        </a>
      </li>
      <li class="bloopers-item">
        <a href="/assets/BrilliantBloopers/FeaturedBloopers/RandomBloopers/random-bloopers-101/">
          <h2>Random Bloopers 101</h2>
        </a>
      </li>
    </ol>
  </div>
  <div class="bloopers-footer">
    <p>&copy; 2023 Bloopers Inc.</p>
  </div>
</div>