diff --git a/.jshintrc b/.jshintrc
index 0e66116..4f95aa3 100644
--- a/.jshintrc
+++ b/.jshintrc
@@ -19,7 +19,7 @@
     "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"      : true,    // Quotation mark consistency:
+    "quotmark"      : false,    // Quotation mark consistency:
                                 //   false    : do nothing (default)
                                 //   true     : ensure whatever is used is consistent
                                 //   "single" : require single quotes
@@ -87,5 +87,16 @@
     "yui"           : false,    // Yahoo User Interface
 
     // Custom Globals
-    "globals"       : {"hippie": true}        // additional predefined global variables
+    "globals"       : {
+      "hippie": true,
+      "viewW": true,
+      "viewH": true,
+      "htmlH": true,
+      "bodyW": true,
+      "bodyH": true,
+      "docPosY": true,
+      "docInitleft": true,
+      "viewHover": true,
+      "basicEase": true
+      }        // additional predefined global variables
 }
diff --git a/gulpfile.js b/gulpfile.js
index f592d0d..caa7683 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -179,11 +179,12 @@ function code(cb) {
       sourcemaps: true,
       allowEmpty: true
     }),
-    cache('code'),
+    plumber(),
+    // cache('code'),
     concat(hippie.jsFile +'.js'),
     dest(output.code),
     uglify(),
-    remember('code'),
+    // remember('code'),
     rename({
       suffix: '.min'
     }),
