diff --git a/error_camp_zine_sample/index.html b/error_camp_zine_sample/index.html
new file mode 100644
index 0000000..586933f
--- /dev/null
+++ b/error_camp_zine_sample/index.html
@@ -0,0 +1,162 @@
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <!-- Generated with distribusi https://git.vvvvvvaria.org/varia/distribusi -->
+    <meta name="generator" content="distribusi" />
+    <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
+    <style>
+      .image{max-width: 100%;}
+      .pdf object{width:640px;height: 640px;}
+      .dir::before{content:"📁 ";font-size:18px;}
+      .filename{display:block;font-family:mono;}
+      .unkown-file::before{content:"📄 ";font-size:18px;}
+      div{max-width: 640px;display:inline-block;vertical-align:top;margin:1em;padding:1em;}
+      video {width:640px;max-height:640px;}
+      :root {   
+	--color-gray: #858585; 
+	--color-whiteish: #fffff4; 
+	--color-pink: #F557FF;
+	--color-yellow: #ffff45;
+	--color-green: #099;
+	--color-blue: #4a67cf;
+	--color-orange: #f96163;
+	font-size: 14.6px;
+	 line-height: 16px;	
+}
+@font-face {
+	  font-family: "Snap" ;
+	  src: url(font/Snap-itmono-1.6-Regular.otf);
+}
+
+body{
+	background-color: var(--color-whiteish);
+	margin-top: calc(6px + 1em);
+	font-family: "Snap" ;
+	color: var(--color-blue);
+}
+body > a {
+	position: fixed;
+	top: 0;
+	left: 0;
+	color: var(--color-whiteish);
+	background-color: var(--color-orange);
+	width: 100%;
+	padding: 3px 10px;
+}
+.filename {
+	visibility: hidden;
+}
+h1{
+	font-size: 5rem;
+	line-height: 4.5rem;
+	margin: 2rem 0rem 4rem 0rem;
+	text-shadow: 0.05em 0.05em 0.05em var(--color-orange);
+} 
+div{
+	max-width: 520px;
+	float: left;
+	margin: 1rem;
+	padding: 0;
+}
+.html{
+	margin:0 3em;
+}
+li {
+	list-style: none;
+}
+.pdf object{
+	width: 400px;
+	height: 400px;
+}
+div#folder{
+	float:left;
+	margin-right:2em;
+}
+.plain,
+.unkown-file{
+	float:right;
+	clear:right;
+}
+img, audio {
+	box-shadow: 0.2em 0.2em 0.5em var(--color-green);
+}
+figcaption,
+.filename{
+	font-size:small;
+	color: var(--color-green);
+	margin:1em;
+	word-break: break-word;
+	text-transform: uppercase;
+}
+a{
+	font-family: "Snap" ;
+        word-break: break-word;
+	color: var(--color-blue);
+}
+a:visited {
+	color: var(--color-blue);
+}
+blockquote{
+	margin:3em 0;
+	padding:0;
+	font-style:italic;
+}
+
+    </style>
+  </head>
+  <body>
+<div id="folder" class="dir"><a href='images'>images/</a></div>
+<div id="folder" class="dir"><a href='font'>font/</a></div>
+<div id="folder" class="dir"><a href='audio'>audio/</a></div>
+<div id="" class="octet-stream"><a href='.DS_Store'>.DS_Store</a><span class="filename">.DS_Store</span></div>
+<div id="distribusi" class="plain unkown-file"><a href='distribusi.sh'>distribusi.sh</a></div>
+<div id="index" class="x-asm unkown-file"><a href='index.css'>index.css</a></div>
+<div id="intro" class="plain unkown-file"><a href='intro.md'>intro.md</a></div>
+<div id="intro" class="html"><section id="intro.md.html"><!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
+<head>
+  <meta charset="utf-8" />
+  <meta name="generator" content="pandoc" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
+  <title>intro</title>
+  <style type="text/css">
+      code{white-space: pre-wrap;}
+      span.smallcaps{font-variant: small-caps;}
+      span.underline{text-decoration: underline;}
+      div.column{display: inline-block; vertical-align: top; width: 50%;}
+  </style>
+  <!--[if lt IE 9]>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
+  <![endif]-->
+</head>
+<body>
+<h1 id="error">‘er·ror’</h1>
+<ul>
+<li>: the quality or state of erring;</li>
+<li>: a deficiency or imperfection in structure or function;</li>
+<li>: the amount of deviation from a standard or specification;</li>
+<li>: mix-up;</li>
+</ul>
+<blockquote>
+<p>..about the ritual..</p>
+<ul>
+<li>◌ …</li>
+<li>● …</li>
+<li>◦ …</li>
+<li>● …</li>
+<li>○ …</li>
+<li>◦ …</li>
+<li>● …</li>
+</ul>
+</blockquote>
+<p><strong>Colophon</strong></p>
+<p>Zine generation facilitated by Lucy Cheesman and Joana Chicau @ Error Camp 2020</p>
+<p><em>with the help of…</em> <a href="https://git.vvvvvvaria.org/varia/distribusi">distribusi.sh</a> &amp;amp <a href="https://pandoc.org/demos.html">md2html.sh using pandoc</a> &amp;amp <a href="https://usemodify.com/fonts/snap-it/">snap font by Morgane Bartoli and Corentin Moussard</a></p>
+</body>
+</html>
+</section></div>
+<div id="md2html" class="plain unkown-file"><a href='md2html.sh'>md2html.sh</a></div>
+
+  </body>
+</html>
