diff --git a/.gitignore b/.gitignore
index 07ef72e..652af52 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,6 +6,7 @@ dist
 .DS_Store
 *.sublime-project
 *.sublime-workspace
+*.code-workspace
 assets
 vendor
 
diff --git a/engine/ThemeEngine.php b/engine/ThemeEngine.php
index 08d7d5b..93809f1 100644
--- a/engine/ThemeEngine.php
+++ b/engine/ThemeEngine.php
@@ -7,132 +7,151 @@ class ThemeEngine
     public $data = [];
     public $loader;
     public $twig;
+
     public function __construct(string $themePath, string $themeAssetPath)
     {
         $var = [];
         $this->themePath = $themePath;
         $this->themeAssetPath = $themeAssetPath;
-        $path = explode("/", $themeAssetPath);
+        $path = explode('/', $themeAssetPath);
         $this->themeFolder = $path[4];
         $this->settings = json_decode(
-            file_get_contents("./data/settings.json"),
+            file_get_contents('./data/settings.json'),
             true
         );
-        $this->posts = json_decode(file_get_contents("./data/posts.json"), true);
+        $this->posts = json_decode(file_get_contents('./data/posts.json'), true);
         $this->archives = json_decode(
-            file_get_contents("./data/archives.json"),
+            file_get_contents('./data/archives.json'),
             true
         );
         $this->loader = new \Twig\Loader\FilesystemLoader(
-            $themePath . "/" . $path[4]
+            $themePath.'/'.$path[4]
         );
         $this->twig = new \Twig\Environment($this->loader, []);
-        $this->router($_SERVER["REQUEST_URI"]);
+        $this->router($_SERVER['REQUEST_URI']);
     }
 
     public function router(string $request)
     {
         $pageInfo = [
-          "keywords" => $this->settings["keywords"],
-          "description" => $this->settings["description"],
-          "image" => $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
+          'keywords' => $this->settings['keywords'],
+          'description' => $this->settings['description'],
+          'image' => $this->themeAssetPath.'/assets/images/global/default-bg.jpg',
         ];
 
-        $featureList = explode(",", $this->posts["feature"]);
-        $fileList = explode(",", $this->posts["files"]);
+        $featureList = explode(',', $this->posts['feature']);
+        $fileList = explode(',', $this->posts['files']);
 
         $images = [];
         $files = [];
         foreach ($featureList as $file) {
             $item = trim($file);
             $ext = pathinfo($item, PATHINFO_EXTENSION);
-            if ($item != null || $item != "") {
-                array_push($images, ["file" => $item, "type" => trim($ext)]);
+            if ($item != null || $item != '') {
+                array_push($images, ['file' => $item, 'type' => trim($ext)]);
             }
         }
 
         foreach ($fileList as $file) {
             $item = trim($file);
             $ext = pathinfo($item, PATHINFO_EXTENSION);
-            if ($item != null || $item != "") {
-                array_push($files, ["file" => $item, "type" => trim($ext)]);
+            if ($item != null || $item != '') {
+                array_push($files, ['file' => $item, 'type' => trim($ext)]);
             }
         }
 
-        $menu = $this->settings["menu"];
+        $menu = $this->settings['menu'];
         switch ($request) {
-            case "/":
-                $recent = $this->posts["recent_posts"];
-                $featured = $this->posts["featured_posts"];
-                $template = "index.twig";
-                $content = $this->posts["index-content"];
+            case '/':
+                $recent = $this->posts['recent_posts'];
+                $featured = $this->posts['featured_posts'];
+                $template = 'index.twig';
+                $content = $this->posts['index-content'];
 
                 $pageOptions = [
-                "debug" => true, //for theme kit
-                "theme" => $this->themeFolder, //for theme kit
-                "title" => "This is Fipamo",
-                "dynamicRender" => $this->settings["dynamicRender"],
-                "background" =>
-                  $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
-                "recent" => $recent,
-                "featured" => $featured,
-                "info" => $pageInfo,
-                "menu" => $menu,
-                "content" => $content,
+                'debug' => true, // for theme kit
+                'theme' => $this->themeFolder, // for theme kit
+                'title' => 'This is Fipamo',
+                'dynamicRender' => $this->settings['dynamicRender'],
+                'background' => $this->themeAssetPath.'/assets/images/global/default-bg.jpg',
+                'recent' => $recent,
+                'featured' => $featured,
+                'info' => $pageInfo,
+                'menu' => $menu,
+                'content' => $content,
+                'media' => $images,
+                'files' => $files,
                 ];
                 break;
-            case "/page":
-                $content = $this->posts["content"];
-                $meta = $this->posts["meta"];
-                $template = $request . ".twig";
+            case '/page':
+                $content = $this->posts['content'];
+                $meta = $this->posts['meta'];
+                $template = $request.'.twig';
                 $pageOptions = [
-                "debug" => true, //for theme kit
-                "theme" => $this->themeFolder, //for theme kit
-                "title" => "Page Title",
-                "dynamicRender" => $this->settings["dynamicRender"],
-                "background" =>
-                  $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
-                "content" => $content,
-                "meta" => $meta,
-                "info" => $pageInfo,
-                "menu" => $menu,
-                "media" => $images,
-                "files" => $files,
+                'debug' => true, // for theme kit
+                'theme' => $this->themeFolder, // for theme kit
+                'title' => 'Page Title',
+                'dynamicRender' => $this->settings['dynamicRender'],
+                'background' => $this->themeAssetPath.'/assets/images/global/default-bg.jpg',
+                'content' => $content,
+                'meta' => $meta,
+                'info' => $pageInfo,
+                'menu' => $menu,
+                'media' => $images,
+                'files' => $files,
                 ];
                 break;
-            case "/tags":
-                $tags = $this->settings["tag_list"];
-                $template = $this->themeFolder . "/tags.twig";
+            case '/tags':
+                $tags = $this->settings['tag_list'];
+                $template = 'tags.twig';
                 $pageOptions = [
-                "debug" => true, //for theme kit
-                "theme" => $this->themeFolder, //for theme kit
-                "title" => "Pages Tagged as Tag",
-                "dynamicRender" => $this->settings["dynamicRender"],
-                "background" =>
-                  $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
-                "tag_list" => $tags,
-                "info" => $pageInfo,
-                "menu" => $menu,
+                'debug' => true, // for theme kit
+                'theme' => $this->themeFolder, // for theme kit
+                'title' => 'Pages Tagged as Tag',
+                'dynamicRender' => $this->settings['dynamicRender'],
+                'background' => $this->themeAssetPath.'/assets/images/global/default-bg.jpg',
+                'tag_list' => $tags,
+                'info' => $pageInfo,
+                'menu' => $menu,
+                'media' => $images,
+                'files' => $files,
                 ];
                 break;
-            case "/archive":
+            case '/archive':
                 $archive = $this->archives;
-                $template = $this->themeFolder . "/archive.twig";
+                $template = 'archive.twig';
                 $pageOptions = [
-                "debug" => true, //for theme kit
-                "theme" => $this->themeFolder, //for theme kit
-                "title" => "Archive",
-                "dynamicRender" => $this->settings["dynamicRender"],
-                "background" =>
-                  $this->themeAssetPath . "/assets/images/global/default-bg.jpg",
-                "archives" => $archive,
-                "info" => $pageInfo,
-                "menu" => $menu,
+                'debug' => true, // for theme kit
+                'theme' => $this->themeFolder, // for theme kit
+                'title' => 'Archive',
+                'dynamicRender' => $this->settings['dynamicRender'],
+                'background' => $this->themeAssetPath.'/assets/images/global/default-bg.jpg',
+                'archives' => $archive['archives'],
+                'info' => $pageInfo,
+                'menu' => $menu,
+                'media' => $images,
+                'files' => $files,
                 ];
                 break;
             default:
-                http_response_code(404);
-                require __DIR__ . "/views/404.php";
+                set_error_handler(function ($errno, $errstr, $errfile, $errline) {
+                    // throw new \ErrorException($errstr, $errno, 0, $errfile, $errline);
+                    $error = $errstr;
+                });
+                $template = 'error.twig';
+                $pageOptions = [
+                'debug' => true, // for theme kit
+                'theme' => $this->themeFolder, // for theme kit
+                'title' => 'Uh oh',
+                'dynamicRender' => $this->settings['dynamicRender'],
+                'background' => $this->themeAssetPath.'/assets/images/global/default-bg.jpg',
+                'info' => $pageInfo,
+                'content' => "Uh Oh, so there's a problem.",
+                'menu' => $menu,
+                'media' => $images,
+                'files' => $files,
+                ];
+
                 break;
         }
 
diff --git a/src/themes/theme-fipamo-default/fipamo-default/page.twig b/src/themes/theme-fipamo-default/fipamo-default/page.twig
index 36c9b07..e3f3d53 100644
--- a/src/themes/theme-fipamo-default/fipamo-default/page.twig
+++ b/src/themes/theme-fipamo-default/fipamo-default/page.twig
@@ -14,12 +14,36 @@
 			<div class="page">
 				<p>{{content | raw}}</p>
 				<div>
-					
+					<div class="page_files">
+						<div class="page_doc">
+						<strong>Files</strong><br/>
+							{% for doc in files %}
+								{% if doc.type != "mp3" %}
+									{% set path = doc.file|split('/') %}
+									<a href="{{doc.file}}">{{path[6]}}</a>
+								
+								{% endif %}
+							{% endfor %}
+						</div>
+						<div class="page_sounds">
+						<strong>Sounds</strong><br/>
+							{% for doc in files %}
+							{% if doc.type == "mp3" %}
+								<audio controls>
+									<source src="{{doc.file}}" type="audio/mpeg">
+									Your browser does not support the audio element.
+								</audio> 
+							{% endif %}
+							{% endfor %}
+						</div>
+						
+					</div>
+					<br/>
 					{{meta['who']}} dropped this {{ meta['when']  }}<br  />
 					<strong>tags: </strong>
 					{% for tag in meta['tags'] %}
 						{% if dynamicRender is defined %}
-							{% if dynamicRender == 'false'  %}
+							{% if dynamicRender == 'true'  %}
 								<a href="{{ "/tags/"~tag.slug }}">{{ tag.label }}</a>
 							{% else  %}
 								<a href="{{ "/tags/"~tag.slug~".html"  }}">{{ tag.label }}</a>
@@ -28,6 +52,7 @@
 							<a href="{{ "/tags/"~tag.slug~".html"  }}">{{ tag.label }}</a>
 						{% endif  %}
 					{% endfor %}
+					
 				</div>
 			</div>
 		</article>
diff --git a/src/themes/theme-fipamo-default/styles/_forms.sass b/src/themes/theme-fipamo-default/styles/_forms.sass
index f44833c..61b8083 100644
--- a/src/themes/theme-fipamo-default/styles/_forms.sass
+++ b/src/themes/theme-fipamo-default/styles/_forms.sass
@@ -2,7 +2,7 @@ form
     display: inline-block
     a
         color: $primary
-    p 
+    p
         background: $tertiary
         color: $primary
         padding: 5px
@@ -36,7 +36,7 @@ button, input[type=submit]
     cursor: pointer
     border: 0
     padding: 10px 0 5px 0
-    @include object_transitions(.3s)
+    transition: all 0.3s linear
 
 select
     font: 14px $baseType
@@ -63,5 +63,3 @@ select
 :-ms-input-placeholder
     font: 25px $baseType
     color: $white
-
-
diff --git a/src/themes/theme-fipamo-default/styles/_mixins.sass b/src/themes/theme-fipamo-default/styles/_mixins.sass
index b3af067..1fa1f68 100644
--- a/src/themes/theme-fipamo-default/styles/_mixins.sass
+++ b/src/themes/theme-fipamo-default/styles/_mixins.sass
@@ -1,16 +1,9 @@
 @mixin text-drop-shadow($rgb_value, $opacity, $offsetX, $offsetY, $blur)
 	text-shadow: $offsetX $offsetY $blur rgba($rgb_value, $opacity)
-  
-@mixin object-transitions($rate)
-	-moz-transition: all $rate linear
-	-webkit-transition: all $rate linear
-	-o-transition: all $rate linear
-	transition: all $rate linear
-	
 
 @mixin background-opacity($rgb_value, $opacity)
 	background: rgba($rgb_value, $opacity)
 
 @mixin custom-header($weight, $size, $line_height, $color)
 	font: $weight $size/$line_height $bodyTypeSans
-	color: $color
\ No newline at end of file
+	color: $color
diff --git a/src/themes/theme-fipamo-default/styles/_structure.sass b/src/themes/theme-fipamo-default/styles/_structure.sass
index 39cb781..75c4c1e 100644
--- a/src/themes/theme-fipamo-default/styles/_structure.sass
+++ b/src/themes/theme-fipamo-default/styles/_structure.sass
@@ -6,240 +6,245 @@ html
   overflow: hidden
   font: 400 1.2em/1.4em $baseType
 
-body
-  background: $white
-  margin: 0
-  padding: 0
-  perspective: 1px
-  transform-style: preserve-3d
-  height: 100%
-  width: 100%
-  overflow-y: scroll
-  overflow-x: hidden
+  body
+    background: $white
+    margin: 0
+    padding: 0
+    perspective: 1px
+    transform-style: preserve-3d
+    height: 100%
+    width: 100%
+    overflow-y: scroll
+    overflow-x: hidden
 
-a
-  color: $primary
-  text-decoration: none
-  border-bottom: 1px solid $highlight
-  //@include object-transitions(.2s)
-  &:hover
-    border-bottom: 1px solid $secondary
+    a
+      color: $primary
+      text-decoration: none
+      border-bottom: 1px solid $highlight
+      //@include object-transitions(.2s)
+      &:hover
+        border-bottom: 1px solid $secondary
 
-code
-  background: $black
-  color: $highlight
-  border-radius: 3px
-  padding: 3px
+    code
+      background: $black
+      color: $highlight
+      border-radius: 3px
+      padding: 3px
 
-pre
-  background: $black
-  color: $highlight
-  border-radius: 3px
-  padding: 3px
-code
-  color: $secondary
-  background: none
+    pre
+      background: $black
+      color: $highlight
+      border-radius: 3px
+      padding: 3px
+    code
+      color: $secondary
+      background: none
 
-svg.icons
-  width: 25px
-  fill: $white
+    svg.icons
+      width: 25px
+      fill: $white
 
-header
-  background: $primary
-  height: 90%
-  width: 100%
-  border-top: $white 3px solid
-  #media
-    width: 100%
-    height: 90%
-    position: absolute
-    .slide
-      @include object-transitions(.7s)
-      width: 100%
-      height: 100%
-      position: absolute
-    .hide
-      opacity: 0
-    .show
-      opacity: 1
-    video
+    header
+      background: $primary
+      height: 90%
       width: 100%
-      height: 100%
-      object-fit: cover
-  nav
-    width: 97%
-    margin: 10px auto
-    z-index: 1000
-    position: relative
-    color: $primary
-    .left,.right
-      width: 50%
-      display: inline-block
-      vertical-align: top
-    .left
-      a.logo-link
-        border-bottom: none
-        margin: 0 0 20px 0 
-        display: block
-        #logo
-          width: 50px
-          border-bottom: none
-    .right
-      text-align: right
-      a.menu-link
-        background: $secondary
-        margin-bottom: 4px
-        padding: 3px
-        border-radius: 2px
-        display: inline-block
-        font-size: 0.8em
-        border-bottom: none
-        &:hover
-          background: $secondary
-  
-
-
-.container
-  z-index: 2
-  background: $white
-  line-height: 30px
-  font-weight: lighter
-  width: 100%
-  //padding 40px
-  color: $black
-  article
-    position: relative
-    width: 80%
-    height: 80%
-    max-width: 840px
-    //min-height 500px
-    background: $white 
-    vertical-align: top
-    color: $black
-    margin: 0 auto
-    //.index, .page
-      //margin 30px
-    .index, .page
-      padding: 0 0 15px 0
-      img 
-        display: block
+      border-top: $white 3px solid
+      #media
         width: 100%
-      h1
+        height: 90%
+        position: absolute
+        .slide
+          transition: all 0.7s linear
+          width: 100%
+          height: 100%
+          position: absolute
+        .hide
+          opacity: 0
+        .show
+          opacity: 1
+        video
+          width: 100%
+          height: 100%
+          object-fit: cover
+      nav
+        width: 97%
+        margin: 10px auto
+        z-index: 1000
+        position: relative
         color: $primary
-      p
-        font: 300 1.25em/1.6em $baseType
-      //meta datea for page
-      .meta
-          font: 500 0.8em/1.3em $baseType
-          padding: 5px 0 0 0
-          border-top: 1px solid $primary
-          background: $white
-          a
-            font-size: 0.8em
-            font-weight: 400
-      //archive styling
-      .archive-item
-        padding: 15px 0 20px 0
-        span.year
-          font-size: 1.5em
-          font-weight: 500
-          padding: 5px
-          display: block
-          color: $primary
-        .archive-month
+        .left,.right
+          width: 50%
           display: inline-block
           vertical-align: top
-          width: 30%
-          padding: 5px
-          span.month
-            color: $secondary
-            font-size: 1.5em
-            font-weight: 300
-            padding: 5px
+        .left
+          a.logo-link
+            border-bottom: none
+            margin: 0 0 20px 0
             display: block
-  section
-    padding: 0 0 20px 0
-    background: $primary
-    a
-      color: $white
-    .index-lists, .page-title
-      max-width: 840px
-      span
-        font-size: 2em
-        color: $secondary
-        font-weight: 400
-      width: 80%
-      margin: 0 auto
-      padding: 20px 0 0 0
-      .recent, .featured
-        display: inline-block
-        width: 50%
+            #logo
+              width: 50px
+              border-bottom: none
+        .right
+          text-align: right
+          a.menu-link
+            background: $secondary
+            margin-bottom: 4px
+            padding: 3px
+            border-radius: 2px
+            display: inline-block
+            font-size: 0.8em
+            border-bottom: none
+            &:hover
+              background: $secondary
+
+    .container
+      z-index: 2
+      background: $white
+      line-height: 30px
+      font-weight: lighter
+      width: 100%
+      //padding 40px
+      color: $black
+      article
+        position: relative
+        width: 80%
+        height: 80%
+        max-width: 840px
+        //min-height 500px
+        background: $white
         vertical-align: top
-      label 
-        background: $black
-        color: $white
-        font-size: 1.5em
-        line-height: 1.3
-      
+        color: $black
+        margin: 0 auto
+        //.index, .page
+          //margin 30px
+        .index, .page
+          padding: 0 0 15px 0
+          img
+            display: block
+            width: 100%
+          h1, h2
+            color: $primary
+          p
+            font: 300 1.25em/1.6em $baseType
+          //meta datea for page
+          .page_files
+            .page_doc
+              a
+                background: $black
+                border-radius: 3px
+                color: $white
+                padding: 3px
+                margin: 0 5px 0 0
+          .meta
+            font: 500 0.8em/1.3em $baseType
+            padding: 5px 0 0 0
+            border-top: 1px solid $primary
+            background: $white
+            a
+              font-size: 0.8em
+              font-weight: 400
+          //archive styling
+          .archive-item
+            padding: 15px 0 20px 0
+            span.year
+              font-size: 1.5em
+              font-weight: 500
+              padding: 5px
+              display: block
+              color: $primary
+            .archive-month
+              display: inline-block
+              vertical-align: top
+              width: 30%
+              padding: 5px
+              span.month
+                color: $secondary
+                font-size: 1.5em
+                font-weight: 300
+                padding: 5px
+                display: block
+      section
+        padding: 0 0 20px 0
+        background: $primary
+        a
+          color: $white
+        .index-lists, .page-title
+          max-width: 840px
+          width: 80%
+          margin: 0 auto
+          padding: 20px 0 0 0
 
-    
-      
-footer 
-  background: $white
-  padding: 10px
-  color: $primary
-  font-size: 0.8em
-  font-weight: 600
-  height: 100px
-  .inner
-    margin: 20px auto
-    width: 80%
-    max-width: 840px
-    a
-      color: $secondary
-   
+          span
+            font-size: 2em
+            color: $secondary
+            font-weight: 400
+            width: 80%
+            margin: 0 auto
+            padding: 20px 0 0 0
+          .recent, .featured
+            display: inline-block
+            width: 50%
+            vertical-align: top
+          label
+            background: $black
+            color: $white
+            font-size: 1.5em
+            line-height: 1.3
 
-// RESPONSIVE
+    footer
+      background: $white
+      padding: 10px
+      color: $primary
+      font-size: 0.8em
+      font-weight: 600
+      height: 100px
+      .inner
+        margin: 20px auto
+        width: 80%
+        max-width: 840px
+        a
+          color: $secondary
 
-@media only screen and (max-width: 640px)
-header
-  nav
-      width: 98%
-  span
-    font-size: 2.5em
-  .container
-    article
-      .index, .page
-        .archive-item
-          .archive-month
-            width: 45%
+    // RESPONSIVE
 
-@media only screen and (max-width: 480px)
-header
-  nav
-      width: 96%
-  .container
-    article
-      .index, .page
-        margin: 0
-        p
-          font: 300 1em/1.6em $baseType
-    section 
-      .index-lists
-        .recent, .featured
-          width: 100% !important
+    @media only screen and (max-width: 640px)
+    header
+      nav
+        width: 98%
+      span
+        font-size: 2.5em
+      .container
+        article
+          .index, .page
+            .archive-item
+              .archive-month
+                width: 45%
 
+    @media only screen and (max-width: 480px)
+    header
+      nav
+        width: 96%
+      .container
+        article
+          .index, .page
+            margin: 0
+            p
+              font: 300 1em/1.6em $baseType
+        section
+          .index-lists
+            .recent, .featured
+              width: 100% !important
 
-@media only screen and (max-width: 375px)
-header
-  nav
-    width: 95%
-.container
-  article
-    .index, .page
-      margin: 0
-      p
-        font: 300 0.9em/1.7em $baseType
-      .archive-item
-        .archive-month
-          width: 95%
\ No newline at end of file
+    @media only screen and (max-width: 375px)
+    header
+      nav
+        width: 95%
+    .container
+      article
+        .index, .page
+          margin: 0
+          p
+            font: 300 0.9em/1.7em $baseType
+          .archive-item
+            .archive-month
+              width: 95%
diff --git a/src/themes/theme-fipamo-default/styles/_typography.sass b/src/themes/theme-fipamo-default/styles/_typography.sass
index 00a834a..1c2e8b6 100644
--- a/src/themes/theme-fipamo-default/styles/_typography.sass
+++ b/src/themes/theme-fipamo-default/styles/_typography.sass
@@ -4,7 +4,7 @@ $monoType: "Lucida Console", Monaco, monospace
 h1, h2, h3
     color: $white
 
-h1 
+h1
     font-size: 2em
     font-weight: 400
 
@@ -12,7 +12,6 @@ h2
     font-size: 1.75em
     font-weight: 400
 
-h3 
+h3
     font-size: 1.5em
     font-weight: 300
-