From 9b9b0cb1c631273f574d3cd7618bd799f561db6c Mon Sep 17 00:00:00 2001
From: Stephan <klarsichtweise@gmail.com>
Date: Sat, 16 Nov 2019 13:26:19 +0100
Subject: [PATCH] update and vaildation

* updated dependencies
* added html validator
* checked html results
* new readme
---
 .jshintrc                                |  194 ++--
 README.md                                |   49 +-
 gulpfile.js                              |   12 +-
 package-lock.json                        | 1036 +++++++++++++++++++---
 package.json                             |   11 +-
 source/screens/demo/elements.njk         |  159 ++--
 source/screens/demo/error/404.njk        |   46 +-
 source/screens/demo/examples.njk         |  486 +++++-----
 source/screens/demo/intro.njk            |  231 +++--
 source/templates/demo/partials/_meta.njk |   18 +-
 10 files changed, 1519 insertions(+), 723 deletions(-)

diff --git a/.jshintrc b/.jshintrc
index 4f21427..dddcf88 100644
--- a/.jshintrc
+++ b/.jshintrc
@@ -1,97 +1,97 @@
-{
-    // JSHint Default Configuration File (as on JSHint website)
-    // See http://jshint.com/docs/ for more details
-
-    "maxerr"        : 50,       // {int} Maximum error before stopping
-
-    // Enforcing
-    "bitwise"       : true,     // true: Prohibit bitwise operators (&, |, ^, etc.)
-    "camelcase"     : false,    // true: Identifiers must be in camelCase
-    "curly"         : true,     // true: Require {} for every new block or scope
-    "eqeqeq"        : true,     // true: Require triple equals (===) for comparison
-    "forin"         : true,     // true: Require filtering for..in loops with obj.hasOwnProperty()
-    "freeze"        : true,     // true: prohibits overwriting prototypes of native objects such as Array, Date etc.
-    "immed"         : false,    // true: Require immediate invocations to be wrapped in parens e.g. `(function () { } ());`
-    "latedef"       : false,    // true: Require variables/functions to be defined before being used
-    "newcap"        : false,    // true: Require capitalization of all constructor functions e.g. `new F()`
-    "noarg"         : true,     // true: Prohibit use of `arguments.caller` and `arguments.callee`
-    "noempty"       : true,     // true: Prohibit use of empty blocks
-    "nonbsp"        : true,     // true: Prohibit "non-breaking whitespace" characters.
-    "nonew"         : false,    // true: Prohibit use of constructors for side-effects (without assignment)
-    "plusplus"      : false,    // true: Prohibit use of `++` and `--`
-    "quotmark"      : false,    // Quotation mark consistency:
-                                //   false    : do nothing (default)
-                                //   true     : ensure whatever is used is consistent
-                                //   "single" : require single quotes
-                                //   "double" : require double quotes
-    "undef"         : true,     // true: Require all non-global variables to be declared (prevents global leaks)
-    "unused"        : false,     // Unused variables:
-                                //   true     : all variables, last function parameter
-                                //   "vars"   : all variables only
-                                //   "strict" : all variables, all function parameters
-    "strict"        : true,     // true: Requires all functions run in ES5 Strict Mode
-    "maxparams"     : false,    // {int} Max number of formal params allowed per function
-    "maxdepth"      : false,    // {int} Max depth of nested blocks (within functions)
-    "maxstatements" : false,    // {int} Max number statements per function
-    "maxcomplexity" : false,    // {int} Max cyclomatic complexity per function
-    "maxlen"        : false,    // {int} Max number of characters per line
-    "varstmt"       : false,    // true: Disallow any var statements. Only `let` and `const` are allowed.
-
-    // Relaxing
-    "asi"           : false,     // true: Tolerate Automatic Semicolon Insertion (no semicolons)
-    "boss"          : false,     // true: Tolerate assignments where comparisons would be expected
-    "debug"         : false,     // true: Allow debugger statements e.g. browser breakpoints.
-    "eqnull"        : false,     // true: Tolerate use of `== null`
-    "esversion"     : 5,         // {int} Specify the ECMAScript version to which the code must adhere.
-    "moz"           : false,     // true: Allow Mozilla specific syntax (extends and overrides esnext features)
-                                 // (ex: `for each`, multiple try/catch, function expression…)
-    "evil"          : false,     // true: Tolerate use of `eval` and `new Function()`
-    "expr"          : false,     // true: Tolerate `ExpressionStatement` as Programs
-    "funcscope"     : false,     // true: Tolerate defining variables inside control statements
-    "globalstrict"  : false,     // true: Allow global "use strict" (also enables 'strict')
-    "iterator"      : false,     // true: Tolerate using the `__iterator__` property
-    "lastsemic"     : false,     // true: Tolerate omitting a semicolon for the last statement of a 1-line block
-    "laxbreak"      : false,     // true: Tolerate possibly unsafe line breakings
-    "laxcomma"      : false,     // true: Tolerate comma-first style coding
-    "loopfunc"      : false,     // true: Tolerate functions being defined in loops
-    "multistr"      : false,     // true: Tolerate multi-line strings
-    "noyield"       : false,     // true: Tolerate generator functions with no yield statement in them.
-    "notypeof"      : false,     // true: Tolerate invalid typeof operator values
-    "proto"         : false,     // true: Tolerate using the `__proto__` property
-    "scripturl"     : false,     // true: Tolerate script-targeted URLs
-    "shadow"        : false,     // true: Allows re-define variables later in code e.g. `var x=1; x=2;`
-    "sub"           : false,     // true: Tolerate using `[]` notation when it can still be expressed in dot notation
-    "supernew"      : false,     // true: Tolerate `new function () { ... };` and `new Object;`
-    "validthis"     : false,     // true: Tolerate using this in a non-constructor function
-
-    // Environments
-    "browser"       : true,     // Web Browser (window, document, etc)
-    "browserify"    : false,    // Browserify (node.js code in the browser)
-    "couch"         : false,    // CouchDB
-    "devel"         : true,     // Development/debugging (alert, confirm, etc)
-    "dojo"          : false,    // Dojo Toolkit
-    "jasmine"       : false,    // Jasmine
-    "jquery"        : true,    // jQuery
-    "mocha"         : true,     // Mocha
-    "mootools"      : false,    // MooTools
-    "node"          : false,    // Node.js
-    "nonstandard"   : false,    // Widely adopted globals (escape, unescape, etc)
-    "phantom"       : false,    // PhantomJS
-    "prototypejs"   : false,    // Prototype and Scriptaculous
-    "qunit"         : false,    // QUnit
-    "rhino"         : false,    // Rhino
-    "shelljs"       : false,    // ShellJS
-    "typed"         : false,    // Globals for typed array constructions
-    "worker"        : false,    // Web Workers
-    "wsh"           : false,    // Windows Scripting Host
-    "yui"           : false,    // Yahoo User Interface
-
-    // Custom Globals
-    "globals" : {
-      "debugOn": true,
-      "hippie": true,
-      "viewHover": true,
-      "basicEase": true
-    },
-    "esversion" : 6             // additional predefined global variables
-}
+{
+    // JSHint Default Configuration File (as on JSHint website)
+    // See http://jshint.com/docs/ for more details
+
+    "maxerr"        : 50,       // {int} Maximum error before stopping
+
+    // Enforcing
+    "bitwise"       : true,     // true: Prohibit bitwise operators (&, |, ^, etc.)
+    "camelcase"     : false,    // true: Identifiers must be in camelCase
+    "curly"         : true,     // true: Require {} for every new block or scope
+    "eqeqeq"        : true,     // true: Require triple equals (===) for comparison
+    "forin"         : true,     // true: Require filtering for..in loops with obj.hasOwnProperty()
+    "freeze"        : true,     // true: prohibits overwriting prototypes of native objects such as Array, Date etc.
+    "immed"         : false,    // true: Require immediate invocations to be wrapped in parens e.g. `(function () { } ());`
+    "latedef"       : false,    // true: Require variables/functions to be defined before being used
+    "newcap"        : false,    // true: Require capitalization of all constructor functions e.g. `new F()`
+    "noarg"         : true,     // true: Prohibit use of `arguments.caller` and `arguments.callee`
+    "noempty"       : true,     // true: Prohibit use of empty blocks
+    "nonbsp"        : true,     // true: Prohibit `non-breaking whitespace` characters.
+    "nonew"         : false,    // true: Prohibit use of constructors for side-effects (without assignment)
+    "plusplus"      : false,    // true: Prohibit use of `++` and `--`
+    "quotmark"      : false,    // Quotation mark consistency:
+                                //   false    : do nothing (default)
+                                //   true     : ensure whatever is used is consistent
+                                //   "single" : require single quotes
+                                //   "double" : require double quotes
+    "undef"         : true,     // true: Require all non-global variables to be declared (prevents global leaks)
+    "unused"        : false,    // Unused variables:
+                                //   true     : all variables, last function parameter
+                                //   "vars"   : all variables only
+                                //   "strict" : all variables, all function parameters
+    "strict"        : true,     // true: Requires all functions run in ES5 Strict Mode
+    "maxparams"     : false,    // {int} Max number of formal params allowed per function
+    "maxdepth"      : false,    // {int} Max depth of nested blocks (within functions)
+    "maxstatements" : false,    // {int} Max number statements per function
+    "maxcomplexity" : false,    // {int} Max cyclomatic complexity per function
+    "maxlen"        : false,    // {int} Max number of characters per line
+    "varstmt"       : false,    // true: Disallow any var statements. Only `let` and `const` are allowed.
+
+    // Relaxing
+    "asi"           : false,     // true: Tolerate Automatic Semicolon Insertion (no semicolons)
+    "boss"          : false,     // true: Tolerate assignments where comparisons would be expected
+    "debug"         : false,     // true: Allow debugger statements e.g. browser breakpoints.
+    "eqnull"        : false,     // true: Tolerate use of `== null`
+    "esversion"     : 5,         // {int} Specify the ECMAScript version to which the code must adhere.
+    "moz"           : false,     // true: Allow Mozilla specific syntax (extends and overrides esnext features)
+                                 // (ex: `for each`, multiple try/catch, function expression…)
+    "evil"          : false,     // true: Tolerate use of `eval` and `new Function()`
+    "expr"          : false,     // true: Tolerate `ExpressionStatement` as Programs
+    "funcscope"     : false,     // true: Tolerate defining variables inside control statements
+    "globalstrict"  : false,     // true: Allow global "use strict" (also enables 'strict')
+    "iterator"      : false,     // true: Tolerate using the `__iterator__` property
+    "lastsemic"     : false,     // true: Tolerate omitting a semicolon for the last statement of a 1-line block
+    "laxbreak"      : false,     // true: Tolerate possibly unsafe line breakings
+    "laxcomma"      : false,     // true: Tolerate comma-first style coding
+    "loopfunc"      : false,     // true: Tolerate functions being defined in loops
+    "multistr"      : false,     // true: Tolerate multi-line strings
+    "noyield"       : false,     // true: Tolerate generator functions with no yield statement in them.
+    "notypeof"      : false,     // true: Tolerate invalid typeof operator values
+    "proto"         : false,     // true: Tolerate using the `__proto__` property
+    "scripturl"     : false,     // true: Tolerate script-targeted URLs
+    "shadow"        : false,     // true: Allows re-define variables later in code e.g. `var x=1; x=2;`
+    "sub"           : false,     // true: Tolerate using `[]` notation when it can still be expressed in dot notation
+    "supernew"      : false,     // true: Tolerate `new function () { ... };` and `new Object;`
+    "validthis"     : false,     // true: Tolerate using this in a non-constructor function
+
+    // Environments
+    "browser"       : true,     // Web Browser (window, document, etc)
+    "browserify"    : false,    // Browserify (node.js code in the browser)
+    "couch"         : false,    // CouchDB
+    "devel"         : true,     // Development/debugging (alert, confirm, etc)
+    "dojo"          : false,    // Dojo Toolkit
+    "jasmine"       : false,    // Jasmine
+    "jquery"        : true,     // jQuery
+    "mocha"         : true,     // Mocha
+    "mootools"      : false,    // MooTools
+    "node"          : false,    // Node.js
+    "nonstandard"   : false,    // Widely adopted globals (escape, unescape, etc)
+    "phantom"       : false,    // PhantomJS
+    "prototypejs"   : false,    // Prototype and Scriptaculous
+    "qunit"         : false,    // QUnit
+    "rhino"         : false,    // Rhino
+    "shelljs"       : false,    // ShellJS
+    "typed"         : false,    // Globals for typed array constructions
+    "worker"        : false,    // Web Workers
+    "wsh"           : false,    // Windows Scripting Host
+    "yui"           : false,    // Yahoo User Interface
+
+    // Custom globals
+    "globals" : {
+      "debugOn": true,
+      "hippie": true,
+      "viewHover": true,
+      "basicEase": true
+    },
+    "esversion" : 6             // additional predefined global variables
+}
diff --git a/README.md b/README.md
index b8f82c0..fcb01d0 100644
--- a/README.md
+++ b/README.md
@@ -1,19 +1,30 @@
-# HIPPIE
-
-## USE (work in progress (it is not ready to be used))
-
-Clone the repo `https://github.com/sthag/hippie.git`.
-
-Change to the newly created folder. By default this would be *hippie*.
-
-Run the command `npm install`.
-This will install all nodejs dependencies into the filder *node_modules*.
-
-Run the command `gulp`.
-This will create a folder *build* with the resulting files.
-
-## LOGIC
-
-Klassennamen enthalten Objektnamen und Funktionen
-Sie sind mit `-` und `_` unterteilt.
-Der Bindestrich `-` trennt Objektnamen von Funktionen. Der Unterstrich `_` wiederum unterteilt Funktionsbezeichnungen.
+# HIPPIE
+
+> WORK IN PROGRESS (it is not ready to be used)
+
+This is a [node.js](https://nodejs.org/) based generator for static HTML based sites.
+
+It uses the [gulp](https://gulpjs.com/) module to fiddle everything together. Styling is powered by the CSS extension language [SASS](https://sass-lang.com/). The HTML pages itself are made with the templating engine [Nunjucks](https://mozilla.github.io/nunjucks/).
+
+## USAGE
+
+Clone the repo `https://github.com/sthag/hippie.git` to a folder to create your build environment.
+
+Change to the newly created folder. By default this would be *hippie*.
+
+Run the command `npm install`.
+This will install all node.js dependencies into the folder *node_modules*.
+
+The command `gulp --tasks` will give you an overview of possible actions.
+
+Run the command `gulp` for a live development environment.
+This will create a folder *build* with the resulting files to use.
+Also the source files will be watched for changes which are reflected live at [localhost:3000](htpp://localhost:3000)
+
+`gulp build` will create the resulting *build* directory ready for deployment.
+
+## LOGIC
+
+> Klassennamen enthalten Objektnamen und Funktionen
+> Sie sind mit `-` und `_` unterteilt.
+> Der Bindestrich `-` trennt Objektnamen von Funktionen. Der Unterstrich `_` wiederum unterteilt Funktionsbezeichnungen.
diff --git a/gulpfile.js b/gulpfile.js
index cf783bb..0673417 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -35,10 +35,11 @@ const changed = require('gulp-changed');
 const merge = require('merge-stream');
 const spritesmith = require('gulp.spritesmith');
 const babel = require('gulp-babel');
+const htmlValidator = require('gulp-w3c-html-validator');
 // const buffer = require('vinyl-buffer');
 // const imagemin = require('gulp-imagemin');
 
-// Paths to data
+// Data variables
 const input = {
 	root: 'source',
 	screens: 'source/screens/**/*.+(njk|html)',
@@ -94,8 +95,6 @@ if (fs.existsSync('source/data/data.json')) {
 
 // Clean build folder
 function clean () {
-	// You can use multiple globbing patterns as you would with `gulp.src`,
-	// for example if you are using del 2.0 or above, return its promise
 	return del(output.root +'/**');
 }
 
@@ -134,6 +133,12 @@ function nunjucks () {
 	.pipe(dest(output.root));
 }
 
+function validate () {
+	return src('build/**/*.html')
+	.pipe(htmlValidator())
+	.pipe(htmlValidator.reporter());
+}
+
 // Serve files to the browser
 function serve (done) {
 	server.init({
@@ -285,6 +290,7 @@ const build = series(clean, assets, parallel(nunjucks, style, code));
 const dev = series(clean, assets, parallel(nunjucks, series(styleLint, style), series(codeLint, code)));
 
 exports.lint = parallel(series(style, styleLint), series(code, codeLint));
+exports.validate = series(nunjucks, validate);
 exports.assets = assets;
 exports.build = build;
 exports.dev = dev;
diff --git a/package-lock.json b/package-lock.json
index 5217dcc..fb48d57 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -944,6 +944,32 @@
         }
       }
     },
+    "@nodelib/fs.scandir": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz",
+      "integrity": "sha512-eGmwYQn3gxo4r7jdQnkrrN6bY478C3P+a/y72IJukF8LjB6ZHeB3c+Ehacj3sYeSmUXGlnA67/PmbM9CVwL7Dw==",
+      "dev": true,
+      "requires": {
+        "@nodelib/fs.stat": "2.0.3",
+        "run-parallel": "^1.1.9"
+      }
+    },
+    "@nodelib/fs.stat": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz",
+      "integrity": "sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==",
+      "dev": true
+    },
+    "@nodelib/fs.walk": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz",
+      "integrity": "sha512-1V9XOY4rDW0rehzbrcqAmHnz8e7SKvX27gh8Gt2WgB0+pdzdiLV83p72kZPU+jvMbS1qU5mauP2iOvO8rhmurQ==",
+      "dev": true,
+      "requires": {
+        "@nodelib/fs.scandir": "2.1.3",
+        "fastq": "^1.6.0"
+      }
+    },
     "@types/events": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/@types/events/-/events-3.0.0.tgz",
@@ -968,9 +994,9 @@
       "dev": true
     },
     "@types/node": {
-      "version": "12.0.12",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-12.0.12.tgz",
-      "integrity": "sha512-Uy0PN4R5vgBUXFoJrKryf5aTk3kJ8Rv3PdlHjl6UaX+Cqp1QE0yPQ68MPXGrZOfG7gZVNDIJZYyot0B9ubXUrQ==",
+      "version": "12.12.8",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-12.12.8.tgz",
+      "integrity": "sha512-XLla8N+iyfjvsa0KKV+BP/iGSoTmwxsu5Ci5sM33z9TjohF72DEz95iNvD6pPmemvbQgxAv/909G73gUn8QR7w==",
       "dev": true
     },
     "JSV": {
@@ -1047,6 +1073,33 @@
       "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8=",
       "dev": true
     },
+    "agent-base": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-4.3.0.tgz",
+      "integrity": "sha512-salcGninV0nPrwpGNn4VTXBb1SOuXQBiqbrNXoeizJsHrsL6ERFM2Ne3JUSBWRE6aeNJI2ROP/WEEIDUiDe3cg==",
+      "dev": true,
+      "requires": {
+        "es6-promisify": "^5.0.0"
+      }
+    },
+    "aggregate-error": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.0.1.tgz",
+      "integrity": "sha512-quoaXsZ9/BLNae5yiNoUz+Nhkwz83GhWwtYFglcjEQB2NDHCIpApbqXxIFnm4Pq/Nvhrsq5sYJFyohrrxnTGAA==",
+      "dev": true,
+      "requires": {
+        "clean-stack": "^2.0.0",
+        "indent-string": "^4.0.0"
+      },
+      "dependencies": {
+        "indent-string": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz",
+          "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==",
+          "dev": true
+        }
+      }
+    },
     "ajv": {
       "version": "5.5.2",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
@@ -1325,13 +1378,10 @@
       }
     },
     "array-union": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
