Init Jekyll Theme

README.md

@@ -0,0 +1,5 @@
+## Theme: Feeling Responsive
+
+**Repository for Feeling Responsive Theme for Jekyll**
+
+Currently in development, but you can have a look at it at <http://phlow.github.io/feeling-responsive/>

_config.yml

@@ -0,0 +1,106 @@
+# ASCII-Font › http://patorjk.com/software/taag/#p=display&f=Slant&t=Phlow
+#
+#      _____ _ __          _____      __  __  _                 
+#     / ___/(_) /____     / ___/___  / /_/ /_(_)___  ____ ______
+#     \__ \/ / __/ _ \    \__ \/ _ \/ __/ __/ / __ \/ __ `/ ___/
+#    ___/ / / /_/  __/   ___/ /  __/ /_/ /_/ / / / / /_/ (__  ) 
+#   /____/_/\__/\___/   /____/\___/\__/\__/_/_/ /_/\__, /____/  
+#                                                 /____/        
+title: "Feeling Responsive"
+slogan: "A Responsive Theme for Jekyll"
+description: "Feeling Responsive is built on the fabulous Foundation Framework and comes with lots of features to show your content right."
+logo: "logo.png"
+baseurl: ""
+paginate: 5
+paginate_path: "blog/page:num"
+
+url: "http://localhost:4000"
+# - url: "http://phlow.github.io/feeling-responsive"
+
+
+
+# Header
+language: "en"
+# google_author: ""
+
+
+#       _   __            _             __  _           
+#      / | / /___ __   __(_)___ _____ _/ /_(_)___  ____ 
+#     /  |/ / __ `/ | / / / __ `/ __ `/ __/ / __ \/ __ \
+#    / /|  / /_/ /| |/ / / /_/ / /_/ / /_/ / /_/ / / / /
+#   /_/ |_/\__,_/ |___/_/\__, /\__,_/\__/_/\____/_/ /_/ 
+#                       /____/                          
+#
+#  Open _data/navigation.yml to adjust the left and right topbar navigation
+#
+
+
+
+#     _____ __________ 
+#    / ___// ____/ __ \
+#    \__ \/ __/ / / / /
+#   ___/ / /___/ /_/ / 
+#  /____/_____/\____/    Verify Website to Webmaster Tools
+
+google_author: "https://plus.google.com/u/0/118311555303973066167"
+google_site_verification:   ""
+# bing_webmastertools_id:   ""
+# alexa_verify_id:          ""
+
+
+
+#       ______            _                      
+#      / ____/___ __   __(_)________  ____  _____
+#     / /_  / __ `/ | / / / ___/ __ \/ __ \/ ___/
+#    / __/ / /_/ /| |/ / / /__/ /_/ / / / (__  ) 
+#   /_/    \__,_/ |___/_/\___/\____/_/ /_/____/   Favicons, Apple Touch Buttons
+#                                                 More information » http://j.mp/apple-touch-icons
+
+favicon:                         "http://images.phlow.de/phlow/phlow-favicon-32x.png"                    # iOS7 Size 32x32
+apple_touch_icon_iphone:         "http://images.phlow.de/phlow/phlow-touch-icon-iphone-60x.png"          # iOS7 Size 60x60
+apple_touch_icon_iphone_retina:  "http://images.phlow.de/phlow/phlow-touch-icon-iphone-retina-120x.png"  # iOS7 Size 120x120
+apple_touch_icon_ipad:           "http://images.phlow.de/phlow/phlow-touch-icon-ipad-76x.png"            # iOS7 Size 76x76
+apple_touch_icon_ipad_retina:    "http://images.phlow.de/phlow/phlow-touch-icon-ipad-retina-152x.png"    # iOS7 Size 152x152
+apple_touch_icon_precomposed:    "http://images.phlow.de/phlow/phlow-touch-icon-android-152x.png"        # iOS7 Size 152x152
+
+
+#       ______                __                __  
+#      / ____/___ _________  / /_  ____  ____  / /__
+#     / /_  / __ `/ ___/ _ \/ __ \/ __ \/ __ \/ //_/
+#    / __/ / /_/ / /__/  __/ /_/ / /_/ / /_/ / ,<   
+#   /_/    \__,_/\___/\___/_.___/\____/\____/_/|_|      Facebook-Optimization › http://j.mp/fb_optimize
+
+og_image:                           "http://images.phlow.de/phlow/phlow_de-logo-512x.png"
+# og_locale:                        "de_DE"
+# og_type:                          "website"
+# og_title:                         ""
+# og_description:                   ""
+# og_url:                           ""
+# og_site_name:                     ""
+
+
+#      _____            _       __   __  ___         ___      
+#     / ___/____  _____(_)___ _/ /  /  |/  /__  ____/ (_)___ _
+#     \__ \/ __ \/ ___/ / __ `/ /  / /|_/ / _ \/ __  / / __ `/
+#    ___/ / /_/ / /__/ / /_/ / /  / /  / /  __/ /_/ / / /_/ / 
+#   /____/\____/\___/_/\__,_/_/  /_/  /_/\___/\__,_/_/\__,_/  
+#
+#  Open _data/socialmedia.yml to adjust the left and right topbar navigation
+#
+
+
+
+
+# Social Media
+
+username: phlow
+
+
+# Build settings
+markdown: kramdown
+permalink: /:categories/:title/
+highlight: pygments
+exclude: []
+include: ['.htaccess']
+
+

_data/navigation.yml

@@ -0,0 +1,46 @@
+- title: Start
+  url: "/index.html"
+  side: left
+
+- title: "Style your content"
+  url: "/design/style-guide/"
+  side: left
+  dropdown:
+  - title: "Style Your Posts"
+    url: "/design/elements/"
+  - title: "The Grid"
+    url: "/design/grid/"
+  - title: "Blog-Page"
+    url: "/blog/"
+  - title: "Post-Layout"
+    url: "/design/post/"
+  - title: "Post-Left-Sidebar"
+    url: "/design/post-left-sidebar/"
+  - title: "Post-Right-Sidebar"
+    url: "/design/post-right-sidebar/"
+  - title: "Typography"
+    url: "/typography/"
+#  - title: "Fullwidth Layout"
+#    url: "/design/full-width/"
+
+# - title: "Portfolio"
+#   url: "/portfolio/"
+#   side: left
+
+- title: Documentation
+  url: "/documentation/"
+  side: left
+
+- title: Blog
+  url: "/blog/"
+  side: left
+
+- title: "Changelog"
+  url: "/changelog/"
+  side: left
+
+- title: "Contact"
+  url: "http://phlow.de/kontakt/"
+  side: right
+
+

_data/socialmedia.yml

@@ -0,0 +1,55 @@
+- name: YouTube
+  url: http://www.youtube.com/PhlowMedia
+  id: social-youtube
+  class: entypo
+  title: "Videos, Video-Anleitungen und Filme von Phlow auf YouTube"
+  entypo: "▶"
+
+- name: Twitter
+  url: http://twitter.com/phlow
+  id: social-twitter
+  class: entypo-social
+  title: "Immer das Neuste von Phlow gibt es auf Twitter"
+  entypo: ""
+
+- name: Facebook
+  url: http://www.facebook.com/phlow.media
+  id: social-facebook
+  class: entypo-social
+  title: "Lass uns Freunde sein!"
+  entypo: ""
+
+- name: Soundcloud
+  url: http://soundcloud.com/phlow
+  id: social-soundcloud
+  class: entypo-social
+  title: "Sounds und Downloads und mehr"
+  entypo: ""
+
+- name: GitHub
+  url: http://github.com/phlow
+  id: social-github
+  class: entypo-social
+  title: Code und mehr...
+  entypo: ""
+
+- name: Instagram
+  url: http://instagram.com/phlowmedia
+  id: social-instagram
+  class: entypo-social
+  title: "Bilder und Impressionen mit und ohne Filter..."
+  entypo: ""
+
+- name: Pinterst
+  url: http://www.pinterest.com/phlowmedia/
+  id: social-pinterest
+  class: entypo-social
+  title: "Bilder, Fotos, Illustrationen, Grafiken sammeln..."
+  entypo: ""
+
+- name: Mixcloud
+  url: http://www.mixcloud.com/phlow/
+  id: social-mixcloud
+  class: entypo
+  title: "Mixe, was sonst?"
+  entypo: "☁"

_includes/_about.html

@@ -0,0 +1,6 @@
+<h2>Why use this theme?</h2>
+
+<p>
+	<em>Feeling Responsive</em> is heavily built on <a href="http://foundation.zurb.com/">Foundation</a>, the fabulous responsive webdesign framework by Zurb. It supports a 12-column grid, persuades you with beautiful <a href="/typography/">typography</a> and is heavily optimized for speed.
+</p>
+

_includes/_site_description.html

@@ -0,0 +1 @@
+»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.

_includes/footer.html

@@ -0,0 +1,65 @@
+		<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							{% include _site_description.html %}
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="{{ site.url }}/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="{{ site.url }}/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="{{ site.url }}/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						{% for social_item in site.data.socialmedia %}
+							<li><a href="{{ social_item.url }}" target="_blank" id="{{ social_item.id }}" class="{{ social_item.class }}" title="{{ social_item.title }}">{{ social_item.entypo }}</a></li>
+						{% endfor %}
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>

_includes/footer_scripte.html

@@ -0,0 +1,5 @@
+  <script src="{{ site.url }}/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("{{ site.url }}/assets/img/{% if page.image_header %}{{ page.image_header }}{% else %}unsplash_3.jpg{% endif %}");
+</script>

_includes/for-loop-definition-list.html

@@ -0,0 +1,14 @@
+		<dl>
+			{% for post in site.posts reversed %}
+				{% if post.categories contains include.list-category %}
+				<dt>
+					<a href="{{ site.url }}{{ post.url }}">{% if post.chapter != nil %}{{ post.chapter }}. {% endif %}{{ post.title }}</a>
+				</dt>
+					{% if post.description %}
+					<dd>
+					    {{ post.description }}
+					</dd>
+					{% endif %}
+				{% endif %}
+			{% endfor %}
+		</dl>

_includes/for-loop-title-only-counter.html

