diff --git a/public/scss/pagination.scss b/public/scss/pagination.scss
index c0cfdd1..0e099ac 100644
--- a/public/scss/pagination.scss
+++ b/public/scss/pagination.scss
@@ -1,5 +1,7 @@
 @charset "utf-8";
-@import "colors";
+@import "util";
+
+$border-size : 2px;
 
 /**
  * The pagination view
@@ -8,11 +10,11 @@
 <div id="pagination">
   <a rel="prev"><span><i class="fa fa-caret-left"></i></span></a>
   <a rel="self"><span>1</span></a>
-  <a href="/?ql=poliqarp&amp;q=test&amp;action=ok&amp;p=2"><span>2</span></a>
-  <a href="/?ql=poliqarp&amp;q=test&amp;action=ok&amp;p=3"><span>3</span></a>
+  <a href="#p=2"><span>2</span></a>
+  <a href="#3"><span>3</span></a>
   <span><i class="fa fa-ellipsis-h"></i></span>
-  <a href="/?ql=poliqarp&amp;q=test&amp;action=ok&amp;p=67"><span>67</span></a>
-  <a rel="next" href="/?ql=poliqarp&amp;q=test&amp;action=ok&amp;p=2"><span><i class="fa fa-caret-right"></i></span></a>
+  <a href="#67"><span>67</span></a>
+  <a rel="next" href="#2"><span><i class="fa fa-caret-right"></i></span></a>
 </div>
 */
 #pagination {
@@ -21,65 +23,92 @@
    * This may need to be overwritten in case multiple
    * paginations have to be activated.
    */
+  font-size: 0;
   position: fixed;
   right: 20px;
-
   bottom: 10px;
   z-index: 400;
+  padding: 0;
+  height: auto;
+  line-height: 0;
 
-  span {
-    display: inline-block;
-    background-color: $pagination-bg;
-    height: 1.5em;
-    line-height: 1.5em;
-    @include standard-text-padding;
-    text-align: center;
-    border: {
-      top-width: 2px;
-      top-style: solid;
-      bottom-width:  2px;
-      bottom-style: solid;
-      color: $pagination-border;
-    }
-    box-shadow: $pagination-box-shadow;
-  }
-  a {
-    text-shadow: $light-shadow;
-    &[rel=self] span {
+  > a {
+    margin: 0;
+    font-size: 10pt;
+    padding: 0;
+
+    > span {
+      box-shadow: $choose-box-shadow;
+      @include standard-text-padding;
+      @include choose-item;
+      display: inline-block;
+      line-height: 2em;
+      text-align: center;
       border: {
-	color: $dark-orange;
+	top-width: $border-size;
+	bottom-width:  $border-size;
+	top-style: solid;
+	bottom-style: solid;
+      }
+    }
+
+    &:not(:link):not([rel=self]) span {
+      color: $choose-blind-color;
+    }
+
+    &.ellipsis > span {
+      > span {
+	@include blind;
+      }
+      &::after {
+	font-family: 'FontAwesome';
+	content: '\f141';
+      }
+    }
+
+    &[rel=self] > span {
+      @include choose-active;
+      border {
+	left-width: $border-size;
+	right-width: $border-size;
 	left-style: solid;
 	right-style: solid;
-	left-width: 2px;
-	right-width: 2px;
-      }
-      background-color: $light-orange;
-      color: $darkest-orange;
-    }
-    &[rel=next] span {
-      border: {
-	right-width: 2px;
-	right-style: solid;
-	top-right-radius: 12px;
-	bottom-right-radius: 12px;
       }
     }
-    &[rel=prev] span {
+
+    &[rel=prev] > span {
       border: {
-	left-width: 2px;
+	top-left-radius: $standard-border-radius;
+	bottom-left-radius: $standard-border-radius;
+	left-width: $border-size;
 	left-style: solid;
-	top-left-radius: 12px;
-	bottom-left-radius: 12px;
-      }      
-    }
-    &[href] {
-      color: $light-green;
-      span:hover {
-        background-color: $light-green;
-        border-color: $dark-green;
-        color: $dark-green;
-        text-shadow: none;
       }
+      > span {
+	@include blind;
+      }
+      &::after {
+	font-family: 'FontAwesome';
+	content: '\f0d9';
+      }
+    }
+
+    &[rel=next] > span {
+      border: {
+	top-right-radius: $standard-border-radius;
+	bottom-right-radius: $standard-border-radius;
+	right-width: $border-size;
+	right-style: solid;
+      }
+      > span {
+	@include blind;
+      }
+      &::after {
+	font-family: 'FontAwesome';
+	content: '\f0da';
+      }
+    }
+    &:link:hover span {
+      @include choose-hover;
     }
   }
-}
+}
\ No newline at end of file