-      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
-      "dev": true,
-      "requires": {
-        "array-uniq": "^1.0.1"
-      }
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
+      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
+      "dev": true
     },
     "array-uniq": {
       "version": "1.0.3",
@@ -1378,6 +1428,12 @@
       "integrity": "sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c=",
       "dev": true
     },
+    "ast-types": {
+      "version": "0.13.2",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.13.2.tgz",
+      "integrity": "sha512-uWMHxJxtfj/1oZClOxDEV1sQ1HCDkA4MG8Gr69KKeBjEVH0R84WlejZ0y2DcwyBlpAEMltmVYkVgqfLFb2oyiA==",
+      "dev": true
+    },
     "async": {
       "version": "1.5.2",
       "resolved": "http://registry.npmjs.org/async/-/async-1.5.2.tgz",
@@ -1442,18 +1498,18 @@
       "dev": true
     },
     "autoprefixer": {
-      "version": "9.6.1",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.6.1.tgz",
-      "integrity": "sha512-aVo5WxR3VyvyJxcJC3h4FKfwCQvQWb1tSI5VHNibddCVWrcD1NvlxEweg3TSgiPztMnWfjpy2FURKA2kvDE+Tw==",
+      "version": "9.7.1",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.7.1.tgz",
+      "integrity": "sha512-w3b5y1PXWlhYulevrTJ0lizkQ5CyqfeU6BIRDbuhsMupstHQOeb1Ur80tcB1zxSu7AwyY/qCQ7Vvqklh31ZBFw==",
       "dev": true,
       "requires": {
-        "browserslist": "^4.6.3",
-        "caniuse-lite": "^1.0.30000980",
+        "browserslist": "^4.7.2",
+        "caniuse-lite": "^1.0.30001006",
         "chalk": "^2.4.2",
         "normalize-range": "^0.1.2",
         "num2fraction": "^1.2.2",
-        "postcss": "^7.0.17",
-        "postcss-value-parser": "^4.0.0"
+        "postcss": "^7.0.21",
+        "postcss-value-parser": "^4.0.2"
       },
       "dependencies": {
         "ansi-styles": {
@@ -1465,6 +1521,23 @@
             "color-convert": "^1.9.0"
           }
         },
+        "browserslist": {
+          "version": "4.7.2",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.7.2.tgz",
+          "integrity": "sha512-uZavT/gZXJd2UTi9Ov7/Z340WOSQ3+m1iBVRUknf+okKxonL9P83S3ctiBDtuRmRu8PiCHjqyueqQ9HYlJhxiw==",
+          "dev": true,
+          "requires": {
+            "caniuse-lite": "^1.0.30001004",
+            "electron-to-chromium": "^1.3.295",
+            "node-releases": "^1.1.38"
+          }
+        },
+        "caniuse-lite": {
+          "version": "1.0.30001010",
+          "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001010.tgz",
+          "integrity": "sha512-RA5GH9YjFNea4ZQszdWgh2SC+dpLiRAg4VDQS2b5JRI45OxmbGrYocYHTa9x0bKMQUE7uvHkNPNffUr+pCxSGw==",
+          "dev": true
+        },
         "chalk": {
           "version": "2.4.2",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
@@ -1476,6 +1549,27 @@
             "supports-color": "^5.3.0"
           }
         },
+        "electron-to-chromium": {
+          "version": "1.3.306",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.306.tgz",
+          "integrity": "sha512-frDqXvrIROoYvikSKTIKbHbzO6M3/qC6kCIt/1FOa9kALe++c4VAJnwjSFvf1tYLEUsP2n9XZ4XSCyqc3l7A/A==",
+          "dev": true
+        },
+        "node-releases": {
+          "version": "1.1.40",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.40.tgz",
+          "integrity": "sha512-r4LPcC5b/bS8BdtWH1fbeK88ib/wg9aqmg6/s3ngNLn2Ewkn/8J6Iw3P9RTlfIAdSdvYvQl2thCY5Y+qTAQ2iQ==",
+          "dev": true,
+          "requires": {
+            "semver": "^6.3.0"
+          }
+        },
+        "semver": {
+          "version": "6.3.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+          "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+          "dev": true
+        },
         "supports-color": {
           "version": "5.5.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -2559,6 +2653,12 @@
         }
       }
     },
+    "clean-stack": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz",
+      "integrity": "sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==",
+      "dev": true
+    },
     "cli": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cli/-/cli-1.0.1.tgz",
@@ -2829,6 +2929,12 @@
       "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s=",
       "dev": true
     },
+    "cookiejar": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/cookiejar/-/cookiejar-2.1.2.tgz",
+      "integrity": "sha512-Mw+adcfzPxcPeI+0WlvRrr/3lGVO0bD75SxX6811cxSh1Wbxx7xZBGK1eVtDf6si8rg2lhnUjsVLMFMfbRIuwA==",
+      "dev": true
+    },
     "copy-descriptor": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
@@ -3077,55 +3183,60 @@
         }
       }
     },
-    "del": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
-      "integrity": "sha512-QwGuEUouP2kVwQenAsOof5Fv8K9t3D8Ca8NxcXKrIpEHjTXK5J2nXLdP+ALI1cgv8wj7KuwBhTwBkOZSJKM5XQ==",
+    "degenerator": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/degenerator/-/degenerator-1.0.4.tgz",
+      "integrity": "sha1-/PSQo37OJmRk2cxDGrmMWBnO0JU=",
       "dev": true,
       "requires": {
-        "@types/glob": "^7.1.1",
-        "globby": "^6.1.0",
-        "is-path-cwd": "^2.0.0",
-        "is-path-in-cwd": "^2.0.0",
-        "p-map": "^2.0.0",
-        "pify": "^4.0.1",
-        "rimraf": "^2.6.3"
+        "ast-types": "0.x.x",
+        "escodegen": "1.x.x",
+        "esprima": "3.x.x"
       },
       "dependencies": {
-        "is-path-cwd": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz",
-          "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==",
+        "esprima": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=",
+          "dev": true
+        }
+      }
+    },
+    "del": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/del/-/del-5.1.0.tgz",
+      "integrity": "sha512-wH9xOVHnczo9jN2IW68BabcecVPxacIA3g/7z6vhSU/4stOKQzeCRK0yD0A24WiAAUJmmVpWqrERcTxnLo3AnA==",
+      "dev": true,
+      "requires": {
+        "globby": "^10.0.1",
+        "graceful-fs": "^4.2.2",
+        "is-glob": "^4.0.1",
+        "is-path-cwd": "^2.2.0",
+        "is-path-inside": "^3.0.1",
+        "p-map": "^3.0.0",
+        "rimraf": "^3.0.0",
+        "slash": "^3.0.0"
+      },
+      "dependencies": {
+        "graceful-fs": {
+          "version": "4.2.3",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.3.tgz",
+          "integrity": "sha512-a30VEBm4PEdx1dRB7MFK7BejejvCvBronbLjht+sHuGYj8PHs7M/5Z+rt5lw551vZ7yfTCj4Vuyy3mSJytDWRQ==",
           "dev": true
         },
-        "is-path-in-cwd": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-2.1.0.tgz",
-          "integrity": "sha512-rNocXHgipO+rvnP6dk3zI20RpOtrAM/kzbB258Uw5BWr3TpXi861yzjo16Dn4hUox07iw5AyeMLHWsujkjzvRQ==",
-          "dev": true,
-          "requires": {
-            "is-path-inside": "^2.1.0"
-          }
-        },
-        "is-path-inside": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-2.1.0.tgz",
-          "integrity": "sha512-wiyhTzfDWsvwAW53OBWF5zuvaOGlZ6PwYxAbPVDhpm+gM09xKQGjBq/8uYN12aDvMxnAnq3dxTyoSoRNmg5YFg==",
-          "dev": true,
-          "requires": {
-            "path-is-inside": "^1.0.2"
-          }
-        },
-        "pify": {
+        "is-glob": {
           "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
-          "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
-          "dev": true
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
+          "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
+          "dev": true,
+          "requires": {
+            "is-extglob": "^2.1.1"
+          }
         },
         "rimraf": {
-          "version": "2.6.3",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.3.tgz",
-          "integrity": "sha512-mwqeW5XsA2qAejG46gYdENaxXjx9onRNCfn7L0duuP4hCuTIi/QO7PDK07KJfp1d+izWPrzEJDcSqBa0OZQriA==",
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.0.tgz",
+          "integrity": "sha512-NDGVxTsjqfunkds7CqsOiEnxln4Bo7Nddl3XhS4pXg5OzwkLqJ971ZVAAnB+DDLnF76N+VnDEiBHaVV8I06SUg==",
           "dev": true,
           "requires": {
             "glob": "^7.1.3"
@@ -3169,6 +3280,23 @@
       "integrity": "sha1-p2o+0YVb56ASu4rBbLgPPADcKPA=",
       "dev": true
     },
+    "dir-glob": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz",
+      "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==",
+      "dev": true,
+      "requires": {
+        "path-type": "^4.0.0"
+      },
+      "dependencies": {
+        "path-type": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
+          "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
+          "dev": true
+        }
+      }
+    },
     "doctrine": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
@@ -3490,6 +3618,21 @@
         "event-emitter": "~0.3.5"
       }
     },
+    "es6-promise": {
+      "version": "4.2.8",
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz",
+      "integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w==",
+      "dev": true
+    },
+    "es6-promisify": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/es6-promisify/-/es6-promisify-5.0.0.tgz",
+      "integrity": "sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM=",
+      "dev": true,
+      "requires": {
+        "es6-promise": "^4.0.3"
+      }
+    },
     "es6-set": {
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/es6-set/-/es6-set-0.1.5.tgz",
@@ -3537,6 +3680,34 @@
       "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
       "dev": true
     },