@@ -0,0 +1,10 @@
+		<ul class="side-nav">
+			{% assign counter = 1 %}
+			{% for post in site.posts reversed %}
+				{% if post.categories contains include.list-category %}
+				<li><a href="{{ site.url }}{{ post.url }}">#{{ counter }} {{ post.title }}</a></li>
+				{% assign counter=counter | plus:1 %} 
+				{% endif %}
+			{% endfor %}
+				<li>&nbsp;</li>
+		</ul>

_includes/for-loop-title-only.html

@@ -0,0 +1,8 @@
+		<ul class="side-nav">
+			{% for post in site.posts reversed %}
+				{% if post.categories contains include.list-category %}
+				<li><a href="{{ site.url }}{{ post.url }}">{% if post.chapter != nil %}{{ post.chapter }}. {% endif %}{{ post.title }}</a></li>
+				{% endif %}
+			{% endfor %}
+				<li>&nbsp;</li>
+		</ul>

_includes/header.html

@@ -0,0 +1,20 @@
+<!doctype html>
+<html class="no-js" lang="{% if site.language == nil %}en{% else %}{{ site.language }}{% endif %}">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</title>
+	<link rel="stylesheet" href="{{ site.url }}/assets/css/style.min.css">	
+	<script src="{{ site.url }}/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+{% if site.google_site_verification %}
+	<meta name="google-site-verification" content="{{ site.google_site_verification}}" />
+{% endif %}
+{% if site.google_author %}
+	<link rel="author" href="{{ site.google_author }}"/>
+{% endif %}
+{% if site.favicon %}
+	<link rel="shortcut icon" href="{{ site.favicon }}" type="image/png" />
+	<link rel="icon" href="{{ site.favicon }}" type="image/png" />
+{% endif %}
+</head>

_includes/masthead.html

@@ -0,0 +1,25 @@
+{% if page.image_header == "no" %}
+
+	<div id="masthead-no-image-header">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="{{ site.url }}" title="{{ site.title }}">
+					<img src="{{ site.url }}/assets/img/{{ site.logo }}" alt="{{ site.title }}">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+{% else %}
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="{{ site.url }}" title="{{ site.title }}">
+					<img src="{{ site.url }}/assets/img/{{ site.logo }}" alt="{{ site.title }}">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+{% endif %}

_includes/navigation.html

@@ -0,0 +1,117 @@
+
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+{% comment %}
+
+    ____            __    __          _   __            _             __  _           
+   / __ \___  _____/ /_  / /____     / | / /___ __   __(_)___ _____ _/ /_(_)___  ____ 
+  / /_/ / _ \/ ___/ __ \/ __/ _ \   /  |/ / __ `/ | / / / __ `/ __ `/ __/ / __ \/ __ \
+ / _, _/  __/ /__/ / / / /_/  __/  / /|  / /_/ /| |/ / / /_/ / /_/ / /_/ / /_/ / / / /
+/_/ |_|\___/\___/_/ /_/\__/\___/  /_/ |_/\__,_/ |___/_/\__, /\__,_/\__/_/\____/_/ /_/ 
+                                                      /____/                          
+
+{% endcomment %}
+      <ul class="right">
+        {% for link in site.data.navigation %}
+
+              {% if link.url contains 'http' %}
+                {% assign domain = '' %}
+                {% else %}
+                {% assign domain = site.url %}
+              {% endif %}
+
+          {% comment %}   Wenn rechte Seite sonst mach nichts   {% endcomment %}
+          {% if link.side == 'right' %}
+            {% comment %}   Wenn rechte Seite OHNE Dropdown Menu dann   {% endcomment %}
+            {% if link.dropdown == nil %}
+              <li class="divider"></li>
+              <li{% if link.url == page.url %} class="active"{% endif %}><a href="{{ domain }}{{ link.url }}"{% if link.url contains 'http' %} target="_blank"{% endif %}>{{ link.title }}</a></li>
+
+            {% comment %}   Wenn rechte Seite mit Dropdown Menu dann   {% endcomment %}
+            {% else %}
+
+              <li class="divider"></li>
+              <li class="has-dropdown{% if link.url == page.url %} active{% endif %}">
+                <a href="{{ domain }}{{ link.url }}"{% if link.url contains 'http' %} target="_blank"{% endif %}>{{ link.title }}</a>
+
+                  <ul class="dropdown">
+                    {% for dropdown_link in link.dropdown %}
+
+                      {% if dropdown_link.url contains 'http' %}
+                        {% assign domain = '' %}
+                        {% else %}
+                        {% assign domain = site.url %}
+                      {% endif %}
+
+                      <li><a href="{{ domain }}{{ dropdown_link.url }}"{% if dropdown_link.url contains 'http' %} target="_blank"{% endif %}>{{ dropdown_link.title }}</a></li>
+                    {% endfor %}
+                  </ul>
+                  
+              </li>
+            {% endif %}
+          {% endif %}
+        {% endfor %}
+        {% comment %}   Fertig Schleife 1   {% endcomment %}
+      </ul>
+{% comment %}
+
+    __    _       __           _   __            _             __  _           
+   / /   (_)___  / /_____     / | / /___ __   __(_)___ _____ _/ /_(_)___  ____ 
+  / /   / / __ \/ //_/ _ \   /  |/ / __ `/ | / / / __ `/ __ `/ __/ / __ \/ __ \
+ / /___/ / / / / ,< /  __/  / /|  / /_/ /| |/ / / /_/ / /_/ / /_/ / /_/ / / / /
+/_____/_/_/ /_/_/|_|\___/  /_/ |_/\__,_/ |___/_/\__, /\__,_/\__/_/\____/_/ /_/ 
+                                               /____/                          
+
+{% endcomment %}
+      <ul class="left">
+        {% for link in site.data.navigation %}
+
+              {% if link.url contains 'http' %}
+                {% assign domain = '' %}
+                {% else %}
+                {% assign domain = site.url %}
+              {% endif %}
+
+          {% comment %}   Wenn linke Seite sonst mach nichts   {% endcomment %}
+          {% if link.side == 'left' %}
+
+            {% comment %}   Wenn linke Seite OHNE Dropdown Menu dann   {% endcomment %}
+            {% if link.dropdown == nil %}
+              <li{% if link.url == page.url %} class="active"{% endif %}><a href="{{ domain }}{{ link.url }}"{% if link.url contains 'http' %} target="_blank"{% endif %}>{{ link.title }}</a></li>
+              <li class="divider"></li>
+
+            {% comment %}   Wenn linke Seite mit Dropdown Menu dann   {% endcomment %}
+            {% else %}
+
+              <li class="has-dropdown{% if link.url == page.url %} active{% endif %}">
+                <a href="{{ domain }}{{ link.url }}"{% if link.url contains 'http' %} target="_blank"{% endif %}>{{ link.title }}</a>
+
+                  <ul class="dropdown">
+                    {% for dropdown_link in link.dropdown %}
+
+                      {% if dropdown_link.url contains 'http' %}
+                        {% assign domain = '' %}
+                        {% else %}
+                        {% assign domain = site.url %}
+                      {% endif %}
+
+                      <li><a href="{{ domain }}{{ dropdown_link.url }}"{% if dropdown_link.url contains 'http' %} target="_blank"{% endif %}>{{ dropdown_link.title }}</a></li>
+                    {% endfor %}
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            {% endif %}
+          {% endif %}
+        {% endfor %}
+        {% comment %}   Fertig Schleife 1   {% endcomment %}
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->

_includes/next_previous_in_category.html

@@ -0,0 +1,24 @@
+{% comment %}
+
+Das Plugin ist das category_next_previous.rb aus dem plugins-Ordner zum Einsatz
+
+Quelle: http://ajclarkson.co.uk/blog/jekyll-category-post-navigation/
+
+{% endcomment %}
+<div class="row">
+		{% if page.next_in_category != nil %} 
+	<div class="small-4 top-60 columns">
+			<a class="button grey small radius expand" href="{{ site.url }}{{ page.next_in_category.url }}">&lang; {% if page.next_in_category.chapter != nil %}{{ page.next_in_category.chapter }}. {% endif %}{{ page.next_in_category.title }}</a>
+	</div><!-- /.small-4.columns -->
+		{% endif %}
+
+	<div class="small-4 top-60 columns">
+		<a class="button grey small radius expand"  href="{{ site.url }}/anleitungen/">Inhaltsverzeichnis</a>
+	</div><!-- /.small-4.columns -->
+
+	<div class="small-4 top-60 columns">
+		{% if page.previous_in_category != nil %}
+			<a class="button grey small radius expand" href="{{ site.url }}{{ page.previous_in_category.url }}">{% if page.previous_in_category.chapter != nil %}{{ page.previous_in_category.chapter }}. {% endif %}{{ page.previous_in_category.title }} &rang;</a>
+		{% endif %}
+	</div><!-- /.small-4.columns -->
+</div><!-- /.row -->

_includes/sidebar.html

@@ -0,0 +1,10 @@
+<aside>
+	<div class="panel radius">
+		<h3>Sidebar</h3>
+		<p>
+			Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+
+			Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+		</p>
+	</div>
+</aside>

_layouts/blog.html

@@ -0,0 +1,30 @@
+---
+layout: default
+---
+<div id="blog-index" class="row">
+	<div class="medium-7 columns top-30">
+
+		{% for post in site.posts %}
+			<div class="row">
+				<div class="small-12 columns bottom-60">
+					<p class="subtitle">{% if post.subtitle %}{{ post.subtitle }}{% endif %}<span class="subheader"><small> {{ post.date | date: "%d.%m.%Y" }} &middot; {% if post.categories %}{{ post.categories | join: ' &middot; ' }}{% endif %}</small></span></p>
+					<h2><a href="{{ site.url }}{{ post.url }}">{{ post.title }}</a></h2>
+					<p>
+						{% if post.image.thumb %}<a href="{{ site.url }}{{ post.url }}" title="{{ post.title escape_once }}"><img src="{{ site.url }}/assets/img/{{ post.image.thumb }}" class="alignleft" width="150" height="150" alt="{{ page.title escape_once }}"></a>{% endif %}
+						{{ post.description }}
+						<a href="{{ site.url }}{{ post.url }}" title="Read {{ post.title escape_once }}"><strong>Read more ›</strong></a>
+					</p>
+				</div><!-- /.small-12.columns -->
+			</div><!-- /.row -->
+		{% endfor %}
+
+	</div><!-- /.medium-7.columns -->
+
+
+
+	<div class="medium-5 columns top-30">
+		{% include sidebar.html %}
+	</div><!-- /.medium-5.columns -->
+</div><!-- /.row -->
+
+

