diff --git a/dev/demo/all.html b/dev/demo/all.html
index 7e585ee..1ce6fa3 100644
--- a/dev/demo/all.html
+++ b/dev/demo/all.html
@@ -231,7 +231,7 @@
         <div class="match-wrap">
 	        <div class="snippet startMore endMore">
 	          <div class="flag"></div>
-            <span class="context-left">HDTV Samples from European (and other) broadcasters and </span><span class="match">test</span><span class="context-right"> transmissions in Europe</span></div>
+                                  <span class="context-left">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span><span class="match"><span class="inline-marker" data-key="who" data-value="Mai Thi Nguyen-Kim"></span><span class="inline-marker" data-key="start" data-value="0:00"></span><span class="inline-marker" data-key="end" data-value="01:20"></span>Hey</span><span class="context-right">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span><!--<span class="context-left">HDTV Samples from European (and other) broadcasters and </span><span class="match">test</span><span class="context-right"> transmissions in Europe</span></div>-->
 	      <div class="tokenInfo"></div>
 	      </div>
       </div>
diff --git a/dev/demo/kwic.html b/dev/demo/kwic.html
index b5ff455..de34742 100644
--- a/dev/demo/kwic.html
+++ b/dev/demo/kwic.html
@@ -14,7 +14,7 @@
             <div class="match-wrap">
               <div class="snippet">
                 <div class="flag"></div>
-                <span class="context-left">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span><span class="match">Hey</span><span class="context-right">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span>
+                <span class="context-left">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span><span class="match"><span class="inline-marker" data-key="who" data-value="Mai Thi Nguyen-Kim"></span><span class="inline-marker" data-key="start" data-value="0:00"></span><span class="inline-marker" data-key="end" data-value="01:20"></span>Hey</span><span class="context-right">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span>
               </div>
             </div>
             <p class="ref"><strong>Wertparameter</strong> by Hubi,Zwobot,4; published on 2005-03-28 as WWW.03313 (WPD)</p>
@@ -27,7 +27,7 @@
             <div class="match-wrap">
               <div class="snippet">
                 <div class="flag"></div>
-                <span class="context-left">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span><span class="match"><mark>Hey</mark></span><span class="context-right">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span>
+                <span class="context-left">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span><span class="match"><span class="inline-marker" data-key="who" data-value="Mai Thi Nguyen-Kim"></span><span class="inline-marker" data-key="start" data-value="0:00"></span><span class="inline-marker" data-key="end" data-value="01:20"></span>Hey</span><span class="context-right">Der Fehler unterläuft häufig bei der direkten Übersetzung aus dem Englischen, wenn im originalen Ausdruck die beiden Wortteile verschiedene Wörter sind und sich das Adjektiv wahlweise auf das erste oder zweite Wort bezieht. Ein Beispiel ist multiples Testproblem für multiple test problem.</span>
               </div>
             </div>
             <p class="ref"><strong>Wertparameter</strong> by Hubi,Zwobot,4; published on 2005-03-28 as WWW.03313 (WPD)</p>
diff --git a/dev/scss/main/kwic.scss b/dev/scss/main/kwic.scss
index 9fd0fe9..0c41068 100644
--- a/dev/scss/main/kwic.scss
+++ b/dev/scss/main/kwic.scss
@@ -162,7 +162,7 @@
       right: 4pt;
     }
   }
-
+  
   &.startMore:before,
   &.endMore:after {
     content:       "…";
@@ -221,10 +221,41 @@
       display: inline !important;
     }
 
-	  > * {
-	    background-color: transparent;
-	  }
+    > * {
+      background-color: transparent;
+    }
 
+    span.inline-marker {
+      font-weight: normal;
+      color: $dark-grey;
+      &::before, &::after {
+        display: inline-block !important;
+        border-width: 2px;
+        border-radius: 0;
+        margin: 0 3pt;
+        padding:  0 4pt;
+      }
+      &::before {
+        color: white;
+        margin-right: 0;
+        border-top-left-radius: 5px;
+        border-bottom-left-radius: 5px;
+        border-width-right: 0;
+        background-color: $dark-orange  !important;
+        content: attr(data-key) ': ';
+      }
+
+      &::after {
+        border-width-left: 0;
+        margin-left: 0;
+        padding-left: 0;
+        border-top-right-radius: 5px;
+        border-bottom-right-radius: 5px;
+        background-color: $dark-orange  !important;
+        content: attr(data-value);
+      }
+    }
+          
     div.flag {
       display: none;
     }