+    "escodegen": {
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.12.0.tgz",
+      "integrity": "sha512-TuA+EhsanGcme5T3R0L80u4t8CpbXQjegRmf7+FPTJrtCTErXFeelblRgHQa1FofEzqYYJmJ/OqjTwREp9qgmg==",
+      "dev": true,
+      "requires": {
+        "esprima": "^3.1.3",
+        "estraverse": "^4.2.0",
+        "esutils": "^2.0.2",
+        "optionator": "^0.8.1",
+        "source-map": "~0.6.1"
+      },
+      "dependencies": {
+        "esprima": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=",
+          "dev": true
+        },
+        "source-map": {
+          "version": "0.6.1",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
     "escope": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/escope/-/escope-3.6.0.tgz",
@@ -3826,6 +3997,82 @@
       "integrity": "sha1-wFNHeBfIa1HaqFPIHgWbcz0CNhQ=",
       "dev": true
     },
+    "fast-glob": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.1.0.tgz",
+      "integrity": "sha512-TrUz3THiq2Vy3bjfQUB2wNyPdGBeGmdjbzzBLhfHN4YFurYptCKwGq/TfiRavbGywFRzY6U2CdmQ1zmsY5yYaw==",
+      "dev": true,
+      "requires": {
+        "@nodelib/fs.stat": "^2.0.2",
+        "@nodelib/fs.walk": "^1.2.3",
+        "glob-parent": "^5.1.0",
+        "merge2": "^1.3.0",
+        "micromatch": "^4.0.2"
+      },
+      "dependencies": {
+        "braces": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
+          "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+          "dev": true,
+          "requires": {
+            "fill-range": "^7.0.1"
+          }
+        },
+        "fill-range": {
+          "version": "7.0.1",
+          "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
+          "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+          "dev": true,
+          "requires": {
+            "to-regex-range": "^5.0.1"
+          }
+        },
+        "glob-parent": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.0.tgz",
+          "integrity": "sha512-qjtRgnIVmOfnKUE3NJAQEdk+lKrxfw8t5ke7SXtfMTHcjsBfOfWXCQfdb30zfDoZQ2IRSIiidmjtbHZPZ++Ihw==",
+          "dev": true,
+          "requires": {
+            "is-glob": "^4.0.1"
+          }
+        },
+        "is-glob": {
+          "version": "4.0.1",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
+          "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
+          "dev": true,
+          "requires": {
+            "is-extglob": "^2.1.1"
+          }
+        },
+        "is-number": {
+          "version": "7.0.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+          "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+          "dev": true
+        },
+        "micromatch": {
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.2.tgz",
+          "integrity": "sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==",
+          "dev": true,
+          "requires": {
+            "braces": "^3.0.1",
+            "picomatch": "^2.0.5"
+          }
+        },
+        "to-regex-range": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+          "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+          "dev": true,
+          "requires": {
+            "is-number": "^7.0.0"
+          }
+        }
+      }
+    },
     "fast-json-stable-stringify": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz",
@@ -3838,6 +4085,15 @@
       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
       "dev": true
     },
+    "fastq": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.6.0.tgz",
+      "integrity": "sha512-jmxqQ3Z/nXoeyDmWAzF9kH1aGZSis6e/SbfPmJpUnyZ0ogr6iscHQaml4wsEepEWSdtmpy+eVXmCRIMpxaXqOA==",
+      "dev": true,
+      "requires": {
+        "reusify": "^1.0.0"
+      }
+    },
     "figures": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
@@ -3858,6 +4114,12 @@
         "object-assign": "^4.0.1"
       }
     },
+    "file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "dev": true
+    },
     "fill-range": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
@@ -4034,6 +4296,12 @@
         }
       }
     },
+    "formidable": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/formidable/-/formidable-1.2.1.tgz",
+      "integrity": "sha512-Fs9VRguL0gqGHkXS5GQiMCr1VhZBxz0JnJs4JmMp/2jL18Fmbzvv7vOFRU+U8TBkHEE/CX1qDXzJplVULgsLeg==",
+      "dev": true
+    },
     "fragment-cache": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
@@ -4097,6 +4365,42 @@
         "rimraf": "2"
       }
     },
+    "ftp": {
+      "version": "0.3.10",
+      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz",
+      "integrity": "sha1-kZfYYa2BQvPmPVqDv+TFn3MwiF0=",
+      "dev": true,
+      "requires": {
+        "readable-stream": "1.1.x",
+        "xregexp": "2.0.0"
+      },
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.1.14",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+          "dev": true,
+          "requires": {
+            "core-util-is": "~1.0.0",
+            "inherits": "~2.0.1",
+            "isarray": "0.0.1",
+            "string_decoder": "~0.10.x"
+          }
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        }
+      }
+    },
     "function-bind": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
@@ -4177,6 +4481,28 @@
       "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
       "dev": true
     },
+    "get-uri": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/get-uri/-/get-uri-2.0.4.tgz",
+      "integrity": "sha512-v7LT/s8kVjs+Tx0ykk1I+H/rbpzkHvuIq87LmeXptcf5sNWm9uQiwjNAt94SJPA1zOlCntmnOlJvVWKmzsxG8Q==",
+      "dev": true,
+      "requires": {
+        "data-uri-to-buffer": "1",
+        "debug": "2",
+        "extend": "~3.0.2",
+        "file-uri-to-path": "1",
+        "ftp": "~0.3.10",
+        "readable-stream": "2"
+      },
+      "dependencies": {
+        "data-uri-to-buffer": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-1.2.0.tgz",
+          "integrity": "sha512-vKQ9DTQPN1FLYiiEEOQ6IBGFqvjCa5rSK3cWMy/Nespm5d/x3dGFT9UBZnkLxCwua/IXBi2TYnwTEpsOvhC4UQ==",
+          "dev": true
+        }
+      }
+    },
     "get-value": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
@@ -4325,16 +4651,27 @@
       "dev": true
     },
     "globby": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
-      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.1.tgz",
+      "integrity": "sha512-sSs4inE1FB2YQiymcmTv6NWENryABjUNPeWhOvmn4SjtKybglsyPZxFB3U1/+L1bYi0rNZDqCLlHyLYDl1Pq5A==",
       "dev": true,
       "requires": {
-        "array-union": "^1.0.1",
-        "glob": "^7.0.3",
-        "object-assign": "^4.0.1",
-        "pify": "^2.0.0",
-        "pinkie-promise": "^2.0.0"
+        "@types/glob": "^7.1.1",
+        "array-union": "^2.1.0",
+        "dir-glob": "^3.0.1",
+        "fast-glob": "^3.0.3",
+        "glob": "^7.1.3",
+        "ignore": "^5.1.1",
+        "merge2": "^1.2.3",
+        "slash": "^3.0.0"
+      },
+      "dependencies": {
+        "ignore": {
+          "version": "5.1.4",
+          "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.4.tgz",
+          "integrity": "sha512-MzbUSahkTW1u7JpKKjY7LCARd1fU5W2rLdxlM4kdkayuCwZImjkpluF9CM1aLewYJguPDqewLam18Y6AU69A8A==",
+          "dev": true
+        }
       }
     },
     "globule": {
@@ -4457,15 +4794,15 @@
       }
     },
     "gulp-autoprefixer": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-autoprefixer/-/gulp-autoprefixer-6.1.0.tgz",
-      "integrity": "sha512-Ti/BUFe+ekhbDJfspZIMiOsOvw51KhI9EncsDfK7NaxjqRm+v4xS9v99kPxEoiDavpWqQWvG8Y6xT1mMlB3aXA==",
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/gulp-autoprefixer/-/gulp-autoprefixer-7.0.1.tgz",
+      "integrity": "sha512-QJGEmHw+bEt7FSqvmbAUTxbCuNLJYx4sz3ox9WouYqT/7j5FH5CQ8ZnpL1M7H5npX1bUJa7lUVY1w20jXxhOxg==",
       "dev": true,
       "requires": {
-        "autoprefixer": "^9.5.1",
+        "autoprefixer": "^9.6.1",
         "fancy-log": "^1.3.2",
         "plugin-error": "^1.0.1",
-        "postcss": "^7.0.2",
+        "postcss": "^7.0.17",
         "through2": "^3.0.1",
         "vinyl-sourcemaps-apply": "^0.2.1"
       },
@@ -4536,30 +4873,44 @@
       }
     },
     "gulp-changed": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-3.2.0.tgz",
-      "integrity": "sha1-zumGbZSeCRh1IlI9bGVWX24yvXw=",
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-4.0.2.tgz",
+      "integrity": "sha512-rAvQt+ByaqrMuJLwucvxC+MC02Vh8ksiJ16hoQlk4xnmlHiLJMque2aXXQMmyocQac3RIjNRcyr7iG1TNH15GA==",
       "dev": true,
       "requires": {
-        "make-dir": "^1.1.0",
-        "pify": "^3.0.0",
-        "plugin-error": "^0.1.2",
+        "make-dir": "^3.0.0",
+        "plugin-error": "^1.0.1",
         "replace-ext": "^1.0.0",
-        "through2": "^2.0.0",
+        "through2": "^3.0.1",
         "touch": "^3.1.0"
       },
       "dependencies": {
-        "pify": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
-          "dev": true
+        "plugin-error": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
+          "integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
+          "dev": true,
+          "requires": {
+            "ansi-colors": "^1.0.1",
+            "arr-diff": "^4.0.0",
+            "arr-union": "^3.1.0",
+            "extend-shallow": "^3.0.2"
+          }
         },
         "replace-ext": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz",
           "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs=",
           "dev": true
+        },
+        "through2": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-3.0.1.tgz",
+          "integrity": "sha512-M96dvTalPT3YbYLaKaCuwu+j06D/8Jfib0o/PxbVt6Amhv3dUAtW6rTV1jPgJSBG83I/e04Y6xkVdVhSRhi0ww==",
+          "dev": true,
+          "requires": {
+            "readable-stream": "2 || 3"
+          }
         }
       }
     },
@@ -4655,14 +5006,25 @@
       }
     },
     "gulp-if": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz",
-      "integrity": "sha1-pJe351cwBQQcqivIt92jyARE1ik=",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-3.0.0.tgz",
+      "integrity": "sha512-fCUEngzNiEZEK2YuPm+sdMpO6ukb8+/qzbGfJBXyNOXz85bCG7yBI+pPSl+N90d7gnLvMsarthsAImx0qy7BAw==",
       "dev": true,
       "requires": {
-        "gulp-match": "^1.0.3",
-        "ternary-stream": "^2.0.1",
-        "through2": "^2.0.1"
+        "gulp-match": "^1.1.0",
+        "ternary-stream": "^3.0.0",
+        "through2": "^3.0.1"
+      },
+      "dependencies": {
+        "through2": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-3.0.1.tgz",
+          "integrity": "sha512-M96dvTalPT3YbYLaKaCuwu+j06D/8Jfib0o/PxbVt6Amhv3dUAtW6rTV1jPgJSBG83I/e04Y6xkVdVhSRhi0ww==",
+          "dev": true,
+          "requires": {
+            "readable-stream": "2 || 3"
+          }
+        }
       }
     },
     "gulp-jshint": {
@@ -4690,9 +5052,9 @@
       }
     },
     "gulp-match": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz",
-      "integrity": "sha1-kcfA1/Kb7NZgbVfYCn+Hdqh6uo4=",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.1.0.tgz",
+      "integrity": "sha512-DlyVxa1Gj24DitY2OjEsS+X6tDpretuxD6wTfhXE/Rw2hweqc1f6D/XtsJmoiCwLWfXgR87W9ozEityPCVzGtQ==",
       "dev": true,
       "requires": {
         "minimatch": "^3.0.3"
@@ -5005,6 +5367,92 @@
         }
       }
     },
+    "gulp-w3c-html-validator": {
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/gulp-w3c-html-validator/-/gulp-w3c-html-validator-1.4.4.tgz",
+      "integrity": "sha512-26CYZz8p0gtzLdf23ziG/ML6eCMlbnabhk3gzvicQ269XusYMcecyEIUJTaWxbRerVyXkh71zY7EbcOSsLItdQ==",
+      "dev": true,
+      "requires": {
+        "ansi-colors": "~4.1",
+        "fancy-log": "~1.3",
+        "plugin-error": "~1.0",
+        "through2": "~3.0",
+        "vinyl": "~2.2",
+        "w3cjs": "~0.4"
+      },
+      "dependencies": {
+        "ansi-colors": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.1.tgz",
+          "integrity": "sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA==",
+          "dev": true
+        },
+        "clone": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
+          "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18=",
+          "dev": true
+        },
+        "clone-stats": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz",
+          "integrity": "sha1-s3gt/4u1R04Yuba/D9/ngvh3doA=",
+          "dev": true
+        },
+        "plugin-error": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
+          "integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
+          "dev": true,
+          "requires": {
+            "ansi-colors": "^1.0.1",
+            "arr-diff": "^4.0.0",
+            "arr-union": "^3.1.0",
+            "extend-shallow": "^3.0.2"
+          },
+          "dependencies": {
+            "ansi-colors": {
+              "version": "1.1.0",
+              "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-1.1.0.tgz",
+              "integrity": "sha512-SFKX67auSNoVR38N3L+nvsPjOE0bybKTYbkf5tRvushrAPQ9V75huw0ZxBkKVeRU9kqH3d6HA4xTckbwZ4ixmA==",
+              "dev": true,
+              "requires": {
+                "ansi-wrap": "^0.1.0"
+              }
+            }
+          }
+        },
+        "replace-ext": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz",
+          "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs=",
+          "dev": true
+        },
+        "through2": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-3.0.1.tgz",
+          "integrity": "sha512-M96dvTalPT3YbYLaKaCuwu+j06D/8Jfib0o/PxbVt6Amhv3dUAtW6rTV1jPgJSBG83I/e04Y6xkVdVhSRhi0ww==",
+          "dev": true,
+          "requires": {
+            "readable-stream": "2 || 3"
+          }
+        },
+        "vinyl": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.2.0.tgz",
+          "integrity": "sha512-MBH+yP0kC/GQ5GwBqrTPTzEfiiLjta7hTtvQtbxBgTeSXsmKQRQecjibMbxIXzVT3Y9KJK+drOz1/k+vsu8Nkg==",
+          "dev": true,
+          "requires": {
+            "clone": "^2.1.1",
+            "clone-buffer": "^1.0.0",
+            "clone-stats": "^1.0.0",
+            "cloneable-readable": "^1.0.0",
+            "remove-trailing-separator": "^1.0.1",
+            "replace-ext": "^1.0.0"
+          }
+        }
+      }
+    },
     "gulp.spritesmith": {
       "version": "6.11.0",
       "resolved": "https://registry.npmjs.org/gulp.spritesmith/-/gulp.spritesmith-6.11.0.tgz",
@@ -5338,6 +5786,27 @@
         "requires-port": "1.x.x"
       }
     },
+    "http-proxy-agent": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-2.1.0.tgz",
+      "integrity": "sha512-qwHbBLV7WviBl0rQsOzH6o5lwyOIvwp/BdFnvVxXORldu5TmjFfjzBcWUWS5kWAZhmv+JtiDhSuQCp4sBfbIgg==",
+      "dev": true,
+      "requires": {
+        "agent-base": "4",
+        "debug": "3.1.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "dev": true,
+          "requires": {
+            "ms": "2.0.0"
+          }
+        }
+      }
+    },
     "http-signature": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
@@ -5349,6 +5818,33 @@
         "sshpk": "^1.7.0"
       }
     },