_layouts/compress.html

@@ -0,0 +1,61 @@
+---
+#
+# Jekyll layout that compresses HTML
+# v0.2.0
+# https://github.com/penibelst/jekyll-compress-html
+#
+compress:
+  elements:
+    # Root
+    - html
+    # Metadata content
+    - head
+    - title
+    - base
+    - link
+    - meta
+    - style
+    # Sections
+    - body
+    - article
+    - section
+    - nav
+    - aside
+    - h1
+    - h2
+    - h3
+    - h4
+    - h5
+    - h6
+    - hgroup
+    - header
+    - footer
+    - address
+    # Grouping content except `pre`
+    - p
+    - hr
+    - blockquote
+    - ol
+    - ul
+    - li
+    - dl
+    - dt
+    - dd
+    - figure
+    - figcaption
+    - main
+    - div
+    # Tabular data
+    - table
+    - caption
+    - colgroup
+    - col
+    - tbody
+    - thead
+    - tfoot
+    - tr
+    - td
+    - th
+---
+
+{% assign _pres = content | split: '<pre' %}{% for _pre1 in _pres %}{% assign _pre2 = _pre1 | split: '</pre>' %}{% if _pre2.size == 2 %}<pre{{ _pre2.first }}</pre>{% endif %}{% assign _second = _pre2.last | split: ' ' | join: ' ' %}{% for _element in page.compress.elements %}{% assign _edge = ' <e,<e' | replace: 'e', _element | split: ',' %}{% assign _second = _second | replace: _edge[0], _edge[1] %}{% assign _edge = ' </e>,</e>' | replace: 'e', _element | split: ',' %}{% assign _second = _second | replace: _edge[0], _edge[1] %}{% assign _edge = '</e> ,</e>' | replace: 'e', _element | split: ',' %}{% assign _second = _second | replace: _edge[0], _edge[1] %}{% assign _blank = '<e></e>' | replace: 'e', _element %}{% assign _second = _second | remove: _blank %}{% endfor %}{{ _second }}{% endfor %}

_layouts/default.html

@@ -0,0 +1,13 @@
+{% include header.html %}
+<body>
+	{% include masthead.html %}
+
+	{% include navigation.html %}
+
+	{{ content }}
+
+	{% include footer.html %}
+	
+	{% include footer_scripte.html %}
+</body>
+</html>

_layouts/page-fullwidth.html

@@ -0,0 +1,34 @@
+---
+layout: default
+---
+{% if page.image_title %}
+<div class="row top-30">
+	<div class="small-12 columns">
+		<img src="{{ site.url }}/assets/img/{{ page.image_title }}" width="970" alt="{{ page.title escape_once }}">
+	</div><!-- /.small-12.columns -->
+</div><!-- /.row -->
+{% endif %}
+
+
+<div class="row top-30">
+	<div class="medium-12 columns">
+
+		<article>
+			<header>
+				{% if page.subtitle %}<p class="subtitle">{{ page.subtitle }}</p>{% endif %}
+				<h1>{{ page.title }}</h1>
+			</header>
+
+			{% if page.description %}
+				<p class="teaser">
+					{{ page.description }}
+				</p>
+			{% endif %}
+						
+			{{ content }}
+		</article>
+
+	</div><!-- /.medium-12.columns -->
+</div><!-- /.row -->
+
+

_layouts/page.html

@@ -0,0 +1,33 @@
+---
+layout: default
+---
+{% if page.image_title %}
+<div class="row top-30">
+	<div class="small-12 columns">
+		<img src="{{ site.url }}/assets/img/{{ page.image_title }}" width="970" alt="{{ page.title escape_once }}">
+	</div><!-- /.small-12.columns -->
+</div><!-- /.row -->
+{% endif %}
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				{% if page.subtitle %}<p class="subtitle">{{ page.subtitle }}</p>{% endif %}
+				<h1>{{ page.title }}</h1>
+			</header>
+
+			{% if page.description %}
+				<p class="teaser">
+					{{ page.description }}
+				</p>
+			{% endif %}
+						
+			{{ content }}
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+

_layouts/portoflio.html

@@ -0,0 +1,13 @@
+{% include header.html %}
+<body>
+	{% include masthead.html %}
+
+	{% include navigation.html %}
+
+	{{ content }}
+
+	{% include footer.html %}
+	
+	{% include footer_scripte.html %}
+</body>
+</html>

_layouts/post-left-sidebar.html

@@ -0,0 +1,36 @@
+---
+layout: default
+---
+<div class="row top-60">
+	<div class="medium-4 columns">
+		{% include sidebar.html %}
+	</div><!-- /.medium-4.columns -->
+
+
+	<div class="medium-8 columns">
+		<article>
+			<header>
+				{% if page.subtitle %}<p class="subtitle">{{ page.subtitle }}</p>{% endif %}
+				{% if page.image_title %}<img src="{{ site.url }}/assets/img/{{ page.image_title }}" width="970" alt="{{ page.title escape_once }}">{% endif %}
+				<h1>{{ page.title }}</h1>
+			</header>
+			{% if page.description %}
+				<p class="teaser">
+					{{ page.description }}
+				</p>
+			{% endif %}
+			
+			{{ content }}
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: {{ page.date | date: "%d.%m.%Y" }}</li>
+					<li class="subheader">{% if page.categories %}Archived in {{ page.categories | join: ' · ' | upcase }}{% endif %}</li>
+					<li class="divider"></li>
+				</ul>
+
+			</div>
+		</article>
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+

_layouts/post-right-sidebar.html

@@ -0,0 +1,36 @@
+---
+layout: default
+---
+<div class="row top-60">
+	<div class="medium-8 columns">
+		<article>
+			<header>
+				{% if page.subtitle %}<p class="subtitle">{{ page.subtitle }}</p>{% endif %}
+				{% if page.image_title %}<img src="{{ site.url }}/assets/img/{{ page.image_title }}" width="970" alt="{{ page.title escape_once }}">{% endif %}
+				<h1>{{ page.title }}</h1>
+			</header>
+			{% if page.description %}
+				<p class="teaser">
+					{{ page.description }}
+				</p>
+			{% endif %}
+			
+			{{ content }}
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: {{ page.date | date: "%d.%m.%Y" }}</li>
+					<li class="subheader">{% if page.categories %}Archived in {{ page.categories | join: ' · ' | upcase }}{% endif %}</li>
+					<li class="divider"></li>
+				</ul>
+
+			</div>
+		</article>
+	</div><!-- /.medium-8.columns -->
+
+
+	<div class="medium-4 columns">
+		{% include sidebar.html %}
+	</div><!-- /.medium-4.columns -->
+</div><!-- /.row -->
+

_layouts/post.html

@@ -0,0 +1,42 @@
+---
+layout: default
+---
+{% if page.image_title %}
+<div class="row top-30">
+	<div class="small-12 columns">
+		<img src="{{ site.url }}/assets/img/{{ page.image_title }}" width="970" alt="{{ page.title escape_once }}">
+	</div><!-- /.small-12.columns -->
+</div><!-- /.row -->
+{% endif %}
+
+
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				{% if page.subtitle %}<p class="subtitle">{{ page.subtitle }}</p>{% endif %}
+				<h1>{{ page.title }}</h1>
+			</header>
+
+			{% if page.description %}
+				<p class="teaser">
+					{{ page.description }}
+				</p>
+			{% endif %}
+			
+			{{ content }}
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: {{ page.date | date: "%d.%m.%Y" }}</li>
+					<li class="subheader">{% if page.categories %}Archived in {{ page.categories | join: ' · ' | upcase }}{% endif %}</li>
+					<li class="divider"></li>
+				</ul>
+			</div>
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+

_posts/design/2014-07-05-elements.md

@@ -0,0 +1,44 @@
+---
+layout: post
+title:  "This is the <h1>-Headline"
+subtitle:  "Subheadline"
+description: "Feeling Responsive offers lots of possibilities to style your articles. The theme turns around the corner with a headline, subheadline, a title and header image. A beautiful typography crafted to please the eyes delivers your ideas, explanations and articles to stick out."
+date:  2014-07-05 07:00:00
+categories:
+    - typography 
+    - design 
+    - elements 
+image_title: "unsplash_5.jpg"
+permalink: "/design/this-is-h1-headline/"
+---
+
+# <h1>-Headline
+
+## <h2>-Headline
+
+### <h3>-Headline
+
+#### <h4>-Headline
+
+##### <h5>-Headline
+
+###### <h6>-Headline
+
+- - -
+
+1. Ordered List
+2. Second List Item
+3. Third List Item
+4. Fourth List Item
+5. Fifth List Item
+
+- - -
+
+Definition List
+:   Bacon ipsum dolor sit amet spare ribs brisket ribeye, andouille sirloin bresaola frankfurter corned beef capicola bacon. Salami beef ribs sirloin, short loin hamburger shoulder t-bone.
+
+Beef ribs jowl swine porchetta
+:   Sirloin tenderloin swine frankfurter pork loin pork capicola ham hock strip steak ribeye beef ribs. Hamburger t-bone ribeye ham prosciutto bresaola.
+
+Pancetta flank sirloin pork
+:   short ribs shankle prosciutto landjaeger. Beef ribs turkey shoulder drumstick. Leberkas pork belly ribeye, bresaola jerky strip steak tenderloin bacon landjaeger short ribs beef ribs. Flank pork chop fatback tail kielbasa filet mignon jowl landjaeger bresaola tongue corned beef biltong. Landjaeger spare ribs fatback corned beef tenderloin drumstick, swine chicken beef turkey biltong doner tri-tip filet mignon. 

_posts/design/2014-07-09-post-left-sidebar.md

@@ -0,0 +1,16 @@
+---
+layout: post-left-sidebar
+title:  "Post With Left Sidebar"
+description: "This is a example of Post with a Sidebar on the left."
+date:  2014-03-28 00:00:00
+categories: layout
+image_title: "unsplash_1.jpg"
+permalink: "/design/post-left-sidebar/"
+---
+## Have a look at the sidebar
+
+Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

_posts/design/2014-07-10-post-right-sidebar.md

