From: Kai Moritz <km@juplo.de>
Date: Tue, 2 Sep 2014 12:51:13 +0000 (+0200)
Subject: Umstellung auf Thymeleaf: Schritt 3 RELOADED - Thymleaf mit LayoutDialect
X-Git-Tag: thymeroot-2.0.0~95
X-Git-Url: http://juplo.de/gitweb/?a=commitdiff_plain;h=5f04e60da58d3f37fbb2ad983ec7415ad54ff562;p=website

Umstellung auf Thymeleaf: Schritt 3 RELOADED - Thymleaf mit LayoutDialect
---

diff --git a/pom.xml b/pom.xml
index 256cbbc3..6e9bc67b 100644
--- a/pom.xml
+++ b/pom.xml
@@ -45,8 +45,7 @@
     <slf4j.version>1.6.1</slf4j.version>
     <springframework.version>4.0.6.RELEASE</springframework.version>
     <thymeleaf.version>2.1.3.RELEASE</thymeleaf.version>
-    <thymeleaf-extras.version>2.1.1.RELEASE</thymeleaf-extras.version>
-    <tiles.version>2.2.2</tiles.version>
+    <thymeleaf-layout-dialect.version>1.2.5</thymeleaf-layout-dialect.version>
     <wro4j.version>1.7.3-SNAPSHOT</wro4j.version>
 
   </properties>
@@ -81,56 +80,11 @@
       <scope>runtime</scope>
     </dependency>
     <dependency>
-      <groupId>org.thymeleaf.extras</groupId>
-      <artifactId>thymeleaf-extras-tiles2</artifactId>
-      <version>${thymeleaf-extras.version}</version>
-      <exclusions>
-        <exclusion>
-          <groupId>org.thymeleaf</groupId>
-          <artifactId>thymeleaf</artifactId>
-        </exclusion>
-        <exclusion>
-          <groupId>org.thymeleaf</groupId>
-          <artifactId>thymeleaf-spring4</artifactId>
-        </exclusion>
-      </exclusions>
+      <groupId>nz.net.ultraq.thymeleaf</groupId>
+      <artifactId>thymeleaf-layout-dialect</artifactId>
+      <version>${thymeleaf-layout-dialect.version}</version>
       <scope>runtime</scope>
     </dependency>
-    <dependency>
-      <groupId>org.thymeleaf.extras</groupId>
-      <artifactId>thymeleaf-extras-tiles2-spring4</artifactId>
-      <version>${thymeleaf-extras.version}</version>
-      <exclusions>
-        <exclusion>
-          <groupId>org.thymeleaf</groupId>
-          <artifactId>thymeleaf</artifactId>
-        </exclusion>
-        <exclusion>
-          <groupId>org.thymeleaf</groupId>
-          <artifactId>thymeleaf-spring4</artifactId>
-        </exclusion>
-      </exclusions>
-      <scope>runtime</scope>
-    </dependency>
-
-    <!-- Tiles -->
-    <dependency>
-      <groupId>org.apache.tiles</groupId>
-      <artifactId>tiles-core</artifactId>
-      <version>${tiles.version}</version>
-      <exclusions>
-        <exclusion>
-          <groupId>org.slf4j</groupId>
-          <artifactId>jcl-over-slf4j</artifactId>
-        </exclusion>
-      </exclusions>
-      <scope>runtime</scope>
-    </dependency>
-    <dependency>
-      <groupId>org.apache.tiles</groupId>
-      <artifactId>tiles-servlet</artifactId>
-      <version>${tiles.version}</version>
-    </dependency>
 
     <!-- Servlet -->
     <dependency>
diff --git a/src/main/java/de/juplo/branding/web/ForceIncludeFilter.java b/src/main/java/de/juplo/branding/web/ForceIncludeFilter.java
deleted file mode 100644
index 953e8b23..00000000
--- a/src/main/java/de/juplo/branding/web/ForceIncludeFilter.java
+++ /dev/null
@@ -1,55 +0,0 @@
-package de.juplo.branding.web;
-
-import java.io.IOException;
-import javax.servlet.Filter;
-import javax.servlet.FilterChain;
-import javax.servlet.FilterConfig;
-import javax.servlet.ServletException;
-import javax.servlet.ServletRequest;
-import javax.servlet.ServletResponse;
-import javax.servlet.http.HttpServletRequest;
-import javax.servlet.http.HttpServletResponse;
-import org.apache.tiles.servlet.context.ServletUtil;
-
-
-
-/**
- * Fixes a logic-bug in the colaboration of Thymeleaf and Tiles.
- *
- * Tiles 2.2.x tries to use RequestDispatcher.forward() whenever possible, but
- * this breaks Thymeleaf, because the original response is marked as committed,
- * when forwarding. Hence, Thymeleaf cannot render its result in the response
- * and an empty page is returned.
- * 
- * @author kai
- */
-public class ForceIncludeFilter implements Filter
-{
-
-  @Override
-  public void init(FilterConfig filterConfig) throws ServletException
-  {
-  }
-
-  @Override
-  public void doFilter(
-      ServletRequest request,
-      ServletResponse response,
-      FilterChain chain
-      )
-      throws
-        IOException,
-        ServletException
-  {
-    if ((response instanceof HttpServletResponse))
-      ServletUtil.setForceInclude((HttpServletRequest)request, true);
- 
-    chain.doFilter(request, response);
-  }
-
-  @Override
-  public void destroy()
-  {
-  }
-  
-}
diff --git a/src/main/resources/spring/mvc.xml b/src/main/resources/spring/mvc.xml
index 87c2a010..4bf0a0a4 100644
--- a/src/main/resources/spring/mvc.xml
+++ b/src/main/resources/spring/mvc.xml
@@ -44,26 +44,6 @@
   <!-- Thymeleaf Spring-View-Resolver -->
   <bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
     <property name="templateEngine" ref="templateEngine" />
-    <property name="viewNames" value="views/*,templates/*"/>
-    <property name="order" value="1"/>
-  </bean>
-
-  <!-- Thymeleaf Tiles-View-Resolver -->
-  <bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
-    <property name="templateEngine" ref="templateEngine" />
-    <property name="viewClass" value="org.thymeleaf.extras.tiles2.spring4.web.view.ThymeleafTilesView"/>
-    <property name="order" value="2"/>
-  </bean>
-
-
-  <!-- Thymeleaf Tiles-Configurer -->
-  <bean class="org.thymeleaf.extras.tiles2.spring4.web.configurer.ThymeleafTilesConfigurer">
-    <property name="definitions">
-      <list>
-        <value>classpath:/spring/tiles.xml</value>
-      </list>
-    </property>
-    <property name="useMutableTilesContainer" value="true"/>
   </bean>
 
 
@@ -80,7 +60,7 @@
     <property name="templateResolver" ref="templateResolver" />
     <property name="additionalDialects">
       <util:set>
-        <bean class="org.thymeleaf.extras.tiles2.dialect.TilesDialect"/>
+        <bean class="nz.net.ultraq.thymeleaf.LayoutDialect"/>
       </util:set>
     </property>
   </bean>
diff --git a/src/main/resources/spring/tiles.xml b/src/main/resources/spring/tiles.xml
deleted file mode 100644
index f77fb859..00000000
--- a/src/main/resources/spring/tiles.xml
+++ /dev/null
@@ -1,55 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" ?>
-<!DOCTYPE tiles-definitions PUBLIC
-       "-//Apache Software Foundation//DTD Tiles Configuration 2.1//EN"
-       "http://tiles.apache.org/dtds/tiles-config_2_1.dtd">
-<tiles-definitions>
-
-  <!--
-    Main definition that uses layout.html to put title and content attributes from
-    Thymeleaf fragments; {1} will be evaluated to either 'list', 'form' or 'view'.
-  -->
-  <definition name="*" template="templates/html5page">
-    <put-attribute name="title" value="views/{1} :: title"/>
-    <put-attribute name="htmlhead" value="templates/defaults :: htmlhead"/>
-    <put-attribute name="header" value="templates/defaults :: header"/>
-    <put-attribute name="breadcrumb" value="views/{1} :: breadcrumb"/>
-    <put-attribute name="maincontent" value="templates/defaults :: maincontent"/>
-    <put-attribute name="contentclass" value="test" type="string"/>
-    <put-attribute name="marginalcontent" value="views/{1} :: marginalcontent"/>
-    <put-attribute name="navigation" value="views/{1} :: navigation"/>
-    <put-attribute name="footer" value="templates/defaults :: footer"/>
-  </definition>
-
-  <!-- Make JSP-templates available through a view-name -->
-  <definition name="jsp/**" template="/WEB-INF/templates/{1}.jsp" templateType="jsp"/>
-
-  <definition name="BASEPAGE" template="/WEB-INF/templates/html5page.jsp">
-    <put-attribute name="title" value="TITLE IS MISSING" type="string" cascade="true"/>
-    <put-attribute name="htmlhead" value="/WEB-INF/templates/html-head.jsp" type="template"/>
-    <put-attribute name="header" value="/WEB-INF/templates/header.jsp" type="template"/>
-    <put-attribute name="breadcrumb" value="BREADCRUMB IS MISSING" type="string"/>
-    <put-attribute name="contentcontainer" value="/WEB-INF/templates/article.jsp" type="template"/>
-    <put-attribute name="maincontent" value="/WEB-INF/templates/maincontent.jsp" type="template" cascade="true"/>
-    <put-attribute name="contentclass" value="menu" type="string"/>
-    <put-attribute name="marginalcontent" value="/WEB-INF/templates/marginalcontent.jsp" type="template"/>
-    <put-attribute name="navigation" value="/WEB-INF/templates/navigation.jsp" type="template"/>
-    <put-attribute name="footer" value="/WEB-INF/templates/footer.jsp" type="template"/>
-  </definition>
-
-  <definition name="NOMENU" extends="BASEPAGE">
-    <put-attribute name="contentclass" value="nomenu" type="string"/>
-  </definition>
-
-  <definition name="test" extends="BASEPAGE">
-    <put-attribute name="breadcrumb" value="/WEB-INF/templates/test/breadcrumb.jsp" type="template"/>
-    <put-attribute name="navigation" value="/WEB-INF/templates/test/navigation.jsp" type="template"/>
-    <put-attribute name="maincontent" value="/WEB-INF/templates/test/experimente.jsp" type="template"/>
-  </definition>
-
-  <definition name="TESTLAB" template="/WEB-INF/templates/testlab.jsp">
-    <put-attribute name="htmlhead" value="/WEB-INF/templates/html-head.jsp" type="template"/>
-    <put-attribute name="title" value="TEST-TITLE IS MISSING" type="string"/>
-    <put-attribute name="content" value="&lt;div class='testlab'&gt;TEST-CONTENT IS MISSING&lt;div&gt;" type="string"/>
-  </definition>
-
-</tiles-definitions>
diff --git a/src/main/webapp/WEB-INF/templates/about.jsp b/src/main/webapp/WEB-INF/templates/about.jsp
deleted file mode 100644
index cc3f87f6..00000000
--- a/src/main/webapp/WEB-INF/templates/about.jsp
+++ /dev/null
@@ -1,12 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<aside class="m">
-  <h1>What the f*#!@ is an <em>Impressum</em> ?!?</h1>
-  The german law enforces the so called <em>Impressum</em> to enable
-  customers to easily find out all juristically relevant informations
-  about the company, that rules a site.
-  <h1>Find out more...</h1>
-  If you just want to learn more about juplo you should better
-  <a href="${base}about.html" title="Learn more about juplo now">visit our about-pages</a>.
-</aside>
diff --git a/src/main/webapp/WEB-INF/templates/article.jsp b/src/main/webapp/WEB-INF/templates/article.jsp
deleted file mode 100644
index d1450803..00000000
--- a/src/main/webapp/WEB-INF/templates/article.jsp
+++ /dev/null
@@ -1,8 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<article id="content" class="main">
-  <header><h1><t:getAsString name="title"/></h1></header>
-  <t:insertAttribute name="maincontent"/>
-</article>
diff --git a/src/main/webapp/WEB-INF/templates/footer.jsp b/src/main/webapp/WEB-INF/templates/footer.jsp
deleted file mode 100644
index 9c7005e6..00000000
--- a/src/main/webapp/WEB-INF/templates/footer.jsp
+++ /dev/null
@@ -1,6 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<li class="f" id="copyright">© <strong>mo</strong> 2013</li>
-<li class="f"><a class="f" href="${base}impressum.html">Impressum</a></li>
-<li class="f about"><a class="f" href="${base}about.html">About</a></li>
diff --git a/src/main/webapp/WEB-INF/templates/header.jsp b/src/main/webapp/WEB-INF/templates/header.jsp
deleted file mode 100644
index 3a27951d..00000000
--- a/src/main/webapp/WEB-INF/templates/header.jsp
+++ /dev/null
@@ -1,4 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<h1 id="logo"><a href="${base}index.html" title="Home" class="l">juplo</a></h1>
diff --git a/src/main/webapp/WEB-INF/templates/html-head.jsp b/src/main/webapp/WEB-INF/templates/html-head.jsp
deleted file mode 100644
index 1bc97384..00000000
--- a/src/main/webapp/WEB-INF/templates/html-head.jsp
+++ /dev/null
@@ -1,20 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<meta name="viewport" content="width=device-width, initial-scale=1" />
-<link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-<style type="text/css">
-  @import '${base}css/screen.css' screen;
-  @import '${base}css/print.css' print;
-</style>
-<script src="${base}js/base.js"></script>
-<!--[if IE 8]>
-  <link rel="stylesheet" type="text/css" href="${base}css/ie8.css" />
-  <script src="${base}js/ie8.js"></script>
-<![endif]-->
-<!--[if IE 7]>
-  <script src="${base}js/ie7.js"></script>
-<![endif]-->
-<!--[if lt IE 7]>
-  <script src="${base}js/ie6.js"></script>
-<![endif]-->
diff --git a/src/main/webapp/WEB-INF/templates/html5page.jsp b/src/main/webapp/WEB-INF/templates/html5page.jsp
deleted file mode 100644
index 5620fb2d..00000000
--- a/src/main/webapp/WEB-INF/templates/html5page.jsp
+++ /dev/null
@@ -1,47 +0,0 @@
-<!DOCTYPE html>
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<html>
-  <head>
-    <title>juplo - <t:getAsString name="title"/></title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-    <t:insertAttribute name="htmlhead"/>
-  </head>
-  <body id="top" class="<t:getAsString name="contentclass"/>" onload="prettyPrint()">
-    <div id="page" class="cf">
-      <header id="header">
-        <t:insertAttribute name="header"/>
-        <span id="slogan"><strong>Java</strong> bits from nerds for nerds</span>
-        <hr class="h" />
-      </header>
-      <div id="breadcrumb">
-        <strong class="b title">You are here:</strong>
-        <ol class="b">
-          <t:insertAttribute name="breadcrumb"/>
-        </ol>
-        <a class="hide" href="#nav" title="Show navigation menu">Jump to navigation</a>
-        <hr class="b" />
-      </div>
-      <main class="content cf">
-        <t:insertAttribute name="contentcontainer"/>
-        <div class="marginal">
-          <nav id="nav">
-            <hr class="n"/>
-            <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
-            <t:insertAttribute name="navigation"/>
-            <hr class="n"/>
-          </nav>
-          <t:insertAttribute name="marginalcontent" ignore="true"/>
-        </div>
-      </main>
-      <footer id="footer">
-        <hr class="f" />
-        <ul id="footerlinks">
-          <t:insertAttribute name="footer"/>
-        </ul>
-      </footer>
-    </div>
-  </body>
-</html>
diff --git a/src/main/webapp/WEB-INF/templates/maincontent.jsp b/src/main/webapp/WEB-INF/templates/maincontent.jsp
deleted file mode 100644
index f2a0fcf3..00000000
--- a/src/main/webapp/WEB-INF/templates/maincontent.jsp
+++ /dev/null
@@ -1,41 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
-<article id="content" class="main" tiles:fragment="maincontent">
-  <p>
-    <strong>Lorem ipsum</strong> dolor <a href="${base}projects/typo.html">sit amet</a>, consectetur adipisicing elit, sed do
-    eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
-    ad minim veniam, quis nostrud <a href="${base}projects/html-experimente.html">exercitation</a> 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>
-  <h2>Duis aute irure dolor</h2>
-  <ul>
-    <li>Operators and other mathematical stuff: <c:out value="-+/*"/></li>
-    <li>Characters offten used in programming languages: <c:out value="{(<>)}@$?%*#;:&/\!^\"'`~"/></li>
-    <li>Special german characters: <c:out value="ÄäÖöÜü"/></li>
-    <li>Other special characters: <c:out value="@€¢§%°"/></li>
-  </ul>
-  <h2>Excepteur sint occaecat cupidatat</h2>
-  <p>
-    Lorem ipsum dolor <em>sit amet</em>, 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>
-  <p>
-    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-    eiusmod tempor incididunt ut labore et dolore magna aliqua. <strong>Ut enim
-    ad minim veniam, quis nostrud <em>exercitation ullamco</em> laboris nisi ut
-    aliquip ex ea commodo consequat</strong>. 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>
-</article>
diff --git a/src/main/webapp/WEB-INF/templates/marginalcontent.jsp b/src/main/webapp/WEB-INF/templates/marginalcontent.jsp
deleted file mode 100644
index e8c225cb..00000000
--- a/src/main/webapp/WEB-INF/templates/marginalcontent.jsp
+++ /dev/null
@@ -1,21 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<aside class="m">
-  <h1>Other nasty but marginal stuff</h1>
-  <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>
-</aside>
-<aside class="m">
-  <h1>More nasty stuff</h1>
-  <p>
-    This one is really short!
-  </p>
-</aside>
diff --git a/src/main/webapp/WEB-INF/templates/navigation.jsp b/src/main/webapp/WEB-INF/templates/navigation.jsp
deleted file mode 100644
index 41aa3e5e..00000000
--- a/src/main/webapp/WEB-INF/templates/navigation.jsp
+++ /dev/null
@@ -1,10 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<h1 class="nav">Navigation</h1>
-<h2 class="nav menu">Section-Menu</h2>
-<ul id="menu" class="cf">
-  <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-  <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-  <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-</ul>
diff --git a/src/main/webapp/WEB-INF/templates/test/breadcrumb.jsp b/src/main/webapp/WEB-INF/templates/test/breadcrumb.jsp
deleted file mode 100644
index efe36728..00000000
--- a/src/main/webapp/WEB-INF/templates/test/breadcrumb.jsp
+++ /dev/null
@@ -1,6 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<li class="b"><a class="b" href="${base}index.html">Home</a></li>
-<li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-<li class="b"><a class="b" href="${base}projects/html-experimente.html">HTML-Experimente</a></li>
diff --git a/src/main/webapp/WEB-INF/templates/test/experimente.jsp b/src/main/webapp/WEB-INF/templates/test/experimente.jsp
deleted file mode 100644
index 752552cd..00000000
--- a/src/main/webapp/WEB-INF/templates/test/experimente.jsp
+++ /dev/null
@@ -1,36 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<h2>HTML-Elemente / spezielle Seiten</h2>
-<ul>
-  <li><a href="${base}test/formulare.html">Formulare</a></li>
-  <li><a href="${base}test/symbole.html">Symbol-Font</a></li>
-  <li><a href="${base}test/gibts-ja-gar-nicht.html">404-Fehlerseite</a></li>
-  <li><a href="${base}test/error.html">Fehlerseite für andere Fehler</a></li>
-</ul>
-<h2>Layout-Grenzfälle</h2>
-<ul>
-  <li><a href="${base}test/fast-leer-kein-menü.html">Fast leere Seite ohne Menü</a></li>
-  <li><a href="${base}test/fast-leer-kein-menü-aber-marginalinhalt.html">Fast leere Seite ohne Menü aber mit Marginal-Inhalt</a></li>
-  <li><a href="${base}test/fast-leer-mit-menü.html">Fast leere Seite mit Menü</a></li>
-  <li><a href="${base}test/fast-leer-mit-menü-und-marginalinhalt.html">Fast leere Seite mit Menü und Marginal-Inhalt</a></li>
-  <li><a href="${base}test/breadcrumb.html">Seite mit sehr langem Breadcrumb</a></li>
-</ul>
-<h2>Layout-Variationen</h2>
-<ul>
-  <li><a href="${base}test/kein-layout.html">Alle Stylings deaktiviert</a></li>
-  <li><a href="${base}test/basis-layout.html">Nur das Basis-Layout</a></li>
-  <li><a href="${base}test/druck-layout.html">Die für den Ausdruck angepasste Ansicht</a></li>
-  <li><a href="${base}test/tiny.html">Layout für sehr kleine Bildschirmgrößen</a></li>
-  <li><a href="${base}test/phone.html">Layout für Smartphones</a></li>
-  <li><a href="${base}test/tablet.html">Layout für Tablets</a></li>
-</ul>
-<h2>Testseiten für einzelne Seiten-Bestandteile</h2>
-<ul>
-  <li><a href="${base}test/seitenaufteilung.html">Nur das Basis-Layout und die Seitenaufteilung</a></li>
-  <li><a href="${base}test/seitenkopf.html">Nur das Basis-Layout und der Seitenkopf</a></li>
-</ul>
-<h2>Anderer Krams...</h2>
-<ul>
-  <li><a href="${base}test/testlab.html">Seite mit Breiten-Markierungen für den Tests von Media-Queries (Beispiel)</a></li>
-</ul>
diff --git a/src/main/webapp/WEB-INF/templates/test/navigation.jsp b/src/main/webapp/WEB-INF/templates/test/navigation.jsp
deleted file mode 100644
index 8188d1c8..00000000
--- a/src/main/webapp/WEB-INF/templates/test/navigation.jsp
+++ /dev/null
@@ -1,22 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<h1 class="nav">Navigation</h1>
-<h2 class="nav menu">Section-Menu</h2>
-<ul id="menu" class="cf">
-  <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-  <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-  <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-</ul>
-<h2 class="nav submenu">
-  <span class="s">Submenu for section</span>
-  <a class="s selected" href="${base}projects.html">Projects</a>
-</h2>
-<ul id="submenu" class="s active">
-  <li class="s sub"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-  <li class="s sub"><a href="${base}projects/fix-swf.html" class="s">fix-swf</a></li>
-  <li class="s"><a href="#" class="s">jquery.openx</a></li>
-  <li class="s"><a class="s selected" href="${base}projects/html-experimente.html">HTML-Experimente</a></li>
-  <li class="s sub"><a href="#" class="s">accelerator</a></li>
-  <li class="s"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-</ul>
diff --git a/src/main/webapp/WEB-INF/templates/testlab.jsp b/src/main/webapp/WEB-INF/templates/testlab.jsp
deleted file mode 100644
index 8f3df403..00000000
--- a/src/main/webapp/WEB-INF/templates/testlab.jsp
+++ /dev/null
@@ -1,74 +0,0 @@
-<!DOCTYPE html>
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<html>
-  <head>
-    <title>juplo - <t:getAsString name="title"/></title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-    <t:insertAttribute name="htmlhead"/>
-    <style type="text/css">
-
-      body {
-        margin: 0;
-        padding: 0;
-      }
-
-      .testlab
-      {
-        width: 100%;
-        text-indent: 0;
-        margin: 0 0 20px -320px;
-        background-color: #fff;
-      }
-      .testlab:after
-      {
-        content:"";
-        display:table;
-      }
-      .tl970
-      {
-        margin-left: 0px;
-        border-left: 970px solid green;
-        text-indent: -970px;
-        background-color: transparent;
-      }
-      .tl670
-      {
-        margin-left: -970px;
-        border-left: 670px solid yellow;
-        text-indent: -670px;
-        background-color: transparent;
-      }
-      .tl480
-      {
-        margin-left: -670px;
-        border-left: 480px solid orange;
-        text-indent: -480px;
-        background-color: transparent;
-      }
-      .tl320
-      {
-        margin-left: -480px;
-        border-left: 320px solid red;
-        text-indent: -320px;
-        background-color: transparent;
-      }
-    </style>
-  </head>
-  <body>
-    <h1><t:getAsString name="title"/></h1>
-    <div class="testlab tl970">970px
-      <div class="testlab tl670">670px
-        <div class="testlab tl480">480px
-          <div class="testlab tl320">320px
-
-            <t:insertAttribute name="content"/>
-
-          </div>
-        </div>
-      </div>
-    </div>
-  </body>
-</html>
diff --git a/src/main/webapp/WEB-INF/templates/wip.jsp b/src/main/webapp/WEB-INF/templates/wip.jsp
deleted file mode 100644
index 230a9f64..00000000
--- a/src/main/webapp/WEB-INF/templates/wip.jsp
+++ /dev/null
@@ -1,8 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<div class="wip">
-  <img class="w" src="/img/comming-soon.png" alt="Comming soon..."/>
-  <t:insertTemplate template="/WEB-INF/templates/maincontent.jsp"/>
-</div>
diff --git a/src/main/webapp/WEB-INF/views/about.jsp b/src/main/webapp/WEB-INF/views/about.jsp
deleted file mode 100644
index a26f2179..00000000
--- a/src/main/webapp/WEB-INF/views/about.jsp
+++ /dev/null
@@ -1,76 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="About" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><strong class="b">About</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><strong class="m">About</strong></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><strong class="s">About</strong></h2>
-    <ul id="submenu">
-      <li class="s sub"><a href="${base}expertise.html" class="s">Expertise</a></li>
-      <li class="s sub"><a href="${base}references.html" class="s">References</a></li>
-      <li class="s "><a href="${base}contact.html" class="s">Contact</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      <span class="logo">juplo</span> is the place, where I collect and share
-      my more or less private projects.
-      It is a lab for experiments, that help me to do my job as a freelancer
-      at the desired level of quality.
-      Here, I can play with all the fancy new stuff, that might be a little
-      bit to much bleeding edge, to be used on a production site of a paying
-      client.
-    </p>
-    <p>
-      I decided to share all this stuff, because I am always learning a lot
-      from the internet-community.
-      I wanted to give back a little and try to help and teach others, as I
-      was helped and teached.
-      Also, this is a good oportunity, to show what I am doing and to do a 
-      little self-publicity...
-    </p>
-    <p>
-      <span class="logo">juplo</span> mainly consists of two parts:
-    </p>
-    <ul>
-      <li>
-        In the <a href="${base}blog.html">blog</a>, I summarize, how I solved
-        some every-day problems, other people might stumble across too.
-        I am introducing new projects there and announcing new versions and/or
-        bugfixes to older projects.
-      </li>
-      <li>
-        The other part of the site is the
-        <a href="${base}projects.html">projects-section</a>.
-        This is where I am hosting all projects, that I have made publicy
-        available.
-      </li>
-    </ul>
-    <p>
-      If you want to hire me, you can find out more on the
-      <a href="${base}contact.html">contact-page</a>.
-      If you are not yet sure, if you want to hire me, you might be
-      interessted in
-      <a href="${base}expertise.html">what I can do for you</a>, or 
-      <a href="${base}references.html">what I have already done for others</a>.
-    </p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="string" value=""/>
-  <t:putAttribute name="footer" type="string">
-    <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
-    <li class="f"><a class="f" href="${base}impressum.html">Impressum</a></li>
-    <li class="f about"><strong class="f">About</strong></li>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/agb.jsp b/src/main/webapp/WEB-INF/views/agb.jsp
deleted file mode 100644
index 270c8cff..00000000
--- a/src/main/webapp/WEB-INF/views/agb.jsp
+++ /dev/null
@@ -1,183 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Allgemeine Geschäftsbedingungen (AGB)" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a href="${base}impressum.html" class="b">Impressum</a></li>
-    <li class="b"><strong class="b">Urheberrechte</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}impressum.html" class="s selected">Impressum</a></h2>
-    <ul id="submenu">
-      <li class="s"><strong class="s">AGB</strong></li>
-      <li class="s"><a href="${base}haftung-inhalte.html" class="s">Haftung für Inhalte</a></li>
-      <li class="s"><a href="${base}haftung-links.html" class="s">Haftung für Links</a></li>
-      <li class="s"><a href="${base}urheberrechte.html" class="s">Urheberrechte</a></li>
-      <li class="s"><a href="${base}datenschutz.html" class="s">Datenschutz</a></li>
-      <li class="s"><a href="${base}google-analytics.html" class="s">Google Analytics</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p><em>Stand: 01.02.2014</em></p>
-    <h2>Angebote &amp; Abrechnung</h2>
-    <p>
-     Angebote sind freibleibend.
-     Alle Preise verstehen sich in Euro und zzgl. der gesetzl. MwSt.
-     Wenn nicht anders vereinbart erfolgt eine Anzahlung von 10% im Voraus.
-     Sollte sich der Zeitraum über den Leistungen erbracht werden über
-     mehrere Monate erstrecken, behalte ich mir vor, Rechnungen für
-     Leistungsabschnitte zu stellen (jedoch nicht häufiger als ein mal im
-     Monat).
-     Das Zahlungsziel beträgt 8 Tage.
-    </p>
-    <p>
-     Falls nicht anders vereinbart, ist bei Dienstleistungen eine
-     Korrekturschleife enthalten.
-     Darüber hinausgehende Überarbeitungen sowie gewünschte Zusatzleistungen
-     werden nach Aufwand per Stundensatz abgerechnet.
-     Sollte für den Auftrag ein rabattierter Stundensatz vereinbart worden
-     sein, so gilt dieser nicht automatisch für Überarbeitungen und
-     Zusatzleistungen.
-    </p>
-    <h2>Absprachen</h2>
-    <p>
-      Die zentralen Ansprechpartner des Kunden müssen verbindliche
-      Erklärungen abgeben können (z. B. Fristabsprachen, Abnahmen).
-      Bei Ausfall, Urlaub etc. sind Ersatzpersonen zu benennen.
-    </p>
-    <h2>Leistungen &amp; Abnahme</h2>
-    <p>
-      Der Kunde ist in der Pflicht, erbrachte Leitungen direkt nach deren
-      Erstellung und ohne Aufforderung rechtzeitig (z.B. vor
-      Veröffentlichung) zu prüfen und Änderungswünsche oder Korrekturhinweise
-      direkt mitzuteilen.
-      Die Annahme von Leistungen ohne Beanstandung ist als Abnahme zu
-      verstehen.
-    </p>
-    <p>
-      Ich bin zu jeder Zeit berechtigt, die Arbeit in sinnvollen
-      Teilleistungen zu erbringen und zu berechnen.
-      Der Kunde ist verpflichtet, diese Teilleistungen abzunehmen.
-    </p>
-    <p>
-      Im Rahmen der Gestaltungsspielräume des Briefings vom Kunden trägt der
-      Kunde das Risiko des Nichtgefallens.
-    </p>
-    <h2>Eigenleistungen</h2>
-    <p>
-      Sofern der Kunde Eigenleistungen erbringt, ist die termingerechte
-      Lieferung für den Gesamtzeitplan relevant.
-      Bei verspäteter Lieferung bin ich nicht dazu verpflichtet, die
-      Auftragsarbeit unverzüglich fortzusetzen, wenn ich durch andere
-      terminliche Verpflichtungen daran gehindert werde.
-      Verzögerungen auf Kundenseite können zu erheblichen Gesamtverzögerungen
-      führen.
-      Für dadurch entstandenen Schaden und entgangenen Gewinn haftet der Kunde.
-    </p>
-    <p>
-      Der Kunde berücksichtigt bei der Lieferung von Daten und Materialien
-      die von mir im Rahmen des Angebots geforderten Formate.
-    </p>
-    <p>
-      Sofern Angaben, Muster, Inhalte, usw. vom Kunden geliefert werden, bin
-      ich für deren Richtigkeit und rechtliche Unbedenklichkeit nicht
-      verantwortlich.
-      Eine Prüfungspflicht besteht auf meiner Seite nicht.
-    </p>
-    <h2>Fremdleistungen</h2>
-    <p>
-      Angebote beziehen sich in der Regel auf von mir erbrachte Dienstleistung.
-      Die Kosten oder Gebühren Dritter (z.B. Provider, Lizenzen für Bild, Ton,
-      Schrift oder Software, Druckerei usw.) sind nicht enthalten, falls nicht
-      explizit erwähnt.
-    </p>
-    <p>
-      Bei Beauftragung von Fremdleistungen jedweder Art, berechne ich, falls
-      nicht anders vereinbart, eine Abwicklungspauschale in Höhe von 15% des
-      Auftragswerts für Organisation und Abstimmung.
-    </p>
-    <h2>Nutzungsrechte</h2>
-    <p>
-      An Unterlagen, die im Rahmen des Angebots übergeben werden (z.B.
-      Entwürfe, Konzepte), erhält der Kunde keine Nutzungsrechte.
-      Der Kunde erhält die vereinbarten Nutzungsrechte nur bei pünktlicher
-      und vollständiger Zahlung der vereinbarten Vergütung.
-    </p>
-    <p>
-      Eingesetzte Systeme (z.B. Springframework, Tomcat, CentOS usw.)
-      unterliegen ihren eigenen Nutzungsbestimmungen.
-    </p>
-    <h2>Rechtliche Prüfung</h2>
-    <p>
-      Ohne gesonderte Vereinbarung ist die patent-, muster-, urheber- und
-      markenrechtliche Schutz- oder Eintragungsfähigkeit der im Rahmen des
-      Vertrages gelieferten Ideen, Konzeptionen, Entwürfe und sonstiger
-      Leistungen nicht geschuldet.
-    </p>
-    <h2>Höhere Gewalt</h2>
-    <p>
-      Leistungsverzögerungen aufgrund von Umständen im Verantwortungsbereich
-      des Kunden (z.B. verspätete Anlieferung) und höherer Gewalt (z.B. Unfall,
-      Telekommunikationsstörung usw.) habe ich nicht zu vertreten.
-      Sie berechtigen mich das Erbringen der betreffenden Leistungen um die
-      Dauer der Behinderungen zzgl. einer angemessenen Anlaufzeit
-      aufzuschieben.
-    </p>
-    <h2>Archivierung</h2>
-    <p>
-      Ich bin nicht verpflichtet, erstellte Leistungen zu archivieren.
-      Unterlagen des Kunden muss ich nur dann zurückgeben, wenn dies der Kunde
-      vor der Übergabe ausdrücklich verlangt hat.
-    </p>
-    <h2>Betreuung / Support / Wartung</h2>
-    <p>
-      Ich bin nur in der in der Servicevereinbarung besprochenen Weise für die
-      für eine aktive Betreuung, Support oder Wartung (z.B. Sicherheitsupdates,       Aktualitätsprüfungen usw.) verantwortlich.
-    </p>
-    <h2>Referenzen</h2>
-    <p>
-      Innerhalb der erstellten Leistung werde ich in branchenüblicher Form als
-      Leistungserbrinnger genannt (z.B. Impressum).
-    </p>
-    <p>
-      Ich bin berechtigt, den Kunden als Referenz zu benennen und das Projekt
-      öffentlich vorzustellen.
-      Der Kunde kann dagegen jederzeit schriftlich Widerspruch erheben.
-      Widerruft der Kunde seine Zustimmung, so bin ich berechtigt, erstellte
-      Werbe-Materialien weiter zu benutzen, verpflichte mich jedoch, keine
-      weiteren, Werbe-Materialien zu erstellen, die den Kunden nennen.
-    </p>
-    <h2>Geheimhaltung</h2>
-    <p>
-      Die Vertragsparteien vereinbaren Vertraulichkeit über Vertrag und
-      Erkenntnisse der jeweils anderen Partei.
-      Die Vertraulichkeit gilt auch über die Beendigung des
-      Vertragsverhältnisses hinaus.
-    </p>
-    <h2>Schlussbestimmungen</h2>
-    <p>
-      Erfüllungsort und ausschließlicher Gerichtsstand für alle
-      Rechtsstreitigkeiten ist Münster.
-    </p>
-    <p>
-      Sollten aus irgendeinem Grund eine oder mehrere Einzelbestimmungen
-      dieser AGB unwirksam sein, so bleibt die Gültigkeit der restlichen
-      Bestimmungen davon unberührt.
-    </p>
-    <p>
-      Regelungslücken dieser AGB werden durch Auslegung so gefüllt, dass sie
-      dem wirtschaftlichen Zweck des Vertrages Rechnung tragen.
-    </p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="template" value="/WEB-INF/templates/about.jsp"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/blog.jsp b/src/main/webapp/WEB-INF/views/blog.jsp
deleted file mode 100644
index a2eb5cc2..00000000
--- a/src/main/webapp/WEB-INF/views/blog.jsp
+++ /dev/null
@@ -1,178 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Blog" type="string" cascade="true"/>
-    <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><strong class="b">Blog</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><strong class="m">Blog</strong></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <article id="post-140" class="post-140 post type-post status-publish format-standard hentry category-jetty category-less category-maven category-wro4j">
-      <header class="entry-header">
-        <h2 class="entry-title"><a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="Permalink to Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources" rel="bookmark">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="12:58" rel="bookmark"><time class="entry-date" datetime="2013-12-06T12:58:17+00:00" pubdate>December 6, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/jetty/" title="View all posts in Jetty" rel="category tag">Jetty</a>, <a href="http://juplo.de/category/less/" title="View all posts in less" rel="category tag">less</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>, <a href="http://juplo.de/category/wro4j/" title="View all posts in wro4j" rel="category tag">wro4j</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-140 -->
-    <article id="post-114" class="post-114 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
-      <header class="entry-header">
-        <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-3-released/" title="Permalink to hibernate4-maven-plugin 1.0.3 released!" rel="bookmark">hibernate4-maven-plugin 1.0.3 released!</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-3-released/" title="02:46" rel="bookmark"><time class="entry-date" datetime="2013-10-18T02:46:23+00:00" pubdate>October 18, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-114 -->
-    <article id="post-97" class="post-97 post type-post status-publish format-standard hentry category-appengine category-java category-maven category-oauth2">
-      <header class="entry-header">
-        <h2 class="entry-title"><a href="http://juplo.de/log-out-from-wrong-account-with-maven-appengine-plugin/" title="Permalink to Log out from wrong Account with maven-appengine-plugin" rel="bookmark">Log out from wrong Account with maven-appengine-plugin</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/log-out-from-wrong-account-with-maven-appengine-plugin/" title="11:33" rel="bookmark"><time class="entry-date" datetime="2013-10-03T11:33:56+00:00" pubdate>October 3, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/appengine/" title="View all posts in appengine" rel="category tag">appengine</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>, <a href="http://juplo.de/category/oauth2/" title="View all posts in oauth2" rel="category tag">oauth2</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-97 -->
-    <article id="post-90" class="post-90 post type-post status-publish format-standard hentry category-hibernate category-java category-jpa">
-      <header class="entry-header">
-        <h2 class="entry-title"><a href="http://juplo.de/bidirectional-association-with-elementcollection/" title="Permalink to Bidirectional Association with @ElementCollection" rel="bookmark">Bidirectional Association with @ElementCollection</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/bidirectional-association-with-elementcollection/" title="11:11" rel="bookmark"><time class="entry-date" datetime="2013-10-03T11:11:36+00:00" pubdate>October 3, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/jpa/" title="View all posts in JPA" rel="category tag">JPA</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-90 -->
-    <article id="post-75" class="post-75 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
-      <header class="entry-header">
-s        <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-2-release/" title="Permalink to hibernate4-maven-plugin 1.0.2 released!" rel="bookmark">hibernate4-maven-plugin 1.0.2 released!</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-2-release/" title="02:06" rel="bookmark"><time class="entry-date" datetime="2013-08-02T02:06:08+00:00" pubdate>August 2, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-75 -->
-    <article id="post-64" class="post-64 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
-      <header class="entry-header">
-        <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-1-released/" title="Permalink to hibernate4-maven-plugin 1.0.1 released!" rel="bookmark">hibernate4-maven-plugin 1.0.1 released!</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-1-released/" title="01:10" rel="bookmark"><time class="entry-date" datetime="2013-01-16T01:10:59+00:00" pubdate>January 16, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-64 -->
-    <article id="post-55" class="post-55 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
-      <header class="entry-header">
-        <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-released/" title="Permalink to hibernate4-maven-plugin 1.0 released!" rel="bookmark">hibernate4-maven-plugin 1.0 released!</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-released/" title="22:04" rel="bookmark"><time class="entry-date" datetime="2012-11-29T22:04:25+00:00" pubdate>November 29, 2012</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-55 -->
-    <article id="post-34" class="post-34 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
-      <header class="entry-header">
-        <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="Permalink to hibernate4-maven-plugin" rel="bookmark">hibernate4-maven-plugin</a></h2>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="19:29" rel="bookmark"><time class="entry-date" datetime="2012-11-28T19:29:12+00:00" pubdate>November 28, 2012</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>          
-        </div><!-- .entry-meta -->
-      </header><!-- .entry-header -->
-      <div class="entry-content">
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        <span class="cat-links">
-          Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
-        </span>
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-34 -->
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="string">
-    <div id="secondary" class="widget-area" role="complementary">
-      <aside id="archives" class="widget">
-        <h1 class="widget-title">Archives</h1>
-        <ul>
-          <li><a href='http://juplo.de/2013/10/' title='October 2013'>October 2013</a></li>
-          <li><a href='http://juplo.de/2013/08/' title='August 2013'>August 2013</a></li>
-          <li><a href='http://juplo.de/2013/01/' title='January 2013'>January 2013</a></li>
-          <li><a href='http://juplo.de/2012/11/' title='November 2012'>November 2012</a></li>
-        </ul>
-      </aside>
-      <aside id="categories" class="widget">
-        <h1 class="widget-title">Most Used Categories</h1>
-        <ul>
-          <li class="cat-item cat-item-4"><a href="http://juplo.de/category/java/" title="View all posts filed under Java">Java</a> (6)</li>
-          <li class="cat-item cat-item-6"><a href="http://juplo.de/category/hibernate/" title="View all posts filed under Hibernate">Hibernate</a> (5)</li>
-          <li class="cat-item cat-item-8"><a href="http://juplo.de/category/maven/" title="View all posts filed under Maven">Maven</a> (5)</li>
-          <li class="cat-item cat-item-9"><a href="http://juplo.de/category/jpa/" title="View all posts filed under JPA">JPA</a> (1)</li>
-          <li class="cat-item cat-item-10"><a href="http://juplo.de/category/appengine/" title="View all posts filed under appengine">appengine</a> (1)</li>
-          <li class="cat-item cat-item-11"><a href="http://juplo.de/category/oauth2/" title="View all posts filed under oauth2">oauth2</a> (1)</li>
-        </ul>
-      </aside>
-      <aside id="search" class="widget widget_search">
-        <h1 class="widget-title">Search</h1>
-        <form role="search" method="get" id="searchform" class="searchform" action="http://juplo.de/">
-          <div>
-            <label class="screen-reader-text" for="s">Search for:</label>
-            <input type="text" value="" name="s" id="s" />
-            <input type="submit" id="searchsubmit" value="Search" />
-          </div>
-        </form>
-      </aside>
-    </div><!-- #secondary .widget-area -->
-    <div id="tertiary" class="widget-area" role="supplementary">
-    </div><!-- #tertiary .widget-area -->
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/blog/article.jsp b/src/main/webapp/WEB-INF/views/blog/article.jsp
deleted file mode 100644
index 664d9e5a..00000000
--- a/src/main/webapp/WEB-INF/views/blog/article.jsp
+++ /dev/null
@@ -1,319 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="" type="string" cascade="true"/>
-    <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><strong class="b">Blog</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><strong class="m">Blog</strong></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <article id="post-140" class="post-140 post type-post status-publish format-standard hentry category-jetty category-less category-maven category-wro4j">
-      <div class="entry-header">
-        <h1 class="entry-title">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</h1>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="12:58" rel="bookmark"><time class="entry-date" datetime="2013-12-06T12:58:17+00:00" pubdate>December 6, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </div><!-- .entry-header -->
-      <div class="entry-content">
-        <p>Ever searched for a simple configuration, that lets you use your <a href="http://wiki.eclipse.org/Jetty/Feature/Jetty_Maven_Plugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://wiki.eclipse.org']);" title="See the documentation for mor information">jetty-maven-plugin</a> as you are used to, while working with <a href="http://www.lesscss.org/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.lesscss.org']);" title="See LESS CSS documentation for mor informations">LESS</a> to simplify your stylesheets?</p>
-        <p>You cannot do both, use the <a href="http://www.lesscss.org/#usage" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.lesscss.org']);" title="More about the client-side usage of LESS">Client-side mode</a> of LESS to ease development and use the <a href="https://github.com/marceloverdijk/lesscss-maven-plugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://github.com']);" title="Homepage of the official LESS CSS maven plugin">lesscss-maven-plugin</a> to automatically compile the LESS-sources into CSS for production. That does not work, because your stylesheets must be linked in different ways if you are switching between the client-side mode &#8211; which is best for development &#8211; and the pre-compiled mode &#8211; which is best for production. For the client-side mode you need something like:</p>
-        <pre class="prettyprint linenums">
-<code class="html">
-&lt;link rel="stylesheet/less" type="text/css" href="styles.less" /&gt;
-&lt;script src="less.js" type="text/javascript"&gt;&lt;/script&gt;
-</code>
-        </pre>
-        <p>While, for the pre-compiled mode, you want to link to your stylesheets as usual, with:</p>
-        <pre class="prettyprint linenums">
-<code class="html">
-&lt;link rel="stylesheet" type="text/css" href="styles.css" /&gt;
-</code>
-        </pre>
-        <p>While looking for a solution to this dilemma, I stumbled accross <a href="https://code.google.com/p/wro4j/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See the documentation of ths wounderfull tool">wro4j</a>. Originally intended, to speed up page-delivery by combining and minimizing multiple resources into one through the use of a servlet-filter, this tool also comes with a maven-plugin, that let you do the same offline, while compiling your webapp.</p>
-        <p>The idea is, to use the <a href="http://code.google.com/p/wro4j/wiki/MavenPlugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See the documentation of hte wro4j-maven-plugin">wro4j-maven-plugin</a> to compile and combine your LESS-sources into CSS for production and to use the <a href="http://code.google.com/p/wro4j/wiki/Installation" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See how to configure the filter">wro4j filter</a>, to dynamically deliver the compiled CSS while developing. This way, you do not have to alter your HTML-code, when switching between development and production, because you always link to the CSS-files.</p>
-        <p>So, lets get dirty!</p>
-        <h2>Step 1: Configure wro4j</h2>
-        <p>First, we configure <strong>wro4j</strong>, like as we want to use it to speed up our page. The details are explained and linked on wro4j&#8217;s <a href="http://code.google.com/p/wro4j/wiki/GettingStarted" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="Visit the Getting-Started-Page">Getting-Started-Page</a>. In short, we just need two files: <strong>wro.xml</strong> and <strong>wro.properties</strong>.</p>
-        <h3>wro.xml</h3>
-        <p>wro.xml tells wro4j, which resources should be combined and how the result should be named. I am using the following configuration to generate all LESS-Sources beneath <code>base/</code> into one CSS-file called <code>base.css</code>:</p>
-        <pre class="prettyprint linenums">
-<code class="xml">
-&lt;groups xmlns="http://www.isdc.ro/wro"&gt;
-  &lt;group name="base"&gt;
-    &lt;css&gt;/less/base/*.less&lt;/css&gt;
-  &lt;/group&gt;
-</code>
-        </pre>
-        <p>wro4j looks for <code>/less/base/*.less</code> inside the root of the web-context, which is equal to <code>src/main/webapp</code> in a normal maven-project. There are <a href="http://code.google.com/p/wro4j/wiki/ResourceTypes" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See the resource locator documentation of wro4j for more details">other ways to specifie the resources</a>, which enable you to store them elswhere. But this approach works best for our goal, because the path is understandable for both: the wro4j servlet-filter, we are configuring now for our development-environment, and the wro4j-maven-plugin, that we will configure later for build-time compilation.</p>
-        <h3>wro.properties</h3>
-        <p>wro.properties in short tells wro4j, how or if it should convert the combined sources and how it should behave. I am using the following configuration to tell wro4j, that it should convert <code>*.less</code>-sources into CSS and do that on <em>every request</em>:</p>
-        <pre class="prettyprint linenums">
-<code class="properties">
-preProcessors=less4j
-disableCache=true
-</code>
-        </pre>
-        <p>You can do a lot more here. There are countless <a href="http://code.google.com/p/wro4j/wiki/ConfigurationOptions" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="See all configuration options">configuration options</a> to fine-tune the behaviour of wro4j. The <code>disableCache=true</code> is crucial, because we would not see the changes take effect when developing with <strong>jetty-maven-plugin</strong> later on. You can also do much more with your resources here, for example <a href="https://code.google.com/p/wro4j/wiki/AvailableProcessors" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="See all available processors">minimizing</a>. But for our goal, we are now only intrested in the compilation of our LESS-sources.</p>
-        <h2>Step 2: Configure the wro4j servlet-filter</h2>
-        <p>Configuring the filter in the <strong>web.xml</strong> is easy. It is explained in wro4j&#8217;s <a href="https://code.google.com/p/wro4j/wiki/Installation" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="See the installation instructions for the wro4j servlet-filter">installation-insctuctions</a>. But the trick is, that we do not want to configure that filter for the production-version of our webapp, because we want to compile the resources offline, when the webapp is build. To acchieve this, we can use the <code>&lt;overrideDescriptor&gt;</code>-Parameter of the <a href="http://wiki.eclipse.org/Jetty/Feature/Jetty_Maven_Plugin#Configuring_Your_WebApp" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://wiki.eclipse.org']);" title="Read more about the configuration of the jetty-maven-plugin">jetty-maven-plugin</a>.</p>
-        <h2>&lt;overrideDescriptor&gt;</h2>
-        <p>This parameter lets you specify additional configuration options for the web.xml of your webapp. I am using the following configuration for my jetty-maven-plugin:</p>
-        <pre class="prettyprint linenums">
-<code class="xml">
-&lt;plugin&gt;
-  &lt;groupId&gt;org.eclipse.jetty&lt;/groupId&gt;
-  &lt;artifactId&gt;jetty-maven-plugin&lt;/artifactId&gt;
-  &lt;configuration&gt;
-    &lt;webApp&gt;
-      &lt;overrideDescriptor&gt;${project.basedir}/src/test/resources/jetty-web.xml&lt;/overrideDescriptor&gt;
-    &lt;/webApp&gt;
-  &lt;/configuration&gt;
-  &lt;dependencies&gt;
-    &lt;dependency&gt;
-      &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
-      &lt;artifactId&gt;wro4j-core&lt;/artifactId&gt;
-      &lt;version&gt;${wro4j.version}&lt;/version&gt;
-    &lt;/dependency&gt;
-    &lt;dependency&gt;
-      &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
-      &lt;artifactId&gt;wro4j-extensions&lt;/artifactId&gt;
-      &lt;version&gt;${wro4j.version}&lt;/version&gt;
-      &lt;exclusions&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;javax.servlet&lt;/groupId&gt;
-            &lt;artifactId&gt;servlet-api&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.apache.commons&lt;/groupId&gt;
-            &lt;artifactId&gt;commons-lang3&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;commons-io&lt;/groupId&gt;
-            &lt;artifactId&gt;commons-io&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;commons-pool&lt;/groupId&gt;
-            &lt;artifactId&gt;commons-pool&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.springframework&lt;/groupId&gt;
-            &lt;artifactId&gt;spring-web&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;com.google.code.gson&lt;/groupId&gt;
-            &lt;artifactId&gt;gson&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;com.google.javascript&lt;/groupId&gt;
-            &lt;artifactId&gt;closure-compiler&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;com.github.lltyk&lt;/groupId&gt;
-            &lt;artifactId&gt;dojo-shrinksafe&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.jruby&lt;/groupId&gt;
-            &lt;artifactId&gt;jruby-core&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-          &lt;groupId&gt;org.jruby&lt;/groupId&gt;
-          &lt;artifactId&gt;jruby-stdlib&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.jruby&lt;/groupId&gt;
-            &lt;artifactId&gt;jruby-stdlib&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;me.n4u.sass&lt;/groupId&gt;
-            &lt;artifactId&gt;sass-gems&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;nz.co.edmi&lt;/groupId&gt;
-            &lt;artifactId&gt;bourbon-gem-jar&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.codehaus.gmaven.runtime&lt;/groupId&gt;
-            &lt;artifactId&gt;gmaven-runtime-1.7&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;jshint&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;less&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;emberjs&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;handlebars&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;coffee-script&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;jslint&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;json2&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-        &lt;exclusion&gt;
-            &lt;groupId&gt;org.webjars&lt;/groupId&gt;
-            &lt;artifactId&gt;jquery&lt;/artifactId&gt;
-        &lt;/exclusion&gt;
-      &lt;/exclusions&gt;
-    &lt;/dependency&gt;
-  &lt;/dependencies&gt;
-&lt;/plugin&gt;
-</code>
-        </pre>
-        <p>The dependencies to <strong>wro4j-core</strong> and <strong>wro4j-extensions</strong> are needed by jetty, to be able to enable the filter defined below. Unfortunatly, one of the transitive dependencies of <code>wro4j-extensions</code> triggers an uggly error when running the jetty-maven-plugin. Therefore, all unneeded dependencies of <code>wro4j-extensions</code> are excluded, as a workaround for this error/bug.</p>
-        <h2>jetty-web.xml</h2>
-        <p>And my jetty-web.xml looks like this:</p>
-        <pre class="prettyprint linenums">
-<code class="xml">
-&lt;?xml version="1.0" encoding="UTF-8"?&gt;
-&lt;web-app xmlns="http://java.sun.com/xml/ns/javaee"
-  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
-  xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
-  version="2.5"&gt;
-  &lt;filter&gt;
-    &lt;filter-name&gt;wro&lt;/filter-name&gt;
-    &lt;filter-class&gt;ro.isdc.wro.http.WroFilter&lt;/filter-class&gt;
-  &lt;/filter&gt;
-  &lt;filter-mapping&gt;
-    &lt;filter-name&gt;wro&lt;/filter-name&gt;
-    &lt;url-pattern&gt;*.css&lt;/url-pattern&gt;
-  &lt;/filter-mapping&gt;
-&lt;/web-app&gt;
-</code>
-        </pre>
-        <p>The filter processes any URI&#8217;s that end with <code>.css</code>. This way, the wro4j servlet-filter makes <code>base.css</code> available under any path, because for exampl <code>/base.css</code>, <code>/css/base.css</code> and <code>/foo/bar/base.css</code> all end with <code>.css</code>.</p>
-        <p>This is all, that is needed to develop with dynamically reloadable compiled LESS-resources. Just fire up your browser and browse to <code>/what/you/like/base.css</code>. (But do not forget to put some LESS-files in <code>src/main/webapp/less/base/</code> first!)</p>
-        <h2>Step 3: Install wro4j-maven-plugin</h2>
-        <p>All that is left over to configure now, is the build-process. If you would build and deploy your webapp now, the CSS-file <code>base.css</code> would not be generated and the link to your stylesheet, that already works in our jetty-maven-plugin environment would point to a 404. Hence, we need to set up the <strong>wro4j-maven-plugin</strong>. I am using this configuration:</p>
-        <pre class="prettyprint linenums">
-<code class="xml">
-&lt;plugin&gt;
-  &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
-  &lt;artifactId&gt;wro4j-maven-plugin&lt;/artifactId&gt;
-  &lt;version&gt;${wro4j.version}&lt;/version&gt;
-  &lt;configuration&gt;
-    &lt;wroManagerFactory&gt;ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory&lt;/wroManagerFactory&gt;
-    &lt;cssDestinationFolder&gt;${project.build.directory}/${project.build.finalName}/css/&lt;/cssDestinationFolder&gt;
-  &lt;/configuration&gt;
-  &lt;executions&gt;
-    &lt;execution&gt;
-      &lt;phase&gt;package&lt;/phase&gt;
-      &lt;goals&gt;
-        &lt;goal&gt;run&lt;/goal&gt;
-      &lt;/goals&gt;
-    &lt;/execution&gt;
-  &lt;/executions&gt;
-&lt;/plugin&gt;
-</code>
-        </pre>
-        <p>I connected the <code>run</code>-goal with the <code>package</code>-phase, because the statically compiled CSS-file is needed only in the final war. The <code>ConfigurableWroManagerFactory</code> tells wro4j, that it should look up further configuration options in our <code>wro.properties</code>-file, where we tell wro4j, that it should compile our LESS-resources. The <code>&lt;cssDestinationFolder&gt;</code>-tag tells wro4j, where it should put the generated CSS-file. You can adjust that to suite your needs.</p>
-        <p>That&#8217;s it: now the same CSS-file, which is created on the fly by the wro4j servlet-filter when using <code>mvn jetty:run</code> and, thus, enables dynamic reloading of our LESS-resources, is generated during the build-process by the wro4j-maven-plugin.</p>
-        <h2>Cleanup and further considerations</h2>
-        <h3>lesscss-maven-plugin</h3>
-        <p>If you already compile your LESS-resources with the lesscss-maven-plugin, you can stick with it and skip step 3. But I strongly recommend giving wro4j-maven-plugin a try, because it is a much more powerfull tool, that can speed up your final webapp even more.</p>
-        <h3>Clean up your mess </h3>
-        <p>With a configuration like the above one, your LESS-resources and wro4j-configuration-files will be packed into your production-war. That might be confusing later, because neither wro4j nor LESS is used in the final war. You can add the following to your <code>pom.xml</code> to exclude these files from your war for the sake of clarity:</p>
-        <pre class="prettyprint linenums">
-<code class="xml">
-&lt;plugin&gt;
-  &lt;artifactId&gt;maven-war-plugin&lt;/artifactId&gt;
-  &lt;configuration&gt;
-    &lt;warSourceExcludes&gt;
-      WEB-INF/wro.*,
-      less/**
-    &lt;/warSourceExcludes&gt;
-  &lt;/configuration&gt;
-&lt;/plugin&gt;
-</code>
-        </pre>
-        <h3>What&#8217;s next?</h3>
-        <p>We only scrached the surface, of what can be done with wro4j. Based on this configuration, you can easily enable additional features to fine-tune your final build for maximum speed. You really should take a look at the <a href="https://code.google.com/p/wro4j/wiki/AvailableProcessors" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="Available Processors">list of available Processors</a>!</p>
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        This entry was posted in <a href="http://juplo.de/category/jetty/" title="View all posts in Jetty" rel="category tag">Jetty</a>, <a href="http://juplo.de/category/less/" title="View all posts in less" rel="category tag">less</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>, <a href="http://juplo.de/category/wro4j/" title="View all posts in wro4j" rel="category tag">wro4j</a>. Bookmark the <a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="Permalink to Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources" rel="bookmark">permalink</a>. 
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-140 -->
-    <!-- You can start editing here. -->
-    <!-- If comments are open, but there are no comments. -->
-    <div id="respond">
-      <h3>Leave a Reply</h3>
-      <div id="cancel-comment-reply">
-        <small><a rel="nofollow" id="cancel-comment-reply-link" href="/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/#respond" style="display:none;">Click here to cancel reply.</a></small>
-      </div>
-      <form action="http://juplo.de/wp-comments-post.php" method="post" id="commentform">
-        <p>Logged in as <a href="http://juplo.de/wp-admin/profile.php">Kai Moritz</a>. <a href="http://juplo.de/wp-login.php?action=logout&amp;redirect_to=http%3A%2F%2Fjuplo.de%2Fcombining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources%2F&amp;_wpnonce=09e5cb501d" title="Log out of this account">Log out &raquo;</a></p>
-        <!--<p><small><strong>XHTML:</strong> You can use these tags: <code>&lt;a href=&quot;&quot; title=&quot;&quot;&gt; &lt;abbr title=&quot;&quot;&gt; &lt;acronym title=&quot;&quot;&gt; &lt;b&gt; &lt;blockquote cite=&quot;&quot;&gt; &lt;cite&gt; &lt;code&gt; &lt;del datetime=&quot;&quot;&gt; &lt;em&gt; &lt;i&gt; &lt;q cite=&quot;&quot;&gt; &lt;strike&gt; &lt;strong&gt; </code></small></p>-->
-        <p><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>
-        <p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
-          <input type='hidden' name='comment_post_ID' value='140' id='comment_post_ID' />
-          <input type='hidden' name='comment_parent' id='comment_parent' value='0' />
-        </p>
-        <input type="hidden" id="_wp_unfiltered_html_comment_disabled" name="_wp_unfiltered_html_comment_disabled" value="2096655c89" /><script>(function() {
-    if (window === window.parent) {
-      document.getElementById('_wp_unfiltered_html_comment_disabled').name = '_wp_unfiltered_html_comment';
-    }
-  })();</script>
-        <p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="f31e001227" /></p>
-      </form>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="string">
-    <div id="secondary" class="widget-area" role="complementary">
-      <aside id="archives" class="widget">
-        <h1 class="widget-title">Archives</h1>
-        <ul>
-          <li><a href='http://juplo.de/2013/10/' title='October 2013'>October 2013</a></li>
-          <li><a href='http://juplo.de/2013/08/' title='August 2013'>August 2013</a></li>
-          <li><a href='http://juplo.de/2013/01/' title='January 2013'>January 2013</a></li>
-          <li><a href='http://juplo.de/2012/11/' title='November 2012'>November 2012</a></li>
-        </ul>
-      </aside>
-      <aside id="categories" class="widget">
-        <h1 class="widget-title">Most Used Categories</h1>
-        <ul>
-          <li class="cat-item cat-item-4"><a href="http://juplo.de/category/java/" title="View all posts filed under Java">Java</a> (6)</li>
-          <li class="cat-item cat-item-6"><a href="http://juplo.de/category/hibernate/" title="View all posts filed under Hibernate">Hibernate</a> (5)</li>
-          <li class="cat-item cat-item-8"><a href="http://juplo.de/category/maven/" title="View all posts filed under Maven">Maven</a> (5)</li>
-          <li class="cat-item cat-item-9"><a href="http://juplo.de/category/jpa/" title="View all posts filed under JPA">JPA</a> (1)</li>
-          <li class="cat-item cat-item-10"><a href="http://juplo.de/category/appengine/" title="View all posts filed under appengine">appengine</a> (1)</li>
-          <li class="cat-item cat-item-11"><a href="http://juplo.de/category/oauth2/" title="View all posts filed under oauth2">oauth2</a> (1)</li>
-        </ul>
-      </aside>
-      <aside id="search" class="widget widget_search">
-        <h1 class="widget-title">Search</h1>
-        <form role="search" method="get" id="searchform" class="searchform" action="http://juplo.de/">
-          <div>
-            <label class="screen-reader-text" for="s">Search for:</label>
-            <input type="text" value="" name="s" id="s" />
-            <input type="submit" id="searchsubmit" value="Search" />
-          </div>
-        </form>
-      </aside>
-    </div><!-- #secondary .widget-area -->
-    <div id="tertiary" class="widget-area" role="supplementary">
-    </div><!-- #tertiary .widget-area -->
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/blog/comments.jsp b/src/main/webapp/WEB-INF/views/blog/comments.jsp
deleted file mode 100644
index 67060e62..00000000
--- a/src/main/webapp/WEB-INF/views/blog/comments.jsp
+++ /dev/null
@@ -1,489 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="" type="string" cascade="true"/>
-    <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><strong class="b">Blog</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><strong class="m">Blog</strong></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <article id="post-34" class="post-34 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
-      <div class="entry-header">
-        <h1 class="entry-title">hibernate4-maven-plugin</h1>
-        <div class="entry-meta">
-          Posted on <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="19:29" rel="bookmark"><time class="entry-date" datetime="2012-11-28T19:29:12+00:00" pubdate>November 28, 2012</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
-        </div><!-- .entry-meta -->
-      </div><!-- .entry-header -->
-      <div class="entry-content">
-        <h2>A simple Plugin for generating a Database-Schema from Hibernate 4 Mapping-Annotations</h2>
-        <p>
-          Hibernate comes with the buildin functionality, to automatically create or update the database schema. This functionality is configured in the session-configuraton via the parameter <code>hbm2ddl.auto</code> (see <a href="http://docs.jboss.org/hibernate/orm/4.1/manual/en-US/html_single/#configuration-optional" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://docs.jboss.org']);">Hibernate Reference Documentation &#8211; Chapter 3.4. Optional configuration properties</a>). But doing so <a href="http://stackoverflow.com/questions/221379/hibernate-hbm2ddl-auto-update-in-production" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://stackoverflow.com']);">is not very wise</a>, because you can easily corrupt or erase your production database, if this configuration parameter slips through to your production environment.
-        </p>
-        <p>
-          Alternatively, you can <a href="http://stackoverflow.com/questions/835961/how-to-creata-database-schema-using-hibernate" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://stackoverflow.com']);">run the tools <strong>SchemaExport</strong> or <strong>SchemaUpdate</strong> by hand</a>. But that is not very comfortable and being used to maven you will quickly long for a plugin, that does that job automatically for you, when you fire up your test cases.
-        </p>
-        <p>In the good old times, there was the <a href="http://mojo.codehaus.org/maven-hibernate3/hibernate3-maven-plugin/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://mojo.codehaus.org']);">Maven Hibernate3 Plugin</a>, that does this for you. But unfortunatly, this plugin is not compatible with Hibernate 4.x. Since there does not seem to be any successor for the Maven Hibernate3 Plugin and <a href="http://www.google.de/search?q=hibernate4+maven+plugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.google.de']);">googeling</a> does not help, I decided to write up this simple plugin (inspired by these two articles I found: <a href="http://www.tikalk.com/alm/blog/schema-export-hibernate-4-and-maven" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.tikalk.com']);">Schema Export with Hibernate 4 and Maven</a> and <a href="http://doingenterprise.blogspot.de/2012/05/schema-generation-with-hibernate-4-jpa.html" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://doingenterprise.blogspot.de']);">Schema generation with Hibernate 4, JPA and Maven</a>).
-        </p>
-        <p>
-          I hope, the resulting simple to use buletproof <a href="/hibernate4-maven-plugin/">hibernate4-maven-plugin</a> is usefull!
-        </p>
-        <p>
-          <strong><a href="/hibernate4-maven-plugin/">Try it out now!</a></strong></p>
-      </div><!-- .entry-content -->
-      <footer class="entry-meta">
-        This entry was posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>. Bookmark the <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="Permalink to hibernate4-maven-plugin" rel="bookmark">permalink</a>. 
-      </footer><!-- .entry-meta -->
-    </article><!-- #post-34 -->
-    <!-- You can start editing here. -->
-    <h3 id="comments">15 Responses to &#8220;hibernate4-maven-plugin&#8221;</h3>
-    <div class="navigation">
-      <div class="alignleft"></div>
-      <div class="alignright"></div>
-    </div>
-    <ol class="commentlist">
-      <li class="comment even thread-even depth-1 parent" id="comment-556">
-        <div id="div-comment-556" class="comment-body">
-          <div class="comment-author vcard">
-            <cite class="fn">Jukes</cite> <span class="says">says:</span>
-          </div>
-          <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-556">
-              November 7, 2013 at 23:18</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=556" title="Edit comment">(Edit)</a>
-          </div>
-          <p>
-            Hi thanks a lot for making this plugin available, great work!!<br />
-            I have a problem generating postgres schema. Looks like the plugin ignores the data type when adding default values and that yields a syntax error from Postgres. Or maybe I&#8217;m doing something wrong. I&#8217;m using version 1.0.3.</p>
-          <p>For example I have in java:</p>
-          <p>
-            @Column(name = &#8220;financialEnabled&#8221;, nullable = false, columnDefinition = &#8220;default TRUE&#8221;)<br />
-            private boolean financialEnabled;
-          </p>
-          <p>
-            Generated SQL is:<br />
-            financialEnabled default TRUE not null,
-          </p>
-          <p>As you can see the data type boolean is not translated to the SQL script. Thanks a lot for your help.</p>
-          <div class="reply">
-            <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=556#respond' onclick='return addComment.moveForm("div-comment-556", "556", "respond", "34")'>Reply</a>
-          </div>
-        </div>
-        <ul class="children">
-          <li class="comment byuser comment-author-kai bypostauthor odd alt depth-2" id="comment-567">
-            <div id="div-comment-567" class="comment-body">
-              <div class="comment-author vcard">
-                <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>
-              </div>
-              <div class="comment-meta commentmetadata">
-                <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-567">
-                  November 11, 2013 at 13:09</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=567" title="Edit comment">(Edit)
-                </a>
-              </div>
-              <p>
-                This plugin is only a tool to automate the generation of the SQL in your development-environment.<br />
-                Questions on how to anotate your code correctly are better asked in a user-forum from hibernate or such.</p>
-              <p>
-                Nevertheless, I think I can give you a usefull hint:<br />
-                You are overwriting the automatically generated column-definition with &#8220;default TRUE&#8221;.<br />
-                Try it with</p>
-              <p>
-                @Column(name = “financialEnabled”, nullable = false)<br />
-                private boolean financialEnabled;</p>
-              <div class="reply">
-                <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=567#respond' onclick='return addComment.moveForm("div-comment-567", "567", "respond", "34")'>Reply</a>
-              </div>
-            </div>
-          </li><!-- #comment-## -->
-        </ul><!-- .children -->
-      </li><!-- #comment-## -->
-      <li class="comment even thread-odd thread-alt depth-1 parent" id="comment-390">
-        <div id="div-comment-390" class="comment-body">
-          <div class="comment-author vcard">
-            <cite class="fn">Milios</cite> <span class="says">says:</span>
-          </div>
-          <div class="comment-meta commentmetadata">
-            <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-390">
-              October 10, 2013 at 15:02
-            </a>
-            &nbsp;&nbsp;
-            <a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=390" title="Edit comment">(Edit)</a>
-          </div>
-          <p>Hi,</p>
-          <p>
-            looks like a very nice plugin. Unfortunately, part of our entities are in other modules/dependencies.<br />
-            Do you plan to add the possibility to scan also for dependencies of the project or at least of the plugin?</p>
-          <p>Also, when I only want to generate the SQL and use the following configuration, I got nothing.</p>
-          <p>Config:</p>
-          <p>
-            de.juplo<br />
-            hibernate4-maven-plugin<br />
-            1.0.2</p>
-          <p>
-            true<br />
-            SCRIPT<br />
-            NONE<br />
-            com.deutscheboerse.hibernate.PostgreSQLDialect<br />
-            ${project.build.directory}/hibernate4/cmm-schema.sql</p>
-          <p>
-            com.deutscheboerse.energy<br />
-            energy-commons-hibernate<br />
-            ${commons.hibernate.version}</p>
-          <p>
-            org.springframework.security<br />
-            spring-security-core<br />
-            ${spring.security.version}</p>
-          <p>
-            org.slf4j<br />
-            slf4j-log4j12<br />
-            ${slf4j.version}</p>
-          <p>
-            Output:<br />
-            mvn hibernate4:export -e<br />
-            [INFO] Error stacktraces are turned on.<br />
-            [INFO] Scanning for projects&#8230;<br />
-            [INFO]<br />
-            [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
-            [INFO] Building CMM WAR 1.0.0-RC5-SNAPSHOT<br />
-            [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
-            [INFO]<br />
-            [INFO] &#8212; hibernate4-maven-plugin:1.0.2:export (default-cli) @ cmm-war &#8212;<br />
-            [INFO] Scanning directory D:\_dev\work\ii\src\cmm\trunk\cmm-war\target\classes f<br />
-            [INFO] No hibernate-properties-file found! (Checked path: D:\_dev\work\ii\src\cm<br />
-            [INFO] Gathered hibernate-configuration (turn on debugging for details):<br />
-            [INFO]   hibernate.dialect = com.deutscheboerse.hibernate.PostgreSQLDialect<br />
-            [INFO] HHH000400: Using dialect: com.deutscheboerse.hibernate.PostgreSQLDialect<br />
-            [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
-            [INFO] BUILD SUCCESS<br />
-            [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
-            [INFO] Total time: 10.932s<br />
-            [INFO] Finished at: Thu Oct 10 12:51:05 UTC 2013<br />
-            [INFO] Final Memory: 9M/23M<br />
-            [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;</p>
-          <p>
-            Thanks for any help,<br />
-            Milos.
-          </p>
-          <div class="reply">
-            <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=390#respond' onclick='return addComment.moveForm("div-comment-390", "390", "respond", "34")'>Reply</a>
-          </div>
-        </div>
-        <ul class="children">
-          <li class="comment byuser comment-author-kai bypostauthor odd alt depth-2 parent" id="comment-391">
-            <div id="div-comment-391" class="comment-body">
-              <div class="comment-author vcard">
-                <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>
-              </div>
-              <div class="comment-meta commentmetadata">
-                <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-391">
-                  October 10, 2013 at 22:19
-                </a>
-                &nbsp;&nbsp;
-                <a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=391" title="Edit comment">(Edit)</a>		</div>
-              <p>
-                Yes, I am working on the possibility, to scan for annotations in dependencies.<br />
-                Unfortunatly, I have no example-project for this use-case by hand.<br />
-                It would help a lot, if you could provide a sample-project on github or such.
-              </p>
-              <p>Greetings kai</p>
-              <div class="reply">
-                <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=391#respond' onclick='return addComment.moveForm("div-comment-391", "391", "respond", "34")'>Reply</a>
-              </div>
-            </div>
-            <ul class="children">
-              <li class="comment byuser comment-author-kai bypostauthor even depth-3" id="comment-568">
-                <div id="div-comment-568" class="comment-body">
-                  <div class="comment-author vcard">
-                    <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>
-                  </div>
-                  <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-568">
-                      November 11, 2013 at 13:11</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=568" title="Edit comment">(Edit)</a>		</div>
-
-                  <p>Version 1.0.3 of the plugin can now scan for annotations in the dependencies, too.</p>
-
-                  <div class="reply">
-                    <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=568#respond' onclick='return addComment.moveForm("div-comment-568", "568", "respond", "34")'>Reply</a>		</div>
-                </div>
-              </li><!-- #comment-## -->
-            </ul><!-- .children -->
-          </li><!-- #comment-## -->
-        </ul><!-- .children -->
-      </li><!-- #comment-## -->
-      <li class="comment odd alt thread-even depth-1" id="comment-286">
-        <div id="div-comment-286" class="comment-body">
-          <div class="comment-author vcard">
-            <cite class="fn">Pedro</cite> <span class="says">says:</span>		</div>
-
-          <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-286">
-              August 7, 2013 at 18:54</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=286" title="Edit comment">(Edit)</a>		</div>
-
-          <p>Following my previous question, here is the debug info</p>
-          <p>[DEBUG] Dependency: /Users/pmarques/.m2/repository/org/springframework/security/spring-security-acl/3.1.4.RELEASE/spring-security-acl-3.1.4.RELEASE.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/atomikos-util/3.6.5/atomikos-util-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-api/3.6.5/transactions-api-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/javax/transaction/transaction-api/1.1/transaction-api-1.1.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jdbc-deprecated/3.6.5/transactions-jdbc-deprecated-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jdbc/3.6.5/transactions-jdbc-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jta/3.6.5/transactions-jta-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions/3.6.5/transactions-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/org/apache/geronimo/specs/geronimo-jta_1.0.1B_spec/1.0.1/geronimo-jta_1.0.1B_spec-1.0.1.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jms-deprecated/3.6.5/transactions-jms-deprecated-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jms/3.6.5/transactions-jms-3.6.5.jar<br />
-            [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-hibernate3/3.6.5/transactions-hibernate3-3.6.5.jar<br />
-            [INFO] Scanning directory /target/classes for annotated classes&#8230;</p>
-
-          <div class="reply">
-            <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=286#respond' onclick='return addComment.moveForm("div-comment-286", "286", "respond", "34")'>Reply</a>		</div>
-        </div>
-      </li><!-- #comment-## -->
-      <li class="comment even thread-odd thread-alt depth-1 parent" id="comment-285">
-        <div id="div-comment-285" class="comment-body">
-          <div class="comment-author vcard">
-            <cite class="fn">Pedro</cite> <span class="says">says:</span>		</div>
-
-          <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-285">
-              August 7, 2013 at 18:49</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=285" title="Edit comment">(Edit)</a>		</div>
-
-          <p>Hi,</p>
-          <p>I have the following problem.<br />
-            The project that I use to test (and use the plugin) has the annotated classes as a dependency.<br />
-            I am getting the error:<br />
-            No annotated classes found in directory /target/classes</p>
-          <p>Shouldn&#8217;t the plugin scan all the dependencies also?</p>
-          <p>Thanks,<br />
-            Pedro.</p>
-
-          <div class="reply">
-            <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=285#respond' onclick='return addComment.moveForm("div-comment-285", "285", "respond", "34")'>Reply</a>		</div>
-        </div>
-        <ul class="children">
-          <li class="comment byuser comment-author-kai bypostauthor odd alt depth-2 parent" id="comment-287">
-            <div id="div-comment-287" class="comment-body">
-              <div class="comment-author vcard">
-                <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>		</div>
-
-              <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-287">
-                  August 7, 2013 at 19:12</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=287" title="Edit comment">(Edit)</a>		</div>
-
-              <p>Hi Pedro,</p>
-              <p>I think, that your observation is right.<br />
-                But otherwise, dependencies should only be scanned if requested, because automatic scanning of the dependencies might lead to errors in other situations.</p>
-              <p>If you can make your project available to me (for example via github, or simply by mailing zipped version), I would add a configuration-parameter to enable/disable dependency-scanning and upload the refined plugin to central.</p>
-              <p>Regards,</p>
-              <p>Kai Moritz</p>
-
-              <div class="reply">
-                <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=287#respond' onclick='return addComment.moveForm("div-comment-287", "287", "respond", "34")'>Reply</a>		</div>
-            </div>
-            <ul class="children">
-              <li class="comment byuser comment-author-kai bypostauthor even depth-3" id="comment-426">
-                <div id="div-comment-426" class="comment-body">
-                  <div class="comment-author vcard">
-                    <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>		</div>
-
-                  <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-426">
-                      October 18, 2013 at 02:52</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=426" title="Edit comment">(Edit)</a>		</div>
-
-                  <p>The <a href="/hibernate4-maven-plugin-1-0-3-released/" title="Open the release-notes" rel="nofollow">new version 1.0.3</a> of the plugin adds support for annotated classes in dependencies!</p>
-
-                  <div class="reply">
-                    <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=426#respond' onclick='return addComment.moveForm("div-comment-426", "426", "respond", "34")'>Reply</a>		</div>
-                </div>
-              </li><!-- #comment-## -->
-            </ul><!-- .children -->
-          </li><!-- #comment-## -->
-        </ul><!-- .children -->
-      </li><!-- #comment-## -->
-      <li class="comment odd alt thread-even depth-1 parent" id="comment-276">
-        <div id="div-comment-276" class="comment-body">
-          <div class="comment-author vcard">
-            <cite class="fn"><a href="http://bidlogix.com" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-commentauthor', 'http://bidlogix.com']);"  rel='external nofollow' class='url'>mike</a></cite> <span class="says">says:</span>		</div>
-
-          <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-276">
-              July 30, 2013 at 12:57</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=276" title="Edit comment">(Edit)</a>		</div>
-
-          <p>Hello,</p>
-          <p>I&#8217;m upgrading from hibernate3 to to hibernate4 and have moved from the hibernate3-maven-plugin to this version. I haven&#8217;t undertaken (and don&#8217;t want to just yet) the big job of changing my hbm mapping files to annotations.</p>
-          <p>As far as I can see this is a show stopper for using your nice plugin. Can you please confirm if this is the case and whether you are planning to add support for scanning for hbm files?</p>
-          <p>Many thanks,</p>
-          <p>Mike Cohen.</p>
-
-          <div class="reply">
-            <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=276#respond' onclick='return addComment.moveForm("div-comment-276", "276", "respond", "34")'>Reply</a>		</div>
-        </div>
-        <ul class="children">
-          <li class="comment byuser comment-author-tortenheber even depth-2" id="comment-277">
-            <div id="div-comment-277" class="comment-body">
-              <div class="comment-author vcard">
-                <cite class="fn">tortenheber</cite> <span class="says">says:</span>		</div>
-
-              <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-277">
-                  July 31, 2013 at 23:18</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=277" title="Edit comment">(Edit)</a>		</div>
-
-              <p>Hello Mike,</p>
-              <p>I added the requested feature in the SNAPSHOT-version.<br />
-                It would be nice, if you could test, if the new feature works, because I have no example project by hand, that still uses hibernate-mapping via XML.</p>
-              <p>You can download an actual build here:</p>
-              <p><a href="https://oss.sonatype.org/content/repositories/snapshots//de/juplo/hibernate4-maven-plugin/1.0.2-SNAPSHOT/" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-comment', 'http://oss.sonatype.org']);" rel="nofollow">https://oss.sonatype.org/content/repositories/snapshots//de/juplo/hibernate4-maven-plugin/1.0.2-SNAPSHOT/</a></p>
-              <p>or build it by yourself from the sources.<br />
-                The feature is documented here:</p>
-              <p><a href="http://juplo.de/hibernate4-maven-plugin-1.0.2-SNAPSHOT/export-mojo.html"  rel="nofollow">http://juplo.de/hibernate4-maven-plugin-1.0.2-SNAPSHOT/export-mojo.html</a></p>
-              <p>Best regards</p>
-              <p>kai</p>
-
-              <div class="reply">
-                <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=277#respond' onclick='return addComment.moveForm("div-comment-277", "277", "respond", "34")'>Reply</a>		</div>
-            </div>
-          </li><!-- #comment-## -->
-        </ul><!-- .children -->
-      </li><!-- #comment-## -->
-      <li class="comment odd alt thread-odd thread-alt depth-1 parent" id="comment-50">
-        <div id="div-comment-50" class="comment-body">
-          <div class="comment-author vcard">
-            <cite class="fn">Victor</cite> <span class="says">says:</span>		</div>
-
-          <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-50">
-              February 22, 2013 at 15:28</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=50" title="Edit comment">(Edit)</a>		</div>
-
-          <p>Hey I have modified your code to support envers and generate auditing tables, if you want I can send you a patch. Thanks!</p>
-
-          <div class="reply">
-            <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=50#respond' onclick='return addComment.moveForm("div-comment-50", "50", "respond", "34")'>Reply</a>		</div>
-        </div>
-        <ul class="children">
-          <li class="comment even depth-2 parent" id="comment-51">
-            <div id="div-comment-51" class="comment-body">
-              <div class="comment-author vcard">
-                <cite class="fn">admin</cite> <span class="says">says:</span>		</div>
-
-              <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-51">
-                  February 22, 2013 at 19:54</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=51" title="Edit comment">(Edit)</a>		</div>
-
-              <p>Your welcom.<br />
-                Send it!</p>
-
-              <div class="reply">
-                <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=51#respond' onclick='return addComment.moveForm("div-comment-51", "51", "respond", "34")'>Reply</a>		</div>
-            </div>
-            <ul class="children">
-              <li class="comment odd alt depth-3 parent" id="comment-54">
-                <div id="div-comment-54" class="comment-body">
-                  <div class="comment-author vcard">
-                    <cite class="fn">Victor</cite> <span class="says">says:</span>		</div>
-
-                  <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-54">
-                      February 25, 2013 at 15:28</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=54" title="Edit comment">(Edit)</a>		</div>
-
-                  <p>Where to? Is there a github repo?</p>
-
-                  <div class="reply">
-                    <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=54#respond' onclick='return addComment.moveForm("div-comment-54", "54", "respond", "34")'>Reply</a>		</div>
-                </div>
-                <ul class="children">
-                  <li class="comment even depth-4" id="comment-55">
-                    <div id="div-comment-55" class="comment-body">
-                      <div class="comment-author vcard">
-                        <cite class="fn">admin</cite> <span class="says">says:</span>		</div>
-
-                      <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-55">
-                          February 25, 2013 at 20:05</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=55" title="Edit comment">(Edit)</a>		</div>
-
-                      <p>There is a private git-Repository.<br />
-                        <a href="http://juplo.de/hibernate4-maven-plugin/source-repository.html"  rel="nofollow">Check the project-documentation!</a></p>
-                      <p>You can <a href="http://juplo.de/hibernate4-maven-plugin/team-list.html"  rel="nofollow">send me</a> a patch or a pull-request to <a href="mailto:kai@juplo.de">kai@juplo.de</a></p>
-
-                      <div class="reply">
-                        <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=55#respond' onclick='return addComment.moveForm("div-comment-55", "55", "respond", "34")'>Reply</a>		</div>
-                    </div>
-                  </li><!-- #comment-## -->
-                </ul><!-- .children -->
-              </li><!-- #comment-## -->
-            </ul><!-- .children -->
-          </li><!-- #comment-## -->
-        </ul><!-- .children -->
-      </li><!-- #comment-## -->
-    </ol>
-
-    <div class="navigation">
-      <div class="alignleft"></div>
-      <div class="alignright"></div>
-    </div>
-
-
-    <div id="respond">
-
-      <h3>Leave a Reply</h3>
-
-      <div id="cancel-comment-reply">
-        <small><a rel="nofollow" id="cancel-comment-reply-link" href="/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#respond" style="display:none;">Click here to cancel reply.</a></small>
-      </div>
-
-
-      <form action="http://juplo.de/wp-comments-post.php" method="post" id="commentform">
-
-
-        <p>Logged in as <a href="http://juplo.de/wp-admin/profile.php">Kai Moritz</a>. <a href="http://juplo.de/wp-login.php?action=logout&amp;redirect_to=http%3A%2F%2Fjuplo.de%2Fhibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations%2F&amp;_wpnonce=09e5cb501d" title="Log out of this account">Log out &raquo;</a></p>
-
-
-        <!--<p><small><strong>XHTML:</strong> You can use these tags: <code>&lt;a href=&quot;&quot; title=&quot;&quot;&gt; &lt;abbr title=&quot;&quot;&gt; &lt;acronym title=&quot;&quot;&gt; &lt;b&gt; &lt;blockquote cite=&quot;&quot;&gt; &lt;cite&gt; &lt;code&gt; &lt;del datetime=&quot;&quot;&gt; &lt;em&gt; &lt;i&gt; &lt;q cite=&quot;&quot;&gt; &lt;strike&gt; &lt;strong&gt; </code></small></p>-->
-
-        <p><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>
-
-        <p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
-          <input type='hidden' name='comment_post_ID' value='34' id='comment_post_ID' />
-          <input type='hidden' name='comment_parent' id='comment_parent' value='0' />
-        </p>
-        <input type="hidden" id="_wp_unfiltered_html_comment_disabled" name="_wp_unfiltered_html_comment_disabled" value="2cfe5768bb" /><script>(function() {
-    if (window === window.parent) {
-      document.getElementById('_wp_unfiltered_html_comment_disabled').name = '_wp_unfiltered_html_comment';
-    }
-  })();</script>
-        <p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="18eb674233" /></p>
-      </form>
-
-    </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="string">
-    <div id="secondary" class="widget-area" role="complementary">
-      <aside id="archives" class="widget">
-        <h1 class="widget-title">Archives</h1>
-        <ul>
-          <li><a href='http://juplo.de/2013/10/' title='October 2013'>October 2013</a></li>
-          <li><a href='http://juplo.de/2013/08/' title='August 2013'>August 2013</a></li>
-          <li><a href='http://juplo.de/2013/01/' title='January 2013'>January 2013</a></li>
-          <li><a href='http://juplo.de/2012/11/' title='November 2012'>November 2012</a></li>
-        </ul>
-      </aside>
-      <aside id="categories" class="widget">
-        <h1 class="widget-title">Most Used Categories</h1>
-        <ul>
-          <li class="cat-item cat-item-4"><a href="http://juplo.de/category/java/" title="View all posts filed under Java">Java</a> (6)</li>
-          <li class="cat-item cat-item-6"><a href="http://juplo.de/category/hibernate/" title="View all posts filed under Hibernate">Hibernate</a> (5)</li>
-          <li class="cat-item cat-item-8"><a href="http://juplo.de/category/maven/" title="View all posts filed under Maven">Maven</a> (5)</li>
-          <li class="cat-item cat-item-9"><a href="http://juplo.de/category/jpa/" title="View all posts filed under JPA">JPA</a> (1)</li>
-          <li class="cat-item cat-item-10"><a href="http://juplo.de/category/appengine/" title="View all posts filed under appengine">appengine</a> (1)</li>
-          <li class="cat-item cat-item-11"><a href="http://juplo.de/category/oauth2/" title="View all posts filed under oauth2">oauth2</a> (1)</li>
-        </ul>
-      </aside>
-      <aside id="search" class="widget widget_search">
-        <h1 class="widget-title">Search</h1>
-        <form role="search" method="get" id="searchform" class="searchform" action="http://juplo.de/">
-          <div>
-            <label class="screen-reader-text" for="s">Search for:</label>
-            <input type="text" value="" name="s" id="s" />
-            <input type="submit" id="searchsubmit" value="Search" />
-          </div>
-        </form>
-      </aside>
-    </div><!-- #secondary .widget-area -->
-    <div id="tertiary" class="widget-area" role="supplementary">
-    </div><!-- #tertiary .widget-area -->
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/contact.jsp b/src/main/webapp/WEB-INF/views/contact.jsp
deleted file mode 100644
index 3f8675fe..00000000
--- a/src/main/webapp/WEB-INF/views/contact.jsp
+++ /dev/null
@@ -1,57 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Contact" type="string"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}about.html">About</a></li>
-    <li class="b"><strong class="b">Contact</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}about.html" class="s">About</a></h2>
-    <ul id="submenu">
-      <li class="s sub"><a href="${base}expertise.html" class="s">Expertise</a></li>
-      <li class="s sub"><a href="${base}references.html" class="s">References</a></li>
-      <li class="s"><strong class="s">Contact</strong></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="contentcontainer" type="string">
-    <div id="content" class="main pack cf">
-      <div class="p left">
-        <img class="p" src="${base}img/kai-moritz.jpg" alt="Portrait"/>
-      </div>
-      <article class="p right">
-        <header><h1><t:getAsString name="title"/></h1></header>
-        <h2>Address</h2>
-        <p>
-          Kai Moritz<br />
-          Zumsandestr. 29a<br />
-          48145 Münster
-        </p>
-        <h2>Email</h2>
-        <p><a href="mailto:kai@juplo.de">kai@juplo.de</a></p>
-        <h2>Phone</h2>
-        <p>+49 (0) 176 20 50 47 47</p>
-        <h2>Networking</h2>
-        <ul>
-          <li><a href="https://www.google.com/+KaiMoritz" title="Google+">www.google.com/+KaiMoritz</a></li>
-          <li><a href="https://www.xing.com/profile/Kai_Moritz" title="Xing">www.xing.com/profile/Kai_Moritz</a></li>
-        </ul>
-        <!--
-        <h2>About Me</h2>
-        <h2><em>Übersetzung?!?</em> Jobportale</h2>
-        -->
-      </article>
-    </div>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="string" value=""/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/datenschutz.jsp b/src/main/webapp/WEB-INF/views/datenschutz.jsp
deleted file mode 100644
index 2e8a5d2d..00000000
--- a/src/main/webapp/WEB-INF/views/datenschutz.jsp
+++ /dev/null
@@ -1,38 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Datenschutz" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a href="${base}impressum.html" class="b">Impressum</a></li>
-    <li class="b"><strong class="b">Datenschutz</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}impressum.html" class="s selected">Impressum</a></h2>
-    <ul id="submenu">
-      <li class="s"><a href="${base}agb.html" class="s">AGB</a></li>
-      <li class="s"><a href="${base}haftung-inhalte.html" class="s">Haftung für Inhalte</a></li>
-      <li class="s"><a href="${base}haftung-links.html" class="s">Haftung für Links</a></li>
-      <li class="s"><a href="${base}urheberrechte.html" class="s">Urheberrechte</a></li>
-      <li class="s"><strong class="s">Datenschutz</strong></li>
-      <li class="s"><a href="${base}google-analytics.html" class="s">Google Analytics</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Die Nutzung unserer Webseite ist in der Regel ohne Angabe personenbezogener Daten möglich. Soweit auf unseren Seiten personenbezogene Daten (beispielsweise Name, Anschrift oder eMail-Adressen) erhoben werden, erfolgt dies, soweit möglich, stets auf freiwilliger Basis. Diese Daten werden ohne Ihre ausdrückliche Zustimmung nicht an Dritte weitergegeben.</p>
-    <p>Wir weisen darauf hin, dass die Datenübertragung im Internet (z.B. bei der Kommunikation per E-Mail) Sicherheitslücken aufweisen kann. Ein lückenloser Schutz der Daten vor dem Zugriff durch Dritte ist nicht möglich.</p>
-    <p>Der Nutzung von im Rahmen der Impressumspflicht veröffentlichten Kontaktdaten durch Dritte zur Übersendung von nicht ausdrücklich angeforderter Werbung und Informationsmaterialien wird hiermit ausdrücklich widersprochen. Die Betreiber der Seiten behalten sich ausdrücklich rechtliche Schritte im Falle der unverlangten Zusendung von Werbeinformationen, etwa durch Spam-Mails, vor.</p>
-    <!-- http://www.e-recht24.de/impressum-generator.html -->
-    <p>Bitte beachten Sie auch die gesonderte <a href="${base}google-analytics.html">Datenschutzerklärung zur Nutzung von Google-Analytics</a>.</p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="template" value="/WEB-INF/templates/about.jsp"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/expertise.jsp b/src/main/webapp/WEB-INF/views/expertise.jsp
deleted file mode 100644
index 1683c05a..00000000
--- a/src/main/webapp/WEB-INF/views/expertise.jsp
+++ /dev/null
@@ -1,39 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Expertise" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}about.html">About</a></li>
-    <li class="b"><strong class="b">Expertise</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}about.html" class="s">About</a></h2>
-    <ul id="submenu">
-      <li class="s sub">
-        <strong class="s">Expertise</strong>
-        <ul class="s active">
-          <li class="s"><span href="${base}web-engineering.html" class="s">Web-Engineering</span></li>
-          <li class="s"><span href="${base}spring-framework.html" class="s">Spring Framework</span></li>
-          <li class="s"><span href="${base}.html" class="s"></span></li>
-          <li class="s"><span href="${base}responsive-web-design.html" class="s">Responsive Webdesign</span></li>
-          <li class="s"><span href="${base}web-ui-esign.html" class="s">WEB-UI-Design</span></li>
-          <li class="s"><span href="${base}seo.html" class="s">SEO</span></li>
-        </ul>
-      </li>
-      <li class="s sub off"><a href="${base}references.html" class="s">References</a></li>
-      <li class="s off"><a href="${base}contact.html" class="s">Contact</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" value="/WEB-INF/templates/wip.jsp" type="template" cascade="true"/>
-  <t:putAttribute name="marginalcontent" type="string" value=""/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/google-analytics.jsp b/src/main/webapp/WEB-INF/views/google-analytics.jsp
deleted file mode 100644
index 610a1195..00000000
--- a/src/main/webapp/WEB-INF/views/google-analytics.jsp
+++ /dev/null
@@ -1,38 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Google Analytics" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a href="${base}impressum.html" class="b">Impressum</a></li>
-    <li class="b"><strong class="b">Google Analytics</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}impressum.html" class="s selected">Impressum</a></h2>
-    <ul id="submenu">
-      <li class="s"><a href="${base}agb.html" class="s">AGB</a></li>
-      <li class="s"><a href="${base}haftung-inhalte.html" class="s">Haftung für Inhalte</a></li>
-      <li class="s"><a href="${base}haftung-links.html" class="s">Haftung für Links</a></li>
-      <li class="s"><a href="${base}urheberrechte.html" class="s">Urheberrechte</a></li>
-      <li class="s"><a href="${base}datenschutz.html" class="s">Datenschutz</a></li>
-      <li class="s"><strong class="s">Google Analytics</strong></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Diese Website benutzt Google Analytics, einen Webanalysedienst der Google Inc. ("Google"). Google Analytics verwendet sog. "Cookies", Textdateien, die auf Ihrem Computer gespeichert werden und die eine Analyse der Benutzung der Website durch Sie ermöglichen. Die durch den Cookie erzeugten Informationen über Ihre Benutzung dieser Website werden in der Regel an einen Server von Google in den USA übertragen und dort gespeichert. Im Falle der Aktivierung der IP-Anonymisierung auf dieser Webseite wird Ihre IP-Adresse von Google jedoch innerhalb von Mitgliedstaaten der Europäischen Union oder in anderen Vertragsstaaten des Abkommens über den Europäischen Wirtschaftsraum zuvor gekürzt.</p>
-    <p>Nur in Ausnahmefällen wird die volle IP-Adresse an einen Server von Google in den USA übertragen und dort gekürzt. Im Auftrag des Betreibers dieser Website wird Google diese Informationen benutzen, um Ihre Nutzung der Website auszuwerten, um Reports über die Websiteaktivitäten zusammenzustellen und um weitere mit der Websitenutzung und der Internetnutzung verbundene Dienstleistungen gegenüber dem Websitebetreiber zu erbringen. Die im Rahmen von Google Analytics von Ihrem Browser übermittelte IP-Adresse wird nicht mit anderen Daten von Google zusammengeführt.</p>
-    <p>Sie können die Speicherung der Cookies durch eine entsprechende Einstellung Ihrer Browser-Software verhindern; wir weisen Sie jedoch darauf hin, dass Sie in diesem Fall gegebenenfalls nicht sämtliche Funktionen dieser Website vollumfänglich werden nutzen können. Sie können darüber hinaus die Erfassung der durch das Cookie erzeugten und auf Ihre Nutzung der Website bezogenen Daten (inkl. Ihrer IP-Adresse) an Google sowie die Verarbeitung dieser Daten durch Google verhindern, indem sie das unter dem folgenden Link verfügbare Browser-Plugin herunterladen und installieren:</p>
-    <p><a href="http://tools.google.com/dlpage/gaoptout?hl=de" title="Das Plugin jetzt herunterladen...">http://tools.google.com/dlpage/gaoptout?hl=de</a>.</p>
-    <!-- http://www.e-recht24.de/impressum-generator.html -->
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="template" value="/WEB-INF/templates/about.jsp"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/haftung-inhalte.jsp b/src/main/webapp/WEB-INF/views/haftung-inhalte.jsp
deleted file mode 100644
index 9d834481..00000000
--- a/src/main/webapp/WEB-INF/views/haftung-inhalte.jsp
+++ /dev/null
@@ -1,35 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Haftung für Inhalte" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a href="${base}impressum.html" class="b">Impressum</a></li>
-    <li class="b"><strong class="b">Haftung für Inhalte</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}impressum.html" class="s selected">Impressum</a></h2>
-    <ul id="submenu">
-      <li class="s"><a href="${base}agb.html" class="s">AGB</a></li>
-      <li class="s"><strong class="s">Haftung für Inhalte</strong></li>
-      <li class="s"><a href="${base}haftung-links.html" class="s">Haftung für Links</a></li>
-      <li class="s"><a href="${base}urheberrechte.html" class="s">Urheberrechte</a></li>
-      <li class="s"><a href="${base}datenschutz.html" class="s">Datenschutz</a></li>
-      <li class="s"><a href="${base}google-analytics.html" class="s">Google Analytics</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Sämtliche Inhalte unserer Internetseiten sind mit größtmöglicher Sorgfalt erstellt worden. Dennoch ist es uns nicht möglich, eine Gewähr dafür zu übernehmen, dass diese Inhalte richtig, vollständig und aktuell sind. Wir sind gemäß § 7 Abs. 1 TMG für die eigenen Inhalte auf unseren Internetseiten verantwortlich. Gemäß den §§ 8, 9 und 10 TMG besteht für uns allerdings keine Verpflichtung, dass wir Informationen von Dritten, die übermittelt oder gespeichert wurden, überwachen oder Umstände ausforschen müssten, die Hinweise auf nicht rechtmäßige Tätigkeiten ergeben. Davon nicht berührt, ist unsere Verpflichtung zur Sperrung oder Entfernung von Informationen, welche uns von den allgemeinen Gesetzen auferlegt wird. Wir haften allerdings insoweit erst in dem Moment, in dem wir von einer konkreten Verletzung von Rechten Kenntnis erlangen. Wenn wir von einer solchen Verletzung von Rechten Kenntnis erlangen, wird eine unverzügliche Entfernung der entsprechenden Inhalte erfolgen.</p>
-    <p><em>Quelle: <a href="http://www.flegl-rechtsanwaelte.de/rechtstipps/muster-impressum-gewerbliche-homepage">www.flegl-rechtsanwaelte.de</a></em></p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="template" value="/WEB-INF/templates/about.jsp"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/haftung-links.jsp b/src/main/webapp/WEB-INF/views/haftung-links.jsp
deleted file mode 100644
index a02b1648..00000000
--- a/src/main/webapp/WEB-INF/views/haftung-links.jsp
+++ /dev/null
@@ -1,35 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Haftung für Links" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a href="${base}impressum.html" class="b">Impressum</a></li>
-    <li class="b"><strong class="b">Haftung für Links</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}impressum.html" class="s selected">Impressum</a></h2>
-    <ul id="submenu">
-      <li class="s"><a href="${base}agb.html" class="s">AGB</a></li>
-      <li class="s"><a href="${base}haftung-inhalte.html" class="s">Haftung für Inhalte</a></li>
-      <li class="s"><strong class="s">Haftung für Links</strong></li>
-      <li class="s"><a href="${base}urheberrechte.html" class="s">Urheberrechte</a></li>
-      <li class="s"><a href="${base}datenschutz.html" class="s">Datenschutz</a></li>
-      <li class="s"><a href="${base}google-analytics.html" class="s">Google Analytics</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Unsere Internetseiten enthalten Links, die zu externen Internetseiten von Dritten führen. Auf die Inhalte dieser externen Seiten haben wir keine Einflussmöglichkeiten. Es ist uns daher nicht möglich, eine Gewähr für diese Inhalte zu übernehmen. Die Verantwortung dafür hat immer der jeweilige Anbieter/Betreiber der entsprechenden Internetseiten. Wir überprüfen die von uns verlinkten Internetseiten zum Zeitpunkt der Verlinkung auf einen möglichen Rechtsverstoß. Die Verlinkung kommt nur dann zustande, wenn ein rechtswidriger Inhalt zu diesem Zeitpunkt nicht erkennbar ist. Es kann uns jedoch, ohne einen konkreten Anhaltspunkt, nicht zugemutet werden, ständig die verlinkten Internetseiten inhaltlich zu kontrollieren. Wenn wir jedoch von einer Rechtsverletzung Kenntnis erlangen, werden wir den entsprechenden Link unverzüglich entfernen.</p>
-    <p><em>Quelle: <a href="http://www.flegl-rechtsanwaelte.de/rechtstipps/muster-impressum-gewerbliche-homepage">www.flegl-rechtsanwaelte.de</a></em></p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="template" value="/WEB-INF/templates/about.jsp"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/impressum.jsp b/src/main/webapp/WEB-INF/views/impressum.jsp
deleted file mode 100644
index 0c7cdc1f..00000000
--- a/src/main/webapp/WEB-INF/views/impressum.jsp
+++ /dev/null
@@ -1,54 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Impressum" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><strong class="b">Impressum</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><strong class="s">Impressum</strong></h2>
-    <ul id="submenu">
-      <li class="s"><a href="${base}agb.html" class="s">AGB</a></li>
-      <li class="s"><a href="${base}haftung-inhalte.html" class="s">Haftung für Inhalte</a></li>
-      <li class="s"><a href="${base}haftung-links.html" class="s">Haftung für Links</a></li>
-      <li class="s"><a href="${base}urheberrechte.html" class="s">Urheberrechte</a></li>
-      <li class="s"><a href="${base}datenschutz.html" class="s">Datenschutz</a></li>
-      <li class="s"><a href="${base}google-analytics.html" class="s">Google Analytics</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p><em>Angaben gemäß § 5 TMG:</em></p>
-    <p>
-      Kai Moritz<br />
-      juplo.de<br />
-      Zumsandestr. 29a<br />
-      48145 Münster
-    </p>
-    <p>Telefon: +49 (0) 176 20 50 47 47</p>
-    <p>E-Mail: <a href="mailto:kai@juplo.de">kai@juplo.de</a></p>
-    <p>Umsatzsteuer-Identifikationsnummer gemäß §27 a Umsatzsteuergesetz: DE 23 500 84 56</p>
-    <p>Aufsichtsbehörde: Stadt Münster</p>
-    <!-- http://www.e-recht24.de/impressum-generator.html -->
-    <h1>Contact</h1>
-    <p>
-      More contact-information (Facebook, Google+, ...) can be found on the
-      <a href="${base}contact.html" title="Show all contact-informations">contact-page</a>.
-    </p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="template" value="/WEB-INF/templates/about.jsp"/>
-  <t:putAttribute name="footer" type="string">
-    <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
-    <li class="f"><strong class="f">Impressum</strong></li>
-    <li class="f about"><a class="f" href="${base}about.html">About</a></li>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/index.jsp b/src/main/webapp/WEB-INF/views/index.jsp
deleted file mode 100644
index 6e84c619..00000000
--- a/src/main/webapp/WEB-INF/views/index.jsp
+++ /dev/null
@@ -1,110 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="NOMENU">
-  <t:putAttribute name="title" value="Branding" type="string" cascade="true"/>
-  <t:putAttribute name="header">
-    <h1 id="logo"><strong class="l">juplo</strong></h1>
-  </t:putAttribute>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><strong class="b">Home</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="contentcontainer" type="string">
-    <div id="content" class="main">
-      <div class="pack bg cf">
-        <div class="p left">
-          <h2>hibernate4-maven-plugin</h2>
-          <p><strong>Lorem ipsum</strong> dolor <a href="${base}projects/typo.html">sit amet</a>, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud <a href="${base}projects/html-experimente.html">exercitation</a> 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>
-        <div class="p right">
-          <h2>fix-swf</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>
-        </div>
-      </div>
-      <div class="single">
-        <h2>accelerator</h2>
-        <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>
-      <div class="pack bg cf">
-        <div class="p right">
-          <h2>jquery.openx</h2>
-          <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>
-        <div class="p left">
-          <h2>Regex-Lab</h2>
-          <p>
-            Excepteur sint occaecat cupidatat non proident, sunt in
-            culpa qui officia deserunt mollit anim id est laborum.
-          </p>
-        </div>
-      </div>
-      <div class="pack cf">
-        <div class="p left">
-          <h2>jquery.openx</h2>
-          <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>
-        <div class="p right">
-          <h2>Regex-Lab</h2>
-          <p>
-            Excepteur sint occaecat cupidatat non proident, sunt in
-            culpa qui officia deserunt mollit anim id est laborum.
-          </p>
-        </div>
-      </div>
-    </div>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="string">
-    <aside class="m">
-      <div class="widget widget_recent_entries">
-        <h2 class="widgettitle">Recent Posts</h2>
-        <ul>
-          <li>
-            <a href="http://localhost/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</a>
-          </li>
-          <li>
-            <a href="http://localhost/hibernate4-maven-plugin-1-0-3-released/" title="hibernate4-maven-plugin 1.0.3 released!">hibernate4-maven-plugin 1.0.3 released!</a>
-          </li>
-          <li>
-            <a href="http://localhost/log-out-from-wrong-account-with-maven-appengine-plugin/" title="Log out from wrong Account with maven-appengine-plugin">Log out from wrong Account with maven-appengine-plugin</a>
-          </li>
-          <li>
-            <a href="http://localhost/bidirectional-association-with-elementcollection/" title="Bidirectional Association with @ElementCollection">Bidirectional Association with @ElementCollection</a>
-          </li>
-          <li>
-            <a href="http://localhost/hibernate4-maven-plugin-1-0-2-release/" title="hibernate4-maven-plugin 1.0.2 released!">hibernate4-maven-plugin 1.0.2 released!</a>
-          </li>
-          <li>
-            <a href="http://localhost/hibernate4-maven-plugin-1-0-1-released/" title="hibernate4-maven-plugin 1.0.1 released!">hibernate4-maven-plugin 1.0.1 released!</a>
-          </li>
-          <li>
-            <a href="http://localhost/hibernate4-maven-plugin-1-0-released/" title="hibernate4-maven-plugin 1.0 released!">hibernate4-maven-plugin 1.0 released!</a>
-          </li>
-          <li>
-            <a href="http://localhost/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="hibernate4-maven-plugin">hibernate4-maven-plugin</a>
-          </li>
-        </ul>
-      </div>
-    </aside>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/projects.jsp b/src/main/webapp/WEB-INF/views/projects.jsp
deleted file mode 100644
index 42108a08..00000000
--- a/src/main/webapp/WEB-INF/views/projects.jsp
+++ /dev/null
@@ -1,29 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Projects" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><strong class="b">Projects</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><strong class="m">Projects</strong></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><strong class="s">Projects</strong></h2>
-    <ul id="submenu">
-      <li class="s sub"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-      <li class="s sub"><a href="${base}projects/fix-swf.html" class="s">fix-swf</a></li>
-      <li class="s"><a href="#" class="s">jquery.openx</a></li>
-      <li class="s"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-      <li class="s sub"><a href="#" class="s">accelerator</a></li>
-      <li class="s"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-    </ul>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/projects/fix-swf.jsp b/src/main/webapp/WEB-INF/views/projects/fix-swf.jsp
deleted file mode 100644
index 66084a74..00000000
--- a/src/main/webapp/WEB-INF/views/projects/fix-swf.jsp
+++ /dev/null
@@ -1,42 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Fix SWF" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-    <li class="b"><strong class="b">Fix SWF</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu">
-      <span class="s">Submenu for section</span>
-      <a class="s selected" href="${base}projects.html">Projects</a>
-    </h2>
-    <ul id="submenu" class="s">
-      <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-      <li class="s sub">
-        <strong class="s">fix-swf</strong>
-        <ul class="s active">
-          <li class="s"><a href="${base}projects/fix-swf/overview.html" class="s">Overview</a></li>
-          <li class="s"><a href="${base}projects/fix-swf/getting-started.html" class="s">Getting Started</a></li>
-          <li class="s"><a href="#" class="s">FAQ</a></li>
-          <li class="s"><a href="#" class="s">Documentation</a></li>
-        </ul>
-      </li>
-      <li class="s off"><a href="#" class="s">jquery.openx</a></li>
-      <li class="s off"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-      <li class="s sub off"><a href="#" class="s">accelerator</a></li>
-      <li class="s off"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" value="Nearly empty" type="string" cascade="true"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/projects/fix-swf/getting-started.jsp b/src/main/webapp/WEB-INF/views/projects/fix-swf/getting-started.jsp
deleted file mode 100644
index 687acf28..00000000
--- a/src/main/webapp/WEB-INF/views/projects/fix-swf/getting-started.jsp
+++ /dev/null
@@ -1,42 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Fix SWF - Getting Started" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-    <li class="b"><a class="b" href="${base}projects/fix-swf.html">Fix SWF</a></li>
-    <li class="b"><strong class="b">Getting Started</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu">
-      <span class="s">Submenu for section</span>
-      <a class="s selected" href="${base}projects.html">Projects</a>
-    </h2>
-    <ul id="submenu" class="s">
-      <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-      <li class="s sub">
-        <a href="${base}projects/fix-swf.html" class="s selected">fix-swf</a>
-        <ul class="s active">
-          <li class="s"><a href="${base}projects/fix-swf/overview.html" class="s">Overview</a></li>
-          <li class="s"><strong class="s">Getting Started</strong></li>
-          <li class="s"><a href="#" class="s">FAQ</a></li>
-          <li class="s"><a href="#" class="s">Documentation</a></li>
-        </ul>
-      </li>
-      <li class="s off"><a href="#" class="s">jquery.openx</a></li>
-      <li class="s off"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-      <li class="s sub off"><a href="#" class="s">accelerator</a></li>
-      <li class="s off"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-    </ul>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/projects/fix-swf/overview.jsp b/src/main/webapp/WEB-INF/views/projects/fix-swf/overview.jsp
deleted file mode 100644
index 4608efbe..00000000
--- a/src/main/webapp/WEB-INF/views/projects/fix-swf/overview.jsp
+++ /dev/null
@@ -1,42 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Fix SWF - Overview" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-    <li class="b"><a class="b" href="${base}projects/fix-swf.html">Fix SWF</a></li>
-    <li class="b"><strong class="b">Overview</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu">
-      <span class="s">Submenu for section</span>
-      <a class="s selected" href="${base}projects.html">Projects</a>
-    </h2>
-    <ul id="submenu" class="s">
-      <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-      <li class="s sub">
-        <a href="${base}projects/fix-swf.html" class="s selected">fix-swf</a>
-        <ul class="s active">
-          <li class="s"><strong class="s">Overview</strong></li>
-          <li class="s"><a href="${base}projects/fix-swf/getting-started.html" class="s">Getting Started</a></li>
-          <li class="s"><a href="#" class="s">FAQ</a></li>
-          <li class="s"><a href="#" class="s">Documentation</a></li>
-        </ul>
-      </li>
-      <li class="s off"><a href="#" class="s">jquery.openx</a></li>
-      <li class="s off"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-      <li class="s sub off"><a href="#" class="s">accelerator</a></li>
-      <li class="s off"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-    </ul>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/projects/html-experimente.jsp b/src/main/webapp/WEB-INF/views/projects/html-experimente.jsp
deleted file mode 100644
index 0ef6f2ba..00000000
--- a/src/main/webapp/WEB-INF/views/projects/html-experimente.jsp
+++ /dev/null
@@ -1,34 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="HTML-Experimente" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-    <li class="b"><strong class="b">HTML-Experimente</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu">
-      <span class="s">Submenu for section</span>
-      <a class="s selected" href="${base}projects.html">Projects</a>
-    </h2>
-    <ul id="submenu" class="s active">
-      <li class="s sub"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-      <li class="s sub"><a href="${base}projects/fix-swf.html" class="s">fix-swf</a></li>
-      <li class="s"><a href="#" class="s">jquery.openx</a></li>
-      <li class="s"><strong class="s">HTML-Experimente</strong></li>
-      <li class="s sub"><a href="#" class="s">accelerator</a></li>
-      <li class="s"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" value="/WEB-INF/templates/test/experimente.jsp" type="template" cascade="true"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/projects/typo.jsp b/src/main/webapp/WEB-INF/views/projects/typo.jsp
deleted file mode 100644
index a551cefa..00000000
--- a/src/main/webapp/WEB-INF/views/projects/typo.jsp
+++ /dev/null
@@ -1,129 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Typo" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-    <li class="b"><strong class="b">Typography</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu">
-      <span class="s">Submenu for section</span>
-      <a class="s selected" href="${base}projects.html">Projects</a>
-    </h2>
-    <ul id="submenu" class="s active">
-      <li class="s sub"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-      <li class="s sub"><a href="${base}projects/fix-swf.html" class="s">fix-swf</a></li>
-      <li class="s"><a href="#" class="s">jquery.openx</a></li>
-      <li class="s"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-      <li class="s sub"><a href="#" class="s">accelerator</a></li>
-      <li class="s"><strong class="s">Typography</strong></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      Lorem ipsum dolor <a href="#da">sit amet</a>, consectetur adipisicing elit,
-      sed do eiusmod <strong>tempor incididunt</strong> ut labore et dolore
-      magna aliqua. Ut enim ad minim veniam, quis nostrud
-      <a href="#dort">exercitation</a> ullamco laboris nisi ut aliquip
-      <em>ex ea</em> commodo consequat. Duis aute irure dolor in reprehenderit
-      in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
-      <strong>Excepteur sint <em>occaecat</em> cupidatat non proident</strong>,
-      sunt in culpa qui officia deserunt mollit anim id est laborum.
-    </p>
-    <h2>Ein Link <a href="#link">im Titel</a></h2>
-    <p>Ein Link <a href="#link">im Text</a>.</p>
-    <h2>Normal / Italic / Bold / Bold+Italic</h2>
-    <ul>
-      <li>normal</li>
-      <li><em>italic</em></li>
-      <li><strong>bold</strong></li>
-      <li><strong><em>bold italic</em></strong></li>
-    </ul>
-    <p>
-      ÄäÖöÜüß@€¢
-      <strong>ÄäÖöÜüß@€¢</strong>
-      <em>ÄäÖöÜüß@€¢</em>
-      <strong><em>ÄäÖöÜüß@€¢</em></strong>
-    </p>
-    <h1>H1: Heading</h1>
-    <h2>H2: Heading</h2>
-    <h3>H3: Heading</h3>
-    <h4>H4: Heading</h4>
-    <h1>H1: Heading</h1>
-    <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>
-    <h2>H2: Heading</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. 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>H3: 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. 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>H4: Heading</h4>
-    <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>
-    <h1>Preformatted code</h1>
-    <p>
-      <em>Juplo Branding</em> uses
-      <a href="http://google-code-prettify.googlecode.com/svn/trunk/README.html" title="Visit prettify's README">google-code-prettify</a> for automatic
-      syntax highlighting.
-    </p>
-    <pre class="prettyprint linenums"><code class="language-xml">
-&lt;plugin&gt;
-  &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
-  &lt;artifactId&gt;wro4j-maven-plugin&lt;/artifactId&gt;
-  &lt;version&gt;${wro4j.version}&lt;/version&gt;
-  &lt;configuration&gt;
-    &lt;wroManagerFactory&gt;ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory&lt;/wroManagerFactory&gt;
-    &lt;cssDestinationFolder&gt;${project.build.directory}/${project.build.finalName}/css/&lt;/cssDestinationFolder&gt;
-  &lt;/configuration&gt;
-  &lt;executions&gt;
-    &lt;execution&gt;
-      &lt;phase&gt;package&lt;/phase&gt;
-      &lt;goals&gt;
-        &lt;goal&gt;run&lt;/goal&gt;
-      &lt;/goals&gt;
-    &lt;/execution&gt;
-  &lt;/executions&gt;
-&lt;/plugin&gt;
-</code></pre>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/references.jsp b/src/main/webapp/WEB-INF/views/references.jsp
deleted file mode 100644
index 33e2074d..00000000
--- a/src/main/webapp/WEB-INF/views/references.jsp
+++ /dev/null
@@ -1,37 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="References" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}about.html">About</a></li>
-    <li class="b"><strong class="b">References</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}about.html" class="s">About</a></h2>
-    <ul id="submenu">
-      <li class="s sub off"><a href="${base}expertise.html" class="s">Expertise</a></li>
-      <li class="s sub">
-        <strong class="s">References</strong>
-        <ul class="s active">
-          <li class="s sub"><span href="${base}references/coolibri.html" class="s">coolibri.de</span></li>
-          <li class="s"><span href="${base}references/hibernate4-maven-plugin.html" class="s">hibernate4-maven-plugin</span></li>
-          <li class="s sub"><span href="${base}.html" class="s"></span></li>
-          <li class="s sub"><span href="${base}.html" class="s"></span></li>
-        </ul>
-      </li>
-      <li class="s off"><a href="${base}contact.html" class="s">Contact</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" value="/WEB-INF/templates/wip.jsp" type="template" cascade="true"/>
-  <t:putAttribute name="marginalcontent" type="string" value=""/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/basis-layout.jsp b/src/main/webapp/WEB-INF/views/test/basis-layout.jsp
deleted file mode 100644
index fdccc393..00000000
--- a/src/main/webapp/WEB-INF/views/test/basis-layout.jsp
+++ /dev/null
@@ -1,21 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Nur das Basis-Layout" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      In diese Seite ist nur das Basis-Layout eingebunden
-      (<code>/css/base.css</code>).
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/breadcrumb.jsp b/src/main/webapp/WEB-INF/views/test/breadcrumb.jsp
deleted file mode 100644
index 786c773c..00000000
--- a/src/main/webapp/WEB-INF/views/test/breadcrumb.jsp
+++ /dev/null
@@ -1,12 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Seite mit sehr langem Breadcrumb" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb" type="string">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a class="b" href="${base}blog.html">Blog</a></li>
-    <li class="b"><strong class="b">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</strong></li>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/druck-layout.jsp b/src/main/webapp/WEB-INF/views/test/druck-layout.jsp
deleted file mode 100644
index 822333d0..00000000
--- a/src/main/webapp/WEB-INF/views/test/druck-layout.jsp
+++ /dev/null
@@ -1,23 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Die für den Ausdruck angepasste Ansicht" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-    <link rel="stylesheet" type="text/css" href="${base}css/print.css" />
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      In diese Seite ist nur das Basis-Layout eingebunden
-      (<code>/css/base.css</code>).
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-    <t:insertTemplate template="/WEB-INF/templates/maincontent.jsp"/>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/error.jsp b/src/main/webapp/WEB-INF/views/test/error.jsp
deleted file mode 100644
index 4bc0ebb7..00000000
--- a/src/main/webapp/WEB-INF/views/test/error.jsp
+++ /dev/null
@@ -1,10 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Diese Seite erzeugt einen Fehler!" type="string" cascade="true"/>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <% Integer.parseInt("foo"); //throws an exception %>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git "a/src/main/webapp/WEB-INF/views/test/fast-leer-kein-men\303\274-aber-marginalinhalt.jsp" "b/src/main/webapp/WEB-INF/views/test/fast-leer-kein-men\303\274-aber-marginalinhalt.jsp"
deleted file mode 100644
index 462f2078..00000000
--- "a/src/main/webapp/WEB-INF/views/test/fast-leer-kein-men\303\274-aber-marginalinhalt.jsp"
+++ /dev/null
@@ -1,20 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Fast leere Seite ohne Menü, aber mit Marginalinhalt" type="string" cascade="true"/>
-  <t:putAttribute name="contentclass" value="nomenu" type="string"/>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Diese Seite ist fast leer...</p>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git "a/src/main/webapp/WEB-INF/views/test/fast-leer-kein-men\303\274.jsp" "b/src/main/webapp/WEB-INF/views/test/fast-leer-kein-men\303\274.jsp"
deleted file mode 100644
index 28a10a5a..00000000
--- "a/src/main/webapp/WEB-INF/views/test/fast-leer-kein-men\303\274.jsp"
+++ /dev/null
@@ -1,21 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Fast leere Seite ohne Menü" type="string" cascade="true"/>
-  <t:putAttribute name="contentclass" value="nomenu" type="string"/>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Diese Seite ist fast leer...</p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" value="" type="string"/>
-</t:insertDefinition>
diff --git "a/src/main/webapp/WEB-INF/views/test/fast-leer-mit-men\303\274-und-marginalinhalt.jsp" "b/src/main/webapp/WEB-INF/views/test/fast-leer-mit-men\303\274-und-marginalinhalt.jsp"
deleted file mode 100644
index 742b17b1..00000000
--- "a/src/main/webapp/WEB-INF/views/test/fast-leer-mit-men\303\274-und-marginalinhalt.jsp"
+++ /dev/null
@@ -1,10 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Fast leere Seite mit Menü und Marginalinhalt" type="string" cascade="true"/>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Diese Seite ist fast leer...</p>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git "a/src/main/webapp/WEB-INF/views/test/fast-leer-mit-men\303\274.jsp" "b/src/main/webapp/WEB-INF/views/test/fast-leer-mit-men\303\274.jsp"
deleted file mode 100644
index 9bfae154..00000000
--- "a/src/main/webapp/WEB-INF/views/test/fast-leer-mit-men\303\274.jsp"
+++ /dev/null
@@ -1,11 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Fast leere Seite mit Menü" type="string" cascade="true"/>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Diese Seite ist fast leer...</p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" value="" type="string"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/formulare.jsp b/src/main/webapp/WEB-INF/views/test/formulare.jsp
deleted file mode 100644
index 12f487ec..00000000
--- a/src/main/webapp/WEB-INF/views/test/formulare.jsp
+++ /dev/null
@@ -1,257 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Formulare" type="string" cascade="true"/>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <form class="form" action="#" method="get">
-      <h2 class="f">Anzeigetext</h2>
-      <div class="f textarea">
-        <label class="f info" for="textarea_01">Geben Sie hier Ihren Anzeigentext ein.</label>
-        <textarea class="f error" id="textarea_01" cols="50" rows="10">Eingegebener Text</textarea>
-        <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Es wurde kein Text für die Anzeige eingegeben!</span>
-      </div>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Textformatierung</h2>
-      <fieldset class="f radiobutton cf">
-        <legend class="f info">
-          Die zusätzlichen Gestaltungsoptionen sind nur für das Magazin wählbar.<br />
-          Online erscheint die Anzeige als normaler Fließtext.
-        </legend>
-        <hr class="f" />
-        <div class="col2">
-          <div class="f">
-            <input class="f" id="radio_tbox_01" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_01">normaler Fließtext</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_02" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_02">Text zentriert</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_03" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_03">Text fett, Negativdruck</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_04" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_04">Text fett</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_05" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_05">Text fett und rot</label>
-          </div>
-        </div>
-        <div class="col2">
-          <div class="f">
-            <input class="f" id="radio_tbox_06" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_06">Text fett, Anzeige blau hinterlegt</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_07" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_07">Text fett, Anzeige gelb hinterlegt</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_08" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_08">Anzeige schwarz eingerahmt</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_09" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_09">Anzeige rot eingerahmt</label>
-          </div>
-        </div>
-      </fieldset>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Einspaltige Radiobuttons...</h2>
-      <fieldset class="f radiobutton">
-        <div class="f">
-          <input class="f" id="radio_tbox_b01" type="radio" name="radio_tbox" />
-          <label class="f" for="radio_tbox_b01">Dies ist eine etwas länglichere Beschreibung der auswählbaren Option</label>
-        </div>
-        <div class="f">
-          <input class="f" id="radio_tbox_b02" type="radio" name="radio_tbox" />
-          <label class="f" for="radio_tbox_b02">Option X</label>
-        </div>
-        <div class="f">
-          <input class="f" id="radio_tbox_b03" type="radio" name="radio_tbox" />
-          <label class="f" for="radio_tbox_b03">Dies ist eine sehr, sehr lange Beschreibung der auswählbaren Option - so lang, dass sie am Ende hoffentlich umbricht...</label>
-        </div>
-      </fieldset>
-      <hr class="f" />
-      <div class="f submit">
-        <input class="f" type="submit" value="&gt; zur Übersicht" />
-        <input class="f left" type="submit" value="&lt; zurück" />
-        <input class="f" type="submit" value="&gt; weiter" />
-      </div>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Bild</h2>
-      <fieldset class="f checkbox">
-        <legend class="f">
-          Du kannst Deiner Anzeige ein Bild hinzufügen.
-          Das Bild erscheint nur online.
-          Im Magazin erscheint die Kleinanzeige mit Hinweis auf das Onlinebild.
-        </legend>
-        <hr class="f" />
-        <div class="f">
-          <input class="f" id="checkbox_tbox_01" type="checkbox" name="checkbox_tbox" />
-          <label class="f" for="checkbox_tbox_01">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
-        </div>
-        <div class="f">
-          <input class="f" id="checkbox_tbox_02" type="checkbox" name="checkbox_tbox" />
-          <label class="f" for="checkbox_tbox_02">Ich habe die AGB für das Hochladen von Bildern gelesen und akzeptiere diese</label>
-        </div>
-      </fieldset>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Alleinstehende Checkbox</h2>
-      <div class="f checkbox">
-        <input class="f" id="checkbox_tbox_03" type="checkbox" name="checkbox_tbox" />
-        <label class="f" for="checkbox_tbox_03">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
-      </div>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Kundendaten</h2>
-      <p class="f required">
-        <strong class="r">Pflichtfelder</strong> sind mit einem
-        <strong class="r symbol">*</strong> markiert.
-      </p>
-      <div class="f text required">
-        <label for="text_tbox_01" class="f"><span class="required">* </span>Nachname</label>
-        <input class="f" id="text_tbox_01" type="text" value="Mustermann" />
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_02" class="f">Vorname</label>
-        <input class="f" id="text_tbox_02" type="text" value="Max" />
-      </div>
-      <div class="f select required">
-        <label for="text_tbox_03" class="f"><span class="required">* </span>Ort</label>
-        <select class="f" id="text_tbox_03">
-          <option>Dortmund</option>
-          <option>Bochum</option>
-          <option>Essen</option>
-          <option>Mönchengladbach</option>
-          <option>Oberhausen</option>
-          <option>Castrop-Rauxel</option>
-          <option>Düsseldorf</option>
-        </select>
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_04" class="f"><span class="required">* </span>Straße/Hausnr.</label>
-        <input class="f error" id="text_tbox_04" type="text" value="" />
-        <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Dies ist ein Pflichtfeld!</span>
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_05" class="f"><span class="required">* </span>Postleitzahl</label>
-        <input class="f" id="text_tbox_05" type="text" value="" />
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_06" class="f">Telefon</label>
-        <input class="f" id="text_tbox_06" type="text" value="" />
-      </div>
-      <hr class="f" />
-      <div class="f submit">
-        <input class="f" type="submit" value="&gt; weiter" />
-      </div>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Anzeige regionalisieren</h2>
-      <p class="f">
-        Indem Du Deine Kleinanzeige einer Stadt zuordnest, können Interessenten
-        diese online leichter finden, wenn sie nur nach Kleinanzeigen aus
-        bestimmten Städten suchen.
-        Du kannst auch keine Stadt zuordnen, dann wird die Kleinanzeige von
-        diesen Interessenten aber auch nicht gefunden.
-      </p>
-      <hr class="f" />
-      <div class="f text">
-        <label class="f" for="city">Stadt</label>
-        <input id="city" type="text" class="f" />
-        <p class="f info">
-          Das Feld leer lassen, wenn die Anzeige nicht regionalisiert werden soll.
-        </p>
-      </div>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Ein Passwort-Eingabe-Feld</h2>
-      <div class="f text required">
-        <label for="text_tbox_05" class="f"><span class="required">* </span>Passwort</label>
-        <input class="f" id="text_tbox_05" type="password" value="t" />
-      </div>
-    </form>
-    <form class="form" action="#" method="get">
-      <h2 class="f">Lade das Bild hoch</h2>
-      <p class="f info">
-        Du kannst ein Bild im JPEG- oder PNG-Format hochladen.
-        Das Bild darf nicht größer als 8 MByte sein.
-      </p>
-      <div class="f file required">
-        <label for="file_tbox_01" class="f"><span class="required">* </span>Bild</label>
-        <input class="f" id="file_tbox_01" type="file" />
-      </div>
-      <hr class="f" />
-      <div class="f submit">
-        <input class="f" type="submit" value="&gt; Doch kein Bild" />
-        <input class="f" type="submit" value="&gt; Bild hochladen" />
-      </div>
-    </form>
-    <div class="form">
-      <h2 class="f">Antworten</h2>
-      <p class="f required">
-        <strong class="r">Pflichtfelder</strong> sind mit einem
-        <strong class="r symbol">*</strong> markiert.
-      </p>
-      <div class="f text required">
-        <label class="f" for="replyTo"><span class="required">*</span> Antwort-Adresse</label>
-        <input id="replyTo" name="replyTo" class="f" tabindex="1" type="text" value=""/>
-      </div>
-      <div class="f text required">
-        <label class="f" for="replyTo"><span class="required">*</span> Adresse wiederholen</label>
-        <input id="replyToRepeated" name="replyToRepeated" class="f" tabindex="2" type="text" value=""/>
-      </div>
-      <div class="f text required">
-        <label class="f" for="subject"><span class="required">*</span> Betreff</label>
-        <input id="subject" name="subject" class="f" tabindex="3" type="text" value=""/>
-      </div>
-      <div class="f textarea required">
-        <label class="f" for="text"><span class="required">*</span> Nachricht</label>
-        <textarea id="text" name="text" class="f" tabindex="4" rows="15" cols="20"></textarea>
-      </div>
-      <div class="f checkbox">
-        <input id="attachment1" name="attachment" class="f" tabindex="4" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_attachment" value="on"/>
-        <label class="f" for="attachment">Ich möchte eine Datei an die E-Mail anhängen.</label>
-      </div>
-      <div class="f checkbox">
-        <input id="copy1" name="copy" class="f" tabindex="5" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_copy" value="on"/>
-        <label class="f" for="copy">Ich möchte eine Kopie der Nachricht zugesendet bekommen.</label>
-      </div>
-    </div>
-    <div class="form cf">
-      <div class="col2 left">
-        <h2 class="f">Weiter mit Anmeldung</h2>
-        <div class="f text">
-          <label class="f" for="username">Benutzername</label>
-          <input class="f" name="username" id="username" type="text" tabindex="6" />
-        </div>
-        <div class="f text">
-          <label class="f" for="password">Passwort</label>
-          <input class="f" name="password" id="password" type="password" tabindex="7" />
-        </div>
-      </div>
-      <div class="col2 right">
-        <h2 class="f">Weiter ohne Anmeldung</h2>
-        <!-- <a href="/kleinanzeigen/37431/lust+.html" title="Zu schwer? Hier klicken um das Bild zu wechseln!"><img src="/img/captcha.jpg" alt="Captcha" width="120" height="60" /></a> -->
-        <div class="f captcha cf">
-          <span class="f">Was steht da?</span>
-          <img class="f" src="/img/captcha.jpg" alt="Captcha" width="120" height="60" />
-        </div>
-        <div class="f text">
-          <label class="f" for="captcha">Lösung</label>
-          <input class="f" name="captcha" id="captcha" type="text" tabindex="8" />
-        </div>
-      </div>
-    </div>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/kein-layout.jsp b/src/main/webapp/WEB-INF/views/test/kein-layout.jsp
deleted file mode 100644
index dca3c266..00000000
--- a/src/main/webapp/WEB-INF/views/test/kein-layout.jsp
+++ /dev/null
@@ -1,18 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Nur das Basis-Layout" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string" value=""/>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      In diese Seite ist nur das Basis-Layout eingebunden
-      (<code>/css/base.css</code>).
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/phone.jsp b/src/main/webapp/WEB-INF/views/test/phone.jsp
deleted file mode 100644
index 436a727d..00000000
--- a/src/main/webapp/WEB-INF/views/test/phone.jsp
+++ /dev/null
@@ -1,22 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Layout für Smartphones" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-    <link rel="stylesheet" type="text/css" href="${base}css/phone.css" />
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      Diese Seite bindet alle Styles ein, die für Smartphones eingebunden
-      werden (<code>/css/base.css</code> und <code>/css/phone.css</code>).
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/seitenaufteilung.jsp b/src/main/webapp/WEB-INF/views/test/seitenaufteilung.jsp
deleted file mode 100644
index 7ee9a510..00000000
--- a/src/main/webapp/WEB-INF/views/test/seitenaufteilung.jsp
+++ /dev/null
@@ -1,23 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Nur das Basis-Layout und die Seitenaufteilung" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-    <link rel="stylesheet" type="text/css" href="/css/seitenaufteilung.css" />
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      In diese Seite sind nur das Basis-Layout (<code>/css/base.css</code>)
-      und die Seitenaufteilung (<code>/less/screen/layout.less</code>)
-      eingebunden.
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/seitenkopf.jsp b/src/main/webapp/WEB-INF/views/test/seitenkopf.jsp
deleted file mode 100644
index ec76d757..00000000
--- a/src/main/webapp/WEB-INF/views/test/seitenkopf.jsp
+++ /dev/null
@@ -1,23 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Nur das Basis-Layout und der Seitenkopf" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-    <link rel="stylesheet" type="text/css" href="/css/seitenkopf.css" />
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      In diese Seite sind nur das Basis-Layout (<code>/css/base.css</code>)
-      und der Seitenkopf (<code>/less/screen/head.less</code>)
-      eingebunden.
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/symbole.jsp b/src/main/webapp/WEB-INF/views/test/symbole.jsp
deleted file mode 100644
index 3dd15715..00000000
--- a/src/main/webapp/WEB-INF/views/test/symbole.jsp
+++ /dev/null
@@ -1,404 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Symbol-Font" type="string" cascade="true"/>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <h2>100%</h2>
-    <div class="symbols">
-      <span class="e600">&#xe600;</span>
-      <span class="e601">&#xe601;</span>
-      <span class="e602">&#xe602;</span>
-      <span class="e603">&#xe603;</span>
-      <span class="e604">&#xe604;</span>
-      <span class="e605">&#xe605;</span>
-      <span class="e606">&#xe606;</span>
-      <span class="e607">&#xe607;</span>
-      <span class="e608">&#xe608;</span>
-      <span class="e609">&#xe609;</span>
-      <span class="e60a">&#xe60a;</span>
-      <span class="e60b">&#xe60b;</span>
-      <span class="e60c">&#xe60c;</span>
-      <span class="e60d">&#xe60d;</span>
-      <span class="e60e">&#xe60e;</span>
-      <span class="e60f">&#xe60f;</span>
-      <span class="e610">&#xe610;</span>
-      <span class="e611">&#xe611;</span>
-      <span class="e612">&#xe612;</span>
-      <span class="e613">&#xe613;</span>
-      <span class="e614">&#xe614;</span>
-      <span class="e615">&#xe615;</span>
-      <span class="e616">&#xe616;</span>
-      <span class="e617">&#xe617;</span>
-      <span class="e618">&#xe618;</span>
-      <span class="e619">&#xe619;</span>
-      <span class="e61a">&#xe61a;</span>
-      <span class="e61b">&#xe61b;</span>
-      <span class="e61c">&#xe61c;</span>
-      <span class="e61d">&#xe61d;</span>
-      <span class="e61e">&#xe61e;</span>
-      <span class="e61f">&#xe61f;</span>
-      <span class="e620">&#xe620;</span>
-      <span class="e621">&#xe621;</span>
-      <span class="e622">&#xe622;</span>
-      <span class="e623">&#xe623;</span>
-      <span class="e624">&#xe624;</span>
-      <span class="e625">&#xe625;</span>
-      <span class="e626">&#xe626;</span>
-      <span class="e627">&#xe627;</span>
-      <span class="e628">&#xe628;</span>
-      <span class="e629">&#xe629;</span>
-      <span class="e62a">&#xe62a;</span>
-      <span class="e62b">&#xe62b;</span>
-      <span class="e62c">&#xe62c;</span>
-      <span class="e62d">&#xe62d;</span>
-      <span class="e62e">&#xe62e;</span>
-      <span class="e62f">&#xe62f;</span>
-      <span class="e630">&#xe630;</span>
-      <span class="e631">&#xe631;</span>
-      <span class="e632">&#xe632;</span>
-      <span class="e633">&#xe633;</span>
-      <span class="e634">&#xe634;</span>
-      <span class="e635">&#xe635;</span>
-      <span class="e636">&#xe636;</span>
-      <span class="e637">&#xe637;</span>
-      <span class="e638">&#xe638;</span>
-      <span class="e639">&#xe639;</span>
-      <span class="e63a">&#xe63a;</span>
-      <span class="e63b">&#xe63b;</span>
-      <span class="e63c">&#xe63c;</span>
-      <span class="e63d">&#xe63d;</span>
-      <span class="e63e">&#xe63e;</span>
-      <span class="e63f">&#xe63f;</span>
-      <span class="e640">&#xe640;</span>
-      <span class="e641">&#xe641;</span>
-      <span class="e642">&#xe642;</span>
-      <span class="e643">&#xe643;</span>
-      <span class="e644">&#xe644;</span>
-      <span class="e645">&#xe645;</span>
-      <span class="e646">&#xe646;</span>
-      <span class="e647">&#xe647;</span>
-      <span class="e648">&#xe648;</span>
-      <span class="e649">&#xe649;</span>
-      <span class="e64a">&#xe64a;</span>
-      <span class="e64b">&#xe64b;</span>
-    </div>
-    <h2>200%</h2>
-    <div class="symbols" style="font-size: 200%; line-height: 1.5em">
-      <span class="e600">&#xe600;</span>
-      <span class="e601">&#xe601;</span>
-      <span class="e602">&#xe602;</span>
-      <span class="e603">&#xe603;</span>
-      <span class="e604">&#xe604;</span>
-      <span class="e605">&#xe605;</span>
-      <span class="e606">&#xe606;</span>
-      <span class="e607">&#xe607;</span>
-      <span class="e608">&#xe608;</span>
-      <span class="e609">&#xe609;</span>
-      <span class="e60a">&#xe60a;</span>
-      <span class="e60b">&#xe60b;</span>
-      <span class="e60c">&#xe60c;</span>
-      <span class="e60d">&#xe60d;</span>
-      <span class="e60e">&#xe60e;</span>
-      <span class="e60f">&#xe60f;</span>
-      <span class="e610">&#xe610;</span>
-      <span class="e611">&#xe611;</span>
-      <span class="e612">&#xe612;</span>
-      <span class="e613">&#xe613;</span>
-      <span class="e614">&#xe614;</span>
-      <span class="e615">&#xe615;</span>
-      <span class="e616">&#xe616;</span>
-      <span class="e617">&#xe617;</span>
-      <span class="e618">&#xe618;</span>
-      <span class="e619">&#xe619;</span>
-      <span class="e61a">&#xe61a;</span>
-      <span class="e61b">&#xe61b;</span>
-      <span class="e61c">&#xe61c;</span>
-      <span class="e61d">&#xe61d;</span>
-      <span class="e61e">&#xe61e;</span>
-      <span class="e61f">&#xe61f;</span>
-      <span class="e620">&#xe620;</span>
-      <span class="e621">&#xe621;</span>
-      <span class="e622">&#xe622;</span>
-      <span class="e623">&#xe623;</span>
-      <span class="e624">&#xe624;</span>
-      <span class="e625">&#xe625;</span>
-      <span class="e626">&#xe626;</span>
-      <span class="e627">&#xe627;</span>
-      <span class="e628">&#xe628;</span>
-      <span class="e629">&#xe629;</span>
-      <span class="e62a">&#xe62a;</span>
-      <span class="e62b">&#xe62b;</span>
-      <span class="e62c">&#xe62c;</span>
-      <span class="e62d">&#xe62d;</span>
-      <span class="e62e">&#xe62e;</span>
-      <span class="e62f">&#xe62f;</span>
-      <span class="e630">&#xe630;</span>
-      <span class="e631">&#xe631;</span>
-      <span class="e632">&#xe632;</span>
-      <span class="e633">&#xe633;</span>
-      <span class="e634">&#xe634;</span>
-      <span class="e635">&#xe635;</span>
-      <span class="e636">&#xe636;</span>
-      <span class="e637">&#xe637;</span>
-      <span class="e638">&#xe638;</span>
-      <span class="e639">&#xe639;</span>
-      <span class="e63a">&#xe63a;</span>
-      <span class="e63b">&#xe63b;</span>
-      <span class="e63c">&#xe63c;</span>
-      <span class="e63d">&#xe63d;</span>
-      <span class="e63e">&#xe63e;</span>
-      <span class="e63f">&#xe63f;</span>
-      <span class="e640">&#xe640;</span>
-      <span class="e641">&#xe641;</span>
-      <span class="e642">&#xe642;</span>
-      <span class="e643">&#xe643;</span>
-      <span class="e644">&#xe644;</span>
-      <span class="e645">&#xe645;</span>
-      <span class="e646">&#xe646;</span>
-      <span class="e647">&#xe647;</span>
-      <span class="e648">&#xe648;</span>
-      <span class="e649">&#xe649;</span>
-      <span class="e64a">&#xe64a;</span>
-      <span class="e64b">&#xe64b;</span>
-    </div>
-    <h2>300%</h2>
-    <div class="symbols" style="font-size: 300%; line-height: 1.5em">
-      <span class="e600">&#xe600;</span>
-      <span class="e601">&#xe601;</span>
-      <span class="e602">&#xe602;</span>
-      <span class="e603">&#xe603;</span>
-      <span class="e604">&#xe604;</span>
-      <span class="e605">&#xe605;</span>
-      <span class="e606">&#xe606;</span>
-      <span class="e607">&#xe607;</span>
-      <span class="e608">&#xe608;</span>
-      <span class="e609">&#xe609;</span>
-      <span class="e60a">&#xe60a;</span>
-      <span class="e60b">&#xe60b;</span>
-      <span class="e60c">&#xe60c;</span>
-      <span class="e60d">&#xe60d;</span>
-      <span class="e60e">&#xe60e;</span>
-      <span class="e60f">&#xe60f;</span>
-      <span class="e610">&#xe610;</span>
-      <span class="e611">&#xe611;</span>
-      <span class="e612">&#xe612;</span>
-      <span class="e613">&#xe613;</span>
-      <span class="e614">&#xe614;</span>
-      <span class="e615">&#xe615;</span>
-      <span class="e616">&#xe616;</span>
-      <span class="e617">&#xe617;</span>
-      <span class="e618">&#xe618;</span>
-      <span class="e619">&#xe619;</span>
-      <span class="e61a">&#xe61a;</span>
-      <span class="e61b">&#xe61b;</span>
-      <span class="e61c">&#xe61c;</span>
-      <span class="e61d">&#xe61d;</span>
-      <span class="e61e">&#xe61e;</span>
-      <span class="e61f">&#xe61f;</span>
-      <span class="e620">&#xe620;</span>
-      <span class="e621">&#xe621;</span>
-      <span class="e622">&#xe622;</span>
-      <span class="e623">&#xe623;</span>
-      <span class="e624">&#xe624;</span>
-      <span class="e625">&#xe625;</span>
-      <span class="e626">&#xe626;</span>
-      <span class="e627">&#xe627;</span>
-      <span class="e628">&#xe628;</span>
-      <span class="e629">&#xe629;</span>
-      <span class="e62a">&#xe62a;</span>
-      <span class="e62b">&#xe62b;</span>
-      <span class="e62c">&#xe62c;</span>
-      <span class="e62d">&#xe62d;</span>
-      <span class="e62e">&#xe62e;</span>
-      <span class="e62f">&#xe62f;</span>
-      <span class="e630">&#xe630;</span>
-      <span class="e631">&#xe631;</span>
-      <span class="e632">&#xe632;</span>
-      <span class="e633">&#xe633;</span>
-      <span class="e634">&#xe634;</span>
-      <span class="e635">&#xe635;</span>
-      <span class="e636">&#xe636;</span>
-      <span class="e637">&#xe637;</span>
-      <span class="e638">&#xe638;</span>
-      <span class="e639">&#xe639;</span>
-      <span class="e63a">&#xe63a;</span>
-      <span class="e63b">&#xe63b;</span>
-      <span class="e63c">&#xe63c;</span>
-      <span class="e63d">&#xe63d;</span>
-      <span class="e63e">&#xe63e;</span>
-      <span class="e63f">&#xe63f;</span>
-      <span class="e640">&#xe640;</span>
-      <span class="e641">&#xe641;</span>
-      <span class="e642">&#xe642;</span>
-      <span class="e643">&#xe643;</span>
-      <span class="e644">&#xe644;</span>
-      <span class="e645">&#xe645;</span>
-      <span class="e646">&#xe646;</span>
-      <span class="e647">&#xe647;</span>
-      <span class="e648">&#xe648;</span>
-      <span class="e649">&#xe649;</span>
-      <span class="e64a">&#xe64a;</span>
-      <span class="e64b">&#xe64b;</span>
-    </div>
-    <h2>400%</h2>
-    <div class="symbols" style="font-size: 400%; line-height: 1.5em">
-      <span class="e600">&#xe600;</span>
-      <span class="e601">&#xe601;</span>
-      <span class="e602">&#xe602;</span>
-      <span class="e603">&#xe603;</span>
-      <span class="e604">&#xe604;</span>
-      <span class="e605">&#xe605;</span>
-      <span class="e606">&#xe606;</span>
-      <span class="e607">&#xe607;</span>
-      <span class="e608">&#xe608;</span>
-      <span class="e609">&#xe609;</span>
-      <span class="e60a">&#xe60a;</span>
-      <span class="e60b">&#xe60b;</span>
-      <span class="e60c">&#xe60c;</span>
-      <span class="e60d">&#xe60d;</span>
-      <span class="e60e">&#xe60e;</span>
-      <span class="e60f">&#xe60f;</span>
-      <span class="e610">&#xe610;</span>
-      <span class="e611">&#xe611;</span>
-      <span class="e612">&#xe612;</span>
-      <span class="e613">&#xe613;</span>
-      <span class="e614">&#xe614;</span>
-      <span class="e615">&#xe615;</span>
-      <span class="e616">&#xe616;</span>
-      <span class="e617">&#xe617;</span>
-      <span class="e618">&#xe618;</span>
-      <span class="e619">&#xe619;</span>
-      <span class="e61a">&#xe61a;</span>
-      <span class="e61b">&#xe61b;</span>
-      <span class="e61c">&#xe61c;</span>
-      <span class="e61d">&#xe61d;</span>
-      <span class="e61e">&#xe61e;</span>
-      <span class="e61f">&#xe61f;</span>
-      <span class="e620">&#xe620;</span>
-      <span class="e621">&#xe621;</span>
-      <span class="e622">&#xe622;</span>
-      <span class="e623">&#xe623;</span>
-      <span class="e624">&#xe624;</span>
-      <span class="e625">&#xe625;</span>
-      <span class="e626">&#xe626;</span>
-      <span class="e627">&#xe627;</span>
-      <span class="e628">&#xe628;</span>
-      <span class="e629">&#xe629;</span>
-      <span class="e62a">&#xe62a;</span>
-      <span class="e62b">&#xe62b;</span>
-      <span class="e62c">&#xe62c;</span>
-      <span class="e62d">&#xe62d;</span>
-      <span class="e62e">&#xe62e;</span>
-      <span class="e62f">&#xe62f;</span>
-      <span class="e630">&#xe630;</span>
-      <span class="e631">&#xe631;</span>
-      <span class="e632">&#xe632;</span>
-      <span class="e633">&#xe633;</span>
-      <span class="e634">&#xe634;</span>
-      <span class="e635">&#xe635;</span>
-      <span class="e636">&#xe636;</span>
-      <span class="e637">&#xe637;</span>
-      <span class="e638">&#xe638;</span>
-      <span class="e639">&#xe639;</span>
-      <span class="e63a">&#xe63a;</span>
-      <span class="e63b">&#xe63b;</span>
-      <span class="e63c">&#xe63c;</span>
-      <span class="e63d">&#xe63d;</span>
-      <span class="e63e">&#xe63e;</span>
-      <span class="e63f">&#xe63f;</span>
-      <span class="e640">&#xe640;</span>
-      <span class="e641">&#xe641;</span>
-      <span class="e642">&#xe642;</span>
-      <span class="e643">&#xe643;</span>
-      <span class="e644">&#xe644;</span>
-      <span class="e645">&#xe645;</span>
-      <span class="e646">&#xe646;</span>
-      <span class="e647">&#xe647;</span>
-      <span class="e648">&#xe648;</span>
-      <span class="e649">&#xe649;</span>
-      <span class="e64a">&#xe64a;</span>
-      <span class="e64b">&#xe64b;</span>
-    </div>
-    <h2>500%</h2>
-    <div class="symbols" style="font-size: 500%; line-height: 1.5em">
-      <span class="e600">&#xe600;</span>
-      <span class="e601">&#xe601;</span>
-      <span class="e602">&#xe602;</span>
-      <span class="e603">&#xe603;</span>
-      <span class="e604">&#xe604;</span>
-      <span class="e605">&#xe605;</span>
-      <span class="e606">&#xe606;</span>
-      <span class="e607">&#xe607;</span>
-      <span class="e608">&#xe608;</span>
-      <span class="e609">&#xe609;</span>
-      <span class="e60a">&#xe60a;</span>
-      <span class="e60b">&#xe60b;</span>
-      <span class="e60c">&#xe60c;</span>
-      <span class="e60d">&#xe60d;</span>
-      <span class="e60e">&#xe60e;</span>
-      <span class="e60f">&#xe60f;</span>
-      <span class="e610">&#xe610;</span>
-      <span class="e611">&#xe611;</span>
-      <span class="e612">&#xe612;</span>
-      <span class="e613">&#xe613;</span>
-      <span class="e614">&#xe614;</span>
-      <span class="e615">&#xe615;</span>
-      <span class="e616">&#xe616;</span>
-      <span class="e617">&#xe617;</span>
-      <span class="e618">&#xe618;</span>
-      <span class="e619">&#xe619;</span>
-      <span class="e61a">&#xe61a;</span>
-      <span class="e61b">&#xe61b;</span>
-      <span class="e61c">&#xe61c;</span>
-      <span class="e61d">&#xe61d;</span>
-      <span class="e61e">&#xe61e;</span>
-      <span class="e61f">&#xe61f;</span>
-      <span class="e620">&#xe620;</span>
-      <span class="e621">&#xe621;</span>
-      <span class="e622">&#xe622;</span>
-      <span class="e623">&#xe623;</span>
-      <span class="e624">&#xe624;</span>
-      <span class="e625">&#xe625;</span>
-      <span class="e626">&#xe626;</span>
-      <span class="e627">&#xe627;</span>
-      <span class="e628">&#xe628;</span>
-      <span class="e629">&#xe629;</span>
-      <span class="e62a">&#xe62a;</span>
-      <span class="e62b">&#xe62b;</span>
-      <span class="e62c">&#xe62c;</span>
-      <span class="e62d">&#xe62d;</span>
-      <span class="e62e">&#xe62e;</span>
-      <span class="e62f">&#xe62f;</span>
-      <span class="e630">&#xe630;</span>
-      <span class="e631">&#xe631;</span>
-      <span class="e632">&#xe632;</span>
-      <span class="e633">&#xe633;</span>
-      <span class="e634">&#xe634;</span>
-      <span class="e635">&#xe635;</span>
-      <span class="e636">&#xe636;</span>
-      <span class="e637">&#xe637;</span>
-      <span class="e638">&#xe638;</span>
-      <span class="e639">&#xe639;</span>
-      <span class="e63a">&#xe63a;</span>
-      <span class="e63b">&#xe63b;</span>
-      <span class="e63c">&#xe63c;</span>
-      <span class="e63d">&#xe63d;</span>
-      <span class="e63e">&#xe63e;</span>
-      <span class="e63f">&#xe63f;</span>
-      <span class="e640">&#xe640;</span>
-      <span class="e641">&#xe641;</span>
-      <span class="e642">&#xe642;</span>
-      <span class="e643">&#xe643;</span>
-      <span class="e644">&#xe644;</span>
-      <span class="e645">&#xe645;</span>
-      <span class="e646">&#xe646;</span>
-      <span class="e647">&#xe647;</span>
-      <span class="e648">&#xe648;</span>
-      <span class="e649">&#xe649;</span>
-      <span class="e64a">&#xe64a;</span>
-      <span class="e64b">&#xe64b;</span>
-    </div>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/tablet.jsp b/src/main/webapp/WEB-INF/views/test/tablet.jsp
deleted file mode 100644
index 901cb4bb..00000000
--- a/src/main/webapp/WEB-INF/views/test/tablet.jsp
+++ /dev/null
@@ -1,22 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Layout für Tablets" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-    <link rel="stylesheet" type="text/css" href="${base}css/tablet.css" />
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      Diese Seite bindet alle Styles ein, die für Tablets eingebunden
-      werden (<code>/css/base.css</code> und <code>/css/tablet.css</code>).
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/testlab.jsp b/src/main/webapp/WEB-INF/views/test/testlab.jsp
deleted file mode 100644
index 252f2595..00000000
--- a/src/main/webapp/WEB-INF/views/test/testlab.jsp
+++ /dev/null
@@ -1,257 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="TESTLAB">
-  <t:putAttribute name="title" value="Formulare" type="string" cascade="true"/>
-  <t:putAttribute name="content">
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Anzeigetext</h2>
-      <div class="f textarea">
-        <label class="f info" for="textarea_01">Geben Sie hier Ihren Anzeigentext ein.</label>
-        <textarea class="f error" id="textarea_01" cols="50" rows="10">Eingegebener Text</textarea>
-        <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Es wurde kein Text für die Anzeige eingegeben!</span>
-      </div>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Textformatierung</h2>
-      <fieldset class="f radiobutton cf">
-        <legend class="f info">
-          Die zusätzlichen Gestaltungsoptionen sind nur für das Magazin wählbar.<br />
-          Online erscheint die Anzeige als normaler Fließtext.
-        </legend>
-        <hr class="f" />
-        <div class="col2">
-          <div class="f">
-            <input class="f" id="radio_tbox_01" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_01">normaler Fließtext</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_02" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_02">Text zentriert</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_03" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_03">Text fett, Negativdruck</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_04" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_04">Text fett</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_05" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_05">Text fett und rot</label>
-          </div>
-        </div>
-        <div class="col2">
-          <div class="f">
-            <input class="f" id="radio_tbox_06" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_06">Text fett, Anzeige blau hinterlegt</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_07" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_07">Text fett, Anzeige gelb hinterlegt</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_08" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_08">Anzeige schwarz eingerahmt</label>
-          </div>
-          <div class="f">
-            <input class="f" id="radio_tbox_09" type="radio" name="radio_tbox" />
-            <label class="f" for="radio_tbox_09">Anzeige rot eingerahmt</label>
-          </div>
-        </div>
-      </fieldset>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Einspaltige Radiobuttons...</h2>
-      <fieldset class="f radiobutton">
-        <div class="f">
-          <input class="f" id="radio_tbox_b01" type="radio" name="radio_tbox" />
-          <label class="f" for="radio_tbox_b01">Dies ist eine etwas länglichere Beschreibung der auswählbaren Option</label>
-        </div>
-        <div class="f">
-          <input class="f" id="radio_tbox_b02" type="radio" name="radio_tbox" />
-          <label class="f" for="radio_tbox_b02">Option X</label>
-        </div>
-        <div class="f">
-          <input class="f" id="radio_tbox_b03" type="radio" name="radio_tbox" />
-          <label class="f" for="radio_tbox_b03">Dies ist eine sehr, sehr lange Beschreibung der auswählbaren Option - so lang, dass sie am Ende hoffentlich umbricht...</label>
-        </div>
-      </fieldset>
-      <hr class="f" />
-      <div class="f submit">
-        <input class="f" type="submit" value="&gt; zur Übersicht" />
-        <input class="f left" type="submit" value="&lt; zurück" />
-        <input class="f" type="submit" value="&gt; weiter" />
-      </div>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Bild</h2>
-      <fieldset class="f checkbox">
-        <legend class="f">
-          Du kannst Deiner Anzeige ein Bild hinzufügen.
-          Das Bild erscheint nur online.
-          Im Magazin erscheint die Kleinanzeige mit Hinweis auf das Onlinebild.
-        </legend>
-        <hr class="f" />
-        <div class="f">
-          <input class="f" id="checkbox_tbox_01" type="checkbox" name="checkbox_tbox" />
-          <label class="f" for="checkbox_tbox_01">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
-        </div>
-        <div class="f">
-          <input class="f" id="checkbox_tbox_02" type="checkbox" name="checkbox_tbox" />
-          <label class="f" for="checkbox_tbox_02">Ich habe die AGB für das Hochladen von Bildern gelesen und akzeptiere diese</label>
-        </div>
-      </fieldset>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Alleinstehende Checkbox</h2>
-      <div class="f checkbox">
-        <input class="f" id="checkbox_tbox_03" type="checkbox" name="checkbox_tbox" />
-        <label class="f" for="checkbox_tbox_03">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
-      </div>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Kundendaten</h2>
-      <p class="f required">
-        <strong class="r">Pflichtfelder</strong> sind mit einem
-        <strong class="r symbol">*</strong> markiert.
-      </p>
-      <div class="f text required">
-        <label for="text_tbox_01" class="f"><span class="required">* </span>Nachname</label>
-        <input class="f" id="text_tbox_01" type="text" value="Mustermann" />
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_02" class="f">Vorname</label>
-        <input class="f" id="text_tbox_02" type="text" value="Max" />
-      </div>
-      <div class="f select required">
-        <label for="text_tbox_03" class="f"><span class="required">* </span>Ort</label>
-        <select class="f" id="text_tbox_03">
-          <option>Dortmund</option>
-          <option>Bochum</option>
-          <option>Essen</option>
-          <option>Mönchengladbach</option>
-          <option>Oberhausen</option>
-          <option>Castrop-Rauxel</option>
-          <option>Düsseldorf</option>
-        </select>
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_04" class="f"><span class="required">* </span>Straße/Hausnr.</label>
-        <input class="f error" id="text_tbox_04" type="text" value="" />
-        <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Dies ist ein Pflichtfeld!</span>
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_05" class="f"><span class="required">* </span>Postleitzahl</label>
-        <input class="f" id="text_tbox_05" type="text" value="" />
-      </div>
-      <div class="f text required">
-        <label for="text_tbox_06" class="f">Telefon</label>
-        <input class="f" id="text_tbox_06" type="text" value="" />
-      </div>
-      <hr class="f" />
-      <div class="f submit">
-        <input class="f" type="submit" value="&gt; weiter" />
-      </div>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Anzeige regionalisieren</h2>
-      <p class="f">
-        Indem Du Deine Kleinanzeige einer Stadt zuordnest, können Interessenten
-        diese online leichter finden, wenn sie nur nach Kleinanzeigen aus
-        bestimmten Städten suchen.
-        Du kannst auch keine Stadt zuordnen, dann wird die Kleinanzeige von
-        diesen Interessenten aber auch nicht gefunden.
-      </p>
-      <hr class="f" />
-      <div class="f text">
-        <label class="f" for="city">Stadt</label>
-        <input id="city" type="text" class="f" />
-        <p class="f info">
-          Das Feld leer lassen, wenn die Anzeige nicht regionalisiert werden soll.
-        </p>
-      </div>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Ein Passwort-Eingabe-Feld</h2>
-      <div class="f text required">
-        <label for="text_tbox_05" class="f"><span class="required">* </span>Passwort</label>
-        <input class="f" id="text_tbox_05" type="password" value="t" />
-      </div>
-    </form>
-    <form class="testlab form" action="#" method="get">
-      <h2 class="f">Lade das Bild hoch</h2>
-      <p class="f info">
-        Du kannst ein Bild im JPEG- oder PNG-Format hochladen.
-        Das Bild darf nicht größer als 8 MByte sein.
-      </p>
-      <div class="f file required">
-        <label for="file_tbox_01" class="f"><span class="required">* </span>Bild</label>
-        <input class="f" id="file_tbox_01" type="file" />
-      </div>
-      <hr class="f" />
-      <div class="f submit">
-        <input class="f" type="submit" value="&gt; Doch kein Bild" />
-        <input class="f" type="submit" value="&gt; Bild hochladen" />
-      </div>
-    </form>
-    <div class="testlab form">
-      <h2 class="f">Antworten</h2>
-      <p class="f required">
-        <strong class="r">Pflichtfelder</strong> sind mit einem
-        <strong class="r symbol">*</strong> markiert.
-      </p>
-      <div class="f text required">
-        <label class="f" for="replyTo"><span class="required">*</span> Antwort-Adresse</label>
-        <input id="replyTo" name="replyTo" class="f" tabindex="1" type="text" value=""/>
-      </div>
-      <div class="f text required">
-        <label class="f" for="replyTo"><span class="required">*</span> Adresse wiederholen</label>
-        <input id="replyToRepeated" name="replyToRepeated" class="f" tabindex="2" type="text" value=""/>
-      </div>
-      <div class="f text required">
-        <label class="f" for="subject"><span class="required">*</span> Betreff</label>
-        <input id="subject" name="subject" class="f" tabindex="3" type="text" value=""/>
-      </div>
-      <div class="f textarea required">
-        <label class="f" for="text"><span class="required">*</span> Nachricht</label>
-        <textarea id="text" name="text" class="f" tabindex="4" rows="15" cols="20"></textarea>
-      </div>
-      <div class="f checkbox">
-        <input id="attachment1" name="attachment" class="f" tabindex="4" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_attachment" value="on"/>
-        <label class="f" for="attachment">Ich möchte eine Datei an die E-Mail anhängen.</label>
-      </div>
-      <div class="f checkbox">
-        <input id="copy1" name="copy" class="f" tabindex="5" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_copy" value="on"/>
-        <label class="f" for="copy">Ich möchte eine Kopie der Nachricht zugesendet bekommen.</label>
-      </div>
-    </div>
-    <div class="testlab form cf">
-      <div class="col2 left">
-        <h2 class="f">Weiter mit Anmeldung</h2>
-        <div class="f text">
-          <label class="f" for="username">Benutzername</label>
-          <input class="f" name="username" id="username" type="text" tabindex="6" />
-        </div>
-        <div class="f text">
-          <label class="f" for="password">Passwort</label>
-          <input class="f" name="password" id="password" type="password" tabindex="7" />
-        </div>
-      </div>
-      <div class="col2 right">
-        <h2 class="f">Weiter ohne Anmeldung</h2>
-        <!-- <a href="/kleinanzeigen/37431/lust+.html" title="Zu schwer? Hier klicken um das Bild zu wechseln!"><img src="/img/captcha.jpg" alt="Captcha" width="120" height="60" /></a> -->
-        <div class="f captcha cf">
-          <span class="f">Was steht da?</span>
-          <img class="f" src="/img/captcha.jpg" alt="Captcha" width="120" height="60" />
-        </div>
-        <div class="f text">
-          <label class="f" for="captcha">Lösung</label>
-          <input class="f" name="captcha" id="captcha" type="text" tabindex="8" />
-        </div>
-      </div>
-    </div>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/test/tiny.jsp b/src/main/webapp/WEB-INF/views/test/tiny.jsp
deleted file mode 100644
index 0d21cddd..00000000
--- a/src/main/webapp/WEB-INF/views/test/tiny.jsp
+++ /dev/null
@@ -1,23 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="test">
-  <t:putAttribute name="title" value="Layout für sehr kleine Bildschirmgrößen" type="string" cascade="true"/>
-  <t:putAttribute name="htmlhead" type="string">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="${base}css/base.css" />
-    <link rel="stylesheet" type="text/css" href="${base}css/tiny.css" />
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>
-      In diese Seite bindet alle Styles ein, die für sehr kleine
-      Bildschirmgrößen eingebunden werden (<code>/css/base.css</code> und
-      <code>/css/tiny.css</code>).
-    </p>
-    <section>
-      <h1>Weitere Experimente</h1>
-      <t:insertTemplate template="/WEB-INF/templates/test/experimente.jsp"/>
-    </section>
-  </t:putAttribute>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/views/tiles.jsp b/src/main/webapp/WEB-INF/views/tiles.jsp
deleted file mode 100644
index cee460f7..00000000
--- a/src/main/webapp/WEB-INF/views/tiles.jsp
+++ /dev/null
@@ -1,5 +0,0 @@
-<%@page contentType="text/html" pageEncoding="UTF-8" session="false"%>
-<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
-<c:forEach begin="1" end="10">
-Hello World!<br/>
-</c:forEach>
\ No newline at end of file
diff --git a/src/main/webapp/WEB-INF/views/urheberrechte.jsp b/src/main/webapp/WEB-INF/views/urheberrechte.jsp
deleted file mode 100644
index ac50b654..00000000
--- a/src/main/webapp/WEB-INF/views/urheberrechte.jsp
+++ /dev/null
@@ -1,35 +0,0 @@
-<%@page contentType="text/html;charset=UTF-8"%>
-<%@page pageEncoding="UTF-8"%>
-<%@page session="false" %>
-<%@taglib uri="http://tiles.apache.org/tags-tiles" prefix="t" %>
-<t:insertDefinition name="BASEPAGE">
-  <t:putAttribute name="title" value="Urheberrechte" type="string" cascade="true"/>
-  <t:putAttribute name="breadcrumb">
-    <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-    <li class="b"><a href="${base}impressum.html" class="b">Impressum</a></li>
-    <li class="b"><strong class="b">Urheberrechte</strong></li>
-  </t:putAttribute>
-  <t:putAttribute name="navigation" type="string">
-    <h1 class="nav">Navigation</h1>
-    <h2 class="nav menu">Section-Menu</h2>
-    <ul id="menu" class="s active cf">
-      <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-      <li class="m projects"><a href="${base}projects.html" class="m">Projects</a></li>
-      <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-    </ul>
-    <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="${base}impressum.html" class="s selected">Impressum</a></h2>
-    <ul id="submenu">
-      <li class="s"><a href="${base}agb.html" class="s">AGB</a></li>
-      <li class="s"><a href="${base}haftung-inhalte.html" class="s">Haftung für Inhalte</a></li>
-      <li class="s"><a href="${base}haftung-links.html" class="s">Haftung für Links</a></li>
-      <li class="s"><strong class="s">Urheberrechte</strong></li>
-      <li class="s"><a href="${base}datenschutz.html" class="s">Datenschutz</a></li>
-      <li class="s"><a href="${base}google-analytics.html" class="s">Google Analytics</a></li>
-    </ul>
-  </t:putAttribute>
-  <t:putAttribute name="maincontent" type="string" cascade="true">
-    <p>Die auf unseren Internetseiten enthaltenen Werke und Inhalte unterstehen dem Urheberrecht. Ohne schriftliche Genehmigung des jeweiligen Erstellers oder Autors dürfen die Werke bzw. Inhalte nicht vervielfältigt, bearbeitet, verbreitet und verwertet werden. Das Herunterladen und Kopieren unserer Internetseite ist für den privaten Gebrauch erlaubt, nicht jedoch für den kommerziellen. Wir weisen darauf hin, dass hinsichtlich der Inhalte auf unserer Internetseite, soweit sie nicht von uns erstellt worden sind, das Urheberrecht von Dritten beachtet wurde. Inhalte von Dritten erhalten als solche eine Kennzeichnung von uns. Wir wären Ihnen dankbar, wenn Sie uns einen Hinweis erteilen würden, falls Sie trotzdem auf eine Urheberrechtsverletzung gestoßen sind. Wenn wir von einer solchen Urheberrechtsverletzung Kenntnis erlangen, werden wir den entsprechenden Inhalt unverzüglich entfernen.</p>
-    <p><em>Quelle: <a href="http://www.flegl-rechtsanwaelte.de/rechtstipps/muster-impressum-gewerbliche-homepage">www.flegl-rechtsanwaelte.de</a></em></p>
-  </t:putAttribute>
-  <t:putAttribute name="marginalcontent" type="template" value="/WEB-INF/templates/about.jsp"/>
-</t:insertDefinition>
diff --git a/src/main/webapp/WEB-INF/web.xml b/src/main/webapp/WEB-INF/web.xml
index 289983bb..a204d6b3 100644
--- a/src/main/webapp/WEB-INF/web.xml
+++ b/src/main/webapp/WEB-INF/web.xml
@@ -41,19 +41,6 @@
   </filter-mapping>
 
 
-  <!-- Fix a logic-bug in the colaboration of Thymeleaf and Tiles -->
-
-  <filter>
-    <filter-name>forceIncludeFilter</filter-name>
-    <filter-class>de.juplo.branding.web.ForceIncludeFilter</filter-class>
-  </filter>
-
-  <filter-mapping>
-    <filter-name>forceIncludeFilter</filter-name>
-    <url-pattern>*.html</url-pattern>
-  </filter-mapping>
-
-
   <!-- Handles all requests into the application -->
 
   <servlet>
diff --git a/src/main/webapp/js/less-1.5.1.js b/src/main/webapp/js/less-1.5.1.js
deleted file mode 100644
index dfff28a4..00000000
--- a/src/main/webapp/js/less-1.5.1.js
+++ /dev/null
@@ -1,6941 +0,0 @@
-/*! 
- * LESS - Leaner CSS v1.5.1 
- * http://lesscss.org 
- * 
- * Copyright (c) 2009-2013, Alexis Sellier <self@cloudhead.net> 
- * Licensed under the Apache v2 License. 
- * 
- * @licence 
- */ 
-
-
-
-(function (window, undefined) {//
-// Stub out `require` in the browser
-//
-function require(arg) {
-    return window.less[arg.split('/')[1]];
-};
-
-
-if (typeof(window.less) === 'undefined' || typeof(window.less.nodeType) !== 'undefined') { window.less = {}; }
-less = window.less;
-tree = window.less.tree = {};
-less.mode = 'browser';
-
-var less, tree;
-
-// Node.js does not have a header file added which defines less
-if (less === undefined) {
-    less = exports;
-    tree = require('./tree');
-    less.mode = 'node';
-}
-//
-// less.js - parser
-//
-//    A relatively straight-forward predictive parser.
-//    There is no tokenization/lexing stage, the input is parsed
-//    in one sweep.
-//
-//    To make the parser fast enough to run in the browser, several
-//    optimization had to be made:
-//
-//    - Matching and slicing on a huge input is often cause of slowdowns.
-//      The solution is to chunkify the input into smaller strings.
-//      The chunks are stored in the `chunks` var,
-//      `j` holds the current chunk index, and `current` holds
-//      the index of the current chunk in relation to `input`.
-//      This gives us an almost 4x speed-up.
-//
-//    - In many cases, we don't need to match individual tokens;
-//      for example, if a value doesn't hold any variables, operations
-//      or dynamic references, the parser can effectively 'skip' it,
-//      treating it as a literal.
-//      An example would be '1px solid #000' - which evaluates to itself,
-//      we don't need to know what the individual components are.
-//      The drawback, of course is that you don't get the benefits of
-//      syntax-checking on the CSS. This gives us a 50% speed-up in the parser,
-//      and a smaller speed-up in the code-gen.
-//
-//
-//    Token matching is done with the `$` function, which either takes
-//    a terminal string or regexp, or a non-terminal function to call.
-//    It also takes care of moving all the indices forwards.
-//
-//
-less.Parser = function Parser(env) {
-    var input,       // LeSS input string
-        i,           // current index in `input`
-        j,           // current chunk
-        temp,        // temporarily holds a chunk's state, for backtracking
-        memo,        // temporarily holds `i`, when backtracking
-        furthest,    // furthest index the parser has gone to
-        chunks,      // chunkified input
-        current,     // index of current chunk, in `input`
-        parser,
-        rootFilename = env && env.filename;
-
-    // Top parser on an import tree must be sure there is one "env"
-    // which will then be passed around by reference.
-    if (!(env instanceof tree.parseEnv)) {
-        env = new tree.parseEnv(env);
-    }
-
-    var imports = this.imports = {
-        paths: env.paths || [],  // Search paths, when importing
-        queue: [],               // Files which haven't been imported yet
-        files: env.files,        // Holds the imported parse trees
-        contents: env.contents,  // Holds the imported file contents
-        mime:  env.mime,         // MIME type of .less files
-        error: null,             // Error in parsing/evaluating an import
-        push: function (path, currentFileInfo, importOptions, callback) {
-            var parserImports = this;
-            this.queue.push(path);
-
-            var fileParsedFunc = function (e, root, fullPath) {
-                parserImports.queue.splice(parserImports.queue.indexOf(path), 1); // Remove the path from the queue
-
-                var importedPreviously = fullPath in parserImports.files || fullPath === rootFilename;
-
-                parserImports.files[fullPath] = root;                        // Store the root
-
-                if (e && !parserImports.error) { parserImports.error = e; }
-
-                callback(e, root, importedPreviously, fullPath);
-            };
-
-            if (less.Parser.importer) {
-                less.Parser.importer(path, currentFileInfo, fileParsedFunc, env);
-            } else {
-                less.Parser.fileLoader(path, currentFileInfo, function(e, contents, fullPath, newFileInfo) {
-                    if (e) {fileParsedFunc(e); return;}
-
-                    var newEnv = new tree.parseEnv(env);
-
-                    newEnv.currentFileInfo = newFileInfo;
-                    newEnv.processImports = false;
-                    newEnv.contents[fullPath] = contents;
-
-                    if (currentFileInfo.reference || importOptions.reference) {
-                        newFileInfo.reference = true;
-                    }
-
-                    if (importOptions.inline) {
-                        fileParsedFunc(null, contents, fullPath);
-                    } else {
-                        new(less.Parser)(newEnv).parse(contents, function (e, root) {
-                            fileParsedFunc(e, root, fullPath);
-                        });
-                    }
-                }, env);
-            }
-        }
-    };
-
-    function save()    { temp = chunks[j], memo = i, current = i; }
-    function restore() { chunks[j] = temp, i = memo, current = i; }
-
-    function sync() {
-        if (i > current) {
-            chunks[j] = chunks[j].slice(i - current);
-            current = i;
-        }
-    }
-    function isWhitespace(c) {
-        // Could change to \s?
-        var code = c.charCodeAt(0);
-        return code === 32 || code === 10 || code === 9;
-    }
-    //
-    // Parse from a token, regexp or string, and move forward if match
-    //
-    function $(tok) {
-        var match, length;
-
-        //
-        // Non-terminal
-        //
-        if (tok instanceof Function) {
-            return tok.call(parser.parsers);
-        //
-        // Terminal
-        //
-        //     Either match a single character in the input,
-        //     or match a regexp in the current chunk (chunk[j]).
-        //
-        } else if (typeof(tok) === 'string') {
-            match = input.charAt(i) === tok ? tok : null;
-            length = 1;
-            sync ();
-        } else {
-            sync ();
-
-            if (match = tok.exec(chunks[j])) {
-                length = match[0].length;
-            } else {
-                return null;
-            }
-        }
-
-        // The match is confirmed, add the match length to `i`,
-        // and consume any extra white-space characters (' ' || '\n')
-        // which come after that. The reason for this is that LeSS's
-        // grammar is mostly white-space insensitive.
-        //
-        if (match) {
-            skipWhitespace(length);
-
-            if(typeof(match) === 'string') {
-                return match;
-            } else {
-                return match.length === 1 ? match[0] : match;
-            }
-        }
-    }
-
-    function skipWhitespace(length) {
-        var oldi = i, oldj = j,
-            endIndex = i + chunks[j].length,
-            mem = i += length;
-
-        while (i < endIndex) {
-            if (! isWhitespace(input.charAt(i))) { break; }
-            i++;
-        }
-        chunks[j] = chunks[j].slice(length + (i - mem));
-        current = i;
-
-        if (chunks[j].length === 0 && j < chunks.length - 1) { j++; }
-
-        return oldi !== i || oldj !== j;
-    }
-
-    function expect(arg, msg) {
-        var result = $(arg);
-        if (! result) {
-            error(msg || (typeof(arg) === 'string' ? "expected '" + arg + "' got '" + input.charAt(i) + "'"
-                                                   : "unexpected token"));
-        } else {
-            return result;
-        }
-    }
-
-    function error(msg, type) {
-        var e = new Error(msg);
-        e.index = i;
-        e.type = type || 'Syntax';
-        throw e;
-    }
-
-    // Same as $(), but don't change the state of the parser,
-    // just return the match.
-    function peek(tok) {
-        if (typeof(tok) === 'string') {
-            return input.charAt(i) === tok;
-        } else {
-            return tok.test(chunks[j]);
-        }
-    }
-
-    function getInput(e, env) {
-        if (e.filename && env.currentFileInfo.filename && (e.filename !== env.currentFileInfo.filename)) {
-            return parser.imports.contents[e.filename];
-        } else {
-            return input;
-        }
-    }
-
-    function getLocation(index, inputStream) {
-        var n = index + 1,
-            line = null,
-            column = -1;
-
-        while (--n >= 0 && inputStream.charAt(n) !== '\n') {
-            column++;
-        }
-
-        if (typeof index === 'number') {
-            line = (inputStream.slice(0, index).match(/\n/g) || "").length;
-        }
-
-        return {
-            line: line,
-            column: column
-        };
-    }
-
-    function getDebugInfo(index, inputStream, env) {
-        var filename = env.currentFileInfo.filename;
-        if(less.mode !== 'browser' && less.mode !== 'rhino') {
-            filename = require('path').resolve(filename);
-        }
-
-        return {
-            lineNumber: getLocation(index, inputStream).line + 1,
-            fileName: filename
-        };
-    }
-
-    function LessError(e, env) {
-        var input = getInput(e, env),
-            loc = getLocation(e.index, input),
-            line = loc.line,
-            col  = loc.column,
-            callLine = e.call && getLocation(e.call, input).line,
-            lines = input.split('\n');
-
-        this.type = e.type || 'Syntax';
-        this.message = e.message;
-        this.filename = e.filename || env.currentFileInfo.filename;
-        this.index = e.index;
-        this.line = typeof(line) === 'number' ? line + 1 : null;
-        this.callLine = callLine + 1;
-        this.callExtract = lines[callLine];
-        this.stack = e.stack;
-        this.column = col;
-        this.extract = [
-            lines[line - 1],
-            lines[line],
-            lines[line + 1]
-        ];
-    }
-
-    LessError.prototype = new Error();
-    LessError.prototype.constructor = LessError;
-
-    this.env = env = env || {};
-
-    // The optimization level dictates the thoroughness of the parser,
-    // the lower the number, the less nodes it will create in the tree.
-    // This could matter for debugging, or if you want to access
-    // the individual nodes in the tree.
-    this.optimization = ('optimization' in this.env) ? this.env.optimization : 1;
-
-    //
-    // The Parser
-    //
-    return parser = {
-
-        imports: imports,
-        //
-        // Parse an input string into an abstract syntax tree,
-        // call `callback` when done.
-        //
-        parse: function (str, callback) {
-            var root, line, lines, error = null;
-
-            i = j = current = furthest = 0;
-            input = str.replace(/\r\n/g, '\n');
-
-            // Remove potential UTF Byte Order Mark
-            input = input.replace(/^\uFEFF/, '');
-
-            parser.imports.contents[env.currentFileInfo.filename] = input;
-
-            // Split the input into chunks.
-            chunks = (function (chunks) {
-                var j = 0,
-                    skip = /(?:@\{[\w-]+\}|[^"'`\{\}\/\(\)\\])+/g,
-                    comment = /\/\*(?:[^*]|\*+[^\/*])*\*+\/|\/\/.*/g,
-                    string = /"((?:[^"\\\r\n]|\\.)*)"|'((?:[^'\\\r\n]|\\.)*)'|`((?:[^`]|\\.)*)`/g,
-                    level = 0,
-                    match,
-                    chunk = chunks[0],
-                    inParam;
-
-                for (var i = 0, c, cc; i < input.length;) {
-                    skip.lastIndex = i;
-                    if (match = skip.exec(input)) {
-                        if (match.index === i) {
-                            i += match[0].length;
-                            chunk.push(match[0]);
-                        }
-                    }
-                    c = input.charAt(i);
-                    comment.lastIndex = string.lastIndex = i;
-
-                    if (match = string.exec(input)) {
-                        if (match.index === i) {
-                            i += match[0].length;
-                            chunk.push(match[0]);
-                            continue;
-                        }
-                    }
-
-                    if (!inParam && c === '/') {
-                        cc = input.charAt(i + 1);
-                        if (cc === '/' || cc === '*') {
-                            if (match = comment.exec(input)) {
-                                if (match.index === i) {
-                                    i += match[0].length;
-                                    chunk.push(match[0]);
-                                    continue;
-                                }
-                            }
-                        }
-                    }
-                    
-                    switch (c) {
-                        case '{':
-                            if (!inParam) {
-                                level++;
-                                chunk.push(c);
-                                break;
-                            }
-                            /* falls through */
-                        case '}':
-                            if (!inParam) {
-                                level--;
-                                chunk.push(c);
-                                chunks[++j] = chunk = [];
-                                break;
-                            }
-                            /* falls through */
-                        case '(':
-                            if (!inParam) {
-                                inParam = true;
-                                chunk.push(c);
-                                break;
-                            }
-                            /* falls through */
-                        case ')':
-                            if (inParam) {
-                                inParam = false;
-                                chunk.push(c);
-                                break;
-                            }
-                            /* falls through */
-                        default:
-                            chunk.push(c);
-                    }
-                    
-                    i++;
-                }
-                if (level !== 0) {
-                    error = new(LessError)({
-                        index: i-1,
-                        type: 'Parse',
-                        message: (level > 0) ? "missing closing `}`" : "missing opening `{`",
-                        filename: env.currentFileInfo.filename
-                    }, env);
-                }
-
-                return chunks.map(function (c) { return c.join(''); });
-            })([[]]);
-
-            if (error) {
-                return callback(new(LessError)(error, env));
-            }
-
-            // Start with the primary rule.
-            // The whole syntax tree is held under a Ruleset node,
-            // with the `root` property set to true, so no `{}` are
-            // output. The callback is called when the input is parsed.
-            try {
-                root = new(tree.Ruleset)([], $(this.parsers.primary));
-                root.root = true;
-                root.firstRoot = true;
-            } catch (e) {
-                return callback(new(LessError)(e, env));
-            }
-
-            root.toCSS = (function (evaluate) {
-                return function (options, variables) {
-                    options = options || {};
-                    var evaldRoot,
-                        css,
-                        evalEnv = new tree.evalEnv(options);
-                        
-                    //
-                    // Allows setting variables with a hash, so:
-                    //
-                    //   `{ color: new(tree.Color)('#f01') }` will become:
-                    //
-                    //   new(tree.Rule)('@color',
-                    //     new(tree.Value)([
-                    //       new(tree.Expression)([
-                    //         new(tree.Color)('#f01')
-                    //       ])
-                    //     ])
-                    //   )
-                    //
-                    if (typeof(variables) === 'object' && !Array.isArray(variables)) {
-                        variables = Object.keys(variables).map(function (k) {
-                            var value = variables[k];
-
-                            if (! (value instanceof tree.Value)) {
-                                if (! (value instanceof tree.Expression)) {
-                                    value = new(tree.Expression)([value]);
-                                }
-                                value = new(tree.Value)([value]);
-                            }
-                            return new(tree.Rule)('@' + k, value, false, null, 0);
-                        });
-                        evalEnv.frames = [new(tree.Ruleset)(null, variables)];
-                    }
-
-                    try {
-                        evaldRoot = evaluate.call(this, evalEnv);
-
-                        new(tree.joinSelectorVisitor)()
-                            .run(evaldRoot);
-
-                        new(tree.processExtendsVisitor)()
-                            .run(evaldRoot);
-
-                        new(tree.toCSSVisitor)({compress: Boolean(options.compress)})
-                            .run(evaldRoot);
-
-                        if (options.sourceMap) {
-                            evaldRoot = new tree.sourceMapOutput(
-                                {
-                                    writeSourceMap: options.writeSourceMap,
-                                    rootNode: evaldRoot,
-                                    contentsMap: parser.imports.contents,
-                                    sourceMapFilename: options.sourceMapFilename,
-                                    sourceMapURL: options.sourceMapURL,
-                                    outputFilename: options.sourceMapOutputFilename,
-                                    sourceMapBasepath: options.sourceMapBasepath,
-                                    sourceMapRootpath: options.sourceMapRootpath,
-                                    outputSourceFiles: options.outputSourceFiles,
-                                    sourceMapGenerator: options.sourceMapGenerator
-                                });
-                        }
-
-                        css = evaldRoot.toCSS({
-                                compress: Boolean(options.compress),
-                                dumpLineNumbers: env.dumpLineNumbers,
-                                strictUnits: Boolean(options.strictUnits)});
-                    } catch (e) {
-                        throw new(LessError)(e, env);
-                    }
-
-                    if (options.cleancss && less.mode === 'node') {
-                        var CleanCSS = require('clean-css');
-                        //TODO would be nice for no advanced to be an option
-                        return new CleanCSS({keepSpecialComments: '*', processImport: false, noRebase: true, noAdvanced: true}).minify(css);
-                    } else if (options.compress) {
-                        return css.replace(/(^(\s)+)|((\s)+$)/g, "");
-                    } else {
-                        return css;
-                    }
-                };
-            })(root.eval);
-
-            // If `i` is smaller than the `input.length - 1`,
-            // it means the parser wasn't able to parse the whole
-            // string, so we've got a parsing error.
-            //
-            // We try to extract a \n delimited string,
-            // showing the line where the parse error occured.
-            // We split it up into two parts (the part which parsed,
-            // and the part which didn't), so we can color them differently.
-            if (i < input.length - 1) {
-                i = furthest;
-                var loc = getLocation(i, input);
-                lines = input.split('\n');
-                line = loc.line + 1;
-
-                error = {
-                    type: "Parse",
-                    message: "Unrecognised input",
-                    index: i,
-                    filename: env.currentFileInfo.filename,
-                    line: line,
-                    column: loc.column,
-                    extract: [
-                        lines[line - 2],
-                        lines[line - 1],
-                        lines[line]
-                    ]
-                };
-            }
-
-            var finish = function (e) {
-                e = error || e || parser.imports.error;
-
-                if (e) {
-                    if (!(e instanceof LessError)) {
-                        e = new(LessError)(e, env);
-                    }
-
-                    return callback(e);
-                }
-                else {
-                    return callback(null, root);
-                }
-            };
-
-            if (env.processImports !== false) {
-                new tree.importVisitor(this.imports, finish)
-                    .run(root);
-            } else {
-                return finish();
-            }
-        },
-
-        //
-        // Here in, the parsing rules/functions
-        //
-        // The basic structure of the syntax tree generated is as follows:
-        //
-        //   Ruleset ->  Rule -> Value -> Expression -> Entity
-        //
-        // Here's some LESS code:
-        //
-        //    .class {
-        //      color: #fff;
-        //      border: 1px solid #000;
-        //      width: @w + 4px;
-        //      > .child {...}
-        //    }
-        //
-        // And here's what the parse tree might look like:
-        //
-        //     Ruleset (Selector '.class', [
-        //         Rule ("color",  Value ([Expression [Color #fff]]))
-        //         Rule ("border", Value ([Expression [Dimension 1px][Keyword "solid"][Color #000]]))
-        //         Rule ("width",  Value ([Expression [Operation "+" [Variable "@w"][Dimension 4px]]]))
-        //         Ruleset (Selector [Element '>', '.child'], [...])
-        //     ])
-        //
-        //  In general, most rules will try to parse a token with the `$()` function, and if the return
-        //  value is truly, will return a new node, of the relevant type. Sometimes, we need to check
-        //  first, before parsing, that's when we use `peek()`.
-        //
-        parsers: {
-            //
-            // The `primary` rule is the *entry* and *exit* point of the parser.
-            // The rules here can appear at any level of the parse tree.
-            //
-            // The recursive nature of the grammar is an interplay between the `block`
-            // rule, which represents `{ ... }`, the `ruleset` rule, and this `primary` rule,
-            // as represented by this simplified grammar:
-            //
-            //     primary  →  (ruleset | rule)+
-            //     ruleset  →  selector+ block
-            //     block    →  '{' primary '}'
-            //
-            // Only at one point is the primary rule not called from the
-            // block rule: at the root level.
-            //
-            primary: function () {
-                var node, root = [];
-
-                while ((node = $(this.extendRule) || $(this.mixin.definition) || $(this.rule)    ||  $(this.ruleset) ||
-                               $(this.mixin.call)       || $(this.comment) ||  $(this.directive))
-                               || $(/^[\s\n]+/) || $(/^;+/)) {
-                    node && root.push(node);
-                }
-                return root;
-            },
-
-            // We create a Comment node for CSS comments `/* */`,
-            // but keep the LeSS comments `//` silent, by just skipping
-            // over them.
-            comment: function () {
-                var comment;
-
-                if (input.charAt(i) !== '/') { return; }
-
-                if (input.charAt(i + 1) === '/') {
-                    return new(tree.Comment)($(/^\/\/.*/), true, i, env.currentFileInfo);
-                } else if (comment = $(/^\/\*(?:[^*]|\*+[^\/*])*\*+\/\n?/)) {
-                    return new(tree.Comment)(comment, false, i, env.currentFileInfo);
-                }
-            },
-
-            comments: function () {
-                var comment, comments = [];
-
-                while(comment = $(this.comment)) {
-                    comments.push(comment);
-                }
-
-                return comments;
-            },
-
-            //
-            // Entities are tokens which can be found inside an Expression
-            //
-            entities: {
-                //
-                // A string, which supports escaping " and '
-                //
-                //     "milky way" 'he\'s the one!'
-                //
-                quoted: function () {
-                    var str, j = i, e, index = i;
-
-                    if (input.charAt(j) === '~') { j++, e = true; } // Escaped strings
-                    if (input.charAt(j) !== '"' && input.charAt(j) !== "'") { return; }
-
-                    e && $('~');
-
-                    if (str = $(/^"((?:[^"\\\r\n]|\\.)*)"|'((?:[^'\\\r\n]|\\.)*)'/)) {
-                        return new(tree.Quoted)(str[0], str[1] || str[2], e, index, env.currentFileInfo);
-                    }
-                },
-
-                //
-                // A catch-all word, such as:
-                //
-                //     black border-collapse
-                //
-                keyword: function () {
-                    var k;
-
-                    if (k = $(/^[_A-Za-z-][_A-Za-z0-9-]*/)) {
-                        var color = tree.Color.fromKeyword(k);
-                        if (color) {
-                            return color;
-                        }
-                        return new(tree.Keyword)(k);
-                    }
-                },
-
-                //
-                // A function call
-                //
-                //     rgb(255, 0, 255)
-                //
-                // We also try to catch IE's `alpha()`, but let the `alpha` parser
-                // deal with the details.
-                //
-                // The arguments are parsed with the `entities.arguments` parser.
-                //
-                call: function () {
-                    var name, nameLC, args, alpha_ret, index = i;
-
-                    if (! (name = /^([\w-]+|%|progid:[\w\.]+)\(/.exec(chunks[j]))) { return; }
-
-                    name = name[1];
-                    nameLC = name.toLowerCase();
-
-                    if (nameLC === 'url') { return null; }
-                    else                  { i += name.length; }
-
-                    if (nameLC === 'alpha') {
-                        alpha_ret = $(this.alpha);
-                        if(typeof alpha_ret !== 'undefined') {
-                            return alpha_ret;
-                        }
-                    }
-
-                    $('('); // Parse the '(' and consume whitespace.
-
-                    args = $(this.entities.arguments);
-
-                    if (! $(')')) {
-                        return;
-                    }
-
-                    if (name) { return new(tree.Call)(name, args, index, env.currentFileInfo); }
-                },
-                arguments: function () {
-                    var args = [], arg;
-
-                    while (arg = $(this.entities.assignment) || $(this.expression)) {
-                        args.push(arg);
-                        if (! $(',')) {
-                            break;
-                        }
-                    }
-                    return args;
-                },
-                literal: function () {
-                    return $(this.entities.dimension) ||
-                           $(this.entities.color) ||
-                           $(this.entities.quoted) ||
-                           $(this.entities.unicodeDescriptor);
-                },
-
-                // Assignments are argument entities for calls.
-                // They are present in ie filter properties as shown below.
-                //
-                //     filter: progid:DXImageTransform.Microsoft.Alpha( *opacity=50* )
-                //
-
-                assignment: function () {
-                    var key, value;
-                    if ((key = $(/^\w+(?=\s?=)/i)) && $('=') && (value = $(this.entity))) {
-                        return new(tree.Assignment)(key, value);
-                    }
-                },
-
-                //
-                // Parse url() tokens
-                //
-                // We use a specific rule for urls, because they don't really behave like
-                // standard function calls. The difference is that the argument doesn't have
-                // to be enclosed within a string, so it can't be parsed as an Expression.
-                //
-                url: function () {
-                    var value;
-
-                    if (input.charAt(i) !== 'u' || !$(/^url\(/)) {
-                        return;
-                    }
-
-                    value = $(this.entities.quoted)  || $(this.entities.variable) ||
-                            $(/^(?:(?:\\[\(\)'"])|[^\(\)'"])+/) || "";
-
-                    expect(')');
-
-                    /*jshint eqnull:true */
-                    return new(tree.URL)((value.value != null || value instanceof tree.Variable)
-                                        ? value : new(tree.Anonymous)(value), env.currentFileInfo);
-                },
-
-                //
-                // A Variable entity, such as `@fink`, in
-                //
-                //     width: @fink + 2px
-                //
-                // We use a different parser for variable definitions,
-                // see `parsers.variable`.
-                //
-                variable: function () {
-                    var name, index = i;
-
-                    if (input.charAt(i) === '@' && (name = $(/^@@?[\w-]+/))) {
-                        return new(tree.Variable)(name, index, env.currentFileInfo);
-                    }
-                },
-
-                // A variable entity useing the protective {} e.g. @{var}
-                variableCurly: function () {
-                    var curly, index = i;
-
-                    if (input.charAt(i) === '@' && (curly = $(/^@\{([\w-]+)\}/))) {
-                        return new(tree.Variable)("@" + curly[1], index, env.currentFileInfo);
-                    }
-                },
-
-                //
-                // A Hexadecimal color
-                //
-                //     #4F3C2F
-                //
-                // `rgb` and `hsl` colors are parsed through the `entities.call` parser.
-                //
-                color: function () {
-                    var rgb;
-
-                    if (input.charAt(i) === '#' && (rgb = $(/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})/))) {
-                        return new(tree.Color)(rgb[1]);
-                    }
-                },
-
-                //
-                // A Dimension, that is, a number and a unit
-                //
-                //     0.5em 95%
-                //
-                dimension: function () {
-                    var value, c = input.charCodeAt(i);
-                    //Is the first char of the dimension 0-9, '.', '+' or '-'
-                    if ((c > 57 || c < 43) || c === 47 || c == 44) {
-                        return;
-                    }
-
-                    if (value = $(/^([+-]?\d*\.?\d+)(%|[a-z]+)?/)) {
-                        return new(tree.Dimension)(value[1], value[2]);
-                    }
-                },
-
-                //
-                // A unicode descriptor, as is used in unicode-range
-                //
-                // U+0??  or U+00A1-00A9
-                //
-                unicodeDescriptor: function () {
-                    var ud;
-                    
-                    if (ud = $(/^U\+[0-9a-fA-F?]+(\-[0-9a-fA-F?]+)?/)) {
-                        return new(tree.UnicodeDescriptor)(ud[0]);
-                    }
-                },
-
-                //
-                // JavaScript code to be evaluated
-                //
-                //     `window.location.href`
-                //
-                javascript: function () {
-                    var str, j = i, e;
-
-                    if (input.charAt(j) === '~') { j++; e = true; } // Escaped strings
-                    if (input.charAt(j) !== '`') { return; }
-                    if (env.javascriptEnabled !== undefined && !env.javascriptEnabled) {
-                        error("You are using JavaScript, which has been disabled.");
-                    }
-
-                    if (e) { $('~'); }
-
-                    if (str = $(/^`([^`]*)`/)) {
-                        return new(tree.JavaScript)(str[1], i, e);
-                    }
-                }
-            },
-
-            //
-            // The variable part of a variable definition. Used in the `rule` parser
-            //
-            //     @fink:
-            //
-            variable: function () {
-                var name;
-
-                if (input.charAt(i) === '@' && (name = $(/^(@[\w-]+)\s*:/))) { return name[1]; }
-            },
-
-            //
-            // extend syntax - used to extend selectors
-            //
-            extend: function(isRule) {
-                var elements, e, index = i, option, extendList = [];
-
-                if (!$(isRule ? /^&:extend\(/ : /^:extend\(/)) { return; }
-
-                do {
-                    option = null;
-                    elements = [];
-                    while (true) {
-                        option = $(/^(all)(?=\s*(\)|,))/);
-                        if (option) { break; }
-                        e = $(this.element);
-                        if (!e) { break; }
-                        elements.push(e);
-                    }
-
-                    option = option && option[1];
-
-                    extendList.push(new(tree.Extend)(new(tree.Selector)(elements), option, index));
-
-                } while($(","));
-                
-                expect(/^\)/);
-
-                if (isRule) {
-                    expect(/^;/);
-                }
-
-                return extendList;
-            },
-
-            //
-            // extendRule - used in a rule to extend all the parent selectors
-            //
-            extendRule: function() {
-                return this.extend(true);
-            },
-            
-            //
-            // Mixins
-            //
-            mixin: {
-                //
-                // A Mixin call, with an optional argument list
-                //
-                //     #mixins > .square(#fff);
-                //     .rounded(4px, black);
-                //     .button;
-                //
-                // The `while` loop is there because mixins can be
-                // namespaced, but we only support the child and descendant
-                // selector for now.
-                //
-                call: function () {
-                    var elements = [], e, c, args, index = i, s = input.charAt(i), important = false;
-
-                    if (s !== '.' && s !== '#') { return; }
-
-                    save(); // stop us absorbing part of an invalid selector
-
-                    while (e = $(/^[#.](?:[\w-]|\\(?:[A-Fa-f0-9]{1,6} ?|[^A-Fa-f0-9]))+/)) {
-                        elements.push(new(tree.Element)(c, e, i, env.currentFileInfo));
-                        c = $('>');
-                    }
-                    if ($('(')) {
-                        args = this.mixin.args.call(this, true).args;
-                        expect(')');
-                    }
-
-                    args = args || [];
-
-                    if ($(this.important)) {
-                        important = true;
-                    }
-
-                    if (elements.length > 0 && ($(';') || peek('}'))) {
-                        return new(tree.mixin.Call)(elements, args, index, env.currentFileInfo, important);
-                    }
-
-                    restore();
-                },
-                args: function (isCall) {
-                    var expressions = [], argsSemiColon = [], isSemiColonSeperated, argsComma = [], expressionContainsNamed, name, nameLoop, value, arg,
-                        returner = {args:null, variadic: false};
-                    while (true) {
-                        if (isCall) {
-                            arg = $(this.expression);
-                        } else {
-                            $(this.comments);
-                            if (input.charAt(i) === '.' && $(/^\.{3}/)) {
-                                returner.variadic = true;
-                                if ($(";") && !isSemiColonSeperated) {
-                                    isSemiColonSeperated = true;
-                                }
-                                (isSemiColonSeperated ? argsSemiColon : argsComma)
-                                    .push({ variadic: true });
-                                break;
-                            }
-                            arg = $(this.entities.variable) || $(this.entities.literal)
-                                || $(this.entities.keyword);
-                        }
-
-                        if (!arg) {
-                            break;
-                        }
-
-                        nameLoop = null;
-                        if (arg.throwAwayComments) {
-                            arg.throwAwayComments();
-                        }
-                        value = arg;
-                        var val = null;
-
-                        if (isCall) {
-                            // Variable
-                            if (arg.value.length == 1) {
-                                val = arg.value[0];
-                            }
-                        } else {
-                            val = arg;
-                        }
-
-                        if (val && val instanceof tree.Variable) {
-                            if ($(':')) {
-                                if (expressions.length > 0) {
-                                    if (isSemiColonSeperated) {
-                                        error("Cannot mix ; and , as delimiter types");
-                                    }
-                                    expressionContainsNamed = true;
-                                }
-                                value = expect(this.expression);
-                                nameLoop = (name = val.name);
-                            } else if (!isCall && $(/^\.{3}/)) {
-                                returner.variadic = true;
-                                if ($(";") && !isSemiColonSeperated) {
-                                    isSemiColonSeperated = true;
-                                }
-                                (isSemiColonSeperated ? argsSemiColon : argsComma)
-                                    .push({ name: arg.name, variadic: true });
-                                break;
-                            } else if (!isCall) {
-                                name = nameLoop = val.name;
-                                value = null;
-                            }
-                        }
-
-                        if (value) {
-                            expressions.push(value);
-                        }
-
-                        argsComma.push({ name:nameLoop, value:value });
-
-                        if ($(',')) {
-                            continue;
-                        }
-
-                        if ($(';') || isSemiColonSeperated) {
-
-                            if (expressionContainsNamed) {
-                                error("Cannot mix ; and , as delimiter types");
-                            }
-
-                            isSemiColonSeperated = true;
-
-                            if (expressions.length > 1) {
-                                value = new(tree.Value)(expressions);
-                            }
-                            argsSemiColon.push({ name:name, value:value });
-
-                            name = null;
-                            expressions = [];
-                            expressionContainsNamed = false;
-                        }
-                    }
-
-                    returner.args = isSemiColonSeperated ? argsSemiColon : argsComma;
-                    return returner;
-                },
-                //
-                // A Mixin definition, with a list of parameters
-                //
-                //     .rounded (@radius: 2px, @color) {
-                //        ...
-                //     }
-                //
-                // Until we have a finer grained state-machine, we have to
-                // do a look-ahead, to make sure we don't have a mixin call.
-                // See the `rule` function for more information.
-                //
-                // We start by matching `.rounded (`, and then proceed on to
-                // the argument list, which has optional default values.
-                // We store the parameters in `params`, with a `value` key,
-                // if there is a value, such as in the case of `@radius`.
-                //
-                // Once we've got our params list, and a closing `)`, we parse
-                // the `{...}` block.
-                //
-                definition: function () {
-                    var name, params = [], match, ruleset, cond, variadic = false;
-                    if ((input.charAt(i) !== '.' && input.charAt(i) !== '#') ||
-                        peek(/^[^{]*\}/)) {
-                        return;
-                    }
-
-                    save();
-
-                    if (match = $(/^([#.](?:[\w-]|\\(?:[A-Fa-f0-9]{1,6} ?|[^A-Fa-f0-9]))+)\s*\(/)) {
-                        name = match[1];
-
-                        var argInfo = this.mixin.args.call(this, false);
-                        params = argInfo.args;
-                        variadic = argInfo.variadic;
-
-                        // .mixincall("@{a}");
-                        // looks a bit like a mixin definition.. so we have to be nice and restore
-                        if (!$(')')) {
-                            furthest = i;
-                            restore();
-                        }
-                        
-                        $(this.comments);
-
-                        if ($(/^when/)) { // Guard
-                            cond = expect(this.conditions, 'expected condition');
-                        }
-
-                        ruleset = $(this.block);
-
-                        if (ruleset) {
-                            return new(tree.mixin.Definition)(name, params, ruleset, cond, variadic);
-                        } else {
-                            restore();
-                        }
-                    }
-                }
-            },
-
-            //
-            // Entities are the smallest recognized token,
-            // and can be found inside a rule's value.
-            //
-            entity: function () {
-                return $(this.entities.literal) || $(this.entities.variable) || $(this.entities.url) ||
-                       $(this.entities.call)    || $(this.entities.keyword)  ||$(this.entities.javascript) ||
-                       $(this.comment);
-            },
-
-            //
-            // A Rule terminator. Note that we use `peek()` to check for '}',
-            // because the `block` rule will be expecting it, but we still need to make sure
-            // it's there, if ';' was ommitted.
-            //
-            end: function () {
-                return $(';') || peek('}');
-            },
-
-            //
-            // IE's alpha function
-            //
-            //     alpha(opacity=88)
-            //
-            alpha: function () {
-                var value;
-
-                if (! $(/^\(opacity=/i)) { return; }
-                if (value = $(/^\d+/) || $(this.entities.variable)) {
-                    expect(')');
-                    return new(tree.Alpha)(value);
-                }
-            },
-
-            //
-            // A Selector Element
-            //
-            //     div
-            //     + h1
-            //     #socks
-            //     input[type="text"]
-            //
-            // Elements are the building blocks for Selectors,
-            // they are made out of a `Combinator` (see combinator rule),
-            // and an element name, such as a tag a class, or `*`.
-            //
-            element: function () {
-                var e, c, v;
-
-                c = $(this.combinator);
-
-                e = $(/^(?:\d+\.\d+|\d+)%/) || $(/^(?:[.#]?|:*)(?:[\w-]|[^\x00-\x9f]|\\(?:[A-Fa-f0-9]{1,6} ?|[^A-Fa-f0-9]))+/) ||
-                    $('*') || $('&') || $(this.attribute) || $(/^\([^()@]+\)/) || $(/^[\.#](?=@)/) || $(this.entities.variableCurly);
-
-                if (! e) {
-                    if ($('(')) {
-                        if ((v = ($(this.selector))) &&
-                                $(')')) {
-                            e = new(tree.Paren)(v);
-                        }
-                    }
-                }
-
-                if (e) { return new(tree.Element)(c, e, i, env.currentFileInfo); }
-            },
-
-            //
-            // Combinators combine elements together, in a Selector.
-            //
-            // Because our parser isn't white-space sensitive, special care
-            // has to be taken, when parsing the descendant combinator, ` `,
-            // as it's an empty space. We have to check the previous character
-            // in the input, to see if it's a ` ` character. More info on how
-            // we deal with this in *combinator.js*.
-            //
-            combinator: function () {
-                var c = input.charAt(i);
-
-                if (c === '>' || c === '+' || c === '~' || c === '|') {
-                    i++;
-                    while (input.charAt(i).match(/\s/)) { i++; }
-                    return new(tree.Combinator)(c);
-                } else if (input.charAt(i - 1).match(/\s/)) {
-                    return new(tree.Combinator)(" ");
-                } else {
-                    return new(tree.Combinator)(null);
-                }
-            },
-            //
-            // A CSS selector (see selector below)
-            // with less extensions e.g. the ability to extend and guard
-            //
-            lessSelector: function () {
-                return this.selector(true);
-            },
-            //
-            // A CSS Selector
-            //
-            //     .class > div + h1
-            //     li a:hover
-            //
-            // Selectors are made out of one or more Elements, see above.
-            //
-            selector: function (isLess) {
-                var e, elements = [], c, extend, extendList = [], when, condition;
-
-                while ((isLess && (extend = $(this.extend))) || (isLess && (when = $(/^when/))) || (e = $(this.element))) {
-                    if (when) {
-                        condition = expect(this.conditions, 'expected condition');
-                    } else if (condition) {
-                        error("CSS guard can only be used at the end of selector");
-                    } else if (extend) {
-                        extendList.push.apply(extendList, extend);
-                    } else {
-                        if (extendList.length) {
-                            error("Extend can only be used at the end of selector");
-                        }
-                        c = input.charAt(i);
-                        elements.push(e);
-                        e = null;
-                    }
-                    if (c === '{' || c === '}' || c === ';' || c === ',' || c === ')') {
-                        break;
-                    }
-                }
-
-                if (elements.length > 0) { return new(tree.Selector)(elements, extendList, condition, i, env.currentFileInfo); }
-                if (extendList.length) { error("Extend must be used to extend a selector, it cannot be used on its own"); }
-            },
-            attribute: function () {
-                var key, val, op;
-
-                if (! $('[')) { return; }
-
-                if (!(key = $(this.entities.variableCurly))) {
-                    key = expect(/^(?:[_A-Za-z0-9-\*]*\|)?(?:[_A-Za-z0-9-]|\\.)+/);
-                }
-
-                if ((op = $(/^[|~*$^]?=/))) {
-                    val = $(this.entities.quoted) || $(/^[0-9]+%/) || $(/^[\w-]+/) || $(this.entities.variableCurly);
-                }
-
-                expect(']');
-
-                return new(tree.Attribute)(key, op, val);
-            },
-
-            //
-            // The `block` rule is used by `ruleset` and `mixin.definition`.
-            // It's a wrapper around the `primary` rule, with added `{}`.
-            //
-            block: function () {
-                var content;
-                if ($('{') && (content = $(this.primary)) && $('}')) {
-                    return content;
-                }
-            },
-
-            //
-            // div, .class, body > p {...}
-            //
-            ruleset: function () {
-                var selectors = [], s, rules, debugInfo;
-                
-                save();
-
-                if (env.dumpLineNumbers) {
-                    debugInfo = getDebugInfo(i, input, env);
-                }
-
-                while (s = $(this.lessSelector)) {
-                    selectors.push(s);
-                    $(this.comments);
-                    if (! $(',')) { break; }
-                    if (s.condition) {
-                        error("Guards are only currently allowed on a single selector.");
-                    }
-                    $(this.comments);
-                }
-
-                if (selectors.length > 0 && (rules = $(this.block))) {
-                    var ruleset = new(tree.Ruleset)(selectors, rules, env.strictImports);
-                    if (env.dumpLineNumbers) {
-                        ruleset.debugInfo = debugInfo;
-                    }
-                    return ruleset;
-                } else {
-                    // Backtrack
-                    furthest = i;
-                    restore();
-                }
-            },
-            rule: function (tryAnonymous) {
-                var name, value, c = input.charAt(i), important, merge = false;
-                save();
-
-                if (c === '.' || c === '#' || c === '&') { return; }
-
-                if (name = $(this.variable) || $(this.ruleProperty)) {
-                    // prefer to try to parse first if its a variable or we are compressing
-                    // but always fallback on the other one
-                    value = !tryAnonymous && (env.compress || (name.charAt(0) === '@')) ?
-                        ($(this.value) || $(this.anonymousValue)) :
-                        ($(this.anonymousValue) || $(this.value));
-
-
-                    important = $(this.important);
-                    if (name[name.length-1] === "+") {
-                        merge = true;
-                        name = name.substr(0, name.length - 1);
-                    }
-
-                    if (value && $(this.end)) {
-                        return new (tree.Rule)(name, value, important, merge, memo, env.currentFileInfo);
-                    } else {
-                        furthest = i;
-                        restore();
-                        if (value && !tryAnonymous) {
-                            return this.rule(true);
-                        }
-                    }
-                }
-            },
-            anonymousValue: function () {
-                var match;
-                if (match = /^([^@+\/'"*`(;{}-]*);/.exec(chunks[j])) {
-                    i += match[0].length - 1;
-                    return new(tree.Anonymous)(match[1]);
-                }
-            },
-
-            //
-            // An @import directive
-            //
-            //     @import "lib";
-            //
-            // Depending on our environemnt, importing is done differently:
-            // In the browser, it's an XHR request, in Node, it would be a
-            // file-system operation. The function used for importing is
-            // stored in `import`, which we pass to the Import constructor.
-            //
-            "import": function () {
-                var path, features, index = i;
-
-                save();
-
-                var dir = $(/^@import?\s+/);
-
-                var options = (dir ? $(this.importOptions) : null) || {};
-
-                if (dir && (path = $(this.entities.quoted) || $(this.entities.url))) {
-                    features = $(this.mediaFeatures);
-                    if ($(';')) {
-                        features = features && new(tree.Value)(features);
-                        return new(tree.Import)(path, features, options, index, env.currentFileInfo);
-                    }
-                }
-
-                restore();
-            },
-
-            importOptions: function() {
-                var o, options = {}, optionName, value;
-
-                // list of options, surrounded by parens
-                if (! $('(')) { return null; }
-                do {
-                    if (o = $(this.importOption)) {
-                        optionName = o;
-                        value = true;
-                        switch(optionName) {
-                            case "css":
-                                optionName = "less";
-                                value = false;
-                            break;
-                            case "once":
-                                optionName = "multiple";
-                                value = false;
-                            break;
-                        }
-                        options[optionName] = value;
-                        if (! $(',')) { break; }
-                    }
-                } while (o);
-                expect(')');
-                return options;
-            },
-
-            importOption: function() {
-                var opt = $(/^(less|css|multiple|once|inline|reference)/);
-                if (opt) {
-                    return opt[1];
-                }
-            },
-
-            mediaFeature: function () {
-                var e, p, nodes = [];
-
-                do {
-                    if (e = ($(this.entities.keyword) || $(this.entities.variable))) {
-                        nodes.push(e);
-                    } else if ($('(')) {
-                        p = $(this.property);
-                        e = $(this.value);
-                        if ($(')')) {
-                            if (p && e) {
-                                nodes.push(new(tree.Paren)(new(tree.Rule)(p, e, null, null, i, env.currentFileInfo, true)));
-                            } else if (e) {
-                                nodes.push(new(tree.Paren)(e));
-                            } else {
-                                return null;
-                            }
-                        } else { return null; }
-                    }
-                } while (e);
-
-                if (nodes.length > 0) {
-                    return new(tree.Expression)(nodes);
-                }
-            },
-
-            mediaFeatures: function () {
-                var e, features = [];
-
-                do {
-                  if (e = $(this.mediaFeature)) {
-                      features.push(e);
-                      if (! $(',')) { break; }
-                  } else if (e = $(this.entities.variable)) {
-                      features.push(e);
-                      if (! $(',')) { break; }
-                  }
-                } while (e);
-
-                return features.length > 0 ? features : null;
-            },
-
-            media: function () {
-                var features, rules, media, debugInfo;
-
-                if (env.dumpLineNumbers) {
-                    debugInfo = getDebugInfo(i, input, env);
-                }
-
-                if ($(/^@media/)) {
-                    features = $(this.mediaFeatures);
-
-                    if (rules = $(this.block)) {
-                        media = new(tree.Media)(rules, features, i, env.currentFileInfo);
-                        if (env.dumpLineNumbers) {
-                            media.debugInfo = debugInfo;
-                        }
-                        return media;
-                    }
-                }
-            },
-
-            //
-            // A CSS Directive
-            //
-            //     @charset "utf-8";
-            //
-            directive: function () {
-                var name, value, rules, nonVendorSpecificName,
-                    hasBlock, hasIdentifier, hasExpression, identifier;
-
-                if (input.charAt(i) !== '@') { return; }
-
-                if (value = $(this['import']) || $(this.media)) {
-                    return value;
-                }
-
-                save();
-
-                name = $(/^@[a-z-]+/);
-                
-                if (!name) { return; }
-
-                nonVendorSpecificName = name;
-                if (name.charAt(1) == '-' && name.indexOf('-', 2) > 0) {
-                    nonVendorSpecificName = "@" + name.slice(name.indexOf('-', 2) + 1);
-                }
-
-                switch(nonVendorSpecificName) {
-                    case "@font-face":
-                        hasBlock = true;
-                        break;
-                    case "@viewport":
-                    case "@top-left":
-                    case "@top-left-corner":
-                    case "@top-center":
-                    case "@top-right":
-                    case "@top-right-corner":
-                    case "@bottom-left":
-                    case "@bottom-left-corner":
-                    case "@bottom-center":
-                    case "@bottom-right":
-                    case "@bottom-right-corner":
-                    case "@left-top":
-                    case "@left-middle":
-                    case "@left-bottom":
-                    case "@right-top":
-                    case "@right-middle":
-                    case "@right-bottom":
-                        hasBlock = true;
-                        break;
-                    case "@host":
-                    case "@page":
-                    case "@document":
-                    case "@supports":
-                    case "@keyframes":
-                        hasBlock = true;
-                        hasIdentifier = true;
-                        break;
-                    case "@namespace":
-                        hasExpression = true;
-                        break;
-                }
-
-                if (hasIdentifier) {
-                    identifier = ($(/^[^{]+/) || '').trim();
-                    if (identifier) {
-                        name += " " + identifier;
-                    }
-                }
-
-                if (hasBlock)
-                {
-                    if (rules = $(this.block)) {
-                        return new(tree.Directive)(name, rules, i, env.currentFileInfo);
-                    }
-                } else {
-                    if ((value = hasExpression ? $(this.expression) : $(this.entity)) && $(';')) {
-                        var directive = new(tree.Directive)(name, value, i, env.currentFileInfo);
-                        if (env.dumpLineNumbers) {
-                            directive.debugInfo = getDebugInfo(i, input, env);
-                        }
-                        return directive;
-                    }
-                }
-
-                restore();
-            },
-
-            //
-            // A Value is a comma-delimited list of Expressions
-            //
-            //     font-family: Baskerville, Georgia, serif;
-            //
-            // In a Rule, a Value represents everything after the `:`,
-            // and before the `;`.
-            //
-            value: function () {
-                var e, expressions = [];
-
-                while (e = $(this.expression)) {
-                    expressions.push(e);
-                    if (! $(',')) { break; }
-                }
-
-                if (expressions.length > 0) {
-                    return new(tree.Value)(expressions);
-                }
-            },
-            important: function () {
-                if (input.charAt(i) === '!') {
-                    return $(/^! *important/);
-                }
-            },
-            sub: function () {
-                var a, e;
-
-                if ($('(')) {
-                    if (a = $(this.addition)) {
-                        e = new(tree.Expression)([a]);
-                        expect(')');
-                        e.parens = true;
-                        return e;
-                    }
-                }
-            },
-            multiplication: function () {
-                var m, a, op, operation, isSpaced;
-                if (m = $(this.operand)) {
-                    isSpaced = isWhitespace(input.charAt(i - 1));
-                    while (!peek(/^\/[*\/]/) && (op = ($('/') || $('*')))) {
-                        if (a = $(this.operand)) {
-                            m.parensInOp = true;
-                            a.parensInOp = true;
-                            operation = new(tree.Operation)(op, [operation || m, a], isSpaced);
-                            isSpaced = isWhitespace(input.charAt(i - 1));
-                        } else {
-                            break;
-                        }
-                    }
-                    return operation || m;
-                }
-            },
-            addition: function () {
-                var m, a, op, operation, isSpaced;
-                if (m = $(this.multiplication)) {
-                    isSpaced = isWhitespace(input.charAt(i - 1));
-                    while ((op = $(/^[-+]\s+/) || (!isSpaced && ($('+') || $('-')))) &&
-                           (a = $(this.multiplication))) {
-                        m.parensInOp = true;
-                        a.parensInOp = true;
-                        operation = new(tree.Operation)(op, [operation || m, a], isSpaced);
-                        isSpaced = isWhitespace(input.charAt(i - 1));
-                    }
-                    return operation || m;
-                }
-            },
-            conditions: function () {
-                var a, b, index = i, condition;
-
-                if (a = $(this.condition)) {
-                    while (peek(/^,\s*(not\s*)?\(/) && $(',') && (b = $(this.condition))) {
-                        condition = new(tree.Condition)('or', condition || a, b, index);
-                    }
-                    return condition || a;
-                }
-            },
-            condition: function () {
-                var a, b, c, op, index = i, negate = false;
-
-                if ($(/^not/)) { negate = true; }
-                expect('(');
-                if (a = $(this.addition) || $(this.entities.keyword) || $(this.entities.quoted)) {
-                    if (op = $(/^(?:>=|<=|=<|[<=>])/)) {
-                        if (b = $(this.addition) || $(this.entities.keyword) || $(this.entities.quoted)) {
-                            c = new(tree.Condition)(op, a, b, index, negate);
-                        } else {
-                            error('expected expression');
-                        }
-                    } else {
-                        c = new(tree.Condition)('=', a, new(tree.Keyword)('true'), index, negate);
-                    }
-                    expect(')');
-                    return $(/^and/) ? new(tree.Condition)('and', c, $(this.condition)) : c;
-                }
-            },
-
-            //
-            // An operand is anything that can be part of an operation,
-            // such as a Color, or a Variable
-            //
-            operand: function () {
-                var negate, p = input.charAt(i + 1);
-
-                if (input.charAt(i) === '-' && (p === '@' || p === '(')) { negate = $('-'); }
-                var o = $(this.sub) || $(this.entities.dimension) ||
-                        $(this.entities.color) || $(this.entities.variable) ||
-                        $(this.entities.call);
-
-                if (negate) {
-                    o.parensInOp = true;
-                    o = new(tree.Negative)(o);
-                }
-
-                return o;
-            },
-
-            //
-            // Expressions either represent mathematical operations,
-            // or white-space delimited Entities.
-            //
-            //     1px solid black
-            //     @var * 2
-            //
-            expression: function () {
-                var e, delim, entities = [];
-
-                while (e = $(this.addition) || $(this.entity)) {
-                    entities.push(e);
-                    // operations do not allow keyword "/" dimension (e.g. small/20px) so we support that here
-                    if (!peek(/^\/[\/*]/) && (delim = $('/'))) {
-                        entities.push(new(tree.Anonymous)(delim));
-                    }
-                }
-                if (entities.length > 0) {
-                    return new(tree.Expression)(entities);
-                }
-            },
-            property: function () {
-                var name;
-
-                if (name = $(/^(\*?-?[_a-zA-Z0-9-]+)\s*:/)) {
-                    return name[1];
-                }
-            },
-            ruleProperty: function () {
-                var name;
-
-                if (name = $(/^(\*?-?[_a-zA-Z0-9-]+)\s*(\+?)\s*:/)) {
-                    return name[1] + (name[2] || "");
-                }
-            }
-        }
-    };
-};
-
-
-(function (tree) {
-
-tree.functions = {
-    rgb: function (r, g, b) {
-        return this.rgba(r, g, b, 1.0);
-    },
-    rgba: function (r, g, b, a) {
-        var rgb = [r, g, b].map(function (c) { return scaled(c, 256); });
-        a = number(a);
-        return new(tree.Color)(rgb, a);
-    },
-    hsl: function (h, s, l) {
-        return this.hsla(h, s, l, 1.0);
-    },
-    hsla: function (h, s, l, a) {
-        function hue(h) {
-            h = h < 0 ? h + 1 : (h > 1 ? h - 1 : h);
-            if      (h * 6 < 1) { return m1 + (m2 - m1) * h * 6; }
-            else if (h * 2 < 1) { return m2; }
-            else if (h * 3 < 2) { return m1 + (m2 - m1) * (2/3 - h) * 6; }
-            else                { return m1; }
-        }
-
-        h = (number(h) % 360) / 360;
-        s = clamp(number(s)); l = clamp(number(l)); a = clamp(number(a));
-
-        var m2 = l <= 0.5 ? l * (s + 1) : l + s - l * s;
-        var m1 = l * 2 - m2;
-
-        return this.rgba(hue(h + 1/3) * 255,
-                         hue(h)       * 255,
-                         hue(h - 1/3) * 255,
-                         a);
-    },
-
-    hsv: function(h, s, v) {
-        return this.hsva(h, s, v, 1.0);
-    },
-
-    hsva: function(h, s, v, a) {
-        h = ((number(h) % 360) / 360) * 360;
-        s = number(s); v = number(v); a = number(a);
-
-        var i, f;
-        i = Math.floor((h / 60) % 6);
-        f = (h / 60) - i;
-
-        var vs = [v,
-                  v * (1 - s),
-                  v * (1 - f * s),
-                  v * (1 - (1 - f) * s)];
-        var perm = [[0, 3, 1],
-                    [2, 0, 1],
-                    [1, 0, 3],
-                    [1, 2, 0],
-                    [3, 1, 0],
-                    [0, 1, 2]];
-
-        return this.rgba(vs[perm[i][0]] * 255,
-                         vs[perm[i][1]] * 255,
-                         vs[perm[i][2]] * 255,
-                         a);
-    },
-
-    hue: function (color) {
-        return new(tree.Dimension)(Math.round(color.toHSL().h));
-    },
-    saturation: function (color) {
-        return new(tree.Dimension)(Math.round(color.toHSL().s * 100), '%');
-    },
-    lightness: function (color) {
-        return new(tree.Dimension)(Math.round(color.toHSL().l * 100), '%');
-    },
-    hsvhue: function(color) {
-        return new(tree.Dimension)(Math.round(color.toHSV().h));
-    },
-    hsvsaturation: function (color) {
-        return new(tree.Dimension)(Math.round(color.toHSV().s * 100), '%');
-    },
-    hsvvalue: function (color) {
-        return new(tree.Dimension)(Math.round(color.toHSV().v * 100), '%');
-    },
-    red: function (color) {
-        return new(tree.Dimension)(color.rgb[0]);
-    },
-    green: function (color) {
-        return new(tree.Dimension)(color.rgb[1]);
-    },
-    blue: function (color) {
-        return new(tree.Dimension)(color.rgb[2]);
-    },
-    alpha: function (color) {
-        return new(tree.Dimension)(color.toHSL().a);
-    },
-    luma: function (color) {
-        return new(tree.Dimension)(Math.round(color.luma() * color.alpha * 100), '%');
-    },
-    saturate: function (color, amount) {
-        // filter: saturate(3.2);
-        // should be kept as is, so check for color
-        if (!color.rgb) {
-            return null;
-        }
-        var hsl = color.toHSL();
-
-        hsl.s += amount.value / 100;
-        hsl.s = clamp(hsl.s);
-        return hsla(hsl);
-    },
-    desaturate: function (color, amount) {
-        var hsl = color.toHSL();
-
-        hsl.s -= amount.value / 100;
-        hsl.s = clamp(hsl.s);
-        return hsla(hsl);
-    },
-    lighten: function (color, amount) {
-        var hsl = color.toHSL();
-
-        hsl.l += amount.value / 100;
-        hsl.l = clamp(hsl.l);
-        return hsla(hsl);
-    },
-    darken: function (color, amount) {
-        var hsl = color.toHSL();
-
-        hsl.l -= amount.value / 100;
-        hsl.l = clamp(hsl.l);
-        return hsla(hsl);
-    },
-    fadein: function (color, amount) {
-        var hsl = color.toHSL();
-
-        hsl.a += amount.value / 100;
-        hsl.a = clamp(hsl.a);
-        return hsla(hsl);
-    },
-    fadeout: function (color, amount) {
-        var hsl = color.toHSL();
-
-        hsl.a -= amount.value / 100;
-        hsl.a = clamp(hsl.a);
-        return hsla(hsl);
-    },
-    fade: function (color, amount) {
-        var hsl = color.toHSL();
-
-        hsl.a = amount.value / 100;
-        hsl.a = clamp(hsl.a);
-        return hsla(hsl);
-    },
-    spin: function (color, amount) {
-        var hsl = color.toHSL();
-        var hue = (hsl.h + amount.value) % 360;
-
-        hsl.h = hue < 0 ? 360 + hue : hue;
-
-        return hsla(hsl);
-    },
-    //
-    // Copyright (c) 2006-2009 Hampton Catlin, Nathan Weizenbaum, and Chris Eppstein
-    // http://sass-lang.com
-    //
-    mix: function (color1, color2, weight) {
-        if (!weight) {
-            weight = new(tree.Dimension)(50);
-        }
-        var p = weight.value / 100.0;
-        var w = p * 2 - 1;
-        var a = color1.toHSL().a - color2.toHSL().a;
-
-        var w1 = (((w * a == -1) ? w : (w + a) / (1 + w * a)) + 1) / 2.0;
-        var w2 = 1 - w1;
-
-        var rgb = [color1.rgb[0] * w1 + color2.rgb[0] * w2,
-                   color1.rgb[1] * w1 + color2.rgb[1] * w2,
-                   color1.rgb[2] * w1 + color2.rgb[2] * w2];
-
-        var alpha = color1.alpha * p + color2.alpha * (1 - p);
-
-        return new(tree.Color)(rgb, alpha);
-    },
-    greyscale: function (color) {
-        return this.desaturate(color, new(tree.Dimension)(100));
-    },
-    contrast: function (color, dark, light, threshold) {
-        // filter: contrast(3.2);
-        // should be kept as is, so check for color
-        if (!color.rgb) {
-            return null;
-        }
-        if (typeof light === 'undefined') {
-            light = this.rgba(255, 255, 255, 1.0);
-        }
-        if (typeof dark === 'undefined') {
-            dark = this.rgba(0, 0, 0, 1.0);
-        }
-        //Figure out which is actually light and dark!
-        if (dark.luma() > light.luma()) {
-            var t = light;
-            light = dark;
-            dark = t;
-        }
-        if (typeof threshold === 'undefined') {
-            threshold = 0.43;
-        } else {
-            threshold = number(threshold);
-        }
-        if ((color.luma() * color.alpha) < threshold) {
-            return light;
-        } else {
-            return dark;
-        }
-    },
-    e: function (str) {
-        return new(tree.Anonymous)(str instanceof tree.JavaScript ? str.evaluated : str);
-    },
-    escape: function (str) {
-        return new(tree.Anonymous)(encodeURI(str.value).replace(/=/g, "%3D").replace(/:/g, "%3A").replace(/#/g, "%23").replace(/;/g, "%3B").replace(/\(/g, "%28").replace(/\)/g, "%29"));
-    },
-    '%': function (quoted /* arg, arg, ...*/) {
-        var args = Array.prototype.slice.call(arguments, 1),
-            str = quoted.value;
-
-        for (var i = 0; i < args.length; i++) {
-            /*jshint loopfunc:true */
-            str = str.replace(/%[sda]/i, function(token) {
-                var value = token.match(/s/i) ? args[i].value : args[i].toCSS();
-                return token.match(/[A-Z]$/) ? encodeURIComponent(value) : value;
-            });
-        }
-        str = str.replace(/%%/g, '%');
-        return new(tree.Quoted)('"' + str + '"', str);
-    },
-    unit: function (val, unit) {
-        if(!(val instanceof tree.Dimension)) {
-            throw { type: "Argument", message: "the first argument to unit must be a number" + (val instanceof tree.Operation ? ". Have you forgotten parenthesis?" : "") };
-        }
-        return new(tree.Dimension)(val.value, unit ? unit.toCSS() : "");
-    },
-    convert: function (val, unit) {
-        return val.convertTo(unit.value);
-    },
-    round: function (n, f) {
-        var fraction = typeof(f) === "undefined" ? 0 : f.value;
-        return this._math(function(num) { return num.toFixed(fraction); }, null, n);
-    },
-    pi: function () {
-        return new(tree.Dimension)(Math.PI);
-    },
-    mod: function(a, b) {
-        return new(tree.Dimension)(a.value % b.value, a.unit);
-    },
-    pow: function(x, y) {
-        if (typeof x === "number" && typeof y === "number") {
-            x = new(tree.Dimension)(x);
-            y = new(tree.Dimension)(y);
-        } else if (!(x instanceof tree.Dimension) || !(y instanceof tree.Dimension)) {
-            throw { type: "Argument", message: "arguments must be numbers" };
-        }
-
-        return new(tree.Dimension)(Math.pow(x.value, y.value), x.unit);
-    },
-    _math: function (fn, unit, n) {
-        if (n instanceof tree.Dimension) {
-            /*jshint eqnull:true */
-            return new(tree.Dimension)(fn(parseFloat(n.value)), unit == null ? n.unit : unit);
-        } else if (typeof(n) === 'number') {
-            return fn(n);
-        } else {
-            throw { type: "Argument", message: "argument must be a number" };
-        }
-    },
-    _minmax: function (isMin, args) {
-        args = Array.prototype.slice.call(args);
-        switch(args.length) {
-        case 0: throw { type: "Argument", message: "one or more arguments required" };
-        case 1: return args[0];
-        }
-        var i, j, current, currentUnified, referenceUnified, unit,
-            order  = [], // elems only contains original argument values.
-            values = {}; // key is the unit.toString() for unified tree.Dimension values,
-                         // value is the index into the order array.
-        for (i = 0; i < args.length; i++) {
-            current = args[i];
-            if (!(current instanceof tree.Dimension)) {
-                order.push(current);
-                continue;
-            }
-            currentUnified = current.unify();
-            unit = currentUnified.unit.toString();
-            j = values[unit];
-            if (j === undefined) {
-                values[unit] = order.length;
-                order.push(current);
-                continue;
-            }
-            referenceUnified = order[j].unify();
-            if ( isMin && currentUnified.value < referenceUnified.value ||
-                !isMin && currentUnified.value > referenceUnified.value) {
-                order[j] = current;
-            }
-        }
-        if (order.length == 1) {
-            return order[0];
-        }
-        args = order.map(function (a) { return a.toCSS(this.env); })
-                    .join(this.env.compress ? "," : ", ");
-        return new(tree.Anonymous)((isMin ? "min" : "max") + "(" + args + ")");
-    },
-    min: function () {
-        return this._minmax(true, arguments);
-    },
-    max: function () {
-        return this._minmax(false, arguments);
-    },
-    argb: function (color) {
-        return new(tree.Anonymous)(color.toARGB());
-
-    },
-    percentage: function (n) {
-        return new(tree.Dimension)(n.value * 100, '%');
-    },
-    color: function (n) {
-        if (n instanceof tree.Quoted) {
-            var colorCandidate = n.value,
-                returnColor;
-            returnColor = tree.Color.fromKeyword(colorCandidate);
-            if (returnColor) {
-                return returnColor;
-            }
-            if (/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})/.test(colorCandidate)) {
-                return new(tree.Color)(colorCandidate.slice(1));
-            }
-            throw { type: "Argument", message: "argument must be a color keyword or 3/6 digit hex e.g. #FFF" };
-        } else {
-            throw { type: "Argument", message: "argument must be a string" };
-        }
-    },
-    iscolor: function (n) {
-        return this._isa(n, tree.Color);
-    },
-    isnumber: function (n) {
-        return this._isa(n, tree.Dimension);
-    },
-    isstring: function (n) {
-        return this._isa(n, tree.Quoted);
-    },
-    iskeyword: function (n) {
-        return this._isa(n, tree.Keyword);
-    },
-    isurl: function (n) {
-        return this._isa(n, tree.URL);
-    },
-    ispixel: function (n) {
-        return this.isunit(n, 'px');
-    },
-    ispercentage: function (n) {
-        return this.isunit(n, '%');
-    },
-    isem: function (n) {
-        return this.isunit(n, 'em');
-    },
-    isunit: function (n, unit) {
-        return (n instanceof tree.Dimension) && n.unit.is(unit.value || unit) ? tree.True : tree.False;
-    },
-    _isa: function (n, Type) {
-        return (n instanceof Type) ? tree.True : tree.False;
-    },
-    
-    /* Blending modes */
-    
-    multiply: function(color1, color2) {
-        var r = color1.rgb[0] * color2.rgb[0] / 255;
-        var g = color1.rgb[1] * color2.rgb[1] / 255;
-        var b = color1.rgb[2] * color2.rgb[2] / 255;
-        return this.rgb(r, g, b);
-    },
-    screen: function(color1, color2) {
-        var r = 255 - (255 - color1.rgb[0]) * (255 - color2.rgb[0]) / 255;
-        var g = 255 - (255 - color1.rgb[1]) * (255 - color2.rgb[1]) / 255;
-        var b = 255 - (255 - color1.rgb[2]) * (255 - color2.rgb[2]) / 255;
-        return this.rgb(r, g, b);
-    },
-    overlay: function(color1, color2) {
-        var r = color1.rgb[0] < 128 ? 2 * color1.rgb[0] * color2.rgb[0] / 255 : 255 - 2 * (255 - color1.rgb[0]) * (255 - color2.rgb[0]) / 255;
-        var g = color1.rgb[1] < 128 ? 2 * color1.rgb[1] * color2.rgb[1] / 255 : 255 - 2 * (255 - color1.rgb[1]) * (255 - color2.rgb[1]) / 255;
-        var b = color1.rgb[2] < 128 ? 2 * color1.rgb[2] * color2.rgb[2] / 255 : 255 - 2 * (255 - color1.rgb[2]) * (255 - color2.rgb[2]) / 255;
-        return this.rgb(r, g, b);
-    },
-    softlight: function(color1, color2) {
-        var t = color2.rgb[0] * color1.rgb[0] / 255;
-        var r = t + color1.rgb[0] * (255 - (255 - color1.rgb[0]) * (255 - color2.rgb[0]) / 255 - t) / 255;
-        t = color2.rgb[1] * color1.rgb[1] / 255;
-        var g = t + color1.rgb[1] * (255 - (255 - color1.rgb[1]) * (255 - color2.rgb[1]) / 255 - t) / 255;
-        t = color2.rgb[2] * color1.rgb[2] / 255;
-        var b = t + color1.rgb[2] * (255 - (255 - color1.rgb[2]) * (255 - color2.rgb[2]) / 255 - t) / 255;
-        return this.rgb(r, g, b);
-    },
-    hardlight: function(color1, color2) {
-        var r = color2.rgb[0] < 128 ? 2 * color2.rgb[0] * color1.rgb[0] / 255 : 255 - 2 * (255 - color2.rgb[0]) * (255 - color1.rgb[0]) / 255;
-        var g = color2.rgb[1] < 128 ? 2 * color2.rgb[1] * color1.rgb[1] / 255 : 255 - 2 * (255 - color2.rgb[1]) * (255 - color1.rgb[1]) / 255;
-        var b = color2.rgb[2] < 128 ? 2 * color2.rgb[2] * color1.rgb[2] / 255 : 255 - 2 * (255 - color2.rgb[2]) * (255 - color1.rgb[2]) / 255;
-        return this.rgb(r, g, b);
-    },
-    difference: function(color1, color2) {
-        var r = Math.abs(color1.rgb[0] - color2.rgb[0]);
-        var g = Math.abs(color1.rgb[1] - color2.rgb[1]);
-        var b = Math.abs(color1.rgb[2] - color2.rgb[2]);
-        return this.rgb(r, g, b);
-    },
-    exclusion: function(color1, color2) {
-        var r = color1.rgb[0] + color2.rgb[0] * (255 - color1.rgb[0] - color1.rgb[0]) / 255;
-        var g = color1.rgb[1] + color2.rgb[1] * (255 - color1.rgb[1] - color1.rgb[1]) / 255;
-        var b = color1.rgb[2] + color2.rgb[2] * (255 - color1.rgb[2] - color1.rgb[2]) / 255;
-        return this.rgb(r, g, b);
-    },
-    average: function(color1, color2) {
-        var r = (color1.rgb[0] + color2.rgb[0]) / 2;
-        var g = (color1.rgb[1] + color2.rgb[1]) / 2;
-        var b = (color1.rgb[2] + color2.rgb[2]) / 2;
-        return this.rgb(r, g, b);
-    },
-    negation: function(color1, color2) {
-        var r = 255 - Math.abs(255 - color2.rgb[0] - color1.rgb[0]);
-        var g = 255 - Math.abs(255 - color2.rgb[1] - color1.rgb[1]);
-        var b = 255 - Math.abs(255 - color2.rgb[2] - color1.rgb[2]);
-        return this.rgb(r, g, b);
-    },
-    tint: function(color, amount) {
-        return this.mix(this.rgb(255,255,255), color, amount);
-    },
-    shade: function(color, amount) {
-        return this.mix(this.rgb(0, 0, 0), color, amount);
-    },   
-    extract: function(values, index) {
-        index = index.value - 1; // (1-based index)       
-        // handle non-array values as an array of length 1
-        // return 'undefined' if index is invalid
-        return Array.isArray(values.value) 
-            ? values.value[index] : Array(values)[index];
-    },
-    length: function(values) {
-        var n = Array.isArray(values.value) ? values.value.length : 1;
-        return new tree.Dimension(n);
-    },
-
-    "data-uri": function(mimetypeNode, filePathNode) {
-
-        if (typeof window !== 'undefined') {
-            return new tree.URL(filePathNode || mimetypeNode, this.currentFileInfo).eval(this.env);
-        }
-
-        var mimetype = mimetypeNode.value;
-        var filePath = (filePathNode && filePathNode.value);
-
-        var fs = require("fs"),
-            path = require("path"),
-            useBase64 = false;
-
-        if (arguments.length < 2) {
-            filePath = mimetype;
-        }
-
-        if (this.env.isPathRelative(filePath)) {
-            if (this.currentFileInfo.relativeUrls) {
-                filePath = path.join(this.currentFileInfo.currentDirectory, filePath);
-            } else {
-                filePath = path.join(this.currentFileInfo.entryPath, filePath);
-            }
-        }
-
-        // detect the mimetype if not given
-        if (arguments.length < 2) {
-            var mime;
-            try {
-                mime = require('mime');
-            } catch (ex) {
-                mime = tree._mime;
-            }
-
-            mimetype = mime.lookup(filePath);
-
-            // use base 64 unless it's an ASCII or UTF-8 format
-            var charset = mime.charsets.lookup(mimetype);
-            useBase64 = ['US-ASCII', 'UTF-8'].indexOf(charset) < 0;
-            if (useBase64) { mimetype += ';base64'; }
-        }
-        else {
-            useBase64 = /;base64$/.test(mimetype);
-        }
-
-        var buf = fs.readFileSync(filePath);
-
-        // IE8 cannot handle a data-uri larger than 32KB. If this is exceeded
-        // and the --ieCompat flag is enabled, return a normal url() instead.
-        var DATA_URI_MAX_KB = 32,
-            fileSizeInKB = parseInt((buf.length / 1024), 10);
-        if (fileSizeInKB >= DATA_URI_MAX_KB) {
-
-            if (this.env.ieCompat !== false) {
-                if (!this.env.silent) {
-                    console.warn("Skipped data-uri embedding of %s because its size (%dKB) exceeds IE8-safe %dKB!", filePath, fileSizeInKB, DATA_URI_MAX_KB);
-                }
-
-                return new tree.URL(filePathNode || mimetypeNode, this.currentFileInfo).eval(this.env);
-            }
-        }
-
-        buf = useBase64 ? buf.toString('base64')
-                        : encodeURIComponent(buf);
-
-        var uri = "'data:" + mimetype + ',' + buf + "'";
-        return new(tree.URL)(new(tree.Anonymous)(uri));
-    },
-
-    "svg-gradient": function(direction) {
-
-        function throwArgumentDescriptor() {
-            throw { type: "Argument", message: "svg-gradient expects direction, start_color [start_position], [color position,]..., end_color [end_position]" };
-        }
-
-        if (arguments.length < 3) {
-            throwArgumentDescriptor();
-        }
-        var stops = Array.prototype.slice.call(arguments, 1),
-            gradientDirectionSvg,
-            gradientType = "linear",
-            rectangleDimension = 'x="0" y="0" width="1" height="1"',
-            useBase64 = true,
-            renderEnv = {compress: false},
-            returner,
-            directionValue = direction.toCSS(renderEnv),
-            i, color, position, positionValue, alpha;
-
-        switch (directionValue) {
-            case "to bottom":
-                gradientDirectionSvg = 'x1="0%" y1="0%" x2="0%" y2="100%"';
-                break;
-            case "to right":
-                gradientDirectionSvg = 'x1="0%" y1="0%" x2="100%" y2="0%"';
-                break;
-            case "to bottom right":
-                gradientDirectionSvg = 'x1="0%" y1="0%" x2="100%" y2="100%"';
-                break;
-            case "to top right":
-                gradientDirectionSvg = 'x1="0%" y1="100%" x2="100%" y2="0%"';
-                break;
-            case "ellipse":
-            case "ellipse at center":
-                gradientType = "radial";
-                gradientDirectionSvg = 'cx="50%" cy="50%" r="75%"';
-                rectangleDimension = 'x="-50" y="-50" width="101" height="101"';
-                break;
-            default:
-                throw { type: "Argument", message: "svg-gradient direction must be 'to bottom', 'to right', 'to bottom right', 'to top right' or 'ellipse at center'" };
-        }
-        returner = '<?xml version="1.0" ?>' +
-            '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100%" viewBox="0 0 1 1" preserveAspectRatio="none">' +
-            '<' + gradientType + 'Gradient id="gradient" gradientUnits="userSpaceOnUse" ' + gradientDirectionSvg + '>';
-
-        for (i = 0; i < stops.length; i+= 1) {
-            if (stops[i].value) {
-                color = stops[i].value[0];
-                position = stops[i].value[1];
-            } else {
-                color = stops[i];
-                position = undefined;
-            }
-
-            if (!(color instanceof tree.Color) || (!((i === 0 || i+1 === stops.length) && position === undefined) && !(position instanceof tree.Dimension))) {
-                throwArgumentDescriptor();
-            }
-            positionValue = position ? position.toCSS(renderEnv) : i === 0 ? "0%" : "100%";
-            alpha = color.alpha;
-            returner += '<stop offset="' + positionValue + '" stop-color="' + color.toRGB() + '"' + (alpha < 1 ? ' stop-opacity="' + alpha + '"' : '') + '/>';
-        }
-        returner += '</' + gradientType + 'Gradient>' +
-                    '<rect ' + rectangleDimension + ' fill="url(#gradient)" /></svg>';
-
-        if (useBase64) {
-            // only works in node, needs interface to what is supported in environment
-            try {
-                returner = new Buffer(returner).toString('base64');
-            } catch(e) {
-                useBase64 = false;
-            }
-        }
-
-        returner = "'data:image/svg+xml" + (useBase64 ? ";base64" : "") + "," + returner + "'";
-        return new(tree.URL)(new(tree.Anonymous)(returner));
-    }
-};
-
-// these static methods are used as a fallback when the optional 'mime' dependency is missing
-tree._mime = {
-    // this map is intentionally incomplete
-    // if you want more, install 'mime' dep
-    _types: {
-        '.htm' : 'text/html',
-        '.html': 'text/html',
-        '.gif' : 'image/gif',
-        '.jpg' : 'image/jpeg',
-        '.jpeg': 'image/jpeg',
-        '.png' : 'image/png'
-    },
-    lookup: function (filepath) {
-        var ext = require('path').extname(filepath),
-            type = tree._mime._types[ext];
-        if (type === undefined) {
-            throw new Error('Optional dependency "mime" is required for ' + ext);
-        }
-        return type;
-    },
-    charsets: {
-        lookup: function (type) {
-            // assumes all text types are UTF-8
-            return type && (/^text\//).test(type) ? 'UTF-8' : '';
-        }
-    }
-};
-
-var mathFunctions = [{name:"ceil"}, {name:"floor"}, {name: "sqrt"}, {name:"abs"},
-        {name:"tan", unit: ""}, {name:"sin", unit: ""}, {name:"cos", unit: ""},
-        {name:"atan", unit: "rad"}, {name:"asin", unit: "rad"}, {name:"acos", unit: "rad"}],
-    createMathFunction = function(name, unit) {
-        return function(n) {
-            /*jshint eqnull:true */
-            if (unit != null) {
-                n = n.unify();
-            }
-            return this._math(Math[name], unit, n);
-        };
-    };
-
-for(var i = 0; i < mathFunctions.length; i++) {
-    tree.functions[mathFunctions[i].name] = createMathFunction(mathFunctions[i].name, mathFunctions[i].unit);
-}
-
-function hsla(color) {
-    return tree.functions.hsla(color.h, color.s, color.l, color.a);
-}
-
-function scaled(n, size) {
-    if (n instanceof tree.Dimension && n.unit.is('%')) {
-        return parseFloat(n.value * size / 100);
-    } else {
-        return number(n);
-    }
-}
-
-function number(n) {
-    if (n instanceof tree.Dimension) {
-        return parseFloat(n.unit.is('%') ? n.value / 100 : n.value);
-    } else if (typeof(n) === 'number') {
-        return n;
-    } else {
-        throw {
-            error: "RuntimeError",
-            message: "color functions take numbers as parameters"
-        };
-    }
-}
-
-function clamp(val) {
-    return Math.min(1, Math.max(0, val));
-}
-
-tree.functionCall = function(env, currentFileInfo) {
-    this.env = env;
-    this.currentFileInfo = currentFileInfo;
-};
-
-tree.functionCall.prototype = tree.functions;
-
-})(require('./tree'));
-
-(function (tree) {
-    tree.colors = {
-        'aliceblue':'#f0f8ff',
-        'antiquewhite':'#faebd7',
-        'aqua':'#00ffff',
-        'aquamarine':'#7fffd4',
-        'azure':'#f0ffff',
-        'beige':'#f5f5dc',
-        'bisque':'#ffe4c4',
-        'black':'#000000',
-        'blanchedalmond':'#ffebcd',
-        'blue':'#0000ff',
-        'blueviolet':'#8a2be2',
-        'brown':'#a52a2a',
-        'burlywood':'#deb887',
-        'cadetblue':'#5f9ea0',
-        'chartreuse':'#7fff00',
-        'chocolate':'#d2691e',
-        'coral':'#ff7f50',
-        'cornflowerblue':'#6495ed',
-        'cornsilk':'#fff8dc',
-        'crimson':'#dc143c',
-        'cyan':'#00ffff',
-        'darkblue':'#00008b',
-        'darkcyan':'#008b8b',
-        'darkgoldenrod':'#b8860b',
-        'darkgray':'#a9a9a9',
-        'darkgrey':'#a9a9a9',
-        'darkgreen':'#006400',
-        'darkkhaki':'#bdb76b',
-        'darkmagenta':'#8b008b',
-        'darkolivegreen':'#556b2f',
-        'darkorange':'#ff8c00',
-        'darkorchid':'#9932cc',
-        'darkred':'#8b0000',
-        'darksalmon':'#e9967a',
-        'darkseagreen':'#8fbc8f',
-        'darkslateblue':'#483d8b',
-        'darkslategray':'#2f4f4f',
-        'darkslategrey':'#2f4f4f',
-        'darkturquoise':'#00ced1',
-        'darkviolet':'#9400d3',
-        'deeppink':'#ff1493',
-        'deepskyblue':'#00bfff',
-        'dimgray':'#696969',
-        'dimgrey':'#696969',
-        'dodgerblue':'#1e90ff',
-        'firebrick':'#b22222',
-        'floralwhite':'#fffaf0',
-        'forestgreen':'#228b22',
-        'fuchsia':'#ff00ff',
-        'gainsboro':'#dcdcdc',
-        'ghostwhite':'#f8f8ff',
-        'gold':'#ffd700',
-        'goldenrod':'#daa520',
-        'gray':'#808080',
-        'grey':'#808080',
-        'green':'#008000',
-        'greenyellow':'#adff2f',
-        'honeydew':'#f0fff0',
-        'hotpink':'#ff69b4',
-        'indianred':'#cd5c5c',
-        'indigo':'#4b0082',
-        'ivory':'#fffff0',
-        'khaki':'#f0e68c',
-        'lavender':'#e6e6fa',
-        'lavenderblush':'#fff0f5',
-        'lawngreen':'#7cfc00',
-        'lemonchiffon':'#fffacd',
-        'lightblue':'#add8e6',
-        'lightcoral':'#f08080',
-        'lightcyan':'#e0ffff',
-        'lightgoldenrodyellow':'#fafad2',
-        'lightgray':'#d3d3d3',
-        'lightgrey':'#d3d3d3',
-        'lightgreen':'#90ee90',
-        'lightpink':'#ffb6c1',
-        'lightsalmon':'#ffa07a',
-        'lightseagreen':'#20b2aa',
-        'lightskyblue':'#87cefa',
-        'lightslategray':'#778899',
-        'lightslategrey':'#778899',
-        'lightsteelblue':'#b0c4de',
-        'lightyellow':'#ffffe0',
-        'lime':'#00ff00',
-        'limegreen':'#32cd32',
-        'linen':'#faf0e6',
-        'magenta':'#ff00ff',
-        'maroon':'#800000',
-        'mediumaquamarine':'#66cdaa',
-        'mediumblue':'#0000cd',
-        'mediumorchid':'#ba55d3',
-        'mediumpurple':'#9370d8',
-        'mediumseagreen':'#3cb371',
-        'mediumslateblue':'#7b68ee',
-        'mediumspringgreen':'#00fa9a',
-        'mediumturquoise':'#48d1cc',
-        'mediumvioletred':'#c71585',
-        'midnightblue':'#191970',
-        'mintcream':'#f5fffa',
-        'mistyrose':'#ffe4e1',
-        'moccasin':'#ffe4b5',
-        'navajowhite':'#ffdead',
-        'navy':'#000080',
-        'oldlace':'#fdf5e6',
-        'olive':'#808000',
-        'olivedrab':'#6b8e23',
-        'orange':'#ffa500',
-        'orangered':'#ff4500',
-        'orchid':'#da70d6',
-        'palegoldenrod':'#eee8aa',
-        'palegreen':'#98fb98',
-        'paleturquoise':'#afeeee',
-        'palevioletred':'#d87093',
-        'papayawhip':'#ffefd5',
-        'peachpuff':'#ffdab9',
-        'peru':'#cd853f',
-        'pink':'#ffc0cb',
-        'plum':'#dda0dd',
-        'powderblue':'#b0e0e6',
-        'purple':'#800080',
-        'red':'#ff0000',
-        'rosybrown':'#bc8f8f',
-        'royalblue':'#4169e1',
-        'saddlebrown':'#8b4513',
-        'salmon':'#fa8072',
-        'sandybrown':'#f4a460',
-        'seagreen':'#2e8b57',
-        'seashell':'#fff5ee',
-        'sienna':'#a0522d',
-        'silver':'#c0c0c0',
-        'skyblue':'#87ceeb',
-        'slateblue':'#6a5acd',
-        'slategray':'#708090',
-        'slategrey':'#708090',
-        'snow':'#fffafa',
-        'springgreen':'#00ff7f',
-        'steelblue':'#4682b4',
-        'tan':'#d2b48c',
-        'teal':'#008080',
-        'thistle':'#d8bfd8',
-        'tomato':'#ff6347',
-        'turquoise':'#40e0d0',
-        'violet':'#ee82ee',
-        'wheat':'#f5deb3',
-        'white':'#ffffff',
-        'whitesmoke':'#f5f5f5',
-        'yellow':'#ffff00',
-        'yellowgreen':'#9acd32'
-    };
-})(require('./tree'));
-
-(function (tree) {
-
-tree.debugInfo = function(env, ctx, lineSeperator) {
-    var result="";
-    if (env.dumpLineNumbers && !env.compress) {
-        switch(env.dumpLineNumbers) {
-            case 'comments':
-                result = tree.debugInfo.asComment(ctx);
-                break;
-            case 'mediaquery':
-                result = tree.debugInfo.asMediaQuery(ctx);
-                break;
-            case 'all':
-                result = tree.debugInfo.asComment(ctx) + (lineSeperator || "") + tree.debugInfo.asMediaQuery(ctx);
-                break;
-        }
-    }
-    return result;
-};
-
-tree.debugInfo.asComment = function(ctx) {
-    return '/* line ' + ctx.debugInfo.lineNumber + ', ' + ctx.debugInfo.fileName + ' */\n';
-};
-
-tree.debugInfo.asMediaQuery = function(ctx) {
-    return '@media -sass-debug-info{filename{font-family:' +
-        ('file://' + ctx.debugInfo.fileName).replace(/([.:/\\])/g, function (a) {
-            if (a == '\\') {
-                a = '\/';
-            }
-            return '\\' + a;
-        }) +
-        '}line{font-family:\\00003' + ctx.debugInfo.lineNumber + '}}\n';
-};
-
-tree.find = function (obj, fun) {
-    for (var i = 0, r; i < obj.length; i++) {
-        if (r = fun.call(obj, obj[i])) { return r; }
-    }
-    return null;
-};
-
-tree.jsify = function (obj) {
-    if (Array.isArray(obj.value) && (obj.value.length > 1)) {
-        return '[' + obj.value.map(function (v) { return v.toCSS(false); }).join(', ') + ']';
-    } else {
-        return obj.toCSS(false);
-    }
-};
-
-tree.toCSS = function (env) {
-    var strs = [];
-    this.genCSS(env, {
-        add: function(chunk, fileInfo, index) {
-            strs.push(chunk);
-        },
-        isEmpty: function () {
-            return strs.length === 0;
-        }
-    });
-    return strs.join('');
-};
-
-tree.outputRuleset = function (env, output, rules) {
-    output.add((env.compress ? '{' : ' {\n'));
-    env.tabLevel = (env.tabLevel || 0) + 1;
-    var tabRuleStr = env.compress ? '' : Array(env.tabLevel + 1).join("  "),
-        tabSetStr = env.compress ? '' : Array(env.tabLevel).join("  ");
-    for(var i = 0; i < rules.length; i++) {
-        output.add(tabRuleStr);
-        rules[i].genCSS(env, output);
-        output.add(env.compress ? '' : '\n');
-    }
-    env.tabLevel--;
-    output.add(tabSetStr + "}");
-};
-
-})(require('./tree'));
-
-(function (tree) {
-
-tree.Alpha = function (val) {
-    this.value = val;
-};
-tree.Alpha.prototype = {
-    type: "Alpha",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    eval: function (env) {
-        if (this.value.eval) { return new tree.Alpha(this.value.eval(env)); }
-        return this;
-    },
-    genCSS: function (env, output) {
-        output.add("alpha(opacity=");
-
-        if (this.value.genCSS) {
-            this.value.genCSS(env, output);
-        } else {
-            output.add(this.value);
-        }
-
-        output.add(")");
-    },
-    toCSS: tree.toCSS
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Anonymous = function (string, index, currentFileInfo, mapLines) {
-    this.value = string.value || string;
-    this.index = index;
-    this.mapLines = mapLines;
-    this.currentFileInfo = currentFileInfo;
-};
-tree.Anonymous.prototype = {
-    type: "Anonymous",
-    eval: function () { return this; },
-    compare: function (x) {
-        if (!x.toCSS) {
-            return -1;
-        }
-        
-        var left = this.toCSS(),
-            right = x.toCSS();
-        
-        if (left === right) {
-            return 0;
-        }
-        
-        return left < right ? -1 : 1;
-    },
-    genCSS: function (env, output) {
-        output.add(this.value, this.currentFileInfo, this.index, this.mapLines);
-    },
-    toCSS: tree.toCSS
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Assignment = function (key, val) {
-    this.key = key;
-    this.value = val;
-};
-tree.Assignment.prototype = {
-    type: "Assignment",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    eval: function (env) {
-        if (this.value.eval) {
-            return new(tree.Assignment)(this.key, this.value.eval(env));
-        }
-        return this;
-    },
-    genCSS: function (env, output) {
-        output.add(this.key + '=');
-        if (this.value.genCSS) {
-            this.value.genCSS(env, output);
-        } else {
-            output.add(this.value);
-        }
-    },
-    toCSS: tree.toCSS
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-//
-// A function call node.
-//
-tree.Call = function (name, args, index, currentFileInfo) {
-    this.name = name;
-    this.args = args;
-    this.index = index;
-    this.currentFileInfo = currentFileInfo;
-};
-tree.Call.prototype = {
-    type: "Call",
-    accept: function (visitor) {
-        this.args = visitor.visit(this.args);
-    },
-    //
-    // When evaluating a function call,
-    // we either find the function in `tree.functions` [1],
-    // in which case we call it, passing the  evaluated arguments,
-    // if this returns null or we cannot find the function, we 
-    // simply print it out as it appeared originally [2].
-    //
-    // The *functions.js* file contains the built-in functions.
-    //
-    // The reason why we evaluate the arguments, is in the case where
-    // we try to pass a variable to a function, like: `saturate(@color)`.
-    // The function should receive the value, not the variable.
-    //
-    eval: function (env) {
-        var args = this.args.map(function (a) { return a.eval(env); }),
-            nameLC = this.name.toLowerCase(),
-            result, func;
-
-        if (nameLC in tree.functions) { // 1.
-            try {
-                func = new tree.functionCall(env, this.currentFileInfo);
-                result = func[nameLC].apply(func, args);
-                /*jshint eqnull:true */
-                if (result != null) {
-                    return result;
-                }
-            } catch (e) {
-                throw { type: e.type || "Runtime",
-                        message: "error evaluating function `" + this.name + "`" +
-                                 (e.message ? ': ' + e.message : ''),
-                        index: this.index, filename: this.currentFileInfo.filename };
-            }
-        }
-
-        return new tree.Call(this.name, args, this.index, this.currentFileInfo);
-    },
-
-    genCSS: function (env, output) {
-        output.add(this.name + "(", this.currentFileInfo, this.index);
-
-        for(var i = 0; i < this.args.length; i++) {
-            this.args[i].genCSS(env, output);
-            if (i + 1 < this.args.length) {
-                output.add(", ");
-            }
-        }
-
-        output.add(")");
-    },
-
-    toCSS: tree.toCSS
-};
-
-})(require('../tree'));
-
-(function (tree) {
-//
-// RGB Colors - #ff0014, #eee
-//
-tree.Color = function (rgb, a) {
-    //
-    // The end goal here, is to parse the arguments
-    // into an integer triplet, such as `128, 255, 0`
-    //
-    // This facilitates operations and conversions.
-    //
-    if (Array.isArray(rgb)) {
-        this.rgb = rgb;
-    } else if (rgb.length == 6) {
-        this.rgb = rgb.match(/.{2}/g).map(function (c) {
-            return parseInt(c, 16);
-        });
-    } else {
-        this.rgb = rgb.split('').map(function (c) {
-            return parseInt(c + c, 16);
-        });
-    }
-    this.alpha = typeof(a) === 'number' ? a : 1;
-};
-
-var transparentKeyword = "transparent";
-
-tree.Color.prototype = {
-    type: "Color",
-    eval: function () { return this; },
-    luma: function () { return (0.2126 * this.rgb[0] / 255) + (0.7152 * this.rgb[1] / 255) + (0.0722 * this.rgb[2] / 255); },
-
-    genCSS: function (env, output) {
-        output.add(this.toCSS(env));
-    },
-    toCSS: function (env, doNotCompress) {
-        var compress = env && env.compress && !doNotCompress;
-
-        // If we have some transparency, the only way to represent it
-        // is via `rgba`. Otherwise, we use the hex representation,
-        // which has better compatibility with older browsers.
-        // Values are capped between `0` and `255`, rounded and zero-padded.
-        if (this.alpha < 1.0) {
-            if (this.alpha === 0 && this.isTransparentKeyword) {
-                return transparentKeyword;
-            }
-            return "rgba(" + this.rgb.map(function (c) {
-                return Math.round(c);
-            }).concat(this.alpha).join(',' + (compress ? '' : ' ')) + ")";
-        } else {
-            var color = this.toRGB();
-
-            if (compress) {
-                var splitcolor = color.split('');
-
-                // Convert color to short format
-                if (splitcolor[1] === splitcolor[2] && splitcolor[3] === splitcolor[4] && splitcolor[5] === splitcolor[6]) {
-                    color = '#' + splitcolor[1] + splitcolor[3] + splitcolor[5];
-                }
-            }
-
-            return color;
-        }
-    },
-
-    //
-    // Operations have to be done per-channel, if not,
-    // channels will spill onto each other. Once we have
-    // our result, in the form of an integer triplet,
-    // we create a new Color node to hold the result.
-    //
-    operate: function (env, op, other) {
-        var result = [];
-
-        if (! (other instanceof tree.Color)) {
-            other = other.toColor();
-        }
-
-        for (var c = 0; c < 3; c++) {
-            result[c] = tree.operate(env, op, this.rgb[c], other.rgb[c]);
-        }
-        return new(tree.Color)(result, this.alpha + other.alpha);
-    },
-
-    toRGB: function () {
-        return '#' + this.rgb.map(function (i) {
-            i = Math.round(i);
-            i = (i > 255 ? 255 : (i < 0 ? 0 : i)).toString(16);
-            return i.length === 1 ? '0' + i : i;
-        }).join('');
-    },
-
-    toHSL: function () {
-        var r = this.rgb[0] / 255,
-            g = this.rgb[1] / 255,
-            b = this.rgb[2] / 255,
-            a = this.alpha;
-
-        var max = Math.max(r, g, b), min = Math.min(r, g, b);
-        var h, s, l = (max + min) / 2, d = max - min;
-
-        if (max === min) {
-            h = s = 0;
-        } else {
-            s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
-
-            switch (max) {
-                case r: h = (g - b) / d + (g < b ? 6 : 0); break;
-                case g: h = (b - r) / d + 2;               break;
-                case b: h = (r - g) / d + 4;               break;
-            }
-            h /= 6;
-        }
-        return { h: h * 360, s: s, l: l, a: a };
-    },
-    //Adapted from http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript
-    toHSV: function () {
-        var r = this.rgb[0] / 255,
-            g = this.rgb[1] / 255,
-            b = this.rgb[2] / 255,
-            a = this.alpha;
-
-        var max = Math.max(r, g, b), min = Math.min(r, g, b);
-        var h, s, v = max;
-
-        var d = max - min;
-        if (max === 0) {
-            s = 0;
-        } else {
-            s = d / max;
-        }
-
-        if (max === min) {
-            h = 0;
-        } else {
-            switch(max){
-                case r: h = (g - b) / d + (g < b ? 6 : 0); break;
-                case g: h = (b - r) / d + 2; break;
-                case b: h = (r - g) / d + 4; break;
-            }
-            h /= 6;
-        }
-        return { h: h * 360, s: s, v: v, a: a };
-    },
-    toARGB: function () {
-        var argb = [Math.round(this.alpha * 255)].concat(this.rgb);
-        return '#' + argb.map(function (i) {
-            i = Math.round(i);
-            i = (i > 255 ? 255 : (i < 0 ? 0 : i)).toString(16);
-            return i.length === 1 ? '0' + i : i;
-        }).join('');
-    },
-    compare: function (x) {
-        if (!x.rgb) {
-            return -1;
-        }
-        
-        return (x.rgb[0] === this.rgb[0] &&
-            x.rgb[1] === this.rgb[1] &&
-            x.rgb[2] === this.rgb[2] &&
-            x.alpha === this.alpha) ? 0 : -1;
-    }
-};
-
-tree.Color.fromKeyword = function(keyword) {
-    if (tree.colors.hasOwnProperty(keyword)) {
-        // detect named color
-        return new(tree.Color)(tree.colors[keyword].slice(1));
-    }
-    if (keyword === transparentKeyword) {
-        var transparent = new(tree.Color)([0, 0, 0], 0);
-        transparent.isTransparentKeyword = true;
-        return transparent;
-    }
-};
-
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Comment = function (value, silent, index, currentFileInfo) {
-    this.value = value;
-    this.silent = !!silent;
-    this.currentFileInfo = currentFileInfo;
-};
-tree.Comment.prototype = {
-    type: "Comment",
-    genCSS: function (env, output) {
-        if (this.debugInfo) {
-            output.add(tree.debugInfo(env, this), this.currentFileInfo, this.index);
-        }
-        output.add(this.value.trim()); //TODO shouldn't need to trim, we shouldn't grab the \n
-    },
-    toCSS: tree.toCSS,
-    isSilent: function(env) {
-        var isReference = (this.currentFileInfo && this.currentFileInfo.reference && !this.isReferenced),
-            isCompressed = env.compress && !this.value.match(/^\/\*!/);
-        return this.silent || isReference || isCompressed;
-    },
-    eval: function () { return this; },
-    markReferenced: function () {
-        this.isReferenced = true;
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Condition = function (op, l, r, i, negate) {
-    this.op = op.trim();
-    this.lvalue = l;
-    this.rvalue = r;
-    this.index = i;
-    this.negate = negate;
-};
-tree.Condition.prototype = {
-    type: "Condition",
-    accept: function (visitor) {
-        this.lvalue = visitor.visit(this.lvalue);
-        this.rvalue = visitor.visit(this.rvalue);
-    },
-    eval: function (env) {
-        var a = this.lvalue.eval(env),
-            b = this.rvalue.eval(env);
-
-        var i = this.index, result;
-
-        result = (function (op) {
-            switch (op) {
-                case 'and':
-                    return a && b;
-                case 'or':
-                    return a || b;
-                default:
-                    if (a.compare) {
-                        result = a.compare(b);
-                    } else if (b.compare) {
-                        result = b.compare(a);
-                    } else {
-                        throw { type: "Type",
-                                message: "Unable to perform comparison",
-                                index: i };
-                    }
-                    switch (result) {
-                        case -1: return op === '<' || op === '=<' || op === '<=';
-                        case  0: return op === '=' || op === '>=' || op === '=<' || op === '<=';
-                        case  1: return op === '>' || op === '>=';
-                    }
-            }
-        })(this.op);
-        return this.negate ? !result : result;
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-//
-// A number with a unit
-//
-tree.Dimension = function (value, unit) {
-    this.value = parseFloat(value);
-    this.unit = (unit && unit instanceof tree.Unit) ? unit :
-      new(tree.Unit)(unit ? [unit] : undefined);
-};
-
-tree.Dimension.prototype = {
-    type: "Dimension",
-    accept: function (visitor) {
-        this.unit = visitor.visit(this.unit);
-    },
-    eval: function (env) {
-        return this;
-    },
-    toColor: function () {
-        return new(tree.Color)([this.value, this.value, this.value]);
-    },
-    genCSS: function (env, output) {
-        if ((env && env.strictUnits) && !this.unit.isSingular()) {
-            throw new Error("Multiple units in dimension. Correct the units or use the unit function. Bad unit: "+this.unit.toString());
-        }
-
-        var value = this.value,
-            strValue = String(value);
-
-        if (value !== 0 && value < 0.000001 && value > -0.000001) {
-            // would be output 1e-6 etc.
-            strValue = value.toFixed(20).replace(/0+$/, "");
-        }
-
-        if (env && env.compress) {
-            // Zero values doesn't need a unit
-            if (value === 0 && this.unit.isLength()) {
-                output.add(strValue);
-                return;
-            }
-
-            // Float values doesn't need a leading zero
-            if (value > 0 && value < 1) {
-                strValue = (strValue).substr(1);
-            }
-        }
-
-        output.add(strValue);
-        this.unit.genCSS(env, output);
-    },
-    toCSS: tree.toCSS,
-
-    // In an operation between two Dimensions,
-    // we default to the first Dimension's unit,
-    // so `1px + 2` will yield `3px`.
-    operate: function (env, op, other) {
-        /*jshint noempty:false */
-        var value = tree.operate(env, op, this.value, other.value),
-            unit = this.unit.clone();
-
-        if (op === '+' || op === '-') {
-            if (unit.numerator.length === 0 && unit.denominator.length === 0) {
-                unit.numerator = other.unit.numerator.slice(0);
-                unit.denominator = other.unit.denominator.slice(0);
-            } else if (other.unit.numerator.length === 0 && unit.denominator.length === 0) {
-                // do nothing
-            } else {
-                other = other.convertTo(this.unit.usedUnits());
-
-                if(env.strictUnits && other.unit.toString() !== unit.toString()) {
-                  throw new Error("Incompatible units. Change the units or use the unit function. Bad units: '" + unit.toString() +
-                    "' and '" + other.unit.toString() + "'.");
-                }
-
-                value = tree.operate(env, op, this.value, other.value);
-            }
-        } else if (op === '*') {
-            unit.numerator = unit.numerator.concat(other.unit.numerator).sort();
-            unit.denominator = unit.denominator.concat(other.unit.denominator).sort();
-            unit.cancel();
-        } else if (op === '/') {
-            unit.numerator = unit.numerator.concat(other.unit.denominator).sort();
-            unit.denominator = unit.denominator.concat(other.unit.numerator).sort();
-            unit.cancel();
-        }
-        return new(tree.Dimension)(value, unit);
-    },
-
-    compare: function (other) {
-        if (other instanceof tree.Dimension) {
-            var a = this.unify(), b = other.unify(),
-                aValue = a.value, bValue = b.value;
-
-            if (bValue > aValue) {
-                return -1;
-            } else if (bValue < aValue) {
-                return 1;
-            } else {
-                if (!b.unit.isEmpty() && a.unit.compare(b.unit) !== 0) {
-                    return -1;
-                }
-                return 0;
-            }
-        } else {
-            return -1;
-        }
-    },
-
-    unify: function () {
-        return this.convertTo({ length: 'm', duration: 's', angle: 'rad' });
-    },
-
-    convertTo: function (conversions) {
-        var value = this.value, unit = this.unit.clone(),
-            i, groupName, group, targetUnit, derivedConversions = {}, applyUnit;
-
-        if (typeof conversions === 'string') {
-            for(i in tree.UnitConversions) {
-                if (tree.UnitConversions[i].hasOwnProperty(conversions)) {
-                    derivedConversions = {};
-                    derivedConversions[i] = conversions;
-                }
-            }
-            conversions = derivedConversions;
-        }
-        applyUnit = function (atomicUnit, denominator) {
-          /*jshint loopfunc:true */
-            if (group.hasOwnProperty(atomicUnit)) {
-                if (denominator) {
-                    value = value / (group[atomicUnit] / group[targetUnit]);
-                } else {
-                    value = value * (group[atomicUnit] / group[targetUnit]);
-                }
-
-                return targetUnit;
-            }
-
-            return atomicUnit;
-        };
-
-        for (groupName in conversions) {
-            if (conversions.hasOwnProperty(groupName)) {
-                targetUnit = conversions[groupName];
-                group = tree.UnitConversions[groupName];
-
-                unit.map(applyUnit);
-            }
-        }
-
-        unit.cancel();
-
-        return new(tree.Dimension)(value, unit);
-    }
-};
-
-// http://www.w3.org/TR/css3-values/#absolute-lengths
-tree.UnitConversions = {
-    length: {
-         'm': 1,
-        'cm': 0.01,
-        'mm': 0.001,
-        'in': 0.0254,
-        'pt': 0.0254 / 72,
-        'pc': 0.0254 / 72 * 12
-    },
-    duration: {
-        's': 1,
-        'ms': 0.001
-    },
-    angle: {
-        'rad': 1/(2*Math.PI),
-        'deg': 1/360,
-        'grad': 1/400,
-        'turn': 1
-    }
-};
-
-tree.Unit = function (numerator, denominator, backupUnit) {
-    this.numerator = numerator ? numerator.slice(0).sort() : [];
-    this.denominator = denominator ? denominator.slice(0).sort() : [];
-    this.backupUnit = backupUnit;
-};
-
-tree.Unit.prototype = {
-    type: "Unit",
-    clone: function () {
-        return new tree.Unit(this.numerator.slice(0), this.denominator.slice(0), this.backupUnit);
-    },
-    genCSS: function (env, output) {
-        if (this.numerator.length >= 1) {
-            output.add(this.numerator[0]);
-        } else
-        if (this.denominator.length >= 1) {
-            output.add(this.denominator[0]);
-        } else
-        if ((!env || !env.strictUnits) && this.backupUnit) {
-            output.add(this.backupUnit);
-        }
-    },
-    toCSS: tree.toCSS,
-
-    toString: function () {
-      var i, returnStr = this.numerator.join("*");
-      for (i = 0; i < this.denominator.length; i++) {
-          returnStr += "/" + this.denominator[i];
-      }
-      return returnStr;
-    },
-
-    compare: function (other) {
-        return this.is(other.toString()) ? 0 : -1;
-    },
-
-    is: function (unitString) {
-        return this.toString() === unitString;
-    },
-
-    isLength: function () {
-        return Boolean(this.toCSS().match(/px|em|%|in|cm|mm|pc|pt|ex/));
-    },
-
-    isEmpty: function () {
-        return this.numerator.length === 0 && this.denominator.length === 0;
-    },
-
-    isSingular: function() {
-        return this.numerator.length <= 1 && this.denominator.length === 0;
-    },
-
-    map: function(callback) {
-        var i;
-
-        for (i = 0; i < this.numerator.length; i++) {
-            this.numerator[i] = callback(this.numerator[i], false);
-        }
-
-        for (i = 0; i < this.denominator.length; i++) {
-            this.denominator[i] = callback(this.denominator[i], true);
-        }
-    },
-
-    usedUnits: function() {
-        var group, result = {}, mapUnit;
-
-        mapUnit = function (atomicUnit) {
-        /*jshint loopfunc:true */
-            if (group.hasOwnProperty(atomicUnit) && !result[groupName]) {
-                result[groupName] = atomicUnit;
-            }
-
-            return atomicUnit;
-        };
-
-        for (var groupName in tree.UnitConversions) {
-            if (tree.UnitConversions.hasOwnProperty(groupName)) {
-                group = tree.UnitConversions[groupName];
-
-                this.map(mapUnit);
-            }
-        }
-
-        return result;
-    },
-
-    cancel: function () {
-        var counter = {}, atomicUnit, i, backup;
-
-        for (i = 0; i < this.numerator.length; i++) {
-            atomicUnit = this.numerator[i];
-            if (!backup) {
-                backup = atomicUnit;
-            }
-            counter[atomicUnit] = (counter[atomicUnit] || 0) + 1;
-        }
-
-        for (i = 0; i < this.denominator.length; i++) {
-            atomicUnit = this.denominator[i];
-            if (!backup) {
-                backup = atomicUnit;
-            }
-            counter[atomicUnit] = (counter[atomicUnit] || 0) - 1;
-        }
-
-        this.numerator = [];
-        this.denominator = [];
-
-        for (atomicUnit in counter) {
-            if (counter.hasOwnProperty(atomicUnit)) {
-                var count = counter[atomicUnit];
-
-                if (count > 0) {
-                    for (i = 0; i < count; i++) {
-                        this.numerator.push(atomicUnit);
-                    }
-                } else if (count < 0) {
-                    for (i = 0; i < -count; i++) {
-                        this.denominator.push(atomicUnit);
-                    }
-                }
-            }
-        }
-
-        if (this.numerator.length === 0 && this.denominator.length === 0 && backup) {
-            this.backupUnit = backup;
-        }
-
-        this.numerator.sort();
-        this.denominator.sort();
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Directive = function (name, value, index, currentFileInfo) {
-    this.name = name;
-
-    if (Array.isArray(value)) {
-        this.rules = [new(tree.Ruleset)([], value)];
-        this.rules[0].allowImports = true;
-    } else {
-        this.value = value;
-    }
-    this.currentFileInfo = currentFileInfo;
-
-};
-tree.Directive.prototype = {
-    type: "Directive",
-    accept: function (visitor) {
-        this.rules = visitor.visit(this.rules);
-        this.value = visitor.visit(this.value);
-    },
-    genCSS: function (env, output) {
-        output.add(this.name, this.currentFileInfo, this.index);
-        if (this.rules) {
-            tree.outputRuleset(env, output, this.rules);
-        } else {
-            output.add(' ');
-            this.value.genCSS(env, output);
-            output.add(';');
-        }
-    },
-    toCSS: tree.toCSS,
-    eval: function (env) {
-        var evaldDirective = this;
-        if (this.rules) {
-            env.frames.unshift(this);
-            evaldDirective = new(tree.Directive)(this.name, null, this.index, this.currentFileInfo);
-            evaldDirective.rules = [this.rules[0].eval(env)];
-            evaldDirective.rules[0].root = true;
-            env.frames.shift();
-        }
-        return evaldDirective;
-    },
-    variable: function (name) { return tree.Ruleset.prototype.variable.call(this.rules[0], name); },
-    find: function () { return tree.Ruleset.prototype.find.apply(this.rules[0], arguments); },
-    rulesets: function () { return tree.Ruleset.prototype.rulesets.apply(this.rules[0]); },
-    markReferenced: function () {
-        var i, rules;
-        this.isReferenced = true;
-        if (this.rules) {
-            rules = this.rules[0].rules;
-            for (i = 0; i < rules.length; i++) {
-                if (rules[i].markReferenced) {
-                    rules[i].markReferenced();
-                }
-            }
-        }
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Element = function (combinator, value, index, currentFileInfo) {
-    this.combinator = combinator instanceof tree.Combinator ?
-                      combinator : new(tree.Combinator)(combinator);
-
-    if (typeof(value) === 'string') {
-        this.value = value.trim();
-    } else if (value) {
-        this.value = value;
-    } else {
-        this.value = "";
-    }
-    this.index = index;
-    this.currentFileInfo = currentFileInfo;
-};
-tree.Element.prototype = {
-    type: "Element",
-    accept: function (visitor) {
-        this.combinator = visitor.visit(this.combinator);
-        this.value = visitor.visit(this.value);
-    },
-    eval: function (env) {
-        return new(tree.Element)(this.combinator,
-                                 this.value.eval ? this.value.eval(env) : this.value,
-                                 this.index,
-                                 this.currentFileInfo);
-    },
-    genCSS: function (env, output) {
-        output.add(this.toCSS(env), this.currentFileInfo, this.index);
-    },
-    toCSS: function (env) {
-        var value = (this.value.toCSS ? this.value.toCSS(env) : this.value);
-        if (value === '' && this.combinator.value.charAt(0) === '&') {
-            return '';
-        } else {
-            return this.combinator.toCSS(env || {}) + value;
-        }
-    }
-};
-
-tree.Attribute = function (key, op, value) {
-    this.key = key;
-    this.op = op;
-    this.value = value;
-};
-tree.Attribute.prototype = {
-    type: "Attribute",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    eval: function (env) {
-        return new(tree.Attribute)(this.key.eval ? this.key.eval(env) : this.key,
-            this.op, (this.value && this.value.eval) ? this.value.eval(env) : this.value);
-    },
-    genCSS: function (env, output) {
-        output.add(this.toCSS(env));
-    },
-    toCSS: function (env) {
-        var value = this.key.toCSS ? this.key.toCSS(env) : this.key;
-
-        if (this.op) {
-            value += this.op;
-            value += (this.value.toCSS ? this.value.toCSS(env) : this.value);
-        }
-
-        return '[' + value + ']';
-    }
-};
-
-tree.Combinator = function (value) {
-    if (value === ' ') {
-        this.value = ' ';
-    } else {
-        this.value = value ? value.trim() : "";
-    }
-};
-tree.Combinator.prototype = {
-    type: "Combinator",
-    _outputMap: {
-        ''  : '',
-        ' ' : ' ',
-        ':' : ' :',
-        '+' : ' + ',
-        '~' : ' ~ ',
-        '>' : ' > ',
-        '|' : '|'
-    },
-    _outputMapCompressed: {
-        ''  : '',
-        ' ' : ' ',
-        ':' : ' :',
-        '+' : '+',
-        '~' : '~',
-        '>' : '>',
-        '|' : '|'
-    },
-    genCSS: function (env, output) {
-        output.add((env.compress ? this._outputMapCompressed : this._outputMap)[this.value]);
-    },
-    toCSS: tree.toCSS
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Expression = function (value) { this.value = value; };
-tree.Expression.prototype = {
-    type: "Expression",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    eval: function (env) {
-        var returnValue,
-            inParenthesis = this.parens && !this.parensInOp,
-            doubleParen = false;
-        if (inParenthesis) {
-            env.inParenthesis();
-        }
-        if (this.value.length > 1) {
-            returnValue = new(tree.Expression)(this.value.map(function (e) {
-                return e.eval(env);
-            }));
-        } else if (this.value.length === 1) {
-            if (this.value[0].parens && !this.value[0].parensInOp) {
-                doubleParen = true;
-            }
-            returnValue = this.value[0].eval(env);
-        } else {
-            returnValue = this;
-        }
-        if (inParenthesis) {
-            env.outOfParenthesis();
-        }
-        if (this.parens && this.parensInOp && !(env.isMathOn()) && !doubleParen) {
-            returnValue = new(tree.Paren)(returnValue);
-        }
-        return returnValue;
-    },
-    genCSS: function (env, output) {
-        for(var i = 0; i < this.value.length; i++) {
-            this.value[i].genCSS(env, output);
-            if (i + 1 < this.value.length) {
-                output.add(" ");
-            }
-        }
-    },
-    toCSS: tree.toCSS,
-    throwAwayComments: function () {
-        this.value = this.value.filter(function(v) {
-            return !(v instanceof tree.Comment);
-        });
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Extend = function Extend(selector, option, index) {
-    this.selector = selector;
-    this.option = option;
-    this.index = index;
-
-    switch(option) {
-        case "all":
-            this.allowBefore = true;
-            this.allowAfter = true;
-        break;
-        default:
-            this.allowBefore = false;
-            this.allowAfter = false;
-        break;
-    }
-};
-
-tree.Extend.prototype = {
-    type: "Extend",
-    accept: function (visitor) {
-        this.selector = visitor.visit(this.selector);
-    },
-    eval: function (env) {
-        return new(tree.Extend)(this.selector.eval(env), this.option, this.index);
-    },
-    clone: function (env) {
-        return new(tree.Extend)(this.selector, this.option, this.index);
-    },
-    findSelfSelectors: function (selectors) {
-        var selfElements = [],
-            i,
-            selectorElements;
-
-        for(i = 0; i < selectors.length; i++) {
-            selectorElements = selectors[i].elements;
-            // duplicate the logic in genCSS function inside the selector node.
-            // future TODO - move both logics into the selector joiner visitor
-            if (i > 0 && selectorElements.length && selectorElements[0].combinator.value === "") {
-                selectorElements[0].combinator.value = ' ';
-            }
-            selfElements = selfElements.concat(selectors[i].elements);
-        }
-
-        this.selfSelectors = [{ elements: selfElements }];
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-//
-// CSS @import node
-//
-// The general strategy here is that we don't want to wait
-// for the parsing to be completed, before we start importing
-// the file. That's because in the context of a browser,
-// most of the time will be spent waiting for the server to respond.
-//
-// On creation, we push the import path to our import queue, though
-// `import,push`, we also pass it a callback, which it'll call once
-// the file has been fetched, and parsed.
-//
-tree.Import = function (path, features, options, index, currentFileInfo) {
-    this.options = options;
-    this.index = index;
-    this.path = path;
-    this.features = features;
-    this.currentFileInfo = currentFileInfo;
-
-    if (this.options.less !== undefined || this.options.inline) {
-        this.css = !this.options.less || this.options.inline;
-    } else {
-        var pathValue = this.getPath();
-        if (pathValue && /css([\?;].*)?$/.test(pathValue)) {
-            this.css = true;
-        }
-    }
-};
-
-//
-// The actual import node doesn't return anything, when converted to CSS.
-// The reason is that it's used at the evaluation stage, so that the rules
-// it imports can be treated like any other rules.
-//
-// In `eval`, we make sure all Import nodes get evaluated, recursively, so
-// we end up with a flat structure, which can easily be imported in the parent
-// ruleset.
-//
-tree.Import.prototype = {
-    type: "Import",
-    accept: function (visitor) {
-        this.features = visitor.visit(this.features);
-        this.path = visitor.visit(this.path);
-        if (!this.options.inline) {
-            this.root = visitor.visit(this.root);
-        }
-    },
-    genCSS: function (env, output) {
-        if (this.css) {
-            output.add("@import ", this.currentFileInfo, this.index);
-            this.path.genCSS(env, output);
-            if (this.features) {
-                output.add(" ");
-                this.features.genCSS(env, output);
-            }
-            output.add(';');
-        }
-    },
-    toCSS: tree.toCSS,
-    getPath: function () {
-        if (this.path instanceof tree.Quoted) {
-            var path = this.path.value;
-            return (this.css !== undefined || /(\.[a-z]*$)|([\?;].*)$/.test(path)) ? path : path + '.less';
-        } else if (this.path instanceof tree.URL) {
-            return this.path.value.value;
-        }
-        return null;
-    },
-    evalForImport: function (env) {
-        return new(tree.Import)(this.path.eval(env), this.features, this.options, this.index, this.currentFileInfo);
-    },
-    evalPath: function (env) {
-        var path = this.path.eval(env);
-        var rootpath = this.currentFileInfo && this.currentFileInfo.rootpath;
-
-        if (!(path instanceof tree.URL)) {
-            if (rootpath) {
-                var pathValue = path.value;
-                // Add the base path if the import is relative
-                if (pathValue && env.isPathRelative(pathValue)) {
-                    path.value = rootpath + pathValue;
-                }
-            }
-            path.value = env.normalizePath(path.value);
-        }
-
-        return path;
-    },
-    eval: function (env) {
-        var ruleset, features = this.features && this.features.eval(env);
-
-        if (this.skip) { return []; }
-
-        if (this.options.inline) {
-            //todo needs to reference css file not import
-            var contents = new(tree.Anonymous)(this.root, 0, {filename: this.importedFilename}, true);
-            return this.features ? new(tree.Media)([contents], this.features.value) : [contents];
-        } else if (this.css) {
-            var newImport = new(tree.Import)(this.evalPath(env), features, this.options, this.index);
-            if (!newImport.css && this.error) {
-                throw this.error;
-            }
-            return newImport;
-        } else {
-            ruleset = new(tree.Ruleset)([], this.root.rules.slice(0));
-
-            ruleset.evalImports(env);
-
-            return this.features ? new(tree.Media)(ruleset.rules, this.features.value) : ruleset.rules;
-        }
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.JavaScript = function (string, index, escaped) {
-    this.escaped = escaped;
-    this.expression = string;
-    this.index = index;
-};
-tree.JavaScript.prototype = {
-    type: "JavaScript",
-    eval: function (env) {
-        var result,
-            that = this,
-            context = {};
-
-        var expression = this.expression.replace(/@\{([\w-]+)\}/g, function (_, name) {
-            return tree.jsify(new(tree.Variable)('@' + name, that.index).eval(env));
-        });
-
-        try {
-            expression = new(Function)('return (' + expression + ')');
-        } catch (e) {
-            throw { message: "JavaScript evaluation error: " + e.message + " from `" + expression + "`" ,
-                    index: this.index };
-        }
-
-        for (var k in env.frames[0].variables()) {
-            /*jshint loopfunc:true */
-            context[k.slice(1)] = {
-                value: env.frames[0].variables()[k].value,
-                toJS: function () {
-                    return this.value.eval(env).toCSS();
-                }
-            };
-        }
-
-        try {
-            result = expression.call(context);
-        } catch (e) {
-            throw { message: "JavaScript evaluation error: '" + e.name + ': ' + e.message + "'" ,
-                    index: this.index };
-        }
-        if (typeof(result) === 'string') {
-            return new(tree.Quoted)('"' + result + '"', result, this.escaped, this.index);
-        } else if (Array.isArray(result)) {
-            return new(tree.Anonymous)(result.join(', '));
-        } else {
-            return new(tree.Anonymous)(result);
-        }
-    }
-};
-
-})(require('../tree'));
-
-
-(function (tree) {
-
-tree.Keyword = function (value) { this.value = value; };
-tree.Keyword.prototype = {
-    type: "Keyword",
-    eval: function () { return this; },
-    genCSS: function (env, output) {
-        output.add(this.value);
-    },
-    toCSS: tree.toCSS,
-    compare: function (other) {
-        if (other instanceof tree.Keyword) {
-            return other.value === this.value ? 0 : 1;
-        } else {
-            return -1;
-        }
-    }
-};
-
-tree.True = new(tree.Keyword)('true');
-tree.False = new(tree.Keyword)('false');
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Media = function (value, features, index, currentFileInfo) {
-    this.index = index;
-    this.currentFileInfo = currentFileInfo;
-
-    var selectors = this.emptySelectors();
-
-    this.features = new(tree.Value)(features);
-    this.rules = [new(tree.Ruleset)(selectors, value)];
-    this.rules[0].allowImports = true;
-};
-tree.Media.prototype = {
-    type: "Media",
-    accept: function (visitor) {
-        this.features = visitor.visit(this.features);
-        this.rules = visitor.visit(this.rules);
-    },
-    genCSS: function (env, output) {
-        output.add('@media ', this.currentFileInfo, this.index);
-        this.features.genCSS(env, output);
-        tree.outputRuleset(env, output, this.rules);
-    },
-    toCSS: tree.toCSS,
-    eval: function (env) {
-        if (!env.mediaBlocks) {
-            env.mediaBlocks = [];
-            env.mediaPath = [];
-        }
-        
-        var media = new(tree.Media)([], [], this.index, this.currentFileInfo);
-        if(this.debugInfo) {
-            this.rules[0].debugInfo = this.debugInfo;
-            media.debugInfo = this.debugInfo;
-        }
-        var strictMathBypass = false;
-        if (!env.strictMath) {
-            strictMathBypass = true;
-            env.strictMath = true;
-        }
-        try {
-            media.features = this.features.eval(env);
-        }
-        finally {
-            if (strictMathBypass) {
-                env.strictMath = false;
-            }
-        }
-        
-        env.mediaPath.push(media);
-        env.mediaBlocks.push(media);
-        
-        env.frames.unshift(this.rules[0]);
-        media.rules = [this.rules[0].eval(env)];
-        env.frames.shift();
-        
-        env.mediaPath.pop();
-
-        return env.mediaPath.length === 0 ? media.evalTop(env) :
-                    media.evalNested(env);
-    },
-    variable: function (name) { return tree.Ruleset.prototype.variable.call(this.rules[0], name); },
-    find: function () { return tree.Ruleset.prototype.find.apply(this.rules[0], arguments); },
-    rulesets: function () { return tree.Ruleset.prototype.rulesets.apply(this.rules[0]); },
-    emptySelectors: function() { 
-        var el = new(tree.Element)('', '&', this.index, this.currentFileInfo);
-        return [new(tree.Selector)([el], null, null, this.index, this.currentFileInfo)];
-    },
-    markReferenced: function () {
-        var i, rules = this.rules[0].rules;
-        this.isReferenced = true;
-        for (i = 0; i < rules.length; i++) {
-            if (rules[i].markReferenced) {
-                rules[i].markReferenced();
-            }
-        }
-    },
-
-    evalTop: function (env) {
-        var result = this;
-
-        // Render all dependent Media blocks.
-        if (env.mediaBlocks.length > 1) {
-            var selectors = this.emptySelectors();
-            result = new(tree.Ruleset)(selectors, env.mediaBlocks);
-            result.multiMedia = true;
-        }
-
-        delete env.mediaBlocks;
-        delete env.mediaPath;
-
-        return result;
-    },
-    evalNested: function (env) {
-        var i, value,
-            path = env.mediaPath.concat([this]);
-
-        // Extract the media-query conditions separated with `,` (OR).
-        for (i = 0; i < path.length; i++) {
-            value = path[i].features instanceof tree.Value ?
-                        path[i].features.value : path[i].features;
-            path[i] = Array.isArray(value) ? value : [value];
-        }
-
-        // Trace all permutations to generate the resulting media-query.
-        //
-        // (a, b and c) with nested (d, e) ->
-        //    a and d
-        //    a and e
-        //    b and c and d
-        //    b and c and e
-        this.features = new(tree.Value)(this.permute(path).map(function (path) {
-            path = path.map(function (fragment) {
-                return fragment.toCSS ? fragment : new(tree.Anonymous)(fragment);
-            });
-
-            for(i = path.length - 1; i > 0; i--) {
-                path.splice(i, 0, new(tree.Anonymous)("and"));
-            }
-
-            return new(tree.Expression)(path);
-        }));
-
-        // Fake a tree-node that doesn't output anything.
-        return new(tree.Ruleset)([], []);
-    },
-    permute: function (arr) {
-      if (arr.length === 0) {
-          return [];
-      } else if (arr.length === 1) {
-          return arr[0];
-      } else {
-          var result = [];
-          var rest = this.permute(arr.slice(1));
-          for (var i = 0; i < rest.length; i++) {
-              for (var j = 0; j < arr[0].length; j++) {
-                  result.push([arr[0][j]].concat(rest[i]));
-              }
-          }
-          return result;
-      }
-    },
-    bubbleSelectors: function (selectors) {
-      this.rules = [new(tree.Ruleset)(selectors.slice(0), [this.rules[0]])];
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.mixin = {};
-tree.mixin.Call = function (elements, args, index, currentFileInfo, important) {
-    this.selector = new(tree.Selector)(elements);
-    this.arguments = args;
-    this.index = index;
-    this.currentFileInfo = currentFileInfo;
-    this.important = important;
-};
-tree.mixin.Call.prototype = {
-    type: "MixinCall",
-    accept: function (visitor) {
-        this.selector = visitor.visit(this.selector);
-        this.arguments = visitor.visit(this.arguments);
-    },
-    eval: function (env) {
-        var mixins, mixin, args, rules = [], match = false, i, m, f, isRecursive, isOneFound, rule;
-
-        args = this.arguments && this.arguments.map(function (a) {
-            return { name: a.name, value: a.value.eval(env) };
-        });
-
-        for (i = 0; i < env.frames.length; i++) {
-            if ((mixins = env.frames[i].find(this.selector)).length > 0) {
-                isOneFound = true;
-                for (m = 0; m < mixins.length; m++) {
-                    mixin = mixins[m];
-                    isRecursive = false;
-                    for(f = 0; f < env.frames.length; f++) {
-                        if ((!(mixin instanceof tree.mixin.Definition)) && mixin === (env.frames[f].originalRuleset || env.frames[f])) {
-                            isRecursive = true;
-                            break;
-                        }
-                    }
-                    if (isRecursive) {
-                        continue;
-                    }
-                    if (mixin.matchArgs(args, env)) {
-                        if (!mixin.matchCondition || mixin.matchCondition(args, env)) {
-                            try {
-                                if (!(mixin instanceof tree.mixin.Definition)) {
-                                    mixin = new tree.mixin.Definition("", [], mixin.rules, null, false);
-                                    mixin.originalRuleset = mixins[m].originalRuleset || mixins[m];
-                                }
-                                //if (this.important) {
-                                //    isImportant = env.isImportant;
-                                //    env.isImportant = true;
-                                //}
-                                Array.prototype.push.apply(
-                                      rules, mixin.eval(env, args, this.important).rules);
-                                //if (this.important) {
-                                //    env.isImportant = isImportant;
-                                //}
-                            } catch (e) {
-                                throw { message: e.message, index: this.index, filename: this.currentFileInfo.filename, stack: e.stack };
-                            }
-                        }
-                        match = true;
-                    }
-                }
-                if (match) {
-                    if (!this.currentFileInfo || !this.currentFileInfo.reference) {
-                        for (i = 0; i < rules.length; i++) {
-                            rule = rules[i];
-                            if (rule.markReferenced) {
-                                rule.markReferenced();
-                            }
-                        }
-                    }
-                    return rules;
-                }
-            }
-        }
-        if (isOneFound) {
-            throw { type:    'Runtime',
-                    message: 'No matching definition was found for `' +
-                              this.selector.toCSS().trim() + '('      +
-                              (args ? args.map(function (a) {
-                                  var argValue = "";
-                                  if (a.name) {
-                                      argValue += a.name + ":";
-                                  }
-                                  if (a.value.toCSS) {
-                                      argValue += a.value.toCSS();
-                                  } else {
-                                      argValue += "???";
-                                  }
-                                  return argValue;
-                              }).join(', ') : "") + ")`",
-                    index:   this.index, filename: this.currentFileInfo.filename };
-        } else {
-            throw { type: 'Name',
-                message: this.selector.toCSS().trim() + " is undefined",
-                index: this.index, filename: this.currentFileInfo.filename };
-        }
-    }
-};
-
-tree.mixin.Definition = function (name, params, rules, condition, variadic) {
-    this.name = name;
-    this.selectors = [new(tree.Selector)([new(tree.Element)(null, name, this.index, this.currentFileInfo)])];
-    this.params = params;
-    this.condition = condition;
-    this.variadic = variadic;
-    this.arity = params.length;
-    this.rules = rules;
-    this._lookups = {};
-    this.required = params.reduce(function (count, p) {
-        if (!p.name || (p.name && !p.value)) { return count + 1; }
-        else                                 { return count; }
-    }, 0);
-    this.parent = tree.Ruleset.prototype;
-    this.frames = [];
-};
-tree.mixin.Definition.prototype = {
-    type: "MixinDefinition",
-    accept: function (visitor) {
-        this.params = visitor.visit(this.params);
-        this.rules = visitor.visit(this.rules);
-        this.condition = visitor.visit(this.condition);
-    },
-    variable:  function (name) { return this.parent.variable.call(this, name); },
-    variables: function ()     { return this.parent.variables.call(this); },
-    find:      function ()     { return this.parent.find.apply(this, arguments); },
-    rulesets:  function ()     { return this.parent.rulesets.apply(this); },
-
-    evalParams: function (env, mixinEnv, args, evaldArguments) {
-        /*jshint boss:true */
-        var frame = new(tree.Ruleset)(null, []),
-            varargs, arg,
-            params = this.params.slice(0),
-            i, j, val, name, isNamedFound, argIndex;
-
-        mixinEnv = new tree.evalEnv(mixinEnv, [frame].concat(mixinEnv.frames));
-        
-        if (args) {
-            args = args.slice(0);
-
-            for(i = 0; i < args.length; i++) {
-                arg = args[i];
-                if (name = (arg && arg.name)) {
-                    isNamedFound = false;
-                    for(j = 0; j < params.length; j++) {
-                        if (!evaldArguments[j] && name === params[j].name) {
-                            evaldArguments[j] = arg.value.eval(env);
-                            frame.rules.unshift(new(tree.Rule)(name, arg.value.eval(env)));
-                            isNamedFound = true;
-                            break;
-                        }
-                    }
-                    if (isNamedFound) {
-                        args.splice(i, 1);
-                        i--;
-                        continue;
-                    } else {
-                        throw { type: 'Runtime', message: "Named argument for " + this.name +
-                            ' ' + args[i].name + ' not found' };
-                    }
-                }
-            }
-        }
-        argIndex = 0;
-        for (i = 0; i < params.length; i++) {
-            if (evaldArguments[i]) { continue; }
-            
-            arg = args && args[argIndex];
-
-            if (name = params[i].name) {
-                if (params[i].variadic && args) {
-                    varargs = [];
-                    for (j = argIndex; j < args.length; j++) {
-                        varargs.push(args[j].value.eval(env));
-                    }
-                    frame.rules.unshift(new(tree.Rule)(name, new(tree.Expression)(varargs).eval(env)));
-                } else {
-                    val = arg && arg.value;
-                    if (val) {
-                        val = val.eval(env);
-                    } else if (params[i].value) {
-                        val = params[i].value.eval(mixinEnv);
-                        frame.resetCache();
-                    } else {
-                        throw { type: 'Runtime', message: "wrong number of arguments for " + this.name +
-                            ' (' + args.length + ' for ' + this.arity + ')' };
-                    }
-                    
-                    frame.rules.unshift(new(tree.Rule)(name, val));
-                    evaldArguments[i] = val;
-                }
-            }
-            
-            if (params[i].variadic && args) {
-                for (j = argIndex; j < args.length; j++) {
-                    evaldArguments[j] = args[j].value.eval(env);
-                }
-            }
-            argIndex++;
-        }
-
-        return frame;
-    },
-    eval: function (env, args, important) {
-        var _arguments = [],
-            mixinFrames = this.frames.concat(env.frames),
-            frame = this.evalParams(env, new(tree.evalEnv)(env, mixinFrames), args, _arguments),
-            rules, ruleset;
-
-        frame.rules.unshift(new(tree.Rule)('@arguments', new(tree.Expression)(_arguments).eval(env)));
-
-        rules = this.rules.slice(0);
-
-        ruleset = new(tree.Ruleset)(null, rules);
-        ruleset.originalRuleset = this;
-        ruleset = ruleset.eval(new(tree.evalEnv)(env, [this, frame].concat(mixinFrames)));
-        if (important) {
-            ruleset = this.parent.makeImportant.apply(ruleset);
-        }
-        return ruleset;
-    },
-    matchCondition: function (args, env) {
-        if (this.condition && !this.condition.eval(
-            new(tree.evalEnv)(env,
-                [this.evalParams(env, new(tree.evalEnv)(env, this.frames.concat(env.frames)), args, [])] // the parameter variables
-                    .concat(this.frames) // the parent namespace/mixin frames
-                    .concat(env.frames)))) { // the current environment frames
-            return false;
-        }
-        return true;
-    },
-    matchArgs: function (args, env) {
-        var argsLength = (args && args.length) || 0, len;
-
-        if (! this.variadic) {
-            if (argsLength < this.required)                               { return false; }
-            if (argsLength > this.params.length)                          { return false; }
-        } else {
-            if (argsLength < (this.required - 1))                         { return false; }
-        }
-
-        len = Math.min(argsLength, this.arity);
-
-        for (var i = 0; i < len; i++) {
-            if (!this.params[i].name && !this.params[i].variadic) {
-                if (args[i].value.eval(env).toCSS() != this.params[i].value.eval(env).toCSS()) {
-                    return false;
-                }
-            }
-        }
-        return true;
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Negative = function (node) {
-    this.value = node;
-};
-tree.Negative.prototype = {
-    type: "Negative",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    genCSS: function (env, output) {
-        output.add('-');
-        this.value.genCSS(env, output);
-    },
-    toCSS: tree.toCSS,
-    eval: function (env) {
-        if (env.isMathOn()) {
-            return (new(tree.Operation)('*', [new(tree.Dimension)(-1), this.value])).eval(env);
-        }
-        return new(tree.Negative)(this.value.eval(env));
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Operation = function (op, operands, isSpaced) {
-    this.op = op.trim();
-    this.operands = operands;
-    this.isSpaced = isSpaced;
-};
-tree.Operation.prototype = {
-    type: "Operation",
-    accept: function (visitor) {
-        this.operands = visitor.visit(this.operands);
-    },
-    eval: function (env) {
-        var a = this.operands[0].eval(env),
-            b = this.operands[1].eval(env),
-            temp;
-
-        if (env.isMathOn()) {
-            if (a instanceof tree.Dimension && b instanceof tree.Color) {
-                if (this.op === '*' || this.op === '+') {
-                    temp = b, b = a, a = temp;
-                } else {
-                    throw { type: "Operation",
-                            message: "Can't substract or divide a color from a number" };
-                }
-            }
-            if (!a.operate) {
-                throw { type: "Operation",
-                        message: "Operation on an invalid type" };
-            }
-
-            return a.operate(env, this.op, b);
-        } else {
-            return new(tree.Operation)(this.op, [a, b], this.isSpaced);
-        }
-    },
-    genCSS: function (env, output) {
-        this.operands[0].genCSS(env, output);
-        if (this.isSpaced) {
-            output.add(" ");
-        }
-        output.add(this.op);
-        if (this.isSpaced) {
-            output.add(" ");
-        }
-        this.operands[1].genCSS(env, output);
-    },
-    toCSS: tree.toCSS
-};
-
-tree.operate = function (env, op, a, b) {
-    switch (op) {
-        case '+': return a + b;
-        case '-': return a - b;
-        case '*': return a * b;
-        case '/': return a / b;
-    }
-};
-
-})(require('../tree'));
-
-
-(function (tree) {
-
-tree.Paren = function (node) {
-    this.value = node;
-};
-tree.Paren.prototype = {
-    type: "Paren",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    genCSS: function (env, output) {
-        output.add('(');
-        this.value.genCSS(env, output);
-        output.add(')');
-    },
-    toCSS: tree.toCSS,
-    eval: function (env) {
-        return new(tree.Paren)(this.value.eval(env));
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Quoted = function (str, content, escaped, index, currentFileInfo) {
-    this.escaped = escaped;
-    this.value = content || '';
-    this.quote = str.charAt(0);
-    this.index = index;
-    this.currentFileInfo = currentFileInfo;
-};
-tree.Quoted.prototype = {
-    type: "Quoted",
-    genCSS: function (env, output) {
-        if (!this.escaped) {
-            output.add(this.quote, this.currentFileInfo, this.index);
-        }
-        output.add(this.value);
-        if (!this.escaped) {
-            output.add(this.quote);
-        }
-    },
-    toCSS: tree.toCSS,
-    eval: function (env) {
-        var that = this;
-        var value = this.value.replace(/`([^`]+)`/g, function (_, exp) {
-            return new(tree.JavaScript)(exp, that.index, true).eval(env).value;
-        }).replace(/@\{([\w-]+)\}/g, function (_, name) {
-            var v = new(tree.Variable)('@' + name, that.index, that.currentFileInfo).eval(env, true);
-            return (v instanceof tree.Quoted) ? v.value : v.toCSS();
-        });
-        return new(tree.Quoted)(this.quote + value + this.quote, value, this.escaped, this.index, this.currentFileInfo);
-    },
-    compare: function (x) {
-        if (!x.toCSS) {
-            return -1;
-        }
-        
-        var left = this.toCSS(),
-            right = x.toCSS();
-        
-        if (left === right) {
-            return 0;
-        }
-        
-        return left < right ? -1 : 1;
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Rule = function (name, value, important, merge, index, currentFileInfo, inline) {
-    this.name = name;
-    this.value = (value instanceof tree.Value) ? value : new(tree.Value)([value]);
-    this.important = important ? ' ' + important.trim() : '';
-    this.merge = merge;
-    this.index = index;
-    this.currentFileInfo = currentFileInfo;
-    this.inline = inline || false;
-    this.variable = (name.charAt(0) === '@');
-};
-
-tree.Rule.prototype = {
-    type: "Rule",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    genCSS: function (env, output) {
-        output.add(this.name + (env.compress ? ':' : ': '), this.currentFileInfo, this.index);
-        try {
-            this.value.genCSS(env, output);
-        }
-        catch(e) {
-            e.index = this.index;
-            e.filename = this.currentFileInfo.filename;
-            throw e;
-        }
-        output.add(this.important + ((this.inline || (env.lastRule && env.compress)) ? "" : ";"), this.currentFileInfo, this.index);
-    },
-    toCSS: tree.toCSS,
-    eval: function (env) {
-        var strictMathBypass = false;
-        if (this.name === "font" && !env.strictMath) {
-            strictMathBypass = true;
-            env.strictMath = true;
-        }
-        try {
-            return new(tree.Rule)(this.name,
-                              this.value.eval(env),
-                              this.important,
-                              this.merge,
-                              this.index, this.currentFileInfo, this.inline);
-        }
-        finally {
-            if (strictMathBypass) {
-                env.strictMath = false;
-            }
-        }
-    },
-    makeImportant: function () {
-        return new(tree.Rule)(this.name,
-                              this.value,
-                              "!important",
-                              this.merge,
-                              this.index, this.currentFileInfo, this.inline);
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Ruleset = function (selectors, rules, strictImports) {
-    this.selectors = selectors;
-    this.rules = rules;
-    this._lookups = {};
-    this.strictImports = strictImports;
-};
-tree.Ruleset.prototype = {
-    type: "Ruleset",
-    accept: function (visitor) {
-        if (this.paths) {
-            for(var i = 0; i < this.paths.length; i++) {
-                this.paths[i] = visitor.visit(this.paths[i]);
-            }
-        } else {
-            this.selectors = visitor.visit(this.selectors);
-        }
-        this.rules = visitor.visit(this.rules);
-    },
-    eval: function (env) {
-        var selectors = this.selectors && this.selectors.map(function (s) { return s.eval(env); });
-        var ruleset = new(tree.Ruleset)(selectors, this.rules.slice(0), this.strictImports);
-        var rules;
-        var rule;
-        var i;
-        
-        ruleset.originalRuleset = this;
-        ruleset.root = this.root;
-        ruleset.firstRoot = this.firstRoot;
-        ruleset.allowImports = this.allowImports;
-
-        if(this.debugInfo) {
-            ruleset.debugInfo = this.debugInfo;
-        }
-
-        // push the current ruleset to the frames stack
-        env.frames.unshift(ruleset);
-
-        // currrent selectors
-        if (!env.selectors) {
-            env.selectors = [];
-        }
-        env.selectors.unshift(this.selectors);
-
-        // Evaluate imports
-        if (ruleset.root || ruleset.allowImports || !ruleset.strictImports) {
-            ruleset.evalImports(env);
-        }
-
-        // Store the frames around mixin definitions,
-        // so they can be evaluated like closures when the time comes.
-        for (i = 0; i < ruleset.rules.length; i++) {
-            if (ruleset.rules[i] instanceof tree.mixin.Definition) {
-                ruleset.rules[i].frames = env.frames.slice(0);
-            }
-        }
-        
-        var mediaBlockCount = (env.mediaBlocks && env.mediaBlocks.length) || 0;
-
-        // Evaluate mixin calls.
-        for (i = 0; i < ruleset.rules.length; i++) {
-            if (ruleset.rules[i] instanceof tree.mixin.Call) {
-                /*jshint loopfunc:true */
-                rules = ruleset.rules[i].eval(env).filter(function(r) {
-                    if ((r instanceof tree.Rule) && r.variable) {
-                        // do not pollute the scope if the variable is
-                        // already there. consider returning false here
-                        // but we need a way to "return" variable from mixins
-                        return !(ruleset.variable(r.name));
-                    }
-                    return true;
-                });
-                ruleset.rules.splice.apply(ruleset.rules, [i, 1].concat(rules));
-                i += rules.length-1;
-                ruleset.resetCache();
-            }
-        }
-        
-        // Evaluate everything else
-        for (i = 0; i < ruleset.rules.length; i++) {
-            rule = ruleset.rules[i];
-
-            if (! (rule instanceof tree.mixin.Definition)) {
-                ruleset.rules[i] = rule.eval ? rule.eval(env) : rule;
-            }
-        }
-
-        // Pop the stack
-        env.frames.shift();
-        env.selectors.shift();
-        
-        if (env.mediaBlocks) {
-            for (i = mediaBlockCount; i < env.mediaBlocks.length; i++) {
-                env.mediaBlocks[i].bubbleSelectors(selectors);
-            }
-        }
-
-        return ruleset;
-    },
-    evalImports: function(env) {
-        var i, rules;
-        for (i = 0; i < this.rules.length; i++) {
-            if (this.rules[i] instanceof tree.Import) {
-                rules = this.rules[i].eval(env);
-                if (typeof rules.length === "number") {
-                    this.rules.splice.apply(this.rules, [i, 1].concat(rules));
-                    i+= rules.length-1;
-                } else {
-                    this.rules.splice(i, 1, rules);
-                }
-                this.resetCache();
-            }
-        }
-    },
-    makeImportant: function() {
-        return new tree.Ruleset(this.selectors, this.rules.map(function (r) {
-                    if (r.makeImportant) {
-                        return r.makeImportant();
-                    } else {
-                        return r;
-                    }
-                }), this.strictImports);
-    },
-    matchArgs: function (args) {
-        return !args || args.length === 0;
-    },
-    matchCondition: function (args, env) {
-        var lastSelector = this.selectors[this.selectors.length-1];
-        if (lastSelector.condition &&
-            !lastSelector.condition.eval(
-                new(tree.evalEnv)(env,
-                    env.frames))) {
-            return false;
-        }
-        return true;
-    },
-    resetCache: function () {
-        this._rulesets = null;
-        this._variables = null;
-        this._lookups = {};
-    },
-    variables: function () {
-        if (this._variables) { return this._variables; }
-        else {
-            return this._variables = this.rules.reduce(function (hash, r) {
-                if (r instanceof tree.Rule && r.variable === true) {
-                    hash[r.name] = r;
-                }
-                return hash;
-            }, {});
-        }
-    },
-    variable: function (name) {
-        return this.variables()[name];
-    },
-    rulesets: function () {
-        return this.rules.filter(function (r) {
-            return (r instanceof tree.Ruleset) || (r instanceof tree.mixin.Definition);
-        });
-    },
-    find: function (selector, self) {
-        self = self || this;
-        var rules = [], match,
-            key = selector.toCSS();
-
-        if (key in this._lookups) { return this._lookups[key]; }
-
-        this.rulesets().forEach(function (rule) {
-            if (rule !== self) {
-                for (var j = 0; j < rule.selectors.length; j++) {
-                    if (match = selector.match(rule.selectors[j])) {
-                        if (selector.elements.length > match) {
-                            Array.prototype.push.apply(rules, rule.find(
-                                new(tree.Selector)(selector.elements.slice(match)), self));
-                        } else {
-                            rules.push(rule);
-                        }
-                        break;
-                    }
-                }
-            }
-        });
-        return this._lookups[key] = rules;
-    },
-    genCSS: function (env, output) {
-        var i, j,
-            ruleNodes = [],
-            rulesetNodes = [],
-            debugInfo,     // Line number debugging
-            rule,
-            firstRuleset = true,
-            path;
-
-        env.tabLevel = (env.tabLevel || 0);
-
-        if (!this.root) {
-            env.tabLevel++;
-        }
-
-        var tabRuleStr = env.compress ? '' : Array(env.tabLevel + 1).join("  "),
-            tabSetStr = env.compress ? '' : Array(env.tabLevel).join("  ");
-
-        for (i = 0; i < this.rules.length; i++) {
-            rule = this.rules[i];
-            if (rule.rules || (rule instanceof tree.Media) || rule instanceof tree.Directive || (this.root && rule instanceof tree.Comment)) {
-                rulesetNodes.push(rule);
-            } else {
-                ruleNodes.push(rule);
-            }
-        }
-
-        // If this is the root node, we don't render
-        // a selector, or {}.
-        if (!this.root) {
-            debugInfo = tree.debugInfo(env, this, tabSetStr);
-
-            if (debugInfo) {
-                output.add(debugInfo);
-                output.add(tabSetStr);
-            }
-
-            for(i = 0; i < this.paths.length; i++) {
-                path = this.paths[i];
-                env.firstSelector = true;
-                for(j = 0; j < path.length; j++) {
-                    path[j].genCSS(env, output);
-                    env.firstSelector = false;
-                }
-                if (i + 1 < this.paths.length) {
-                    output.add(env.compress ? ',' : (',\n' + tabSetStr));
-                }
-            }
-
-            output.add((env.compress ? '{' : ' {\n') + tabRuleStr);
-        }
-
-        // Compile rules and rulesets
-        for (i = 0; i < ruleNodes.length; i++) {
-            rule = ruleNodes[i];
-
-            // @page{ directive ends up with root elements inside it, a mix of rules and rulesets
-            // In this instance we do not know whether it is the last property
-            if (i + 1 === ruleNodes.length && (!this.root || rulesetNodes.length === 0 || this.firstRoot)) {
-                env.lastRule = true;
-            }
-
-            if (rule.genCSS) {
-                rule.genCSS(env, output);
-            } else if (rule.value) {
-                output.add(rule.value.toString());
-            }
-
-            if (!env.lastRule) {
-                output.add(env.compress ? '' : ('\n' + tabRuleStr));
-            } else {
-                env.lastRule = false;
-            }
-        }
-
-        if (!this.root) {
-            output.add((env.compress ? '}' : '\n' + tabSetStr + '}'));
-            env.tabLevel--;
-        }
-
-        for (i = 0; i < rulesetNodes.length; i++) {
-            if (ruleNodes.length && firstRuleset) {
-                output.add((env.compress ? "" : "\n") + (this.root ? tabRuleStr : tabSetStr));
-            }
-            if (!firstRuleset) {
-                output.add((env.compress ? "" : "\n") + (this.root ? tabRuleStr : tabSetStr));
-            }
-            firstRuleset = false;
-            rulesetNodes[i].genCSS(env, output);
-        }
-
-        if (!output.isEmpty() && !env.compress && this.firstRoot) {
-            output.add('\n');
-        }
-    },
-
-    toCSS: tree.toCSS,
-
-    markReferenced: function () {
-        for (var s = 0; s < this.selectors.length; s++) {
-            this.selectors[s].markReferenced();
-        }
-    },
-
-    joinSelectors: function (paths, context, selectors) {
-        for (var s = 0; s < selectors.length; s++) {
-            this.joinSelector(paths, context, selectors[s]);
-        }
-    },
-
-    joinSelector: function (paths, context, selector) {
-
-        var i, j, k, 
-            hasParentSelector, newSelectors, el, sel, parentSel, 
-            newSelectorPath, afterParentJoin, newJoinedSelector, 
-            newJoinedSelectorEmpty, lastSelector, currentElements,
-            selectorsMultiplied;
-    
-        for (i = 0; i < selector.elements.length; i++) {
-            el = selector.elements[i];
-            if (el.value === '&') {
-                hasParentSelector = true;
-            }
-        }
-    
-        if (!hasParentSelector) {
-            if (context.length > 0) {
-                for (i = 0; i < context.length; i++) {
-                    paths.push(context[i].concat(selector));
-                }
-            }
-            else {
-                paths.push([selector]);
-            }
-            return;
-        }
-
-        // The paths are [[Selector]]
-        // The first list is a list of comma seperated selectors
-        // The inner list is a list of inheritance seperated selectors
-        // e.g.
-        // .a, .b {
-        //   .c {
-        //   }
-        // }
-        // == [[.a] [.c]] [[.b] [.c]]
-        //
-
-        // the elements from the current selector so far
-        currentElements = [];
-        // the current list of new selectors to add to the path.
-        // We will build it up. We initiate it with one empty selector as we "multiply" the new selectors
-        // by the parents
-        newSelectors = [[]];
-
-        for (i = 0; i < selector.elements.length; i++) {
-            el = selector.elements[i];
-            // non parent reference elements just get added
-            if (el.value !== "&") {
-                currentElements.push(el);
-            } else {
-                // the new list of selectors to add
-                selectorsMultiplied = [];
-
-                // merge the current list of non parent selector elements
-                // on to the current list of selectors to add
-                if (currentElements.length > 0) {
-                    this.mergeElementsOnToSelectors(currentElements, newSelectors);
-                }
-
-                // loop through our current selectors
-                for (j = 0; j < newSelectors.length; j++) {
-                    sel = newSelectors[j];
-                    // if we don't have any parent paths, the & might be in a mixin so that it can be used
-                    // whether there are parents or not
-                    if (context.length === 0) {
-                        // the combinator used on el should now be applied to the next element instead so that
-                        // it is not lost
-                        if (sel.length > 0) {
-                            sel[0].elements = sel[0].elements.slice(0);
-                            sel[0].elements.push(new(tree.Element)(el.combinator, '', 0, el.index, el.currentFileInfo));
-                        }
-                        selectorsMultiplied.push(sel);
-                    }
-                    else {
-                        // and the parent selectors
-                        for (k = 0; k < context.length; k++) {
-                            parentSel = context[k];
-                            // We need to put the current selectors
-                            // then join the last selector's elements on to the parents selectors
-
-                            // our new selector path
-                            newSelectorPath = [];
-                            // selectors from the parent after the join
-                            afterParentJoin = [];
-                            newJoinedSelectorEmpty = true;
-
-                            //construct the joined selector - if & is the first thing this will be empty,
-                            // if not newJoinedSelector will be the last set of elements in the selector
-                            if (sel.length > 0) {
-                                newSelectorPath = sel.slice(0);
-                                lastSelector = newSelectorPath.pop();
-                                newJoinedSelector = selector.createDerived(lastSelector.elements.slice(0));
-                                newJoinedSelectorEmpty = false;
-                            }
-                            else {
-                                newJoinedSelector = selector.createDerived([]);
-                            }
-
-                            //put together the parent selectors after the join
-                            if (parentSel.length > 1) {
-                                afterParentJoin = afterParentJoin.concat(parentSel.slice(1));
-                            }
-
-                            if (parentSel.length > 0) {
-                                newJoinedSelectorEmpty = false;
-
-                                // join the elements so far with the first part of the parent
-                                newJoinedSelector.elements.push(new(tree.Element)(el.combinator, parentSel[0].elements[0].value, el.index, el.currentFileInfo));
-                                newJoinedSelector.elements = newJoinedSelector.elements.concat(parentSel[0].elements.slice(1));
-                            }
-
-                            if (!newJoinedSelectorEmpty) {
-                                // now add the joined selector
-                                newSelectorPath.push(newJoinedSelector);
-                            }
-
-                            // and the rest of the parent
-                            newSelectorPath = newSelectorPath.concat(afterParentJoin);
-
-                            // add that to our new set of selectors
-                            selectorsMultiplied.push(newSelectorPath);
-                        }
-                    }
-                }
-
-                // our new selectors has been multiplied, so reset the state
-                newSelectors = selectorsMultiplied;
-                currentElements = [];
-            }
-        }
-
-        // if we have any elements left over (e.g. .a& .b == .b)
-        // add them on to all the current selectors
-        if (currentElements.length > 0) {
-            this.mergeElementsOnToSelectors(currentElements, newSelectors);
-        }
-
-        for (i = 0; i < newSelectors.length; i++) {
-            if (newSelectors[i].length > 0) {
-                paths.push(newSelectors[i]);
-            }
-        }
-    },
-    
-    mergeElementsOnToSelectors: function(elements, selectors) {
-        var i, sel;
-
-        if (selectors.length === 0) {
-            selectors.push([ new(tree.Selector)(elements) ]);
-            return;
-        }
-
-        for (i = 0; i < selectors.length; i++) {
-            sel = selectors[i];
-
-            // if the previous thing in sel is a parent this needs to join on to it
-            if (sel.length > 0) {
-                sel[sel.length - 1] = sel[sel.length - 1].createDerived(sel[sel.length - 1].elements.concat(elements));
-            }
-            else {
-                sel.push(new(tree.Selector)(elements));
-            }
-        }
-    }
-};
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Selector = function (elements, extendList, condition, index, currentFileInfo, isReferenced) {
-    this.elements = elements;
-    this.extendList = extendList || [];
-    this.condition = condition;
-    this.currentFileInfo = currentFileInfo || {};
-    this.isReferenced = isReferenced;
-    if (!condition) {
-        this.evaldCondition = true;
-    }
-};
-tree.Selector.prototype = {
-    type: "Selector",
-    accept: function (visitor) {
-        this.elements = visitor.visit(this.elements);
-        this.extendList = visitor.visit(this.extendList);
-        this.condition = visitor.visit(this.condition);
-    },
-    createDerived: function(elements, extendList, evaldCondition) {
-        /*jshint eqnull:true */
-        evaldCondition = evaldCondition != null ? evaldCondition : this.evaldCondition;
-        var newSelector = new(tree.Selector)(elements, extendList || this.extendList, this.condition, this.index, this.currentFileInfo, this.isReferenced);
-        newSelector.evaldCondition = evaldCondition;
-        return newSelector;
-    },
-    match: function (other) {
-        var elements = this.elements,
-            len = elements.length,
-            oelements, olen, max, i;
-
-        oelements = other.elements.slice(
-            (other.elements.length && other.elements[0].value === "&") ? 1 : 0);
-        olen = oelements.length;
-        max = Math.min(len, olen);
-
-        if (olen === 0 || len < olen) {
-            return 0;
-        } else {
-            for (i = 0; i < max; i++) {
-                if (elements[i].value !== oelements[i].value) {
-                    return 0;
-                }
-            }
-        }
-        return max; // return number of matched selectors 
-    },
-    eval: function (env) {
-        var evaldCondition = this.condition && this.condition.eval(env);
-
-        return this.createDerived(this.elements.map(function (e) {
-            return e.eval(env);
-        }), this.extendList.map(function(extend) {
-            return extend.eval(env);
-        }), evaldCondition);
-    },
-    genCSS: function (env, output) {
-        var i, element;
-        if ((!env || !env.firstSelector) && this.elements[0].combinator.value === "") {
-            output.add(' ', this.currentFileInfo, this.index);
-        }
-        if (!this._css) {
-            //TODO caching? speed comparison?
-            for(i = 0; i < this.elements.length; i++) {
-                element = this.elements[i];
-                element.genCSS(env, output);
-            }
-        }
-    },
-    toCSS: tree.toCSS,
-    markReferenced: function () {
-        this.isReferenced = true;
-    },
-    getIsReferenced: function() {
-        return !this.currentFileInfo.reference || this.isReferenced;
-    },
-    getIsOutput: function() {
-        return this.evaldCondition;
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.UnicodeDescriptor = function (value) {
-    this.value = value;
-};
-tree.UnicodeDescriptor.prototype = {
-    type: "UnicodeDescriptor",
-    genCSS: function (env, output) {
-        output.add(this.value);
-    },
-    toCSS: tree.toCSS,
-    eval: function () { return this; }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.URL = function (val, currentFileInfo) {
-    this.value = val;
-    this.currentFileInfo = currentFileInfo;
-};
-tree.URL.prototype = {
-    type: "Url",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    genCSS: function (env, output) {
-        output.add("url(");
-        this.value.genCSS(env, output);
-        output.add(")");
-    },
-    toCSS: tree.toCSS,
-    eval: function (ctx) {
-        var val = this.value.eval(ctx), rootpath;
-
-        // Add the base path if the URL is relative
-        rootpath = this.currentFileInfo && this.currentFileInfo.rootpath;
-        if (rootpath && typeof val.value === "string" && ctx.isPathRelative(val.value)) {
-            if (!val.quote) {
-                rootpath = rootpath.replace(/[\(\)'"\s]/g, function(match) { return "\\"+match; });
-            }
-            val.value = rootpath + val.value;
-        }
-
-        val.value = ctx.normalizePath(val.value);
-
-        return new(tree.URL)(val, null);
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Value = function (value) {
-    this.value = value;
-};
-tree.Value.prototype = {
-    type: "Value",
-    accept: function (visitor) {
-        this.value = visitor.visit(this.value);
-    },
-    eval: function (env) {
-        if (this.value.length === 1) {
-            return this.value[0].eval(env);
-        } else {
-            return new(tree.Value)(this.value.map(function (v) {
-                return v.eval(env);
-            }));
-        }
-    },
-    genCSS: function (env, output) {
-        var i;
-        for(i = 0; i < this.value.length; i++) {
-            this.value[i].genCSS(env, output);
-            if (i+1 < this.value.length) {
-                output.add((env && env.compress) ? ',' : ', ');
-            }
-        }
-    },
-    toCSS: tree.toCSS
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-tree.Variable = function (name, index, currentFileInfo) {
-    this.name = name;
-    this.index = index;
-    this.currentFileInfo = currentFileInfo;
-};
-tree.Variable.prototype = {
-    type: "Variable",
-    eval: function (env) {
-        var variable, v, name = this.name;
-
-        if (name.indexOf('@@') === 0) {
-            name = '@' + new(tree.Variable)(name.slice(1)).eval(env).value;
-        }
-        
-        if (this.evaluating) {
-            throw { type: 'Name',
-                    message: "Recursive variable definition for " + name,
-                    filename: this.currentFileInfo.file,
-                    index: this.index };
-        }
-        
-        this.evaluating = true;
-
-        if (variable = tree.find(env.frames, function (frame) {
-            if (v = frame.variable(name)) {
-                return v.value.eval(env);
-            }
-        })) { 
-            this.evaluating = false;
-            return variable;
-        }
-        else {
-            throw { type: 'Name',
-                    message: "variable " + name + " is undefined",
-                    filename: this.currentFileInfo.filename,
-                    index: this.index };
-        }
-    }
-};
-
-})(require('../tree'));
-
-(function (tree) {
-
-    var parseCopyProperties = [
-        'paths',            // option - unmodified - paths to search for imports on
-        'optimization',     // option - optimization level (for the chunker)
-        'files',            // list of files that have been imported, used for import-once
-        'contents',         // browser-only, contents of all the files
-        'relativeUrls',     // option - whether to adjust URL's to be relative
-        'rootpath',         // option - rootpath to append to URL's
-        'strictImports',    // option -
-        'insecure',         // option - whether to allow imports from insecure ssl hosts
-        'dumpLineNumbers',  // option - whether to dump line numbers
-        'compress',         // option - whether to compress
-        'processImports',   // option - whether to process imports. if false then imports will not be imported
-        'syncImport',       // option - whether to import synchronously
-        'javascriptEnabled',// option - whether JavaScript is enabled. if undefined, defaults to true
-        'mime',             // browser only - mime type for sheet import
-        'useFileCache',     // browser only - whether to use the per file session cache
-        'currentFileInfo'   // information about the current file - for error reporting and importing and making urls relative etc.
-    ];
-
-    //currentFileInfo = {
-    //  'relativeUrls' - option - whether to adjust URL's to be relative
-    //  'filename' - full resolved filename of current file
-    //  'rootpath' - path to append to normal URLs for this node
-    //  'currentDirectory' - path to the current file, absolute
-    //  'rootFilename' - filename of the base file
-    //  'entryPath' - absolute path to the entry file
-    //  'reference' - whether the file should not be output and only output parts that are referenced
-
-    tree.parseEnv = function(options) {
-        copyFromOriginal(options, this, parseCopyProperties);
-
-        if (!this.contents) { this.contents = {}; }
-        if (!this.files) { this.files = {}; }
-
-        if (!this.currentFileInfo) {
-            var filename = (options && options.filename) || "input";
-            var entryPath = filename.replace(/[^\/\\]*$/, "");
-            if (options) {
-                options.filename = null;
-            }
-            this.currentFileInfo = {
-                filename: filename,
-                relativeUrls: this.relativeUrls,
-                rootpath: (options && options.rootpath) || "",
-                currentDirectory: entryPath,
-                entryPath: entryPath,
-                rootFilename: filename
-            };
-        }
-    };
-
-    var evalCopyProperties = [
-        'silent',      // whether to swallow errors and warnings
-        'verbose',     // whether to log more activity
-        'compress',    // whether to compress
-        'yuicompress', // whether to compress with the outside tool yui compressor
-        'ieCompat',    // whether to enforce IE compatibility (IE8 data-uri)
-        'strictMath',  // whether math has to be within parenthesis
-        'strictUnits', // whether units need to evaluate correctly
-        'cleancss',    // whether to compress with clean-css
-        'sourceMap',   // whether to output a source map
-        'importMultiple'// whether we are currently importing multiple copies
-        ];
-
-    tree.evalEnv = function(options, frames) {
-        copyFromOriginal(options, this, evalCopyProperties);
-
-        this.frames = frames || [];
-    };
-
-    tree.evalEnv.prototype.inParenthesis = function () {
-        if (!this.parensStack) {
-            this.parensStack = [];
-        }
-        this.parensStack.push(true);
-    };
-
-    tree.evalEnv.prototype.outOfParenthesis = function () {
-        this.parensStack.pop();
-    };
-
-    tree.evalEnv.prototype.isMathOn = function () {
-        return this.strictMath ? (this.parensStack && this.parensStack.length) : true;
-    };
-
-    tree.evalEnv.prototype.isPathRelative = function (path) {
-        return !/^(?:[a-z-]+:|\/)/.test(path);
-    };
-
-    tree.evalEnv.prototype.normalizePath = function( path ) {
-        var
-          segments = path.split("/").reverse(),
-          segment;
-
-        path = [];
-        while (segments.length !== 0 ) {
-            segment = segments.pop();
-            switch( segment ) {
-                case ".":
-                    break;
-                case "..":
-                    if ((path.length === 0) || (path[path.length - 1] === "..")) {
-                        path.push( segment );
-                    } else {
-                        path.pop();
-                    }
-                    break;
-                default:
-                    path.push( segment );
-                    break;
-            }
-        }
-
-        return path.join("/");
-    };
-
-    //todo - do the same for the toCSS env
-    //tree.toCSSEnv = function (options) {
-    //};
-
-    var copyFromOriginal = function(original, destination, propertiesToCopy) {
-        if (!original) { return; }
-
-        for(var i = 0; i < propertiesToCopy.length; i++) {
-            if (original.hasOwnProperty(propertiesToCopy[i])) {
-                destination[propertiesToCopy[i]] = original[propertiesToCopy[i]];
-            }
-        }
-    };
-
-})(require('./tree'));
-
-(function (tree) {
-
-    tree.visitor = function(implementation) {
-        this._implementation = implementation;
-    };
-
-    tree.visitor.prototype = {
-        visit: function(node) {
-
-            if (node instanceof Array) {
-                return this.visitArray(node);
-            }
-
-            if (!node || !node.type) {
-                return node;
-            }
-
-            var funcName = "visit" + node.type,
-                func = this._implementation[funcName],
-                visitArgs, newNode;
-            if (func) {
-                visitArgs = {visitDeeper: true};
-                newNode = func.call(this._implementation, node, visitArgs);
-                if (this._implementation.isReplacing) {
-                    node = newNode;
-                }
-            }
-            if ((!visitArgs || visitArgs.visitDeeper) && node && node.accept) {
-                node.accept(this);
-            }
-            funcName = funcName + "Out";
-            if (this._implementation[funcName]) {
-                this._implementation[funcName](node);
-            }
-            return node;
-        },
-        visitArray: function(nodes) {
-            var i, newNodes = [];
-            for(i = 0; i < nodes.length; i++) {
-                var evald = this.visit(nodes[i]);
-                if (evald instanceof Array) {
-                    evald = this.flatten(evald);
-                    newNodes = newNodes.concat(evald);
-                } else {
-                    newNodes.push(evald);
-                }
-            }
-            if (this._implementation.isReplacing) {
-                return newNodes;
-            }
-            return nodes;
-        },
-        doAccept: function (node) {
-            node.accept(this);
-        },
-        flatten: function(arr, master) {
-            return arr.reduce(this.flattenReduce.bind(this), master || []);
-        },
-        flattenReduce: function(sum, element) {
-            if (element instanceof Array) {
-                sum = this.flatten(element, sum);
-            } else {
-                sum.push(element);
-            }
-            return sum;
-        }
-    };
-
-})(require('./tree'));
-(function (tree) {
-    tree.importVisitor = function(importer, finish, evalEnv) {
-        this._visitor = new tree.visitor(this);
-        this._importer = importer;
-        this._finish = finish;
-        this.env = evalEnv || new tree.evalEnv();
-        this.importCount = 0;
-    };
-
-    tree.importVisitor.prototype = {
-        isReplacing: true,
-        run: function (root) {
-            var error;
-            try {
-                // process the contents
-                this._visitor.visit(root);
-            }
-            catch(e) {
-                error = e;
-            }
-
-            this.isFinished = true;
-
-            if (this.importCount === 0) {
-                this._finish(error);
-            }
-        },
-        visitImport: function (importNode, visitArgs) {
-            var importVisitor = this,
-                evaldImportNode,
-                inlineCSS = importNode.options.inline;
-
-            if (!importNode.css || inlineCSS) {
-
-                try {
-                    evaldImportNode = importNode.evalForImport(this.env);
-                } catch(e){
-                    if (!e.filename) { e.index = importNode.index; e.filename = importNode.currentFileInfo.filename; }
-                    // attempt to eval properly and treat as css
-                    importNode.css = true;
-                    // if that fails, this error will be thrown
-                    importNode.error = e;
-                }
-
-                if (evaldImportNode && (!evaldImportNode.css || inlineCSS)) {
-                    importNode = evaldImportNode;
-                    this.importCount++;
-                    var env = new tree.evalEnv(this.env, this.env.frames.slice(0));
-
-                    if (importNode.options.multiple) {
-                        env.importMultiple = true;
-                    }
-
-                    this._importer.push(importNode.getPath(), importNode.currentFileInfo, importNode.options, function (e, root, imported, fullPath) {
-                        if (e && !e.filename) { e.index = importNode.index; e.filename = importNode.currentFileInfo.filename; }
-
-                        if (imported && !env.importMultiple) { importNode.skip = imported; }
-
-                        var subFinish = function(e) {
-                            importVisitor.importCount--;
-
-                            if (importVisitor.importCount === 0 && importVisitor.isFinished) {
-                                importVisitor._finish(e);
-                            }
-                        };
-
-                        if (root) {
-                            importNode.root = root;
-                            importNode.importedFilename = fullPath;
-                            if (!inlineCSS && !importNode.skip) {
-                                new(tree.importVisitor)(importVisitor._importer, subFinish, env)
-                                    .run(root);
-                                return;
-                            }
-                        }
-
-                        subFinish();
-                    });
-                }
-            }
-            visitArgs.visitDeeper = false;
-            return importNode;
-        },
-        visitRule: function (ruleNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-            return ruleNode;
-        },
-        visitDirective: function (directiveNode, visitArgs) {
-            this.env.frames.unshift(directiveNode);
-            return directiveNode;
-        },
-        visitDirectiveOut: function (directiveNode) {
-            this.env.frames.shift();
-        },
-        visitMixinDefinition: function (mixinDefinitionNode, visitArgs) {
-            this.env.frames.unshift(mixinDefinitionNode);
-            return mixinDefinitionNode;
-        },
-        visitMixinDefinitionOut: function (mixinDefinitionNode) {
-            this.env.frames.shift();
-        },
-        visitRuleset: function (rulesetNode, visitArgs) {
-            this.env.frames.unshift(rulesetNode);
-            return rulesetNode;
-        },
-        visitRulesetOut: function (rulesetNode) {
-            this.env.frames.shift();
-        },
-        visitMedia: function (mediaNode, visitArgs) {
-            this.env.frames.unshift(mediaNode.ruleset);
-            return mediaNode;
-        },
-        visitMediaOut: function (mediaNode) {
-            this.env.frames.shift();
-        }
-    };
-
-})(require('./tree'));
-(function (tree) {
-    tree.joinSelectorVisitor = function() {
-        this.contexts = [[]];
-        this._visitor = new tree.visitor(this);
-    };
-
-    tree.joinSelectorVisitor.prototype = {
-        run: function (root) {
-            return this._visitor.visit(root);
-        },
-        visitRule: function (ruleNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-        },
-        visitMixinDefinition: function (mixinDefinitionNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-        },
-
-        visitRuleset: function (rulesetNode, visitArgs) {
-            var context = this.contexts[this.contexts.length - 1];
-            var paths = [];
-            this.contexts.push(paths);
-
-            if (! rulesetNode.root) {
-                rulesetNode.selectors = rulesetNode.selectors.filter(function(selector) { return selector.getIsOutput(); });
-                if (rulesetNode.selectors.length === 0) {
-                    rulesetNode.rules.length = 0;
-                }
-                rulesetNode.joinSelectors(paths, context, rulesetNode.selectors);
-                rulesetNode.paths = paths;
-            }
-        },
-        visitRulesetOut: function (rulesetNode) {
-            this.contexts.length = this.contexts.length - 1;
-        },
-        visitMedia: function (mediaNode, visitArgs) {
-            var context = this.contexts[this.contexts.length - 1];
-            mediaNode.rules[0].root = (context.length === 0 || context[0].multiMedia);
-        }
-    };
-
-})(require('./tree'));
-(function (tree) {
-    tree.toCSSVisitor = function(env) {
-        this._visitor = new tree.visitor(this);
-        this._env = env;
-    };
-
-    tree.toCSSVisitor.prototype = {
-        isReplacing: true,
-        run: function (root) {
-            return this._visitor.visit(root);
-        },
-
-        visitRule: function (ruleNode, visitArgs) {
-            if (ruleNode.variable) {
-                return [];
-            }
-            return ruleNode;
-        },
-
-        visitMixinDefinition: function (mixinNode, visitArgs) {
-            return [];
-        },
-
-        visitExtend: function (extendNode, visitArgs) {
-            return [];
-        },
-
-        visitComment: function (commentNode, visitArgs) {
-            if (commentNode.isSilent(this._env)) {
-                return [];
-            }
-            return commentNode;
-        },
-
-        visitMedia: function(mediaNode, visitArgs) {
-            mediaNode.accept(this._visitor);
-            visitArgs.visitDeeper = false;
-
-            if (!mediaNode.rules.length) {
-                return [];
-            }
-            return mediaNode;
-        },
-
-        visitDirective: function(directiveNode, visitArgs) {
-            if (directiveNode.currentFileInfo.reference && !directiveNode.isReferenced) {
-                return [];
-            }
-            if (directiveNode.name === "@charset") {
-                // Only output the debug info together with subsequent @charset definitions
-                // a comment (or @media statement) before the actual @charset directive would
-                // be considered illegal css as it has to be on the first line
-                if (this.charset) {
-                    if (directiveNode.debugInfo) {
-                        var comment = new tree.Comment("/* " + directiveNode.toCSS(this._env).replace(/\n/g, "")+" */\n");
-                        comment.debugInfo = directiveNode.debugInfo;
-                        return this._visitor.visit(comment);
-                    }
-                    return [];
-                }
-                this.charset = true;
-            }
-            return directiveNode;
-        },
-
-        checkPropertiesInRoot: function(rules) {
-            var ruleNode;
-            for(var i = 0; i < rules.length; i++) {
-                ruleNode = rules[i];
-                if (ruleNode instanceof tree.Rule && !ruleNode.variable) {
-                    throw { message: "properties must be inside selector blocks, they cannot be in the root.",
-                        index: ruleNode.index, filename: ruleNode.currentFileInfo ? ruleNode.currentFileInfo.filename : null};
-                }
-            }
-        },
-
-        visitRuleset: function (rulesetNode, visitArgs) {
-            var rule, rulesets = [];
-            if (rulesetNode.firstRoot) {
-                this.checkPropertiesInRoot(rulesetNode.rules);
-            }
-            if (! rulesetNode.root) {
-
-                rulesetNode.paths = rulesetNode.paths
-                    .filter(function(p) {
-                        var i;
-                        if (p[0].elements[0].combinator.value === ' ') {
-                            p[0].elements[0].combinator = new(tree.Combinator)('');
-                        }
-                        for(i = 0; i < p.length; i++) {
-                            if (p[i].getIsReferenced() && p[i].getIsOutput()) {
-                                return true;
-                            }
-                            return false;
-                        }
-                    });
-
-                // Compile rules and rulesets
-                for (var i = 0; i < rulesetNode.rules.length; i++) {
-                    rule = rulesetNode.rules[i];
-
-                    if (rule.rules) {
-                        // visit because we are moving them out from being a child
-                        rulesets.push(this._visitor.visit(rule));
-                        rulesetNode.rules.splice(i, 1);
-                        i--;
-                        continue;
-                    }
-                }
-                // accept the visitor to remove rules and refactor itself
-                // then we can decide now whether we want it or not
-                if (rulesetNode.rules.length > 0) {
-                    rulesetNode.accept(this._visitor);
-                }
-                visitArgs.visitDeeper = false;
-
-                this._mergeRules(rulesetNode.rules);
-                this._removeDuplicateRules(rulesetNode.rules);
-
-                // now decide whether we keep the ruleset
-                if (rulesetNode.rules.length > 0 && rulesetNode.paths.length > 0) {
-                    rulesets.splice(0, 0, rulesetNode);
-                }
-            } else {
-                rulesetNode.accept(this._visitor);
-                visitArgs.visitDeeper = false;
-                if (rulesetNode.firstRoot || rulesetNode.rules.length > 0) {
-                    rulesets.splice(0, 0, rulesetNode);
-                }
-            }
-            if (rulesets.length === 1) {
-                return rulesets[0];
-            }
-            return rulesets;
-        },
-
-        _removeDuplicateRules: function(rules) {
-            // remove duplicates
-            var ruleCache = {},
-                ruleList, rule, i;
-            for(i = rules.length - 1; i >= 0 ; i--) {
-                rule = rules[i];
-                if (rule instanceof tree.Rule) {
-                    if (!ruleCache[rule.name]) {
-                        ruleCache[rule.name] = rule;
-                    } else {
-                        ruleList = ruleCache[rule.name];
-                        if (ruleList instanceof tree.Rule) {
-                            ruleList = ruleCache[rule.name] = [ruleCache[rule.name].toCSS(this._env)];
-                        }
-                        var ruleCSS = rule.toCSS(this._env);
-                        if (ruleList.indexOf(ruleCSS) !== -1) {
-                            rules.splice(i, 1);
-                        } else {
-                            ruleList.push(ruleCSS);
-                        }
-                    }
-                }
-            }
-        },
-
-        _mergeRules: function (rules) {
-            var groups = {},
-                parts,
-                rule,
-                key;
-
-            for (var i = 0; i < rules.length; i++) {
-                rule = rules[i];
-
-                if ((rule instanceof tree.Rule) && rule.merge) {
-                    key = [rule.name,
-                        rule.important ? "!" : ""].join(",");
-
-                    if (!groups[key]) {
-                        parts = groups[key] = [];
-                    } else {
-                        rules.splice(i--, 1);
-                    }
-
-                    parts.push(rule);
-                }
-            }
-
-            Object.keys(groups).map(function (k) {
-                parts = groups[k];
-
-                if (parts.length > 1) {
-                    rule = parts[0];
-
-                    rule.value = new (tree.Value)(parts.map(function (p) {
-                        return p.value;
-                    }));
-                }
-            });
-        }
-    };
-
-})(require('./tree'));
-(function (tree) {
-    /*jshint loopfunc:true */
-
-    tree.extendFinderVisitor = function() {
-        this._visitor = new tree.visitor(this);
-        this.contexts = [];
-        this.allExtendsStack = [[]];
-    };
-
-    tree.extendFinderVisitor.prototype = {
-        run: function (root) {
-            root = this._visitor.visit(root);
-            root.allExtends = this.allExtendsStack[0];
-            return root;
-        },
-        visitRule: function (ruleNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-        },
-        visitMixinDefinition: function (mixinDefinitionNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-        },
-        visitRuleset: function (rulesetNode, visitArgs) {
-
-            if (rulesetNode.root) {
-                return;
-            }
-
-            var i, j, extend, allSelectorsExtendList = [], extendList;
-
-            // get &:extend(.a); rules which apply to all selectors in this ruleset
-            for(i = 0; i < rulesetNode.rules.length; i++) {
-                if (rulesetNode.rules[i] instanceof tree.Extend) {
-                    allSelectorsExtendList.push(rulesetNode.rules[i]);
-                    rulesetNode.extendOnEveryPath = true;
-                }
-            }
-
-            // now find every selector and apply the extends that apply to all extends
-            // and the ones which apply to an individual extend
-            for(i = 0; i < rulesetNode.paths.length; i++) {
-                var selectorPath = rulesetNode.paths[i],
-                    selector = selectorPath[selectorPath.length-1];
-                extendList = selector.extendList.slice(0).concat(allSelectorsExtendList).map(function(allSelectorsExtend) {
-                    return allSelectorsExtend.clone();
-                });
-                for(j = 0; j < extendList.length; j++) {
-                    this.foundExtends = true;
-                    extend = extendList[j];
-                    extend.findSelfSelectors(selectorPath);
-                    extend.ruleset = rulesetNode;
-                    if (j === 0) { extend.firstExtendOnThisSelectorPath = true; }
-                    this.allExtendsStack[this.allExtendsStack.length-1].push(extend);
-                }
-            }
-
-            this.contexts.push(rulesetNode.selectors);
-        },
-        visitRulesetOut: function (rulesetNode) {
-            if (!rulesetNode.root) {
-                this.contexts.length = this.contexts.length - 1;
-            }
-        },
-        visitMedia: function (mediaNode, visitArgs) {
-            mediaNode.allExtends = [];
-            this.allExtendsStack.push(mediaNode.allExtends);
-        },
-        visitMediaOut: function (mediaNode) {
-            this.allExtendsStack.length = this.allExtendsStack.length - 1;
-        },
-        visitDirective: function (directiveNode, visitArgs) {
-            directiveNode.allExtends = [];
-            this.allExtendsStack.push(directiveNode.allExtends);
-        },
-        visitDirectiveOut: function (directiveNode) {
-            this.allExtendsStack.length = this.allExtendsStack.length - 1;
-        }
-    };
-
-    tree.processExtendsVisitor = function() {
-        this._visitor = new tree.visitor(this);
-    };
-
-    tree.processExtendsVisitor.prototype = {
-        run: function(root) {
-            var extendFinder = new tree.extendFinderVisitor();
-            extendFinder.run(root);
-            if (!extendFinder.foundExtends) { return root; }
-            root.allExtends = root.allExtends.concat(this.doExtendChaining(root.allExtends, root.allExtends));
-            this.allExtendsStack = [root.allExtends];
-            return this._visitor.visit(root);
-        },
-        doExtendChaining: function (extendsList, extendsListTarget, iterationCount) {
-            //
-            // chaining is different from normal extension.. if we extend an extend then we are not just copying, altering and pasting
-            // the selector we would do normally, but we are also adding an extend with the same target selector
-            // this means this new extend can then go and alter other extends
-            //
-            // this method deals with all the chaining work - without it, extend is flat and doesn't work on other extend selectors
-            // this is also the most expensive.. and a match on one selector can cause an extension of a selector we had already processed if
-            // we look at each selector at a time, as is done in visitRuleset
-
-            var extendIndex, targetExtendIndex, matches, extendsToAdd = [], newSelector, extendVisitor = this, selectorPath, extend, targetExtend, newExtend;
-
-            iterationCount = iterationCount || 0;
-
-            //loop through comparing every extend with every target extend.
-            // a target extend is the one on the ruleset we are looking at copy/edit/pasting in place
-            // e.g.  .a:extend(.b) {}  and .b:extend(.c) {} then the first extend extends the second one
-            // and the second is the target.
-            // the seperation into two lists allows us to process a subset of chains with a bigger set, as is the
-            // case when processing media queries
-            for(extendIndex = 0; extendIndex < extendsList.length; extendIndex++){
-                for(targetExtendIndex = 0; targetExtendIndex < extendsListTarget.length; targetExtendIndex++){
-
-                    extend = extendsList[extendIndex];
-                    targetExtend = extendsListTarget[targetExtendIndex];
-
-                    // look for circular references
-                    if (this.inInheritanceChain(targetExtend, extend)) { continue; }
-
-                    // find a match in the target extends self selector (the bit before :extend)
-                    selectorPath = [targetExtend.selfSelectors[0]];
-                    matches = extendVisitor.findMatch(extend, selectorPath);
-
-                    if (matches.length) {
-
-                        // we found a match, so for each self selector..
-                        extend.selfSelectors.forEach(function(selfSelector) {
-
-                            // process the extend as usual
-                            newSelector = extendVisitor.extendSelector(matches, selectorPath, selfSelector);
-
-                            // but now we create a new extend from it
-                            newExtend = new(tree.Extend)(targetExtend.selector, targetExtend.option, 0);
-                            newExtend.selfSelectors = newSelector;
-
-                            // add the extend onto the list of extends for that selector
-                            newSelector[newSelector.length-1].extendList = [newExtend];
-
-                            // record that we need to add it.
-                            extendsToAdd.push(newExtend);
-                            newExtend.ruleset = targetExtend.ruleset;
-
-                            //remember its parents for circular references
-                            newExtend.parents = [targetExtend, extend];
-
-                            // only process the selector once.. if we have :extend(.a,.b) then multiple
-                            // extends will look at the same selector path, so when extending
-                            // we know that any others will be duplicates in terms of what is added to the css
-                            if (targetExtend.firstExtendOnThisSelectorPath) {
-                                newExtend.firstExtendOnThisSelectorPath = true;
-                                targetExtend.ruleset.paths.push(newSelector);
-                            }
-                        });
-                    }
-                }
-            }
-
-            if (extendsToAdd.length) {
-                // try to detect circular references to stop a stack overflow.
-                // may no longer be needed.
-                this.extendChainCount++;
-                if (iterationCount > 100) {
-                    var selectorOne = "{unable to calculate}";
-                    var selectorTwo = "{unable to calculate}";
-                    try
-                    {
-                        selectorOne = extendsToAdd[0].selfSelectors[0].toCSS();
-                        selectorTwo = extendsToAdd[0].selector.toCSS();
-                    }
-                    catch(e) {}
-                    throw {message: "extend circular reference detected. One of the circular extends is currently:"+selectorOne+":extend(" + selectorTwo+")"};
-                }
-
-                // now process the new extends on the existing rules so that we can handle a extending b extending c ectending d extending e...
-                return extendsToAdd.concat(extendVisitor.doExtendChaining(extendsToAdd, extendsListTarget, iterationCount+1));
-            } else {
-                return extendsToAdd;
-            }
-        },
-        inInheritanceChain: function (possibleParent, possibleChild) {
-            if (possibleParent === possibleChild) {
-                return true;
-            }
-            if (possibleChild.parents) {
-                if (this.inInheritanceChain(possibleParent, possibleChild.parents[0])) {
-                    return true;
-                }
-                if (this.inInheritanceChain(possibleParent, possibleChild.parents[1])) {
-                    return true;
-                }
-            }
-            return false;
-        },
-        visitRule: function (ruleNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-        },
-        visitMixinDefinition: function (mixinDefinitionNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-        },
-        visitSelector: function (selectorNode, visitArgs) {
-            visitArgs.visitDeeper = false;
-        },
-        visitRuleset: function (rulesetNode, visitArgs) {
-            if (rulesetNode.root) {
-                return;
-            }
-            var matches, pathIndex, extendIndex, allExtends = this.allExtendsStack[this.allExtendsStack.length-1], selectorsToAdd = [], extendVisitor = this, selectorPath;
-
-            // look at each selector path in the ruleset, find any extend matches and then copy, find and replace
-
-            for(extendIndex = 0; extendIndex < allExtends.length; extendIndex++) {
-                for(pathIndex = 0; pathIndex < rulesetNode.paths.length; pathIndex++) {
-
-                    selectorPath = rulesetNode.paths[pathIndex];
-
-                    // extending extends happens initially, before the main pass
-                    if (rulesetNode.extendOnEveryPath || selectorPath[selectorPath.length-1].extendList.length) { continue; }
-
-                    matches = this.findMatch(allExtends[extendIndex], selectorPath);
-
-                    if (matches.length) {
-
-                        allExtends[extendIndex].selfSelectors.forEach(function(selfSelector) {
-                            selectorsToAdd.push(extendVisitor.extendSelector(matches, selectorPath, selfSelector));
-                        });
-                    }
-                }
-            }
-            rulesetNode.paths = rulesetNode.paths.concat(selectorsToAdd);
-        },
-        findMatch: function (extend, haystackSelectorPath) {
-            //
-            // look through the haystack selector path to try and find the needle - extend.selector
-            // returns an array of selector matches that can then be replaced
-            //
-            var haystackSelectorIndex, hackstackSelector, hackstackElementIndex, haystackElement,
-                targetCombinator, i,
-                extendVisitor = this,
-                needleElements = extend.selector.elements,
-                potentialMatches = [], potentialMatch, matches = [];
-
-            // loop through the haystack elements
-            for(haystackSelectorIndex = 0; haystackSelectorIndex < haystackSelectorPath.length; haystackSelectorIndex++) {
-                hackstackSelector = haystackSelectorPath[haystackSelectorIndex];
-
-                for(hackstackElementIndex = 0; hackstackElementIndex < hackstackSelector.elements.length; hackstackElementIndex++) {
-
-                    haystackElement = hackstackSelector.elements[hackstackElementIndex];
-
-                    // if we allow elements before our match we can add a potential match every time. otherwise only at the first element.
-                    if (extend.allowBefore || (haystackSelectorIndex === 0 && hackstackElementIndex === 0)) {
-                        potentialMatches.push({pathIndex: haystackSelectorIndex, index: hackstackElementIndex, matched: 0, initialCombinator: haystackElement.combinator});
-                    }
-
-                    for(i = 0; i < potentialMatches.length; i++) {
-                        potentialMatch = potentialMatches[i];
-
-                        // selectors add " " onto the first element. When we use & it joins the selectors together, but if we don't
-                        // then each selector in haystackSelectorPath has a space before it added in the toCSS phase. so we need to work out
-                        // what the resulting combinator will be
-                        targetCombinator = haystackElement.combinator.value;
-                        if (targetCombinator === '' && hackstackElementIndex === 0) {
-                            targetCombinator = ' ';
-                        }
-
-                        // if we don't match, null our match to indicate failure
-                        if (!extendVisitor.isElementValuesEqual(needleElements[potentialMatch.matched].value, haystackElement.value) ||
-                            (potentialMatch.matched > 0 && needleElements[potentialMatch.matched].combinator.value !== targetCombinator)) {
-                            potentialMatch = null;
-                        } else {
-                            potentialMatch.matched++;
-                        }
-
-                        // if we are still valid and have finished, test whether we have elements after and whether these are allowed
-                        if (potentialMatch) {
-                            potentialMatch.finished = potentialMatch.matched === needleElements.length;
-                            if (potentialMatch.finished &&
-                                (!extend.allowAfter && (hackstackElementIndex+1 < hackstackSelector.elements.length || haystackSelectorIndex+1 < haystackSelectorPath.length))) {
-                                potentialMatch = null;
-                            }
-                        }
-                        // if null we remove, if not, we are still valid, so either push as a valid match or continue
-                        if (potentialMatch) {
-                            if (potentialMatch.finished) {
-                                potentialMatch.length = needleElements.length;
-                                potentialMatch.endPathIndex = haystackSelectorIndex;
-                                potentialMatch.endPathElementIndex = hackstackElementIndex + 1; // index after end of match
-                                potentialMatches.length = 0; // we don't allow matches to overlap, so start matching again
-                                matches.push(potentialMatch);
-                            }
-                        } else {
-                            potentialMatches.splice(i, 1);
-                            i--;
-                        }
-                    }
-                }
-            }
-            return matches;
-        },
-        isElementValuesEqual: function(elementValue1, elementValue2) {
-            if (typeof elementValue1 === "string" || typeof elementValue2 === "string") {
-                return elementValue1 === elementValue2;
-            }
-            if (elementValue1 instanceof tree.Attribute) {
-                if (elementValue1.op !== elementValue2.op || elementValue1.key !== elementValue2.key) {
-                    return false;
-                }
-                if (!elementValue1.value || !elementValue2.value) {
-                    if (elementValue1.value || elementValue2.value) {
-                        return false;
-                    }
-                    return true;
-                }
-                elementValue1 = elementValue1.value.value || elementValue1.value;
-                elementValue2 = elementValue2.value.value || elementValue2.value;
-                return elementValue1 === elementValue2;
-            }
-            elementValue1 = elementValue1.value;
-            elementValue2 = elementValue2.value;
-            if (elementValue1 instanceof tree.Selector) {
-                if (!(elementValue2 instanceof tree.Selector) || elementValue1.elements.length !== elementValue2.elements.length) {
-                    return false;
-                }
-                for(var i = 0; i <elementValue1.elements.length; i++) {
-                    if (elementValue1.elements[i].combinator.value !== elementValue2.elements[i].combinator.value) {
-                        if (i !== 0 || (elementValue1.elements[i].combinator.value || ' ') !== (elementValue2.elements[i].combinator.value || ' ')) {
-                            return false;
-                        }
-                    }
-                    if (!this.isElementValuesEqual(elementValue1.elements[i].value, elementValue2.elements[i].value)) {
-                        return false;
-                    }
-                }
-                return true;
-            }
-            return false;
-        },
-        extendSelector:function (matches, selectorPath, replacementSelector) {
-
-            //for a set of matches, replace each match with the replacement selector
-
-            var currentSelectorPathIndex = 0,
-                currentSelectorPathElementIndex = 0,
-                path = [],
-                matchIndex,
-                selector,
-                firstElement,
-                match,
-                newElements;
-
-            for (matchIndex = 0; matchIndex < matches.length; matchIndex++) {
-                match = matches[matchIndex];
-                selector = selectorPath[match.pathIndex];
-                firstElement = new tree.Element(
-                    match.initialCombinator,
-                    replacementSelector.elements[0].value,
-                    replacementSelector.elements[0].index,
-                    replacementSelector.elements[0].currentFileInfo
-                );
-
-                if (match.pathIndex > currentSelectorPathIndex && currentSelectorPathElementIndex > 0) {
-                    path[path.length - 1].elements = path[path.length - 1].elements.concat(selectorPath[currentSelectorPathIndex].elements.slice(currentSelectorPathElementIndex));
-                    currentSelectorPathElementIndex = 0;
-                    currentSelectorPathIndex++;
-                }
-
-                newElements = selector.elements
-                    .slice(currentSelectorPathElementIndex, match.index)
-                    .concat([firstElement])
-                    .concat(replacementSelector.elements.slice(1));
-
-                if (currentSelectorPathIndex === match.pathIndex && matchIndex > 0) {
-                    path[path.length - 1].elements =
-                        path[path.length - 1].elements.concat(newElements);
-                } else {
-                    path = path.concat(selectorPath.slice(currentSelectorPathIndex, match.pathIndex));
-
-                    path.push(new tree.Selector(
-                        newElements
-                    ));
-                }
-                currentSelectorPathIndex = match.endPathIndex;
-                currentSelectorPathElementIndex = match.endPathElementIndex;
-                if (currentSelectorPathElementIndex >= selectorPath[currentSelectorPathIndex].elements.length) {
-                    currentSelectorPathElementIndex = 0;
-                    currentSelectorPathIndex++;
-                }
-            }
-
-            if (currentSelectorPathIndex < selectorPath.length && currentSelectorPathElementIndex > 0) {
-                path[path.length - 1].elements = path[path.length - 1].elements.concat(selectorPath[currentSelectorPathIndex].elements.slice(currentSelectorPathElementIndex));
-                currentSelectorPathIndex++;
-            }
-
-            path = path.concat(selectorPath.slice(currentSelectorPathIndex, selectorPath.length));
-
-            return path;
-        },
-        visitRulesetOut: function (rulesetNode) {
-        },
-        visitMedia: function (mediaNode, visitArgs) {
-            var newAllExtends = mediaNode.allExtends.concat(this.allExtendsStack[this.allExtendsStack.length-1]);
-            newAllExtends = newAllExtends.concat(this.doExtendChaining(newAllExtends, mediaNode.allExtends));
-            this.allExtendsStack.push(newAllExtends);
-        },
-        visitMediaOut: function (mediaNode) {
-            this.allExtendsStack.length = this.allExtendsStack.length - 1;
-        },
-        visitDirective: function (directiveNode, visitArgs) {
-            var newAllExtends = directiveNode.allExtends.concat(this.allExtendsStack[this.allExtendsStack.length-1]);
-            newAllExtends = newAllExtends.concat(this.doExtendChaining(newAllExtends, directiveNode.allExtends));
-            this.allExtendsStack.push(newAllExtends);
-        },
-        visitDirectiveOut: function (directiveNode) {
-            this.allExtendsStack.length = this.allExtendsStack.length - 1;
-        }
-    };
-
-})(require('./tree'));
-
-(function (tree) {
-
-    tree.sourceMapOutput = function (options) {
-        this._css = [];
-        this._rootNode = options.rootNode;
-        this._writeSourceMap = options.writeSourceMap;
-        this._contentsMap = options.contentsMap;
-        this._sourceMapFilename = options.sourceMapFilename;
-        this._outputFilename = options.outputFilename;
-        this._sourceMapURL = options.sourceMapURL;
-        this._sourceMapBasepath = options.sourceMapBasepath;
-        this._sourceMapRootpath = options.sourceMapRootpath;
-        this._outputSourceFiles = options.outputSourceFiles;
-        this._sourceMapGeneratorConstructor = options.sourceMapGenerator || require("source-map").SourceMapGenerator;
-
-        if (this._sourceMapRootpath && this._sourceMapRootpath.charAt(this._sourceMapRootpath.length-1) !== '/') {
-            this._sourceMapRootpath += '/';
-        }
-
-        this._lineNumber = 0;
-        this._column = 0;
-    };
-
-    tree.sourceMapOutput.prototype.normalizeFilename = function(filename) {
-        if (this._sourceMapBasepath && filename.indexOf(this._sourceMapBasepath) === 0) {
-             filename = filename.substring(this._sourceMapBasepath.length);
-             if (filename.charAt(0) === '\\' || filename.charAt(0) === '/') {
-                filename = filename.substring(1);
-             }
-        }
-        return (this._sourceMapRootpath || "") + filename.replace(/\\/g, '/');
-    };
-
-    tree.sourceMapOutput.prototype.add = function(chunk, fileInfo, index, mapLines) {
-
-        //ignore adding empty strings
-        if (!chunk) {
-            return;
-        }
-
-        var lines,
-            sourceLines,
-            columns,
-            sourceColumns,
-            i;
-
-        if (fileInfo) {
-            var inputSource = this._contentsMap[fileInfo.filename].substring(0, index);
-            sourceLines = inputSource.split("\n");
-            sourceColumns = sourceLines[sourceLines.length-1];
-        }
-
-        lines = chunk.split("\n");
-        columns = lines[lines.length-1];
-
-        if (fileInfo) {
-            if (!mapLines) {
-                this._sourceMapGenerator.addMapping({ generated: { line: this._lineNumber + 1, column: this._column},
-                    original: { line: sourceLines.length, column: sourceColumns.length},
-                    source: this.normalizeFilename(fileInfo.filename)});
-            } else {
-                for(i = 0; i < lines.length; i++) {
-                    this._sourceMapGenerator.addMapping({ generated: { line: this._lineNumber + i + 1, column: i === 0 ? this._column : 0},
-                        original: { line: sourceLines.length + i, column: i === 0 ? sourceColumns.length : 0},
-                        source: this.normalizeFilename(fileInfo.filename)});
-                }
-            }
-        }
-
-        if (lines.length === 1) {
-            this._column += columns.length;
-        } else {
-            this._lineNumber += lines.length - 1;
-            this._column = columns.length;
-        }
-
-        this._css.push(chunk);
-    };
-
-    tree.sourceMapOutput.prototype.isEmpty = function() {
-        return this._css.length === 0;
-    };
-
-    tree.sourceMapOutput.prototype.toCSS = function(env) {
-        this._sourceMapGenerator = new this._sourceMapGeneratorConstructor({ file: this._outputFilename, sourceRoot: null });
-
-        if (this._outputSourceFiles) {
-            for(var filename in this._contentsMap) {
-                this._sourceMapGenerator.setSourceContent(this.normalizeFilename(filename), this._contentsMap[filename]);
-            }
-        }
-
-        this._rootNode.genCSS(env, this);
-
-        if (this._css.length > 0) {
-            var sourceMapURL,
-                sourceMapContent = JSON.stringify(this._sourceMapGenerator.toJSON());
-
-            if (this._sourceMapURL) {
-                sourceMapURL = this._sourceMapURL;
-            } else if (this._sourceMapFilename) {
-                sourceMapURL = this.normalizeFilename(this._sourceMapFilename);
-            }
-
-            if (this._writeSourceMap) {
-                this._writeSourceMap(sourceMapContent);
-            } else {
-                sourceMapURL = "data:application/json," + encodeURIComponent(sourceMapContent);
-            }
-
-            if (sourceMapURL) {
-                this._css.push("/*# sourceMappingURL=" + sourceMapURL + " */");
-            }
-        }
-
-        return this._css.join('');
-    };
-
-})(require('./tree'));
-
-//
-// browser.js - client-side engine
-//
-/*global less, window, document, XMLHttpRequest, location */
-
-var isFileProtocol = /^(file|chrome(-extension)?|resource|qrc|app):/.test(location.protocol);
-
-less.env = less.env || (location.hostname == '127.0.0.1' ||
-                        location.hostname == '0.0.0.0'   ||
-                        location.hostname == 'localhost' ||
-                        (location.port &&
-                          location.port.length > 0)      ||
-                        isFileProtocol                   ? 'development'
-                                                         : 'production');
-
-var logLevel = {
-    info: 2,
-    errors: 1,
-    none: 0
-};
-
-// The amount of logging in the javascript console.
-// 2 - Information and errors
-// 1 - Errors
-// 0 - None
-// Defaults to 2
-less.logLevel = typeof(less.logLevel) != 'undefined' ? less.logLevel : logLevel.info;
-
-// Load styles asynchronously (default: false)
-//
-// This is set to `false` by default, so that the body
-// doesn't start loading before the stylesheets are parsed.
-// Setting this to `true` can result in flickering.
-//
-less.async = less.async || false;
-less.fileAsync = less.fileAsync || false;
-
-// Interval between watch polls
-less.poll = less.poll || (isFileProtocol ? 1000 : 1500);
-
-//Setup user functions
-if (less.functions) {
-    for(var func in less.functions) {
-        less.tree.functions[func] = less.functions[func];
-   }
-}
-
-var dumpLineNumbers = /!dumpLineNumbers:(comments|mediaquery|all)/.exec(location.hash);
-if (dumpLineNumbers) {
-    less.dumpLineNumbers = dumpLineNumbers[1];
-}
-
-var typePattern = /^text\/(x-)?less$/;
-var cache = null;
-var fileCache = {};
-var varsPre = "";
-
-function log(str, level) {
-    if (less.env == 'development' && typeof(console) !== 'undefined' && less.logLevel >= level) {
-        console.log('less: ' + str);
-    }
-}
-
-function extractId(href) {
-    return href.replace(/^[a-z-]+:\/+?[^\/]+/, '' )  // Remove protocol & domain
-        .replace(/^\//,                 '' )  // Remove root /
-        .replace(/\.[a-zA-Z]+$/,        '' )  // Remove simple extension
-        .replace(/[^\.\w-]+/g,          '-')  // Replace illegal characters
-        .replace(/\./g,                 ':'); // Replace dots with colons(for valid id)
-}
-
-function errorConsole(e, rootHref) {
-    var template = '{line} {content}';
-    var filename = e.filename || rootHref;
-    var errors = [];
-    var content = (e.type || "Syntax") + "Error: " + (e.message || 'There is an error in your .less file') +
-        " in " + filename + " ";
-
-    var errorline = function (e, i, classname) {
-        if (e.extract[i] !== undefined) {
-            errors.push(template.replace(/\{line\}/, (parseInt(e.line, 10) || 0) + (i - 1))
-                .replace(/\{class\}/, classname)
-                .replace(/\{content\}/, e.extract[i]));
-        }
-    };
-
-    if (e.extract) {
-        errorline(e, 0, '');
-        errorline(e, 1, 'line');
-        errorline(e, 2, '');
-        content += 'on line ' + e.line + ', column ' + (e.column + 1) + ':\n' +
-            errors.join('\n');
-    } else if (e.stack) {
-        content += e.stack;
-    }
-    log(content, logLevel.errors);
-}
-
-function createCSS(styles, sheet, lastModified) {
-    // Strip the query-string
-    var href = sheet.href || '';
-
-    // If there is no title set, use the filename, minus the extension
-    var id = 'less:' + (sheet.title || extractId(href));
-
-    // If this has already been inserted into the DOM, we may need to replace it
-    var oldCss = document.getElementById(id);
-    var keepOldCss = false;
-
-    // Create a new stylesheet node for insertion or (if necessary) replacement
-    var css = document.createElement('style');
-    css.setAttribute('type', 'text/css');
-    if (sheet.media) {
-        css.setAttribute('media', sheet.media);
-    }
-    css.id = id;
-
-    if (css.styleSheet) { // IE
-        try {
-            css.styleSheet.cssText = styles;
-        } catch (e) {
-            throw new(Error)("Couldn't reassign styleSheet.cssText.");
-        }
-    } else {
-        css.appendChild(document.createTextNode(styles));
-
-        // If new contents match contents of oldCss, don't replace oldCss
-        keepOldCss = (oldCss !== null && oldCss.childNodes.length > 0 && css.childNodes.length > 0 &&
-            oldCss.firstChild.nodeValue === css.firstChild.nodeValue);
-    }
-
-    var head = document.getElementsByTagName('head')[0];
-
-    // If there is no oldCss, just append; otherwise, only append if we need
-    // to replace oldCss with an updated stylesheet
-    if (oldCss === null || keepOldCss === false) {
-        var nextEl = sheet && sheet.nextSibling || null;
-        if (nextEl) {
-            nextEl.parentNode.insertBefore(css, nextEl);
-        } else {
-            head.appendChild(css);
-        }
-    }
-    if (oldCss && keepOldCss === false) {
-        oldCss.parentNode.removeChild(oldCss);
-    }
-
-    // Don't update the local store if the file wasn't modified
-    if (lastModified && cache) {
-        log('saving ' + href + ' to cache.', logLevel.info);
-        try {
-            cache.setItem(href, styles);
-            cache.setItem(href + ':timestamp', lastModified);
-        } catch(e) {
-            //TODO - could do with adding more robust error handling
-            log('failed to save', logLevel.errors);
-        }
-    }
-}
-
-function errorHTML(e, rootHref) {
-    var id = 'less-error-message:' + extractId(rootHref || "");
-    var template = '<li><label>{line}</label><pre class="{class}">{content}</pre></li>';
-    var elem = document.createElement('div'), timer, content, errors = [];
-    var filename = e.filename || rootHref;
-    var filenameNoPath = filename.match(/([^\/]+(\?.*)?)$/)[1];
-
-    elem.id        = id;
-    elem.className = "less-error-message";
-
-    content = '<h3>'  + (e.type || "Syntax") + "Error: " + (e.message || 'There is an error in your .less file') +
-        '</h3>' + '<p>in <a href="' + filename   + '">' + filenameNoPath + "</a> ";
-
-    var errorline = function (e, i, classname) {
-        if (e.extract[i] !== undefined) {
-            errors.push(template.replace(/\{line\}/, (parseInt(e.line, 10) || 0) + (i - 1))
-                .replace(/\{class\}/, classname)
-                .replace(/\{content\}/, e.extract[i]));
-        }
-    };
-
-    if (e.extract) {
-        errorline(e, 0, '');
-        errorline(e, 1, 'line');
-        errorline(e, 2, '');
-        content += 'on line ' + e.line + ', column ' + (e.column + 1) + ':</p>' +
-            '<ul>' + errors.join('') + '</ul>';
-    } else if (e.stack) {
-        content += '<br/>' + e.stack.split('\n').slice(1).join('<br/>');
-    }
-    elem.innerHTML = content;
-
-    // CSS for error messages
-    createCSS([
-        '.less-error-message ul, .less-error-message li {',
-        'list-style-type: none;',
-        'margin-right: 15px;',
-        'padding: 4px 0;',
-        'margin: 0;',
-        '}',
-        '.less-error-message label {',
-        'font-size: 12px;',
-        'margin-right: 15px;',
-        'padding: 4px 0;',
-        'color: #cc7777;',
-        '}',
-        '.less-error-message pre {',
-        'color: #dd6666;',
-        'padding: 4px 0;',
-        'margin: 0;',
-        'display: inline-block;',
-        '}',
-        '.less-error-message pre.line {',
-        'color: #ff0000;',
-        '}',
-        '.less-error-message h3 {',
-        'font-size: 20px;',
-        'font-weight: bold;',
-        'padding: 15px 0 5px 0;',
-        'margin: 0;',
-        '}',
-        '.less-error-message a {',
-        'color: #10a',
-        '}',
-        '.less-error-message .error {',
-        'color: red;',
-        'font-weight: bold;',
-        'padding-bottom: 2px;',
-        'border-bottom: 1px dashed red;',
-        '}'
-    ].join('\n'), { title: 'error-message' });
-
-    elem.style.cssText = [
-        "font-family: Arial, sans-serif",
-        "border: 1px solid #e00",
-        "background-color: #eee",
-        "border-radius: 5px",
-        "-webkit-border-radius: 5px",
-        "-moz-border-radius: 5px",
-        "color: #e00",
-        "padding: 15px",
-        "margin-bottom: 15px"
-    ].join(';');
-
-    if (less.env == 'development') {
-        timer = setInterval(function () {
-            if (document.body) {
-                if (document.getElementById(id)) {
-                    document.body.replaceChild(elem, document.getElementById(id));
-                } else {
-                    document.body.insertBefore(elem, document.body.firstChild);
-                }
-                clearInterval(timer);
-            }
-        }, 10);
-    }
-}
-
-function error(e, rootHref) {
-    if (!less.errorReporting || less.errorReporting === "html") {
-        errorHTML(e, rootHref);
-    } else if (less.errorReporting === "console") {
-        errorConsole(e, rootHref);
-    } else if (typeof less.errorReporting === 'function') {
-        less.errorReporting("add", e, rootHref);
-    }
-}
-
-function removeErrorHTML(path) {
-    var node = document.getElementById('less-error-message:' + extractId(path));
-    if (node) {
-        node.parentNode.removeChild(node);
-    }
-}
-
-function removeErrorConsole(path) {
-    //no action
-}
-
-function removeError(path) {
-    if (!less.errorReporting || less.errorReporting === "html") {
-        removeErrorHTML(path);
-    } else if (less.errorReporting === "console") {
-        removeErrorConsole(path);
-    } else if (typeof less.errorReporting === 'function') {
-        less.errorReporting("remove", path);
-    }
-}
-
-function loadStyles(newVars) {
-    var styles = document.getElementsByTagName('style'),
-        style;
-    for (var i = 0; i < styles.length; i++) {
-        style = styles[i];
-        if (style.type.match(typePattern)) {
-            var env = new less.tree.parseEnv(less),
-                lessText = style.innerHTML || '';
-            env.filename = document.location.href.replace(/#.*$/, '');
-
-            if (newVars || varsPre) {
-                env.useFileCache = true;
-
-                lessText = varsPre + lessText;
-
-                if (newVars) {
-                    lessText += "\n" + newVars;
-                }
-            }
-
-            /*jshint loopfunc:true */
-            // use closure to store current value of i
-            var callback = (function(style) {
-                return function (e, cssAST) {
-                    if (e) {
-                        return error(e, "inline");
-                    }
-                    var css = cssAST.toCSS(less);
-                    style.type = 'text/css';
-                    if (style.styleSheet) {
-                        style.styleSheet.cssText = css;
-                    } else {
-                        style.innerHTML = css;
-                    }
-                };
-            })(style);
-            new(less.Parser)(env).parse(lessText, callback);
-        }
-    }
-}
-
-function extractUrlParts(url, baseUrl) {
-    // urlParts[1] = protocol&hostname || /
-    // urlParts[2] = / if path relative to host base
-    // urlParts[3] = directories
-    // urlParts[4] = filename
-    // urlParts[5] = parameters
-
-    var urlPartsRegex = /^((?:[a-z-]+:)?\/+?(?:[^\/\?#]*\/)|([\/\\]))?((?:[^\/\\\?#]*[\/\\])*)([^\/\\\?#]*)([#\?].*)?$/i,
-        urlParts = url.match(urlPartsRegex),
-        returner = {}, directories = [], i, baseUrlParts;
-
-    if (!urlParts) {
-        throw new Error("Could not parse sheet href - '"+url+"'");
-    }
-
-    // Stylesheets in IE don't always return the full path
-    if (!urlParts[1] || urlParts[2]) {
-        baseUrlParts = baseUrl.match(urlPartsRegex);
-        if (!baseUrlParts) {
-            throw new Error("Could not parse page url - '"+baseUrl+"'");
-        }
-        urlParts[1] = urlParts[1] || baseUrlParts[1] || "";
-        if (!urlParts[2]) {
-            urlParts[3] = baseUrlParts[3] + urlParts[3];
-        }
-    }
-
-    if (urlParts[3]) {
-        directories = urlParts[3].replace(/\\/g, "/").split("/");
-
-        // extract out . before .. so .. doesn't absorb a non-directory
-        for(i = 0; i < directories.length; i++) {
-            if (directories[i] === ".") {
-                directories.splice(i, 1);
-                i -= 1;
-            }
-        }
-
-        for(i = 0; i < directories.length; i++) {
-            if (directories[i] === ".." && i > 0) {
-                directories.splice(i-1, 2);
-                i -= 2;
-            }
-        }
-    }
-
-    returner.hostPart = urlParts[1];
-    returner.directories = directories;
-    returner.path = urlParts[1] + directories.join("/");
-    returner.fileUrl = returner.path + (urlParts[4] || "");
-    returner.url = returner.fileUrl + (urlParts[5] || "");
-    return returner;
-}
-
-function pathDiff(url, baseUrl) {
-    // diff between two paths to create a relative path
-
-    var urlParts = extractUrlParts(url),
-        baseUrlParts = extractUrlParts(baseUrl),
-        i, max, urlDirectories, baseUrlDirectories, diff = "";
-    if (urlParts.hostPart !== baseUrlParts.hostPart) {
-        return "";
-    }
-    max = Math.max(baseUrlParts.directories.length, urlParts.directories.length);
-    for(i = 0; i < max; i++) {
-        if (baseUrlParts.directories[i] !== urlParts.directories[i]) { break; }
-    }
-    baseUrlDirectories = baseUrlParts.directories.slice(i);
-    urlDirectories = urlParts.directories.slice(i);
-    for(i = 0; i < baseUrlDirectories.length-1; i++) {
-        diff += "../";
-    }
-    for(i = 0; i < urlDirectories.length-1; i++) {
-        diff += urlDirectories[i] + "/";
-    }
-    return diff;
-}
-
-function getXMLHttpRequest() {
-    if (window.XMLHttpRequest) {
-        return new XMLHttpRequest();
-    } else {
-        try {
-            /*global ActiveXObject */
-            return new ActiveXObject("MSXML2.XMLHTTP.3.0");
-        } catch (e) {
-            log("browser doesn't support AJAX.", logLevel.errors);
-            return null;
-        }
-    }
-}
-
-function doXHR(url, type, callback, errback) {
-    var xhr = getXMLHttpRequest();
-    var async = isFileProtocol ? less.fileAsync : less.async;
-
-    if (typeof(xhr.overrideMimeType) === 'function') {
-        xhr.overrideMimeType('text/css');
-    }
-    log("XHR: Getting '" + url + "'", logLevel.info);
-    xhr.open('GET', url, async);
-    xhr.setRequestHeader('Accept', type || 'text/x-less, text/css; q=0.9, */*; q=0.5');
-    xhr.send(null);
-
-    function handleResponse(xhr, callback, errback) {
-        if (xhr.status >= 200 && xhr.status < 300) {
-            callback(xhr.responseText,
-                xhr.getResponseHeader("Last-Modified"));
-        } else if (typeof(errback) === 'function') {
-            errback(xhr.status, url);
-        }
-    }
-
-    if (isFileProtocol && !less.fileAsync) {
-        if (xhr.status === 0 || (xhr.status >= 200 && xhr.status < 300)) {
-            callback(xhr.responseText);
-        } else {
-            errback(xhr.status, url);
-        }
-    } else if (async) {
-        xhr.onreadystatechange = function () {
-            if (xhr.readyState == 4) {
-                handleResponse(xhr, callback, errback);
-            }
-        };
-    } else {
-        handleResponse(xhr, callback, errback);
-    }
-}
-
-function loadFile(originalHref, currentFileInfo, callback, env, newVars) {
-
-    if (currentFileInfo && currentFileInfo.currentDirectory && !/^([a-z-]+:)?\//.test(originalHref)) {
-        originalHref = currentFileInfo.currentDirectory + originalHref;
-    }
-
-    // sheet may be set to the stylesheet for the initial load or a collection of properties including
-    // some env variables for imports
-    var hrefParts = extractUrlParts(originalHref, window.location.href);
-    var href      = hrefParts.url;
-    var newFileInfo = {
-        currentDirectory: hrefParts.path,
-        filename: href
-    };
-
-    if (currentFileInfo) {
-        newFileInfo.entryPath = currentFileInfo.entryPath;
-        newFileInfo.rootpath = currentFileInfo.rootpath;
-        newFileInfo.rootFilename = currentFileInfo.rootFilename;
-        newFileInfo.relativeUrls = currentFileInfo.relativeUrls;
-    } else {
-        newFileInfo.entryPath = hrefParts.path;
-        newFileInfo.rootpath = less.rootpath || hrefParts.path;
-        newFileInfo.rootFilename = href;
-        newFileInfo.relativeUrls = env.relativeUrls;
-    }
-
-    if (newFileInfo.relativeUrls) {
-        if (env.rootpath) {
-            newFileInfo.rootpath = extractUrlParts(env.rootpath + pathDiff(hrefParts.path, newFileInfo.entryPath)).path;
-        } else {
-            newFileInfo.rootpath = hrefParts.path;
-        }
-    }
-
-    if (env.useFileCache && fileCache[href]) {
-        try {
-            var lessText = fileCache[href];
-            if (newVars) {
-                lessText += "\n" + newVars;
-            }
-            callback(null, lessText, href, newFileInfo, { lastModified: new Date() });
-        } catch (e) {
-            callback(e, null, href);
-        }
-        return;
-    }
-
-    doXHR(href, env.mime, function (data, lastModified) {
-        data = varsPre + data;
-
-        // per file cache
-        fileCache[href] = data;
-
-        // Use remote copy (re-parse)
-        try {
-            callback(null, data, href, newFileInfo, { lastModified: lastModified });
-        } catch (e) {
-            callback(e, null, href);
-        }
-    }, function (status, url) {
-        callback({ type: 'File', message: "'" + url + "' wasn't found (" + status + ")" }, null, href);
-    });
-}
-
-function loadStyleSheet(sheet, callback, reload, remaining, newVars) {
-
-    var env = new less.tree.parseEnv(less);
-    env.mime = sheet.type;
-
-    if (newVars || varsPre) {
-        env.useFileCache = true;
-    }
-
-    loadFile(sheet.href, null, function(e, data, path, newFileInfo, webInfo) {
-
-        if (webInfo) {
-            webInfo.remaining = remaining;
-
-            var css       = cache && cache.getItem(path),
-                timestamp = cache && cache.getItem(path + ':timestamp');
-
-            if (!reload && timestamp && webInfo.lastModified &&
-                (new(Date)(webInfo.lastModified).valueOf() ===
-                    new(Date)(timestamp).valueOf())) {
-                // Use local copy
-                createCSS(css, sheet);
-                webInfo.local = true;
-                callback(null, null, data, sheet, webInfo, path);
-                return;
-            }
-        }
-
-        //TODO add tests around how this behaves when reloading
-        removeError(path);
-
-        if (data) {
-            env.currentFileInfo = newFileInfo;
-            new(less.Parser)(env).parse(data, function (e, root) {
-                if (e) { return callback(e, null, null, sheet); }
-                try {
-                    callback(e, root, data, sheet, webInfo, path);
-                } catch (e) {
-                    callback(e, null, null, sheet);
-                }
-            });
-        } else {
-            callback(e, null, null, sheet, webInfo, path);
-        }
-    }, env, newVars);
-}
-
-function loadStyleSheets(callback, reload, newVars) {
-    for (var i = 0; i < less.sheets.length; i++) {
-        loadStyleSheet(less.sheets[i], callback, reload, less.sheets.length - (i + 1), newVars);
-    }
-}
-
-function initRunningMode(){
-    if (less.env === 'development') {
-        less.optimization = 0;
-        less.watchTimer = setInterval(function () {
-            if (less.watchMode) {
-                loadStyleSheets(function (e, root, _, sheet, env) {
-                    if (e) {
-                        error(e, sheet.href);
-                    } else if (root) {
-                        createCSS(root.toCSS(less), sheet, env.lastModified);
-                    }
-                });
-            }
-        }, less.poll);
-    } else {
-        less.optimization = 3;
-    }
-}
-
-function serializeVars(vars) {
-    var s = "";
-
-    for (var name in vars) {
-        s += ((name.slice(0,1) === '@')? '' : '@') + name +': '+
-                ((vars[name].slice(-1) === ';')? vars[name] : vars[name] +';');
-    }
-
-    return s;
-}
-
-
-//
-// Watch mode
-//
-less.watch   = function () {
-    if (!less.watchMode ){
-        less.env = 'development';
-         initRunningMode();
-    }
-    return this.watchMode = true;
-};
-
-less.unwatch = function () {clearInterval(less.watchTimer); return this.watchMode = false; };
-
-if (/!watch/.test(location.hash)) {
-    less.watch();
-}
-
-if (less.env != 'development') {
-    try {
-        cache = (typeof(window.localStorage) === 'undefined') ? null : window.localStorage;
-    } catch (_) {}
-}
-
-//
-// Get all <link> tags with the 'rel' attribute set to "stylesheet/less"
-//
-var links = document.getElementsByTagName('link');
-
-less.sheets = [];
-
-for (var i = 0; i < links.length; i++) {
-    if (links[i].rel === 'stylesheet/less' || (links[i].rel.match(/stylesheet/) &&
-       (links[i].type.match(typePattern)))) {
-        less.sheets.push(links[i]);
-    }
-}
-
-//
-// With this function, it's possible to alter variables and re-render
-// CSS without reloading less-files
-//
-less.modifyVars = function(record) {
-    less.refresh(false, serializeVars(record));
-};
-
-less.refresh = function (reload, newVars) {
-    var startTime, endTime;
-    startTime = endTime = new Date();
-
-    loadStyleSheets(function (e, root, _, sheet, env) {
-        if (e) {
-            return error(e, sheet.href);
-        }
-        if (env.local) {
-            log("loading " + sheet.href + " from cache.", logLevel.info);
-        } else {
-            log("parsed " + sheet.href + " successfully.", logLevel.info);
-            createCSS(root.toCSS(less), sheet, env.lastModified);
-        }
-        log("css for " + sheet.href + " generated in " + (new Date() - endTime) + 'ms', logLevel.info);
-        if (env.remaining === 0) {
-            log("css generated in " + (new Date() - startTime) + 'ms', logLevel.info);
-        }
-        endTime = new Date();
-    }, reload, newVars);
-
-    loadStyles(newVars);
-};
-
-if (less.globalVars) {
-    varsPre = serializeVars(less.globalVars) + "\n";
-}
-
-less.refreshStyles = loadStyles;
-
-less.Parser.fileLoader = loadFile;
-
-less.refresh(less.env === 'development');
-
-// amd.js
-//
-// Define Less as an AMD module.
-if (typeof define === "function" && define.amd) {
-    define(function () { return less; } );
-}
-
-})(window);
\ No newline at end of file
diff --git a/src/main/webapp/less/screen.less b/src/main/webapp/less/screen.less
index 1b6a0310..7102445c 100644
--- a/src/main/webapp/less/screen.less
+++ b/src/main/webapp/less/screen.less
@@ -3,12 +3,12 @@
 @import 'screen/footer-sticky.less';
 @import 'screen/wip.less';
 
-@media (min-width: @minscreen)
+@media (min-width: (@minscreen))
 {
   @import 'screen/typo.less';
   @import 'screen/layout.less';
   @import 'screen/footer.less';
-  @media (max-width: @maxtablet)
+  @media (max-width: (@maxtablet))
   {
     @import 'tablet/typo.less';
     @import 'tablet/layout.less';
@@ -16,20 +16,20 @@
     @import 'tablet/footer.less';
   }
 }
-@media (min-width: @maxtablet + 1)
+@media (min-width: (@mindesktop))
 {
   @import 'screen/faux-column.less';
   @import 'screen/marginal.less';
   @import 'screen/content.less';
 }
 
-@media (max-width: @maxtablet)
+@media (max-width: (@maxtablet))
 {
   @import 'tablet/head.less';
   @import 'tablet/404.less';
 }
 
-@media (max-width: @maxphone)
+@media (max-width: (@maxphone))
 {
   @import 'phone/typo.less';
   @import 'phone/layout.less';
@@ -40,7 +40,7 @@
   @import 'phone/404.less';
 }
 
-@media (max-width: @maxtiny)
+@media (max-width: (@maxtiny))
 {
   @import 'tiny/layout.less';
   @import 'tiny/404.less';
diff --git a/src/main/webapp/less/tablet/footer.less b/src/main/webapp/less/tablet/footer.less
index 887229b7..85cb8499 100644
--- a/src/main/webapp/less/tablet/footer.less
+++ b/src/main/webapp/less/tablet/footer.less
@@ -20,12 +20,12 @@
   left: 0;
   right: 0;
   padding: 0 2.18181818em 1.5em; /* ? 3*16px ? */
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     padding-right: 1.45454545em;
     padding-bottom: 1em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     padding-right: .72727272em;
     padding-bottom: .5em;
@@ -51,11 +51,11 @@
   position: static;
   margin: -.125em;
   padding-top: 1.5em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     padding-top: 1em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     padding-top: .5em;
   }
diff --git a/src/main/webapp/less/tablet/head.less b/src/main/webapp/less/tablet/head.less
index f41b9e65..2a6da915 100644
--- a/src/main/webapp/less/tablet/head.less
+++ b/src/main/webapp/less/tablet/head.less
@@ -1,4 +1,4 @@
-@media (max-width: @maxsmalltablet)
+@media (max-width: (@maxsmalltablet))
 {
   #logo
   {
@@ -10,7 +10,7 @@
   }
 }
 
-@media (max-width: @maxsmallertablet)
+@media (max-width: (@maxsmallertablet))
 {
   #logo
   {
diff --git a/src/main/webapp/less/tablet/layout.less b/src/main/webapp/less/tablet/layout.less
index 44ab7d58..a5959e57 100644
--- a/src/main/webapp/less/tablet/layout.less
+++ b/src/main/webapp/less/tablet/layout.less
@@ -23,11 +23,11 @@ body
 .nomenu .content
 {
   padding: 0 0 5em 0;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     padding-bottom: 4em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     padding-bottom: 3.25em;
   }
@@ -44,11 +44,11 @@ body
   float: none;
   width: auto;
   padding: 0 3em 0 5em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     padding: 0 2em 0 3em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     padding: 0 1em 0 2.5em;
   }
@@ -81,12 +81,12 @@ body
 #header
 {
   padding: 1em 3em 2em 5em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     margin-left: -1.5em;
     padding: .5em 2em 2em 3em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     margin-left: -1.2em;
     padding: 1em 1em 2em 2.5em;
@@ -101,11 +101,11 @@ body
   position: static;
   border-right: .125em solid @hintergrund;
   margin-left: 20em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     margin-left: 18.5em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     margin-left: 17.5em;
     #menu > li.about
@@ -130,12 +130,12 @@ body
   width: auto;
   top: -9em;
   right: 3em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     top: -7.7em;
     right: 2em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     top: -6.5em;
     right: 1em;
@@ -147,22 +147,22 @@ body
 }
 #menu > li.m
 {
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     padding: 0 0 0 3em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     padding: 0 0 0 2em;
   }
 }
 #menu > li.m > .m
 {
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     font-size: 200%; /* 32px */
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     font-size: 150%; /* 24px */
   }
@@ -171,12 +171,12 @@ body
 #menu > li.m > a.m.selected:before,
 #menu > li.m > strong.m:before
 {
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     content: '> ';
     margin-left: -.95em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
   }
 }
@@ -196,11 +196,11 @@ body
 .nomenu #footer
 {
   padding: 0 3em 1.5em 5em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     padding: 0 2em 1em 3em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     padding: 0 1em .75em 2.5em;
   }
@@ -216,13 +216,13 @@ body
 {
   left: 11.9em;
   right: 3em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     font-size: 87.5%; /* 14px */
     top: 7.2em;
     left: 9.8em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     top: 5.8em;
     left: 7em;
@@ -239,12 +239,12 @@ body
   background-color: @heller;
   position: relative;
   top: -4.5em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     padding-left: 3em;
     padding-right: 2em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     padding-left: 2.5em;
     padding-right: 1em;
@@ -253,12 +253,12 @@ body
 .menu .content > .marginal > aside.m
 {
   margin: 0 -12em 1em 20em;
-  @media (max-width: @maxsmalltablet)
+  @media (max-width: (@maxsmalltablet))
   {
     margin-left: 18.5em;
     margin-right: -13em;
   }
-  @media (max-width: @maxsmallertablet)
+  @media (max-width: (@maxsmallertablet))
   {
     margin-left: 17.5em;
     margin-right: -14em;
diff --git a/src/main/webapp/less/tablet/typo.less b/src/main/webapp/less/tablet/typo.less
index e254ffa4..6bf6dffc 100644
--- a/src/main/webapp/less/tablet/typo.less
+++ b/src/main/webapp/less/tablet/typo.less
@@ -1,4 +1,4 @@
-@media (max-width: @maxsmalltablet)
+@media (max-width: (@maxsmalltablet))
 {
   h1
   {
diff --git a/src/main/webapp/less/variables.less b/src/main/webapp/less/variables.less
index 82038435..15c02514 100644
--- a/src/main/webapp/less/variables.less
+++ b/src/main/webapp/less/variables.less
@@ -20,14 +20,14 @@
 /** Bildschirmbreiten für Media-Query */
 
 @minscreen:      580px;
-@maxtablet:      939px;
+@mindesktop:     940px;
+@maxtablet:      @mindesktop - 1;
 @maxsmalltablet: 800px;
 @maxsmallertablet: 700px;
 @maxphone:       @minscreen - 1;
 @minphone:       300px;
 @maxtiny:        @minphone - 1;
 
-
 /** Schriften */
 
 .droid ()
diff --git a/src/main/webapp/thymeleaf/404.html b/src/main/webapp/thymeleaf/404.html
new file mode 100644
index 00000000..6c22532b
--- /dev/null
+++ b/src/main/webapp/thymeleaf/404.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:tiles="http://www.thymeleaf.org">
+  <head>
+    <title tiles:fragment="title">404: Page not found</title>
+  </head>
+  <body>
+    <div tiles:fragment="content">
+      <p>We do not know, where you are.</p>
+      <p>And we do not know, why you are here.</p>
+      <p>But we can tell you: WE ARE SORRY!</p>
+      <p>Really.</p>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/about.html b/src/main/webapp/thymeleaf/about.html
new file mode 100644
index 00000000..919dcbf3
--- /dev/null
+++ b/src/main/webapp/thymeleaf/about.html
@@ -0,0 +1,85 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>About</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><strong class="b">About</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><strong class="m">About</strong></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><strong class="s">About</strong></h2>
+      <ul id="submenu">
+        <li class="s sub"><a href="expertise.html" th:href="@{/expertise.html}" class="s">Expertise</a></li>
+        <li class="s sub"><a href="references.html" th:href="@{/references.html}" class="s">References</a></li>
+        <li class="s "><a href="contact.html" th:href="@{/contact.html}" class="s">Contact</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>About</h1></header>
+      <p>
+        <span class="logo">juplo</span> is the place, where I collect and share
+        my more or less private projects.
+        It is a lab for experiments, that help me to do my job as a freelancer
+        at the desired level of quality.
+        Here, I can play with all the fancy new stuff, that might be a little
+        bit to much bleeding edge, to be used on a production site of a paying
+        client.
+      </p>
+      <p>
+        I decided to share all this stuff, because I am always learning a lot
+        from the internet-community.
+        I wanted to give back a little and try to help and teach others, as I
+        was helped and teached.
+        Also, this is a good oportunity, to show what I am doing and to do a 
+        little self-publicity...
+      </p>
+      <p>
+        <span class="logo">juplo</span> mainly consists of two parts:
+      </p>
+      <ul>
+        <li>
+          In the <a href="blog.html" th:href="@{/blog.html}">blog</a>, I summarize, how I solved
+          some every-day problems, other people might stumble across too.
+          I am introducing new projects there and announcing new versions and/or
+          bugfixes to older projects.
+        </li>
+        <li>
+          The other part of the site is the
+          <a href="projects.html" th:href="@{/projects.html}">projects-section</a>.
+          This is where I am hosting all projects, that I have made publicy
+          available.
+        </li>
+      </ul>
+      <p>
+        If you want to hire me, you can find out more on the
+        <a href="contact.html" th:href="@{/contact.html}">contact-page</a>.
+        If you are not yet sure, if you want to hire me, you might be
+        interessted in
+        <a href="expertise.html" th:href="@{/expertise.html}">what I can do for you</a>, or 
+        <a href="references.html" th:href="@{/references.html}">what I have already done for others</a>.
+      </p>
+    </article>
+    <ul layout:fragment="footer">
+      <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
+      <li class="f"><a class="f" href="impressum.html" th:href="@{/impressum.html}">Impressum</a></li>
+      <li class="f about"><strong class="f">About</strong></li>
+    </ul>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/agb.html b/src/main/webapp/thymeleaf/agb.html
new file mode 100644
index 00000000..024e3de5
--- /dev/null
+++ b/src/main/webapp/thymeleaf/agb.html
@@ -0,0 +1,193 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Allgemeine Geschäftsbedingungen (AGB)</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a href="impressum.html" th:href="@{/impressum.html}" class="b">Impressum</a></li>
+      <li class="b"><strong class="b">AGB</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="impressum.html" th:href="@{/impressum.html}" class="s selected">Impressum</a></h2>
+      <ul id="submenu">
+        <li class="s"><strong class="s">AGB</strong></li>
+        <li class="s"><a href="haftung-inhalte.html" th:href="@{/haftung-inhalte.html}" class="s">Haftung für Inhalte</a></li>
+        <li class="s"><a href="haftung-links.html" th:href="@{/haftung-links.html}" class="s">Haftung für Links</a></li>
+        <li class="s"><a href="urheberrechte.html" th:href="@{/urheberrechte.html}" class="s">Urheberrechte</a></li>
+        <li class="s"><a href="datenschutz.html" th:href="@{/datenschutz.html}" class="s">Datenschutz</a></li>
+        <li class="s"><a href="google-analytics.html" th:href="@{/google-analytics.html}" class="s">Google Analytics</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Allgemeine Geschäftsbedingungen (AGB)</h1></header>
+      <p><em>Stand: 01.02.2014</em></p>
+      <h2>Angebote &amp; Abrechnung</h2>
+      <p>
+       Angebote sind freibleibend.
+       Alle Preise verstehen sich in Euro und zzgl. der gesetzl. MwSt.
+       Wenn nicht anders vereinbart erfolgt eine Anzahlung von 10% im Voraus.
+       Sollte sich der Zeitraum über den Leistungen erbracht werden über
+       mehrere Monate erstrecken, behalte ich mir vor, Rechnungen für
+       Leistungsabschnitte zu stellen (jedoch nicht häufiger als ein mal im
+       Monat).
+       Das Zahlungsziel beträgt 8 Tage.
+      </p>
+      <p>
+       Falls nicht anders vereinbart, ist bei Dienstleistungen eine
+       Korrekturschleife enthalten.
+       Darüber hinausgehende Überarbeitungen sowie gewünschte Zusatzleistungen
+       werden nach Aufwand per Stundensatz abgerechnet.
+       Sollte für den Auftrag ein rabattierter Stundensatz vereinbart worden
+       sein, so gilt dieser nicht automatisch für Überarbeitungen und
+       Zusatzleistungen.
+      </p>
+      <h2>Absprachen</h2>
+      <p>
+        Die zentralen Ansprechpartner des Kunden müssen verbindliche
+        Erklärungen abgeben können (z. B. Fristabsprachen, Abnahmen).
+        Bei Ausfall, Urlaub etc. sind Ersatzpersonen zu benennen.
+      </p>
+      <h2>Leistungen &amp; Abnahme</h2>
+      <p>
+        Der Kunde ist in der Pflicht, erbrachte Leitungen direkt nach deren
+        Erstellung und ohne Aufforderung rechtzeitig (z.B. vor
+        Veröffentlichung) zu prüfen und Änderungswünsche oder Korrekturhinweise
+        direkt mitzuteilen.
+        Die Annahme von Leistungen ohne Beanstandung ist als Abnahme zu
+        verstehen.
+      </p>
+      <p>
+        Ich bin zu jeder Zeit berechtigt, die Arbeit in sinnvollen
+        Teilleistungen zu erbringen und zu berechnen.
+        Der Kunde ist verpflichtet, diese Teilleistungen abzunehmen.
+      </p>
+      <p>
+        Im Rahmen der Gestaltungsspielräume des Briefings vom Kunden trägt der
+        Kunde das Risiko des Nichtgefallens.
+      </p>
+      <h2>Eigenleistungen</h2>
+      <p>
+        Sofern der Kunde Eigenleistungen erbringt, ist die termingerechte
+        Lieferung für den Gesamtzeitplan relevant.
+        Bei verspäteter Lieferung bin ich nicht dazu verpflichtet, die
+        Auftragsarbeit unverzüglich fortzusetzen, wenn ich durch andere
+        terminliche Verpflichtungen daran gehindert werde.
+        Verzögerungen auf Kundenseite können zu erheblichen Gesamtverzögerungen
+        führen.
+        Für dadurch entstandenen Schaden und entgangenen Gewinn haftet der Kunde.
+      </p>
+      <p>
+        Der Kunde berücksichtigt bei der Lieferung von Daten und Materialien
+        die von mir im Rahmen des Angebots geforderten Formate.
+      </p>
+      <p>
+        Sofern Angaben, Muster, Inhalte, usw. vom Kunden geliefert werden, bin
+        ich für deren Richtigkeit und rechtliche Unbedenklichkeit nicht
+        verantwortlich.
+        Eine Prüfungspflicht besteht auf meiner Seite nicht.
+      </p>
+      <h2>Fremdleistungen</h2>
+      <p>
+        Angebote beziehen sich in der Regel auf von mir erbrachte Dienstleistung.
+        Die Kosten oder Gebühren Dritter (z.B. Provider, Lizenzen für Bild, Ton,
+        Schrift oder Software, Druckerei usw.) sind nicht enthalten, falls nicht
+        explizit erwähnt.
+      </p>
+      <p>
+        Bei Beauftragung von Fremdleistungen jedweder Art, berechne ich, falls
+        nicht anders vereinbart, eine Abwicklungspauschale in Höhe von 15% des
+        Auftragswerts für Organisation und Abstimmung.
+      </p>
+      <h2>Nutzungsrechte</h2>
+      <p>
+        An Unterlagen, die im Rahmen des Angebots übergeben werden (z.B.
+        Entwürfe, Konzepte), erhält der Kunde keine Nutzungsrechte.
+        Der Kunde erhält die vereinbarten Nutzungsrechte nur bei pünktlicher
+        und vollständiger Zahlung der vereinbarten Vergütung.
+      </p>
+      <p>
+        Eingesetzte Systeme (z.B. Springframework, Tomcat, CentOS usw.)
+        unterliegen ihren eigenen Nutzungsbestimmungen.
+      </p>
+      <h2>Rechtliche Prüfung</h2>
+      <p>
+        Ohne gesonderte Vereinbarung ist die patent-, muster-, urheber- und
+        markenrechtliche Schutz- oder Eintragungsfähigkeit der im Rahmen des
+        Vertrages gelieferten Ideen, Konzeptionen, Entwürfe und sonstiger
+        Leistungen nicht geschuldet.
+      </p>
+      <h2>Höhere Gewalt</h2>
+      <p>
+        Leistungsverzögerungen aufgrund von Umständen im Verantwortungsbereich
+        des Kunden (z.B. verspätete Anlieferung) und höherer Gewalt (z.B. Unfall,
+        Telekommunikationsstörung usw.) habe ich nicht zu vertreten.
+        Sie berechtigen mich das Erbringen der betreffenden Leistungen um die
+        Dauer der Behinderungen zzgl. einer angemessenen Anlaufzeit
+        aufzuschieben.
+      </p>
+      <h2>Archivierung</h2>
+      <p>
+        Ich bin nicht verpflichtet, erstellte Leistungen zu archivieren.
+        Unterlagen des Kunden muss ich nur dann zurückgeben, wenn dies der Kunde
+        vor der Übergabe ausdrücklich verlangt hat.
+      </p>
+      <h2>Betreuung / Support / Wartung</h2>
+      <p>
+        Ich bin nur in der in der Servicevereinbarung besprochenen Weise für die
+        für eine aktive Betreuung, Support oder Wartung (z.B. Sicherheitsupdates,       Aktualitätsprüfungen usw.) verantwortlich.
+      </p>
+      <h2>Referenzen</h2>
+      <p>
+        Innerhalb der erstellten Leistung werde ich in branchenüblicher Form als
+        Leistungserbrinnger genannt (z.B. Impressum).
+      </p>
+      <p>
+        Ich bin berechtigt, den Kunden als Referenz zu benennen und das Projekt
+        öffentlich vorzustellen.
+        Der Kunde kann dagegen jederzeit schriftlich Widerspruch erheben.
+        Widerruft der Kunde seine Zustimmung, so bin ich berechtigt, erstellte
+        Werbe-Materialien weiter zu benutzen, verpflichte mich jedoch, keine
+        weiteren, Werbe-Materialien zu erstellen, die den Kunden nennen.
+      </p>
+      <h2>Geheimhaltung</h2>
+      <p>
+        Die Vertragsparteien vereinbaren Vertraulichkeit über Vertrag und
+        Erkenntnisse der jeweils anderen Partei.
+        Die Vertraulichkeit gilt auch über die Beendigung des
+        Vertragsverhältnisses hinaus.
+      </p>
+      <h2>Schlussbestimmungen</h2>
+      <p>
+        Erfüllungsort und ausschließlicher Gerichtsstand für alle
+        Rechtsstreitigkeiten ist Münster.
+      </p>
+      <p>
+        Sollten aus irgendeinem Grund eine oder mehrere Einzelbestimmungen
+        dieser AGB unwirksam sein, so bleibt die Gültigkeit der restlichen
+        Bestimmungen davon unberührt.
+      </p>
+      <p>
+        Regelungslücken dieser AGB werden durch Auslegung so gefüllt, dass sie
+        dem wirtschaftlichen Zweck des Vertrages Rechnung tragen.
+      </p>
+    </article>
+    <aside layout:fragment="marginalcontent" th:include="templates/fragments :: about"></aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/blog.html b/src/main/webapp/thymeleaf/blog.html
new file mode 100644
index 00000000..43ee48fa
--- /dev/null
+++ b/src/main/webapp/thymeleaf/blog.html
@@ -0,0 +1,189 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Blog</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><strong class="b">Blog</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><strong class="m">Blog</strong></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <main class="main" layout:fragment="maincontent">
+      <article id="post-140" class="post-140 post type-post status-publish format-standard hentry category-jetty category-less category-maven category-wro4j">
+        <header class="entry-header">
+          <h2 class="entry-title"><a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="Permalink to Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources" rel="bookmark">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="12:58" rel="bookmark"><time class="entry-date" datetime="2013-12-06T12:58:17+00:00">December 6, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/jetty/" title="View all posts in Jetty" rel="category tag">Jetty</a>, <a href="http://juplo.de/category/less/" title="View all posts in less" rel="category tag">less</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>, <a href="http://juplo.de/category/wro4j/" title="View all posts in wro4j" rel="category tag">wro4j</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-140 -->
+      <article id="post-114" class="post-114 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
+        <header class="entry-header">
+          <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-3-released/" title="Permalink to hibernate4-maven-plugin 1.0.3 released!" rel="bookmark">hibernate4-maven-plugin 1.0.3 released!</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-3-released/" title="02:46" rel="bookmark"><time class="entry-date" datetime="2013-10-18T02:46:23+00:00">October 18, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-114 -->
+      <article id="post-97" class="post-97 post type-post status-publish format-standard hentry category-appengine category-java category-maven category-oauth2">
+        <header class="entry-header">
+          <h2 class="entry-title"><a href="http://juplo.de/log-out-from-wrong-account-with-maven-appengine-plugin/" title="Permalink to Log out from wrong Account with maven-appengine-plugin" rel="bookmark">Log out from wrong Account with maven-appengine-plugin</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/log-out-from-wrong-account-with-maven-appengine-plugin/" title="11:33" rel="bookmark"><time class="entry-date" datetime="2013-10-03T11:33:56+00:00">October 3, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/appengine/" title="View all posts in appengine" rel="category tag">appengine</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>, <a href="http://juplo.de/category/oauth2/" title="View all posts in oauth2" rel="category tag">oauth2</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-97 -->
+      <article id="post-90" class="post-90 post type-post status-publish format-standard hentry category-hibernate category-java category-jpa">
+        <header class="entry-header">
+          <h2 class="entry-title"><a href="http://juplo.de/bidirectional-association-with-elementcollection/" title="Permalink to Bidirectional Association with @ElementCollection" rel="bookmark">Bidirectional Association with @ElementCollection</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/bidirectional-association-with-elementcollection/" title="11:11" rel="bookmark"><time class="entry-date" datetime="2013-10-03T11:11:36+00:00">October 3, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/jpa/" title="View all posts in JPA" rel="category tag">JPA</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-90 -->
+      <article id="post-75" class="post-75 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
+        <header class="entry-header">
+  s        <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-2-release/" title="Permalink to hibernate4-maven-plugin 1.0.2 released!" rel="bookmark">hibernate4-maven-plugin 1.0.2 released!</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-2-release/" title="02:06" rel="bookmark"><time class="entry-date" datetime="2013-08-02T02:06:08+00:00">August 2, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-75 -->
+      <article id="post-64" class="post-64 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
+        <header class="entry-header">
+          <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-1-released/" title="Permalink to hibernate4-maven-plugin 1.0.1 released!" rel="bookmark">hibernate4-maven-plugin 1.0.1 released!</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-1-released/" title="01:10" rel="bookmark"><time class="entry-date" datetime="2013-01-16T01:10:59+00:00">January 16, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-64 -->
+      <article id="post-55" class="post-55 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
+        <header class="entry-header">
+          <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-1-0-released/" title="Permalink to hibernate4-maven-plugin 1.0 released!" rel="bookmark">hibernate4-maven-plugin 1.0 released!</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/hibernate4-maven-plugin-1-0-released/" title="22:04" rel="bookmark"><time class="entry-date" datetime="2012-11-29T22:04:25+00:00">November 29, 2012</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-55 -->
+      <article id="post-34" class="post-34 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
+        <header class="entry-header">
+          <h2 class="entry-title"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="Permalink to hibernate4-maven-plugin" rel="bookmark">hibernate4-maven-plugin</a></h2>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="19:29" rel="bookmark"><time class="entry-date" datetime="2012-11-28T19:29:12+00:00">November 28, 2012</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>          
+          </div><!-- .entry-meta -->
+        </header><!-- .entry-header -->
+        <div class="entry-content">
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          <span class="cat-links">
+            Posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>
+          </span>
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-34 -->
+    </main>
+    <div layout:fragment="marginalcontent">
+      <div id="secondary" class="widget-area" role="complementary">
+        <aside id="archives" class="widget">
+          <h1 class="widget-title">Archives</h1>
+          <ul>
+            <li><a href='http://juplo.de/2013/10/' title='October 2013'>October 2013</a></li>
+            <li><a href='http://juplo.de/2013/08/' title='August 2013'>August 2013</a></li>
+            <li><a href='http://juplo.de/2013/01/' title='January 2013'>January 2013</a></li>
+            <li><a href='http://juplo.de/2012/11/' title='November 2012'>November 2012</a></li>
+          </ul>
+        </aside>
+        <aside id="categories" class="widget">
+          <h1 class="widget-title">Most Used Categories</h1>
+          <ul>
+            <li class="cat-item cat-item-4"><a href="http://juplo.de/category/java/" title="View all posts filed under Java">Java</a> (6)</li>
+            <li class="cat-item cat-item-6"><a href="http://juplo.de/category/hibernate/" title="View all posts filed under Hibernate">Hibernate</a> (5)</li>
+            <li class="cat-item cat-item-8"><a href="http://juplo.de/category/maven/" title="View all posts filed under Maven">Maven</a> (5)</li>
+            <li class="cat-item cat-item-9"><a href="http://juplo.de/category/jpa/" title="View all posts filed under JPA">JPA</a> (1)</li>
+            <li class="cat-item cat-item-10"><a href="http://juplo.de/category/appengine/" title="View all posts filed under appengine">appengine</a> (1)</li>
+            <li class="cat-item cat-item-11"><a href="http://juplo.de/category/oauth2/" title="View all posts filed under oauth2">oauth2</a> (1)</li>
+          </ul>
+        </aside>
+        <aside id="search" class="widget widget_search">
+          <h1 class="widget-title">Search</h1>
+          <form role="search" method="get" id="searchform" class="searchform" action="http://juplo.de/">
+            <div>
+              <label class="screen-reader-text" for="s">Search for:</label>
+              <input type="text" value="" name="s" id="s" />
+              <input type="submit" id="searchsubmit" value="Search" />
+            </div>
+          </form>
+        </aside>
+      </div><!-- #secondary .widget-area -->
+      <div id="tertiary" class="widget-area" role="supplementary">
+      </div><!-- #tertiary .widget-area -->
+    </div>
+    <ul layout:fragment="footer">
+    </ul>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/blog/article.html b/src/main/webapp/thymeleaf/blog/article.html
new file mode 100644
index 00000000..bb0c4a9c
--- /dev/null
+++ b/src/main/webapp/thymeleaf/blog/article.html
@@ -0,0 +1,329 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>juplo - blog - Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><strong class="b">Blog</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><strong class="m">Blog</strong></li>
+        <li class="m projects"><a href="../projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <article id="post-140" class="post-140 post type-post status-publish format-standard hentry category-jetty category-less category-maven category-wro4j">
+        <div class="entry-header">
+          <h1 class="entry-title">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</h1>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="12:58" rel="bookmark"><time class="entry-date" datetime="2013-12-06T12:58:17+00:00">December 6, 2013</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </div><!-- .entry-header -->
+        <div class="entry-content">
+          <p>Ever searched for a simple configuration, that lets you use your <a href="http://wiki.eclipse.org/Jetty/Feature/Jetty_Maven_Plugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://wiki.eclipse.org']);" title="See the documentation for mor information">jetty-maven-plugin</a> as you are used to, while working with <a href="http://www.lesscss.org/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.lesscss.org']);" title="See LESS CSS documentation for mor informations">LESS</a> to simplify your stylesheets?</p>
+          <p>You cannot do both, use the <a href="http://www.lesscss.org/#usage" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.lesscss.org']);" title="More about the client-side usage of LESS">Client-side mode</a> of LESS to ease development and use the <a href="https://github.com/marceloverdijk/lesscss-maven-plugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://github.com']);" title="Homepage of the official LESS CSS maven plugin">lesscss-maven-plugin</a> to automatically compile the LESS-sources into CSS for production. That does not work, because your stylesheets must be linked in different ways if you are switching between the client-side mode &#8211; which is best for development &#8211; and the pre-compiled mode &#8211; which is best for production. For the client-side mode you need something like:</p>
+          <pre class="prettyprint linenums">
+  <code class="html">
+  &lt;link rel="stylesheet/less" type="text/css" href="styles.less" /&gt;
+  &lt;script src="less.js" type="text/javascript"&gt;&lt;/script&gt;
+  </code>
+          </pre>
+          <p>While, for the pre-compiled mode, you want to link to your stylesheets as usual, with:</p>
+          <pre class="prettyprint linenums">
+  <code class="html">
+  &lt;link rel="stylesheet" type="text/css" href="styles.css" /&gt;
+  </code>
+          </pre>
+          <p>While looking for a solution to this dilemma, I stumbled accross <a href="https://code.google.com/p/wro4j/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See the documentation of ths wounderfull tool">wro4j</a>. Originally intended, to speed up page-delivery by combining and minimizing multiple resources into one through the use of a servlet-filter, this tool also comes with a maven-plugin, that let you do the same offline, while compiling your webapp.</p>
+          <p>The idea is, to use the <a href="http://code.google.com/p/wro4j/wiki/MavenPlugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See the documentation of hte wro4j-maven-plugin">wro4j-maven-plugin</a> to compile and combine your LESS-sources into CSS for production and to use the <a href="http://code.google.com/p/wro4j/wiki/Installation" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See how to configure the filter">wro4j filter</a>, to dynamically deliver the compiled CSS while developing. This way, you do not have to alter your HTML-code, when switching between development and production, because you always link to the CSS-files.</p>
+          <p>So, lets get dirty!</p>
+          <h2>Step 1: Configure wro4j</h2>
+          <p>First, we configure <strong>wro4j</strong>, like as we want to use it to speed up our page. The details are explained and linked on wro4j&#8217;s <a href="http://code.google.com/p/wro4j/wiki/GettingStarted" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="Visit the Getting-Started-Page">Getting-Started-Page</a>. In short, we just need two files: <strong>wro.xml</strong> and <strong>wro.properties</strong>.</p>
+          <h3>wro.xml</h3>
+          <p>wro.xml tells wro4j, which resources should be combined and how the result should be named. I am using the following configuration to generate all LESS-Sources beneath <code>base/</code> into one CSS-file called <code>base.css</code>:</p>
+          <pre class="prettyprint linenums">
+  <code class="xml">
+  &lt;groups xmlns="http://www.isdc.ro/wro"&gt;
+    &lt;group name="base"&gt;
+      &lt;css&gt;/less/base/*.less&lt;/css&gt;
+    &lt;/group&gt;
+  </code>
+          </pre>
+          <p>wro4j looks for <code>/less/base/*.less</code> inside the root of the web-context, which is equal to <code>src/main/webapp</code> in a normal maven-project. There are <a href="http://code.google.com/p/wro4j/wiki/ResourceTypes" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://code.google.com']);" title="See the resource locator documentation of wro4j for more details">other ways to specifie the resources</a>, which enable you to store them elswhere. But this approach works best for our goal, because the path is understandable for both: the wro4j servlet-filter, we are configuring now for our development-environment, and the wro4j-maven-plugin, that we will configure later for build-time compilation.</p>
+          <h3>wro.properties</h3>
+          <p>wro.properties in short tells wro4j, how or if it should convert the combined sources and how it should behave. I am using the following configuration to tell wro4j, that it should convert <code>*.less</code>-sources into CSS and do that on <em>every request</em>:</p>
+          <pre class="prettyprint linenums">
+  <code class="properties">
+  preProcessors=less4j
+  disableCache=true
+  </code>
+          </pre>
+          <p>You can do a lot more here. There are countless <a href="http://code.google.com/p/wro4j/wiki/ConfigurationOptions" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="See all configuration options">configuration options</a> to fine-tune the behaviour of wro4j. The <code>disableCache=true</code> is crucial, because we would not see the changes take effect when developing with <strong>jetty-maven-plugin</strong> later on. You can also do much more with your resources here, for example <a href="https://code.google.com/p/wro4j/wiki/AvailableProcessors" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="See all available processors">minimizing</a>. But for our goal, we are now only intrested in the compilation of our LESS-sources.</p>
+          <h2>Step 2: Configure the wro4j servlet-filter</h2>
+          <p>Configuring the filter in the <strong>web.xml</strong> is easy. It is explained in wro4j&#8217;s <a href="https://code.google.com/p/wro4j/wiki/Installation" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="See the installation instructions for the wro4j servlet-filter">installation-insctuctions</a>. But the trick is, that we do not want to configure that filter for the production-version of our webapp, because we want to compile the resources offline, when the webapp is build. To acchieve this, we can use the <code>&lt;overrideDescriptor&gt;</code>-Parameter of the <a href="http://wiki.eclipse.org/Jetty/Feature/Jetty_Maven_Plugin#Configuring_Your_WebApp" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://wiki.eclipse.org']);" title="Read more about the configuration of the jetty-maven-plugin">jetty-maven-plugin</a>.</p>
+          <h2>&lt;overrideDescriptor&gt;</h2>
+          <p>This parameter lets you specify additional configuration options for the web.xml of your webapp. I am using the following configuration for my jetty-maven-plugin:</p>
+          <pre class="prettyprint linenums">
+  <code class="xml">
+  &lt;plugin&gt;
+    &lt;groupId&gt;org.eclipse.jetty&lt;/groupId&gt;
+    &lt;artifactId&gt;jetty-maven-plugin&lt;/artifactId&gt;
+    &lt;configuration&gt;
+      &lt;webApp&gt;
+        &lt;overrideDescriptor&gt;${project.basedir}/src/test/resources/jetty-web.xml&lt;/overrideDescriptor&gt;
+      &lt;/webApp&gt;
+    &lt;/configuration&gt;
+    &lt;dependencies&gt;
+      &lt;dependency&gt;
+        &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
+        &lt;artifactId&gt;wro4j-core&lt;/artifactId&gt;
+        &lt;version&gt;${wro4j.version}&lt;/version&gt;
+      &lt;/dependency&gt;
+      &lt;dependency&gt;
+        &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
+        &lt;artifactId&gt;wro4j-extensions&lt;/artifactId&gt;
+        &lt;version&gt;${wro4j.version}&lt;/version&gt;
+        &lt;exclusions&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;javax.servlet&lt;/groupId&gt;
+              &lt;artifactId&gt;servlet-api&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.apache.commons&lt;/groupId&gt;
+              &lt;artifactId&gt;commons-lang3&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;commons-io&lt;/groupId&gt;
+              &lt;artifactId&gt;commons-io&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;commons-pool&lt;/groupId&gt;
+              &lt;artifactId&gt;commons-pool&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.springframework&lt;/groupId&gt;
+              &lt;artifactId&gt;spring-web&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;com.google.code.gson&lt;/groupId&gt;
+              &lt;artifactId&gt;gson&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;com.google.javascript&lt;/groupId&gt;
+              &lt;artifactId&gt;closure-compiler&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;com.github.lltyk&lt;/groupId&gt;
+              &lt;artifactId&gt;dojo-shrinksafe&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.jruby&lt;/groupId&gt;
+              &lt;artifactId&gt;jruby-core&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+            &lt;groupId&gt;org.jruby&lt;/groupId&gt;
+            &lt;artifactId&gt;jruby-stdlib&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.jruby&lt;/groupId&gt;
+              &lt;artifactId&gt;jruby-stdlib&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;me.n4u.sass&lt;/groupId&gt;
+              &lt;artifactId&gt;sass-gems&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;nz.co.edmi&lt;/groupId&gt;
+              &lt;artifactId&gt;bourbon-gem-jar&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.codehaus.gmaven.runtime&lt;/groupId&gt;
+              &lt;artifactId&gt;gmaven-runtime-1.7&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;jshint&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;less&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;emberjs&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;handlebars&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;coffee-script&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;jslint&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;json2&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+          &lt;exclusion&gt;
+              &lt;groupId&gt;org.webjars&lt;/groupId&gt;
+              &lt;artifactId&gt;jquery&lt;/artifactId&gt;
+          &lt;/exclusion&gt;
+        &lt;/exclusions&gt;
+      &lt;/dependency&gt;
+    &lt;/dependencies&gt;
+  &lt;/plugin&gt;
+  </code>
+          </pre>
+          <p>The dependencies to <strong>wro4j-core</strong> and <strong>wro4j-extensions</strong> are needed by jetty, to be able to enable the filter defined below. Unfortunatly, one of the transitive dependencies of <code>wro4j-extensions</code> triggers an uggly error when running the jetty-maven-plugin. Therefore, all unneeded dependencies of <code>wro4j-extensions</code> are excluded, as a workaround for this error/bug.</p>
+          <h2>jetty-web.xml</h2>
+          <p>And my jetty-web.xml looks like this:</p>
+          <pre class="prettyprint linenums">
+  <code class="xml">
+  &lt;?xml version="1.0" encoding="UTF-8"?&gt;
+  &lt;web-app xmlns="http://java.sun.com/xml/ns/javaee"
+    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
+    version="2.5"&gt;
+    &lt;filter&gt;
+      &lt;filter-name&gt;wro&lt;/filter-name&gt;
+      &lt;filter-class&gt;ro.isdc.wro.http.WroFilter&lt;/filter-class&gt;
+    &lt;/filter&gt;
+    &lt;filter-mapping&gt;
+      &lt;filter-name&gt;wro&lt;/filter-name&gt;
+      &lt;url-pattern&gt;*.css&lt;/url-pattern&gt;
+    &lt;/filter-mapping&gt;
+  &lt;/web-app&gt;
+  </code>
+          </pre>
+          <p>The filter processes any URI&#8217;s that end with <code>.css</code>. This way, the wro4j servlet-filter makes <code>base.css</code> available under any path, because for exampl <code>/base.css</code>, <code>/css/base.css</code> and <code>/foo/bar/base.css</code> all end with <code>.css</code>.</p>
+          <p>This is all, that is needed to develop with dynamically reloadable compiled LESS-resources. Just fire up your browser and browse to <code>/what/you/like/base.css</code>. (But do not forget to put some LESS-files in <code>src/main/webapp/less/base/</code> first!)</p>
+          <h2>Step 3: Install wro4j-maven-plugin</h2>
+          <p>All that is left over to configure now, is the build-process. If you would build and deploy your webapp now, the CSS-file <code>base.css</code> would not be generated and the link to your stylesheet, that already works in our jetty-maven-plugin environment would point to a 404. Hence, we need to set up the <strong>wro4j-maven-plugin</strong>. I am using this configuration:</p>
+          <pre class="prettyprint linenums">
+  <code class="xml">
+  &lt;plugin&gt;
+    &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
+    &lt;artifactId&gt;wro4j-maven-plugin&lt;/artifactId&gt;
+    &lt;version&gt;${wro4j.version}&lt;/version&gt;
+    &lt;configuration&gt;
+      &lt;wroManagerFactory&gt;ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory&lt;/wroManagerFactory&gt;
+      &lt;cssDestinationFolder&gt;${project.build.directory}/${project.build.finalName}/css/&lt;/cssDestinationFolder&gt;
+    &lt;/configuration&gt;
+    &lt;executions&gt;
+      &lt;execution&gt;
+        &lt;phase&gt;package&lt;/phase&gt;
+        &lt;goals&gt;
+          &lt;goal&gt;run&lt;/goal&gt;
+        &lt;/goals&gt;
+      &lt;/execution&gt;
+    &lt;/executions&gt;
+  &lt;/plugin&gt;
+  </code>
+          </pre>
+          <p>I connected the <code>run</code>-goal with the <code>package</code>-phase, because the statically compiled CSS-file is needed only in the final war. The <code>ConfigurableWroManagerFactory</code> tells wro4j, that it should look up further configuration options in our <code>wro.properties</code>-file, where we tell wro4j, that it should compile our LESS-resources. The <code>&lt;cssDestinationFolder&gt;</code>-tag tells wro4j, where it should put the generated CSS-file. You can adjust that to suite your needs.</p>
+          <p>That&#8217;s it: now the same CSS-file, which is created on the fly by the wro4j servlet-filter when using <code>mvn jetty:run</code> and, thus, enables dynamic reloading of our LESS-resources, is generated during the build-process by the wro4j-maven-plugin.</p>
+          <h2>Cleanup and further considerations</h2>
+          <h3>lesscss-maven-plugin</h3>
+          <p>If you already compile your LESS-resources with the lesscss-maven-plugin, you can stick with it and skip step 3. But I strongly recommend giving wro4j-maven-plugin a try, because it is a much more powerfull tool, that can speed up your final webapp even more.</p>
+          <h3>Clean up your mess </h3>
+          <p>With a configuration like the above one, your LESS-resources and wro4j-configuration-files will be packed into your production-war. That might be confusing later, because neither wro4j nor LESS is used in the final war. You can add the following to your <code>pom.xml</code> to exclude these files from your war for the sake of clarity:</p>
+          <pre class="prettyprint linenums">
+  <code class="xml">
+  &lt;plugin&gt;
+    &lt;artifactId&gt;maven-war-plugin&lt;/artifactId&gt;
+    &lt;configuration&gt;
+      &lt;warSourceExcludes&gt;
+        WEB-INF/wro.*,
+        less/**
+      &lt;/warSourceExcludes&gt;
+    &lt;/configuration&gt;
+  &lt;/plugin&gt;
+  </code>
+          </pre>
+          <h3>What&#8217;s next?</h3>
+          <p>We only scrached the surface, of what can be done with wro4j. Based on this configuration, you can easily enable additional features to fine-tune your final build for maximum speed. You really should take a look at the <a href="https://code.google.com/p/wro4j/wiki/AvailableProcessors" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-article', 'http://code.google.com']);" title="Available Processors">list of available Processors</a>!</p>
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          This entry was posted in <a href="http://juplo.de/category/jetty/" title="View all posts in Jetty" rel="category tag">Jetty</a>, <a href="http://juplo.de/category/less/" title="View all posts in less" rel="category tag">less</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>, <a href="http://juplo.de/category/wro4j/" title="View all posts in wro4j" rel="category tag">wro4j</a>. Bookmark the <a href="http://juplo.de/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/" title="Permalink to Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources" rel="bookmark">permalink</a>. 
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-140 -->
+      <!-- You can start editing here. -->
+      <!-- If comments are open, but there are no comments. -->
+      <div id="respond">
+        <h3>Leave a Reply</h3>
+        <div id="cancel-comment-reply">
+          <small><a rel="nofollow" id="cancel-comment-reply-link" href="/combining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources/#respond" style="display:none;">Click here to cancel reply.</a></small>
+        </div>
+        <form action="http://juplo.de/wp-comments-post.php" method="post" id="commentform">
+          <p>Logged in as <a href="http://juplo.de/wp-admin/profile.php">Kai Moritz</a>. <a href="http://juplo.de/wp-login.php?action=logout&amp;redirect_to=http%3A%2F%2Fjuplo.de%2Fcombining-jetty-maven-plugin-and-wro4j-maven-plugin-for-dynamic-reloading-of-less-resources%2F&amp;_wpnonce=09e5cb501d" title="Log out of this account">Log out &raquo;</a></p>
+          <!--<p><small><strong>XHTML:</strong> You can use these tags: <code>&lt;a href=&quot;&quot; title=&quot;&quot;&gt; &lt;abbr title=&quot;&quot;&gt; &lt;acronym title=&quot;&quot;&gt; &lt;b&gt; &lt;blockquote cite=&quot;&quot;&gt; &lt;cite&gt; &lt;code&gt; &lt;del datetime=&quot;&quot;&gt; &lt;em&gt; &lt;i&gt; &lt;q cite=&quot;&quot;&gt; &lt;strike&gt; &lt;strong&gt; </code></small></p>-->
+          <p><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>
+          <p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
+            <input type='hidden' name='comment_post_ID' value='140' id='comment_post_ID' />
+            <input type='hidden' name='comment_parent' id='comment_parent' value='0' />
+          </p>
+          <input type="hidden" id="_wp_unfiltered_html_comment_disabled" name="_wp_unfiltered_html_comment_disabled" value="2096655c89" /><script>(function() {
+      if (window === window.parent) {
+        document.getElementById('_wp_unfiltered_html_comment_disabled').name = '_wp_unfiltered_html_comment';
+      }
+    })();</script>
+          <p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="f31e001227" /></p>
+        </form>
+      </div>
+    </article>
+    <aside layout:fragment="marginalcontent">
+      <div id="secondary" class="widget-area" role="complementary">
+        <aside id="archives" class="widget">
+          <h1 class="widget-title">Archives</h1>
+          <ul>
+            <li><a href='http://juplo.de/2013/10/' title='October 2013'>October 2013</a></li>
+            <li><a href='http://juplo.de/2013/08/' title='August 2013'>August 2013</a></li>
+            <li><a href='http://juplo.de/2013/01/' title='January 2013'>January 2013</a></li>
+            <li><a href='http://juplo.de/2012/11/' title='November 2012'>November 2012</a></li>
+          </ul>
+        </aside>
+        <aside id="categories" class="widget">
+          <h1 class="widget-title">Most Used Categories</h1>
+          <ul>
+            <li class="cat-item cat-item-4"><a href="http://juplo.de/category/java/" title="View all posts filed under Java">Java</a> (6)</li>
+            <li class="cat-item cat-item-6"><a href="http://juplo.de/category/hibernate/" title="View all posts filed under Hibernate">Hibernate</a> (5)</li>
+            <li class="cat-item cat-item-8"><a href="http://juplo.de/category/maven/" title="View all posts filed under Maven">Maven</a> (5)</li>
+            <li class="cat-item cat-item-9"><a href="http://juplo.de/category/jpa/" title="View all posts filed under JPA">JPA</a> (1)</li>
+            <li class="cat-item cat-item-10"><a href="http://juplo.de/category/appengine/" title="View all posts filed under appengine">appengine</a> (1)</li>
+            <li class="cat-item cat-item-11"><a href="http://juplo.de/category/oauth2/" title="View all posts filed under oauth2">oauth2</a> (1)</li>
+          </ul>
+        </aside>
+        <aside id="search" class="widget widget_search">
+          <h1 class="widget-title">Search</h1>
+          <form role="search" method="get" id="searchform" class="searchform" action="http://juplo.de/">
+            <div>
+              <label class="screen-reader-text" for="s">Search for:</label>
+              <input type="text" value="" name="s" id="s" />
+              <input type="submit" id="searchsubmit" value="Search" />
+            </div>
+          </form>
+        </aside>
+      </div><!-- #secondary .widget-area -->
+      <div id="tertiary" class="widget-area" role="supplementary">
+      </div><!-- #tertiary .widget-area -->
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/blog/comments.html b/src/main/webapp/thymeleaf/blog/comments.html
new file mode 100644
index 00000000..28860297
--- /dev/null
+++ b/src/main/webapp/thymeleaf/blog/comments.html
@@ -0,0 +1,498 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>juplo - blog - hibernate4-maven-plugin</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><strong class="b">Blog</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><strong class="m">Blog</strong></li>
+        <li class="m projects"><a href="../projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <article id="post-34" class="post-34 post type-post status-publish format-standard hentry category-hibernate category-java category-maven">
+        <div class="entry-header">
+          <h1 class="entry-title">hibernate4-maven-plugin</h1>
+          <div class="entry-meta">
+            Posted on <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="19:29" rel="bookmark"><time class="entry-date" datetime="2012-11-28T19:29:12+00:00">November 28, 2012</time></a><span class="byline"> by <span class="author vcard"><a class="url fn n" href="http://juplo.de/author/kai/" title="View all posts by Kai Moritz" rel="author">Kai Moritz</a></span></span>
+          </div><!-- .entry-meta -->
+        </div><!-- .entry-header -->
+        <div class="entry-content">
+          <h2>A simple Plugin for generating a Database-Schema from Hibernate 4 Mapping-Annotations</h2>
+          <p>
+            Hibernate comes with the buildin functionality, to automatically create or update the database schema. This functionality is configured in the session-configuraton via the parameter <code>hbm2ddl.auto</code> (see <a href="http://docs.jboss.org/hibernate/orm/4.1/manual/en-US/html_single/#configuration-optional" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://docs.jboss.org']);">Hibernate Reference Documentation &#8211; Chapter 3.4. Optional configuration properties</a>). But doing so <a href="http://stackoverflow.com/questions/221379/hibernate-hbm2ddl-auto-update-in-production" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://stackoverflow.com']);">is not very wise</a>, because you can easily corrupt or erase your production database, if this configuration parameter slips through to your production environment.
+          </p>
+          <p>
+            Alternatively, you can <a href="http://stackoverflow.com/questions/835961/how-to-creata-database-schema-using-hibernate" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://stackoverflow.com']);">run the tools <strong>SchemaExport</strong> or <strong>SchemaUpdate</strong> by hand</a>. But that is not very comfortable and being used to maven you will quickly long for a plugin, that does that job automatically for you, when you fire up your test cases.
+          </p>
+          <p>In the good old times, there was the <a href="http://mojo.codehaus.org/maven-hibernate3/hibernate3-maven-plugin/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://mojo.codehaus.org']);">Maven Hibernate3 Plugin</a>, that does this for you. But unfortunatly, this plugin is not compatible with Hibernate 4.x. Since there does not seem to be any successor for the Maven Hibernate3 Plugin and <a href="http://www.google.de/search?q=hibernate4+maven+plugin" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.google.de']);">googeling</a> does not help, I decided to write up this simple plugin (inspired by these two articles I found: <a href="http://www.tikalk.com/alm/blog/schema-export-hibernate-4-and-maven" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.tikalk.com']);">Schema Export with Hibernate 4 and Maven</a> and <a href="http://doingenterprise.blogspot.de/2012/05/schema-generation-with-hibernate-4-jpa.html" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://doingenterprise.blogspot.de']);">Schema generation with Hibernate 4, JPA and Maven</a>).
+          </p>
+          <p>
+            I hope, the resulting simple to use buletproof <a href="/hibernate4-maven-plugin/">hibernate4-maven-plugin</a> is usefull!
+          </p>
+          <p>
+            <strong><a href="/hibernate4-maven-plugin/">Try it out now!</a></strong></p>
+        </div><!-- .entry-content -->
+        <footer class="entry-meta">
+          This entry was posted in <a href="http://juplo.de/category/hibernate/" title="View all posts in Hibernate" rel="category tag">Hibernate</a>, <a href="http://juplo.de/category/java/" title="View all posts in Java" rel="category tag">Java</a>, <a href="http://juplo.de/category/maven/" title="View all posts in Maven" rel="category tag">Maven</a>. Bookmark the <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/" title="Permalink to hibernate4-maven-plugin" rel="bookmark">permalink</a>. 
+        </footer><!-- .entry-meta -->
+      </article><!-- #post-34 -->
+      <!-- You can start editing here. -->
+      <h3 id="comments">15 Responses to &#8220;hibernate4-maven-plugin&#8221;</h3>
+      <div class="navigation">
+        <div class="alignleft"></div>
+        <div class="alignright"></div>
+      </div>
+      <ol class="commentlist">
+        <li class="comment even thread-even depth-1 parent" id="comment-556">
+          <div id="div-comment-556" class="comment-body">
+            <div class="comment-author vcard">
+              <cite class="fn">Jukes</cite> <span class="says">says:</span>
+            </div>
+            <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-556">
+                November 7, 2013 at 23:18</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=556" title="Edit comment">(Edit)</a>
+            </div>
+            <p>
+              Hi thanks a lot for making this plugin available, great work!!<br />
+              I have a problem generating postgres schema. Looks like the plugin ignores the data type when adding default values and that yields a syntax error from Postgres. Or maybe I&#8217;m doing something wrong. I&#8217;m using version 1.0.3.</p>
+            <p>For example I have in java:</p>
+            <p>
+              @Column(name = &#8220;financialEnabled&#8221;, nullable = false, columnDefinition = &#8220;default TRUE&#8221;)<br />
+              private boolean financialEnabled;
+            </p>
+            <p>
+              Generated SQL is:<br />
+              financialEnabled default TRUE not null,
+            </p>
+            <p>As you can see the data type boolean is not translated to the SQL script. Thanks a lot for your help.</p>
+            <div class="reply">
+              <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=556#respond' onclick='return addComment.moveForm("div-comment-556", "556", "respond", "34")'>Reply</a>
+            </div>
+          </div>
+          <ul class="children">
+            <li class="comment byuser comment-author-kai bypostauthor odd alt depth-2" id="comment-567">
+              <div id="div-comment-567" class="comment-body">
+                <div class="comment-author vcard">
+                  <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>
+                </div>
+                <div class="comment-meta commentmetadata">
+                  <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-567">
+                    November 11, 2013 at 13:09</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=567" title="Edit comment">(Edit)
+                  </a>
+                </div>
+                <p>
+                  This plugin is only a tool to automate the generation of the SQL in your development-environment.<br />
+                  Questions on how to anotate your code correctly are better asked in a user-forum from hibernate or such.</p>
+                <p>
+                  Nevertheless, I think I can give you a usefull hint:<br />
+                  You are overwriting the automatically generated column-definition with &#8220;default TRUE&#8221;.<br />
+                  Try it with</p>
+                <p>
+                  @Column(name = “financialEnabled”, nullable = false)<br />
+                  private boolean financialEnabled;</p>
+                <div class="reply">
+                  <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=567#respond' onclick='return addComment.moveForm("div-comment-567", "567", "respond", "34")'>Reply</a>
+                </div>
+              </div>
+            </li><!-- #comment-## -->
+          </ul><!-- .children -->
+        </li><!-- #comment-## -->
+        <li class="comment even thread-odd thread-alt depth-1 parent" id="comment-390">
+          <div id="div-comment-390" class="comment-body">
+            <div class="comment-author vcard">
+              <cite class="fn">Milios</cite> <span class="says">says:</span>
+            </div>
+            <div class="comment-meta commentmetadata">
+              <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-390">
+                October 10, 2013 at 15:02
+              </a>
+              &nbsp;&nbsp;
+              <a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=390" title="Edit comment">(Edit)</a>
+            </div>
+            <p>Hi,</p>
+            <p>
+              looks like a very nice plugin. Unfortunately, part of our entities are in other modules/dependencies.<br />
+              Do you plan to add the possibility to scan also for dependencies of the project or at least of the plugin?</p>
+            <p>Also, when I only want to generate the SQL and use the following configuration, I got nothing.</p>
+            <p>Config:</p>
+            <p>
+              de.juplo<br />
+              hibernate4-maven-plugin<br />
+              1.0.2</p>
+            <p>
+              true<br />
+              SCRIPT<br />
+              NONE<br />
+              com.deutscheboerse.hibernate.PostgreSQLDialect<br />
+              ${project.build.directory}/hibernate4/cmm-schema.sql</p>
+            <p>
+              com.deutscheboerse.energy<br />
+              energy-commons-hibernate<br />
+              ${commons.hibernate.version}</p>
+            <p>
+              org.springframework.security<br />
+              spring-security-core<br />
+              ${spring.security.version}</p>
+            <p>
+              org.slf4j<br />
+              slf4j-log4j12<br />
+              ${slf4j.version}</p>
+            <p>
+              Output:<br />
+              mvn hibernate4:export -e<br />
+              [INFO] Error stacktraces are turned on.<br />
+              [INFO] Scanning for projects&#8230;<br />
+              [INFO]<br />
+              [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
+              [INFO] Building CMM WAR 1.0.0-RC5-SNAPSHOT<br />
+              [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
+              [INFO]<br />
+              [INFO] &#8212; hibernate4-maven-plugin:1.0.2:export (default-cli) @ cmm-war &#8212;<br />
+              [INFO] Scanning directory D:\_dev\work\ii\src\cmm\trunk\cmm-war\target\classes f<br />
+              [INFO] No hibernate-properties-file found! (Checked path: D:\_dev\work\ii\src\cm<br />
+              [INFO] Gathered hibernate-configuration (turn on debugging for details):<br />
+              [INFO]   hibernate.dialect = com.deutscheboerse.hibernate.PostgreSQLDialect<br />
+              [INFO] HHH000400: Using dialect: com.deutscheboerse.hibernate.PostgreSQLDialect<br />
+              [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
+              [INFO] BUILD SUCCESS<br />
+              [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;<br />
+              [INFO] Total time: 10.932s<br />
+              [INFO] Finished at: Thu Oct 10 12:51:05 UTC 2013<br />
+              [INFO] Final Memory: 9M/23M<br />
+              [INFO] &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;</p>
+            <p>
+              Thanks for any help,<br />
+              Milos.
+            </p>
+            <div class="reply">
+              <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=390#respond' onclick='return addComment.moveForm("div-comment-390", "390", "respond", "34")'>Reply</a>
+            </div>
+          </div>
+          <ul class="children">
+            <li class="comment byuser comment-author-kai bypostauthor odd alt depth-2 parent" id="comment-391">
+              <div id="div-comment-391" class="comment-body">
+                <div class="comment-author vcard">
+                  <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>
+                </div>
+                <div class="comment-meta commentmetadata">
+                  <a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-391">
+                    October 10, 2013 at 22:19
+                  </a>
+                  &nbsp;&nbsp;
+                  <a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=391" title="Edit comment">(Edit)</a>		</div>
+                <p>
+                  Yes, I am working on the possibility, to scan for annotations in dependencies.<br />
+                  Unfortunatly, I have no example-project for this use-case by hand.<br />
+                  It would help a lot, if you could provide a sample-project on github or such.
+                </p>
+                <p>Greetings kai</p>
+                <div class="reply">
+                  <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=391#respond' onclick='return addComment.moveForm("div-comment-391", "391", "respond", "34")'>Reply</a>
+                </div>
+              </div>
+              <ul class="children">
+                <li class="comment byuser comment-author-kai bypostauthor even depth-3" id="comment-568">
+                  <div id="div-comment-568" class="comment-body">
+                    <div class="comment-author vcard">
+                      <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>
+                    </div>
+                    <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-568">
+                        November 11, 2013 at 13:11</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=568" title="Edit comment">(Edit)</a>		</div>
+  
+                    <p>Version 1.0.3 of the plugin can now scan for annotations in the dependencies, too.</p>
+  
+                    <div class="reply">
+                      <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=568#respond' onclick='return addComment.moveForm("div-comment-568", "568", "respond", "34")'>Reply</a>		</div>
+                  </div>
+                </li><!-- #comment-## -->
+              </ul><!-- .children -->
+            </li><!-- #comment-## -->
+          </ul><!-- .children -->
+        </li><!-- #comment-## -->
+        <li class="comment odd alt thread-even depth-1" id="comment-286">
+          <div id="div-comment-286" class="comment-body">
+            <div class="comment-author vcard">
+              <cite class="fn">Pedro</cite> <span class="says">says:</span>		</div>
+  
+            <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-286">
+                August 7, 2013 at 18:54</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=286" title="Edit comment">(Edit)</a>		</div>
+  
+            <p>Following my previous question, here is the debug info</p>
+            <p>[DEBUG] Dependency: /Users/pmarques/.m2/repository/org/springframework/security/spring-security-acl/3.1.4.RELEASE/spring-security-acl-3.1.4.RELEASE.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/atomikos-util/3.6.5/atomikos-util-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-api/3.6.5/transactions-api-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/javax/transaction/transaction-api/1.1/transaction-api-1.1.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jdbc-deprecated/3.6.5/transactions-jdbc-deprecated-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jdbc/3.6.5/transactions-jdbc-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jta/3.6.5/transactions-jta-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions/3.6.5/transactions-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/org/apache/geronimo/specs/geronimo-jta_1.0.1B_spec/1.0.1/geronimo-jta_1.0.1B_spec-1.0.1.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jms-deprecated/3.6.5/transactions-jms-deprecated-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-jms/3.6.5/transactions-jms-3.6.5.jar<br />
+              [DEBUG] Dependency: /Users/pmarques/.m2/repository/com/atomikos/transactions-hibernate3/3.6.5/transactions-hibernate3-3.6.5.jar<br />
+              [INFO] Scanning directory /target/classes for annotated classes&#8230;</p>
+  
+            <div class="reply">
+              <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=286#respond' onclick='return addComment.moveForm("div-comment-286", "286", "respond", "34")'>Reply</a>		</div>
+          </div>
+        </li><!-- #comment-## -->
+        <li class="comment even thread-odd thread-alt depth-1 parent" id="comment-285">
+          <div id="div-comment-285" class="comment-body">
+            <div class="comment-author vcard">
+              <cite class="fn">Pedro</cite> <span class="says">says:</span>		</div>
+  
+            <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-285">
+                August 7, 2013 at 18:49</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=285" title="Edit comment">(Edit)</a>		</div>
+  
+            <p>Hi,</p>
+            <p>I have the following problem.<br />
+              The project that I use to test (and use the plugin) has the annotated classes as a dependency.<br />
+              I am getting the error:<br />
+              No annotated classes found in directory /target/classes</p>
+            <p>Shouldn&#8217;t the plugin scan all the dependencies also?</p>
+            <p>Thanks,<br />
+              Pedro.</p>
+  
+            <div class="reply">
+              <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=285#respond' onclick='return addComment.moveForm("div-comment-285", "285", "respond", "34")'>Reply</a>		</div>
+          </div>
+          <ul class="children">
+            <li class="comment byuser comment-author-kai bypostauthor odd alt depth-2 parent" id="comment-287">
+              <div id="div-comment-287" class="comment-body">
+                <div class="comment-author vcard">
+                  <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>		</div>
+  
+                <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-287">
+                    August 7, 2013 at 19:12</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=287" title="Edit comment">(Edit)</a>		</div>
+  
+                <p>Hi Pedro,</p>
+                <p>I think, that your observation is right.<br />
+                  But otherwise, dependencies should only be scanned if requested, because automatic scanning of the dependencies might lead to errors in other situations.</p>
+                <p>If you can make your project available to me (for example via github, or simply by mailing zipped version), I would add a configuration-parameter to enable/disable dependency-scanning and upload the refined plugin to central.</p>
+                <p>Regards,</p>
+                <p>Kai Moritz</p>
+  
+                <div class="reply">
+                  <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=287#respond' onclick='return addComment.moveForm("div-comment-287", "287", "respond", "34")'>Reply</a>		</div>
+              </div>
+              <ul class="children">
+                <li class="comment byuser comment-author-kai bypostauthor even depth-3" id="comment-426">
+                  <div id="div-comment-426" class="comment-body">
+                    <div class="comment-author vcard">
+                      <cite class="fn"><a href="http://juplo.de"   rel='external nofollow' class='url'>Kai Moritz</a></cite> <span class="says">says:</span>		</div>
+  
+                    <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-426">
+                        October 18, 2013 at 02:52</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=426" title="Edit comment">(Edit)</a>		</div>
+  
+                    <p>The <a href="/hibernate4-maven-plugin-1-0-3-released/" title="Open the release-notes" rel="nofollow">new version 1.0.3</a> of the plugin adds support for annotated classes in dependencies!</p>
+  
+                    <div class="reply">
+                      <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=426#respond' onclick='return addComment.moveForm("div-comment-426", "426", "respond", "34")'>Reply</a>		</div>
+                  </div>
+                </li><!-- #comment-## -->
+              </ul><!-- .children -->
+            </li><!-- #comment-## -->
+          </ul><!-- .children -->
+        </li><!-- #comment-## -->
+        <li class="comment odd alt thread-even depth-1 parent" id="comment-276">
+          <div id="div-comment-276" class="comment-body">
+            <div class="comment-author vcard">
+              <cite class="fn"><a href="http://bidlogix.com" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-commentauthor', 'http://bidlogix.com']);"  rel='external nofollow' class='url'>mike</a></cite> <span class="says">says:</span>		</div>
+  
+            <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-276">
+                July 30, 2013 at 12:57</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=276" title="Edit comment">(Edit)</a>		</div>
+  
+            <p>Hello,</p>
+            <p>I&#8217;m upgrading from hibernate3 to to hibernate4 and have moved from the hibernate3-maven-plugin to this version. I haven&#8217;t undertaken (and don&#8217;t want to just yet) the big job of changing my hbm mapping files to annotations.</p>
+            <p>As far as I can see this is a show stopper for using your nice plugin. Can you please confirm if this is the case and whether you are planning to add support for scanning for hbm files?</p>
+            <p>Many thanks,</p>
+            <p>Mike Cohen.</p>
+  
+            <div class="reply">
+              <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=276#respond' onclick='return addComment.moveForm("div-comment-276", "276", "respond", "34")'>Reply</a>		</div>
+          </div>
+          <ul class="children">
+            <li class="comment byuser comment-author-tortenheber even depth-2" id="comment-277">
+              <div id="div-comment-277" class="comment-body">
+                <div class="comment-author vcard">
+                  <cite class="fn">tortenheber</cite> <span class="says">says:</span>		</div>
+  
+                <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-277">
+                    July 31, 2013 at 23:18</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=277" title="Edit comment">(Edit)</a>		</div>
+  
+                <p>Hello Mike,</p>
+                <p>I added the requested feature in the SNAPSHOT-version.<br />
+                  It would be nice, if you could test, if the new feature works, because I have no example project by hand, that still uses hibernate-mapping via XML.</p>
+                <p>You can download an actual build here:</p>
+                <p><a href="https://oss.sonatype.org/content/repositories/snapshots//de/juplo/hibernate4-maven-plugin/1.0.2-SNAPSHOT/" onclick="javascript:_gaq.push(['_trackEvent', 'outbound-comment', 'http://oss.sonatype.org']);" rel="nofollow">https://oss.sonatype.org/content/repositories/snapshots//de/juplo/hibernate4-maven-plugin/1.0.2-SNAPSHOT/</a></p>
+                <p>or build it by yourself from the sources.<br />
+                  The feature is documented here:</p>
+                <p><a href="http://juplo.de/hibernate4-maven-plugin-1.0.2-SNAPSHOT/export-mojo.html"  rel="nofollow">http://juplo.de/hibernate4-maven-plugin-1.0.2-SNAPSHOT/export-mojo.html</a></p>
+                <p>Best regards</p>
+                <p>kai</p>
+  
+                <div class="reply">
+                  <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=277#respond' onclick='return addComment.moveForm("div-comment-277", "277", "respond", "34")'>Reply</a>		</div>
+              </div>
+            </li><!-- #comment-## -->
+          </ul><!-- .children -->
+        </li><!-- #comment-## -->
+        <li class="comment odd alt thread-odd thread-alt depth-1 parent" id="comment-50">
+          <div id="div-comment-50" class="comment-body">
+            <div class="comment-author vcard">
+              <cite class="fn">Victor</cite> <span class="says">says:</span>		</div>
+  
+            <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-50">
+                February 22, 2013 at 15:28</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=50" title="Edit comment">(Edit)</a>		</div>
+  
+            <p>Hey I have modified your code to support envers and generate auditing tables, if you want I can send you a patch. Thanks!</p>
+  
+            <div class="reply">
+              <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=50#respond' onclick='return addComment.moveForm("div-comment-50", "50", "respond", "34")'>Reply</a>		</div>
+          </div>
+          <ul class="children">
+            <li class="comment even depth-2 parent" id="comment-51">
+              <div id="div-comment-51" class="comment-body">
+                <div class="comment-author vcard">
+                  <cite class="fn">admin</cite> <span class="says">says:</span>		</div>
+  
+                <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-51">
+                    February 22, 2013 at 19:54</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=51" title="Edit comment">(Edit)</a>		</div>
+  
+                <p>Your welcom.<br />
+                  Send it!</p>
+  
+                <div class="reply">
+                  <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=51#respond' onclick='return addComment.moveForm("div-comment-51", "51", "respond", "34")'>Reply</a>		</div>
+              </div>
+              <ul class="children">
+                <li class="comment odd alt depth-3 parent" id="comment-54">
+                  <div id="div-comment-54" class="comment-body">
+                    <div class="comment-author vcard">
+                      <cite class="fn">Victor</cite> <span class="says">says:</span>		</div>
+  
+                    <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-54">
+                        February 25, 2013 at 15:28</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=54" title="Edit comment">(Edit)</a>		</div>
+  
+                    <p>Where to? Is there a github repo?</p>
+  
+                    <div class="reply">
+                      <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=54#respond' onclick='return addComment.moveForm("div-comment-54", "54", "respond", "34")'>Reply</a>		</div>
+                  </div>
+                  <ul class="children">
+                    <li class="comment even depth-4" id="comment-55">
+                      <div id="div-comment-55" class="comment-body">
+                        <div class="comment-author vcard">
+                          <cite class="fn">admin</cite> <span class="says">says:</span>		</div>
+  
+                        <div class="comment-meta commentmetadata"><a href="http://juplo.de/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#comment-55">
+                            February 25, 2013 at 20:05</a>&nbsp;&nbsp;<a class="comment-edit-link" href="http://juplo.de/wp-admin/comment.php?action=editcomment&amp;c=55" title="Edit comment">(Edit)</a>		</div>
+  
+                        <p>There is a private git-Repository.<br />
+                          <a href="http://juplo.de/hibernate4-maven-plugin/source-repository.html"  rel="nofollow">Check the project-documentation!</a></p>
+                        <p>You can <a href="http://juplo.de/hibernate4-maven-plugin/team-list.html"  rel="nofollow">send me</a> a patch or a pull-request to <a href="mailto:kai@juplo.de">kai@juplo.de</a></p>
+  
+                        <div class="reply">
+                          <a class='comment-reply-link' href='/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/?replytocom=55#respond' onclick='return addComment.moveForm("div-comment-55", "55", "respond", "34")'>Reply</a>		</div>
+                      </div>
+                    </li><!-- #comment-## -->
+                  </ul><!-- .children -->
+                </li><!-- #comment-## -->
+              </ul><!-- .children -->
+            </li><!-- #comment-## -->
+          </ul><!-- .children -->
+        </li><!-- #comment-## -->
+      </ol>
+  
+      <div class="navigation">
+        <div class="alignleft"></div>
+        <div class="alignright"></div>
+      </div>
+  
+  
+      <div id="respond">
+  
+        <h3>Leave a Reply</h3>
+  
+        <div id="cancel-comment-reply">
+          <small><a rel="nofollow" id="cancel-comment-reply-link" href="/hibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations/#respond" style="display:none;">Click here to cancel reply.</a></small>
+        </div>
+  
+  
+        <form action="http://juplo.de/wp-comments-post.php" method="post" id="commentform">
+  
+  
+          <p>Logged in as <a href="http://juplo.de/wp-admin/profile.php">Kai Moritz</a>. <a href="http://juplo.de/wp-login.php?action=logout&amp;redirect_to=http%3A%2F%2Fjuplo.de%2Fhibernate4-maven-plugin-a-simple-plugin-for-generating-a-database-schema-from-hibernate-4-mapping-annotations%2F&amp;_wpnonce=09e5cb501d" title="Log out of this account">Log out &raquo;</a></p>
+  
+  
+          <!--<p><small><strong>XHTML:</strong> You can use these tags: <code>&lt;a href=&quot;&quot; title=&quot;&quot;&gt; &lt;abbr title=&quot;&quot;&gt; &lt;acronym title=&quot;&quot;&gt; &lt;b&gt; &lt;blockquote cite=&quot;&quot;&gt; &lt;cite&gt; &lt;code&gt; &lt;del datetime=&quot;&quot;&gt; &lt;em&gt; &lt;i&gt; &lt;q cite=&quot;&quot;&gt; &lt;strike&gt; &lt;strong&gt; </code></small></p>-->
+  
+          <p><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>
+  
+          <p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
+            <input type='hidden' name='comment_post_ID' value='34' id='comment_post_ID' />
+            <input type='hidden' name='comment_parent' id='comment_parent' value='0' />
+          </p>
+          <input type="hidden" id="_wp_unfiltered_html_comment_disabled" name="_wp_unfiltered_html_comment_disabled" value="2cfe5768bb" /><script>(function() {
+      if (window === window.parent) {
+        document.getElementById('_wp_unfiltered_html_comment_disabled').name = '_wp_unfiltered_html_comment';
+      }
+    })();</script>
+          <p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="18eb674233" /></p>
+        </form>
+      </div>
+    </article>
+    <aside layout:fragment="marginalcontent">
+      <div id="secondary" class="widget-area" role="complementary">
+        <aside id="archives" class="widget">
+          <h1 class="widget-title">Archives</h1>
+          <ul>
+            <li><a href='http://juplo.de/2013/10/' title='October 2013'>October 2013</a></li>
+            <li><a href='http://juplo.de/2013/08/' title='August 2013'>August 2013</a></li>
+            <li><a href='http://juplo.de/2013/01/' title='January 2013'>January 2013</a></li>
+            <li><a href='http://juplo.de/2012/11/' title='November 2012'>November 2012</a></li>
+          </ul>
+        </aside>
+        <aside id="categories" class="widget">
+          <h1 class="widget-title">Most Used Categories</h1>
+          <ul>
+            <li class="cat-item cat-item-4"><a href="http://juplo.de/category/java/" title="View all posts filed under Java">Java</a> (6)</li>
+            <li class="cat-item cat-item-6"><a href="http://juplo.de/category/hibernate/" title="View all posts filed under Hibernate">Hibernate</a> (5)</li>
+            <li class="cat-item cat-item-8"><a href="http://juplo.de/category/maven/" title="View all posts filed under Maven">Maven</a> (5)</li>
+            <li class="cat-item cat-item-9"><a href="http://juplo.de/category/jpa/" title="View all posts filed under JPA">JPA</a> (1)</li>
+            <li class="cat-item cat-item-10"><a href="http://juplo.de/category/appengine/" title="View all posts filed under appengine">appengine</a> (1)</li>
+            <li class="cat-item cat-item-11"><a href="http://juplo.de/category/oauth2/" title="View all posts filed under oauth2">oauth2</a> (1)</li>
+          </ul>
+        </aside>
+        <aside id="search" class="widget widget_search">
+          <h1 class="widget-title">Search</h1>
+          <form role="search" method="get" id="searchform" class="searchform" action="http://juplo.de/">
+            <div>
+              <label class="screen-reader-text" for="s">Search for:</label>
+              <input type="text" value="" name="s" id="s" />
+              <input type="submit" id="searchsubmit" value="Search" />
+            </div>
+          </form>
+        </aside>
+      </div><!-- #secondary .widget-area -->
+      <div id="tertiary" class="widget-area" role="supplementary">
+      </div><!-- #tertiary .widget-area -->
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/contact.html b/src/main/webapp/thymeleaf/contact.html
new file mode 100644
index 00000000..4ab82c67
--- /dev/null
+++ b/src/main/webapp/thymeleaf/contact.html
@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Contact</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="about.html" th:href="@{/about.html}">About</a></li>
+      <li class="b"><strong class="b">Contact</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m selected">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="about.html" th:href="@{/about.html}" class="s">About</a></h2>
+      <ul id="submenu">
+        <li class="s sub"><a href="expertise.html" th:href="@{/expertise.html}" class="s">Expertise</a></li>
+        <li class="s sub"><a href="references.html" th:href="@{/references.html}" class="s">References</a></li>
+        <li class="s"><strong class="s">Contact</strong></li>
+      </ul>
+    </nav>
+    <div id="content" class="main pack cf" layout:fragment="maincontent">
+      <div class="pack">
+        <div class="p left">
+          <img class="p" src="../img/kai-moritz.jpg" th:src="@{/img/kai-moritz.jpg}" alt="Portrait"/>
+        </div>
+        <article class="p right">
+          <header><h1><t:getAsString name="title"/></h1></header>
+          <h2>Address</h2>
+          <p>
+            Kai Moritz<br />
+            Zumsandestr. 29a<br />
+            48145 Münster
+          </p>
+          <h2>Email</h2>
+          <p><a href="mailto:kai@juplo.de">kai@juplo.de</a></p>
+          <h2>Phone</h2>
+          <p>+49 (0) 176 20 50 47 47</p>
+          <h2>Networking</h2>
+          <ul>
+            <li><a href="https://www.google.com/+KaiMoritz" title="Google+">www.google.com/+KaiMoritz</a></li>
+            <li><a href="https://www.xing.com/profile/Kai_Moritz" title="Xing">www.xing.com/profile/Kai_Moritz</a></li>
+          </ul>
+          <!--
+          <h2>About Me</h2>
+          <h2><em>Übersetzung?!?</em> Jobportale</h2>
+          -->
+        </article>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/datenschutz.html b/src/main/webapp/thymeleaf/datenschutz.html
new file mode 100644
index 00000000..44cc9ea5
--- /dev/null
+++ b/src/main/webapp/thymeleaf/datenschutz.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Datenschutz</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a href="impressum.html" th:href="@{/impressum.html}" class="b">Impressum</a></li>
+      <li class="b"><strong class="b">Datenschutz</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="impressum.html" th:href="@{/impressum.html}" class="s selected">Impressum</a></h2>
+      <ul id="submenu">
+        <li class="s"><a href="agb.html" th:href="@{/agb.html}" class="s">AGB</a></li>
+        <li class="s"><a href="haftung-inhalte.html" th:href="@{/haftung-inhalte.html}" class="s">Haftung für Inhalte</a></li>
+        <li class="s"><a href="haftung-links.html" th:href="@{/haftung-links.html}" class="s">Haftung für Links</a></li>
+        <li class="s"><a href="urheberrechte.html" th:href="@{/urheberrechte.html}" class="s">Urheberrechte</a></li>
+        <li class="s"><strong class="s">Datenschutz</strong></li>
+        <li class="s"><a href="google-analytics.html" th:href="@{/google-analytics.html}" class="s">Google Analytics</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Datenschutz</h1></header>
+      <p>Die Nutzung unserer Webseite ist in der Regel ohne Angabe personenbezogener Daten möglich. Soweit auf unseren Seiten personenbezogene Daten (beispielsweise Name, Anschrift oder eMail-Adressen) erhoben werden, erfolgt dies, soweit möglich, stets auf freiwilliger Basis. Diese Daten werden ohne Ihre ausdrückliche Zustimmung nicht an Dritte weitergegeben.</p>
+      <p>Wir weisen darauf hin, dass die Datenübertragung im Internet (z.B. bei der Kommunikation per E-Mail) Sicherheitslücken aufweisen kann. Ein lückenloser Schutz der Daten vor dem Zugriff durch Dritte ist nicht möglich.</p>
+      <p>Der Nutzung von im Rahmen der Impressumspflicht veröffentlichten Kontaktdaten durch Dritte zur Übersendung von nicht ausdrücklich angeforderter Werbung und Informationsmaterialien wird hiermit ausdrücklich widersprochen. Die Betreiber der Seiten behalten sich ausdrücklich rechtliche Schritte im Falle der unverlangten Zusendung von Werbeinformationen, etwa durch Spam-Mails, vor.</p>
+      <!-- http://www.e-recht24.de/impressum-generator.html -->
+      <p>Bitte beachten Sie auch die gesonderte <a href="google-analytics.html" th:href="@{/google-analytics.html}">Datenschutzerklärung zur Nutzung von Google-Analytics</a>.</p>
+    </article>
+    <aside layout:fragment="marginalcontent" th:include="templates/fragments :: about"></aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/error.html b/src/main/webapp/thymeleaf/error.html
new file mode 100644
index 00000000..a07dc238
--- /dev/null
+++ b/src/main/webapp/thymeleaf/error.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:tiles="http://www.thymeleaf.org">
+  <head>
+    <title tiles:fragment="title">An unexpected Error occured!</title>
+  </head>
+  <body>
+    <div tiles:fragment="content">
+      <p>We do not know, what happend.</p>
+      <p>But we can tell you: WE ARE SORRY!</p>
+      <p>Really.</p>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/expertise.html b/src/main/webapp/thymeleaf/expertise.html
new file mode 100644
index 00000000..726fa2b8
--- /dev/null
+++ b/src/main/webapp/thymeleaf/expertise.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Expertise</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="about.html" th:href="@{/about.html}">About</a></li>
+      <li class="b"><strong class="b">Expertise</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m selected">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="about.html" th:href="@{/about.html}" class="s">About</a></h2>
+      <ul id="submenu">
+        <li class="s sub">
+          <strong class="s">Expertise</strong>
+          <ul class="s active">
+            <li class="s"><span href="web-engineering.html" th:href="@{/web-engineering.html}" class="s">Web-Engineering</span></li>
+            <li class="s"><span href="spring-framework.html" th:href="@{/spring-framework.html}" class="s">Spring Framework</span></li>
+            <li class="s"><span href=".html" th:href="@{/.html}" class="s"></span></li>
+            <li class="s"><span href="responsive-web-design.html" th:href="@{/responsive-web-design.html}" class="s">Responsive Webdesign</span></li>
+            <li class="s"><span href="web-ui-esign.html" th:href="@{/web-ui-esign.html}" class="s">WEB-UI-Design</span></li>
+            <li class="s"><span href="seo.html" th:href="@{/seo.html}" class="s">SEO</span></li>
+          </ul>
+        </li>
+        <li class="s sub off"><a href="references.html" th:href="@{/references.html}" class="s">References</a></li>
+        <li class="s off"><a href="contact.html" th:href="@{/contact.html}" class="s">Contact</a></li>
+      </ul>
+    </nav>
+    <div layout:fragment="maincontent" layout:replace="templates/fragments :: wip ('Expertise')"></div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/google-analytics.html b/src/main/webapp/thymeleaf/google-analytics.html
new file mode 100644
index 00000000..dd2a109a
--- /dev/null
+++ b/src/main/webapp/thymeleaf/google-analytics.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Google Analytics</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a href="impressum.html" th:href="@{/impressum.html}" class="b">Impressum</a></li>
+      <li class="b"><strong class="b">Google Analytics</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="impressum.html" th:href="@{/impressum.html}" class="s selected">Impressum</a></h2>
+      <ul id="submenu">
+        <li class="s"><a href="agb.html" th:href="@{/agb.html}" class="s">AGB</a></li>
+        <li class="s"><a href="haftung-inhalte.html" th:href="@{/haftung-inhalte.html}" class="s">Haftung für Inhalte</a></li>
+        <li class="s"><a href="haftung-links.html" th:href="@{/haftung-links.html}" class="s">Haftung für Links</a></li>
+        <li class="s"><a href="urheberrechte.html" th:href="@{/urheberrechte.html}" class="s">Urheberrechte</a></li>
+        <li class="s"><a href="datenschutz.html" th:href="@{/datenschutz.html}" class="s">Datenschutz</a></li>
+        <li class="s"><strong class="s">Google Analytics</strong></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Google Analytics</h1></header>
+      <p>Diese Website benutzt Google Analytics, einen Webanalysedienst der Google Inc. ("Google"). Google Analytics verwendet sog. "Cookies", Textdateien, die auf Ihrem Computer gespeichert werden und die eine Analyse der Benutzung der Website durch Sie ermöglichen. Die durch den Cookie erzeugten Informationen über Ihre Benutzung dieser Website werden in der Regel an einen Server von Google in den USA übertragen und dort gespeichert. Im Falle der Aktivierung der IP-Anonymisierung auf dieser Webseite wird Ihre IP-Adresse von Google jedoch innerhalb von Mitgliedstaaten der Europäischen Union oder in anderen Vertragsstaaten des Abkommens über den Europäischen Wirtschaftsraum zuvor gekürzt.</p>
+      <p>Nur in Ausnahmefällen wird die volle IP-Adresse an einen Server von Google in den USA übertragen und dort gekürzt. Im Auftrag des Betreibers dieser Website wird Google diese Informationen benutzen, um Ihre Nutzung der Website auszuwerten, um Reports über die Websiteaktivitäten zusammenzustellen und um weitere mit der Websitenutzung und der Internetnutzung verbundene Dienstleistungen gegenüber dem Websitebetreiber zu erbringen. Die im Rahmen von Google Analytics von Ihrem Browser übermittelte IP-Adresse wird nicht mit anderen Daten von Google zusammengeführt.</p>
+      <p>Sie können die Speicherung der Cookies durch eine entsprechende Einstellung Ihrer Browser-Software verhindern; wir weisen Sie jedoch darauf hin, dass Sie in diesem Fall gegebenenfalls nicht sämtliche Funktionen dieser Website vollumfänglich werden nutzen können. Sie können darüber hinaus die Erfassung der durch das Cookie erzeugten und auf Ihre Nutzung der Website bezogenen Daten (inkl. Ihrer IP-Adresse) an Google sowie die Verarbeitung dieser Daten durch Google verhindern, indem sie das unter dem folgenden Link verfügbare Browser-Plugin herunterladen und installieren:</p>
+      <p><a href="http://tools.google.com/dlpage/gaoptout?hl=de" title="Das Plugin jetzt herunterladen...">http://tools.google.com/dlpage/gaoptout?hl=de</a>.</p>
+      <!-- http://www.e-recht24.de/impressum-generator.html -->
+    </article>
+    <aside layout:fragment="marginalcontent" th:include="templates/fragments :: about"></aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/haftung-inhalte.html b/src/main/webapp/thymeleaf/haftung-inhalte.html
new file mode 100644
index 00000000..42b12cfb
--- /dev/null
+++ b/src/main/webapp/thymeleaf/haftung-inhalte.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Haftung für Inhalte</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a href="impressum.html" th:href="@{/impressum.html}" class="b">Impressum</a></li>
+      <li class="b"><strong class="b">Haftung für Inhalte</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="impressum.html" th:href="@{/impressum.html}" class="s selected">Impressum</a></h2>
+      <ul id="submenu">
+        <li class="s"><a href="agb.html" th:href="@{/agb.html}" class="s">AGB</a></li>
+        <li class="s"><strong class="s">Haftung für Inhalte</strong></li>
+        <li class="s"><a href="haftung-links.html" th:href="@{/haftung-links.html}" class="s">Haftung für Links</a></li>
+        <li class="s"><a href="urheberrechte.html" th:href="@{/urheberrechte.html}" class="s">Urheberrechte</a></li>
+        <li class="s"><a href="datenschutz.html" th:href="@{/datenschutz.html}" class="s">Datenschutz</a></li>
+        <li class="s"><a href="google-analytics.html" th:href="@{/google-analytics.html}" class="s">Google Analytics</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Haftung für Inhalte</h1></header>
+      <p>Sämtliche Inhalte unserer Internetseiten sind mit größtmöglicher Sorgfalt erstellt worden. Dennoch ist es uns nicht möglich, eine Gewähr dafür zu übernehmen, dass diese Inhalte richtig, vollständig und aktuell sind. Wir sind gemäß § 7 Abs. 1 TMG für die eigenen Inhalte auf unseren Internetseiten verantwortlich. Gemäß den §§ 8, 9 und 10 TMG besteht für uns allerdings keine Verpflichtung, dass wir Informationen von Dritten, die übermittelt oder gespeichert wurden, überwachen oder Umstände ausforschen müssten, die Hinweise auf nicht rechtmäßige Tätigkeiten ergeben. Davon nicht berührt, ist unsere Verpflichtung zur Sperrung oder Entfernung von Informationen, welche uns von den allgemeinen Gesetzen auferlegt wird. Wir haften allerdings insoweit erst in dem Moment, in dem wir von einer konkreten Verletzung von Rechten Kenntnis erlangen. Wenn wir von einer solchen Verletzung von Rechten Kenntnis erlangen, wird eine unverzügliche Entfernung der entsprechenden Inhalte erfolgen.</p>
+      <p><em>Quelle: <a href="http://www.flegl-rechtsanwaelte.de/rechtstipps/muster-impressum-gewerbliche-homepage">www.flegl-rechtsanwaelte.de</a></em></p>
+    </article>
+    <aside layout:fragment="marginalcontent" th:include="templates/fragments :: about"></aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/haftung-links.html b/src/main/webapp/thymeleaf/haftung-links.html
new file mode 100644
index 00000000..69164df3
--- /dev/null
+++ b/src/main/webapp/thymeleaf/haftung-links.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Haftung für Links</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a href="impressum.html" th:href="@{/impressum.html}" class="b">Impressum</a></li>
+      <li class="b"><strong class="b">Haftung für Links</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="impressum.html" th:href="@{/impressum.html}" class="s selected">Impressum</a></h2>
+      <ul id="submenu">
+        <li class="s"><a href="agb.html" th:href="@{/agb.html}" class="s">AGB</a></li>
+        <li class="s"><a href="haftung-inhalte.html" th:href="@{/haftung-inhalte.html}" class="s">Haftung für Inhalte</a></li>
+        <li class="s"><strong class="s">Haftung für Links</strong></li>
+        <li class="s"><a href="urheberrechte.html" th:href="@{/urheberrechte.html}" class="s">Urheberrechte</a></li>
+        <li class="s"><a href="datenschutz.html" th:href="@{/datenschutz.html}" class="s">Datenschutz</a></li>
+        <li class="s"><a href="google-analytics.html" th:href="@{/google-analytics.html}" class="s">Google Analytics</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Haftung für Links</h1></header>
+      <p>Unsere Internetseiten enthalten Links, die zu externen Internetseiten von Dritten führen. Auf die Inhalte dieser externen Seiten haben wir keine Einflussmöglichkeiten. Es ist uns daher nicht möglich, eine Gewähr für diese Inhalte zu übernehmen. Die Verantwortung dafür hat immer der jeweilige Anbieter/Betreiber der entsprechenden Internetseiten. Wir überprüfen die von uns verlinkten Internetseiten zum Zeitpunkt der Verlinkung auf einen möglichen Rechtsverstoß. Die Verlinkung kommt nur dann zustande, wenn ein rechtswidriger Inhalt zu diesem Zeitpunkt nicht erkennbar ist. Es kann uns jedoch, ohne einen konkreten Anhaltspunkt, nicht zugemutet werden, ständig die verlinkten Internetseiten inhaltlich zu kontrollieren. Wenn wir jedoch von einer Rechtsverletzung Kenntnis erlangen, werden wir den entsprechenden Link unverzüglich entfernen.</p>
+      <p><em>Quelle: <a href="http://www.flegl-rechtsanwaelte.de/rechtstipps/muster-impressum-gewerbliche-homepage">www.flegl-rechtsanwaelte.de</a></em></p>
+    </article>
+    <aside layout:fragment="marginalcontent" th:include="templates/fragments :: about"></aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/impressum.html b/src/main/webapp/thymeleaf/impressum.html
new file mode 100644
index 00000000..69e1007f
--- /dev/null
+++ b/src/main/webapp/thymeleaf/impressum.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Impressum</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><strong class="b">Impressum</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><strong class="s">Impressum</strong></h2>
+      <ul id="submenu">
+        <li class="s"><a href="agb.html" th:href="@{/agb.html}" class="s">AGB</a></li>
+        <li class="s"><a href="haftung-inhalte.html" th:href="@{/haftung-inhalte.html}" class="s">Haftung für Inhalte</a></li>
+        <li class="s"><a href="haftung-links.html" th:href="@{/haftung-links.html}" class="s">Haftung für Links</a></li>
+        <li class="s"><a href="urheberrechte.html" th:href="@{/urheberrechte.html}" class="s">Urheberrechte</a></li>
+        <li class="s"><a href="datenschutz.html" th:href="@{/datenschutz.html}" class="s">Datenschutz</a></li>
+        <li class="s"><a href="google-analytics.html" th:href="@{/google-analytics.html}" class="s">Google Analytics</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Impressum</h1></header>
+      <p><em>Angaben gemäß § 5 TMG:</em></p>
+      <p>
+        Kai Moritz<br />
+        juplo.de<br />
+        Zumsandestr. 29a<br />
+        48145 Münster
+      </p>
+      <p>Telefon: +49 (0) 176 20 50 47 47</p>
+      <p>E-Mail: <a href="mailto:kai@juplo.de">kai@juplo.de</a></p>
+      <p>Umsatzsteuer-Identifikationsnummer gemäß §27 a Umsatzsteuergesetz: DE 23 500 84 56</p>
+      <p>Aufsichtsbehörde: Stadt Münster</p>
+      <!-- http://www.e-recht24.de/impressum-generator.html -->
+      <h1>Contact</h1>
+      <p>
+        More contact-information (Facebook, Google+, ...) can be found on the
+        <a href="contact.html" th:href="@{/contact.html}" title="Show all contact-informations">contact-page</a>.
+      </p>
+    </article>
+    <aside layout:fragment="marginalcontent" th:include="templates/fragments :: about"></aside>
+    <ul layout:fragment="footer">
+      <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
+      <li class="f"><strong class="f">Impressum</strong></li>
+      <li class="f about"><a class="f" href="about.html" th:href="@{/about.html}">About</a></li>
+    </ul>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/index.html b/src/main/webapp/thymeleaf/index.html
new file mode 100644
index 00000000..020e746b
--- /dev/null
+++ b/src/main/webapp/thymeleaf/index.html
@@ -0,0 +1,136 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="contentclass='nomenu'"
+    >
+  <head>
+    <title>Home</title>
+    <link rel="stylesheet/less" type="text/css" href="../less/all.less" th:remove="all"/>
+    <script src="../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><strong class="b">Home</strong></li>
+    </ol>
+    <h1 layout:fragment="header"><strong class="l">juplo</strong></h1>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><a href="../blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="../projects" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <main class="main" layout:fragment="maincontent">
+      <div class="pack bg cf">
+        <div class="p left">
+          <h2>hibernate4-maven-plugin</h2>
+          <p>
+            <strong>Lorem ipsum</strong> dolor
+            <a href="projects/typo.html" th:href="@{/projects/typo.html}">sit amet</a>,
+            consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
+            labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
+            <a href="projects/html-experimente.html" th:href="@{/projects/html-experimente.html}">exercitation</a>
+            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>
+        <div class="p right">
+          <h2>fix-swf</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>
+        </div>
+      </div>
+      <div class="single">
+        <h2>accelerator</h2>
+        <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>
+      <div class="pack bg cf">
+        <div class="p right">
+          <h2>jquery.openx</h2>
+          <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>
+        <div class="p left">
+          <h2>Regex-Lab</h2>
+          <p>
+            Excepteur sint occaecat cupidatat non proident, sunt in
+            culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </div>
+      </div>
+      <div class="pack cf">
+        <div class="p left">
+          <h2>jquery.openx</h2>
+          <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>
+        <div class="p right">
+          <h2>Regex-Lab</h2>
+          <p>
+            Excepteur sint occaecat cupidatat non proident, sunt in
+            culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </div>
+      </div>
+    </main>
+    <div layout:fragment="marginalcontent">
+      <aside class="m">
+        <div class="widget widget_recent_entries">
+          <h2 class="widgettitle">Recent Posts</h2>
+          <ul>
+            <li>
+              <a href="blog/article.html" th:href="@{/blog/article.html}" title="Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</a>
+            </li>
+            <li>
+              <a href="#" title="hibernate4-maven-plugin 1.0.3 released!">hibernate4-maven-plugin 1.0.3 released!</a>
+            </li>
+            <li>
+              <a href="#" title="Log out from wrong Account with maven-appengine-plugin">Log out from wrong Account with maven-appengine-plugin</a>
+            </li>
+            <li>
+              <a href="#" title="Bidirectional Association with @ElementCollection">Bidirectional Association with @ElementCollection</a>
+            </li>
+            <li>
+              <a href="#" title="hibernate4-maven-plugin 1.0.2 released!">hibernate4-maven-plugin 1.0.2 released!</a>
+            </li>
+            <li>
+              <a href="#" title="hibernate4-maven-plugin 1.0.1 released!">hibernate4-maven-plugin 1.0.1 released!</a>
+            </li>
+            <li>
+              <a href="#" title="hibernate4-maven-plugin 1.0 released!">hibernate4-maven-plugin 1.0 released!</a>
+            </li>
+            <li>
+              <a href="blog/comments.html" th:href="@{/blog/comments.html}" title="hibernate4-maven-plugin">hibernate4-maven-plugin</a>
+            </li>
+          </ul>
+        </div>
+      </aside>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects.html b/src/main/webapp/thymeleaf/projects.html
new file mode 100644
index 00000000..c6caa879
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Projects'"
+    >
+  <head>
+    <title>Projects</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><strong class="b">Projects</strong></li>
+    </ol>
+    <ul layout:fragment="submenu">
+      <li class="s sub"><a href="#" class="s">hibernate4-maven-plugin</a></li>
+      <li class="s sub"><a href="projects/fix-swf.html" th:href="@{/projects/fix-swf.html}" class="s">fix-swf</a></li>
+      <li class="s"><a href="#" class="s">jquery.openx</a></li>
+      <li class="s sub"><a href="projects/html-experimente.html" th:href="@{/projects/html-experimente.html}" class="s">HTML-Experimente</a></li>
+      <li class="s sub"><a href="#" class="s">accelerator</a></li>
+      <li class="s"><a href="projects/typo.html" th:href="@{/projects/typo.html}" class="s">Typography</a></li>
+    </ul>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/fix-swf.html b/src/main/webapp/thymeleaf/projects/fix-swf.html
new file mode 100644
index 00000000..049e01da
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/fix-swf.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Fix SWF'"
+    >
+  <head>
+    <title>Fix SWF</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><strong class="b">Fix SWF</strong></li>
+    </ol>
+    <ul layout:fragment="submenu">
+      <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
+      <li class="s sub">
+        <strong class="s">fix-swf</strong>
+        <ul class="s active">
+          <li class="s"><a href="../projects/fix-swf/overview.html" th:href="@{/projects/fix-swf/overview.html}" class="s">Overview</a></li>
+          <li class="s"><a href="../projects/fix-swf/getting-started.html" th:href="@{/projects/fix-swf/getting-started.html}" class="s">Getting Started</a></li>
+          <li class="s"><a href="#" class="s">FAQ</a></li>
+          <li class="s"><a href="#" class="s">Documentation</a></li>
+        </ul>
+      </li>
+      <li class="s off"><a href="#" class="s">jquery.openx</a></li>
+      <li class="s sub off"><a href="../projects/html-experimente.html" th:href="@{/projects/html-experimente.html}" class="s">HTML-Experimente</a></li>
+      <li class="s sub off"><a href="#" class="s">accelerator</a></li>
+      <li class="s off"><a href="../projects/typo.html" th:href="@{/projects/typo.html}" class="s">Typography</a></li>
+    </ul>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/fix-swf/getting-started.html b/src/main/webapp/thymeleaf/projects/fix-swf/getting-started.html
new file mode 100644
index 00000000..f761d23f
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/fix-swf/getting-started.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Fix SWF - Getting started'"
+    >
+  <head>
+    <title>Fix SWF - Getting started</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../fix-swf.html" th:href="@{/projects/fix-swf.html}">Fix SWF</a></li>
+      <li class="b"><strong class="b">Getting Started</strong></li>
+    </ol>
+    <ul layout:fragment="submenu">
+      <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
+      <li class="s sub">
+        <a href="../fix-swf.html" th:href="@{/projects/fix-swf.html}" class="s selected">fix-swf</a>
+        <ul class="s active">
+          <li class="s"><a href="overview.html" th:href="@{/projects/fix-swf/overview.html}" class="s">Overview</a></li>
+          <li class="s"><strong class="s">Getting Started</strong></li>
+          <li class="s"><a href="#" class="s">FAQ</a></li>
+          <li class="s"><a href="#" class="s">Documentation</a></li>
+        </ul>
+      </li>
+      <li class="s off"><a href="#" class="s">jquery.openx</a></li>
+      <li class="s sub off"><a href="../html-experimente.html" th:href="@{/projects/html-experimente.html}" class="s">HTML-Experimente</a></li>
+      <li class="s sub off"><a href="#" class="s">accelerator</a></li>
+      <li class="s off"><a href="../typo.html" th:href="@{/projects/typo.html}" class="s">Typography</a></li>
+    </ul>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/fix-swf/overview.html b/src/main/webapp/thymeleaf/projects/fix-swf/overview.html
new file mode 100644
index 00000000..f2b5a6d4
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/fix-swf/overview.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Fix SWF - Overview'"
+    >
+  <head>
+    <title>Fix SWF - Overview</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../fix-swf.html" th:href="@{/projects/fix-swf.html}">Fix SWF</a></li>
+      <li class="b"><strong class="b">Overview</strong></li>
+    </ol>
+    <ul layout:fragment="submenu">
+      <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
+      <li class="s sub">
+        <a href="../fix-swf.html" th:href="@{/projects/fix-swf.html}" class="s selected">fix-swf</a>
+        <ul class="s active">
+          <li class="s"><strong class="s">Overview</strong></li>
+          <li class="s"><a href="getting-started.html" th:href="@{/projects/fix-swf/getting-started.html}" class="s">Getting Started</a></li>
+          <li class="s"><a href="#" class="s">FAQ</a></li>
+          <li class="s"><a href="#" class="s">Documentation</a></li>
+        </ul>
+      </li>
+      <li class="s off"><a href="#" class="s">jquery.openx</a></li>
+      <li class="s sub off"><a href="../html-experimente.html" th:href="@{/projects/html-experimente.html}" class="s">HTML-Experimente</a></li>
+      <li class="s sub off"><a href="#" class="s">accelerator</a></li>
+      <li class="s off"><a href="../typo.html" th:href="@{/projects/typo.html}" class="s">Typography</a></li>
+    </ul>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente.html b/src/main/webapp/thymeleaf/projects/html-experimente.html
new file mode 100644
index 00000000..e98fff4b
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente.html
@@ -0,0 +1,173 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>HTML-Experimente</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><strong class="b">HTML-Experimente</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:fragment="navigation (page)">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><a href="../blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="../projects.html" th:href="@{/projects.html}" class="m selected">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu">
+        <span class="s">Submenu for section</span>
+        <a class="s selected" href="../projects.html" th:href="@{/projects.html}">Projects</a>
+      </h2>
+      <ul id="submenu" class="s active">
+        <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
+        <li class="s sub off"><a href="../projects/fix-swf.html" th:href="@{/projects/fix-swf.html}" class="s">fix-swf</a></li>
+        <li class="s off"><a href="#" class="s">jquery.openx</a></li>
+        <li class="s sub">
+          <span th:switch="${page}" th:remove="tag">
+            <a th:case="${page}" href="#" th:href="@{/projects/html-experimente.html}" class="s selected">HTML-Experimente</a>
+            <strong th:case="*" class="s">HTML-Experimente</strong>
+          </span>
+          <ul class="s active">
+            <li class="s" th:switch="${page}">
+              <strong th:case="'formulare'" class="s">Formulare</strong>
+              <a th:case="*" class="s" href="formulare.html" th:href="@{/projects/html-experimente/formulare.html}">Formulare</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'symbole'" class="s">Symbol-Font</strong>
+              <a th:case="*" class="s" href="symbole.html" th:href="@{/projects/html-experimente/symbole.html}">Symbol-Font</a>
+            </li>
+            <li class="s">
+              <a class="s" href="../../404.html" th:href="@{/404.html}">404-Template</a>
+            </li>
+            <li class="s">
+              <a class="s" href="gibts-ja-gar-nicht.html" th:href="@{/projects/html-experimente/gibts-ja-gar-nicht.html}">404-Fehlerseite</a>
+            </li>
+            <li class="s">
+              <a class="s" href="../../error.html" th:href="@{/error.html}">5xx-Template</a>
+            </li>
+            <li class="s">
+              <a class="s" href="error.html" th:href="@{/projects/html-experimente/error.html}">5xx-Fehlerseite</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'fast-leer-kein-menü'" class="s">Leer ohne Menü</strong>
+              <a th:case="*" class="s" href="fast-leer-kein-menü.html" th:href="@{/projects/html-experimente/fast-leer-kein-menü.html}">Leer ohne Menü</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'fast-leer-kein-menü-aber-marginalinhalt'" class="s">Leer, ohne Menü, mit Marginal</strong>
+              <a th:case="*" class="s" href="fast-leer-kein-menü-aber-marginalinhalt.html" th:href="@{/projects/html-experimente/fast-leer-kein-menü-aber-marginalinhalt.html}">Leer, ohne Menü, mit Marginal</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'fast-leer-mit-menü'" class="s">Leer, mit Menü</strong>
+              <a th:case="*" class="s" href="fast-leer-mit-menü.html" th:href="@{/projects/html-experimente/fast-leer-mit-menü.html}">Leer, mit Menü</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'fast-leer-mit-menü-und-marginalinhalt'" class="s">Leer, mit Menü, mit Marginal</strong>
+              <a th:case="*" class="s" href="fast-leer-mit-menü-und-marginalinhalt.html" th:href="@{/projects/html-experimente/fast-leer-mit-menü-und-marginalinhalt.html}">Leer, mit Menü, mit Marginal</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'fast-leer-einspaltig'" class="s">Leer, einspaltig</strong>
+              <a th:case="*" class="s" href="fast-leer-einspaltig.html" th:href="@{/projects/html-experimente/fast-leer-einspaltig.html}">Leer, einspaltig</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'fast-leer-einspaltig-mit-marginalinhalt'" class="s">Leer, einspaltig, mit Marginal</strong>
+              <a th:case="*" class="s" href="fast-leer-einspaltig-mit-marginalinhalt.html" th:href="@{/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html}">Leer, einspaltig, mit Marginal</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'breadcrumb'" class="s">Langer Breadcrumb</strong>
+              <a th:case="*" class="s" href="breadcrumb.html" th:href="@{/projects/html-experimente/breadcrumb.html}">Langer Breadcrumb</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'kein-layout'" class="s">Alle Stylings deaktiviert</strong>
+              <a th:case="*" class="s" href="kein-layout.html" th:href="@{/projects/html-experimente/kein-layout.html}">Alle Stylings deaktiviert</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'basis-layout'" class="s">Nur das Basis-Layout</strong>
+              <a th:case="*" class="s" href="basis-layout.html" th:href="@{/projects/html-experimente/basis-layout.html}">Nur das Basis-Layout</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'druck-layout'" class="s">Druck-Layout</strong>
+              <a th:case="*" class="s" href="druck-layout.html" th:href="@{/projects/html-experimente/druck-layout.html}">Druck-Layout</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'tiny'" class="s">Layout TINY</strong>
+              <a th:case="*" class="s" href="tiny.html" th:href="@{/projects/html-experimente/tiny.html}">Layout TINY</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'phone'" class="s">Layout PHONE</strong>
+              <a th:case="*" class="s" href="phone.html" th:href="@{/projects/html-experimente/phone.html}">Layout PHONE</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'tablet'" class="s">Layout Tablet</strong>
+              <a th:case="*" class="s" href="tablet.html" th:href="@{/projects/html-experimente/tablet.html}">Layout TABLET</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'seitenaufteilung'" class="s">Basis-Layout &amp; Seitenaufteilung</strong>
+              <a th:case="*" class="s" href="seitenaufteilung.html" th:href="@{/projects/html-experimente/seitenaufteilung.html}">Basis-Layout &amp; Seitenaufteilung</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'seitenkopf'" class="s">Basis-Layout &amp; Seitenkopf</strong>
+              <a th:case="*" class="s" href="seitenkopf.html" th:href="@{/projects/html-experimente/seitenkopf.html}">Basis-Layout &amp; Seitenkopf</a>
+            </li>
+            <li class="s" th:switch="${page}">
+              <strong th:case="'media-query'" class="s">Media-Query-Test (Beispiel)</strong>
+              <a th:case="*" class="s" href="testlab.html" th:href="@{/projects/html-experimente/testlab.html}">Media-Query-Test (Beispiel)</a>
+            </li>
+          </ul>
+        </li>
+        <li class="s sub off"><a href="#" class="s">accelerator</a></li>
+        <li class="s off"><a href="../projects/typo.html" th:href="@{/projects/typo.html}" class="s">Typography</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>HTML-Elemente / spezielle Seiten</h1></header>
+      <ul>
+        <li><a href="html-experimente/formulare.html" th:href="@{/projects/html-experimente/formulare.html}">Formulare</a></li>
+        <li><a href="html-experimente/symbole.html" th:href="@{/projects/html-experimente/symbole.html}">Symbol-Font</a></li>
+        <li><a href="../404.html" th:href="@{/404.html}">404-Template</a></li>
+        <li><a href="html-experimente/gibts-ja-gar-nicht.html" th:href="@{/projects/html-experimente/gibts-ja-gar-nicht.html}">404-Fehlerseite</a></li>
+        <li><a href="../error.html" th:href="@{/error.html}">Template für andere Fehler</a></li>
+        <li><a href="html-experimente/error.html" th:href="@{/projects/html-experimente/error.html}">Fehlerseite für andere Fehler</a></li>
+      </ul>
+      <h2>Layout-Grenzfälle</h2>
+      <ul>
+        <li><a href="html-experimente/fast-leer-kein-menü.html" th:href="@{/projects/html-experimente/fast-leer-kein-menü.html}">Fast leere Seite ohne Menü</a></li>
+        <li><a href="html-experimente/fast-leer-kein-menü-aber-marginalinhalt.html" th:href="@{/projects/html-experimente/fast-leer-kein-menü-aber-marginalinhalt.html}">Fast leere Seite ohne Menü aber mit Marginal-Inhalt</a></li>
+        <li><a href="html-experimente/fast-leer-mit-menü.html" th:href="@{/projects/html-experimente/fast-leer-mit-menü.html}">Fast leere Seite mit Menü</a></li>
+        <li><a href="html-experimente/fast-leer-mit-menü-und-marginalinhalt.html" th:href="@{/projects/html-experimente/fast-leer-mit-menü-und-marginalinhalt.html}">Fast leere Seite mit Menü und Marginal-Inhalt</a></li>
+        <li><a href="html-experimente/fast-leer-einspaltig.html" th:href="@{/projects/html-experimente/fast-leer-einspaltig.html}">Fast leere einspaltige Seite</a></li>
+        <li><a href="html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html" th:href="@{/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html}">Fast leere einspaltige Seite mit Marginal-Inhalt</a></li>
+        <li><a href="html-experimente/breadcrumb.html" th:href="@{/projects/html-experimente/breadcrumb.html}">Seite mit sehr langem Breadcrumb</a></li>
+      </ul>
+      <h2>Layout-Variationen</h2>
+      <ul>
+        <li><a href="html-experimente/kein-layout.html" th:href="@{/projects/html-experimente/kein-layout.html}">Alle Stylings deaktiviert</a></li>
+        <li><a href="html-experimente/basis-layout.html" th:href="@{/projects/html-experimente/basis-layout.html}">Nur das Basis-Layout</a></li>
+        <li><a href="html-experimente/druck-layout.html" th:href="@{/projects/html-experimente/druck-layout.html}">Die für den Ausdruck angepasste Ansicht</a></li>
+        <li><a href="html-experimente/tiny.html" th:href="@{/projects/html-experimente/tiny.html}">Layout für sehr kleine Bildschirmgrößen</a></li>
+        <li><a href="html-experimente/phone.html" th:href="@{/projects/html-experimente/phone.html}">Layout für Smartphones</a></li>
+        <li><a href="html-experimente/tablet.html" th:href="@{/projects/html-experimente/tablet.html}">Layout für Tablets</a></li>
+      </ul>
+      <h2>Testseiten für einzelne Seiten-Bestandteile</h2>
+      <ul>
+        <li><a href="html-experimente/seitenaufteilung.html" th:href="@{/projects/html-experimente/seitenaufteilung.html}">Nur das Basis-Layout und die Seitenaufteilung</a></li>
+        <li><a href="html-experimente/seitenkopf.html" th:href="@{/projects/html-experimente/seitenkopf.html}">Nur das Basis-Layout und der Seitenkopf</a></li>
+      </ul>
+      <h2>Anderer Krams...</h2>
+      <ul>
+        <li><a href="html-experimente/testlab.html" th:href="@{/projects/html-experimente/testlab.html}">Seite mit Breiten-Markierungen für den Tests von Media-Queries (Beispiel)</a></li>
+      </ul>
+    </article>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/basis-layout.html b/src/main/webapp/thymeleaf/projects/html-experimente/basis-layout.html
new file mode 100644
index 00000000..96af7d45
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/basis-layout.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Nur das Basis-Layout'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Basis-Layout</title>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/base.css" th:href="@{/css/base.css}"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Nur das Basis-Layout</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('basis-layout')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/breadcrumb.html b/src/main/webapp/thymeleaf/projects/html-experimente/breadcrumb.html
new file mode 100644
index 00000000..cb02442f
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/breadcrumb.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Seite mit sehr langem Breadcrumb'"
+    >
+  <head>
+    <title>HTML-Experimente - Langer Breadcrumb</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Dies ist ein Seite mit einem unendlich langen Breadcrumb-Eintrag der bestimmt nicht in den vorgesehenen Platz passt</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('breadcrumb')">
+      NAVIGATION
+    </nav>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/druck-layout.html b/src/main/webapp/thymeleaf/projects/html-experimente/druck-layout.html
new file mode 100644
index 00000000..0b3a475f
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/druck-layout.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Die für den Ausdruck angepasste Ansicht'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Druck-Layout</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../css/print.css" th:href="@{/css/print.css}"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Druck-Layout</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('druck-layout')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html
new file mode 100644
index 00000000..9a98cf18
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="contentclass='nomenu'"
+    >
+  <head>
+    <title>HTML-Experimente - Fast leere einspaltige Seite mit Marginalinhalt</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Leer, einspaltig, Marginal</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><a href="../blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="../projects.html" th:href="@{/projects.html}" class="m selected">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Fast leere einspaltige Seite mit Marginalinhalt</h1></header>
+    </article>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-einspaltig.html b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-einspaltig.html
new file mode 100644
index 00000000..d7a32139
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-einspaltig.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="contentclass='nomenu'"
+    >
+  <head>
+    <title>HTML-Experimente - Fast leere einspaltige Seite</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Leer, einspaltig</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><a href="../blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="../projects.html" th:href="@{/projects.html}" class="m selected">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Fast leere einspaltige Seite</h1></header>
+    </article>
+  </body>
+</html>
diff --git "a/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274-aber-marginalinhalt.html" "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274-aber-marginalinhalt.html"
new file mode 100644
index 00000000..4081bc7b
--- /dev/null
+++ "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274-aber-marginalinhalt.html"
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>HTML-Experimente - Fast leere Seite ohne Menü aber mit Marginalspalte</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Leer, ohne Menü, mit Marginal</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><a href="../blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="../projects.html" th:href="@{/projects.html}" class="m selected">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Fast leere Seite ohne Menü aber mit Marginalinhalt</h1></header>
+    </article>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git "a/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274.html" "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274.html"
new file mode 100644
index 00000000..b7551c6c
--- /dev/null
+++ "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274.html"
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>HTML-Experimente - Fast leere Seite ohne Menü</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Leer, ohne Menü</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="cf">
+        <li class="m blog"><a href="../blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="../projects.html" th:href="@{/projects.html}" class="m selected">Projects</a></li>
+        <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Fast leere Seite ohne Menü</h1></header>
+    </article>
+  </body>
+</html>
diff --git "a/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274-und-marginalinhalt.html" "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274-und-marginalinhalt.html"
new file mode 100644
index 00000000..9a1f4f34
--- /dev/null
+++ "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274-und-marginalinhalt.html"
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>HTML-Experimente - Fast leere Seite mit Menü und Marginalinhalt</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Leer, mit Menü</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('fast-leer-mit-menü-und-marginalinhalt')">
+      NAVIGATION
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Fast leere Seite mit Menü und Marginalinhalt</h1></header>
+    </article>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git "a/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274.html" "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274.html"
new file mode 100644
index 00000000..c1a17645
--- /dev/null
+++ "b/src/main/webapp/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274.html"
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>HTML-Experimente - Fast leere Seite mit Menü</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Leer, mit Menü</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('fast-leer-mit-menü')">
+      NAVIGATION
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Fast leere Seite mit Menü</h1></header>
+    </article>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/formulare.html b/src/main/webapp/thymeleaf/projects/html-experimente/formulare.html
new file mode 100644
index 00000000..b41f2078
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/formulare.html
@@ -0,0 +1,275 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>HTML-Experimente - Formulare</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Formulare</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('formulare')">
+      NAVIGATION
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Formulare</h1></header>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Anzeigetext</h2>
+        <div class="f textarea">
+          <label class="f info" for="textarea_01">Geben Sie hier Ihren Anzeigentext ein.</label>
+          <textarea class="f error" id="textarea_01" cols="50" rows="10">Eingegebener Text</textarea>
+          <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Es wurde kein Text für die Anzeige eingegeben!</span>
+        </div>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Textformatierung</h2>
+        <fieldset class="f radiobutton cf">
+          <legend class="f info">
+            Die zusätzlichen Gestaltungsoptionen sind nur für das Magazin wählbar.<br />
+            Online erscheint die Anzeige als normaler Fließtext.
+          </legend>
+          <hr class="f" />
+          <div class="col2">
+            <div class="f">
+              <input class="f" id="radio_tbox_01" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_01">normaler Fließtext</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_02" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_02">Text zentriert</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_03" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_03">Text fett, Negativdruck</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_04" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_04">Text fett</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_05" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_05">Text fett und rot</label>
+            </div>
+          </div>
+          <div class="col2">
+            <div class="f">
+              <input class="f" id="radio_tbox_06" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_06">Text fett, Anzeige blau hinterlegt</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_07" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_07">Text fett, Anzeige gelb hinterlegt</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_08" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_08">Anzeige schwarz eingerahmt</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_09" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_09">Anzeige rot eingerahmt</label>
+            </div>
+          </div>
+        </fieldset>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Einspaltige Radiobuttons...</h2>
+        <fieldset class="f radiobutton">
+          <div class="f">
+            <input class="f" id="radio_tbox_b01" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_b01">Dies ist eine etwas länglichere Beschreibung der auswählbaren Option</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_b02" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_b02">Option X</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_b03" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_b03">Dies ist eine sehr, sehr lange Beschreibung der auswählbaren Option - so lang, dass sie am Ende hoffentlich umbricht...</label>
+          </div>
+        </fieldset>
+        <hr class="f" />
+        <div class="f submit">
+          <input class="f" type="submit" value="&gt; zur Übersicht" />
+          <input class="f left" type="submit" value="&lt; zurück" />
+          <input class="f" type="submit" value="&gt; weiter" />
+        </div>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Bild</h2>
+        <fieldset class="f checkbox">
+          <legend class="f">
+            Du kannst Deiner Anzeige ein Bild hinzufügen.
+            Das Bild erscheint nur online.
+            Im Magazin erscheint die Kleinanzeige mit Hinweis auf das Onlinebild.
+          </legend>
+          <hr class="f" />
+          <div class="f">
+            <input class="f" id="checkbox_tbox_01" type="checkbox" name="checkbox_tbox" />
+            <label class="f" for="checkbox_tbox_01">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
+          </div>
+          <div class="f">
+            <input class="f" id="checkbox_tbox_02" type="checkbox" name="checkbox_tbox" />
+            <label class="f" for="checkbox_tbox_02">Ich habe die AGB für das Hochladen von Bildern gelesen und akzeptiere diese</label>
+          </div>
+        </fieldset>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Alleinstehende Checkbox</h2>
+        <div class="f checkbox">
+          <input class="f" id="checkbox_tbox_03" type="checkbox" name="checkbox_tbox" />
+          <label class="f" for="checkbox_tbox_03">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
+        </div>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Kundendaten</h2>
+        <p class="f required">
+          <strong class="r">Pflichtfelder</strong> sind mit einem
+          <strong class="r symbol">*</strong> markiert.
+        </p>
+        <div class="f text required">
+          <label for="text_tbox_01" class="f"><span class="required">* </span>Nachname</label>
+          <input class="f" id="text_tbox_01" type="text" value="Mustermann" />
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_02" class="f">Vorname</label>
+          <input class="f" id="text_tbox_02" type="text" value="Max" />
+        </div>
+        <div class="f select required">
+          <label for="text_tbox_03" class="f"><span class="required">* </span>Ort</label>
+          <select class="f" id="text_tbox_03">
+            <option>Dortmund</option>
+            <option>Bochum</option>
+            <option>Essen</option>
+            <option>Mönchengladbach</option>
+            <option>Oberhausen</option>
+            <option>Castrop-Rauxel</option>
+            <option>Düsseldorf</option>
+          </select>
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_04" class="f"><span class="required">* </span>Straße/Hausnr.</label>
+          <input class="f error" id="text_tbox_04" type="text" value="" />
+          <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Dies ist ein Pflichtfeld!</span>
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_05" class="f"><span class="required">* </span>Postleitzahl</label>
+          <input class="f" id="text_tbox_05" type="text" value="" />
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_06" class="f">Telefon</label>
+          <input class="f" id="text_tbox_06" type="text" value="" />
+        </div>
+        <hr class="f" />
+        <div class="f submit">
+          <input class="f" type="submit" value="&gt; weiter" />
+        </div>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Anzeige regionalisieren</h2>
+        <p class="f">
+          Indem Du Deine Kleinanzeige einer Stadt zuordnest, können Interessenten
+          diese online leichter finden, wenn sie nur nach Kleinanzeigen aus
+          bestimmten Städten suchen.
+          Du kannst auch keine Stadt zuordnen, dann wird die Kleinanzeige von
+          diesen Interessenten aber auch nicht gefunden.
+        </p>
+        <hr class="f" />
+        <div class="f text">
+          <label class="f" for="city">Stadt</label>
+          <input id="city" type="text" class="f" />
+          <p class="f info">
+            Das Feld leer lassen, wenn die Anzeige nicht regionalisiert werden soll.
+          </p>
+        </div>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Ein Passwort-Eingabe-Feld</h2>
+        <div class="f text required">
+          <label for="text_tbox_05" class="f"><span class="required">* </span>Passwort</label>
+          <input class="f" id="text_tbox_05" type="password" value="t" />
+        </div>
+      </form>
+      <form class="form" action="#" method="get">
+        <h2 class="f">Lade das Bild hoch</h2>
+        <p class="f info">
+          Du kannst ein Bild im JPEG- oder PNG-Format hochladen.
+          Das Bild darf nicht größer als 8 MByte sein.
+        </p>
+        <div class="f file required">
+          <label for="file_tbox_01" class="f"><span class="required">* </span>Bild</label>
+          <input class="f" id="file_tbox_01" type="file" />
+        </div>
+        <hr class="f" />
+        <div class="f submit">
+          <input class="f" type="submit" value="&gt; Doch kein Bild" />
+          <input class="f" type="submit" value="&gt; Bild hochladen" />
+        </div>
+      </form>
+      <div class="form">
+        <h2 class="f">Antworten</h2>
+        <p class="f required">
+          <strong class="r">Pflichtfelder</strong> sind mit einem
+          <strong class="r symbol">*</strong> markiert.
+        </p>
+        <div class="f text required">
+          <label class="f" for="replyTo"><span class="required">*</span> Antwort-Adresse</label>
+          <input id="replyTo" name="replyTo" class="f" tabindex="1" type="text" value=""/>
+        </div>
+        <div class="f text required">
+          <label class="f" for="replyTo"><span class="required">*</span> Adresse wiederholen</label>
+          <input id="replyToRepeated" name="replyToRepeated" class="f" tabindex="2" type="text" value=""/>
+        </div>
+        <div class="f text required">
+          <label class="f" for="subject"><span class="required">*</span> Betreff</label>
+          <input id="subject" name="subject" class="f" tabindex="3" type="text" value=""/>
+        </div>
+        <div class="f textarea required">
+          <label class="f" for="text"><span class="required">*</span> Nachricht</label>
+          <textarea id="text" name="text" class="f" tabindex="4" rows="15" cols="20"></textarea>
+        </div>
+        <div class="f checkbox">
+          <input id="attachment1" name="attachment" class="f" tabindex="4" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_attachment" value="on"/>
+          <label class="f" for="attachment">Ich möchte eine Datei an die E-Mail anhängen.</label>
+        </div>
+        <div class="f checkbox">
+          <input id="copy1" name="copy" class="f" tabindex="5" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_copy" value="on"/>
+          <label class="f" for="copy">Ich möchte eine Kopie der Nachricht zugesendet bekommen.</label>
+        </div>
+      </div>
+      <div class="form cf">
+        <div class="col2 left">
+          <h2 class="f">Weiter mit Anmeldung</h2>
+          <div class="f text">
+            <label class="f" for="username">Benutzername</label>
+            <input class="f" name="username" id="username" type="text" tabindex="6" />
+          </div>
+          <div class="f text">
+            <label class="f" for="password">Passwort</label>
+            <input class="f" name="password" id="password" type="password" tabindex="7" />
+          </div>
+        </div>
+        <div class="col2 right">
+          <h2 class="f">Weiter ohne Anmeldung</h2>
+          <!-- <a href="/kleinanzeigen/37431/lust+.html" title="Zu schwer? Hier klicken um das Bild zu wechseln!"><img src="/img/captcha.jpg" alt="Captcha" width="120" height="60" /></a> -->
+          <div class="f captcha cf">
+            <span class="f">Was steht da?</span>
+            <img class="f" src="/img/captcha.jpg" alt="Captcha" width="120" height="60" />
+          </div>
+          <div class="f text">
+            <label class="f" for="captcha">Lösung</label>
+            <input class="f" name="captcha" id="captcha" type="text" tabindex="8" />
+          </div>
+        </div>
+      </div>
+    </article>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/kein-layout.html b/src/main/webapp/thymeleaf/projects/html-experimente/kein-layout.html
new file mode 100644
index 00000000..19991b26
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/kein-layout.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Alle Stylings deaktiviert'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Kein Layout</title>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Alle Stylings deaktiviert</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('kein-layout')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/phone.html b/src/main/webapp/thymeleaf/projects/html-experimente/phone.html
new file mode 100644
index 00000000..ef4be025
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/phone.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Layout für Smartphones'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Layout PHONE</title>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/base.css" th:href="@{/css/base.css}"/>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/phone.css" th:href="@{/css/phone.css}"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Layout PHONE</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('phone')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/seitenaufteilung.html b/src/main/webapp/thymeleaf/projects/html-experimente/seitenaufteilung.html
new file mode 100644
index 00000000..517c1341
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/seitenaufteilung.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Nur das Basis-Layout und die Seitenaufteiltung'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Basis-Layout &amp; Seitenaufteilung</title>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/base.css" th:href="@{/css/base.css}"/>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/seitenaufteilung.css" th:href="@{/css/seitenaufteilung.css}"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Basis-Layout &amp; Seitenaufteilung</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('seitenaufteilung')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/seitenkopf.html b/src/main/webapp/thymeleaf/projects/html-experimente/seitenkopf.html
new file mode 100644
index 00000000..72ebd930
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/seitenkopf.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Nur das Basis-Layout und die Seitenaufteiltung'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Basis-Layout &amp; Seitenkopf</title>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/base.css" th:href="@{/css/base.css}"/>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/seitenkopf.css" th:href="@{/css/seitenkopf.css}"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Basis-Layout &amp; Seitenkopf</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('seitenkopf')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/symbole.html b/src/main/webapp/thymeleaf/projects/html-experimente/symbole.html
new file mode 100644
index 00000000..4047a4f7
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/symbole.html
@@ -0,0 +1,422 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>HTML-Experimente - Symbol-Font</title>
+    <link rel="stylesheet/less" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Symbol-Font</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('symbole')">
+      NAVIGATION
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1>Symbol-Font</h1></header>
+      <h2>100%</h2>
+      <div class="symbols">
+        <span class="e600">&#xe600;</span>
+        <span class="e601">&#xe601;</span>
+        <span class="e602">&#xe602;</span>
+        <span class="e603">&#xe603;</span>
+        <span class="e604">&#xe604;</span>
+        <span class="e605">&#xe605;</span>
+        <span class="e606">&#xe606;</span>
+        <span class="e607">&#xe607;</span>
+        <span class="e608">&#xe608;</span>
+        <span class="e609">&#xe609;</span>
+        <span class="e60a">&#xe60a;</span>
+        <span class="e60b">&#xe60b;</span>
+        <span class="e60c">&#xe60c;</span>
+        <span class="e60d">&#xe60d;</span>
+        <span class="e60e">&#xe60e;</span>
+        <span class="e60f">&#xe60f;</span>
+        <span class="e610">&#xe610;</span>
+        <span class="e611">&#xe611;</span>
+        <span class="e612">&#xe612;</span>
+        <span class="e613">&#xe613;</span>
+        <span class="e614">&#xe614;</span>
+        <span class="e615">&#xe615;</span>
+        <span class="e616">&#xe616;</span>
+        <span class="e617">&#xe617;</span>
+        <span class="e618">&#xe618;</span>
+        <span class="e619">&#xe619;</span>
+        <span class="e61a">&#xe61a;</span>
+        <span class="e61b">&#xe61b;</span>
+        <span class="e61c">&#xe61c;</span>
+        <span class="e61d">&#xe61d;</span>
+        <span class="e61e">&#xe61e;</span>
+        <span class="e61f">&#xe61f;</span>
+        <span class="e620">&#xe620;</span>
+        <span class="e621">&#xe621;</span>
+        <span class="e622">&#xe622;</span>
+        <span class="e623">&#xe623;</span>
+        <span class="e624">&#xe624;</span>
+        <span class="e625">&#xe625;</span>
+        <span class="e626">&#xe626;</span>
+        <span class="e627">&#xe627;</span>
+        <span class="e628">&#xe628;</span>
+        <span class="e629">&#xe629;</span>
+        <span class="e62a">&#xe62a;</span>
+        <span class="e62b">&#xe62b;</span>
+        <span class="e62c">&#xe62c;</span>
+        <span class="e62d">&#xe62d;</span>
+        <span class="e62e">&#xe62e;</span>
+        <span class="e62f">&#xe62f;</span>
+        <span class="e630">&#xe630;</span>
+        <span class="e631">&#xe631;</span>
+        <span class="e632">&#xe632;</span>
+        <span class="e633">&#xe633;</span>
+        <span class="e634">&#xe634;</span>
+        <span class="e635">&#xe635;</span>
+        <span class="e636">&#xe636;</span>
+        <span class="e637">&#xe637;</span>
+        <span class="e638">&#xe638;</span>
+        <span class="e639">&#xe639;</span>
+        <span class="e63a">&#xe63a;</span>
+        <span class="e63b">&#xe63b;</span>
+        <span class="e63c">&#xe63c;</span>
+        <span class="e63d">&#xe63d;</span>
+        <span class="e63e">&#xe63e;</span>
+        <span class="e63f">&#xe63f;</span>
+        <span class="e640">&#xe640;</span>
+        <span class="e641">&#xe641;</span>
+        <span class="e642">&#xe642;</span>
+        <span class="e643">&#xe643;</span>
+        <span class="e644">&#xe644;</span>
+        <span class="e645">&#xe645;</span>
+        <span class="e646">&#xe646;</span>
+        <span class="e647">&#xe647;</span>
+        <span class="e648">&#xe648;</span>
+        <span class="e649">&#xe649;</span>
+        <span class="e64a">&#xe64a;</span>
+        <span class="e64b">&#xe64b;</span>
+      </div>
+      <h2>200%</h2>
+      <div class="symbols" style="font-size: 200%; line-height: 1.5em">
+        <span class="e600">&#xe600;</span>
+        <span class="e601">&#xe601;</span>
+        <span class="e602">&#xe602;</span>
+        <span class="e603">&#xe603;</span>
+        <span class="e604">&#xe604;</span>
+        <span class="e605">&#xe605;</span>
+        <span class="e606">&#xe606;</span>
+        <span class="e607">&#xe607;</span>
+        <span class="e608">&#xe608;</span>
+        <span class="e609">&#xe609;</span>
+        <span class="e60a">&#xe60a;</span>
+        <span class="e60b">&#xe60b;</span>
+        <span class="e60c">&#xe60c;</span>
+        <span class="e60d">&#xe60d;</span>
+        <span class="e60e">&#xe60e;</span>
+        <span class="e60f">&#xe60f;</span>
+        <span class="e610">&#xe610;</span>
+        <span class="e611">&#xe611;</span>
+        <span class="e612">&#xe612;</span>
+        <span class="e613">&#xe613;</span>
+        <span class="e614">&#xe614;</span>
+        <span class="e615">&#xe615;</span>
+        <span class="e616">&#xe616;</span>
+        <span class="e617">&#xe617;</span>
+        <span class="e618">&#xe618;</span>
+        <span class="e619">&#xe619;</span>
+        <span class="e61a">&#xe61a;</span>
+        <span class="e61b">&#xe61b;</span>
+        <span class="e61c">&#xe61c;</span>
+        <span class="e61d">&#xe61d;</span>
+        <span class="e61e">&#xe61e;</span>
+        <span class="e61f">&#xe61f;</span>
+        <span class="e620">&#xe620;</span>
+        <span class="e621">&#xe621;</span>
+        <span class="e622">&#xe622;</span>
+        <span class="e623">&#xe623;</span>
+        <span class="e624">&#xe624;</span>
+        <span class="e625">&#xe625;</span>
+        <span class="e626">&#xe626;</span>
+        <span class="e627">&#xe627;</span>
+        <span class="e628">&#xe628;</span>
+        <span class="e629">&#xe629;</span>
+        <span class="e62a">&#xe62a;</span>
+        <span class="e62b">&#xe62b;</span>
+        <span class="e62c">&#xe62c;</span>
+        <span class="e62d">&#xe62d;</span>
+        <span class="e62e">&#xe62e;</span>
+        <span class="e62f">&#xe62f;</span>
+        <span class="e630">&#xe630;</span>
+        <span class="e631">&#xe631;</span>
+        <span class="e632">&#xe632;</span>
+        <span class="e633">&#xe633;</span>
+        <span class="e634">&#xe634;</span>
+        <span class="e635">&#xe635;</span>
+        <span class="e636">&#xe636;</span>
+        <span class="e637">&#xe637;</span>
+        <span class="e638">&#xe638;</span>
+        <span class="e639">&#xe639;</span>
+        <span class="e63a">&#xe63a;</span>
+        <span class="e63b">&#xe63b;</span>
+        <span class="e63c">&#xe63c;</span>
+        <span class="e63d">&#xe63d;</span>
+        <span class="e63e">&#xe63e;</span>
+        <span class="e63f">&#xe63f;</span>
+        <span class="e640">&#xe640;</span>
+        <span class="e641">&#xe641;</span>
+        <span class="e642">&#xe642;</span>
+        <span class="e643">&#xe643;</span>
+        <span class="e644">&#xe644;</span>
+        <span class="e645">&#xe645;</span>
+        <span class="e646">&#xe646;</span>
+        <span class="e647">&#xe647;</span>
+        <span class="e648">&#xe648;</span>
+        <span class="e649">&#xe649;</span>
+        <span class="e64a">&#xe64a;</span>
+        <span class="e64b">&#xe64b;</span>
+      </div>
+      <h2>300%</h2>
+      <div class="symbols" style="font-size: 300%; line-height: 1.5em">
+        <span class="e600">&#xe600;</span>
+        <span class="e601">&#xe601;</span>
+        <span class="e602">&#xe602;</span>
+        <span class="e603">&#xe603;</span>
+        <span class="e604">&#xe604;</span>
+        <span class="e605">&#xe605;</span>
+        <span class="e606">&#xe606;</span>
+        <span class="e607">&#xe607;</span>
+        <span class="e608">&#xe608;</span>
+        <span class="e609">&#xe609;</span>
+        <span class="e60a">&#xe60a;</span>
+        <span class="e60b">&#xe60b;</span>
+        <span class="e60c">&#xe60c;</span>
+        <span class="e60d">&#xe60d;</span>
+        <span class="e60e">&#xe60e;</span>
+        <span class="e60f">&#xe60f;</span>
+        <span class="e610">&#xe610;</span>
+        <span class="e611">&#xe611;</span>
+        <span class="e612">&#xe612;</span>
+        <span class="e613">&#xe613;</span>
+        <span class="e614">&#xe614;</span>
+        <span class="e615">&#xe615;</span>
+        <span class="e616">&#xe616;</span>
+        <span class="e617">&#xe617;</span>
+        <span class="e618">&#xe618;</span>
+        <span class="e619">&#xe619;</span>
+        <span class="e61a">&#xe61a;</span>
+        <span class="e61b">&#xe61b;</span>
+        <span class="e61c">&#xe61c;</span>
+        <span class="e61d">&#xe61d;</span>
+        <span class="e61e">&#xe61e;</span>
+        <span class="e61f">&#xe61f;</span>
+        <span class="e620">&#xe620;</span>
+        <span class="e621">&#xe621;</span>
+        <span class="e622">&#xe622;</span>
+        <span class="e623">&#xe623;</span>
+        <span class="e624">&#xe624;</span>
+        <span class="e625">&#xe625;</span>
+        <span class="e626">&#xe626;</span>
+        <span class="e627">&#xe627;</span>
+        <span class="e628">&#xe628;</span>
+        <span class="e629">&#xe629;</span>
+        <span class="e62a">&#xe62a;</span>
+        <span class="e62b">&#xe62b;</span>
+        <span class="e62c">&#xe62c;</span>
+        <span class="e62d">&#xe62d;</span>
+        <span class="e62e">&#xe62e;</span>
+        <span class="e62f">&#xe62f;</span>
+        <span class="e630">&#xe630;</span>
+        <span class="e631">&#xe631;</span>
+        <span class="e632">&#xe632;</span>
+        <span class="e633">&#xe633;</span>
+        <span class="e634">&#xe634;</span>
+        <span class="e635">&#xe635;</span>
+        <span class="e636">&#xe636;</span>
+        <span class="e637">&#xe637;</span>
+        <span class="e638">&#xe638;</span>
+        <span class="e639">&#xe639;</span>
+        <span class="e63a">&#xe63a;</span>
+        <span class="e63b">&#xe63b;</span>
+        <span class="e63c">&#xe63c;</span>
+        <span class="e63d">&#xe63d;</span>
+        <span class="e63e">&#xe63e;</span>
+        <span class="e63f">&#xe63f;</span>
+        <span class="e640">&#xe640;</span>
+        <span class="e641">&#xe641;</span>
+        <span class="e642">&#xe642;</span>
+        <span class="e643">&#xe643;</span>
+        <span class="e644">&#xe644;</span>
+        <span class="e645">&#xe645;</span>
+        <span class="e646">&#xe646;</span>
+        <span class="e647">&#xe647;</span>
+        <span class="e648">&#xe648;</span>
+        <span class="e649">&#xe649;</span>
+        <span class="e64a">&#xe64a;</span>
+        <span class="e64b">&#xe64b;</span>
+      </div>
+      <h2>400%</h2>
+      <div class="symbols" style="font-size: 400%; line-height: 1.5em">
+        <span class="e600">&#xe600;</span>
+        <span class="e601">&#xe601;</span>
+        <span class="e602">&#xe602;</span>
+        <span class="e603">&#xe603;</span>
+        <span class="e604">&#xe604;</span>
+        <span class="e605">&#xe605;</span>
+        <span class="e606">&#xe606;</span>
+        <span class="e607">&#xe607;</span>
+        <span class="e608">&#xe608;</span>
+        <span class="e609">&#xe609;</span>
+        <span class="e60a">&#xe60a;</span>
+        <span class="e60b">&#xe60b;</span>
+        <span class="e60c">&#xe60c;</span>
+        <span class="e60d">&#xe60d;</span>
+        <span class="e60e">&#xe60e;</span>
+        <span class="e60f">&#xe60f;</span>
+        <span class="e610">&#xe610;</span>
+        <span class="e611">&#xe611;</span>
+        <span class="e612">&#xe612;</span>
+        <span class="e613">&#xe613;</span>
+        <span class="e614">&#xe614;</span>
+        <span class="e615">&#xe615;</span>
+        <span class="e616">&#xe616;</span>
+        <span class="e617">&#xe617;</span>
+        <span class="e618">&#xe618;</span>
+        <span class="e619">&#xe619;</span>
+        <span class="e61a">&#xe61a;</span>
+        <span class="e61b">&#xe61b;</span>
+        <span class="e61c">&#xe61c;</span>
+        <span class="e61d">&#xe61d;</span>
+        <span class="e61e">&#xe61e;</span>
+        <span class="e61f">&#xe61f;</span>
+        <span class="e620">&#xe620;</span>
+        <span class="e621">&#xe621;</span>
+        <span class="e622">&#xe622;</span>
+        <span class="e623">&#xe623;</span>
+        <span class="e624">&#xe624;</span>
+        <span class="e625">&#xe625;</span>
+        <span class="e626">&#xe626;</span>
+        <span class="e627">&#xe627;</span>
+        <span class="e628">&#xe628;</span>
+        <span class="e629">&#xe629;</span>
+        <span class="e62a">&#xe62a;</span>
+        <span class="e62b">&#xe62b;</span>
+        <span class="e62c">&#xe62c;</span>
+        <span class="e62d">&#xe62d;</span>
+        <span class="e62e">&#xe62e;</span>
+        <span class="e62f">&#xe62f;</span>
+        <span class="e630">&#xe630;</span>
+        <span class="e631">&#xe631;</span>
+        <span class="e632">&#xe632;</span>
+        <span class="e633">&#xe633;</span>
+        <span class="e634">&#xe634;</span>
+        <span class="e635">&#xe635;</span>
+        <span class="e636">&#xe636;</span>
+        <span class="e637">&#xe637;</span>
+        <span class="e638">&#xe638;</span>
+        <span class="e639">&#xe639;</span>
+        <span class="e63a">&#xe63a;</span>
+        <span class="e63b">&#xe63b;</span>
+        <span class="e63c">&#xe63c;</span>
+        <span class="e63d">&#xe63d;</span>
+        <span class="e63e">&#xe63e;</span>
+        <span class="e63f">&#xe63f;</span>
+        <span class="e640">&#xe640;</span>
+        <span class="e641">&#xe641;</span>
+        <span class="e642">&#xe642;</span>
+        <span class="e643">&#xe643;</span>
+        <span class="e644">&#xe644;</span>
+        <span class="e645">&#xe645;</span>
+        <span class="e646">&#xe646;</span>
+        <span class="e647">&#xe647;</span>
+        <span class="e648">&#xe648;</span>
+        <span class="e649">&#xe649;</span>
+        <span class="e64a">&#xe64a;</span>
+        <span class="e64b">&#xe64b;</span>
+      </div>
+      <h2>500%</h2>
+      <div class="symbols" style="font-size: 500%; line-height: 1.5em">
+        <span class="e600">&#xe600;</span>
+        <span class="e601">&#xe601;</span>
+        <span class="e602">&#xe602;</span>
+        <span class="e603">&#xe603;</span>
+        <span class="e604">&#xe604;</span>
+        <span class="e605">&#xe605;</span>
+        <span class="e606">&#xe606;</span>
+        <span class="e607">&#xe607;</span>
+        <span class="e608">&#xe608;</span>
+        <span class="e609">&#xe609;</span>
+        <span class="e60a">&#xe60a;</span>
+        <span class="e60b">&#xe60b;</span>
+        <span class="e60c">&#xe60c;</span>
+        <span class="e60d">&#xe60d;</span>
+        <span class="e60e">&#xe60e;</span>
+        <span class="e60f">&#xe60f;</span>
+        <span class="e610">&#xe610;</span>
+        <span class="e611">&#xe611;</span>
+        <span class="e612">&#xe612;</span>
+        <span class="e613">&#xe613;</span>
+        <span class="e614">&#xe614;</span>
+        <span class="e615">&#xe615;</span>
+        <span class="e616">&#xe616;</span>
+        <span class="e617">&#xe617;</span>
+        <span class="e618">&#xe618;</span>
+        <span class="e619">&#xe619;</span>
+        <span class="e61a">&#xe61a;</span>
+        <span class="e61b">&#xe61b;</span>
+        <span class="e61c">&#xe61c;</span>
+        <span class="e61d">&#xe61d;</span>
+        <span class="e61e">&#xe61e;</span>
+        <span class="e61f">&#xe61f;</span>
+        <span class="e620">&#xe620;</span>
+        <span class="e621">&#xe621;</span>
+        <span class="e622">&#xe622;</span>
+        <span class="e623">&#xe623;</span>
+        <span class="e624">&#xe624;</span>
+        <span class="e625">&#xe625;</span>
+        <span class="e626">&#xe626;</span>
+        <span class="e627">&#xe627;</span>
+        <span class="e628">&#xe628;</span>
+        <span class="e629">&#xe629;</span>
+        <span class="e62a">&#xe62a;</span>
+        <span class="e62b">&#xe62b;</span>
+        <span class="e62c">&#xe62c;</span>
+        <span class="e62d">&#xe62d;</span>
+        <span class="e62e">&#xe62e;</span>
+        <span class="e62f">&#xe62f;</span>
+        <span class="e630">&#xe630;</span>
+        <span class="e631">&#xe631;</span>
+        <span class="e632">&#xe632;</span>
+        <span class="e633">&#xe633;</span>
+        <span class="e634">&#xe634;</span>
+        <span class="e635">&#xe635;</span>
+        <span class="e636">&#xe636;</span>
+        <span class="e637">&#xe637;</span>
+        <span class="e638">&#xe638;</span>
+        <span class="e639">&#xe639;</span>
+        <span class="e63a">&#xe63a;</span>
+        <span class="e63b">&#xe63b;</span>
+        <span class="e63c">&#xe63c;</span>
+        <span class="e63d">&#xe63d;</span>
+        <span class="e63e">&#xe63e;</span>
+        <span class="e63f">&#xe63f;</span>
+        <span class="e640">&#xe640;</span>
+        <span class="e641">&#xe641;</span>
+        <span class="e642">&#xe642;</span>
+        <span class="e643">&#xe643;</span>
+        <span class="e644">&#xe644;</span>
+        <span class="e645">&#xe645;</span>
+        <span class="e646">&#xe646;</span>
+        <span class="e647">&#xe647;</span>
+        <span class="e648">&#xe648;</span>
+        <span class="e649">&#xe649;</span>
+        <span class="e64a">&#xe64a;</span>
+        <span class="e64b">&#xe64b;</span>
+      </div>
+    </article>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/tablet.html b/src/main/webapp/thymeleaf/projects/html-experimente/tablet.html
new file mode 100644
index 00000000..25e714a2
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/tablet.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Layout für Tablets'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Layout TABLET</title>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/base.css" th:href="@{/css/base.css}"/>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/tablet.css" th:href="@{/css/tablet.css}"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Layout TABLET</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('tablet')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/testlab.html b/src/main/webapp/thymeleaf/projects/html-experimente/testlab.html
new file mode 100644
index 00000000..9122f773
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/testlab.html
@@ -0,0 +1,266 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/testlab"
+    th:with="title='Media-Query-Test: BEISPIEL'"
+    >
+  <head>
+    <title>HTML-Experimente - Media-Query-Test: BEISPIEL</title>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../less/all.less" th:remove="all"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <div layout:fragment="content" th:remove="tag">
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Anzeigetext</h2>
+        <div class="f textarea">
+          <label class="f info" for="textarea_01">Geben Sie hier Ihren Anzeigentext ein.</label>
+          <textarea class="f error" id="textarea_01" cols="50" rows="10">Eingegebener Text</textarea>
+          <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Es wurde kein Text für die Anzeige eingegeben!</span>
+        </div>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Textformatierung</h2>
+        <fieldset class="f radiobutton cf">
+          <legend class="f info">
+            Die zusätzlichen Gestaltungsoptionen sind nur für das Magazin wählbar.<br />
+            Online erscheint die Anzeige als normaler Fließtext.
+          </legend>
+          <hr class="f" />
+          <div class="col2">
+            <div class="f">
+              <input class="f" id="radio_tbox_01" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_01">normaler Fließtext</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_02" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_02">Text zentriert</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_03" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_03">Text fett, Negativdruck</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_04" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_04">Text fett</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_05" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_05">Text fett und rot</label>
+            </div>
+          </div>
+          <div class="col2">
+            <div class="f">
+              <input class="f" id="radio_tbox_06" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_06">Text fett, Anzeige blau hinterlegt</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_07" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_07">Text fett, Anzeige gelb hinterlegt</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_08" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_08">Anzeige schwarz eingerahmt</label>
+            </div>
+            <div class="f">
+              <input class="f" id="radio_tbox_09" type="radio" name="radio_tbox" />
+              <label class="f" for="radio_tbox_09">Anzeige rot eingerahmt</label>
+            </div>
+          </div>
+        </fieldset>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Einspaltige Radiobuttons...</h2>
+        <fieldset class="f radiobutton">
+          <div class="f">
+            <input class="f" id="radio_tbox_b01" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_b01">Dies ist eine etwas länglichere Beschreibung der auswählbaren Option</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_b02" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_b02">Option X</label>
+          </div>
+          <div class="f">
+            <input class="f" id="radio_tbox_b03" type="radio" name="radio_tbox" />
+            <label class="f" for="radio_tbox_b03">Dies ist eine sehr, sehr lange Beschreibung der auswählbaren Option - so lang, dass sie am Ende hoffentlich umbricht...</label>
+          </div>
+        </fieldset>
+        <hr class="f" />
+        <div class="f submit">
+          <input class="f" type="submit" value="&gt; zur Übersicht" />
+          <input class="f left" type="submit" value="&lt; zurück" />
+          <input class="f" type="submit" value="&gt; weiter" />
+        </div>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Bild</h2>
+        <fieldset class="f checkbox">
+          <legend class="f">
+            Du kannst Deiner Anzeige ein Bild hinzufügen.
+            Das Bild erscheint nur online.
+            Im Magazin erscheint die Kleinanzeige mit Hinweis auf das Onlinebild.
+          </legend>
+          <hr class="f" />
+          <div class="f">
+            <input class="f" id="checkbox_tbox_01" type="checkbox" name="checkbox_tbox" />
+            <label class="f" for="checkbox_tbox_01">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
+          </div>
+          <div class="f">
+            <input class="f" id="checkbox_tbox_02" type="checkbox" name="checkbox_tbox" />
+            <label class="f" for="checkbox_tbox_02">Ich habe die AGB für das Hochladen von Bildern gelesen und akzeptiere diese</label>
+          </div>
+        </fieldset>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Alleinstehende Checkbox</h2>
+        <div class="f checkbox">
+          <input class="f" id="checkbox_tbox_03" type="checkbox" name="checkbox_tbox" />
+          <label class="f" for="checkbox_tbox_03">Ich möchte ein Bild zu dieser Anzeige hinzufügen</label>
+        </div>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Kundendaten</h2>
+        <p class="f required">
+          <strong class="r">Pflichtfelder</strong> sind mit einem
+          <strong class="r symbol">*</strong> markiert.
+        </p>
+        <div class="f text required">
+          <label for="text_tbox_01" class="f"><span class="required">* </span>Nachname</label>
+          <input class="f" id="text_tbox_01" type="text" value="Mustermann" />
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_02" class="f">Vorname</label>
+          <input class="f" id="text_tbox_02" type="text" value="Max" />
+        </div>
+        <div class="f select required">
+          <label for="text_tbox_03" class="f"><span class="required">* </span>Ort</label>
+          <select class="f" id="text_tbox_03">
+            <option>Dortmund</option>
+            <option>Bochum</option>
+            <option>Essen</option>
+            <option>Mönchengladbach</option>
+            <option>Oberhausen</option>
+            <option>Castrop-Rauxel</option>
+            <option>Düsseldorf</option>
+          </select>
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_04" class="f"><span class="required">* </span>Straße/Hausnr.</label>
+          <input class="f error" id="text_tbox_04" type="text" value="" />
+          <span class="f error"><span class="e">&lt; </span><strong class="e">Fehler:</strong> Dies ist ein Pflichtfeld!</span>
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_05" class="f"><span class="required">* </span>Postleitzahl</label>
+          <input class="f" id="text_tbox_05" type="text" value="" />
+        </div>
+        <div class="f text required">
+          <label for="text_tbox_06" class="f">Telefon</label>
+          <input class="f" id="text_tbox_06" type="text" value="" />
+        </div>
+        <hr class="f" />
+        <div class="f submit">
+          <input class="f" type="submit" value="&gt; weiter" />
+        </div>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Anzeige regionalisieren</h2>
+        <p class="f">
+          Indem Du Deine Kleinanzeige einer Stadt zuordnest, können Interessenten
+          diese online leichter finden, wenn sie nur nach Kleinanzeigen aus
+          bestimmten Städten suchen.
+          Du kannst auch keine Stadt zuordnen, dann wird die Kleinanzeige von
+          diesen Interessenten aber auch nicht gefunden.
+        </p>
+        <hr class="f" />
+        <div class="f text">
+          <label class="f" for="city">Stadt</label>
+          <input id="city" type="text" class="f" />
+          <p class="f info">
+            Das Feld leer lassen, wenn die Anzeige nicht regionalisiert werden soll.
+          </p>
+        </div>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Ein Passwort-Eingabe-Feld</h2>
+        <div class="f text required">
+          <label for="text_tbox_05" class="f"><span class="required">* </span>Passwort</label>
+          <input class="f" id="text_tbox_05" type="password" value="t" />
+        </div>
+      </form>
+      <form class="testlab form" action="#" method="get">
+        <h2 class="f">Lade das Bild hoch</h2>
+        <p class="f info">
+          Du kannst ein Bild im JPEG- oder PNG-Format hochladen.
+          Das Bild darf nicht größer als 8 MByte sein.
+        </p>
+        <div class="f file required">
+          <label for="file_tbox_01" class="f"><span class="required">* </span>Bild</label>
+          <input class="f" id="file_tbox_01" type="file" />
+        </div>
+        <hr class="f" />
+        <div class="f submit">
+          <input class="f" type="submit" value="&gt; Doch kein Bild" />
+          <input class="f" type="submit" value="&gt; Bild hochladen" />
+        </div>
+      </form>
+      <div class="testlab form">
+        <h2 class="f">Antworten</h2>
+        <p class="f required">
+          <strong class="r">Pflichtfelder</strong> sind mit einem
+          <strong class="r symbol">*</strong> markiert.
+        </p>
+        <div class="f text required">
+          <label class="f" for="replyTo"><span class="required">*</span> Antwort-Adresse</label>
+          <input id="replyTo" name="replyTo" class="f" tabindex="1" type="text" value=""/>
+        </div>
+        <div class="f text required">
+          <label class="f" for="replyTo"><span class="required">*</span> Adresse wiederholen</label>
+          <input id="replyToRepeated" name="replyToRepeated" class="f" tabindex="2" type="text" value=""/>
+        </div>
+        <div class="f text required">
+          <label class="f" for="subject"><span class="required">*</span> Betreff</label>
+          <input id="subject" name="subject" class="f" tabindex="3" type="text" value=""/>
+        </div>
+        <div class="f textarea required">
+          <label class="f" for="text"><span class="required">*</span> Nachricht</label>
+          <textarea id="text" name="text" class="f" tabindex="4" rows="15" cols="20"></textarea>
+        </div>
+        <div class="f checkbox">
+          <input id="attachment1" name="attachment" class="f" tabindex="4" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_attachment" value="on"/>
+          <label class="f" for="attachment">Ich möchte eine Datei an die E-Mail anhängen.</label>
+        </div>
+        <div class="f checkbox">
+          <input id="copy1" name="copy" class="f" tabindex="5" type="checkbox" value="true" checked="checked"/><input type="hidden" name="_copy" value="on"/>
+          <label class="f" for="copy">Ich möchte eine Kopie der Nachricht zugesendet bekommen.</label>
+        </div>
+      </div>
+      <div class="testlab form cf">
+        <div class="col2 left">
+          <h2 class="f">Weiter mit Anmeldung</h2>
+          <div class="f text">
+            <label class="f" for="username">Benutzername</label>
+            <input class="f" name="username" id="username" type="text" tabindex="6" />
+          </div>
+          <div class="f text">
+            <label class="f" for="password">Passwort</label>
+            <input class="f" name="password" id="password" type="password" tabindex="7" />
+          </div>
+        </div>
+        <div class="col2 right">
+          <h2 class="f">Weiter ohne Anmeldung</h2>
+          <!-- <a href="/kleinanzeigen/37431/lust+.html" title="Zu schwer? Hier klicken um das Bild zu wechseln!"><img src="/img/captcha.jpg" alt="Captcha" width="120" height="60" /></a> -->
+          <div class="f captcha cf">
+            <span class="f">Was steht da?</span>
+            <img class="f" src="/img/captcha.jpg" alt="Captcha" width="120" height="60" />
+          </div>
+          <div class="f text">
+            <label class="f" for="captcha">Lösung</label>
+            <input class="f" name="captcha" id="captcha" type="text" tabindex="8" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/html-experimente/tiny.html b/src/main/webapp/thymeleaf/projects/html-experimente/tiny.html
new file mode 100644
index 00000000..63515b65
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/html-experimente/tiny.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    xmlns:th="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    th:with="title='Layout für sehr kleine Bildschirmgrößen'"
+    >
+  <head layout:fragment="head">
+    <title>HTML-Experimente - Layout TINY</title>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/base.css" th:href="@{/css/base.css}"/>
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../../css/tiny.css" th:href="@{/css/tiny.css}"/>
+    <script src="../../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><a class="b" href="../html-experimente.html" th:href="@{/projects/html-experimente.html}">HTML-Experimente</a></li>
+      <li class="b"><strong class="b">Layout TINY</strong></li>
+    </ol>
+    <nav layout:fragment="navigation" th:include="projects/html-experimente :: navigation ('tiny')">
+      NAVIGATION
+    </nav>
+    <aside layout:fragment="marginalcontent" th:replace="templates/fragments :: marginalcontent">
+      MARGINAL-CONTENT
+    </aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/projects/typo.html b/src/main/webapp/thymeleaf/projects/typo.html
new file mode 100644
index 00000000..c511e719
--- /dev/null
+++ b/src/main/webapp/thymeleaf/projects/typo.html
@@ -0,0 +1,124 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Typography</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="../index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="../projects.html" th:href="@{/projects.html}">Projects</a></li>
+      <li class="b"><strong class="b">Typography</strong></li>
+    </ol>
+    <ul layout:fragment="submenu">
+      <li class="s sub"><a href="#" class="s">hibernate4-maven-plugin</a></li>
+      <li class="s sub"><a href="../fix-swf.html" th:href="@{/projects/fix-swf.html}" class="s">fix-swf</a></li>
+      <li class="s"><a href="#" class="s">jquery.openx</a></li>
+      <li class="s"><a href="../html-experimente.html" th:href="@{/projects/html-experimente.html}" class="s">HTML-Experimente</a></li>
+      <li class="s sub"><a href="#" class="s">accelerator</a></li>
+      <li class="s"><strong class="s">Typography</strong></li>
+    </ul>
+    <article layout:fragment="maincontent">
+      <header><h1>Typography</h1></header>
+      <p>
+        Lorem ipsum dolor <a href="#da">sit amet</a>, consectetur adipisicing elit,
+        sed do eiusmod <strong>tempor incididunt</strong> ut labore et dolore
+        magna aliqua. Ut enim ad minim veniam, quis nostrud
+        <a href="#dort">exercitation</a> ullamco laboris nisi ut aliquip
+        <em>ex ea</em> commodo consequat. Duis aute irure dolor in reprehenderit
+        in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+        <strong>Excepteur sint <em>occaecat</em> cupidatat non proident</strong>,
+        sunt in culpa qui officia deserunt mollit anim id est laborum.
+      </p>
+      <h2>Ein Link <a href="#link">im Titel</a></h2>
+      <p>Ein Link <a href="#link">im Text</a>.</p>
+      <h2>Normal / Italic / Bold / Bold+Italic</h2>
+      <ul>
+        <li>normal</li>
+        <li><em>italic</em></li>
+        <li><strong>bold</strong></li>
+        <li><strong><em>bold italic</em></strong></li>
+      </ul>
+      <p>
+        ÄäÖöÜüß@€¢
+        <strong>ÄäÖöÜüß@€¢</strong>
+        <em>ÄäÖöÜüß@€¢</em>
+        <strong><em>ÄäÖöÜüß@€¢</em></strong>
+      </p>
+      <h1>H1: Heading</h1>
+      <h2>H2: Heading</h2>
+      <h3>H3: Heading</h3>
+      <h4>H4: Heading</h4>
+      <h1>H1: Heading</h1>
+      <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>
+      <h2>H2: Heading</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. 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>H3: 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. 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>H4: Heading</h4>
+      <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>
+      <h1>Preformatted code</h1>
+      <p>
+        <em>Juplo Branding</em> uses
+        <a href="http://google-code-prettify.googlecode.com/svn/trunk/README.html" title="Visit prettify's README">google-code-prettify</a> for automatic
+        syntax highlighting.
+      </p>
+      <pre class="prettyprint linenums"><code class="language-xml">
+&lt;plugin&gt;
+  &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
+  &lt;artifactId&gt;wro4j-maven-plugin&lt;/artifactId&gt;
+  &lt;version&gt;${wro4j.version}&lt;/version&gt;
+  &lt;configuration&gt;
+    &lt;wroManagerFactory&gt;ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory&lt;/wroManagerFactory&gt;
+    &lt;cssDestinationFolder&gt;${project.build.directory}/${project.build.finalName}/css/&lt;/cssDestinationFolder&gt;
+  &lt;/configuration&gt;
+  &lt;executions&gt;
+    &lt;execution&gt;
+      &lt;phase&gt;package&lt;/phase&gt;
+      &lt;goals&gt;
+        &lt;goal&gt;run&lt;/goal&gt;
+      &lt;/goals&gt;
+    &lt;/execution&gt;
+  &lt;/executions&gt;
+&lt;/plugin&gt;
+</code></pre>
+    </article>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/references.html b/src/main/webapp/thymeleaf/references.html
new file mode 100644
index 00000000..e2e7a408
--- /dev/null
+++ b/src/main/webapp/thymeleaf/references.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>References</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a class="b" href="about.html" th:href="@{/about.html}">About</a></li>
+      <li class="b"><strong class="b">References</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m selected">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="about.html" th:href="@{/about.html}" class="s">About</a></h2>
+      <ul id="submenu">
+        <li class="s sub off"><a href="expertise.html" th:href="@{/expertise.html}" class="s">Expertise</a></li>
+        <li class="s sub">
+          <strong class="s">References</strong>
+          <ul class="s active">
+            <li class="s sub"><span href="references/coolibri.html" th:href="@{/references/coolibri.html}" class="s">coolibri.de</span></li>
+            <li class="s"><span href="references/hibernate4-maven-plugin.html" th:href="@{/references/hibernate4-maven-plugin.html}" class="s">hibernate4-maven-plugin</span></li>
+            <li class="s sub"><span href=".html" th:href="@{/.html}" class="s"></span></li>
+            <li class="s sub"><span href=".html" th:href="@{/.html}" class="s"></span></li>
+          </ul>
+        </li>
+        <li class="s off"><a href="contact.html" th:href="@{/contact.html}" class="s">Contact</a></li>
+      </ul>
+    </nav>
+    <div layout:fragment="maincontent" layout:replace="templates/fragments :: wip ('Expertise')"></div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/templates/defaults.html b/src/main/webapp/thymeleaf/templates/defaults.html
deleted file mode 100644
index 880af8b8..00000000
--- a/src/main/webapp/thymeleaf/templates/defaults.html
+++ /dev/null
@@ -1,60 +0,0 @@
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:tiles="http://www.thymeleaf.org">
-  <head tiles:fragment="htmlhead">
-    <title th:text="'juplo - ' + ${title}">juplo - STANDARDELEMENTE</title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../less/all.less" th:href="@{/css/base.css}"/>
-    <style type="text/css" th:inline="text">
-      @import '[[@{/css/screen.css}]]' screen;
-      @import '[[@{/css/print.css}]]' print;
-    </style>
-    <script src="../../js/base.js" th:src="@{/js/base.js}"></script>
-    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
-  </head>
-  <body>
-    <h1 id="logo" tiles:fragment="header"><a href="${base}" title="Home" class="l">juplo</a></h1>
-    <article id="content" class="main" tiles:fragment="maincontent">
-      <p>
-        <strong>Lorem ipsum</strong> dolor <a href="#" th:href="@{/projects/typo.html}">sit amet</a>, consectetur adipisicing elit, sed do
-        eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
-        ad minim veniam, quis nostrud <a href="#" th:href="@{/projects/html-experimente.html}">exercitation</a> 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>
-      <h2>Duis aute irure dolor</h2>
-      <ul>
-        <li>Operators and other mathematical stuff: -+/*</li>
-        <li>Characters offten used in programming languages: {(&lt;&gt;)}@$?%*#;:&amp;/\!^&#034;&#039;`~</li>
-        <li>Special german characters: ÄäÖöÜü</li>
-        <li>Other special characters: @?¢§%°</li>
-      </ul>
-      <h2>Excepteur sint occaecat cupidatat</h2>
-      <p>
-        Lorem ipsum dolor <em>sit amet</em>, 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>
-      <p>
-        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
-        eiusmod tempor incididunt ut labore et dolore magna aliqua. <strong>Ut enim
-        ad minim veniam, quis nostrud <em>exercitation ullamco</em> laboris nisi ut
-        aliquip ex ea commodo consequat</strong>. 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>
-    </article>
-    <ul id="footerlinks" tiles:fragment="footer">
-      <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
-      <li class="f"><a class="f" href="#" th:href="@{/impressum.html}">Impressum</a></li>
-      <li class="f about"><a class="f" href="#" th:href="@{/about.html}">About</a></li>
-    </ul>
-  </body>
-</html>
diff --git a/src/main/webapp/thymeleaf/templates/fragments.html b/src/main/webapp/thymeleaf/templates/fragments.html
new file mode 100644
index 00000000..28115d70
--- /dev/null
+++ b/src/main/webapp/thymeleaf/templates/fragments.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.thymeleaf.org">
+  <head>
+    <title>Fragments</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <h1>Explanation fo the german word "Impressum"</h1>
+    <hr />
+    <aside class="m" th:fragment="about">
+      <h1>What the f*#!@ is an <em>Impressum</em> ?!?</h1>
+      The german law enforces the so called <em>Impressum</em> to enable
+      customers to easily find out all juristically relevant informations
+      about the company, that rules a site.
+      <h1>Find out more...</h1>
+      If you just want to learn more about juplo you should better
+      <a href="../about.html" th:href="@{/about.html}" title="Learn more about juplo now">visit our about-pages</a>.
+    </aside>
+    <hr />
+    <h1>Work-in-progress-hint</h1>
+    <hr />
+    <article class="main" layout:fragment="wip(title)">
+      <header><h1 th:text="${title}">PAGE-TITLE</h1></header>
+      <div class="wip" th:fragment="wip">
+        <img class="w" src="/img/comming-soon.png" alt="Comming soon..."/>
+        <p th:include="templates/layout :: maincontent" th:remove="tag">
+          PAGE-CONTENT
+        </p>
+      </div>
+    </article>
+    <hr />
+    <h1>Marginalspalte</h1>
+    <hr />
+    <div th:fragment="marginalcontent" th:remove="tag">
+      <aside class="m">
+        <h1>Other nasty but marginal stuff</h1>
+        <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>
+      </aside>
+      <aside class="m">
+        <h1>More nasty stuff</h1>
+        <p>
+          This one is really short!
+        </p>
+      </aside>
+    </div>
+    <hr />
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/templates/html5page.html b/src/main/webapp/thymeleaf/templates/html5page.html
deleted file mode 100644
index c52d5ffa..00000000
--- a/src/main/webapp/thymeleaf/templates/html5page.html
+++ /dev/null
@@ -1,119 +0,0 @@
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"  xmlns:tiles="http://www.thymeleaf.org">
-  <head tiles:replace="htmlhead">
-    <title>juplo - BASISTEMPLATE</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <link rel="stylesheet/less" type="text/css" href="../../less/all.less"/>
-    <script src="../../js/less-1.5.1.js"></script>
-  </head>
-  <body id="top" th:class="contentclass" onload="prettyPrint()">
-    <div id="page" class="cf">
-      <header id="header">
-        <h1 id="logo" tiles:include="header"><a href="#" title="Home" class="l">juplo</a></h1>
-        <span id="slogan"><strong>Java</strong> bits from nerds for nerds</span>
-        <hr class="h" />
-      </header>
-      <div id="breadcrumb">
-        <strong class="b title">You are here:</strong>
-        <ol class="b" tiles:include="breadcrumb">
-          <li class="b"><a class="b" href="#">Home</a></li>
-          <li class="b"><a class="b" href="#">Projects</a></li>
-          <li class="b"><a class="b" href="#">Fix SWF</a></li>
-          <li class="b"><strong class="b">Overview</strong></li>
-        </ol>
-        <a class="hide" href="#nav" title="Show navigation menu">Jump to navigation</a>
-        <hr class="b" />
-      </div>
-      <main class="content cf">
-        <article id="content" class="main" tiles:replace="maincontent">
-          <header><h1>Überschrift</h1></header>
-          <p>
-            <strong>Lorem ipsum</strong> dolor <a href="#">sit amet</a>, consectetur adipisicing elit, sed do
-            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
-            ad minim veniam, quis nostrud <a href="#">exercitation</a> 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>
-        </article>
-        <div class="marginal">
-          <nav id="nav">
-            <hr class="n"/>
-            <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
-            <!--/*-->
-            <h1 class="nav">Navigation</h1>
-            <h2 class="nav menu">Section-Menu</h2>
-            <ul id="menu" class="cf">
-              <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-              <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-              <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-            </ul>
-            <h2 class="nav submenu">
-              <span class="s">Submenu for section</span>
-              <a class="s selected" href="${base}projects.html">Projects</a>
-            </h2>
-            <ul id="submenu" class="s">
-              <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-              <li class="s sub">
-                <a href="${base}projects/fix-swf.html" class="s selected">fix-swf</a>
-                <ul class="s active">
-                  <li class="s"><strong class="s">Overview</strong></li>
-                  <li class="s"><a href="${base}projects/fix-swf/getting-started.html" class="s">Getting Started</a></li>
-                  <li class="s"><a href="#" class="s">FAQ</a></li>
-                  <li class="s"><a href="#" class="s">Documentation</a></li>
-                </ul>
-              </li>
-              <li class="s off"><a href="#" class="s">jquery.openx</a></li>
-              <li class="s off"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-              <li class="s sub off"><a href="#" class="s">accelerator</a></li>
-              <li class="s off"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-            </ul>
-            <!--*/-->
-            <div tiles:include="navigation" th:remove="tag"></div>
-            <hr class="n"/>
-          </nav>
-          <aside class="m" tiles:replace="marginalcontent">
-            <div class="widget widget_recent_entries">
-              <h2 class="widgettitle">Recent Posts</h2>
-              <ul>
-                <li>
-                  <a href="#" title="Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources">Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources</a>
-                </li>
-                <li>
-                  <a href="#" title="hibernate4-maven-plugin 1.0.3 released!">hibernate4-maven-plugin 1.0.3 released!</a>
-                </li>
-                <li>
-                  <a href="#" title="Log out from wrong Account with maven-appengine-plugin">Log out from wrong Account with maven-appengine-plugin</a>
-                </li>
-                <li>
-                  <a href="#" title="Bidirectional Association with @ElementCollection">Bidirectional Association with @ElementCollection</a>
-                </li>
-                <li>
-                  <a href="#" title="hibernate4-maven-plugin 1.0.2 released!">hibernate4-maven-plugin 1.0.2 released!</a>
-                </li>
-                <li>
-                  <a href="#" title="hibernate4-maven-plugin 1.0.1 released!">hibernate4-maven-plugin 1.0.1 released!</a>
-                </li>
-                <li>
-                  <a href="#" title="hibernate4-maven-plugin 1.0 released!">hibernate4-maven-plugin 1.0 released!</a>
-                </li>
-                <li>
-                  <a href="#" title="hibernate4-maven-plugin">hibernate4-maven-plugin</a>
-                </li>
-              </ul>
-            </div>
-          </aside>
-        </div>
-      </main>
-      <footer id="footer">
-        <hr class="f" />
-        <ul id="footerlinks" tiles:include="footer">
-          <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
-          <li class="f"><a class="f" href="#">Impressum</a></li>
-          <li class="f about"><a class="f" href="#">About</a></li>
-        </ul>
-      </footer>
-    </div>
-  </body>
-</html>
diff --git a/src/main/webapp/thymeleaf/templates/layout.html b/src/main/webapp/thymeleaf/templates/layout.html
new file mode 100644
index 00000000..fe4010b7
--- /dev/null
+++ b/src/main/webapp/thymeleaf/templates/layout.html
@@ -0,0 +1,152 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:th="http://www.thymeleaf.org"
+    xmlns:layout="http://www.thymeleaf.org"
+    >
+  <head th:fragment="head" layout:fragment="head">
+    <title layout:title-pattern="$DECORATOR_TITLE - $CONTENT_TITLE" th:text="'juplo'">juplo - BASISTEMPLATE</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="stylesheet/less" th:rel="stylesheet" type="text/css" href="../../less/all.less" th:href="@{/css/base.css}"/>
+    <style type="text/css" th:inline="text">
+      @import '[[@{/css/screen.css}]]' screen;
+      @import '[[@{/css/print.css}]]' print;
+    </style>
+    <script src="../../js/prettify.js" th:src="@{/js/prettify.js}"></script>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body id="top" th:class="${contentclass}?:'menu'" onload="prettyPrint()">
+    <div id="page" class="cf">
+      <header id="header">
+        <h1 id="logo" layout:fragment="header"><a href="../index.html" th:href="@{/}" title="Home" class="l">juplo</a></h1>
+        <span id="slogan"><strong>Java</strong> bits from nerds for nerds</span>
+        <hr class="h" />
+      </header>
+      <div id="breadcrumb">
+        <strong class="b title">You are here:</strong>
+        <ol class="b" layout:fragment="breadcrumb">
+          <!--/*-->
+          <li class="b"><a class="b" href="#">Home</a></li>
+          <li class="b"><a class="b" href="#">Projects</a></li>
+          <li class="b"><a class="b" href="#">Fix SWF</a></li>
+          <!--*/-->
+          <li class="b"><strong class="b">BREADCRUMB</strong></li>
+        </ol>
+        <a class="hide" href="#nav" title="Show navigation menu">Jump to navigation</a>
+        <hr class="b" />
+      </div>
+      <main class="content cf">
+        <article id="content" class="main" layout:fragment="maincontent" th:class="'main'">
+          <header><h1 th:text="${title}">juplo - BASISTEMPLATE</h1></header>
+          <div th:fragment="maincontent">
+            <p>
+              <strong>Lorem ipsum</strong> dolor
+              <a href="../projects/typo.html" th:href="@{/projects/typo.html}">sit amet</a>,
+              consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
+              labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
+              <a href="#" th:href="@{/projects/html-experimente.html}">exercitation</a>
+              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>
+            <h2>Duis aute irure dolor</h2>
+            <ul>
+              <li>Operators and other mathematical stuff: -+/*</li>
+              <li>
+                Characters offten used in programming languages:
+                {(&lt;&gt;)}@$?%*#;:&amp;/\!^&#034;&#039;`~
+              </li>
+              <li>Special german characters: ÄäÖöÜü</li>
+              <li>Other special characters: @?¢§%°</li>
+            </ul>
+            <h2>Excepteur sint occaecat cupidatat</h2>
+            <p>
+              Lorem ipsum dolor <em>sit amet</em>, 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>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
+              eiusmod tempor incididunt ut labore et dolore magna aliqua.
+              <strong>Ut enim ad minim veniam, quis nostrud <em>exercitation
+              ullamco</em> laboris nisi ut aliquip ex ea commodo consequat</strong>.
+              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>
+        </article>
+        <div class="marginal">
+          <nav id="nav" layout:fragment="navigation">
+            <hr class="n"/>
+            <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+            <h1 class="nav">Navigation</h1>
+            <h2 class="nav menu">Section-Menu</h2>
+            <ul id="menu" class="cf">
+              <li class="m blog"><a href="../blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+              <li class="m projects"><a href="../projects" th:href="@{/projects.html}" class="m selected">Projects</a></li>
+              <li class="m about"><a href="../about.html" th:href="@{/about.html}" class="m">About</a></li>
+            </ul>
+            <h2 class="nav submenu">
+              <span class="s">Submenu for section</span>
+              <a class="s selected" href="../projects.html" th:href="@{/projects.html}">Projects</a>
+            </h2>
+            <ul id="submenu" class="s" layout:fragment="submenu">
+              <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
+              <li class="s sub">
+                <a href="../projects/fix-swf.html" th:href="@{/projects/fix-swf.html}" class="s selected">fix-swf</a>
+                <ul class="s active">
+                  <li class="s"><strong class="s">Overview</strong></li>
+                  <li class="s"><a href="../projects/fix-swf/getting-started.html" th:href="@{/projects/fix-swf/getting-started.html}" class="s">Getting Started</a></li>
+                  <li class="s"><a href="#" class="s">FAQ</a></li>
+                  <li class="s"><a href="#" class="s">Documentation</a></li>
+                </ul>
+              </li>
+              <li class="s off"><a href="#" class="s">jquery.openx</a></li>
+              <li class="s sub off"><a href="../projects/html-experimente.html" th:href="@{/projects/html-experimente.html}" class="s">HTML-Experimente</a></li>
+              <li class="s sub off"><a href="#" class="s">accelerator</a></li>
+              <li class="s off"><a href="../projects/typo.html" th:href="@{/projects/typo.html}" class="s">Typography</a></li>
+            </ul>
+            <hr class="n"/>
+          </nav>
+          <aside class="m" layout:fragment="marginalcontent" th:remove="tag">
+          <!--/* the following  is only visible during natural templating -->
+            <h1>Other nasty but marginal stuff</h1>
+            <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>
+          </aside>
+          <aside class="m">
+            <h1>More nasty stuff</h1>
+            <p>
+              This one is really short!
+            </p>
+          <!--*/-->
+          </aside>
+        </div>
+      </main>
+      <footer id="footer">
+        <hr class="f" />
+        <ul id="footerlinks" layout:fragment="footer">
+          <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
+          <li class="f"><a class="f" href="../impressum.html" th:href="@{/impressum.html}">Impressum</a></li>
+          <li class="f about"><a class="f" href="../about.html" th:href="@{/about.html}">About</a></li>
+        </ul>
+      </footer>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/templates/testlab.html b/src/main/webapp/thymeleaf/templates/testlab.html
new file mode 100644
index 00000000..c382c607
--- /dev/null
+++ b/src/main/webapp/thymeleaf/templates/testlab.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:th="http://www.thymeleaf.org"
+    xmlns:layout="http://www.thymeleaf.org"
+    >
+  <head>
+    <title th:replace="templates/layout :: head">juplo - TESTLABTEMPLATE</title>
+    <style type="text/css">
+
+      body {
+        margin: 0;
+        padding: 0;
+      }
+
+      .testlab
+      {
+        width: 100%;
+        text-indent: 0;
+        margin: 0 0 20px -320px;
+        background-color: #fff;
+      }
+      .testlab:after
+      {
+        content:"";
+        display:table;
+      }
+      .tl970
+      {
+        margin-left: 0px;
+        border-left: 970px solid green;
+        text-indent: -970px;
+        background-color: transparent;
+      }
+      .tl670
+      {
+        margin-left: -970px;
+        border-left: 670px solid yellow;
+        text-indent: -670px;
+        background-color: transparent;
+      }
+      .tl480
+      {
+        margin-left: -670px;
+        border-left: 480px solid orange;
+        text-indent: -480px;
+        background-color: transparent;
+      }
+      .tl320
+      {
+        margin-left: -480px;
+        border-left: 320px solid red;
+        text-indent: -320px;
+        background-color: transparent;
+      }
+    </style>
+  </head>
+  <body>
+    <h1 th:text="${title}">TESTLAB-TEMPLATE</h1>
+    <div class="testlab tl970">970px
+      <div class="testlab tl670">670px
+        <div class="testlab tl480">480px
+          <div class="testlab tl320">320px
+            <strong layout:fragment="content">CONTENT</strong>
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/urheberrechte.html b/src/main/webapp/thymeleaf/urheberrechte.html
new file mode 100644
index 00000000..e01b4e2a
--- /dev/null
+++ b/src/main/webapp/thymeleaf/urheberrechte.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:layout="http://www.thymeleaf.org"
+    layout:decorator="templates/layout"
+    >
+  <head>
+    <title>Urheberrecht</title>
+    <link rel="stylesheet/less" type="text/css" href="../../less/all.less" th:remove="all"/>
+    <script src="../../js/less-1.5.1.js" th:remove="all"></script>
+  </head>
+  <body>
+    <ol layout:fragment="breadcrumb">
+      <li class="b"><a class="b" href="index.html" th:href="@{/index.html}">Home</a></li>
+      <li class="b"><a href="impressum.html" th:href="@{/impressum.html}" class="b">Impressum</a></li>
+      <li class="b"><strong class="b">Urheberrechte</strong></li>
+    </ol>
+    <nav layout:fragment="navigation">
+      <hr class="n"/>
+      <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
+      <h1 class="nav">Navigation</h1>
+      <h2 class="nav menu">Section-Menu</h2>
+      <ul id="menu" class="s active cf">
+        <li class="m blog"><a href="blog.html" th:href="@{/blog.html}" class="m">Blog</a></li>
+        <li class="m projects"><a href="projects.html" th:href="@{/projects.html}" class="m">Projects</a></li>
+        <li class="m about"><a href="about.html" th:href="@{/about.html}" class="m">About</a></li>
+      </ul>
+      <h2 class="nav submenu"><span class="s">Submenu for section </span><a href="impressum.html" th:href="@{/impressum.html}" class="s selected">Impressum</a></h2>
+      <ul id="submenu">
+        <li class="s"><a href="agb.html" th:href="@{/agb.html}" class="s">AGB</a></li>
+        <li class="s"><a href="haftung-inhalte.html" th:href="@{/haftung-inhalte.html}" class="s">Haftung für Inhalte</a></li>
+        <li class="s"><a href="haftung-links.html" th:href="@{/haftung-links.html}" class="s">Haftung für Links</a></li>
+        <li class="s"><strong class="s">Urheberrechte</strong></li>
+        <li class="s"><a href="datenschutz.html" th:href="@{/datenschutz.html}" class="s">Datenschutz</a></li>
+        <li class="s"><a href="google-analytics.html" th:href="@{/google-analytics.html}" class="s">Google Analytics</a></li>
+      </ul>
+    </nav>
+    <article class="main" layout:fragment="maincontent">
+      <header><h1 layout:fragment="title">Urheberrechte</h1></header>
+      <p>Die auf unseren Internetseiten enthaltenen Werke und Inhalte unterstehen dem Urheberrecht. Ohne schriftliche Genehmigung des jeweiligen Erstellers oder Autors dürfen die Werke bzw. Inhalte nicht vervielfältigt, bearbeitet, verbreitet und verwertet werden. Das Herunterladen und Kopieren unserer Internetseite ist für den privaten Gebrauch erlaubt, nicht jedoch für den kommerziellen. Wir weisen darauf hin, dass hinsichtlich der Inhalte auf unserer Internetseite, soweit sie nicht von uns erstellt worden sind, das Urheberrecht von Dritten beachtet wurde. Inhalte von Dritten erhalten als solche eine Kennzeichnung von uns. Wir wären Ihnen dankbar, wenn Sie uns einen Hinweis erteilen würden, falls Sie trotzdem auf eine Urheberrechtsverletzung gestoßen sind. Wenn wir von einer solchen Urheberrechtsverletzung Kenntnis erlangen, werden wir den entsprechenden Inhalt unverzüglich entfernen.</p>
+      <p><em>Quelle: <a href="http://www.flegl-rechtsanwaelte.de/rechtstipps/muster-impressum-gewerbliche-homepage">www.flegl-rechtsanwaelte.de</a></em></p>
+    </article>
+    <aside layout:fragment="marginalcontent" th:include="templates/fragments :: about"></aside>
+  </body>
+</html>
diff --git a/src/main/webapp/thymeleaf/views/404.html b/src/main/webapp/thymeleaf/views/404.html
deleted file mode 100644
index 6c22532b..00000000
--- a/src/main/webapp/thymeleaf/views/404.html
+++ /dev/null
@@ -1,14 +0,0 @@
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:tiles="http://www.thymeleaf.org">
-  <head>
-    <title tiles:fragment="title">404: Page not found</title>
-  </head>
-  <body>
-    <div tiles:fragment="content">
-      <p>We do not know, where you are.</p>
-      <p>And we do not know, why you are here.</p>
-      <p>But we can tell you: WE ARE SORRY!</p>
-      <p>Really.</p>
-    </div>
-  </body>
-</html>
diff --git a/src/main/webapp/thymeleaf/views/error.html b/src/main/webapp/thymeleaf/views/error.html
deleted file mode 100644
index a07dc238..00000000
--- a/src/main/webapp/thymeleaf/views/error.html
+++ /dev/null
@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:tiles="http://www.thymeleaf.org">
-  <head>
-    <title tiles:fragment="title">An unexpected Error occured!</title>
-  </head>
-  <body>
-    <div tiles:fragment="content">
-      <p>We do not know, what happend.</p>
-      <p>But we can tell you: WE ARE SORRY!</p>
-      <p>Really.</p>
-    </div>
-  </body>
-</html>
diff --git a/src/main/webapp/thymeleaf/views/index.html b/src/main/webapp/thymeleaf/views/index.html
deleted file mode 100644
index cd366101..00000000
--- a/src/main/webapp/thymeleaf/views/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:tiles="http://www.thymeleaf.org">
-  <head>
-    <title tiles:fragment="title">Index</title>
-  </head>
-  <body>
-    <div tiles:fragment="header"><a href="#" title="Home" class="l">juplo</a></div>
-    <ul tiles:fragment="breadcrumb">
-      <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-      <li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-      <li class="b"><a class="b" href="${base}projects/fix-swf.html">Fix SWF</a></li>
-      <li class="b"><strong class="b">Overview</strong></li>
-    </ul>
-    <div tiles:fragment="navigation">
-      <h1 class="nav">Navigation</h1>
-      <h2 class="nav menu">Section-Menu</h2>
-      <ul id="menu" class="cf">
-        <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-        <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-        <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-      </ul>
-      <h2 class="nav submenu">
-        <span class="s">Submenu for section</span>
-        <a class="s selected" href="${base}projects.html">Projects</a>
-      </h2>
-      <ul id="submenu" class="s">
-        <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-        <li class="s sub">
-          <a href="${base}projects/fix-swf.html" class="s selected">fix-swf</a>
-          <ul class="s active">
-            <li class="s"><strong class="s">Overview</strong></li>
-            <li class="s"><a href="${base}projects/fix-swf/getting-started.html" class="s">Getting Started</a></li>
-            <li class="s"><a href="#" class="s">FAQ</a></li>
-            <li class="s"><a href="#" class="s">Documentation</a></li>
-          </ul>
-        </li>
-        <li class="s off"><a href="#" class="s">jquery.openx</a></li>
-        <li class="s off"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-        <li class="s sub off"><a href="#" class="s">accelerator</a></li>
-        <li class="s off"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-      </ul>
-    </div>
-    <main id="content" class="main" tiles:fragment="maincontent">
-      <p>Inhalt der Index-Seite...</p>
-    </main>
-    <ul tiles:fragment="footer">
-      <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
-      <li class="f"><a class="f" href="${base}impressum.html">Impressum</a></li>
-      <li class="f about"><a class="f" href="${base}about.html">About</a></li>
-    </ul>
-  </body>
-</html>
diff --git a/src/main/webapp/thymeleaf/views/projects/fix-swf/overview.html b/src/main/webapp/thymeleaf/views/projects/fix-swf/overview.html
deleted file mode 100644
index cd366101..00000000
--- a/src/main/webapp/thymeleaf/views/projects/fix-swf/overview.html
+++ /dev/null
@@ -1,52 +0,0 @@
-<!DOCTYPE html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:tiles="http://www.thymeleaf.org">
-  <head>
-    <title tiles:fragment="title">Index</title>
-  </head>
-  <body>
-    <div tiles:fragment="header"><a href="#" title="Home" class="l">juplo</a></div>
-    <ul tiles:fragment="breadcrumb">
-      <li class="b"><a class="b" href="${base}index.html">Home</a></li>
-      <li class="b"><a class="b" href="${base}projects.html">Projects</a></li>
-      <li class="b"><a class="b" href="${base}projects/fix-swf.html">Fix SWF</a></li>
-      <li class="b"><strong class="b">Overview</strong></li>
-    </ul>
-    <div tiles:fragment="navigation">
-      <h1 class="nav">Navigation</h1>
-      <h2 class="nav menu">Section-Menu</h2>
-      <ul id="menu" class="cf">
-        <li class="m blog"><a href="${base}blog.html" class="m">Blog</a></li>
-        <li class="m projects"><a href="${base}projects.html" class="m selected">Projects</a></li>
-        <li class="m about"><a href="${base}about.html" class="m">About</a></li>
-      </ul>
-      <h2 class="nav submenu">
-        <span class="s">Submenu for section</span>
-        <a class="s selected" href="${base}projects.html">Projects</a>
-      </h2>
-      <ul id="submenu" class="s">
-        <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
-        <li class="s sub">
-          <a href="${base}projects/fix-swf.html" class="s selected">fix-swf</a>
-          <ul class="s active">
-            <li class="s"><strong class="s">Overview</strong></li>
-            <li class="s"><a href="${base}projects/fix-swf/getting-started.html" class="s">Getting Started</a></li>
-            <li class="s"><a href="#" class="s">FAQ</a></li>
-            <li class="s"><a href="#" class="s">Documentation</a></li>
-          </ul>
-        </li>
-        <li class="s off"><a href="#" class="s">jquery.openx</a></li>
-        <li class="s off"><a href="${base}projects/html-experimente.html" class="s">HTML-Experimente</a></li>
-        <li class="s sub off"><a href="#" class="s">accelerator</a></li>
-        <li class="s off"><a href="${base}projects/typo.html" class="s">Typography</a></li>
-      </ul>
-    </div>
-    <main id="content" class="main" tiles:fragment="maincontent">
-      <p>Inhalt der Index-Seite...</p>
-    </main>
-    <ul tiles:fragment="footer">
-      <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
-      <li class="f"><a class="f" href="${base}impressum.html">Impressum</a></li>
-      <li class="f about"><a class="f" href="${base}about.html">About</a></li>
-    </ul>
-  </body>
-</html>