+    "https-proxy-agent": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.4.tgz",
+      "integrity": "sha512-OmvfoQ53WLjtA9HeYP9RNrWMJzzAz1JGaSFr1nijg0PVR1JaD/xbJq1mdEIIlxGpXp9eSe/O2LgU9DJmTPd0Eg==",
+      "dev": true,
+      "requires": {
+        "agent-base": "^4.3.0",
+        "debug": "^3.1.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.2.6",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
+          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "dev": true,
+          "requires": {
+            "ms": "^2.1.1"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+          "dev": true
+        }
+      }
+    },
     "iconv-lite": {
       "version": "0.4.24",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@@ -5467,6 +5963,12 @@
       "integrity": "sha1-ge9X/l0FgUzVjCSDYyqZwwoOgIc=",
       "dev": true
     },
+    "ip": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
+      "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=",
+      "dev": true
+    },
     "irregular-plurals": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.4.0.tgz",
@@ -5629,6 +6131,18 @@
         "lodash.isfinite": "^3.3.2"
       }
     },
+    "is-path-cwd": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz",
+      "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==",
+      "dev": true
+    },
+    "is-path-inside": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.2.tgz",
+      "integrity": "sha512-/2UGPSgmtqwo1ktx8NDHjuPwZWmHhO+gj0f93EkhLB5RgW9RZevWYYlIkS6zePc6U2WpOdQYIwHe9YC4DWEBVg==",
+      "dev": true
+    },
     "is-plain-object": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
@@ -6280,18 +6794,18 @@
       }
     },
     "make-dir": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.3.0.tgz",
-      "integrity": "sha512-2w31R7SJtieJJnQtGc7RVL2StM2vGYVfqUOvUDxH6bC6aJTxPxTF0GnIgCyu7tjockiUWAYQRbxa7vKn34s5sQ==",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.0.0.tgz",
+      "integrity": "sha512-grNJDhb8b1Jm1qeqW5R/O63wUo4UXo2v2HMic6YT9i/HBlF93S8jkMgH7yugvY9ABDShH4VZMn8I+U8+fCNegw==",
       "dev": true,
       "requires": {
-        "pify": "^3.0.0"
+        "semver": "^6.0.0"
       },
       "dependencies": {
-        "pify": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
+        "semver": {
+          "version": "6.3.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
+          "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
           "dev": true
         }
       }
@@ -6409,13 +6923,22 @@
       "dev": true
     },
     "merge-stream": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz",
-      "integrity": "sha1-QEEgLVCKNCugAXQAjfDCUbjBNeE=",
-      "dev": true,
-      "requires": {
-        "readable-stream": "^2.0.1"
-      }
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
+      "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
+      "dev": true
+    },
+    "merge2": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.3.0.tgz",
+      "integrity": "sha512-2j4DAdlBOkiSZIsaXk4mTE3sRS02yBHAtfy127xRV3bQUFqXkjHCHLW6Scv7DwNRbIWNHH8zpnz9zMaKXIdvYw==",
+      "dev": true
+    },
+    "methods": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
+      "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=",
+      "dev": true
     },
     "micromatch": {
       "version": "3.1.10",
@@ -6640,6 +7163,12 @@
       "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==",
       "dev": true
     },
+    "netmask": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/netmask/-/netmask-1.0.6.tgz",
+      "integrity": "sha1-ICl+idhvb2QA8lDZ9Pa0wZRfzTU=",
+      "dev": true
+    },
     "next-tick": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.0.0.tgz",
@@ -7250,10 +7779,59 @@
       }
     },
     "p-map": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/p-map/-/p-map-2.1.0.tgz",
-      "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==",
-      "dev": true
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz",
+      "integrity": "sha512-d3qXVTF/s+W+CdJ5A29wywV2n8CQQYahlgz2bFiA+4eVNJbHJodPZ+/gXwPGh0bOqA+j8S+6+ckmvLGPk1QpxQ==",
+      "dev": true,
+      "requires": {
+        "aggregate-error": "^3.0.0"
+      }
+    },
+    "pac-proxy-agent": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/pac-proxy-agent/-/pac-proxy-agent-2.0.2.tgz",
+      "integrity": "sha512-cDNAN1Ehjbf5EHkNY5qnRhGPUCp6SnpyVof5fRzN800QV1Y2OkzbH9rmjZkbBRa8igof903yOnjIl6z0SlAhxA==",
+      "dev": true,
+      "requires": {
+        "agent-base": "^4.2.0",
+        "debug": "^3.1.0",
+        "get-uri": "^2.0.0",
+        "http-proxy-agent": "^2.1.0",
+        "https-proxy-agent": "^2.2.1",
+        "pac-resolver": "^3.0.0",
+        "raw-body": "^2.2.0",
+        "socks-proxy-agent": "^3.0.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.2.6",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
+          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "dev": true,
+          "requires": {
+            "ms": "^2.1.1"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+          "dev": true
+        }
+      }
+    },
+    "pac-resolver": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/pac-resolver/-/pac-resolver-3.0.0.tgz",
+      "integrity": "sha512-tcc38bsjuE3XZ5+4vP96OfhOugrX+JcnpUbhfuc4LuXBLQhoTthOstZeoQJBDnQUDYzYmdImKsbz0xSl1/9qeA==",
+      "dev": true,
+      "requires": {
+        "co": "^4.6.0",
+        "degenerator": "^1.0.4",
+        "ip": "^1.1.5",
+        "netmask": "^1.0.6",
+        "thunkify": "^2.1.2"
+      }
     },
     "parse-data-uri": {
       "version": "0.2.0",
@@ -7385,6 +7963,12 @@
       "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=",
       "dev": true
     },
+    "picomatch": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.1.1.tgz",
+      "integrity": "sha512-OYMyqkKzK7blWO/+XZYP6w8hH0LDvkBvdvKukti+7kqYFCiEAk+gI3DWnryapc0Dau05ugGTy0foQ6mqn4AHYA==",
+      "dev": true
+    },
     "pify": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
@@ -7569,9 +8153,9 @@
       "dev": true
     },
     "postcss": {
-      "version": "7.0.17",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-      "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+      "version": "7.0.21",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.21.tgz",
+      "integrity": "sha512-uIFtJElxJo29QC753JzhidoAhvp/e/Exezkdhfmt8AymWT6/5B7W1WmponYWkHk2eg6sONyTch0A3nkMPun3SQ==",
       "dev": true,
       "requires": {
         "chalk": "^2.4.2",
@@ -7628,9 +8212,9 @@
       }
     },
     "postcss-value-parser": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.0.0.tgz",
-      "integrity": "sha512-ESPktioptiSUchCKgggAkzdmkgzKfmp0EU8jXH+5kbIUB+unr0Y4CY9SRMvibuvYUBjNh1ACLbxqYNpdTQOteQ==",
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.0.2.tgz",
+      "integrity": "sha512-LmeoohTpp/K4UiyQCwuGWlONxXamGzCMtFxLq4W1nZVGIQLYvMCJx3yAF9qyyuFpflABI9yVdtJAqbihOsCsJQ==",
       "dev": true
     },
     "prelude-ls": {
@@ -7663,6 +8247,45 @@
       "integrity": "sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74=",
       "dev": true
     },
+    "proxy-agent": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/proxy-agent/-/proxy-agent-2.3.1.tgz",
+      "integrity": "sha512-CNKuhC1jVtm8KJYFTS2ZRO71VCBx3QSA92So/e6NrY6GoJonkx3Irnk4047EsCcswczwqAekRj3s8qLRGahSKg==",
+      "dev": true,
+      "requires": {
+        "agent-base": "^4.2.0",
+        "debug": "^3.1.0",
+        "http-proxy-agent": "^2.1.0",
+        "https-proxy-agent": "^2.2.1",
+        "lru-cache": "^4.1.2",
+        "pac-proxy-agent": "^2.0.1",
+        "proxy-from-env": "^1.0.0",
+        "socks-proxy-agent": "^3.0.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.2.6",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
+          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "dev": true,
+          "requires": {
+            "ms": "^2.1.1"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+          "dev": true
+        }
+      }
+    },
+    "proxy-from-env": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.0.0.tgz",
+      "integrity": "sha1-M8UDmPcOp+uW0h97gXYwpVeRx+4=",
+      "dev": true
+    },
     "pseudomap": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz",
@@ -8392,6 +9015,12 @@
       "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==",
       "dev": true
     },
+    "reusify": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz",
+      "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
+      "dev": true
+    },
     "rimraf": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.2.tgz",
@@ -8410,6 +9039,12 @@
         "once": "^1.3.0"
       }
     },
+    "run-parallel": {
+      "version": "1.1.9",
+      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.1.9.tgz",
+      "integrity": "sha512-DEqnSRTDw/Tc3FXf49zedI638Z9onwUotBMiUFKmrO2sdFKIbXamXGQ3Axd4qgphxKB4kw/qP1w5kTxnfU1B9Q==",
+      "dev": true
+    },
     "rx": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
@@ -8736,12 +9371,24 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=",
       "dev": true
     },
+    "slash": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
+      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+      "dev": true
+    },
     "slice-ansi": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-0.0.4.tgz",
       "integrity": "sha1-7b+JA/ZvfOL46v1s7tZeJkyDGzU=",
       "dev": true
     },
+    "smart-buffer": {
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/smart-buffer/-/smart-buffer-1.1.15.tgz",
+      "integrity": "sha1-fxFLW2X6s+KjWqd1uxLw0cZJvxY=",
+      "dev": true
+    },
     "snapdragon": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
@@ -8999,6 +9646,26 @@
         }
       }
     },
+    "socks": {
+      "version": "1.1.10",
+      "resolved": "https://registry.npmjs.org/socks/-/socks-1.1.10.tgz",
+      "integrity": "sha1-W4t/x8jzQcU+0FbpKbe/Tei6e1o=",
+      "dev": true,
+      "requires": {
+        "ip": "^1.1.4",
+        "smart-buffer": "^1.0.13"
+      }
+    },
+    "socks-proxy-agent": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/socks-proxy-agent/-/socks-proxy-agent-3.0.1.tgz",
+      "integrity": "sha512-ZwEDymm204mTzvdqyUqOdovVr2YRd2NYskrYrF2LXyZ9qDiMAoFESGK8CRphiO7rtbo2Y757k2Nia3x2hGtalA==",
+      "dev": true,
+      "requires": {
+        "agent-base": "^4.1.0",
+        "socks": "^1.1.10"
+      }
+    },
     "source-map": {
       "version": "0.5.7",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
@@ -9315,6 +9982,74 @@
       "integrity": "sha1-HhX7ysl9Pumb8tc7TGVrCCu6+5E=",
       "dev": true
     },
+    "superagent": {
+      "version": "3.8.3",
+      "resolved": "https://registry.npmjs.org/superagent/-/superagent-3.8.3.tgz",
+      "integrity": "sha512-GLQtLMCoEIK4eDv6OGtkOoSMt3D+oq0y3dsxMuYuDvaNUvuT8eFBuLmfR0iYYzHC1e8hpzC6ZsxbuP6DIalMFA==",
+      "dev": true,
+      "requires": {
+        "component-emitter": "^1.2.0",
+        "cookiejar": "^2.1.0",
+        "debug": "^3.1.0",
+        "extend": "^3.0.0",
+        "form-data": "^2.3.1",
+        "formidable": "^1.2.0",
+        "methods": "^1.1.1",
+        "mime": "^1.4.1",
+        "qs": "^6.5.1",
+        "readable-stream": "^2.3.5"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.2.6",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
+          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "dev": true,
+          "requires": {
+            "ms": "^2.1.1"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+          "dev": true
+        },
+        "qs": {
+          "version": "6.9.1",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.1.tgz",
+          "integrity": "sha512-Cxm7/SS/y/Z3MHWSxXb8lIFqgqBowP5JMlTUFyJN88y0SGQhVmZnqFK/PeuMX9LzUyWsqqhNxIyg0jlzq946yA==",
+          "dev": true
+        }
+      }
+    },
+    "superagent-proxy": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/superagent-proxy/-/superagent-proxy-1.0.3.tgz",
+      "integrity": "sha512-79Ujg1lRL2ICfuHUdX+H2MjIw73kB7bXsIkxLwHURz3j0XUmEEEoJ+u/wq+mKwna21Uejsm2cGR3OESA00TIjA==",
+      "dev": true,
+      "requires": {
+        "debug": "^3.1.0",
+        "proxy-agent": "2"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.2.6",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
+          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "dev": true,
+          "requires": {
+            "ms": "^2.1.1"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+          "dev": true
+        }
+      }
+    },
     "supports-color": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
@@ -9406,15 +10141,49 @@
       }
     },
     "ternary-stream": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz",
-      "integrity": "sha1-Bk5Im0tb9gumpre8fy9cJ07Pgmk=",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-3.0.0.tgz",
+      "integrity": "sha512-oIzdi+UL/JdktkT+7KU5tSIQjj8pbShj3OASuvDEhm0NT5lppsm7aXWAmAq4/QMaBIyfuEcNLbAQA+HpaISobQ==",
       "dev": true,
       "requires": {
-        "duplexify": "^3.5.0",
+        "duplexify": "^4.1.1",
         "fork-stream": "^0.0.4",
-        "merge-stream": "^1.0.0",
-        "through2": "^2.0.1"
+        "merge-stream": "^2.0.0",
+        "through2": "^3.0.1"
+      },
+      "dependencies": {
+        "duplexify": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.1.tgz",
+          "integrity": "sha512-DY3xVEmVHTv1wSzKNbwoU6nVjzI369Y6sPoqfYr0/xlx3IdX2n94xIszTcjPO8W8ZIv0Wb0PXNcjuZyT4wiICA==",
+          "dev": true,
+          "requires": {
+            "end-of-stream": "^1.4.1",
+            "inherits": "^2.0.3",
+            "readable-stream": "^3.1.1",
+            "stream-shift": "^1.0.0"
+          }
+        },
+        "readable-stream": {
+          "version": "3.4.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.4.0.tgz",
+          "integrity": "sha512-jItXPLmrSR8jmTRmRWJXCnGJsfy85mB3Wd/uINMXA65yrnFo0cPClFIUWzo2najVNSl+mx7/4W8ttlLWJe99pQ==",
+          "dev": true,
+          "requires": {
+            "inherits": "^2.0.3",
+            "string_decoder": "^1.1.1",
+            "util-deprecate": "^1.0.1"
+          }
+        },
+        "through2": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-3.0.1.tgz",
+          "integrity": "sha512-M96dvTalPT3YbYLaKaCuwu+j06D/8Jfib0o/PxbVt6Amhv3dUAtW6rTV1jPgJSBG83I/e04Y6xkVdVhSRhi0ww==",
+          "dev": true,
+          "requires": {
+            "readable-stream": "2 || 3"
+          }
+        }
       }
     },
     "text-table": {
@@ -9459,6 +10228,12 @@
         "xtend": "~4.0.0"
       }
     },
+    "thunkify": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/thunkify/-/thunkify-2.1.2.tgz",
+      "integrity": "sha1-+qDp0jDFGsyVyhOjYawFyn4EVT0=",
+      "dev": true
+    },
     "time-stamp": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
@@ -10115,6 +10890,17 @@
         "source-map": "^0.5.1"
       }
     },
