2 files changed, 27 insertions, 13 deletions
diff --git a/share/templates/default/header.tmpl b/share/templates/default/header.tmpl
index f228f31..010d3d5 100644
--- a/share/templates/default/header.tmpl
+++ b/share/templates/default/header.tmpl
@@ -5,6 +5,7 @@ cat <<END
     <style type="text/css">
         body {
             background-color: #000000;
+            color: #ffffff;
             background-image: url('${backhref}/${blurs_dir}/${background_image}');
             background-size: cover;
             background-repeat: no-repeat;
@@ -13,15 +14,28 @@ cat <<END
         }
 
         a {
-            color: #000000;
+            color: #ffffff;
         }
 
-        div.text, div.header, div.footer, div.navigator {
-            background-color: #ffffff;
-            border: 15px solid #000000;
-            padding: 10px;
-            margin-top: 10px;
-            margin-bottom: 10px;
+        a.arrow {
+            text-decoration: none;
+            font-weight: bolder;
+        }
+
+        div.header {
+            background-color: #000000;
+            border: 3px solid #ffffff;
+            padding: 3px;
+            margin-top: 2px;
+            margin-bottom: 2px;
+        }
+
+        div.footer, div.navigator {
+            background-color: #000000;
+            border: 3px solid #ffffff;
+            padding: 3px;
+            max-width: 400px;
+            margin: 2 auto;
         }
 
         img {
diff --git a/share/templates/default/view.tmpl b/share/templates/default/view.tmpl
index 29b1a38..fc9e267 100644
--- a/share/templates/default/view.tmpl
+++ b/share/templates/default/view.tmpl
@@ -1,14 +1,14 @@
 cat <<END
-<div class="text">
-    <a href="${num}-$((i-1)).html">&lArr;</a>
-    <a href="page-${num}.html#$photo">Thumbnails</a>
-    <a href="${num}-$((i+1)).html">&rArr;</a>
-</div>
-
 <div class='view'>
     <a href="${num}-$((i+1)).html">
         <img class='view ${animation_class}' border='0' src='${backhref}/${photos_dir}/${photo}' />
     </a>
+    <div class="navigator">
+        <a href="${num}-$((i-1)).html" class="arrow">&lArr;</a>
+        <a href="page-${num}.html#$photo">Thumbnails</a> |
+        <a href ='${backhref}/${photos_dir}/${photo}'>Direct link</a>
+        <a href="${num}-$((i+1)).html" class="arrow">&rArr;</a>
+    </div>
 </div>
 END