@@ -0,0 +1,20 @@
+---
+layout: post-right-sidebar
+title:  "Post With Right Sidebar"
+description: "This is a example of Post with a Sidebar on the right."
+date:  2014-03-28 00:00:00
+categories: layout
+image:
+    thumb: "unsplash_2_thumb.jpg"
+image_title: "unsplash_2.jpg"
+permalink: "/design/post-right-sidebar/"
+---
+## Have a look at the sidebar
+
+Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+
+### Lorem
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

_posts/design/2014-07-10-post.md

@@ -0,0 +1,17 @@
+---
+layout: post
+title:  "Normal Post"
+description: "This is a example of post beautiful aligned in the middle. No sidebar needed to read good articles."
+date:  2014-03-28 00:00:00
+categories: layout
+permalink: "/design/post/"
+---
+## Look!
+
+Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+
+### Lorem
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

_posts/design/2014-07-18-elements.md

@@ -0,0 +1,22 @@
+---
+layout: post
+title:  "Possibilites to style your Post"
+subtitle:  "Layout Elements"
+description: "You can style your content in different ways. There are elements like subtitles, feature images, header images, meta data like categories and tags and many more. This article shows the different possibilites."
+categories: layout
+image:
+   thumb: unsplash_6_thumb.jpg
+image_title: "unsplash_6.jpg"
+image_header: "no"
+permalink: "/design/elements/"
+---
+
+## Subtitles
+
+## Feature Images
+
+## Header Images
+
+You can choose to show a special full-width header image or not.
+
+## Meta-Data

_posts/design/2014-08-17-grid.md

@@ -0,0 +1,72 @@
+---
+layout: page-fullwidth
+title:  "The Grid"
+subtitle:  "Multi-Device Layouts"
+description: "Create powerful multi-device layouts quickly and easily with the 12-column, nest-able Foundation grid. These are the dimensions."
+date:  2014-07-05 07:00:00
+image:
+   thumb: unsplash_7_thumb.jpg
+categories:
+    - layout 
+permalink: "/design/grid/"
+---
+*Feeling Responsive* is built on Foundation. And of course, we make use of the wonderful grid system and so can you. Find out more about [constructing  beautiful layouts][1] in the foundation documentation.
+
+## Large Displays
+
+### Two Columns
+
+<div class="row">
+  <div class="large-6 columns">
+      <img src="http://placehold.it/500x281/6b6351/e1dcd7&amp;text=Width+500+Pixel">
+  </div>
+  <div class="large-6 columns">
+      <img src="http://placehold.it/500x281/e05a10/e1e75e&amp;text=Width+500+Pixel">
+  </div>
+</div>
+
+### Three Columns
+
+<div class="row">
+  <div class="large-4 columns">
+      <img src="http://placehold.it/333x170/6b6351/e1dcd7&amp;text=Width+333+Pixel">
+  </div>
+  <div class="large-4 columns">
+      <img src="http://placehold.it/333x170/e05a10/e1e75e&amp;text=Width+333+Pixel">
+  </div>
+  <div class="large-4 columns">
+      <img src="http://placehold.it/333x170/fabb00/771e1e&amp;text=Width+333+Pixel">
+  </div>
+</div>
+
+
+
+### Four Columns
+
+<div class="row">
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/6b6351/e1dcd7&amp;text=Width+250+Pixel">
+  </div>
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/e05a10/e1e75e&amp;text=Width+250+Pixel">
+  </div>
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/fabb00/771e1e&amp;text=Width+250+Pixel">
+  </div>
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/00792c/acca57&amp;text=Width+250+Pixel">
+  </div>
+</div>
+
+
+
+ [1]: http://foundation.zurb.com/docs/components/grid.html
+ [2]: #
+ [3]: #
+ [4]: #
+ [5]: #
+ [6]: #
+ [7]: #
+ [8]: #
+ [9]: #
+ [10]: #

_site/about/index.html

@@ -0,0 +1,385 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>About</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead-no-image-header">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Why another Jekyll template?</p>
+				<h1>About</h1>
+			</header>
+
+			
+				<p class="teaser">
+					Since years I am programming and designing websites, love to work with open source tools and learn via code from others. I wanted to try to give something back...
+				</p>
+			
+						
+			<p>…and learn at the same time.</p>
+
+<p><em>Feeling Responsive</em> is my first theme and let into the world. It’s built on work and knowledge of others. While I am still programming it, you read about whats behind this theme in the – hopefully – near future.</p>
+
+<p>Since then, fork it!</p>
+
+<p>Yours sincerelly, Moritz »mo.« Sauer</p>
+
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/no");
+</script>
+</body>
+</html>

_site/assets/fonts/entypo-social.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"><defs><font horiz-adv-x="555"><font-face font-family="Entypo Social" ascent="750" descent="-250" alphabetic="0"/></font></defs></svg>

_site/assets/fonts/entypo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"><defs><font horiz-adv-x="508"><font-face font-family="Entypo" ascent="750" descent="-250" alphabetic="0"/></font></defs></svg>

_site/blog/index.html

@@ -0,0 +1,450 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>The Feeling Responsive Blog Template</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li class="active"><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	<div id="blog-index" class="row">
+	<div class="medium-7 columns top-30">
+
+		
+			<div class="row">
+				<div class="small-12 columns bottom-60">
+					<p class="subtitle">Layout Elements<span class="subheader"><small> 18.07.2014 &middot; layout</small></span></p>
+					<h2><a href="http://localhost:4000/design/elements/">Possibilites to style your Post</a></h2>
+					<p>
+						<a href="http://localhost:4000/design/elements/" title="Possibilites to style your Post"><img src="http://localhost:4000/assets/img/unsplash_6_thumb.jpg" class="alignleft" width="150" height="150" alt="The Feeling Responsive Blog Template"></a>
+						You can style your content in different ways. There are elements like subtitles, feature images, header images, meta data like categories and tags and many more. This article shows the different possibilites.
+						<a href="http://localhost:4000/design/elements/" title="Read Possibilites to style your Post"><strong>Read more ›</strong></a>
+					</p>
+				</div><!-- /.small-12.columns -->
+			</div><!-- /.row -->
+		
+			<div class="row">
+				<div class="small-12 columns bottom-60">
+					<p class="subtitle">Multi-Device Layouts<span class="subheader"><small> 05.07.2014 &middot; layout</small></span></p>
+					<h2><a href="http://localhost:4000/design/grid/">The Grid</a></h2>
+					<p>
+						<a href="http://localhost:4000/design/grid/" title="The Grid"><img src="http://localhost:4000/assets/img/unsplash_7_thumb.jpg" class="alignleft" width="150" height="150" alt="The Feeling Responsive Blog Template"></a>
+						Create powerful multi-device layouts quickly and easily with the 12-column, nest-able Foundation grid. These are the dimensions.
+						<a href="http://localhost:4000/design/grid/" title="Read The Grid"><strong>Read more ›</strong></a>
+					</p>
+				</div><!-- /.small-12.columns -->
+			</div><!-- /.row -->
+		
+			<div class="row">
+				<div class="small-12 columns bottom-60">
+					<p class="subtitle">Subheadline<span class="subheader"><small> 05.07.2014 &middot; typography &middot; design &middot; elements</small></span></p>
+					<h2><a href="http://localhost:4000/design/this-is-h1-headline/">This is the &lt;h1&gt;-Headline</a></h2>
+					<p>
+						
+						Feeling Responsive offers lots of possibilities to style your articles. The theme turns around the corner with a headline, subheadline, a title and header image. A beautiful typography crafted to please the eyes delivers your ideas, explanations and articles to stick out.
+						<a href="http://localhost:4000/design/this-is-h1-headline/" title="Read This is the &lt;h1&gt;-Headline"><strong>Read more ›</strong></a>
+					</p>
+				</div><!-- /.small-12.columns -->
+			</div><!-- /.row -->
+		
+			<div class="row">
+				<div class="small-12 columns bottom-60">
+					<p class="subtitle"><span class="subheader"><small> 28.03.2014 &middot; layout</small></span></p>
+					<h2><a href="http://localhost:4000/design/post-right-sidebar/">Post With Right Sidebar</a></h2>
+					<p>
+						<a href="http://localhost:4000/design/post-right-sidebar/" title="Post With Right Sidebar"><img src="http://localhost:4000/assets/img/unsplash_2_thumb.jpg" class="alignleft" width="150" height="150" alt="The Feeling Responsive Blog Template"></a>
+						This is a example of Post with a Sidebar on the right.
+						<a href="http://localhost:4000/design/post-right-sidebar/" title="Read Post With Right Sidebar"><strong>Read more ›</strong></a>
+					</p>
+				</div><!-- /.small-12.columns -->
+			</div><!-- /.row -->
+		
+			<div class="row">
+				<div class="small-12 columns bottom-60">
+					<p class="subtitle"><span class="subheader"><small> 28.03.2014 &middot; layout</small></span></p>
+					<h2><a href="http://localhost:4000/design/post-left-sidebar/">Post With Left Sidebar</a></h2>
+					<p>
+						
+						This is a example of Post with a Sidebar on the left.
+						<a href="http://localhost:4000/design/post-left-sidebar/" title="Read Post With Left Sidebar"><strong>Read more ›</strong></a>
+					</p>
+				</div><!-- /.small-12.columns -->
+			</div><!-- /.row -->
+		
+			<div class="row">
+				<div class="small-12 columns bottom-60">
+					<p class="subtitle"><span class="subheader"><small> 28.03.2014 &middot; layout</small></span></p>
+					<h2><a href="http://localhost:4000/design/post/">Normal Post</a></h2>
+					<p>
+						
+						This is a example of post beautiful aligned in the middle. No sidebar needed to read good articles.
+						<a href="http://localhost:4000/design/post/" title="Read Normal Post"><strong>Read more ›</strong></a>
+					</p>
+				</div><!-- /.small-12.columns -->
+			</div><!-- /.row -->
+		
+
+	</div><!-- /.medium-7.columns -->
+
+
+
+	<div class="medium-5 columns top-30">
+		<aside>
+	<div class="panel radius">
+		<h3>Sidebar</h3>
+		<p>
+			Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+
+			Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+		</p>
+	</div>
+</aside>
+	</div><!-- /.medium-5.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/header_unsplash_6.jpg");
+</script>
+</body>
+</html>

_site/blog/page2/index.html

