diff --git a/src/data/Web_Visually.css b/src/data/Web_Visually.css
index 9273cfa78..acf7976ff 100644
--- a/src/data/Web_Visually.css
+++ b/src/data/Web_Visually.css
@@ -202,6 +202,7 @@ span.preposition {
     color:#FFF;
     margin:0;
     padding:.5em 0 0 20px;
+    font-style:italic;
 }
 p#user_header {
     font-size:1.3em;
@@ -224,8 +225,8 @@ p#user_header {
     height:32px;
     margin:0;
     padding:0 0 0 9px;
-    background-color:#6AF364;
-    border-bottom:solid 2px #453619;
+    background-color:#228A22;
+    border-bottom:solid 2px #D8F3D6;
 }
 #navigation ul li, #subnavigation ul li {
     margin:0;
@@ -235,10 +236,10 @@ p#user_header {
     display:block;
     float:left;
     font:normal 16px/100% serif;
-    color:#542;
+    color:#FFF;
     text-decoration:none;
     margin:0;
-    padding:8px 13px;
+    padding:5px 5px;
 
 }
 #navigation ul li a:hover, #subnavigation ul li a:hover {
@@ -247,7 +248,7 @@ p#user_header {
 }
 #navigation ul li#CurrentSection a, #subnavigation ul li#CurrentSection a {
     font-weight:bold;
-    font-size:19px;
+    font-size:16px;
     margin-top:-6px;
     padding-top:11px;
     padding-bottom:8px;
@@ -255,6 +256,7 @@ p#user_header {
     border-left:solid 1px #453619;
     border-bottom:solid 1px #000;
     background-color:#FFF;
+    color:#000;
 }
 #navigation ul li#CurrentSection a:hover {
     background-color:#FFF;
@@ -506,7 +508,7 @@ table.individuallist tbody tr td.ColumnName a:hover {
     border:solid 1px #453619;
 }
 #GalleryNav a:hover {
-    background-color:#D8F3D6;
+    background-color:#C1B398;
 }
 #GalleryNav a#Previous {
     padding:.5em .7em .3em .7em;
@@ -878,25 +880,6 @@ div#pedigree {
     padding:0;
     background:none;
 }
-#treeContainer div.boxbg span.unlinked {
-    position:absolute;
-    margin:0;
-    padding:0;
-    height:40px;
-    width:174px;
-    border:1px solid #000;
-    text-align:center;
-}
-#treeContainer div.male span.unlinked {
-    background:url(../images/Web_Gender_Male.png) #BCEAF6 no-repeat top right;
-}
-#treeContainer div.female span.unlinked {
-    background:url(../images/Web_Gender_Female.png) #FFC0CB no-repeat top right;
-}
-#treeContainer div.unknown span.unlinked {
-    background-color:#000;
-    color:#FFF;
-}
 #treeContainer div.boxbg a {
     position:relative;
     z-index:10;
@@ -957,6 +940,15 @@ div#pedigree {
 #treeContainer div.boxbg a:hover span.thumbnail {
     display:block;
 }
+#treeContainer div.boxbg span.unlinked {
+    position:absolute;
+    margin:0;
+    padding:0;
+    height:40px;
+    width:174px;
+    border:1px solid #000;
+    text-align:center;
+}
 #TreeContainer div.male, 
 #treeContainer div.male a {
     background:url(../images/Web_Gender_Male.png) #BCEAF6 no-repeat top right;
@@ -970,6 +962,16 @@ div#pedigree {
     background-color:#000;
     color:#FAFAFA;
 }
+#treeContainer div.male span.unlinked {
+    background:url(../images/Web_Gender_Male.png) #BCEAF6 no-repeat top right;
+}
+#treeContainer div.female span.unlinked {
+    background:url(../images/Web_Gender_Female.png) #FFC0CB no-repeat top right;
+}
+#treeContainer div.unknown span.unlinked {
+    background-color:#000;
+    color:#FFF;
+}
 .shadow {
     display:none;
 }
diff --git a/src/plugins/webreport/WebCal.py b/src/plugins/webreport/WebCal.py
index 36d8949ba..5811d4509 100644
--- a/src/plugins/webreport/WebCal.py
+++ b/src/plugins/webreport/WebCal.py
@@ -426,12 +426,19 @@ class WebCalReport(Report):
         num_years = (self.end_year - self.start_year)
         cal_year = self.start_year
 
-        nrows = (num_years / 16)
-        for rows in range(0, (nrows + 1)):
+        # stylesheets other than "Web_Visually.css" will hold 22 years in a row
+        # otherwise, 18 years in a row 
+        _stylesheet = 'Web_Visually.css'  
+        years_in_row = 22 if self.css is not _stylesheet else 18
+
+        # simple mathematics was not working, so I did it for python
+        nrows = get_num_of_rows(num_years, years_in_row)
+
+        for rows in range(0, nrows):
             of.write('<div id="navigation">\n')
             of.write('\t<ul>\n')
-            cols = 0
-            while (cols <= 15 and cal_year <= self.end_year):
+            cols = 1
+            while (cols <= years_in_row and cal_year <= self.end_year):
                 url = ''
 
                 # begin subdir level
@@ -1572,6 +1579,30 @@ def _has_webpage_extension(url):
             return True
     return False
 
+def get_num_of_rows(num_years, years_in_row):
+    """
+    This will return the number of weeks to be display in
+    display_year_navs()
+    """
+    if num_years > years_in_row:
+        rows = 1
+        num_years -= years_in_row
+    elif 1 <= num_years <= years_in_row:
+        return 1
+    if num_years > years_in_row:
+        rows += 1
+        num_years -= years_in_row
+    elif 1 <= num_years <= years_in_row:
+        rows += 1
+        return rows
+    if num_years > years_in_row:
+        rows += 1
+        num_years -= years_in_row
+    elif 1 <= num_years <= years_in_row:
+        rows += 1
+        return rows
+    return rows
+
 #-------------------------------------------------------------------------
 #
 #    Register Plugin