+    "w3cjs": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/w3cjs/-/w3cjs-0.4.0.tgz",
+      "integrity": "sha1-EzYk4LhlYmfPanCF2NfGlLcPBI8=",
+      "dev": true,
+      "requires": {
+        "commander": "^2.9.0",
+        "superagent": "^3.5.2",
+        "superagent-proxy": "^1.0.2"
+      }
+    },
     "which": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
@@ -10191,6 +10977,12 @@
       "integrity": "sha1-wodrBhaKrcQOV9l+gRkayPQ5iz4=",
       "dev": true
     },
+    "xregexp": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz",
+      "integrity": "sha1-UqY+VsoLhKfzpfPWGHLxJq16WUM=",
+      "dev": true
+    },
     "xtend": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
diff --git a/package.json b/package.json
index 979edd4..1ef407f 100644
--- a/package.json
+++ b/package.json
@@ -20,16 +20,16 @@
     "@babel/core": "^7.7.2",
     "@babel/preset-env": "^7.7.1",
     "browser-sync": "^2.26.7",
-    "del": "^4.1.1",
+    "del": "^5.1.0",
     "gulp": "^4.0.2",
-    "gulp-autoprefixer": "^6.1.0",
+    "gulp-autoprefixer": "^7.0.1",
     "gulp-babel": "^8.0.0",
     "gulp-cached": "^1.1.1",
-    "gulp-changed": "^3.2.0",
+    "gulp-changed": "^4.0.2",
     "gulp-clean-css": "^4.2.0",
     "gulp-concat": "^2.6.1",
     "gulp-data": "^1.3.1",
-    "gulp-if": "^2.0.2",
+    "gulp-if": "^3.0.0",
     "gulp-jshint": "^2.1.0",
     "gulp-json-concat": "^0.1.1",
     "gulp-notify": "^3.2.0",
@@ -40,10 +40,11 @@
     "gulp-sass": "^4.0.2",
     "gulp-sass-lint": "^1.4.0",
     "gulp-uglify": "^3.0.2",
+    "gulp-w3c-html-validator": "^1.4.4",
     "gulp.spritesmith": "^6.11.0",
     "jshint": "^2.10.3",
     "jshint-stylish": "^2.2.1",
-    "merge-stream": "^1.0.1",
+    "merge-stream": "^2.0.0",
     "node-sass": "^4.13.0",
     "pump": "^3.0.0"
   },
