<!DOCTYPE html>
<html lang="en">
  <head>
    <meta name="CCBot" content="nofollow" />
    <meta name="robots" content="noai, noimageai" />
    <meta name="tdm-reservation" content="1" />
    <link rel="stylesheet" href="style.css" />

    <meta charset="UTF-8" />
    <meta
      name="description"
      content="Mirror, look at oneself. A directory. Here are links to files that nnwhen holds dear"
    />
    <meta
      name="keywords"
      content="Soundtrack, Music Syncing, Movie Music, nnwhen, Sound Design, Sound Designer, blog"
    />
    <meta name="author" content="nnwhen" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <meta
      name="viewport"
      content="height=device-height, width=device-width, initial-scale=1"
    />
    <link
      rel="icon"
      href="res/asset-sitewide-favicon.png"
      type="image/icon type"
    />
    <title>NN//Mirror</title>

    <meta property="og:title" content="nnwhen's link directory" />
    <meta
      property="og:description"
      content="Where content important to nnwhen can be found"
    />
    <meta
      property="og:image"
      content="https://www.nnwhen.com/res/img-offsite-preview.jpg"
    />
    <meta property="og:url" content="https://www.nnwhen.com/" />
    <meta property="og:locale" content="en_US" />

    <meta name="twitter:title" content="nnwhen's link directory" />
    <meta
      name="twitter:description"
      content="Where content important to nnwhen can be found"
    />
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@nnwhen_" />
    <meta name="twitter:creator" content="@nnwhen_" />
    <meta
      name="twitter:image"
      content="https://www.nnwhen.com/res/img-offsite-preview.jpg"
    />
    <meta
      name="twitter:image:alt"
      content="A dithered Peach and Maroon image of flowers superimposed ontop of a skyline photo"
    />
  </head>
  <body>
    <a class="skip-to-content" href="#main">Skip to main content</a>

    <header>
      <div role="img" aria-label="nnwhen logo and banner" id="header-img-group">
        <picture id="header-img-group-banner">
          <source
            srcset="res/asset-sitewide-header-banner.avif"
            type="image/avif"
          />
          <source
            srcset="res/asset-sitewide-header-banner.webp"
            type="image/webp"
          />
          <img src="res/asset-sitewide-header-banner.png" alt="" />
        </picture>
        <a aria-label="Return to the Homepage" tabindex="-1" href="index.html">
          <picture id="header-img-group-logo">
            <source
              srcset="res/asset-sitewide-header-ennspace.avif"
              type="image/avif"
            />
            <source
              srcset="res/asset-sitewide-header-ennspace.webp"
              type="image/webp"
            />
            <img
              src="res/asset-sitewide-header-ennspace.png"
              alt="Return to the Homepage"
            />
          </picture>
        </a>
      </div>
    </header>

    <nav id="navigation">
      <ul>
        <li>
          <a aria-label="Go Back to Homepage" href="index.html">home</a>
        </li>
        <li id="music">
          <a aria-label="Listen to my music" href="sound-design.html">music</a>
        </li>
        <div aria-hidden="true" id="whitespace"></div>
        <li id="parent">
          <a
            aria-label="My archive of Art, Poetry and Other-Media"
            href="archive.html"
            >archive</a
          >
        </li>
        <li>
          <a aria-label="Go to my Blog" href="blog/index.html">blog</a>
        </li>
      </ul>
    </nav>

    <aside id="socials">
      <a
        href="https://www.soundcloud.com/nnwhen"
        target="_blank"
        title="Soundcloud"
      >
        <img src="res/asset-sitewide-nav-soundcloud.svg" alt="" />
      </a>

      <a href="https://nnwhen.bandcamp.com/" target="_blank" title="Bandcamp">
        <img src="res/asset-sitewide-nav-bandcamp.svg" alt="" />
      </a>

      <a
        href="&#109;&#097;&#105;&#108;&#116;&#111;:&#099;&#111;&#110;&#116;&#097;&#099;&#116;&#064;&#110;&#110;&#119;&#104;&#101;&#110;&#046;&#099;&#111;&#109;"
        title="&#069;&#109;&#097;&#105;&#108;&#032;&#077;&#101;"
      >
        <img src="res/asset-sitewide-nav-mail.svg" alt="" />
      </a>

      <a href="socials.html" target="_blank" title="Other Socials">
        <img src="res/asset-sitewide-nav-at.svg" alt="" />
      </a>

      <a href="feed.xml" target="_blank" title="RSS Feed">
        <img src="res/asset-sitewide-nav-rss.svg" alt="" />
      </a>
    </aside>

    <h1
      style="
        width: min(90%, 600px);
        margin: 15px auto;
        font-family: 'mono', monospace;
      "
    >
      The Mirror
    </h1>
    <main id="main">
      <section class="ly-mirror">
        <picture>
          <source srcset="res/img-mirror-openaccess.avif" type="image/avif" />
          <source srcset="res/img-mirror-openaccess.webp" type="image/webp" />
          <img
            src="res/img-mirror-openaccess.jpg"
            alt="An image of a face refracted through water. It is split diagonally, the two images are almost identical. The one has an overlain audio spectrum with red text, the other is just the image."
          />
        </picture>
        <section class="mirror-info">
          <header>
            <h1>Open Access</h1>
            <h2>Instrumental and Stems</h2>
          </header>
          <p>
            Resources from
            <a
              href="https://nnwhen.bandcamp.com/track/open-access"
              target="_blank"
              >my release: "Open Access"</a
            >
          </p>
          <ol>
            <h3>Downloads</h3>
            <li>
              <a
                href="mirror/mus-OA/01 - Open Access [Instrumental].flac"
                target="_blank"
                >"Open Access" - Instrumental</a
              >
            </li>
            <li>
              <a href="mirror/mus-OA/Open Access Stems.zip" target="_blank"
                >"Open Access" - Stems</a
              >
            </li>
            <li>
              <a href="mirror/mus-OA/Open Access Imagery.zip" target="_blank"
                >"Open Access" - Imagery</a
              >
            </li>
          </ol>
        </section>
      </section>

      <section class="ly-mirror">
        <picture>
          <source srcset="res/img-mirror-samples.avif" type="image/avif" />
          <source srcset="res/img-mirror-samples.webp" type="image/webp" />
          <img
            src="res/img-mirror-samples.jpg"
            alt="An profile image of a person rendered in the 3d program blender with chinese characters surrounding it."
          />
        </picture>
        <section class="mirror-info">
          <header>
            <h1>Samples</h1>
            <h2>nnwhen's samples</h2>
          </header>
          <p>From my many music making journeys</p>
          <ol>
            <h3>Downloads</h3>
            <li>
              <a href="mirror/samples/When's Body 01.zip" target="_blank"
                >"When's Body 01" - nnwhen Samples</a
              >
            </li>
            <li>
              <a href="mirror/samples/When's Pure Radio 01.zip" target="_blank"
                >"When's Pure Radio" - Radio Samples</a
              >
            </li>
            <li>
              <a
                href="mirror/samples/when's voices 01.vitalbank"
                target="_blank"
                >"When's Voices" - Vital Preset Bank</a
              >
            </li>
          </ol>
        </section>
      </section>
    </main>

    <footer id="free">
      <a href="our-siblings.html"
        >&#x46;&#x72;&#x65;&#x65;&#x20;&#x4F;&#x75;&#x72;&#x20;&#x50;&#x65;&#x6F;&#x70;&#x6C;&#x65;</a
      >
    </footer>
  </body>
</html>