diff --git a/source/code/hippie/functions.js b/source/code/hippie/functions.js
index ba08b31..f82d18b 100644
--- a/source/code/hippie/functions.js
+++ b/source/code/hippie/functions.js
@@ -1,60 +1,60 @@
-"use strict";
-
-function setup() {
-	console.log('\n', hippie_brand, '\n\n');
-	console.info('Debug information:\n\nHTML height is', html_height, '\nBODY height is', body_height, '\nVIEW height is', view_height);
-
-	if($('#js_tph').length && full_view_hover) {
-		// $('body').prepend("<div id=\"js_tph\" class=\"layer__hover hover_full_view_change\"></div>");
-		$('#js_tph').addClass("hover_full_view_change");
-	}
-}
-
-// get document coordinates of the element
-// function getCoords(elem) {
-// 	let box = elem.getBoundingClientRect();
-//
-// 	return {
-// 		top: box.top + pageYOffset,
-// 		left: box.left + pageXOffset
-// 	};
-// }
-
-// https://stackoverflow.com/a/488073/1444149
-function Utils() {}
-
-Utils.prototype = {
-	constructor: Utils,
-	isElementInView: function (element, fullyInView) {
-		var pageTop = $(window).scrollTop();
-		var pageBottom = pageTop + $(window).height();
-		var elementTop = $(element).offset().top;
-		var elementBottom = elementTop + $(element).height();
-
-		if (fullyInView === true) {
-			return ((pageTop < elementTop) && (pageBottom > elementBottom));
-		} else {
-			return ((elementTop <= pageBottom) && (elementBottom >= pageTop));
-		}
-	}
-};
-
-var Utils = new Utils();
-
-// TEST
-
-function scrollNav() {
-	$('.nav a').click(function(){
-		//Toggle Class
-		$(".active").removeClass("active");
-		$(this).closest('li').addClass("active");
-		var theClass = $(this).attr("class");
-		$('.'+theClass).parent('li').addClass('active');
-		//Animate
-		$('html, body').stop().animate({
-			scrollTop: $( $(this).attr('href') ).offset().top - 160
-		}, 400);
-		return false;
-	});
-	$('.scrollTop a').scrollTop();
-}
+"use strict";
+
+function setup() {
+	console.log('\n', hippie.brand, '\n\n');
+	console.info('Debug information:\n\nHTML height is', htmlH, '\nBODY height is', bodyH, '\nVIEW height is', viewH);
+
+	if($('#js_tph').length && viewHover) {
+		// $('body').prepend("<div id=\"js_tph\" class=\"layer__hover hover_full_view_change\"></div>");
+		$('#js_tph').addClass("hover_full_view_change");
+	}
+}
+
+// get document coordinates of the element
+// function getCoords(elem) {
+// 	let box = elem.getBoundingClientRect();
+//
+// 	return {
+// 		top: box.top + pageYOffset,
+// 		left: box.left + pageXOffset
+// 	};
+// }
+
+// https://stackoverflow.com/a/488073/1444149
+function Utils() {}
+
+Utils.prototype = {
+	constructor: Utils,
+	isElementInView: function (element, fullyInView) {
+		var pageTop = $(window).scrollTop();
+		var pageBottom = pageTop + $(window).height();
+		var elementTop = $(element).offset().top;
+		var elementBottom = elementTop + $(element).height();
+
+		if (fullyInView === true) {
+			return ((pageTop < elementTop) && (pageBottom > elementBottom));
+		} else {
+			return ((elementTop <= pageBottom) && (elementBottom >= pageTop));
+		}
+	}
+};
+
+var Utils = new Utils();
+
+// TEST
+
+function scrollNav() {
+	$('.nav a').click(function(){
+		//Toggle Class
+		$(".active").removeClass("active");
+		$(this).closest('li').addClass("active");
+		var theClass = $(this).attr("class");
+		$('.'+theClass).parent('li').addClass('active');
+		//Animate
+		$('html, body').stop().animate({
+			scrollTop: $( $(this).attr('href') ).offset().top - 160
+		}, 400);
+		return false;
+	});
+	$('.scrollTop a').scrollTop();
+}
diff --git a/source/code/hippie/global.js b/source/code/hippie/global.js
index d574422..c221269 100644
--- a/source/code/hippie/global.js
+++ b/source/code/hippie/global.js
@@ -1,155 +1,126 @@
-"use strict";
-
-// DOM ready
-// ------------------------------------------------------------------------------
-$( document ).ready(function() {
-
-	// Setup
-	// ------------------------------------------------------------------------------
-
-	setup();
-
-
-
-	// Modules
-	// ------------------------------------------------------------------------------
-
-	// Explanation module scripts
-	var exp_mode = false;
-
-	// Displays explanation popup
-	$(".js_pop").hover(
-		function() {
-			var $this = $(this);
-
-			// if($(this).attr("emmet")){
-			//
-			// }
-
-			$(this).next(".exp_pop").show();
-		}, function() {
-			$(this).next(".exp_pop").hide();
-		}
-	).mousemove(
-		function(ev) {
-			$(this).next(".exp_pop").css({
-				"top": ev.pageY - $(this).next(".exp_pop").outerHeight() - 4,
-				"left": ev.pageX + 8
-				// "left": ev.pageX - $(this).offset().left + 8
-			});
-			// TODO - needs more love
-			// console.log(ev.pageX);
-		}
-	);
-
-	// WIP Activates layer with explanation elements
-	// Besser ::after oder ::before benutzen
-	$(".js_showmeta").click(function(e){
-		var $wrap, $pop;
-
-		if(exp_mode !== true){
-			exp_mode = true;
-
-			$(".js_pop").each(function(i, e){
-				if($(this).css("position") === "static") {
-					$(this).addClass("js_changed_pos");
-					$(this).css("position", "relative");
-				}
-
-				$pop = $(this).next(".exp_pop").detach();
-				$wrap = $(this).wrap("<span class=\"exp_wrap\"></span>").parent().prepend("<span class=\"exp_marker_pop\"></span>");
-				$wrap.after($pop);
-			});
-
-		} else {
-			$(".js_pop").each(function(i, e){
-				$wrap = $(this).parent(".exp_wrap");
-				$pop = $wrap.next(".exp_pop").detach();
-				$wrap.find(".exp_marker_pop").remove();
-				$(this).unwrap(".exp_wrap");
-				$(this).after($pop);
-				if($(this).hasClass("js_changed_pos")){
-					$(this).css("position", "");
-					if($(this).attr("style") === "") {
-						$(this).removeAttr("style");
-					}
-					$(this).removeClass("js_changed_pos");
-				}
-			});
-
-			exp_mode = false;
-
-		}
-		console.log("Explanation mode", exp_mode);
-	});
-
-	//	WIP Scroll to top
-	$('.js_scrolltop').click(function(event) {
-		event.preventDefault();
-		console.log('scroll to the top');
-
-		document.documentElement.scrollTop = document.body.scrollTop = 0;
-
-		// var body = document.querySelector('body');
-		// // get scroll position in px
-		// console.log(body.scrollTop);
-		// // set scroll position in px
-		// body.scrollTop = 0;
-
-		// $('body')[0].scrollTop = 0;
-		// $('body').animate({scrollTop: 0}, basic_ease, function() {
-		// 	 console.log('arrived at top');
-		// });
-	});
-	$('.js_scrolldown').click(function(event) {
-		event.preventDefault();
-		var pos = Math.max(html_height, body_height) - view_height;
-		console.log('scroll down to', pos);
-		document.documentElement.scrollTop = pos;
-	});
-
-
-
-	$( "#gameIcon" ).click(function(event) {
-		event.preventDefault();
-		$( this ).clone().appendTo( "#gameDetail" );
-		$( this ).siblings().clone().appendTo( "#gameDetail" );
-		$( "#gameDetail" ).removeClass( "magic" );
-	});
-
-	var i = 0;
-	$( ".pass-def dd" ).each(function() {
-		$( this ).find( "li" ).each(function( index ) {
-			if ( 0 === $( this ).children( "ul" ).length ) {
-				//console.log(index, ":", $( this ).text());
-				var tempContent = $( this ).html();
-				//$( this ).html( "<span class=\"list-count\"></span>" );
-				$( this ).html(tempContent + "<span class=\"list-count\">" + i + "</span>");
-				i++;
-			}
-		});
-	});
-
-
-
-});
-
-
-
-// Scroll
-// ------------------------------------------------------------------------------
-$( document ).scroll(function() {
-
-	// Toggle navigation elements
-	doc_pos_y = $( document ).scrollTop();
-	// console.log(doc_pos_y);
-	// var demo_margin = $('.header__fix');
-	if (doc_pos_y > scroll_y_margin) {
-		$('.js_scrolltop').parent().removeClass('magic');
-	} else {
-		$('.js_scrolltop').parent().addClass('magic');
-	}
-
-
-
-});
+// Setup
+// -----------------------------------------------------------------------------
+setup();
+
+// DOM ready
+// -----------------------------------------------------------------------------
+$(document).ready(function(){
+	"use strict";
+
+	// logPerf('DOM ready.');
+
+	// Modules
+	// ---------------------------------------------------------------------------
+
+	// Explanation module scripts
+	var expMode = false;
+
+	// Displays explanation popup
+	$('.js_pop').hover(
+		function(){
+			// if($(this).attr('emmet')){
+			//
+			// }
+			$(this).next('.exp_pop').show();
+		}, function(){
+			$(this).next('.exp_pop').hide();
+		}
+	).mousemove(
+		function(event){
+			$(this).next('.exp_pop').css({
+				'top': event.pageY - $(this).next('.exp_pop').outerHeight() - 4,
+				'left': event.pageX + 8
+				// 'left': event.pageX - $(this).offset().left + 8
+			});
+			// TODO - needs more love
+			// console.log(event.pageX);
+		}
+	);
+
+	// WIP Activates layer with explanation elements
+	// Besser ::after oder ::before benutzen
+	$('.js_showmeta').click(function(e){
+		var $wrap, $pop;
+
+		if(expMode !== true){
+			expMode = true;
+
+			$('.js_pop').each(function(i, e){
+				if($(this).css('position') === 'static'){
+					$(this).addClass('js_changed_pos');
+					$(this).css('position', 'relative');
+				}
+
+				$pop = $(this).next('.exp_pop').detach();
+				$wrap = $(this).wrap('<span class="exp_wrap"></span>').parent().prepend('<span class="exp_marker_pop"></span>');
+				$wrap.after($pop);
+			});
+
+		} else {
+			$('.js_pop').each(function(i, e){
+				$wrap = $(this).parent('.exp_wrap');
+				$pop = $wrap.next('.exp_pop').detach();
+				$wrap.find('.exp_marker_pop').remove();
+				$(this).unwrap('.exp_wrap');
+				$(this).after($pop);
+				if($(this).hasClass('js_changed_pos')){
+					$(this).css('position', '');
+					if($(this).attr('style') === ''){
+						$(this).removeAttr('style');
+					}
+					$(this).removeClass('js_changed_pos');
+				}
+			});
+
+			expMode = false;
+
+		}
+		console.log('Explanation mode', expMode);
+	});
+
+	//	WIP Scroll to top
+	$('.js_scrolltop').click(function(event){
+		event.preventDefault();
+		$('html, body').animate({
+			scrollTop: 0
+		}, basicEase);
+	});
+	$('.js_scrolldown').click(function(event){
+		event.preventDefault();
+		var pos = Math.max(htmlH, bodyH) - viewH;
+		document.documentElement.scrollTop = pos;
+		console.info('scrolled down to', pos);
+	});
+
+
+
+	$('#gameIcon').click(function(event){
+		event.preventDefault();
+		$(this).clone().appendTo('#gameDetail');
+		$(this).siblings().clone().appendTo('#gameDetail');
+		$('#gameDetail').removeClass('magic');
+	});
+});
+
+
+// Scroll
+// ------------------------------------------------------------------------------
+$( document ).scroll(function(){
+	"use strict";
+
+	// Toggle navigation elements
+	docPosY = $( document ).scrollTop();
+	if(docPosY > docInitY){
+		if(!docInitleft){
+			$('.js_scrolltop').parent().removeClass('magic');
+			console.info('Initial viewport left');
+		}
+		docInitleft = true;
+	} else {
+		if(docInitleft){
+			$('.js_scrolltop').parent().addClass('magic');
+			console.info('Initial viewport left');
+		}
+		docInitleft = false;
+	}
+});
diff --git a/source/code/hippie/variables.js b/source/code/hippie/variables.js
index 8075b0b..87a0eea 100644
--- a/source/code/hippie/variables.js
+++ b/source/code/hippie/variables.js
@@ -1,16 +1,19 @@
-var hippie_brand = "|-| | |^ |^ | [- ";
-
-var view_width = Math.max(document.documentElement.offsetWidth, document.documentElement.clientWidth, window.innerWidth, 0);
-var view_height = Math.max(document.documentElement.clientHeight, window.innerHeight, 0);
-var html_height = Math.max(document.documentElement.offsetHeight, document.documentElement.clientHeight, 0);
-var body_height = Math.max(document.body.offsetHeight, document.body.clientHeight, 0);
-var body_width = Math.max(document.body.offsetWidth, document.body.clientWidth, window.innerWidth, 0);
-
-var full_view_hover = true;
-
-var doc_pos_y = 0;
-var basic_ease = 600;
-var scroll_y_margin = view_height;
-
-var onerow_alphabet = "/\\ ]3 ( |) [- /= (_, |-| | _T /< |_ |\\/| |\\| () |^ ()_ /? _\\~ ~|~ |_| \\/ \\/\\/ >< `/ ~/_ ";
-var onerow_digits = "\'| ^/_ -} +| ;~ (o \"/ {} \"| (\\) ";
+var hippie = {
+  brand: "|-| | |^ |^ | [- "
+};
+
+var viewW = Math.max(document.documentElement.offsetWidth, document.documentElement.clientWidth, window.innerWidth, 0);
+var viewH = Math.max(document.documentElement.clientHeight, window.innerHeight, 0);
+var htmlH = Math.max(document.documentElement.offsetHeight, document.documentElement.clientHeight, 0);
+var bodyW = Math.max(document.body.offsetWidth, document.body.clientWidth, window.innerWidth, 0);
+var bodyH = Math.max(document.body.offsetHeight, document.body.clientHeight, 0);
+
+var docPosY = 0;
+var docInitleft = false;
+var docInitY = viewH;
+
+var viewHover = true;
+var basicEase = 600;
+
+var onerowAlphabet = "/\\ ]3 ( |) [- /= (_, |-| | _T /< |_ |\\/| |\\| () |^ ()_ /? _\\~ ~|~ |_| \\/ \\/\\/ >< `/ ~/_ ";
+var onerowDigits = "\'| ^/_ -} +| ;~ (o \"/ {} \"| (\\) ";
diff --git a/source/templates/demo/_default.njk b/source/templates/demo/_default.njk
index 373df80..3c5bfee 100644
--- a/source/templates/demo/_default.njk
+++ b/source/templates/demo/_default.njk
@@ -10,6 +10,8 @@
   {% include "demo/partials/_meta.njk" %}
   {% block meta %}{% endblock %}
 