@@ -0,0 +1,405 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Feeling Responsive – A theme based on foundation</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	<div id="header-home">
+    <div class="row">
+        <div class="small-12 columns">
+        </div><!-- /.medium-4.columns -->
+    </div><!-- /.row -->
+</div><!-- /#header-home -->
+
+
+
+<div class="row top-30">
+
+    <div class="medium-4 columns">
+    	<a href="http://localhost:4000/portfolio/"><img src="http://localhost:4000/assets/img/unsplash_1.jpg" alt=""></a>
+        <h2>Portfolio</h2>
+    	<p>
+    		<em>Feeling Responsive</em> supports you with layouts to present your favorite and actual work. With the gallery- and portfolio-template you can show off your work as a designer, programmer, photographer or artist.
+    	</p>
+
+        <p><a class="button tiny radius" href="http://localhost:4000/portfolio/">More ›</a></p>
+
+    </div><!-- /.medium-4.columns -->
+
+
+    <div class="medium-4 columns">
+    	<a href="http://localhost:4000/about/"><img src="http://localhost:4000/assets/img/unsplash_2.jpg" alt=""></a>
+        
+        <h2>Why use this theme?</h2>
+
+<p>
+	<em>Feeling Responsive</em> is heavily built on <a href="http://foundation.zurb.com/">Foundation</a>, the fabulous responsive webdesign framework by Zurb. It supports a 12-column grid, persuades you with beautiful <a href="/typography/">typography</a> and is heavily optimized for speed.
+</p>
+
+
+
+        <p><a class="button tiny radius" href="http://localhost:4000/about/">More ›</a></p>
+    </div><!-- /.medium-4.columns -->
+
+
+    <div class="medium-4 columns">
+    	<a href="http://localhost:4000/blog/"><img src="http://localhost:4000/assets/img/unsplash_4.jpg" alt=""></a>
+        <h2>Blog</h2>
+    	<p>
+    		Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+    	</p>
+        
+        <p><a class="button tiny radius" href="http://localhost:4000/blog/">More ›</a></p>
+
+    </div><!-- /.medium-4.columns -->
+
+</div><!-- /.row -->
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/header_unsplash_4.jpg");
+</script>
+</body>
+</html>

_site/changelog/index.html

@@ -0,0 +1,390 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Change is good!</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li class="active"><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Feeling Responsive Theme Changelog</p>
+				<h1>Change is good!</h1>
+			</header>
+
+			
+				<p class="teaser">
+					History and changelog of Feeling Responsive Theme by Phlow Media.
+				</p>
+			
+						
+			<dl>
+  <dt>2014-08-17 // Version 0.4</dt>
+  <dd>First beta release of »Feeling Responsive« with the current jekyll templates.</dd>
+  <dt>2014-08-17 // Version 0.3</dt>
+  <dd>First release – only <em>HTML-Version</em> – of »Feeling Responsive« on Github-Pages with some hickups.</dd>
+  <dt>2014-07-26 // Version 0.2</dt>
+  <dd>Updated Navigation &amp; Social Media-Configuration via custom data in <code>_data</code></dd>
+  <dt>2014-07-07 // Version 0.1</dt>
+  <dd>Technical Theme Development Start</dd>
+  <dt>2014-06-23</dt>
+  <dd>First Ideas and scribbles at the beach in Bergen/Netherlands</dd>
+</dl>
+
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/header_unsplash_7.jpg");
+</script>
+</body>
+</html>

_site/design/elements/index.html

@@ -0,0 +1,402 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Possibilites to style your Post</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead-no-image-header">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+<div class="row top-30">
+	<div class="small-12 columns">
+		<img src="http://localhost:4000/assets/img/unsplash_6.jpg" width="970" alt="Possibilites to style your Post">
+	</div><!-- /.small-12.columns -->
+</div><!-- /.row -->
+
+
+
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Layout Elements</p>
+				<h1>Possibilites to style your Post</h1>
+			</header>
+
+			
+				<p class="teaser">
+					You can style your content in different ways. There are elements like subtitles, feature images, header images, meta data like categories and tags and many more. This article shows the different possibilites.
+				</p>
+			
+			
+			<h2 id="subtitles">Subtitles</h2>
+
+<h2 id="feature-images">Feature Images</h2>
+
+<h2 id="header-images">Header Images</h2>
+
+<p>You can choose to show a special full-width header image or not.</p>
+
+<h2 id="meta-data">Meta-Data</h2>
+
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: 18.07.2014</li>
+					<li class="subheader">Archived in LAYOUT</li>
+					<li class="divider"></li>
+				</ul>
+			</div>
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/no");
+</script>
+</body>
+</html>

_site/design/grid/index.html

@@ -0,0 +1,425 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>The Grid</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+
+
+<div class="row top-30">
+	<div class="medium-12 columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Multi-Device Layouts</p>
+				<h1>The Grid</h1>
+			</header>
+
+			
+				<p class="teaser">
+					Create powerful multi-device layouts quickly and easily with the 12-column, nest-able Foundation grid. These are the dimensions.
+				</p>
+			
+						
+			<p><em>Feeling Responsive</em> is built on Foundation. And of course, we make use of the wonderful grid system and so can you. Find out more about <a href="http://foundation.zurb.com/docs/components/grid.html">constructing  beautiful layouts</a> in the foundation documentation.</p>
+
+<h2 id="large-displays">Large Displays</h2>
+
+<h3 id="two-columns">Two Columns</h3>
+
+<div class="row">
+  <div class="large-6 columns">
+      <img src="http://placehold.it/500x281/6b6351/e1dcd7&amp;text=Width+500+Pixel" />
+  </div>
+  <div class="large-6 columns">
+      <img src="http://placehold.it/500x281/e05a10/e1e75e&amp;text=Width+500+Pixel" />
+  </div>
+</div>
+
+<h3 id="three-columns">Three Columns</h3>
+
+<div class="row">
+  <div class="large-4 columns">
+      <img src="http://placehold.it/333x170/6b6351/e1dcd7&amp;text=Width+333+Pixel" />
+  </div>
+  <div class="large-4 columns">
+      <img src="http://placehold.it/333x170/e05a10/e1e75e&amp;text=Width+333+Pixel" />
+  </div>
+  <div class="large-4 columns">
+      <img src="http://placehold.it/333x170/fabb00/771e1e&amp;text=Width+333+Pixel" />
+  </div>
+</div>
+
+<h3 id="four-columns">Four Columns</h3>
+
+<div class="row">
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/6b6351/e1dcd7&amp;text=Width+250+Pixel" />
+  </div>
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/e05a10/e1e75e&amp;text=Width+250+Pixel" />
+  </div>
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/fabb00/771e1e&amp;text=Width+250+Pixel" />
+  </div>
+  <div class="large-3 columns">
+      <img src="http://placehold.it/250x141/00792c/acca57&amp;text=Width+250+Pixel" />
+  </div>
+</div>
+
+
+		</article>
+
+	</div><!-- /.medium-12.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
+</script>
+</body>
+</html>

_site/design/post-left-sidebar/index.html

@@ -0,0 +1,403 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Post With Left Sidebar</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	<div class="row top-60">
+	<div class="medium-4 columns">
+		<aside>
+	<div class="panel radius">
+		<h3>Sidebar</h3>
+		<p>
+			Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+
+			Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+		</p>
+	</div>
+</aside>
+	</div><!-- /.medium-4.columns -->
+
+
+	<div class="medium-8 columns">
+		<article>
+			<header>
+				
+				<img src="http://localhost:4000/assets/img/unsplash_1.jpg" width="970" alt="Post With Left Sidebar">
+				<h1>Post With Left Sidebar</h1>
+			</header>
+			
+				<p class="teaser">
+					This is a example of Post with a Sidebar on the left.
+				</p>
+			
+			
+			<h2 id="have-a-look-at-the-sidebar">Have a look at the sidebar</h2>
+
+<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: 28.03.2014</li>
+					<li class="subheader">Archived in LAYOUT</li>
+					<li class="divider"></li>
+				</ul>
+
+			</div>
+		</article>
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
+</script>
+</body>
+</html>

_site/design/post-right-sidebar/index.html

@@ -0,0 +1,405 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Post With Right Sidebar</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	<div class="row top-60">
+	<div class="medium-8 columns">
+		<article>
+			<header>
+				
+				<img src="http://localhost:4000/assets/img/unsplash_2.jpg" width="970" alt="Post With Right Sidebar">
+				<h1>Post With Right Sidebar</h1>
+			</header>
+			
+				<p class="teaser">
+					This is a example of Post with a Sidebar on the right.
+				</p>
+			
+			
+			<h2 id="have-a-look-at-the-sidebar">Have a look at the sidebar</h2>
+
+<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
+<h3 id="lorem">Lorem</h3>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: 28.03.2014</li>
+					<li class="subheader">Archived in LAYOUT</li>
+					<li class="divider"></li>
+				</ul>
+
+			</div>
+		</article>
+	</div><!-- /.medium-8.columns -->
+
+
+	<div class="medium-4 columns">
+		<aside>
+	<div class="panel radius">
+		<h3>Sidebar</h3>
+		<p>
+			Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+
+			Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+		</p>
+	</div>
+</aside>
+	</div><!-- /.medium-4.columns -->
+</div><!-- /.row -->
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
+</script>
+</body>
+</html>

_site/design/post/index.html

@@ -0,0 +1,396 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Normal Post</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+
+
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				
+				<h1>Normal Post</h1>
+			</header>
+
+			
+				<p class="teaser">
+					This is a example of post beautiful aligned in the middle. No sidebar needed to read good articles.
+				</p>
+			
+			
+			<h2 id="look">Look!</h2>
+
+<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
+<h3 id="lorem">Lorem</h3>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: 28.03.2014</li>
+					<li class="subheader">Archived in LAYOUT</li>
+					<li class="divider"></li>
+				</ul>
+			</div>
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
+</script>
+</body>
+</html>

_site/design/style-guide/index.html