diff --git a/source/screens/demo/elements.njk b/source/screens/demo/elements.njk
index eff0b6a..31d07fe 100644
--- a/source/screens/demo/elements.njk
+++ b/source/screens/demo/elements.njk
@@ -1,80 +1,79 @@
-<!-- elements.page -->
-{% set pageId = "elements" %}
-
-{% extends "demo/_extended.njk" %}
-
-{% block title %}Elements{% endblock %}
-{% block head %}
-{{ super() }}
-{% endblock %}
-
-{% block main %}
-<div class="temp_layer">
-  <!-- <div class="exp_overlay_btn exp_help_btn">
-  <span class="span_solo">?</span>
-</div> -->
-{% include "hippie/partials/_body_nav.njk" %}
-</div>
-<div id="begin" class="">
-  <section class="sec_main_center">
-    <header class="header_txt">
-      <h1>Medienformat Abfragen</h1>
-    </header>
-    <article>
-      <div class="demo__query_example">Umbruch bei&nbsp;</div>
-      <div class="demo__queries">
-        <p class="query_phoneUp">Telefone und größer</p>
-        <p class="query_phoneOnly">Nur Telefone</p>
-        <p class="query_tabletPortaitOnly"Nur >Schreibtafeln hochkant</p>
-        <p class="query_tabletPortraitUp">Schreibtafeln und größer</p>
-        <p class="query_tabletLandscapeOnly">Schreibtafeln im Querformat</p>
-        <p class="query_tabletLandscapeUp">Schreibtafeln quer und größer</p>
-        <p class="query_desktopOnly">Nur Arbeitsplatzrechner</p>
-        <p class="query_desktopUp">Arbeitsplatzrechner und größer</p>
-        <p class="query_bigDesktopUp">Richtige Monitore und größer</p>
-      </div>
-    </article>
-  </section>
-
-  <section class="sec_main_center">
-    <header class="header_txt">
-      <h1>Übersicht aller Elemente</h1>
-      <p>Es werden alle grundlegenden Elemente sowie ihre gestalteten Varianten angegeben. Die Elemente sind in Gruppen eingeteilt, die auch das W3Consortium (<a href="https://www.w3.org/TR/2017/REC-html52-20171214/index.html#contents">www.w3.org/TR/2017/REC-html52-20171214/index.html#contents</a>) verwendet.</p>
-      <p>Zu jedem Element werden alle Attribute aufgelistet und die Umsetzung im HTML Dokument als Emmet Syntax dargestellt.</p>
-    </header>
-    <article>
-      <h1>Bereiche</h1>
-      <p>Elemente:</p>
-      <pre>// body<br>// article<br>// section<br>// nav<br>// aside<br>// h1-h6<br>// header<br>// footer</pre>
-      <h2>&lt;body&gt;</h2>
-      <p>Keine speziellen Attribute. Bekommt überlicherweise allgemeine Klassen zur Steuerung der Abmessungen zugewiesen.</p>
-      <h2>&lt;article&gt;</h2>
-      <p>Keine speziellen Attribute. Bekommt überlicherweise allgemeine Klassen zur Steuerung der Abmessungen zugewiesen.</p>
-      <h2>&lt;section&gt;</h2>
-      <p>Keine speziellen Attribute. Bekommt überlicherweise allgemeine Klassen zur Steuerung der Abmessungen zugewiesen.</p>
-      <h4>Varianten</h4>
-      <pre class="pre_code"><code>section.sec_main_center</code></pre>
-      <pre class="pre_code"><code>section.sec_main_status</code></pre>
-      <h2>&lt;h3&gt;</h2>
-      <h2>&lt;h4&gt;</h2>
-    </article>
-  </section>
-</div>
-{% include "hippie/partials/_footer.njk" %}
-{% endblock %}
-
-{% block script %}
-{{ super() }}
-<script src="../vendor/jq-sticky-anything.min.js" type="text/javascript"></script>
-<script src="../js/{{hippie.jsFile}}.min.js" type="text/javascript"></script>
-<script type="text/javascript">
-// Page specific
-// ------------------------------------------------------------------------------
-$( document ).ready(function () {
-  // jq-sticky-anything
-  $('#js_demo_fix').stickThis({
-    pushup: '#js_demo_stop'
-  });
-});
-</script>
-{% endblock %}
+<!-- elements.page -->
+{% set pageId = "elements" %}
+
+{% extends "demo/_extended.njk" %}
+
+{% block title %}Elements{% endblock %}
+{% block head %}
+{{ super() }}
+{% endblock %}
+
+{% block main %}
+<div class="temp_layer">
+	<!-- <div class="exp_overlay_btn exp_help_btn">
+	<span class="span_solo">?</span>
+</div> -->
+{% include "hippie/partials/_body_nav.njk" %}
+</div>
+<div id="begin" class="">
+	<section class="sec_main_center">
+		<header class="header_txt">
+			<h1>Medienformat Abfragen</h1>
+		</header>
+		<article>
+			<div class="demo__query_example">Umbruch bei&nbsp;</div>
+			<div class="demo__queries">
+				<p class="query_phoneUp">Telefone und größer</p>
+				<p class="query_phoneOnly">Nur Telefone</p>
+				<p class="query_tabletPortaitOnly">Nur Schreibtafeln hochkant</p>
+				<p class="query_tabletPortraitUp">Schreibtafeln und größer</p>
+				<p class="query_tabletLandscapeOnly">Schreibtafeln im Querformat</p>
+				<p class="query_tabletLandscapeUp">Schreibtafeln quer und größer</p>
+				<p class="query_desktopOnly">Nur Arbeitsplatzrechner</p>
+				<p class="query_desktopUp">Arbeitsplatzrechner und größer</p>
+				<p class="query_bigDesktopUp">Richtige Monitore und größer</p>
+			</div>
+		</article>
+	</section>
+
+	<section class="sec_main_center">
+		<header class="header_txt">
+			<h1>Übersicht aller Elemente</h1>
+			<p>Es werden alle grundlegenden Elemente sowie ihre gestalteten Varianten angegeben. Die Elemente sind in Gruppen eingeteilt, die auch das W3Consortium (<a href="https://www.w3.org/TR/2017/REC-html52-20171214/index.html#contents">www.w3.org/TR/2017/REC-html52-20171214/index.html#contents</a>) verwendet.</p>
+			<p>Zu jedem Element werden alle Attribute aufgelistet und die Umsetzung im HTML Dokument als Emmet Syntax dargestellt.</p>
+		</header>
+		<article>
+			<h1>Bereiche</h1>
+			<p>Elemente:</p>
+			<pre>// body<br>// article<br>// section<br>// nav<br>// aside<br>// h1-h6<br>// header<br>// footer</pre>
+			<h2>&lt;body&gt;</h2>
+			<p>Keine speziellen Attribute. Bekommt überlicherweise allgemeine Klassen zur Steuerung der Abmessungen zugewiesen.</p>
+			<h2>&lt;article&gt;</h2>
+			<p>Keine speziellen Attribute. Bekommt überlicherweise allgemeine Klassen zur Steuerung der Abmessungen zugewiesen.</p>
+			<h2>&lt;section&gt;</h2>
+			<p>Keine speziellen Attribute. Bekommt überlicherweise allgemeine Klassen zur Steuerung der Abmessungen zugewiesen.</p>
+			<h4>Varianten</h4>
+			<pre class="pre_code"><code>section.sec_main_center</code></pre>
+			<pre class="pre_code"><code>section.sec_main_status</code></pre>
+			<h2>&lt;h3&gt;</h2>
+			<h2>&lt;h4&gt;</h2>
+		</article>
+	</section>
+</div>
+{% endblock %}
+
+{% block script %}
+{{ super() }}
+<script src="../vendor/jq-sticky-anything.min.js" type="text/javascript"></script>
+<script src="../js/{{hippie.jsFile}}.min.js" type="text/javascript"></script>
+<script type="text/javascript">
+// Page specific
+// ------------------------------------------------------------------------------
+$( document ).ready(function () {
+	// jq-sticky-anything
+	$('#js_demo_fix').stickThis({
+		pushup: '#js_demo_stop'
+	});
+});
+</script>
+{% endblock %}
diff --git a/source/screens/demo/error/404.njk b/source/screens/demo/error/404.njk
index d0679b3..1f4b426 100644
--- a/source/screens/demo/error/404.njk
+++ b/source/screens/demo/error/404.njk
@@ -1,23 +1,23 @@
-<!-- error-404.page -->
-{% set pageId = "404" %}
-{% set bodyClass = "body_status" %}
-
-{% extends "demo/_maintenance.njk" %}
-
-{% block title %}{{ pageId }}{% endblock %}
-{% block head %}
-{{ super() }}
-{% endblock %}
-
-{% block main %}
-<main class="main_site">
-  <h1>{{ pageId }}</h1>
-  <h3>Client-Fehler</h3>
-  <p>Hier ist nichts. <dfn>Not Found</dfn></br>
-  <blockquote cite="https://de.wikipedia.org/wiki/HTTP-Statuscode#4xx_.E2.80.93_Client-Fehler">
-    <p>Die angeforderte Ressource wurde nicht gefunden. Dieser Statuscode kann ebenfalls verwendet werden, um eine Anfrage ohne näheren Grund abzuweisen. Links, welche auf solche Fehlerseiten verweisen, werden auch als Tote Links bezeichnet.</p>
-    <p class="quote_source"><a href="https://de.wikipedia.org/wiki/HTTP-Statuscode#4xx_.E2.80.93_Client-Fehler">Wikipedia</a></p>
-  </blockquote>
-</main>
-{{ super() }}
-{% endblock %}
+<!-- error-404.page -->
+{% set pageId = "404" %}
+{% set bodyClass = "body_status" %}
+
+{% extends "demo/_maintenance.njk" %}
+
+{% block title %}{{ pageId }}{% endblock %}
+{% block head %}
+{{ super() }}
+{% endblock %}
+
+{% block main %}
+<main class="main_site">
+  <h1>{{ pageId }}</h1>
+  <h3>Client-Fehler</h3>
+  <p>Hier ist nichts. <dfn>Not Found</dfn></p>
+  <blockquote cite="https://de.wikipedia.org/wiki/HTTP-Statuscode#4xx_.E2.80.93_Client-Fehler">
+    <p>Die angeforderte Ressource wurde nicht gefunden. Dieser Statuscode kann ebenfalls verwendet werden, um eine Anfrage ohne näheren Grund abzuweisen. Links, welche auf solche Fehlerseiten verweisen, werden auch als Tote Links bezeichnet.</p>
+    <p class="quote_source"><a href="https://de.wikipedia.org/wiki/HTTP-Statuscode#4xx_.E2.80.93_Client-Fehler">Wikipedia</a></p>
+  </blockquote>
+</main>
+{{ super() }}
+{% endblock %}
diff --git a/source/screens/demo/examples.njk b/source/screens/demo/examples.njk
index 4250c5d..b1a3b4a 100644
--- a/source/screens/demo/examples.njk
+++ b/source/screens/demo/examples.njk
@@ -1,243 +1,243 @@
-<!-- elements.page -->
-{% set pageId = "examples" %}
-
-{% extends "demo/_extended.njk" %}
-
-{% block title %}Examples{% endblock %}
-{% block head %}
-{{ super() }}
-{% endblock %}
-
-{% block main %}
-<div class="temp_layer">
-  <!-- <div class="exp_overlay_btn exp_help_btn">
-  <span class="span_solo">?</span>
-</div> -->
-{% include "hippie/partials/_body_nav.njk" %}
-</div>
-<div id="begin" class="">
-  <section class="sec_main_center">
-    <header class="header_txt">
-      <h1>Sammlung formatierter Elemente</h1>
-      <p>Die Elemente werden fortlaufend komplexer</p>
-    </header>
-    <article>
-      <h2>&lt;h3&gt;</h2>
-      <h4>Beispiele</h4>
-      <pre class="pre_code"><code>h3.txt_color_dark+p</code></pre>
-      <h3 class="txt_color_dark">Dunkle Überschrift</h3>
-      <p>Mit normalem Textabsatz</p>
-      <h2>&lt;h4&gt;</h2>
-      <h4>Beispiele</h4>
-      <pre class="pre_code"><code>a>h4</code></pre>
-      <a href=""><h4>Überschrift als Block-Verweis</h4></a>
-      <h2>&lt;section&gt;</h2>
-      <pre class="pre_code"><code>section>div.float_space_left>img^p+p</code></pre>
-      <section class="overflow">
-        <div class="float_space_left demo__avatar"><img src="../art/demo/flag_websafe_128x80.gif" width="256" height="160" alt="Fahne von interaktionsweise"></div>
-        <p>Vorname Name<br>Straße 1, 01234 Stadt</p><p>+49 (0)123 1337 0000<br><a class="lineLink" href="mailto:name@domain.tld">name@domain.tld</a></p>
-      </section>
-      <pre class="pre_code"><code>div.space_left_fourth</code></pre>
-      <div class="space_left_fourth">
-        <hr/>
-        <p>Eingerückter Inhalt</p>
-        <hr/>
-      </div>
-      <pre class="pre_code"><code>nav>ul>(li>a.a_button{Punkt $})*4nav>ul>(li>a.a_button_border{Stufe $})*4</code></pre>
-      <div class="overflow">
-        <nav class="float_space_left">
-          <ul>
-            <li><a href="" class="a_button" data-hippie-button-value="1">Erster Punkt</a></li>
-            <li><a href="" class="a_button" data-hippie-button-value="2">Zweiter Punkt</a></li>
-            <li><a href="" class="a_button" data-hippie-button-value="3">Dritter Punkt</a></li>
-            <li><a href="" class="a_button" data-hippie-button-value="4">Vierter Punkt</a></li>
-          </ul>
-        </nav>
-        <nav>
-          <ul>
-            <li><a href="" class="a_button_border">Stufe 1</a></li>
-            <li><a href="" class="a_button_border">Stufe 2</a></li>
-            <li><a href="" class="a_button_border">Stufe 3</a></li>
-            <li><a href="" class="a_button_border">Stufe 4</a></li>
-          </ul>
-        </nav>
-      </div>
-      <pre class="pre_code"><code>nav.nav_horizontal>ul>(li>a.a_button{Abschnitt $})*4nav.nav_center_old>ul>(li>a.a_button{Typ $})*4</code></pre>
-      <nav class="nav_horizontal">
-        <ul>
-          <li><a href="" class="a_button">Abschnitt 1</a></li>
-          <li><a href="" class="a_button">Abschnitt 2</a></li>
-          <li><a href="" class="a_button">Abschnitt 3</a></li>
-          <li><a href="" class="a_button">Abschnitt 4</a></li>
-        </ul>
-      </nav>
-      <div class="overflow">
-        <nav class="nav_center_old">
-          <ul>
-            <li><a href="" class="a_button">Typ 1</a></li>
-            <li><a href="" class="a_button">Typ 2</a></li>
-            <li><a href="" class="a_button">Typ 3</a></li>
-            <li><a href="" class="a_button">Typ 4</a></li>
-          </ul>
-        </nav>
-      </div>
-      <pre class="pre_code"><code>header.header_page>h1+p+nav.nav_separate_right>ul>(li>a.a_button{Nav $})*4^+nav.nav_right>ul>(li>a.a_button{Nav $})*4</code></pre>
-      <header class="header_page demo__header header_fancy">
-        <h1>Aufmacher</h1>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec consectetur diam. Sed nisl odio, volutpat nec nisi sit amet, commodo faucibus est. Donec lacinia vestibulum sapien. Morbi porttitor nibh quis imperdiet scelerisque. Praesent rutrum quam eu sodales luctus.</p>
-        <nav class="nav_separate_right">
-          <ul>
-            <li><a href="" class="a_button">Mensch</a></li>
-            <li><a href="" class="a_button">Pflanze</a></li>
-          </ul>
-        </nav>
-        <nav class="nav_right">
-          <ul>
-            <li><a href="" class="a_button">Blau</a></li>
-            <li><a href="" class="a_button">Gelb</a></li>
-          </ul>
-        </nav>
-      </header>
-      <pre class="pre_code"><code>header.header_page>nav.nav_right>ul>(li>a.a_button{Nav $})*4</code></pre>
-      <div class="box_space h_basic">
-        <header id="js_demo_fix" class="header_page demo__header header_fix">
-          <nav class="nav_right">
-            <ul>
-              <li><a href="" class="a_button">Eins</a></li>
-              <li><a href="" class="a_button">Zwei</a></li>
-            </ul>
-          </nav>
-        </header>
-        <div class="pos_abs pin_bottom width_full">
-          <pre class="pre_code"><code>footer.pos_abs.pin_bottom>nav.nav_column>ul>(li>a.a_button_text)*4</code></pre>
-          <footer id="js_demo_stop" class="demo_footer">
-            <nav class="nav_column nav_separate">
-              <ul>
-                <li><a href="" class="a_button_text">Alpha</a></li>
-                <li><a href="" class="a_button_text">Bravo</a></li>
-                <li><a href="" class="a_button_text">Charlie</a></li>
-                <li><a href="" class="a_button_text">Delta</a></li>
-              </ul>
-            </nav>
-            <p class="txt_center demo__credits"><i class="i_bright">👨‍💻</i> mit <i class="i_bright">❤</i> von <a href="https://interaktionsweise.de">Interaktionsweise</a></p>
-          </footer>
-        </div>
-      </div>
-      <div class="flex">
-        <div class="flex_child"></div>
-        <div class="flex_child"></div>
-        <div class="flex_child"></div>
-        <div class="flex_child"></div>
-        <div class="flex_child"></div>
-      </div>
-      <div class="flex_column_wrap">
-        <div class="flex_column"><input value="Undefiniert"/></div>
-        <div class="flex_column"><input type="text" size="8" value="Text"/></div>
-        <div class="flex_column"><input type="text" size="8" value="Deaktiviert" disabled/></div>
-        <div class="flex_column"><input type="button" value="Auswählen"></div>
-        <div class="flex_column"><input type="submit" value="Senden" disabled/></div>
-      </div>
-      <form action="" method="get">
-        <p class="label">
-          Show me a <select name="F">
-            <option value="0"> Plain list</option>
-            <option value="1" selected="selected"> Fancy list</option>
-            <option value="2"> Table list</option>
-          </select>
-          Sorted by <select name="C">
-            <option value="N" selected="selected"> Name</option>
-            <option value="M"> Date Modified</option>
-            <option value="S"> Size</option>
-            <option value="D"> Description</option>
-          </select>
-          <select name="O">
-            <option value="A" selected="selected"> Ascending</option>
-            <option value="D"> Descending</option>
-          </select>
-          <select name="V">
-            <option value="0" selected="selected"> in Normal order</option>
-            <option value="1"> in Version order</option>
-          </select>
-          Matching <input type="text" name="P" value="*" />
-          <input type="submit" name="X" value="Go" />
-        </p>
-      </form>
-
-      <h2>Gruppierung</h2>
-      <pre class="pre_code"><code>ul.list_link>(li>a>img)*2+li>a</code></pre>
-      <ul class="list_link">
-        <li><a href=""><img src="../art/letter.gif" alt="">name@domain.tld</a></li>
-        <li><a href="">Work</a></li>
-        <li><a href="">Projects</a></li>
-      </ul>
-
-      <h2>Tabellen</h2>
-      <pre class="pre_code"><code>table.table_link>thead>tr>th{&amp;nbsp;}+th{Ab / Zy}+th{Neu / Alt}^^(tbody>tr>td.cell_icon[rowspan="2"]>img[width=16  height=16]^+td.cell_link>a[target=_blank]{Name}+a[target=_blank]{URL}^+td.cell_date[rowspan="2"]{YYY-MM-DD}^tr>td.cell_text>div.shorten{Beschreibung})*2</code></pre>
-      <table class="table_link js_pop">
-        <thead>
-          <tr>
-            <th>&nbsp;</th>
-            <th>Ab / Zy</th>
-            <th>Neu / Alt</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td class="cell_icon" rowspan="2"><img src="" alt="" width="16" height="16"></td>
-            <td class="cell_link"><a href="" target="_blank">Name</a><a href="" target="_blank">URL</a></td>
-            <td class="cell_date" rowspan="2">YYYY-MM-DD</td>
-          </tr>
-          <tr>
-            <td class="cell_text">
-              <div class="shorten">Beschreibung</div>
-            </td>
-          </tr>
-        </tbody>
-        <tbody>
-          <tr>
-            <td class="cell_icon" rowspan="2"><img src="" alt="" width="16" height="16"></td>
-            <td class="cell_link"><a href="" target="_blank">Name</a><a href="" target="_blank">URL</a></td>
-            <td class="cell_date" rowspan="2">YYYY-MM-DD</td>
-          </tr>
-          <tr>
-            <td class="cell_text">
-              <div class="shorten">Beschreibung</div>
-            </td>
-          </tr>
-        </tbody>
-      </table>
-      <h2>Eingebettet</h2>
-      <div class="demo__flag">
-        <svg version="1.1" id="vector" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="100%" height="100%" viewBox="0 0 1920 1200" preserveAspectRatio="xMinYMax slice" alt="Background flag">
-          <rect id="triangle-5" y="0" fill="#273F8B" width="1920" height="1200"></rect>
-          <polygon id="triangle-6" fill="#8E1F68" points="0,1200 1920,458.25 1920,1200 "></polygon>
-          <polygon id="triangle-7" fill="#D30A51" points="0,1200 1920,522.75 1920,1200 "></polygon>
-          <polygon id="triangle-8" fill="#F2AF13" points="0,1200 1920,741.75 1920,1200 "></polygon>
-          <polygon id="triangle-9" fill="#FAD803" points="0,1200 1920,787.5 1920,1200 "></polygon>
-          <polygon id="triangle-4" fill="#3C579A" points="0,1200 0,0 733.5,0 "></polygon>
-          <polygon id="triangle-3" fill="#B7E0F0" points="0,1200 0,0 688.5,0 "></polygon>
-          <polygon id="triangle-2" fill="#6BC7D9" points="0,1200 0,0 453,0 "></polygon>
-          <polygon id="triangle-1" fill="#52BED1" points="0,1200 0,0 370.5,0 "></polygon>
-        </svg>
-      </div>
-    </article>
-  </section>
-</div>
-{% include "hippie/partials/_footer.njk" %}
-{% endblock %}
-
-{% block script %}
-{{ super() }}
-<script src="../vendor/jq-sticky-anything.min.js" type="text/javascript"></script>
-<script src="../js/{{hippie.jsFile}}.min.js" type="text/javascript"></script>
-<script type="text/javascript">
-// Page specific
-// ------------------------------------------------------------------------------
-$( document ).ready(function () {
-  // jq-sticky-anything
-  $('#js_demo_fix').stickThis({
-    pushup: '#js_demo_stop'
-  });
-});
-</script>
-{% endblock %}
+<!-- elements.page -->
+{% set pageId = "examples" %}
+
+{% extends "demo/_extended.njk" %}
+
+{% block title %}Examples{% endblock %}
+{% block head %}
+{{ super() }}
+{% endblock %}
+
+{% block main %}
+<div class="temp_layer">
+	<!-- <div class="exp_overlay_btn exp_help_btn">
+	<span class="span_solo">?</span>
+</div> -->
+{% include "hippie/partials/_body_nav.njk" %}
+</div>
+<div id="begin" class="">
+	<section class="sec_main_center">
+		<header class="header_txt">
+			<h1>Sammlung formatierter Elemente</h1>
+			<p>Die Elemente werden fortlaufend komplexer</p>
+		</header>
+		<article>
+			<h2>&lt;h3&gt;</h2>
+			<h4>Beispiele</h4>
+			<pre class="pre_code"><code>h3.txt_color_dark+p</code></pre>
+			<h3 class="txt_color_dark">Dunkle Überschrift</h3>
+			<p>Mit normalem Textabsatz</p>
+			<h2>&lt;h4&gt;</h2>
+			<h4>Beispiele</h4>
+			<pre class="pre_code"><code>a>h4</code></pre>
+			<a href=""><h4>Überschrift als Block-Verweis</h4></a>
+			<h2>&lt;section&gt;</h2>
+			<pre class="pre_code"><code>section>div.float_space_left>img^p+p</code></pre>
+			<section class="overflow">
+				<div class="float_space_left demo__avatar"><img src="../art/demo/flag_websafe_128x80.gif" width="256" height="160" alt="Fahne von interaktionsweise"></div>
+				<p>Vorname Name<br>Straße 1, 01234 Stadt</p><p>+49 (0)123 1337 0000<br><a class="lineLink" href="mailto:name@domain.tld">name@domain.tld</a></p>
+			</section>
+			<pre class="pre_code"><code>div.space_left_fourth</code></pre>
+			<div class="space_left_fourth">
+				<hr/>
+				<p>Eingerückter Inhalt</p>
+				<hr/>
+			</div>
+			<pre class="pre_code"><code>nav>ul>(li>a.a_button{Punkt $})*4nav>ul>(li>a.a_button_border{Stufe $})*4</code></pre>
+			<div class="overflow">
+				<nav class="float_space_left">
+					<ul>
+						<li><a href="" class="a_button" data-hippie-button-value="1">Erster Punkt</a></li>
+						<li><a href="" class="a_button" data-hippie-button-value="2">Zweiter Punkt</a></li>
+						<li><a href="" class="a_button" data-hippie-button-value="3">Dritter Punkt</a></li>
+						<li><a href="" class="a_button" data-hippie-button-value="4">Vierter Punkt</a></li>
+					</ul>
+				</nav>
+				<nav>
+					<ul>
+						<li><a href="" class="a_button_border">Stufe 1</a></li>
+						<li><a href="" class="a_button_border">Stufe 2</a></li>
+						<li><a href="" class="a_button_border">Stufe 3</a></li>
+						<li><a href="" class="a_button_border">Stufe 4</a></li>
+					</ul>
+				</nav>
+			</div>
+			<pre class="pre_code"><code>nav.nav_horizontal>ul>(li>a.a_button{Abschnitt $})*4nav.nav_center_old>ul>(li>a.a_button{Typ $})*4</code></pre>
+			<nav class="nav_horizontal">
+				<ul>
+					<li><a href="" class="a_button">Abschnitt 1</a></li>
+					<li><a href="" class="a_button">Abschnitt 2</a></li>
+					<li><a href="" class="a_button">Abschnitt 3</a></li>
+					<li><a href="" class="a_button">Abschnitt 4</a></li>
+				</ul>
+			</nav>
+			<div class="overflow">
+				<nav class="nav_center_old">
+					<ul>
+						<li><a href="" class="a_button">Typ 1</a></li>
+						<li><a href="" class="a_button">Typ 2</a></li>
+						<li><a href="" class="a_button">Typ 3</a></li>
+						<li><a href="" class="a_button">Typ 4</a></li>
+					</ul>
+				</nav>
+			</div>
+			<pre class="pre_code"><code>header.header_page>h1+p+nav.nav_separate_right>ul>(li>a.a_button{Nav $})*4^+nav.nav_right>ul>(li>a.a_button{Nav $})*4</code></pre>
+			<header class="header_page demo__header header_fancy">
+				<h1>Aufmacher</h1>
+				<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec consectetur diam. Sed nisl odio, volutpat nec nisi sit amet, commodo faucibus est. Donec lacinia vestibulum sapien. Morbi porttitor nibh quis imperdiet scelerisque. Praesent rutrum quam eu sodales luctus.</p>
+				<nav class="nav_separate_right">
+					<ul>
+						<li><a href="" class="a_button">Mensch</a></li>
+						<li><a href="" class="a_button">Pflanze</a></li>
+					</ul>
+				</nav>
+				<nav class="nav_right">
+					<ul>
+						<li><a href="" class="a_button">Blau</a></li>
+						<li><a href="" class="a_button">Gelb</a></li>
+					</ul>
+				</nav>
+			</header>
+			<pre class="pre_code"><code>header.header_page>nav.nav_right>ul>(li>a.a_button{Nav $})*4</code></pre>
+			<div class="box_space h_basic">
+				<header id="js_demo_fix" class="header_page demo__header header_fix">
+					<nav class="nav_right">
+						<ul>
+							<li><a href="" class="a_button">Eins</a></li>
+							<li><a href="" class="a_button">Zwei</a></li>
+						</ul>
+					</nav>
+				</header>
+				<div class="pos_abs pin_bottom width_full">
+					<pre class="pre_code"><code>footer.pos_abs.pin_bottom>nav.nav_column>ul>(li>a.a_button_text)*4</code></pre>
+					<footer id="js_demo_stop" class="demo_footer">
+						<nav class="nav_column nav_separate">
+							<ul>
+								<li><a href="" class="a_button_text">Alpha</a></li>
+								<li><a href="" class="a_button_text">Bravo</a></li>
+								<li><a href="" class="a_button_text">Charlie</a></li>
+								<li><a href="" class="a_button_text">Delta</a></li>
+							</ul>
+						</nav>
+						<p class="txt_center demo__credits"><i class="i_bright">👨‍💻</i> mit <i class="i_bright">❤</i> von <a href="https://interaktionsweise.de">Interaktionsweise</a></p>
+					</footer>
+				</div>
+			</div>
+			<div class="flex">
+				<div class="flex_child"></div>
+				<div class="flex_child"></div>
+				<div class="flex_child"></div>
+				<div class="flex_child"></div>
+				<div class="flex_child"></div>
+			</div>
+			<div class="flex_column_wrap">
+				<div class="flex_column"><input value="Undefiniert"/></div>
+				<div class="flex_column"><input type="text" size="8" value="Text"/></div>
+				<div class="flex_column"><input type="text" size="8" value="Deaktiviert" disabled/></div>
+				<div class="flex_column"><input type="button" value="Auswählen"></div>
+				<div class="flex_column"><input type="submit" value="Senden" disabled/></div>
+			</div>
+			<form method="get">
+				<p class="label">
+					Show me a <select name="F">
+						<option value="0"> Plain list</option>
+						<option value="1" selected="selected"> Fancy list</option>
+						<option value="2"> Table list</option>
+					</select>
+					Sorted by <select name="C">
+						<option value="N" selected="selected"> Name</option>
+						<option value="M"> Date Modified</option>
+						<option value="S"> Size</option>
+						<option value="D"> Description</option>
+					</select>
+					<select name="O">
+						<option value="A" selected="selected"> Ascending</option>
+						<option value="D"> Descending</option>
+					</select>
+					<select name="V">
+						<option value="0" selected="selected"> in Normal order</option>
+						<option value="1"> in Version order</option>
+					</select>
+					Matching <input type="text" name="P" value="*" />
+					<input type="submit" name="X" value="Go" />
+				</p>
+			</form>
+
+			<h2>Gruppierung</h2>
+			<pre class="pre_code"><code>ul.list_link>(li>a>img)*2+li>a</code></pre>
+			<ul class="list_link">
+				<li><a href=""><img src="../art/letter.gif" alt="">name@domain.tld</a></li>
+				<li><a href="">Work</a></li>
+				<li><a href="">Projects</a></li>
+			</ul>
+
+			<h2>Tabellen</h2>
+			<pre class="pre_code"><code>table.table_link>thead>tr>th{&amp;nbsp;}+th{Ab / Zy}+th{Neu / Alt}^^(tbody>tr>td.cell_icon[rowspan="2"]>img[width=16  height=16]^+td.cell_link>a[target=_blank]{Name}+a[target=_blank]{URL}^+td.cell_date[rowspan="2"]{YYY-MM-DD}^tr>td.cell_text>div.shorten{Beschreibung})*2</code></pre>
+			<table class="table_link js_pop">
+				<thead>
+					<tr>
+						<th>&nbsp;</th>
+						<th>Ab / Zy</th>
+						<th>Neu / Alt</th>
+					</tr>
+				</thead>
+				<tbody>
+					<tr>
+						<td class="cell_icon" rowspan="2"><img src="/art/bullet.gif" alt="" width="16" height="16"></td>
+						<td class="cell_link"><a href="" target="_blank">Name</a><a href="" target="_blank">URL</a></td>
+						<td class="cell_date" rowspan="2">YYYY-MM-DD</td>
+					</tr>
+					<tr>
+						<td class="cell_text">
+							<div class="shorten">Beschreibung</div>
+						</td>
+					</tr>
+				</tbody>
+				<tbody>
+					<tr>
+						<td class="cell_icon" rowspan="2"><img src="/art/bullet.gif" alt="" width="16" height="16"></td>
+						<td class="cell_link"><a href="" target="_blank">Name</a><a href="" target="_blank">URL</a></td>
+						<td class="cell_date" rowspan="2">YYYY-MM-DD</td>
+					</tr>
+					<tr>
+						<td class="cell_text">
+							<div class="shorten">Beschreibung</div>
+						</td>
+					</tr>
+				</tbody>
+			</table>
+			<h2>Eingebettet</h2>
+			<div class="demo__flag">
+				<svg version="1.1" id="vector" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="100%" height="100%" viewBox="0 0 1920 1200" preserveAspectRatio="xMinYMax slice">
+					<desc>Background flag</desc>
+					<rect id="triangle-5" y="0" fill="#273F8B" width="1920" height="1200"></rect>
+					<polygon id="triangle-6" fill="#8E1F68" points="0,1200 1920,458.25 1920,1200 "></polygon>
+					<polygon id="triangle-7" fill="#D30A51" points="0,1200 1920,522.75 1920,1200 "></polygon>
+					<polygon id="triangle-8" fill="#F2AF13" points="0,1200 1920,741.75 1920,1200 "></polygon>
+					<polygon id="triangle-9" fill="#FAD803" points="0,1200 1920,787.5 1920,1200 "></polygon>
+					<polygon id="triangle-4" fill="#3C579A" points="0,1200 0,0 733.5,0 "></polygon>
+					<polygon id="triangle-3" fill="#B7E0F0" points="0,1200 0,0 688.5,0 "></polygon>
+					<polygon id="triangle-2" fill="#6BC7D9" points="0,1200 0,0 453,0 "></polygon>
+					<polygon id="triangle-1" fill="#52BED1" points="0,1200 0,0 370.5,0 "></polygon>
+				</svg>
+			</div>
+		</article>
+	</section>
+</div>
+{% endblock %}
+
+{% block script %}
+{{ super() }}
+<script src="../vendor/jq-sticky-anything.min.js" type="text/javascript"></script>
+<script src="../js/{{hippie.jsFile}}.min.js" type="text/javascript"></script>
+<script type="text/javascript">
+// Page specific
+// ------------------------------------------------------------------------------
+$( document ).ready(function () {
+	// jq-sticky-anything
+	$('#js_demo_fix').stickThis({
+		pushup: '#js_demo_stop'
+	});
+});
+</script>
+{% endblock %}
diff --git a/source/screens/demo/intro.njk b/source/screens/demo/intro.njk
index f7d9ca2..04fdb0d 100644
--- a/source/screens/demo/intro.njk
+++ b/source/screens/demo/intro.njk
@@ -63,7 +63,7 @@
 		<p>Es ist auch eine unsichtbare Unterteilung möglich:</p>
 		<hr class="hr_hidden js_pop"/><div class="exp_pop"><code class="code_solo">hr.hr_hidden</code></div>
 		<p>Die Linie darf auch gepunkted sein. Zudem sind verschiedene Längen möglich. Diese sind immer ein Prozentwert der verfügbaren Breite. Hier in gleicher Reihenfolge 100%, 50% und 25%:</p>
-		<hr class="hr_dotted js_pop" emmet/><div class="exp_pop"><code class="code_solo">hr.hr_dotted</code></div><!--hr.hr_dotted-->
+		<hr class="hr_dotted js_pop"/><div class="exp_pop"><code class="code_solo">hr.hr_dotted</code></div><!--hr.hr_dotted-->
 		<hr class="space_even_half js_pop"/><div class="exp_pop"><code class="code_solo">hr.space_even_half</code></div>
 		<hr class="hr_dotted space_even_fourth js_pop"/><div class="exp_pop"><code class="code_solo">hr.hr_dotted.space_even_fourth</code></div>
 		<p class="column_2 js_pop">Zur horizontalen Unterteilung kommt natürlich auch eine vertikale Trennung hinzu. Text kann so zum Beispiel in mehrere Spalten unterteilt werden. Dies ist hilfreich, wenn ein Text durch eine breite Fläche sehr lange Zeilen bekommen würde. Es ist dann schwer den neuen Zeilanfang zu finden. Die vertikale Trennung dient in erster Linie dazu, diesem Umstand zu begegnen. Auch hier kann die Unterteilung viele Formen annehmen.</p><div class="exp_pop"><code class="code_solo">p.column_2</code></div>
@@ -106,7 +106,8 @@
 		<p>Auch Inhalte, die nicht in Textform sind, können durch einen Bezug integriert werden. Wie diese Fahne werden sie mit <code>&lt;figure&gt;</code> umschlossen und tragen eine Bezeichnung, welche mit <code>&lt;figcaption&gt;</code> ausgezeichnet wird.</p>
 		<figure class="js_pop">
 			<figcaption>Fahne</figcaption>
-			<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="10%" height="10%" viewBox="0 0 1920 1200" preserveAspectRatio="xMinYMax slice" alt="Background flag">
+			<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="10%" height="10%" viewBox="0 0 1920 1200" preserveAspectRatio="xMinYMax slice">
+				<desc>Flag</desc>
 				<rect id="triangle-5" y="0" fill="#273F8B" width="1920" height="1200"/>
 				<polygon id="triangle-6" fill="#8E1F68" points="0,1200 1920,458.25 1920,1200 "/>
 				<polygon id="triangle-7" fill="#D30A51" points="0,1200 1920,522.75 1920,1200 "/>
@@ -154,13 +155,13 @@
 		<p><dfn><abbr title="Hippie interweaves preeminent personal interface elements">Hippie</abbr></dfn> is an recursive acronym for <dfn>Hippie interweaves preeminent personal interface elements</dfn>.</p>
 		<p>Die besondere Auszeichnungen <code>&lt;ruby&gt;</code> <q cite="https://de.wikipedia.org/wiki/Ruby_Annotation">bezeichnet ein Anmerkungssystem, bei dem der Text zusammen mit seiner Anmerkung in einer Zeile erscheint.</q> Das System verwendet die folgenden weiteren Elemente mit spezifischer Bedeutung:</p>
 		<dl>
-			<df><code>&lt;rb&gt;</code></df>
+			<dt><code>&lt;rb&gt;</code></dt>
 			<dd>Basis Textkomponente</dd>
-			<df><code>&lt;rt&gt;</code></df>
+			<dt><code>&lt;rt&gt;</code></dt>
 			<dd>Annotation</dd>
-			<df><code>&lt;rtc&gt;</code></df>
+			<dt><code>&lt;rtc&gt;</code></dt>
 			<dd>Einzelne Komponente einer Annotation</dd>
-			<df><code>&lt;rp&gt;</code></df>
+			<dt><code>&lt;rp&gt;</code></dt>
 			<dd>Alternative bei fehlender Unterstützung</dd>
 		</dl>
 		<hr class="hr_dotted space_even_half">
@@ -177,7 +178,7 @@
 		<p>Wikipedia erklärt dies ausführlicher unter <a href="https://de.wikipedia.org/wiki/Ruby_Annotation">Ruby Annotation</a>.</p>
 		<p>Es gibt auch mehrere besondere Elemente um Maschinensprache oder Programmkode zu bezeichnen. Dabei wird unterschieden, ob der Inhalt nur für Menschen ausgezeichnet wird oder auch maschinen-lesbar sein soll. Die Elemente <code>&lt;data&gt;</code> und <code>&lt;time&gt;</code> enthalten eine maschinen-lesbare Repräsentation des Inhaltes:</p>
 		<dl>
-			<dt><data>0</data> ≠ <data>NULL</data></dt>
+			<dt><data value="0">0</data> ≠ <data value="">NULL</data></dt>
 			<dd><code>&lt;data&gt;0&lt;/data&gt; ≠ &lt;data&gt;NULL&lt;/data&gt;</code></dd>
 			<dt>Der Wert <data value="NULL">NULL</data> mit Attribut</dt>
 			<dd><code>&lt;data value="NULL"&gt;NULL&lt;/data&gt;</code></dd>
@@ -200,12 +201,10 @@
 		<p class="txt_center">Bei<mark class="mark_cursor">spiel zum mark</mark>ieren 😉.</p>
 		<p>Eine Markierung kann, mittels <code>&lt;mark&gt;</code>, auch durch den Autor geschehen. Diese stellt sich ein wenig anders dar: <mark>Diese Worte sind markiert.</mark></p>
 		<p>Um Text, dessen schreibweise nicht vorhersehbar ist, zu markieren wie z.B. Benutzernamen <bdi>كائن بشري</bdi>, die auch rechtsbündig geschrieben sein können, wird das <code>&lt;bdi&gt;</code> Element eingesetzt.<br>Die Schreibweise kann auch auch vom Author vorgegeben und expliziert geändert werden. Dies wird dem <code>&lt;bdo&gt;</code> Element umgesetzt. Die Richtung wird dann mit dem Attribut <code>dir</code> angegeben.</p>
-		<bdo dir="rtl">
-			<ul>
-				<li>كائن بشري</li>
-				<li>إنسان آلي</li>
-			</ul>
-		</bdo>
+		<ul>
+			<li><bdo dir="rtl">كائن بشري</bdo></li>
+			<li><bdo dir="rtl">إنسان آلي</bdo></li>
+		</ul>
 		<p>Neben den vielen speziellen Elementen gibt es auch ein Element, das keine vordefinierte Bedeutung hat. Es ist das <code>&lt;span&gt;</code> Element.<br>Es dient dazu ganz individuelle Auszeichnungen zu ermöglichen die eher optische Auswirkungen haben und eben keine inhaltlichen. Mit den Attributen <code>id</code> oder <code>class</code> werden dazu eigene Typen des Elements definiert. Diese Möglichkeit der Definition von individuellen Elementen ist ein Grundprinzip der Auszeichnungssprache <abbr title="Hypertext Markup Language" >HTML</abbr>.</p>
 		<p>Mit der Einführung von Absätzen wurde auch schon das <code>&lt;br&gt;</code> Element erwähnt und seitdem häufig benutzt. Es erzeugt einen Zeilenumbruch. Es wird dadurch kein neuer Absatz erstellt. Es dient auch nicht dazu optischen Abstand zu erzeugen, sondern innerhalb eines Absatzes den Text umzubrechen.</p>
 		<p>Eine besondere Form des Zeilenumbruchs kann mit <code>&lt;wbr&gt;</code> eingesetzt werden. Es stellt die Möglichkeit für einen Zeilenumbruch dar. Da das Format eines HTML-Dokumentes häufig nicht vorhersehbar ist, kann solch ein Element einen Umbruch erzeugen falls ein Wort zu lang für eine Textzeile sein sollte.</p>
@@ -240,42 +239,36 @@
 		<h1>Tabellen</h1>
 		<p>Tabellen bieten besonders geordnete Struktur. Häufig werden in ihnen Text und Daten kombiniert dargestellt. Dies erfordert individuelle Formatierungen. Einige grundlegende Eigenschaften werden im folgenden aufgezeigt. Tabellen sind in ihrer Größe entweder vordefiniert (fixiert) oder richten sich nach ihrem Inhalt. Das bedeutet, die Spaltenbreite entspricht der breitesten ihrer Zellen.</p>
 		<table class="width_full js_pop">
-			<tbody>
+			<tr>
+				<td>Eine</td>
+				<td>einfache</td>
+			</tr>
+			<tr>
+				<td colspan="2">Tabelle</td>
+			</tr>
+		</table>
+		<div class="exp_pop"><code class="code_solo">table.width_full>tr>td*2^tr>td[colspan=2]</code></div>
+		<div class="overflow">
+			<table class="float_space_left js_pop">
 				<tr>
 					<td>Eine</td>
-					<td>einfache</td>
+					<td>freie (nicht fixierte)</td>
 				</tr>
 				<tr>
 					<td colspan="2">Tabelle</td>
 				</tr>
-			</tbody>
-		</table>
-		<div class="exp_pop"><code class="code_solo">table.width_full>tbody>tr>td*2^tr>td[colspan=2]</code></div>
-		<div class="overflow">
-			<table class="float_space_left js_pop">
-				<tbody>
-					<tr>
-						<td>Eine</td>
-						<td>freie (nicht fixierte)</td>
-					</tr>
-					<tr>
-						<td colspan="2">Tabelle</td>
-					</tr>
-				</tbody>
 			</table>
-			<div class="exp_pop"><code class="code_solo">table>tbody>tr>td*2^tr>td[colspan=2]</code></div>
+			<div class="exp_pop"><code class="code_solo">table>tr>td*2^tr>td[colspan=2]</code></div>
 			<table class="table_blank float_space_left js_pop">
-				<tbody>
-					<tr>
-						<td>Mit</td>
-						<td>ohne</td>
-					</tr>
-					<tr>
-						<td colspan="2">Linien</td>
-					</tr>
-				</tbody>
+				<tr>
+					<td>Mit</td>
+					<td>ohne</td>
+				</tr>
+				<tr>
+					<td colspan="2">Linien</td>
+				</tr>
 			</table>
-			<div class="exp_pop"><code class="code_solo">table.table_blank>tbody>tr>td*2^tr>td[colspan=2]</code></div>
+			<div class="exp_pop"><code class="code_solo">table.table_blank>tr>td*2^tr>td[colspan=2]</code></div>
 		</div>
 		<p>Die nächste Tabelle verwendet alle zur Auszeichnung verfügbaren Elemente und hat eine starre Zellverteilung:</p>
 		<table class="width_full table_fix js_pop">
@@ -287,13 +280,6 @@
 					<th>B</th>
 				</tr>
 			</thead>
-			<tfoot>
-				<tr>
-					<td>Fußzeile</td>
-					<td>A</td>
-					<td>B</td>
-				</tr>
-			</tfoot>
 			<tbody>
 				<tr>
 					<td>Tabelle</td>
@@ -316,8 +302,15 @@
 					<td>Fußzeile</td>
 				</tr>
 			</tbody>
+			<tfoot>
+				<tr>
+					<td>Fußzeile</td>
+					<td>A</td>
+					<td>B</td>
+				</tr>
+			</tfoot>
 		</table>
-		<div class="exp_pop"><code class="code_solo">table.width_full.table_fix>caption+thead>tr>th*3^^tfoot>tr>td*3^^tbody>(tr>td*3)*3</code></div>
+		<div class="exp_pop"><code class="code_solo">table.width_full.table_fix>caption+thead>tr>th*3^^tbody>(tr>td*3)*3^^tfoot>tr>td*3</code></div>
 		<hr class="hr_hidden">
 		<p>Viele weitere Formate sind möglich. Hier nur einige typische Beispiele:</p>
 		<table class="width_full table_fix js_pop">
@@ -350,30 +343,28 @@
 				</tr>
 			</tbody>
 		</table>
-		<div class="exp_pop"><code class="code_solo">table.width_full.table_stripe.table_free>tbody>tr>td*3</code></div>
+		<div class="exp_pop"><code class="code_solo">table.width_full.table_stripe.table_free>tr>td*3</code></div>
 		<table class="width_full table_stripe table_fix table_free">
-			<tbody>
-				<tr>
-					<td>Tabelle</td>
-					<td></td>
-					<td></td>
-				</tr>
-				<tr>
-					<td>ohne</td>
-					<td>Rahmen</td>
-					<td></td>
-				</tr>
-				<tr>
-					<td></td>
-					<td>jedoch</td>
-					<td>mit</td>
-				</tr>
-				<tr>
-					<td></td>
-					<td></td>
-					<td>Streifen</td>
-				</tr>
-			</tbody>
+			<tr>
+				<td>Tabelle</td>
+				<td></td>
+				<td></td>
+			</tr>
+			<tr>
+				<td>ohne</td>
+				<td>Rahmen</td>
+				<td></td>
+			</tr>
+			<tr>
+				<td></td>
+				<td>jedoch</td>
+				<td>mit</td>
+			</tr>
+			<tr>
+				<td></td>
+				<td></td>
+				<td>Streifen</td>
+			</tr>
 		</table>
 		<table>
 			<caption>Die Verteilung der Zellen ist hier von ihrem Inhalt abhängig.</caption>
@@ -384,13 +375,6 @@
 					<th>&gt;9000</th>
 				</tr>
 			</thead>
-			<tfoot>
-				<tr>
-					<td>Summe</td>
-					<td></td>
-					<td>9001</td>
-				</tr>
-			</tfoot>
 			<tbody>
 				<tr>
 					<td>Alpha</td>
@@ -408,6 +392,13 @@
 					<td>1</td>
 				</tr>
 			</tbody>
+			<tfoot>
+				<tr>
+					<td>Summe</td>
+					<td></td>
+					<td>9001</td>
+				</tr>
+			</tfoot>
 		</table>
 	</article>
 	<article>
@@ -428,39 +419,35 @@
 		<div class="overflow">
 			<div class="float_left">
 				<table class="table_fix table_blank">
-					<tbody>
-						<tr>
-							<td><label for="demo__raw_a">Alpha:</label></td>
-							<td><input type="text" id="demo__raw_a"></td>
-						</tr>
-						<tr>
-							<td><label for="demo__raw_b">Beta:</label></td>
-							<td><input type="text" id="demo__raw_b"></td>
-						</tr>
-					</tbody>
+					<tr>
+						<td><label for="demo__raw_a">Alpha:</label></td>
+						<td><input type="text" id="demo__raw_a"></td>
+					</tr>
+					<tr>
+						<td><label for="demo__raw_b">Beta:</label></td>
+						<td><input type="text" id="demo__raw_b"></td>
+					</tr>
 				</table>
 			</div>
 			<table class="float_right">
-				<tbody>
-					<tr>
-						<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="text" id="demo__io_d" value="11.966504" size="10"></td>
-						<td class="demo__td_pr"><label for="demo__io_a">x</label></td>
-						<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="number" id="demo__io_a" value="10" min="0" max="1000"></td>
-						<td class="demo__td_pr"><label for="demo__io_a">Breite</label></td>
-					</tr>
-					<tr>
-						<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="text" id="demo__io_e" value="51.503491" size="10"></td>
-						<td class="demo__td_pr"><label for="demo__io_b">y</label></td>
-						<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="number" id="demo__io_b" value="10" min="0" max="1000"></td>
-						<td class="demo__td_pr"><label for="demo__io_b">Tiefe</label></td>
-					</tr>
-					<tr>
-						<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="text" id="demo__io_f" value="88" size="10"></td>
-						<td class="demo__td_pr"><label for="demo__io_c">z</label></td>
-						<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="number" id="demo__io_c" value="48" min="0" max="1000"></td>
-						<td class="demo__td_pr"><label for="demo__io_c">Höhe</label></td>
-					</tr>
-				</tbody>
+				<tr>
+					<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="text" id="demo__io_d" value="11.966504" size="10"></td>
+					<td class="demo__td_pr"><label for="demo__io_a">x</label></td>
+					<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="number" id="demo__io_a" value="10" min="0" max="1000"></td>
+					<td class="demo__td_pr"><label for="demo__io_a">Breite</label></td>
+				</tr>
+				<tr>
+					<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="text" id="demo__io_e" value="51.503491" size="10"></td>
+					<td class="demo__td_pr"><label for="demo__io_b">y</label></td>
+					<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="number" id="demo__io_b" value="10" min="0" max="1000"></td>
+					<td class="demo__td_pr"><label for="demo__io_b">Tiefe</label></td>
+				</tr>
+				<tr>
+					<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="text" id="demo__io_f" value="88" size="10"></td>
+					<td class="demo__td_pr"><label for="demo__io_c">z</label></td>
+					<td class="txt_right demo__td_no_br demo__td_pl"><input class="io_input" type="number" id="demo__io_c" value="48" min="0" max="1000"></td>
+					<td class="demo__td_pr"><label for="demo__io_c">Höhe</label></td>
+				</tr>
 			</table>
 		</div>
 		<p>Zusätzlich zur Beschriftung einzelner Elemente gibt es auch die Möglichkeit Gruppierungen zu schaffen. Diese werden mit <code>&lt;fieldset&gt;</code> realisiert.</p>
@@ -522,20 +509,20 @@
 			<p>Innerhalb einer Gruppe können nicht nur Ein- und Ausgabefelder platziert werden. Andere Elemente ergänzen Information oder lockern das Erscheinungsbild auf.</p>
 			<p>Hier nun eine Liste weiterer Arten von Eingabefeldern:</p>
 			<div class="grid grid_column_2">
-				<label for="" class="">Farbauswahl<br><code>&lt;input[type="color"]&gt;</code></label><div><input class="" type="color"></div>
-				<label for="" class="">Bereichsauswahl<br><code>&lt;input[type="range"]&gt;</code></label><div><input class="" type="range"></div>
-				<label for="" class="">Datum<br><code>&lt;input[type="date"]&gt;</code></label><div><input class="io_input" type="date"></div>
-				<label for="" class="">Uhrzeit<br><code>&lt;input[type="time"]&gt;</code></label><div><input class="io_input" type="time"></div>
-				<label for="" class="">Datum und Zeit<br><code>&lt;input[type="datetime-local"]&gt;</code></label><div><input class="io_input" type="datetime-local"></div>
-				<label for="" class="">Kalendermonat<br><code>&lt;input[type="month"]&gt;</code></label><div><input class="io_input" type="month"></div>
-				<label for="" class="">Kalenderwoche<br><code>&lt;input[type="week"]&gt;</code></label><div><input class="io_input" type="week"></div>
-				<label for="" class="">@dresse<br><code>&lt;input[type="email"]&gt;</code></label><div><input class="io_input" type="email" placeholder="@"></div>
-				<label for="" class="">Passwort<br><code>&lt;input[type="password"]&gt;</code></label><div><input class="io_input" type="password" value="admin"></div>
-				<label for="" class="">Telefonnummer<br><code>&lt;input[type="tel"]&gt;</code></label><div><input class="io_input" type="tel" value="0190123456"></div>
-				<label for="" class="">URL<br><code>&lt;input[type="url"]&gt;</code></label><div><input class="io_input" type="url" placeholder="url://"></div>
-				<label for="" class="">Suche<br><code>&lt;input[type="search"]&gt;</code></label><div><input class="io_input" type="search"></div>
-				<label for="" class="">Datei<br><code>&lt;input[type="file"]&gt;</code></label><div><input class="" type="file"></div>
-				<label for="" class="">Bild</label><input class="" type="image" value="Alternativer Text"/>
+				<label class="">Farbauswahl<br><code>&lt;input[type="color"]&gt;</code></label><div><input class="" type="color"></div>
+				<label class="">Bereichsauswahl<br><code>&lt;input[type="range"]&gt;</code></label><div><input class="" type="range"></div>
+				<label class="">Datum<br><code>&lt;input[type="date"]&gt;</code></label><div><input class="io_input" type="date"></div>
+				<label class="">Uhrzeit<br><code>&lt;input[type="time"]&gt;</code></label><div><input class="io_input" type="time"></div>
+				<label class="">Datum und Zeit<br><code>&lt;input[type="datetime-local"]&gt;</code></label><div><input class="io_input" type="datetime-local"></div>
+				<label class="">Kalendermonat<br><code>&lt;input[type="month"]&gt;</code></label><div><input class="io_input" type="month"></div>
+				<label class="">Kalenderwoche<br><code>&lt;input[type="week"]&gt;</code></label><div><input class="io_input" type="week"></div>
+				<label class="">@dresse<br><code>&lt;input[type="email"]&gt;</code></label><div><input class="io_input" type="email" placeholder="@"></div>
+				<label class="">Passwort<br><code>&lt;input[type="password"]&gt;</code></label><div><input class="io_input" type="password" value="admin"></div>
+				<label class="">Telefonnummer<br><code>&lt;input[type="tel"]&gt;</code></label><div><input class="io_input" type="tel" value="0190123456"></div>
+				<label class="">URL<br><code>&lt;input[type="url"]&gt;</code></label><div><input class="io_input" type="url" placeholder="url://"></div>
+				<label class="">Suche<br><code>&lt;input[type="search"]&gt;</code></label><div><input class="io_input" type="search"></div>
+				<label class="">Datei<br><code>&lt;input[type="file"]&gt;</code></label><div><input class="" type="file"></div>
+				<label class="">Bild</label><input class="" type="image" alt="Alternativer Text"/>
 			</div>
 		</fieldset>
 
diff --git a/source/templates/demo/partials/_meta.njk b/source/templates/demo/partials/_meta.njk
index 38d1fb7..7fc2a0b 100644
--- a/source/templates/demo/partials/_meta.njk
+++ b/source/templates/demo/partials/_meta.njk
@@ -1,9 +1,9 @@
-<!-- meta.partial -->
-<meta name="author" content="Interaktionsweise">
-<meta name="generator" content="Atom, Notepad++">
-<meta name="description" content="Hippie interweaves preeminent personal interface elements">
-<meta name="robots" content="noindex">
-
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
-{# <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> #}
-<meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1" />
+<!-- meta.partial -->
+<meta name="author" content="Interaktionsweise">
+<meta name="generator" content="Atom, Notepad++">
+<meta name="description" content="Hippie interweaves preeminent personal interface elements">
+<meta name="robots" content="noindex">
+
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+{# <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> #}
+<meta http-equiv="X-UA-Compatible" content="IE=edge" />