diff --git a/src/data/Web_Visually.css b/src/data/Web_Visually.css
index 6c465a870..ec75406b7 100644
--- a/src/data/Web_Visually.css
+++ b/src/data/Web_Visually.css
@@ -273,15 +273,20 @@ table.infolist tr th {
     margin:0;
     padding:.2em 10px;
     background-color:#6AF364;
-    border-bottom:solid 1px #453619;
+    border-bottom:solid 1px #000;
+}
+table.infolist tr th a {
+    color:#000;
 }
 table.infolist tr th a:hover {
     background-color:#C1B398;
+    color:#000;
 }
 table.infolist tr td {
     font:normal 1.1em/1.4em serif;
     vertical-align:middle;
     padding:.1em 10px;
+    background-color:#D8F3D6;
 }
 table.infolist tr td a {
     display:block;
@@ -454,6 +459,7 @@ table.individuallist tbody tr td.ColumnName a:hover {
 #Sources table.infolist tbody tr td.ColumnName a {
     font-size:.9em;
     padding:.1em 10px .3em 10px;
+    background-color:#FFF;
 }
 #Sources table.infolist tbody tr td.ColumnName a:hover {
     background-color:#C1B398;
@@ -470,6 +476,7 @@ table.individuallist tbody tr td.ColumnName a:hover {
 }
 #Places table.infolist tbody tr td.ColumnName a {
     padding:.1em 10px .3em 10px;
+    background-color:#FFF;
 }
 #Places table.infolist tbody tr td.ColumnName a:hover {
     background-color:#C1B398;
@@ -486,6 +493,7 @@ table.individuallist tbody tr td.ColumnName a:hover {
 }
 #Gallery table.infolist tbody tr td.ColumnName a {
     padding:.1em 10px .3em 10px;
+    background-color:#FFF;
 }
 #Gallery table.infolist tbody tr td.ColumnName a:hover {
     background-color:#C1B398;
@@ -1086,13 +1094,9 @@ body#WebCal {
     background-color:#6AF364;
     border:solid 2px #453619;
 }
-.calendar thead tr th.saturday, 
-.calendar thead tr th.sunday { }
 .calendar tfoot tr td {
     padding:.7em 5% 1em 5%;
-    border-top:solid 4px #6AF364;
-}
-.calendar tfoot tr td {
+    border-top:solid 2px #000;
     vertical-align:middle;
     color:#453619;
     background-color:#D8F3D6;
@@ -1206,3 +1210,9 @@ body#fullyearlinked table.calendar thead tr th.monthName {
 body#fullyearlinked table.calendar tbody tr td {
     height:3em;
 }
+body#fullyearlinked table.calendar tbody tr td.saturday {
+    border-right:solid 2px #000;
+}
+body#fullyearlinked able.calendar tbody tr td.sunday {
+    border:solid 2px #000;
+}
diff --git a/src/plugins/webreport/NarrativeWeb.py b/src/plugins/webreport/NarrativeWeb.py
index b891019e1..d16ce610b 100644
--- a/src/plugins/webreport/NarrativeWeb.py
+++ b/src/plugins/webreport/NarrativeWeb.py
@@ -1482,18 +1482,21 @@ class SurnameListPage(BasePage):
         if order_by == self.ORDER_BY_NAME:
             of = self.report.create_file(filename)
             self.write_header(of, _('Surnames'))
-            self.alphabet_navigation(of, db, person_handle_list, _PERSON) 
         else:
             of = self.report.create_file("surnames_count")
             self.write_header(of, _('Surnames by person count'))
 
         of.write('<div id="Surnames" class="content">\n')
 
-        of.write('\t<p id="description">%s</p>\n' % _(
-            'This page contains an index of all the '
+        msg = _( 'This page contains an index of all the '
             'surnames in the database. Selecting a link '
             'will lead to a list of individuals in the '
-            'database with this same surname.'))
+            'database with this same surname.')
+        of.write('\t<p id="description">%s</p>\n' % msg)
+
+        # add alphabet navigation after page msg
+        if order_by == self.ORDER_BY_NAME:
+            self.alphabet_navigation(of, db, person_handle_list, _PERSON) 
 
         if order_by == self.ORDER_BY_COUNT:
             of.write('\t<table id="SortByCount" class="infolist surnamelist">\n')