@@ -0,0 +1,386 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Style your content!</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown active">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Layouts of Feeling Responsive</p>
+				<h1>Style your content!</h1>
+			</header>
+
+			
+						
+			<ul>
+	
+	<li><a href="http://localhost:4000//design/elements/">Possibilites to style your Post</a></li>
+	
+	<li><a href="http://localhost:4000//design/grid/">The Grid</a></li>
+	
+	<li><a href="http://localhost:4000//design/post-right-sidebar/">Post With Right Sidebar</a></li>
+	
+	<li><a href="http://localhost:4000//design/post-left-sidebar/">Post With Left Sidebar</a></li>
+	
+	<li><a href="http://localhost:4000//design/post/">Normal Post</a></li>
+	
+</ul>
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/header_unsplash_6.jpg");
+</script>
+</body>
+</html>

_site/design/this-is-h1-headline/index.html

@@ -0,0 +1,425 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>This is the &lt;h1&gt;-Headline</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+<div class="row top-30">
+	<div class="small-12 columns">
+		<img src="http://localhost:4000/assets/img/unsplash_5.jpg" width="970" alt="This is the &lt;h1&gt;-Headline">
+	</div><!-- /.small-12.columns -->
+</div><!-- /.row -->
+
+
+
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Subheadline</p>
+				<h1>This is the &lt;h1&gt;-Headline</h1>
+			</header>
+
+			
+				<p class="teaser">
+					Feeling Responsive offers lots of possibilities to style your articles. The theme turns around the corner with a headline, subheadline, a title and header image. A beautiful typography crafted to please the eyes delivers your ideas, explanations and articles to stick out.
+				</p>
+			
+			
+			<h1 id="lth1gt-headline">&lt;h1&gt;-Headline</h1>
+
+<h2 id="lth2gt-headline">&lt;h2&gt;-Headline</h2>
+
+<h3 id="lth3gt-headline">&lt;h3&gt;-Headline</h3>
+
+<h4 id="lth4gt-headline">&lt;h4&gt;-Headline</h4>
+
+<h5 id="lth5gt-headline">&lt;h5&gt;-Headline</h5>
+
+<h6 id="lth6gt-headline">&lt;h6&gt;-Headline</h6>
+
+<hr />
+
+<ol>
+  <li>Ordered List</li>
+  <li>Second List Item</li>
+  <li>Third List Item</li>
+  <li>Fourth List Item</li>
+  <li>Fifth List Item</li>
+</ol>
+
+<hr />
+
+<dl>
+  <dt>Definition List</dt>
+  <dd>Bacon ipsum dolor sit amet spare ribs brisket ribeye, andouille sirloin bresaola frankfurter corned beef capicola bacon. Salami beef ribs sirloin, short loin hamburger shoulder t-bone.</dd>
+  <dt>Beef ribs jowl swine porchetta</dt>
+  <dd>Sirloin tenderloin swine frankfurter pork loin pork capicola ham hock strip steak ribeye beef ribs. Hamburger t-bone ribeye ham prosciutto bresaola.</dd>
+  <dt>Pancetta flank sirloin pork</dt>
+  <dd>short ribs shankle prosciutto landjaeger. Beef ribs turkey shoulder drumstick. Leberkas pork belly ribeye, bresaola jerky strip steak tenderloin bacon landjaeger short ribs beef ribs. Flank pork chop fatback tail kielbasa filet mignon jowl landjaeger bresaola tongue corned beef biltong. Landjaeger spare ribs fatback corned beef tenderloin drumstick, swine chicken beef turkey biltong doner tri-tip filet mignon. </dd>
+</dl>
+
+
+			<div class="page-meta">
+				<ul class="side-nav">
+					<li class="subheader">Date: 05.07.2014</li>
+					<li class="subheader">Archived in TYPOGRAPHY · DESIGN · ELEMENTS</li>
+					<li class="divider"></li>
+				</ul>
+			</div>
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
+</script>
+</body>
+</html>

_site/documentation/index.html

@@ -0,0 +1,379 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Theme Documentation</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead-no-image-header">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li class="active"><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">How to use Feeling Responsive</p>
+				<h1>Theme Documentation</h1>
+			</header>
+
+			
+				<p class="teaser">
+					The documentation is not ready yet...
+				</p>
+			
+						
+			<p>If you’re curious, just have a look into the templates.</p>
+
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/no");
+</script>
+</body>
+</html>

_site/feed.xml

@@ -0,0 +1,170 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
+  <channel>
+    <title>Feeling Responsive</title>
+    <description>Feeling Responsive is built on the fabulous Foundation Framework and comes with lots of features to show your content right.</description>
+    <link>http://localhost:4000/</link>
+    <atom:link href="http://localhost:4000/feed.xml" rel="self" type="application/rss+xml" />
+    
+      <item>
+        <title>Possibilites to style your Post</title>
+        <description>&lt;h2 id=&quot;subtitles&quot;&gt;Subtitles&lt;/h2&gt;
+
+&lt;h2 id=&quot;feature-images&quot;&gt;Feature Images&lt;/h2&gt;
+
+&lt;h2 id=&quot;header-images&quot;&gt;Header Images&lt;/h2&gt;
+
+&lt;p&gt;You can choose to show a special full-width header image or not.&lt;/p&gt;
+
+&lt;h2 id=&quot;meta-data&quot;&gt;Meta-Data&lt;/h2&gt;
+</description>
+        <pubDate>Fri, 18 Jul 2014 00:00:00 +0200</pubDate>
+        <link>http://localhost:4000/design/elements/</link>
+        <guid isPermaLink="true">http://localhost:4000/design/elements/</guid>
+      </item>
+    
+      <item>
+        <title>The Grid</title>
+        <description>&lt;p&gt;&lt;em&gt;Feeling Responsive&lt;/em&gt; is built on Foundation. And of course, we make use of the wonderful grid system and so can you. Find out more about &lt;a href=&quot;http://foundation.zurb.com/docs/components/grid.html&quot;&gt;constructing  beautiful layouts&lt;/a&gt; in the foundation documentation.&lt;/p&gt;
+
+&lt;h2 id=&quot;large-displays&quot;&gt;Large Displays&lt;/h2&gt;
+
+&lt;h3 id=&quot;two-columns&quot;&gt;Two Columns&lt;/h3&gt;
+
+&lt;div class=&quot;row&quot;&gt;
+  &lt;div class=&quot;large-6 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/500x281/6b6351/e1dcd7&amp;amp;text=Width+500+Pixel&quot; /&gt;
+  &lt;/div&gt;
+  &lt;div class=&quot;large-6 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/500x281/e05a10/e1e75e&amp;amp;text=Width+500+Pixel&quot; /&gt;
+  &lt;/div&gt;
+&lt;/div&gt;
+
+&lt;h3 id=&quot;three-columns&quot;&gt;Three Columns&lt;/h3&gt;
+
+&lt;div class=&quot;row&quot;&gt;
+  &lt;div class=&quot;large-4 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/333x170/6b6351/e1dcd7&amp;amp;text=Width+333+Pixel&quot; /&gt;
+  &lt;/div&gt;
+  &lt;div class=&quot;large-4 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/333x170/e05a10/e1e75e&amp;amp;text=Width+333+Pixel&quot; /&gt;
+  &lt;/div&gt;
+  &lt;div class=&quot;large-4 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/333x170/fabb00/771e1e&amp;amp;text=Width+333+Pixel&quot; /&gt;
+  &lt;/div&gt;
+&lt;/div&gt;
+
+&lt;h3 id=&quot;four-columns&quot;&gt;Four Columns&lt;/h3&gt;
+
+&lt;div class=&quot;row&quot;&gt;
+  &lt;div class=&quot;large-3 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/250x141/6b6351/e1dcd7&amp;amp;text=Width+250+Pixel&quot; /&gt;
+  &lt;/div&gt;
+  &lt;div class=&quot;large-3 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/250x141/e05a10/e1e75e&amp;amp;text=Width+250+Pixel&quot; /&gt;
+  &lt;/div&gt;
+  &lt;div class=&quot;large-3 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/250x141/fabb00/771e1e&amp;amp;text=Width+250+Pixel&quot; /&gt;
+  &lt;/div&gt;
+  &lt;div class=&quot;large-3 columns&quot;&gt;
+      &lt;img src=&quot;http://placehold.it/250x141/00792c/acca57&amp;amp;text=Width+250+Pixel&quot; /&gt;
+  &lt;/div&gt;
+&lt;/div&gt;
+
+</description>
+        <pubDate>Sat, 05 Jul 2014 09:00:00 +0200</pubDate>
+        <link>http://localhost:4000/design/grid/</link>
+        <guid isPermaLink="true">http://localhost:4000/design/grid/</guid>
+      </item>
+    
+      <item>
+        <title>This is the &amp;lt;h1&amp;gt;-Headline</title>
+        <description>&lt;h1 id=&quot;lth1gt-headline&quot;&gt;&amp;lt;h1&amp;gt;-Headline&lt;/h1&gt;
+
+&lt;h2 id=&quot;lth2gt-headline&quot;&gt;&amp;lt;h2&amp;gt;-Headline&lt;/h2&gt;
+
+&lt;h3 id=&quot;lth3gt-headline&quot;&gt;&amp;lt;h3&amp;gt;-Headline&lt;/h3&gt;
+
+&lt;h4 id=&quot;lth4gt-headline&quot;&gt;&amp;lt;h4&amp;gt;-Headline&lt;/h4&gt;
+
+&lt;h5 id=&quot;lth5gt-headline&quot;&gt;&amp;lt;h5&amp;gt;-Headline&lt;/h5&gt;
+
+&lt;h6 id=&quot;lth6gt-headline&quot;&gt;&amp;lt;h6&amp;gt;-Headline&lt;/h6&gt;
+
+&lt;hr /&gt;
+
+&lt;ol&gt;
+  &lt;li&gt;Ordered List&lt;/li&gt;
+  &lt;li&gt;Second List Item&lt;/li&gt;
+  &lt;li&gt;Third List Item&lt;/li&gt;
+  &lt;li&gt;Fourth List Item&lt;/li&gt;
+  &lt;li&gt;Fifth List Item&lt;/li&gt;
+&lt;/ol&gt;
+
+&lt;hr /&gt;
+
+&lt;dl&gt;
+  &lt;dt&gt;Definition List&lt;/dt&gt;
+  &lt;dd&gt;Bacon ipsum dolor sit amet spare ribs brisket ribeye, andouille sirloin bresaola frankfurter corned beef capicola bacon. Salami beef ribs sirloin, short loin hamburger shoulder t-bone.&lt;/dd&gt;
+  &lt;dt&gt;Beef ribs jowl swine porchetta&lt;/dt&gt;
+  &lt;dd&gt;Sirloin tenderloin swine frankfurter pork loin pork capicola ham hock strip steak ribeye beef ribs. Hamburger t-bone ribeye ham prosciutto bresaola.&lt;/dd&gt;
+  &lt;dt&gt;Pancetta flank sirloin pork&lt;/dt&gt;
+  &lt;dd&gt;short ribs shankle prosciutto landjaeger. Beef ribs turkey shoulder drumstick. Leberkas pork belly ribeye, bresaola jerky strip steak tenderloin bacon landjaeger short ribs beef ribs. Flank pork chop fatback tail kielbasa filet mignon jowl landjaeger bresaola tongue corned beef biltong. Landjaeger spare ribs fatback corned beef tenderloin drumstick, swine chicken beef turkey biltong doner tri-tip filet mignon. &lt;/dd&gt;
+&lt;/dl&gt;
+</description>
+        <pubDate>Sat, 05 Jul 2014 09:00:00 +0200</pubDate>
+        <link>http://localhost:4000/design/this-is-h1-headline/</link>
+        <guid isPermaLink="true">http://localhost:4000/design/this-is-h1-headline/</guid>
+      </item>
+    
+      <item>
+        <title>Post With Right Sidebar</title>
+        <description>&lt;h2 id=&quot;have-a-look-at-the-sidebar&quot;&gt;Have a look at the sidebar&lt;/h2&gt;
+
+&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.&lt;/p&gt;
+
+&lt;h3 id=&quot;lorem&quot;&gt;Lorem&lt;/h3&gt;
+
+&lt;p&gt;Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;/p&gt;
+
+&lt;p&gt;Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;/p&gt;
+</description>
+        <pubDate>Fri, 28 Mar 2014 01:00:00 +0100</pubDate>
+        <link>http://localhost:4000/design/post-right-sidebar/</link>
+        <guid isPermaLink="true">http://localhost:4000/design/post-right-sidebar/</guid>
+      </item>
+    
+      <item>
+        <title>Post With Left Sidebar</title>
+        <description>&lt;h2 id=&quot;have-a-look-at-the-sidebar&quot;&gt;Have a look at the sidebar&lt;/h2&gt;
+
+&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.&lt;/p&gt;
+
+&lt;p&gt;Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;/p&gt;
+
+&lt;p&gt;Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;/p&gt;
+</description>
+        <pubDate>Fri, 28 Mar 2014 01:00:00 +0100</pubDate>
+        <link>http://localhost:4000/design/post-left-sidebar/</link>
+        <guid isPermaLink="true">http://localhost:4000/design/post-left-sidebar/</guid>
+      </item>
+    
+      <item>
+        <title>Normal Post</title>
+        <description>&lt;h2 id=&quot;look&quot;&gt;Look!&lt;/h2&gt;
+
+&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.&lt;/p&gt;
+
+&lt;h3 id=&quot;lorem&quot;&gt;Lorem&lt;/h3&gt;
+
+&lt;p&gt;Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;/p&gt;
+
+&lt;p&gt;Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;/p&gt;
+</description>
+        <pubDate>Fri, 28 Mar 2014 01:00:00 +0100</pubDate>
+        <link>http://localhost:4000/design/post/</link>
+        <guid isPermaLink="true">http://localhost:4000/design/post/</guid>
+      </item>
+    
+  </channel>
+</rss>