+  {% include "hippie/partials/_head_script.njk" %}
+
   {% include "demo/partials/_links.njk" %}
   {% block links %}
   <link rel="stylesheet" type="text/css" media="all" href="/css/demo.css"/>
diff --git a/source/templates/demo/_extended.njk b/source/templates/demo/_extended.njk
index 35f7f63..44b367b 100644
--- a/source/templates/demo/_extended.njk
+++ b/source/templates/demo/_extended.njk
@@ -10,6 +10,8 @@
   {% include "demo/partials/_meta.njk" %}
   {% block meta %}{% endblock %}
 
+  {% include "hippie/partials/_head_script.njk" %}
+  
   {% include "demo/partials/_links.njk" %}
   {% block links %}
   <!--[if lte IE 9]>
diff --git a/source/templates/hippie/partials/_head_script.njk b/source/templates/hippie/partials/_head_script.njk
new file mode 100644
index 0000000..944ed49
--- /dev/null
+++ b/source/templates/hippie/partials/_head_script.njk
@@ -0,0 +1,32 @@
+<!-- head.script.partial -->
+<script>
+//Entry script at page init
+
+// get the current time difference between page
+// load and when this func was invoked
+function getTimeDiff() {
+	return new Date().getTime() - performance.timing.navigationStart;
+}
+
+var debugOn = true;
+var $log, assetsLoaded = false;
+
+function logPerf(msg) {
+	if (debugOn) {
+		if (assetsLoaded) {
+			if (!$('#jslogPerf').length) {
+				$('body').prepend('<div id="jslogPerf" style="position:fixed;bottom:8px;right:16px;z-index:1000;padding:8px;background:rgb(0,255,255,.5)"></div>')
+			}
+			$log = $log || $('#jslogPerf');
+			$log.append('<p style="margin-bottom:4px;font-size:.75em;"><b>' + getTimeDiff() + '</b>ms :: ' + msg);
+		}
+		if (window.console) {
+			console.log(getTimeDiff() + 'ms :: ' + msg);
+			if (console.timeStamp){
+				console.timeStamp(msg);
+			}
+		}
+	}
+}
+logPerf('On HEAD, starting...');
+</script>