<!DOCTYPE html>
<html>

<head>
  <title>wkflw</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

  <link rel="stylesheet" type="text/css" href="css/styles.css">

  <!-- Matomo -->
  <script type="text/javascript">
    var _paq = window._paq || [];
    /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
    _paq.push(['trackPageView']);
    _paq.push(['enableLinkTracking']);
    (function() {
      var u = "//analytics.suroh.tk/";
      _paq.push(['setTrackerUrl', u + 'matomo.php']);
      _paq.push(['setSiteId', '1']);
      var d = document,
        g = d.createElement('script'),
        s = d.getElementsByTagName('script')[0];
      g.type = 'text/javascript';
      g.async = true;
      g.defer = true;
      g.src = u + 'matomo.js';
      s.parentNode.insertBefore(g, s);
    })();
  </script>
  <!-- End Matomo Code -->
</head>

<body>

  <header>
    <h1>max<br>franklin</h1>
  </header>

  <nav>
    <ul>
      <li style="color: #FF670F;">wrk : </li>
      <a href="#" id="audioButton">
        <li>audio</li>
      </a>
      <a href="#" id="otherButton">
        <li>other</li>
      </a>
      <a href="https://git.suroh.tk/" target="_blank">
        <li>code</li>
      </a>
    </ul>
  </nav>

  <section class="work" id="audioSection">
    <h1>AUDIO</h1>

    <ul>
      <a href="work/soloWork.html">
        <li id="soloWork" style="background:url('assets/audio/solo/thumb-_DSC5654.jpg');">
          <h3>Solo</h3>
          <p>Solo improvised performance practice employing custom open source software instruments and saxophone.</p>
        </li>
      </a>
      <a href="work/postoastWork.html">
        <li id="postoastWork" style="background: url('assets/audio/postoast/thumb-pgxpublaunch.jpg');">
          <h3>POST TOAST</h3>
          <p>Electronic duo currently playing a live meld of improvised electronica, techno, hip-hop neo-classical music and down-tempo dystopian futurism.</p>
        </li>
      </a>
    </ul>
  </section>

  <section class="work" id="otherSection">
    <h1>OTHER</h1>

    <ul>
      <a href="work/fragileMasteryWork.html">
        <li id="fragileMasteryWork" style="background:url('assets/other/fragileMastery/thumb-gradInstallation.jpg');">
          <h3>Fragile Mastery</h3>
          <p>Research on improvisation, open source software and their combined ability to question our attributions of value and mastery.</p>
        </li>
      </a>
      <a href="work/euclidWork.html">
        <li id="euclidWork" style="background:url('assets/other/tetra/thumb-tetra2.jpg');">
          <h3>EUCLID</h3>
          <p>Interactive improvisationa "article" for Tetra Gama Circulaire #3. Collaboration between DePlayer and the Experimental Publishing Master.</p>
        </li>
      </a>
      <a href="work/autonomousArchiveWork.html">
        <li id="autonomousArchiveWork" style="background:url('assets/other/autonomousArchive/buildingLightbox.jpg');">
          <h3>Autonomous Archive</h3>
          <p>Collaborative project to build an activated archive of a 30 year old living community in Rotterdam.</p>
        </li>
      </a>
      <a href="work/chagrinWork.html">
        <li id="chagrinWork" style="background:url('assets/other/chagrin/thumb-chagrin1.jpg');">
          <h3>Adelaìˆde</h3>
          <p>Reactive music video made during a 24hr music video challenge. Music by Requin Chagrin.</p>
        </li>
      </a>
    </ul>
  </section>

  <script type="text/javascript" src="js/menu.js"></script>
</body>

</html>