_site/humans.txt

@@ -0,0 +1,8 @@
+/* Foundation was made by ZURB, an interaction design and design strategy firm in Campbell, CA */
+/* zurb.com */
+/* humanstxt.org */
+
+/* SITE */
+  Standards: HTML5, CSS3
+  Components: jQuery, Orbit, Reveal
+  Software: Coda, Textmate, Git

_site/index.html

@@ -0,0 +1,405 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Feeling Responsive – A theme based on foundation</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li class="active"><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	<div id="header-home">
+    <div class="row">
+        <div class="small-12 columns">
+        </div><!-- /.medium-4.columns -->
+    </div><!-- /.row -->
+</div><!-- /#header-home -->
+
+
+
+<div class="row top-30">
+
+    <div class="medium-4 columns">
+    	<a href="http://localhost:4000/portfolio/"><img src="http://localhost:4000/assets/img/unsplash_1.jpg" alt=""></a>
+        <h2>Portfolio</h2>
+    	<p>
+    		<em>Feeling Responsive</em> supports you with layouts to present your favorite and actual work. With the gallery- and portfolio-template you can show off your work as a designer, programmer, photographer or artist.
+    	</p>
+
+        <p><a class="button tiny radius" href="http://localhost:4000/portfolio/">More ›</a></p>
+
+    </div><!-- /.medium-4.columns -->
+
+
+    <div class="medium-4 columns">
+    	<a href="http://localhost:4000/about/"><img src="http://localhost:4000/assets/img/unsplash_2.jpg" alt=""></a>
+        
+        <h2>Why use this theme?</h2>
+
+<p>
+	<em>Feeling Responsive</em> is heavily built on <a href="http://foundation.zurb.com/">Foundation</a>, the fabulous responsive webdesign framework by Zurb. It supports a 12-column grid, persuades you with beautiful <a href="/typography/">typography</a> and is heavily optimized for speed.
+</p>
+
+
+
+        <p><a class="button tiny radius" href="http://localhost:4000/about/">More ›</a></p>
+    </div><!-- /.medium-4.columns -->
+
+
+    <div class="medium-4 columns">
+    	<a href="http://localhost:4000/blog/"><img src="http://localhost:4000/assets/img/unsplash_4.jpg" alt=""></a>
+        <h2>Blog</h2>
+    	<p>
+    		Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+    	</p>
+        
+        <p><a class="button tiny radius" href="http://localhost:4000/blog/">More ›</a></p>
+
+    </div><!-- /.medium-4.columns -->
+
+</div><!-- /.row -->
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/header_unsplash_4.jpg");
+</script>
+</body>
+</html>

_site/portfolio/index.html

@@ -0,0 +1,410 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Show your beautiful work!</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead-no-image-header">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+<div class="row top-30">
+	<div class="small-12 columns">
+		<img src="http://localhost:4000/assets/img/unsplash_5.jpg" width="970" alt="Show your beautiful work!">
+	</div><!-- /.small-12.columns -->
+</div><!-- /.row -->
+
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Portfolio Template</p>
+				<h1>Show your beautiful work!</h1>
+			</header>
+
+			
+				<p class="teaser">
+					This is the portfolio template
+				</p>
+			
+						
+			<div class="row top-30">
+    <div class="medium-6 columns">
+        <img src="http://localhost:4000/assets/img/screenshot_website_moritz-mo-sauer_500x.jpg" alt="" />
+    </div><!-- /.medium-6.columns -->
+
+    <div class="medium-6 columns">
+        <img src="http://localhost:4000/assets/img/screenshot_website_jcorneille_500x.jpg" alt="" />
+    </div><!-- /.medium-6.columns -->
+</div>
+<!-- /.row -->
+
+<div class="row top-30">
+    <div class="medium-4 columns">
+        <img src="http://localhost:4000/assets/img/screenshot_website_stilwandel_500x.jpg" alt="" />
+    </div><!-- /.medium-4.columns -->
+
+    <div class="medium-4 columns">
+        <img src="http://localhost:4000/assets/img/screenshot_website_seminare_500x.jpg" alt="" />
+    </div><!-- /.medium-4.columns -->
+
+    <div class="medium-4 columns">
+        <img src="http://localhost:4000/assets/img/screenshot_website_nixdorf_500x.jpg" alt="" />
+    </div><!-- /.medium-4.columns -->
+</div>
+<!-- /.row -->
+
+
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/no");
+</script>
+</body>
+</html>

_site/robots.txt

@@ -0,0 +1,4 @@
+# www.robotstxt.org/
+# www.google.com/support/webmasters/bin/answer.py?hl=en&answer=156449
+
+User-agent: *

_site/sitemap.xml

@@ -0,0 +1,260 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+  
+    
+    <url>
+      <loc>http://localhost:4000/design/elements/</loc>
+      
+        <lastmod>2014-07-18T00:00:00+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.5</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/design/grid/</loc>
+      
+        <lastmod>2014-07-05T09:00:00+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.5</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/design/this-is-h1-headline/</loc>
+      
+        <lastmod>2014-07-05T09:00:00+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.5</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/design/post-right-sidebar/</loc>
+      
+        <lastmod>2014-03-28T01:00:00+01:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.5</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/design/post-left-sidebar/</loc>
+      
+        <lastmod>2014-03-28T01:00:00+01:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.5</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/design/post/</loc>
+      
+        <lastmod>2014-03-28T01:00:00+01:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.5</priority>
+      
+    </url>
+    
+  
+  
+    
+    <url>
+      <loc>http://localhost:4000/about/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/blog/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/changelog/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/documentation/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/feed.xml</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/portfolio/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/sitemap.xml</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/design/style-guide/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/typography/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+    
+    <url>
+      <loc>http://localhost:4000/blog/page2/</loc>
+      
+        <lastmod>2014-08-20T20:26:34+02:00</lastmod>
+      
+      
+        <changefreq>monthly</changefreq>
+      
+      
+        <priority>0.3</priority>
+      
+    </url>
+    
+  
+</urlset>

_site/typography/index.html

