diff --git a/dev/demo/vc.html b/dev/demo/vc.html
index ca79de6..aa3822c 100644
--- a/dev/demo/vc.html
+++ b/dev/demo/vc.html
@@ -20,9 +20,9 @@
   color: black;
   padding: 1em;
   font-family: mono;
+  white-space: pre
 }
 
-
     </style>
   </head>
   <body>
diff --git a/dev/demo/vcdemo.js b/dev/demo/vcdemo.js
index d7dc0d2..d85f9fa 100644
--- a/dev/demo/vcdemo.js
+++ b/dev/demo/vcdemo.js
@@ -40,6 +40,7 @@
               "key":"subTitle",
               "value":"Gedichte",
               "match":"match:eq",
+/*
               "rewrites" : [
                 {
                   "@type": "koral:rewrite",
@@ -47,6 +48,7 @@
                   "operation" : "operation:injection",
                 }
               ]
+*/
             }
           ]
         }
@@ -62,16 +64,18 @@
   ]
 };
 
-require(['vc','lib/domReady'], function (vcClass, domReady) {
+require(['vc','lib/domReady', 'lib/highlight/highlight.pack'], function (vcClass, domReady) {
 
   var loc = KorAP.Locale;
 
+/*
   loc.AND = 'und';
   loc.OR  = 'oder';
   loc.VC_subTitle = 'Untertitel';
   loc.VC_title = 'Titel';
   loc.VC_pubDate = 'Veröffentlichungsdatum';
   loc.VC_pubPlace = 'Veröffentlichungsort';
+*/
 
   domReady(function() {
 
@@ -88,13 +92,14 @@
 
     // show the current JSON serialization
     KorAP.showJSON = function () {
-      document.getElementById("json").innerHTML = JSON.stringify(vc.root().toJson());
+      var json = document.getElementById("json");
+      json.innerHTML = JSON.stringify(vc.root().toJson(), null, '  ');
+      hljs.highlightBlock(json);
     };
 
     // show the current query serialization
     KorAP.showQuery = function () {
       document.getElementById("query").innerHTML = vc.root().toQuery();
     };
-
   });
 });
diff --git a/dev/js/lib/highlight/LICENSE b/dev/js/lib/highlight/LICENSE
new file mode 100644
index 0000000..422deb7
--- /dev/null
+++ b/dev/js/lib/highlight/LICENSE
@@ -0,0 +1,24 @@
+Copyright (c) 2006, Ivan Sagalaev
+All rights reserved.
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright
+      notice, this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above copyright
+      notice, this list of conditions and the following disclaimer in the
+      documentation and/or other materials provided with the distribution.
+    * Neither the name of highlight.js nor the names of its contributors 
+      may be used to endorse or promote products derived from this software 
+      without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE REGENTS AND CONTRIBUTORS ``AS IS'' AND ANY
+EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE REGENTS AND CONTRIBUTORS BE LIABLE FOR ANY
+DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
+(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
+ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
diff --git a/dev/js/lib/highlight/README.md b/dev/js/lib/highlight/README.md
new file mode 100644
index 0000000..f29f1b1
--- /dev/null
+++ b/dev/js/lib/highlight/README.md
@@ -0,0 +1,101 @@
+# Highlight.js
+
+[![Build Status](https://travis-ci.org/isagalaev/highlight.js.svg?branch=master)](https://travis-ci.org/isagalaev/highlight.js)
+
+Highlight.js is a syntax highlighter written in JavaScript. It works in the
+browser as well as on the server. It works with pretty much any markup,
+doesn’t depend on any framework and has automatic language detection.
+
+
+## Getting Started
+
+The bare minimum for using highlight.js on a web page is linking to the library
+along with one of the styles and calling [`initHighlightingOnLoad`][1]:
+
+```html
+<link rel="stylesheet" href="/path/to/styles/default.css">
+<script src="/path/to/highlight.pack.js"></script>
+<script>hljs.initHighlightingOnLoad();</script>
+```
+
+This will find and highlight code inside of `<pre><code>` tags; it tries to detect
+the language automatically. If automatic detection doesn’t work for you, you can
+specify the language in the `class` attribute:
+
+```html
+<pre><code class="html">...</code></pre>
+```
+
+The list of supported language classes is available in the [class reference][8].
+Classes can also be prefixed with either `language-` or `lang-`.
+
+To disable highlighting altogether use the `nohighlight` class:
+
+```html
+<pre><code class="nohighlight">...</code></pre>
+```
+
+## Custom Initialization
+
+When you need a bit more control over the initialization of
+highlight.js, you can use the [`highlightBlock`][2] and [`configure`][3]
+functions. This allows you to control *what* to highlight and *when*.
+
+Here’s an equivalent way to calling [`initHighlightingOnLoad`][1] using jQuery:
+
+```javascript
+$(document).ready(function() {
+  $('pre code').each(function(i, block) {
+    hljs.highlightBlock(block);
+  });
+});
+```
+
+You can use any tags instead of `<pre><code>` to mark up your code. If you don't
+use a container that preserve line breaks you will need to configure
+highlight.js to use the `<br>` tag:
+
+```javascript
+hljs.configure({useBR: true});
+
+$('div.code').each(function(i, block) {
+  hljs.highlightBlock(block);
+});
+```
+
+For other options refer to the documentation for [`configure`][3].
+
+
+## Getting the Library
+
+You can get highlight.js as a hosted or custom-build browser script or as a
+server module. Head over to the [download page][4] for all the options.
+
+**Note:** the library is not supposed to work straight from the source on
+GitHub; it requires building. If none of the pre-packaged options work for you
+refer to the [building documentation][5].
+
+
+## License
+
+Highlight.js is released under the BSD License. See [LICENSE][10] file for
+details.
+
+
+## Links
+
+The official site for the library is at <https://highlightjs.org/>.
+
+Further in-depth documentation for the API and other topics is at
+<http://highlightjs.readthedocs.org/>.
+
+Authors and contributors are listed in the [AUTHORS.en.txt][9] file.
+
+[1]: http://highlightjs.readthedocs.org/en/latest/api.html#inithighlightingonload
+[2]: http://highlightjs.readthedocs.org/en/latest/api.html#highlightblock-block
+[3]: http://highlightjs.readthedocs.org/en/latest/api.html#configure-options
+[4]: https://highlightjs.org/download/
+[5]: http://highlightjs.readthedocs.org/en/latest/building-testing.html
+[8]: http://highlightjs.readthedocs.org/en/latest/css-classes-reference.html
+[9]: https://github.com/isagalaev/highlight.js/blob/master/AUTHORS.en.txt
+[10]: https://github.com/isagalaev/highlight.js/blob/master/LICENSE
diff --git a/dev/js/lib/highlight/highlight.pack.js b/dev/js/lib/highlight/highlight.pack.js
index 6c71f03..c5b6e8f 100644
--- a/dev/js/lib/highlight/highlight.pack.js
+++ b/dev/js/lib/highlight/highlight.pack.js
@@ -1 +1 @@
-var hljs=new function(){function k(v){return v.replace(/&/gm,"&amp;").replace(/</gm,"&lt;").replace(/>/gm,"&gt;")}function t(v){return v.nodeName.toLowerCase()}function i(w,x){var v=w&&w.exec(x);return v&&v.index==0}function d(v){return Array.prototype.map.call(v.childNodes,function(w){if(w.nodeType==3){return b.useBR?w.nodeValue.replace(/\n/g,""):w.nodeValue}if(t(w)=="br"){return"\n"}return d(w)}).join("")}function r(w){var v=(w.className+" "+(w.parentNode?w.parentNode.className:"")).split(/\s+/);v=v.map(function(x){return x.replace(/^language-/,"")});return v.filter(function(x){return j(x)||x=="no-highlight"})[0]}function o(x,y){var v={};for(var w in x){v[w]=x[w]}if(y){for(var w in y){v[w]=y[w]}}return v}function u(x){var v=[];(function w(y,z){for(var A=y.firstChild;A;A=A.nextSibling){if(A.nodeType==3){z+=A.nodeValue.length}else{if(t(A)=="br"){z+=1}else{if(A.nodeType==1){v.push({event:"start",offset:z,node:A});z=w(A,z);v.push({event:"stop",offset:z,node:A})}}}}return z})(x,0);return v}function q(w,y,C){var x=0;var F="";var z=[];function B(){if(!w.length||!y.length){return w.length?w:y}if(w[0].offset!=y[0].offset){return(w[0].offset<y[0].offset)?w:y}return y[0].event=="start"?w:y}function A(H){function G(I){return" "+I.nodeName+'="'+k(I.value)+'"'}F+="<"+t(H)+Array.prototype.map.call(H.attributes,G).join("")+">"}function E(G){F+="</"+t(G)+">"}function v(G){(G.event=="start"?A:E)(G.node)}while(w.length||y.length){var D=B();F+=k(C.substr(x,D[0].offset-x));x=D[0].offset;if(D==w){z.reverse().forEach(E);do{v(D.splice(0,1)[0]);D=B()}while(D==w&&D.length&&D[0].offset==x);z.reverse().forEach(A)}else{if(D[0].event=="start"){z.push(D[0].node)}else{z.pop()}v(D.splice(0,1)[0])}}return F+k(C.substr(x))}function m(y){function v(z){return(z&&z.source)||z}function w(A,z){return RegExp(v(A),"m"+(y.cI?"i":"")+(z?"g":""))}function x(D,C){if(D.compiled){return}D.compiled=true;D.k=D.k||D.bK;if(D.k){var z={};function E(G,F){if(y.cI){F=F.toLowerCase()}F.split(" ").forEach(function(H){var I=H.split("|");z[I[0]]=[G,I[1]?Number(I[1]):1]})}if(typeof D.k=="string"){E("keyword",D.k)}else{Object.keys(D.k).forEach(function(F){E(F,D.k[F])})}D.k=z}D.lR=w(D.l||/\b[A-Za-z0-9_]+\b/,true);if(C){if(D.bK){D.b=D.bK.split(" ").join("|")}if(!D.b){D.b=/\B|\b/}D.bR=w(D.b);if(!D.e&&!D.eW){D.e=/\B|\b/}if(D.e){D.eR=w(D.e)}D.tE=v(D.e)||"";if(D.eW&&C.tE){D.tE+=(D.e?"|":"")+C.tE}}if(D.i){D.iR=w(D.i)}if(D.r===undefined){D.r=1}if(!D.c){D.c=[]}var B=[];D.c.forEach(function(F){if(F.v){F.v.forEach(function(G){B.push(o(F,G))})}else{B.push(F=="self"?D:F)}});D.c=B;D.c.forEach(function(F){x(F,D)});if(D.starts){x(D.starts,C)}var A=D.c.map(function(F){return F.bK?"\\.?\\b("+F.b+")\\b\\.?":F.b}).concat([D.tE]).concat([D.i]).map(v).filter(Boolean);D.t=A.length?w(A.join("|"),true):{exec:function(F){return null}};D.continuation={}}x(y)}function c(S,L,J,R){function v(U,V){for(var T=0;T<V.c.length;T++){if(i(V.c[T].bR,U)){return V.c[T]}}}function z(U,T){if(i(U.eR,T)){return U}if(U.eW){return z(U.parent,T)}}function A(T,U){return !J&&i(U.iR,T)}function E(V,T){var U=M.cI?T[0].toLowerCase():T[0];return V.k.hasOwnProperty(U)&&V.k[U]}function w(Z,X,W,V){var T=V?"":b.classPrefix,U='<span class="'+T,Y=W?"":"</span>";U+=Z+'">';return U+X+Y}function N(){var U=k(C);if(!I.k){return U}var T="";var X=0;I.lR.lastIndex=0;var V=I.lR.exec(U);while(V){T+=U.substr(X,V.index-X);var W=E(I,V);if(W){H+=W[1];T+=w(W[0],V[0])}else{T+=V[0]}X=I.lR.lastIndex;V=I.lR.exec(U)}return T+U.substr(X)}function F(){if(I.sL&&!f[I.sL]){return k(C)}var T=I.sL?c(I.sL,C,true,I.continuation.top):g(C);if(I.r>0){H+=T.r}if(I.subLanguageMode=="continuous"){I.continuation.top=T.top}return w(T.language,T.value,false,true)}function Q(){return I.sL!==undefined?F():N()}function P(V,U){var T=V.cN?w(V.cN,"",true):"";if(V.rB){D+=T;C=""}else{if(V.eB){D+=k(U)+T;C=""}else{D+=T;C=U}}I=Object.create(V,{parent:{value:I}})}function G(T,X){C+=T;if(X===undefined){D+=Q();return 0}var V=v(X,I);if(V){D+=Q();P(V,X);return V.rB?0:X.length}var W=z(I,X);if(W){var U=I;if(!(U.rE||U.eE)){C+=X}D+=Q();do{if(I.cN){D+="</span>"}H+=I.r;I=I.parent}while(I!=W.parent);if(U.eE){D+=k(X)}C="";if(W.starts){P(W.starts,"")}return U.rE?0:X.length}if(A(X,I)){throw new Error('Illegal lexeme "'+X+'" for mode "'+(I.cN||"<unnamed>")+'"')}C+=X;return X.length||1}var M=j(S);if(!M){throw new Error('Unknown language: "'+S+'"')}m(M);var I=R||M;var D="";for(var K=I;K!=M;K=K.parent){if(K.cN){D=w(K.cN,D,true)}}var C="";var H=0;try{var B,y,x=0;while(true){I.t.lastIndex=x;B=I.t.exec(L);if(!B){break}y=G(L.substr(x,B.index-x),B[0]);x=B.index+y}G(L.substr(x));for(var K=I;K.parent;K=K.parent){if(K.cN){D+="</span>"}}return{r:H,value:D,language:S,top:I}}catch(O){if(O.message.indexOf("Illegal")!=-1){return{r:0,value:k(L)}}else{throw O}}}function g(y,x){x=x||b.languages||Object.keys(f);var v={r:0,value:k(y)};var w=v;x.forEach(function(z){if(!j(z)){return}var A=c(z,y,false);A.language=z;if(A.r>w.r){w=A}if(A.r>v.r){w=v;v=A}});if(w.language){v.second_best=w}return v}function h(v){if(b.tabReplace){v=v.replace(/^((<[^>]+>|\t)+)/gm,function(w,z,y,x){return z.replace(/\t/g,b.tabReplace)})}if(b.useBR){v=v.replace(/\n/g,"<br>")}return v}function p(z){var y=d(z);var A=r(z);if(A=="no-highlight"){return}var v=A?c(A,y,true):g(y);var w=u(z);if(w.length){var x=document.createElementNS("http://www.w3.org/1999/xhtml","pre");x.innerHTML=v.value;v.value=q(w,u(x),y)}v.value=h(v.value);z.innerHTML=v.value;z.className+=" hljs "+(!A&&v.language||"");z.result={language:v.language,re:v.r};if(v.second_best){z.second_best={language:v.second_best.language,re:v.second_best.r}}}var b={classPrefix:"hljs-",tabReplace:null,useBR:false,languages:undefined};function s(v){b=o(b,v)}function l(){if(l.called){return}l.called=true;var v=document.querySelectorAll("pre code");Array.prototype.forEach.call(v,p)}function a(){addEventListener("DOMContentLoaded",l,false);addEventListener("load",l,false)}var f={};var n={};function e(v,x){var w=f[v]=x(this);if(w.aliases){w.aliases.forEach(function(y){n[y]=v})}}function j(v){return f[v]||f[n[v]]}this.highlight=c;this.highlightAuto=g;this.fixMarkup=h;this.highlightBlock=p;this.configure=s;this.initHighlighting=l;this.initHighlightingOnLoad=a;this.registerLanguage=e;this.getLanguage=j;this.inherit=o;this.IR="[a-zA-Z][a-zA-Z0-9_]*";this.UIR="[a-zA-Z_][a-zA-Z0-9_]*";this.NR="\\b\\d+(\\.\\d+)?";this.CNR="(\\b0[xX][a-fA-F0-9]+|(\\b\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)";this.BNR="\\b(0b[01]+)";this.RSR="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|-|-=|/=|/|:|;|<<|<<=|<=|<|===|==|=|>>>=|>>=|>=|>>>|>>|>|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~";this.BE={b:"\\\\[\\s\\S]",r:0};this.ASM={cN:"string",b:"'",e:"'",i:"\\n",c:[this.BE]};this.QSM={cN:"string",b:'"',e:'"',i:"\\n",c:[this.BE]};this.CLCM={cN:"comment",b:"//",e:"$"};this.CBLCLM={cN:"comment",b:"/\\*",e:"\\*/"};this.HCM={cN:"comment",b:"#",e:"$"};this.NM={cN:"number",b:this.NR,r:0};this.CNM={cN:"number",b:this.CNR,r:0};this.BNM={cN:"number",b:this.BNR,r:0};this.REGEXP_MODE={cN:"regexp",b:/\//,e:/\/[gim]*/,i:/\n/,c:[this.BE,{b:/\[/,e:/\]/,r:0,c:[this.BE]}]};this.TM={cN:"title",b:this.IR,r:0};this.UTM={cN:"title",b:this.UIR,r:0}}();hljs.registerLanguage("xml",function(a){var c="[A-Za-z0-9\\._:-]+";var d={b:/<\?(php)?(?!\w)/,e:/\?>/,sL:"php",subLanguageMode:"continuous"};var b={eW:true,i:/</,r:0,c:[d,{cN:"attribute",b:c,r:0},{b:"=",r:0,c:[{cN:"value",v:[{b:/"/,e:/"/},{b:/'/,e:/'/},{b:/[^\s\/>]+/}]}]}]};return{aliases:["html"],cI:true,c:[{cN:"doctype",b:"<!DOCTYPE",e:">",r:10,c:[{b:"\\[",e:"\\]"}]},{cN:"comment",b:"<!--",e:"-->",r:10},{cN:"cdata",b:"<\\!\\[CDATA\\[",e:"\\]\\]>",r:10},{cN:"tag",b:"<style(?=\\s|>|$)",e:">",k:{title:"style"},c:[b],starts:{e:"</style>",rE:true,sL:"css"}},{cN:"tag",b:"<script(?=\\s|>|$)",e:">",k:{title:"script"},c:[b],starts:{e:"<\/script>",rE:true,sL:"javascript"}},{b:"<%",e:"%>",sL:"vbscript"},d,{cN:"pi",b:/<\?\w+/,e:/\?>/,r:10},{cN:"tag",b:"</?",e:"/?>",c:[{cN:"title",b:"[^ /><]+",r:0},b]}]}});hljs.registerLanguage("markdown",function(a){return{c:[{cN:"header",v:[{b:"^#{1,6}",e:"$"},{b:"^.+?\\n[=-]{2,}$"}]},{b:"<",e:">",sL:"xml",r:0},{cN:"bullet",b:"^([*+-]|(\\d+\\.))\\s+"},{cN:"strong",b:"[*_]{2}.+?[*_]{2}"},{cN:"emphasis",v:[{b:"\\*.+?\\*"},{b:"_.+?_",r:0}]},{cN:"blockquote",b:"^>\\s+",e:"$"},{cN:"code",v:[{b:"`.+?`"},{b:"^( {4}|\t)",e:"$",r:0}]},{cN:"horizontal_rule",b:"^[-\\*]{3,}",e:"$"},{b:"\\[.+?\\][\\(\\[].+?[\\)\\]]",rB:true,c:[{cN:"link_label",b:"\\[",e:"\\]",eB:true,rE:true,r:0},{cN:"link_url",b:"\\]\\(",e:"\\)",eB:true,eE:true},{cN:"link_reference",b:"\\]\\[",e:"\\]",eB:true,eE:true,}],r:10},{b:"^\\[.+\\]:",e:"$",rB:true,c:[{cN:"link_reference",b:"\\[",e:"\\]",eB:true,eE:true},{cN:"link_url",b:"\\s",e:"$"}]}]}});hljs.registerLanguage("css",function(a){var b="[a-zA-Z-][a-zA-Z0-9_-]*";var c={cN:"function",b:b+"\\(",e:"\\)",c:["self",a.NM,a.ASM,a.QSM]};return{cI:true,i:"[=/|']",c:[a.CBLCLM,{cN:"id",b:"\\#[A-Za-z0-9_-]+"},{cN:"class",b:"\\.[A-Za-z0-9_-]+",r:0},{cN:"attr_selector",b:"\\[",e:"\\]",i:"$"},{cN:"pseudo",b:":(:)?[a-zA-Z0-9\\_\\-\\+\\(\\)\\\"\\']+"},{cN:"at_rule",b:"@(font-face|page)",l:"[a-z-]+",k:"font-face page"},{cN:"at_rule",b:"@",e:"[{;]",c:[{cN:"keyword",b:/\S+/},{b:/\s/,eW:true,eE:true,r:0,c:[c,a.ASM,a.QSM,a.NM]}]},{cN:"tag",b:b,r:0},{cN:"rules",b:"{",e:"}",i:"[^\\s]",r:0,c:[a.CBLCLM,{cN:"rule",b:"[^\\s]",rB:true,e:";",eW:true,c:[{cN:"attribute",b:"[A-Z\\_\\.\\-]+",e:":",eE:true,i:"[^\\s]",starts:{cN:"value",eW:true,eE:true,c:[c,a.NM,a.QSM,a.ASM,a.CBLCLM,{cN:"hexcolor",b:"#[0-9A-Fa-f]+"},{cN:"important",b:"!important"}]}}]}]}]}});hljs.registerLanguage("json",function(a){var e={literal:"true false null"};var d=[a.QSM,a.CNM];var c={cN:"value",e:",",eW:true,eE:true,c:d,k:e};var b={b:"{",e:"}",c:[{cN:"attribute",b:'\\s*"',e:'"\\s*:\\s*',eB:true,eE:true,c:[a.BE],i:"\\n",starts:c}],i:"\\S"};var f={b:"\\[",e:"\\]",c:[a.inherit(c,{cN:null})],i:"\\S"};d.splice(d.length,0,b,f);return{c:d,k:e,i:"\\S"}});
\ No newline at end of file
+!function(e){"undefined"!=typeof exports?e(exports):(window.hljs=e({}),"function"==typeof define&&define.amd&&define([],function(){return window.hljs}))}(function(e){function n(e){return e.replace(/&/gm,"&amp;").replace(/</gm,"&lt;").replace(/>/gm,"&gt;")}function t(e){return e.nodeName.toLowerCase()}function r(e,n){var t=e&&e.exec(n);return t&&0==t.index}function a(e){var n=(e.className+" "+(e.parentNode?e.parentNode.className:"")).split(/\s+/);return n=n.map(function(e){return e.replace(/^lang(uage)?-/,"")}),n.filter(function(e){return N(e)||/no(-?)highlight|plain|text/.test(e)})[0]}function i(e,n){var t,r={};for(t in e)r[t]=e[t];if(n)for(t in n)r[t]=n[t];return r}function o(e){var n=[];return function r(e,a){for(var i=e.firstChild;i;i=i.nextSibling)3==i.nodeType?a+=i.nodeValue.length:1==i.nodeType&&(n.push({event:"start",offset:a,node:i}),a=r(i,a),t(i).match(/br|hr|img|input/)||n.push({event:"stop",offset:a,node:i}));return a}(e,0),n}function u(e,r,a){function i(){return e.length&&r.length?e[0].offset!=r[0].offset?e[0].offset<r[0].offset?e:r:"start"==r[0].event?e:r:e.length?e:r}function o(e){function r(e){return" "+e.nodeName+'="'+n(e.value)+'"'}l+="<"+t(e)+Array.prototype.map.call(e.attributes,r).join("")+">"}function u(e){l+="</"+t(e)+">"}function c(e){("start"==e.event?o:u)(e.node)}for(var s=0,l="",f=[];e.length||r.length;){var g=i();if(l+=n(a.substr(s,g[0].offset-s)),s=g[0].offset,g==e){f.reverse().forEach(u);do c(g.splice(0,1)[0]),g=i();while(g==e&&g.length&&g[0].offset==s);f.reverse().forEach(o)}else"start"==g[0].event?f.push(g[0].node):f.pop(),c(g.splice(0,1)[0])}return l+n(a.substr(s))}function c(e){function n(e){return e&&e.source||e}function t(t,r){return new RegExp(n(t),"m"+(e.cI?"i":"")+(r?"g":""))}function r(a,o){if(!a.compiled){if(a.compiled=!0,a.k=a.k||a.bK,a.k){var u={},c=function(n,t){e.cI&&(t=t.toLowerCase()),t.split(" ").forEach(function(e){var t=e.split("|");u[t[0]]=[n,t[1]?Number(t[1]):1]})};"string"==typeof a.k?c("keyword",a.k):Object.keys(a.k).forEach(function(e){c(e,a.k[e])}),a.k=u}a.lR=t(a.l||/\b\w+\b/,!0),o&&(a.bK&&(a.b="\\b("+a.bK.split(" ").join("|")+")\\b"),a.b||(a.b=/\B|\b/),a.bR=t(a.b),a.e||a.eW||(a.e=/\B|\b/),a.e&&(a.eR=t(a.e)),a.tE=n(a.e)||"",a.eW&&o.tE&&(a.tE+=(a.e?"|":"")+o.tE)),a.i&&(a.iR=t(a.i)),void 0===a.r&&(a.r=1),a.c||(a.c=[]);var s=[];a.c.forEach(function(e){e.v?e.v.forEach(function(n){s.push(i(e,n))}):s.push("self"==e?a:e)}),a.c=s,a.c.forEach(function(e){r(e,a)}),a.starts&&r(a.starts,o);var l=a.c.map(function(e){return e.bK?"\\.?("+e.b+")\\.?":e.b}).concat([a.tE,a.i]).map(n).filter(Boolean);a.t=l.length?t(l.join("|"),!0):{exec:function(){return null}}}}r(e)}function s(e,t,a,i){function o(e,n){for(var t=0;t<n.c.length;t++)if(r(n.c[t].bR,e))return n.c[t]}function u(e,n){if(r(e.eR,n)){for(;e.endsParent&&e.parent;)e=e.parent;return e}return e.eW?u(e.parent,n):void 0}function f(e,n){return!a&&r(n.iR,e)}function g(e,n){var t=E.cI?n[0].toLowerCase():n[0];return e.k.hasOwnProperty(t)&&e.k[t]}function p(e,n,t,r){var a=r?"":x.classPrefix,i='<span class="'+a,o=t?"":"</span>";return i+=e+'">',i+n+o}function d(){if(!L.k)return n(y);var e="",t=0;L.lR.lastIndex=0;for(var r=L.lR.exec(y);r;){e+=n(y.substr(t,r.index-t));var a=g(L,r);a?(B+=a[1],e+=p(a[0],n(r[0]))):e+=n(r[0]),t=L.lR.lastIndex,r=L.lR.exec(y)}return e+n(y.substr(t))}function h(){if(L.sL&&!w[L.sL])return n(y);var e=L.sL?s(L.sL,y,!0,M[L.sL]):l(y);return L.r>0&&(B+=e.r),"continuous"==L.subLanguageMode&&(M[L.sL]=e.top),p(e.language,e.value,!1,!0)}function b(){return void 0!==L.sL?h():d()}function v(e,t){var r=e.cN?p(e.cN,"",!0):"";e.rB?(k+=r,y=""):e.eB?(k+=n(t)+r,y=""):(k+=r,y=t),L=Object.create(e,{parent:{value:L}})}function m(e,t){if(y+=e,void 0===t)return k+=b(),0;var r=o(t,L);if(r)return k+=b(),v(r,t),r.rB?0:t.length;var a=u(L,t);if(a){var i=L;i.rE||i.eE||(y+=t),k+=b();do L.cN&&(k+="</span>"),B+=L.r,L=L.parent;while(L!=a.parent);return i.eE&&(k+=n(t)),y="",a.starts&&v(a.starts,""),i.rE?0:t.length}if(f(t,L))throw new Error('Illegal lexeme "'+t+'" for mode "'+(L.cN||"<unnamed>")+'"');return y+=t,t.length||1}var E=N(e);if(!E)throw new Error('Unknown language: "'+e+'"');c(E);var R,L=i||E,M={},k="";for(R=L;R!=E;R=R.parent)R.cN&&(k=p(R.cN,"",!0)+k);var y="",B=0;try{for(var C,j,I=0;;){if(L.t.lastIndex=I,C=L.t.exec(t),!C)break;j=m(t.substr(I,C.index-I),C[0]),I=C.index+j}for(m(t.substr(I)),R=L;R.parent;R=R.parent)R.cN&&(k+="</span>");return{r:B,value:k,language:e,top:L}}catch(S){if(-1!=S.message.indexOf("Illegal"))return{r:0,value:n(t)};throw S}}function l(e,t){t=t||x.languages||Object.keys(w);var r={r:0,value:n(e)},a=r;return t.forEach(function(n){if(N(n)){var t=s(n,e,!1);t.language=n,t.r>a.r&&(a=t),t.r>r.r&&(a=r,r=t)}}),a.language&&(r.second_best=a),r}function f(e){return x.tabReplace&&(e=e.replace(/^((<[^>]+>|\t)+)/gm,function(e,n){return n.replace(/\t/g,x.tabReplace)})),x.useBR&&(e=e.replace(/\n/g,"<br>")),e}function g(e,n,t){var r=n?E[n]:t,a=[e.trim()];return e.match(/\bhljs\b/)||a.push("hljs"),-1===e.indexOf(r)&&a.push(r),a.join(" ").trim()}function p(e){var n=a(e);if(!/no(-?)highlight|plain|text/.test(n)){var t;x.useBR?(t=document.createElementNS("http://www.w3.org/1999/xhtml","div"),t.innerHTML=e.innerHTML.replace(/\n/g,"").replace(/<br[ \/]*>/g,"\n")):t=e;var r=t.textContent,i=n?s(n,r,!0):l(r),c=o(t);if(c.length){var p=document.createElementNS("http://www.w3.org/1999/xhtml","div");p.innerHTML=i.value,i.value=u(c,o(p),r)}i.value=f(i.value),e.innerHTML=i.value,e.className=g(e.className,n,i.language),e.result={language:i.language,re:i.r},i.second_best&&(e.second_best={language:i.second_best.language,re:i.second_best.r})}}function d(e){x=i(x,e)}function h(){if(!h.called){h.called=!0;var e=document.querySelectorAll("pre code");Array.prototype.forEach.call(e,p)}}function b(){addEventListener("DOMContentLoaded",h,!1),addEventListener("load",h,!1)}function v(n,t){var r=w[n]=t(e);r.aliases&&r.aliases.forEach(function(e){E[e]=n})}function m(){return Object.keys(w)}function N(e){return w[e]||w[E[e]]}var x={classPrefix:"hljs-",tabReplace:null,useBR:!1,languages:void 0},w={},E={};return e.highlight=s,e.highlightAuto=l,e.fixMarkup=f,e.highlightBlock=p,e.configure=d,e.initHighlighting=h,e.initHighlightingOnLoad=b,e.registerLanguage=v,e.listLanguages=m,e.getLanguage=N,e.inherit=i,e.IR="[a-zA-Z]\\w*",e.UIR="[a-zA-Z_]\\w*",e.NR="\\b\\d+(\\.\\d+)?",e.CNR="\\b(0[xX][a-fA-F0-9]+|(\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)",e.BNR="\\b(0b[01]+)",e.RSR="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|-|-=|/=|/|:|;|<<|<<=|<=|<|===|==|=|>>>=|>>=|>=|>>>|>>|>|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~",e.BE={b:"\\\\[\\s\\S]",r:0},e.ASM={cN:"string",b:"'",e:"'",i:"\\n",c:[e.BE]},e.QSM={cN:"string",b:'"',e:'"',i:"\\n",c:[e.BE]},e.PWM={b:/\b(a|an|the|are|I|I'm|isn't|don't|doesn't|won't|but|just|should|pretty|simply|enough|gonna|going|wtf|so|such)\b/},e.C=function(n,t,r){var a=e.inherit({cN:"comment",b:n,e:t,c:[]},r||{});return a.c.push(e.PWM),a},e.CLCM=e.C("//","$"),e.CBCM=e.C("/\\*","\\*/"),e.HCM=e.C("#","$"),e.NM={cN:"number",b:e.NR,r:0},e.CNM={cN:"number",b:e.CNR,r:0},e.BNM={cN:"number",b:e.BNR,r:0},e.CSSNM={cN:"number",b:e.NR+"(%|em|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|px|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx)?",r:0},e.RM={cN:"regexp",b:/\//,e:/\/[gimuy]*/,i:/\n/,c:[e.BE,{b:/\[/,e:/\]/,r:0,c:[e.BE]}]},e.TM={cN:"title",b:e.IR,r:0},e.UTM={cN:"title",b:e.UIR,r:0},e});hljs.registerLanguage("json",function(e){var t={literal:"true false null"},i=[e.QSM,e.CNM],l={cN:"value",e:",",eW:!0,eE:!0,c:i,k:t},c={b:"{",e:"}",c:[{cN:"attribute",b:'\\s*"',e:'"\\s*:\\s*',eB:!0,eE:!0,c:[e.BE],i:"\\n",starts:l}],i:"\\S"},n={b:"\\[",e:"\\]",c:[e.inherit(l,{cN:null})],i:"\\S"};return i.splice(i.length,0,c,n),{c:i,k:t,i:"\\S"}});hljs.registerLanguage("scss",function(e){{var t="[a-zA-Z-][a-zA-Z0-9_-]*",i={cN:"variable",b:"(\\$"+t+")\\b"},r={cN:"function",b:t+"\\(",rB:!0,eE:!0,e:"\\("},o={cN:"hexcolor",b:"#[0-9A-Fa-f]+"};({cN:"attribute",b:"[A-Z\\_\\.\\-]+",e:":",eE:!0,i:"[^\\s]",starts:{cN:"value",eW:!0,eE:!0,c:[r,o,e.CSSNM,e.QSM,e.ASM,e.CBCM,{cN:"important",b:"!important"}]}})}return{cI:!0,i:"[=/|']",c:[e.CLCM,e.CBCM,r,{cN:"id",b:"\\#[A-Za-z0-9_-]+",r:0},{cN:"class",b:"\\.[A-Za-z0-9_-]+",r:0},{cN:"attr_selector",b:"\\[",e:"\\]",i:"$"},{cN:"tag",b:"\\b(a|abbr|acronym|address|area|article|aside|audio|b|base|big|blockquote|body|br|button|canvas|caption|cite|code|col|colgroup|command|datalist|dd|del|details|dfn|div|dl|dt|em|embed|fieldset|figcaption|figure|footer|form|frame|frameset|(h[1-6])|head|header|hgroup|hr|html|i|iframe|img|input|ins|kbd|keygen|label|legend|li|link|map|mark|meta|meter|nav|noframes|noscript|object|ol|optgroup|option|output|p|param|pre|progress|q|rp|rt|ruby|samp|script|section|select|small|span|strike|strong|style|sub|sup|table|tbody|td|textarea|tfoot|th|thead|time|title|tr|tt|ul|var|video)\\b",r:0},{cN:"pseudo",b:":(visited|valid|root|right|required|read-write|read-only|out-range|optional|only-of-type|only-child|nth-of-type|nth-last-of-type|nth-last-child|nth-child|not|link|left|last-of-type|last-child|lang|invalid|indeterminate|in-range|hover|focus|first-of-type|first-line|first-letter|first-child|first|enabled|empty|disabled|default|checked|before|after|active)"},{cN:"pseudo",b:"::(after|before|choices|first-letter|first-line|repeat-index|repeat-item|selection|value)"},i,{cN:"attribute",b:"\\b(z-index|word-wrap|word-spacing|word-break|width|widows|white-space|visibility|vertical-align|unicode-bidi|transition-timing-function|transition-property|transition-duration|transition-delay|transition|transform-style|transform-origin|transform|top|text-underline-position|text-transform|text-shadow|text-rendering|text-overflow|text-indent|text-decoration-style|text-decoration-line|text-decoration-color|text-decoration|text-align-last|text-align|tab-size|table-layout|right|resize|quotes|position|pointer-events|perspective-origin|perspective|page-break-inside|page-break-before|page-break-after|padding-top|padding-right|padding-left|padding-bottom|padding|overflow-y|overflow-x|overflow-wrap|overflow|outline-width|outline-style|outline-offset|outline-color|outline|orphans|order|opacity|object-position|object-fit|normal|none|nav-up|nav-right|nav-left|nav-index|nav-down|min-width|min-height|max-width|max-height|mask|marks|margin-top|margin-right|margin-left|margin-bottom|margin|list-style-type|list-style-position|list-style-image|list-style|line-height|letter-spacing|left|justify-content|initial|inherit|ime-mode|image-orientation|image-resolution|image-rendering|icon|hyphens|height|font-weight|font-variant-ligatures|font-variant|font-style|font-stretch|font-size-adjust|font-size|font-language-override|font-kerning|font-feature-settings|font-family|font|float|flex-wrap|flex-shrink|flex-grow|flex-flow|flex-direction|flex-basis|flex|filter|empty-cells|display|direction|cursor|counter-reset|counter-increment|content|column-width|column-span|column-rule-width|column-rule-style|column-rule-color|column-rule|column-gap|column-fill|column-count|columns|color|clip-path|clip|clear|caption-side|break-inside|break-before|break-after|box-sizing|box-shadow|box-decoration-break|bottom|border-width|border-top-width|border-top-style|border-top-right-radius|border-top-left-radius|border-top-color|border-top|border-style|border-spacing|border-right-width|border-right-style|border-right-color|border-right|border-radius|border-left-width|border-left-style|border-left-color|border-left|border-image-width|border-image-source|border-image-slice|border-image-repeat|border-image-outset|border-image|border-color|border-collapse|border-bottom-width|border-bottom-style|border-bottom-right-radius|border-bottom-left-radius|border-bottom-color|border-bottom|border|background-size|background-repeat|background-position|background-origin|background-image|background-color|background-clip|background-attachment|background-blend-mode|background|backface-visibility|auto|animation-timing-function|animation-play-state|animation-name|animation-iteration-count|animation-fill-mode|animation-duration|animation-direction|animation-delay|animation|align-self|align-items|align-content)\\b",i:"[^\\s]"},{cN:"value",b:"\\b(whitespace|wait|w-resize|visible|vertical-text|vertical-ideographic|uppercase|upper-roman|upper-alpha|underline|transparent|top|thin|thick|text|text-top|text-bottom|tb-rl|table-header-group|table-footer-group|sw-resize|super|strict|static|square|solid|small-caps|separate|se-resize|scroll|s-resize|rtl|row-resize|ridge|right|repeat|repeat-y|repeat-x|relative|progress|pointer|overline|outside|outset|oblique|nowrap|not-allowed|normal|none|nw-resize|no-repeat|no-drop|newspaper|ne-resize|n-resize|move|middle|medium|ltr|lr-tb|lowercase|lower-roman|lower-alpha|loose|list-item|line|line-through|line-edge|lighter|left|keep-all|justify|italic|inter-word|inter-ideograph|inside|inset|inline|inline-block|inherit|inactive|ideograph-space|ideograph-parenthesis|ideograph-numeric|ideograph-alpha|horizontal|hidden|help|hand|groove|fixed|ellipsis|e-resize|double|dotted|distribute|distribute-space|distribute-letter|distribute-all-lines|disc|disabled|default|decimal|dashed|crosshair|collapse|col-resize|circle|char|center|capitalize|break-word|break-all|bottom|both|bolder|bold|block|bidi-override|below|baseline|auto|always|all-scroll|absolute|table|table-cell)\\b"},{cN:"value",b:":",e:";",c:[r,i,o,e.CSSNM,e.QSM,e.ASM,{cN:"important",b:"!important"}]},{cN:"at_rule",b:"@",e:"[{;]",k:"mixin include extend for if else each while charset import debug media page content font-face namespace warn",c:[r,i,e.QSM,e.ASM,o,e.CSSNM,{cN:"preprocessor",b:"\\s[A-Za-z0-9_.-]+",r:0}]}]}});
\ No newline at end of file
diff --git a/dev/js/src/datepicker.js b/dev/js/src/datepicker.js
index 6d3086d..59a3ec2 100644
--- a/dev/js/src/datepicker.js
+++ b/dev/js/src/datepicker.js
@@ -35,6 +35,7 @@
 
     // Init datepicker
     _init : function () {
+      this._selected = [];
       return this;
     },
 
@@ -96,7 +97,7 @@
       // Show year
       this._showYear = year ? year :
 	(this._selected['year'] ? this._selected['year'] :
-	 today.getYear());
+	 today.getYear() + 1900);
 
       // Show month
       this._showMonth = month ? month :
diff --git a/dev/scss/base.scss b/dev/scss/base.scss
index dcc7250..13cec6f 100644
--- a/dev/scss/base.scss
+++ b/dev/scss/base.scss
@@ -1,7 +1,14 @@
 @charset "utf-8";
 @import "util";
 
-body, html, select, g > text {
+/**
+ * Basic global CSS rules for Kalamar
+ */
+
+body,
+html,
+select,
+g > text {
   color: $dark-grey;
   font-family: verdana, tahoma, arial;
   margin: 0;
@@ -27,17 +34,6 @@
 
 
 a {
-  &[href^="http://"]::after,
-  &[href^="https://"]::after {
-    font-family: FontAwesome;
-    content: " " + $fa-extlink;
-    font-size: 75%;
-  }
-  &.doc-link::after {
-    font-family: FontAwesome;
-    content: " " + $fa-tutorial;
-    font-size: 75%;
-  }
   &:link {
     color: $dark-orange;
     text-decoration: none;
@@ -46,20 +42,39 @@
       @include color-transition;
     }
   }
+
+  // Visited links
   &:visited {
     color: $darkest-orange;
   }
+
+  // External links
+  &[href^="http://"]::after,
+  &[href^="https://"]::after {
+    font-family: FontAwesome;
+    content: " " + $fa-extlink;
+    font-size: 75%;
+  }
+
+  // Link to documentation
+  &.doc-link::after {
+    font-family: FontAwesome;
+    content: " " + $fa-tutorial;
+    font-size: 75%;
+  }
 }
 
-// MailToChiffre
+// Styles for Mojolicious::Plugin::TagHelpers::MailToChiffre
 a[onclick$='return PArok(this,false)'] {
   direction:rtl;
   unicode-bidi:bidi-override;
-  text-align:left
+  text-align:left;
+  & > span {
+    &:nth-child(1n+2){
+      display:none
+    }
+    &:nth-child(1)::after{
+      content:'@'
+    }
+  }
 }
-a[onclick$='return PArok(this,false)']>span:nth-child(1n+2){
-  display:none
-}
-a[onclick$='return PArok(this,false)']>span:nth-child(1)::after{
-  content:'@'
-}
\ No newline at end of file
diff --git a/dev/scss/fonts.scss b/dev/scss/fonts.scss
index be46ba2..d0349a4 100644
--- a/dev/scss/fonts.scss
+++ b/dev/scss/fonts.scss
@@ -1,6 +1,10 @@
 @charset "utf-8";
 @import "util";
 
+/**
+ * Load web fonts for Kalamar
+ */
+
 @font-face {
   font-family: 'FontAwesome';
   src: url('#{$font-path}/fontawesome-webfont.eot?v=4.3.0');
diff --git a/dev/scss/footer/footer.scss b/dev/scss/footer/footer.scss
index 0ce1ae4..a8a5d02 100644
--- a/dev/scss/footer/footer.scss
+++ b/dev/scss/footer/footer.scss
@@ -1,6 +1,9 @@
 @charset "utf-8";
 @import "../util";
 
+/**
+ * Rules for the footer section of Kalamar
+ */
 footer {
   position: absolute;
   background-color: $dark-grey;
@@ -11,11 +14,12 @@
   a:link {
     margin: 0 .5em;
     color: $light-grey;
-    &:hover {
-      color: $nearly-white;
-    }
-    &:active, &:visited {
-      color: $dark-grey;
-    }
+  }
+  &:hover {
+    color: $nearly-white;
+  }
+  &:active,
+  &:visited {
+    color: $dark-grey;
   }
 }
diff --git a/dev/scss/header/datepicker.scss b/dev/scss/header/datepicker.scss
index 806ca1e..79640b6 100644
--- a/dev/scss/header/datepicker.scss
+++ b/dev/scss/header/datepicker.scss
@@ -1,15 +1,24 @@
 @charset "utf-8";
 @import "../util";
 
+/**
+ * Rules for the datepicker widget
+ * (used in the Virtual Collection creator)
+ * in Kalamar.
+ */
+
 $border-size: 2px;
 
 div.datepicker {
   display: inline-block;
   position: absolute;
   z-index: 8000;
+
   font-size: 80%;
   padding: 4pt;
+  @include choose-item;
   box-shadow: $choose-box-shadow;
+
   border: {
     width: $border-size;
     style: solid;
@@ -18,57 +27,58 @@
   > div {
     font-size: 120%;
     width: 45%;
-  }
-  > div.month {
-    float: right;
-  }
+    &.month {
+      float: right;
+    }
 
-  @include choose-item;
-  > div > span {
-    display: inline-block;
-    &:first-child,
-    &:last-child {
-      width: 15%;
-      &::before {
-	display: inline-block;
-	text-align: center;
-	cursor: pointer;
-	font-family: 'FontAwesome';
-	min-width: 14px;
-      }
-    }
-    &:first-child::before {
-      content: $fa-previous;
-    }
-    &:last-child::before {
-      content: $fa-next;
-    }
-    overflow: hidden;
-    white-space: nowrap;
-    &:nth-child(2) {
-      cursor: pointer;
+    > span {
       display: inline-block;
-      width: 70%;
-      text-align: center;
-      text-overflow: ellipsis;
-      border: {
-	radius: $standard-border-radius;
-	style: solid;
-	width: $border-size;
-	color: transparent;
+      &:first-child,
+      &:last-child {
+	width: 15%;
+	&::before {
+	  display: inline-block;
+	  text-align: center;
+	  cursor: pointer;
+	  font-family: 'FontAwesome';
+	  min-width: 14px;
+	}
       }
-      &:hover {
-	@include choose-hover;
+      &:first-child::before {
+	content: $fa-previous;
       }
-      &.selected {
-	@include choose-active;
+      &:last-child::before {
+	content: $fa-next;
+      }
+      overflow: hidden;
+      white-space: nowrap;
+      &:nth-child(2) {
+	cursor: pointer;
+	display: inline-block;
+	width: 70%;
+	text-align: center;
+	text-overflow: ellipsis;
+	border: {
+	  radius: $standard-border-radius;
+	  style: solid;
+	  width: $border-size;
+	  color: transparent;
+	}
+	&:hover {
+	  @include choose-hover;
+	}
+	&.selected {
+	  @include choose-active;
+	}
       }
     }
   }
+  
   table {
     border-collapse: separate;
     border-spacing: 1px;
   }
+
   td {
     @include standard-text-padding;
     text-align: center;
diff --git a/dev/scss/header/hint.scss b/dev/scss/header/hint.scss
index a373abc..7e15d18 100644
--- a/dev/scss/header/hint.scss
+++ b/dev/scss/header/hint.scss
@@ -1,6 +1,10 @@
 @charset "utf-8";
 @import "../util";
 
+/**
+ * Rules for the Kalamar hint helper.
+ */
+
 $border-size: 2px;
 
 ul.menu.hint {
diff --git a/dev/scss/kalamar.scss b/dev/scss/kalamar.scss
index ad7fc9d..18da240 100644
--- a/dev/scss/kalamar.scss
+++ b/dev/scss/kalamar.scss
@@ -1,5 +1,9 @@
 @charset "utf-8";
 
+/**
+ * Aggregate separated Sass files for Kalamar
+ */
+
 // Global variables and mixins
 @import "fonts";         // Font families
 @import "base";          // Base styles
diff --git a/dev/scss/media.scss b/dev/scss/media.scss
index 43122bc..f3b296c 100644
--- a/dev/scss/media.scss
+++ b/dev/scss/media.scss
@@ -1,25 +1,40 @@
 @charset "utf-8";
 @import "util";
 
+/**
+ * Media rules for different screen sizes.
+ * This will override some basic rules.
+ */
+
 $standard-margin: 4px;
 
 @media (orientation: portrait), (max-width: 42.5em) {
-  body, #search ol, header, header input {
+  body,
+  #search ol,
+  header,
+  header input,
+  div.resultinfo p.found,
+  #pagination > a {
     font-size: 9pt;
   }
+
   header form {
-    padding-left: 0px;
+    padding-left: 0;
     padding-top: 33px;
   }
+
   .vc {
     font-size: 9pt;
   }
+
   h1 {
     margin-left: 10px;
     width: 130px;
     height: 40px;
-    background-size: 100%;
-    background-position: 50% 0;
+    background: {
+      size: 100%;
+      position: 50% 0;
+    }
     z-index: 300;
   }
 
@@ -75,11 +90,6 @@
     }
   }
 
-  div.resultinfo p.found,
-  #pagination > a {
-    font-size: 9pt;
-  }
-
   #logos {
     margin-left: 0;
     margin-right: 0;
@@ -124,10 +134,4 @@
   main.tutorial {
     margin-right: 30px;
   }
-
-/*
-  pre.query {
-    font-size: 9.5pt;
-  }
-*/
 }
\ No newline at end of file
diff --git a/dev/scss/util.scss b/dev/scss/util.scss
index a349bd4..37afaf6 100644
--- a/dev/scss/util.scss
+++ b/dev/scss/util.scss
@@ -1,4 +1,9 @@
 /**
+ * Some variables and mixins for Kalamar,
+ * other Sass styles will use.
+ */
+
+/**
  * Official IDS colors
  */
 $ids-orange-1: rgb(246, 168,   0);
@@ -34,30 +39,32 @@
 /**
  * Blue Colors
  */
-$light-blue:     $ids-blue-2; // #cfe6f4;
-$dark-blue:      $ids-blue-1; // #73b2f4;
+$light-blue:     $ids-blue-2;
+$dark-blue:      $ids-blue-1;
 $darkest-blue:   darken($dark-blue, 40%);
 
-
 /**
  * Grey Colors
  */
 $middle-grey:  $ids-grey-1; // #999;
 $light-grey:   $ids-grey-2; // #ddd;
-// $dark-grey:    darken($light-grey, 55%); // #555;
-$dark-grey:    darken($middle-grey, 15%); // #555;
-// $nearly-white: #f5f5f5;
-$nearly-white: #fff;
+$dark-grey:    darken($middle-grey, 15%);
+$nearly-white: #fefefe;
 
+/**
+ * Red Colors (no IDS relation)
+ */
 $middle-red: #c1002b;
 $light-red: lighten($middle-red, 40%);
 $dark-red: darken($middle-red, 40%);
 
+
+/**
+ * Basic shadows
+ */
 $dark-shadow: 1px 1px 1px rgba(0,0,0,0.3);
 $light-shadow: 1px 1px rgba(255,255,255,0.5);
 
-$total-results: $light-green;
-
 /**
  * KWIC colors
  */
@@ -81,26 +88,35 @@
 $standard-border-radius: 6px;
 $item-padding: 3pt 6pt;
 
+$total-results: $light-green;
+
 /**
- * Path information
+ * Path information - relative to css!
  */
-$img-path: '../img';
+$img-path:  '../img';
 $font-path: '../font';
 
 /**
  * Margins
  */
 $standard-margin: 40px;
-$right-distance: 40px;
+$right-distance: $standard-margin;
 $right-match-distance: $standard-margin / 2;
 $logo-left-distance: 230px;
 
-
+/**
+ * Mixin for blind elements
+ * (e.g., spans in elements with an icon background)
+ */
 @mixin blind {
   position: absolute;
   margin-left: -3000px;
 }
 
+
+/**
+ * Chooseable items (default)
+ */
 @mixin choose-item {
   color: $choose-color;
   background-color: $choose-bg;
@@ -108,6 +124,9 @@
   text-shadow: $light-shadow;
 }
 
+/**
+ * Chooseable items (mouse over)
+ */
 @mixin choose-hover {
   color: $nearly-white;
   text-shadow: none;
@@ -115,6 +134,9 @@
   border-color: $darker-orange;
 }
 
+/**
+ * Chooseable items (not available)
+ */
 @mixin choose-inactive {
   color: lighten($choose-color, 20%);
   background-color: lighten($choose-bg, 20%);
@@ -122,6 +144,9 @@
   text-shadow: none;
 }
 
+/**
+ * Chooseable items (active)
+ */
 @mixin choose-active {
   color: $dark-green;
   text-shadow: none;
@@ -129,6 +154,9 @@
   border-color: $dark-green;
 }
 
+/**
+ * Chooseable items (action: remove something)
+ */
 @mixin choose-remove {
   color: $nearly-white;
   text-shadow: none;
@@ -136,25 +164,41 @@
   border-color: $dark-red;
 }
 
+/**
+ * Mixin for basic color transition
+ */
 @mixin color-transition {
   transition: color 0.3s ease 0s;
 }
 
+/**
+ * Mixing for basic text padding
+ */
 @mixin standard-text-padding {
   padding-left: .4em;
   padding-right: .4em;
 }
 
+
+/**
+ * Mixing for correct box sizing (probably not necessary)
+ */
 @mixin box-sizing-box() {
   -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
   -moz-box-sizing: border-box;    /* Firefox, other Gecko */
   box-sizing: border-box;         /* Opera/IE 8+ */
 }
 
+/**
+ * Noisy background (probably not necessary)
+ */
 @mixin light-noise {
   background-image:url('#{$img-path}/noise.png');
 }
 
+/**
+ * Mixin for no-appearance rules
+ */
 // https://css-tricks.com/almanac/properties/a/appearance/
 @mixin no-appearance {
   -webkit-appearance:none;
@@ -164,7 +208,7 @@
 
 
 /**
- * Font Awesome symbols
+ * Font Awesome symbol table
  */
 $fa-bars:        "\f0c9";
 $fa-extlink:     "\f08e";
@@ -176,12 +220,12 @@
 $fa-previous:    "\f0d9";
 $fa-next:        "\f0da";
 $fa-search:      "\f002";
-$fa-rewrite:     "\f040"; // "\f14b"
+$fa-rewrite:     "\f040";
 $fa-login:       "\f090";
 $fa-logout:      "\f08b";
 $fa-tutorial:    "\f19d";
 $fa-left-align:  "\f036";
 $fa-right-align: "\f038";
-$fa-question:    "\f128"; // "\f059";
+$fa-question:    "\f128";
 $fa-checked:     "\f046";
 $fa-check:       "\f096";
\ No newline at end of file