@@ -0,0 +1,555 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+	<title>Wonderful   Typography</title>
+	<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">	
+	<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
+	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
+
+	<meta name="google-site-verification" content="" />
+
+
+	<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
+
+
+	<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+	<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
+
+</head>
+<body>
+	
+
+	<div id="masthead-no-image-header">
+		<div class="row">
+			<div class="small-12 columns">
+				<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
+					<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
+				</a>
+	 		</div><!-- /.small-12.columns -->
+		</div><!-- /.row -->
+	</div><!-- /#masthead -->
+
+
+
+
+	
+<div id="navigation" class="contain-to-grid sticky">
+  <nav class="top-bar" data-topbar>
+    <ul class="title-area">
+      <li class="name"></li>
+       <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
+      <li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
+    </ul>
+    <section class="top-bar-section">
+
+      <ul class="right">
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+              
+
+          
+          
+        
+
+              
+                
+                
+
+          
+          
+            
+            
+              <li class="divider"></li>
+              <li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
+
+            
+            
+          
+        
+        
+      </ul>
+
+      <ul class="left">
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/index.html">Start</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+
+              <li class="has-dropdown">
+                <a href="http://localhost:4000/design/style-guide/">Style your content</a>
+
+                  <ul class="dropdown">
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
+                    
+
+                      
+                        
+                      
+
+                      <li><a href="http://localhost:4000/typography/">Typography</a></li>
+                    
+                  </ul>
+                  
+              </li>
+              <li class="divider"></li>
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/documentation/">Documentation</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/blog/">Blog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+              
+
+          
+          
+
+            
+            
+              <li><a href="http://localhost:4000/changelog/">Changelog</a></li>
+              <li class="divider"></li>
+
+            
+            
+          
+        
+
+              
+                
+                
+
+          
+          
+        
+        
+      </ul>
+    </section>
+  </nav>
+</div><!-- /#navigation -->
+
+
+	
+<div class="row top-30">
+	<div class="small-12 columns">
+		<img src="http://localhost:4000/assets/img/unsplash_5.jpg" width="970" alt="Wonderful   Typography">
+	</div><!-- /.small-12.columns -->
+</div><!-- /.row -->
+
+
+<div class="row top-30">
+	<div class="medium-offset-2 medium-8 end columns">
+
+		<article>
+			<header>
+				<p class="subtitle">Reading Experience</p>
+				<h1>Wonderful   Typography</h1>
+			</header>
+
+			
+				<p class="teaser">
+					Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+				</p>
+			
+						
+			<p>Noch mehr Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<h2 id="second-lth2gt-heading">Second &lt;h2&gt;-Heading</h2>
+
+<blockquote>
+  <p>Sirloin tenderloin swine frankfurter pork loin pork capicola ham hock strip steak ribeye beef ribs. Hamburger t-bone ribeye ham prosciutto bresaola.</p>
+</blockquote>
+
+<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<h3 id="third-lth3gt-heading">Third &lt;h3&gt;-Heading</h3>
+
+<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
+
+<ul>
+  <li>Some Bulletpoints</li>
+  <li>Some Bulletpoints</li>
+  <li>Some Bulletpoints</li>
+  <li>Some Bulletpoints</li>
+  <li>Some Bulletpoints</li>
+</ul>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<h4 id="forth-lth4gt-heading">Forth &lt;h4&gt;-Heading</h4>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<h4 id="fifth-lth5gt-heading">Fifth &lt;h5&gt;-Heading</h4>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+
+<h2 id="typographical-elements">Typographical Elements</h2>
+
+<p>Here you’ll find the <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/HTML5_element_list">complete list of HTML5-Tags</a> and this is how they look like.</p>
+
+<h3 id="lthrgt-horizontal-lines">&lt;hr&gt; Horizontal Lines</h3>
+<hr />
+
+<h3 id="ltpregt-displaying-code">&lt;pre&gt; Displaying Code</h3>
+<pre><code>    &lt;html&gt;
+        &lt;head&gt;
+            &lt;title&gt;Code Blocks&lt;/title&gt;
+        &lt;/head&gt;
+        &lt;body&gt;&lt;/body&gt;
+    &lt;/html&gt;
+</code></pre>
+
+<h3 id="ltblockquotegt-quotation">&lt;blockquote&gt; Quotation</h3>
+<blockquote>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</blockquote>
+
+<h3 id="ltolgt-ordered-lists">&lt;ol&gt; Ordered Lists</h3>
+<ol>
+  <li>One</li>
+  <li>Two</li>
+  <li>Three
+    <ol>
+      <li>Second Level One</li>
+      <li>Second Level Two</li>
+      <li>Second Level Three
+        <ol>
+          <li>And a third level one</li>
+          <li>And a third level two</li>
+          <li>And a third level three</li>
+        </ol>
+      </li>
+    </ol>
+  </li>
+  <li>Four</li>
+  <li>Five</li>
+</ol>
+
+<h3 id="ltulgt-unordered-lists">&lt;ul&gt; Unordered Lists</h3>
+<ul>
+  <li>One item
+    <ul>
+      <li>Second Level Item One</li>
+      <li>Second Level Item Two</li>
+      <li>Second Level Item Three
+        <ul>
+          <li>Third Level One</li>
+          <li>Third Level Two</li>
+          <li>Third Level Three</li>
+        </ul>
+      </li>
+    </ul>
+  </li>
+  <li>Second item</li>
+  <li>Third item</li>
+  <li>Fourth item</li>
+  <li>Fifth item and so on…</li>
+</ul>
+
+<h3 id="ltdlgt-definition-lists">&lt;dl&gt; Definition Lists</h3>
+
+<dl>
+    <dt>Definition Lists</dt>
+    <dd>are beautiful</dd>
+    <dd>organize content</dd>
+    <dt>Definition Lists</dt>
+    <dd>Item One</dd>
+    <dt>Definition Lists</dt>
+    <dd>One more Item</dd>
+</dl>
+
+<h3 id="ltagt">&lt;a&gt;</h3>
+<p><a href="http://phlow.de/">Links</a> make the web exceptional.</p>
+
+<h3 id="ltemgt">&lt;em&gt;</h3>
+<p>Let’s <em>emphasize</em> how important responsive webdesign is.</p>
+
+<h3 id="ltstronggt">&lt;strong&gt;</h3>
+<p>This looks like <strong>bold</strong> text.</p>
+
+<h3 id="ltsmallgt">&lt;small&gt;</h3>
+<p><small>This is small text.</small></p>
+
+<h3 id="ltsgt">&lt;s&gt;</h3>
+
+<h3 id="ltcitegt">&lt;cite&gt;</h3>
+
+<h3 id="ltqgt">&lt;q&gt;</h3>
+
+<h3 id="ltdfngt">&lt;dfn&gt;</h3>
+
+<h3 id="ltabbrgt">&lt;abbr&gt;</h3>
+
+<h3 id="lttimegt">&lt;time&gt;</h3>
+
+<h3 id="ltcodegt">&lt;code&gt;</h3>
+
+<h3 id="ltvargt">&lt;var&gt;</h3>
+
+<h3 id="ltsampgt">&lt;samp&gt;</h3>
+
+<h3 id="ltkbdgt">&lt;kbd&gt;</h3>
+
+<h3 id="ltsubgt">&lt;sub&gt;</h3>
+
+<h3 id="ltigt">&lt;i&gt;</h3>
+
+<h3 id="ltbgt">&lt;b&gt;</h3>
+
+<h3 id="ltugt">&lt;u&gt;</h3>
+
+<h3 id="ltmarkgt">&lt;mark&gt;</h3>
+
+<h3 id="ltbrgt">&lt;br&gt;</h3>
+
+<h2 id="tables">Tables</h2>
+<p>&lt;table&gt;
+&lt;caption&gt;
+&lt;colgroup&gt;
+&lt;col&gt;
+&lt;tbody&gt;
+&lt;thead&gt;Tabellenspalten enthalten.
+&lt;tfoot&gt;Tabellenspalten enthalten.
+&lt;tr&gt;    Steht für eine Zeile mit Tabellenzellen.
+&lt;td&gt;    Kennzeichnet eine einzelne Tabellenzelle.
+&lt;th&gt;</p>
+
+
+		</article>
+
+	</div><!-- /.medium-8.columns -->
+</div><!-- /.row -->
+
+
+
+
+			<footer id="footer-content" class="bg-grau">
+			<div id="footer">
+				<div class="row">
+					<div class="medium-6 large-5 columns">
+						<h5 class="black-shadow">About this Website</h5>
+
+						<p class="black-shadow">
+							»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
+						</p>
+					</div><!-- /.large-6.columns -->
+
+
+					<div class="small-6 medium-3 large-3 large-offset-1 columns">
+						<aside>
+							<div class="textwidget">
+								<h5 class="black-shadow">Services</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="contact.html">Contact</a></li>
+									<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
+									<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
+								</ul>
+							</div>
+						</aside>
+					</div><!-- /.large-4.columns -->
+
+
+					<div class="small-6 medium-3 large-3 columns">
+								<h5 class="black-shadow">Thank You!</h5>
+								<ul class="no-bullet black-shadow">
+									<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
+									<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
+									<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
+									<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
+								</ul>
+					</div><!-- /.large-3.columns -->
+				</div><!-- /.row -->
+
+				<div class="row">
+					<div class="small-12 columns" style="text-align: right;">
+						<a class="entypo entypo-48" href="#masthead">&#59231;</a>
+					</div><!-- /.small-12.columns -->
+				</div><!-- /.row -->
+
+			</div><!-- /#footer -->
+
+
+			<div id="subfooter">
+				<nav class="row">
+					<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
+						<ul class="inline-list">
+							<li><a href="http://localhost:4000/about/">About</a></li>
+							<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
+						</ul>
+					</section>
+
+					<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
+						<ul class="inline-list">
+						
+							<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
+						
+							<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
+						
+							<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
+						
+							<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
+						
+							<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
+						
+							<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
+						
+							<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
+						
+							<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
+						
+						</ul>
+					</section>
+				</nav>
+			</div><!-- /#subfooter -->
+		</footer>
+
+	
+	  <script src="http://localhost:4000/assets/js/app.min.js"></script>
+
+<script>
+    $("#masthead").backstretch("http://localhost:4000/assets/img/no");
+</script>
+</body>
+</html>

about.md

@@ -0,0 +1,15 @@
+---
+layout: page
+title: "About"
+subtitle: "Why another Jekyll template?"
+description: "Since years I am programming and designing websites, love to work with open source tools and learn via code from others. I wanted to try to give something back..."
+image_header: "no"
+permalink: "/about/"
+---
+...and learn at the same time.
+
+*Feeling Responsive* is my first theme and let into the world. It's built on work and knowledge of others. While I am still programming it, you read about whats behind this theme in the – hopefully – near future.
+
+Since then, fork it!
+
+Yours sincerelly, Moritz »mo.« Sauer

assets/fonts/entypo-social.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"><defs><font horiz-adv-x="555"><font-face font-family="Entypo Social" ascent="750" descent="-250" alphabetic="0"/></font></defs></svg>

assets/fonts/entypo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"><defs><font horiz-adv-x="508"><font-face font-family="Entypo" ascent="750" descent="-250" alphabetic="0"/></font></defs></svg>