More Ginny stylesheet

resources/public/content/stylesheet.css

@@ -24,6 +24,16 @@
  ## html elements generally in alphabetic order
  */
 
+a {
+  color: darkgray;
+  font-weight: bold;
+}
+
+a:hover {
+  color: darkgray;
+  background:rgba(200,200,200,0.8);
+}
+
 body {
   margin: 0;
   padding: 0;
@@ -52,14 +62,15 @@ dd {
 
 /* footer of the page - not-editable, provided by Smeagol */
 footer {
-  border-top: thin solid gray;
+  border-top: thin solid silver;
+  color: gray;
+  background:rgba(200,200,200,0.8);
   clear: both;
   font-size: smaller;
   text-align: center;
-  color: gray;
-  background: rgba(224,224,224,0.95);
   width: 100%;
   margin: 0;
+  min-height: 4px;
   padding: 0.25em 0;
   bottom:0;
   position:fixed;
@@ -71,9 +82,14 @@ footer {
 }
 
 footer div {
+  display: none;
   padding: 0.1em;
 }
 
+footer:hover div {
+  display: block;
+}
+
 form {
   border: thin solid silver;
 }
@@ -83,8 +99,6 @@ header {
   margin-top: 0;
   width:100%;
   max-width: 100%;
-  background-color: gray;
-  color: white;
 }
 
 header h1 {
@@ -93,7 +107,6 @@ header h1 {
 
 header a {
   font-weight: bold;
-  color: white;
 }
 
 header a:hover {
@@ -131,12 +144,12 @@ ins {
 label {
   width: 20%;
   min-width: 20em;
-  border-right: thin solid gray;
+  border-right: thin solid silver;
   display: inline-block;
 }
 
 table {
-  border: 2px solid black;
+  border: thin solid silver;
   border-collapse: collapse;
 }
 
@@ -148,7 +161,7 @@ th, td {
 	text-align: left;
   vertical-align: top;
 	padding: 0.15em 1.5em;
-  border: 1px solid gray;
+  border: 1px solid silver;
 }
 
 th {
@@ -166,6 +179,7 @@ th {
 
 /* left bar for all pages in the Wiki - editable, provided by users. Within main-container */
 #side-bar {
+  display: none;
   width: 17%;
   height: 100%;
   float: left;
@@ -173,10 +187,10 @@ th {
 
 /* cookies information box, fixed, in right margin, just above footer */
 #cookies {
-	width: 30%;
+	width: 20%;
 	float: right;
   position: fixed;
-  bottom: 3.5em;
+  bottom: 8px;
   right: 0;
 	z-index: 175;
   background: transparent;
@@ -190,8 +204,8 @@ th {
   text-align: right;
   padding: 0.25em 2em;
   border-radius: 0.25em;
-	color: white;
+	color: gray;
-  background:rgba(40,40,40,0.8);
+  background:rgba(200,200,200,0.8);
 }
 
 /* more-about-cookies box, normally hidden */
@@ -199,9 +213,9 @@ th {
   display: none;
 	padding: 0.5em 2em;
   border-radius: 0.5em;
-	color: white;
+	color: gray;
-  background:rgba(40,40,40,0.8);
+  background:rgba(200,200,200,0.8);
-	border-bottom: thin solid white;
+	border-bottom: thin solid gray;
 }
 
 /* but magically appears on mouseover */
@@ -242,8 +256,8 @@ th {
   right: 0;
   padding: 0.25em 2em;
   border-radius: 0.25em;
-  color: white;
+	color: gray;
-  background:rgba(40,40,40,0.8);
+  background:rgba(200,200,200,0.8);
   font-size: 66%;
 }
 
@@ -254,7 +268,11 @@ th {
 .minor-controls a {
   float: right;
   padding: 0.25em 2em;
-  color: white;
+  color: gray;
+}
+
+.minor-controls a:hover {
+  color: darkgray;
 }
 
 .pseudo-input {
@@ -303,8 +321,7 @@ th {
   /* content of the current page in the Wiki - editable, provided by users. Within main-container */
   #content {
     border: thin solid silver;
-    width: 80%;
+    width: 100%;
-    float: right;
     padding-bottom: 5em;
   }
 
@@ -312,16 +329,29 @@ th {
     display: none;
   }
 
+  #header {
+    font-size: smaller;
+  }
+
   /* top-of-page navigation, not editable, provided by Smeagol */
   #nav{
     margin: 0;
     padding: 0;
     top: 0;
-    width: 100%;
+    min-height: 4px;
     _position: absolute;
     _top: expression(document.documentElement.scrollTop);
     z-index: 149;
-    background:rgba(40,40,40,0.8);
+    color: gray;
+    background:rgba(200,200,200,0.8);
+ }
+
+  #nav #nav-menu {
+    display: none;
+  }
+
+  #nav:hover #nav-menu {
+    display: block;
   }
 
   /* only needed for fly-out menu effect on tablet and phone stylesheets */
@@ -341,14 +371,14 @@ th {
   }
 
   #nav menu li a {
-    color: white;
+    color: gray;
     text-decoration: none;
     font-weight: bold;
     padding: 0.1em 0.75em;
     margin: 0;
   }
 
-  #nav menu li.active a { background: gray;}
+  #nav menu li.active a { background: gray; color: white;}
   li.nav-item a:hover { background: rgb( 240, 240, 240) }
   li.nav-item a:active { background: gray; color: white; }
 
@@ -379,17 +409,15 @@ th {
     padding: 0;
     position: fixed;
     z-index: 149;
-    color: silver;
+    color: black;
-    background:rgba(40,40,40,0.9);
+    background:rgba(200,200,200,0.9);
   }
 
   #nav a {
-    color: white;
-    text-decoration: none;
     font-weight: bold;
   }
 
-  #nav:hover #nav-menu {
+  #nav:hover #nav-menu, #nav:hover #phone-side-bar {
     display: block;
     list-style-type: none;
     width: 100%;
@@ -455,18 +483,21 @@ th {
     display: none;
   }
 
+  #header {
+    display: none;
+  }
+
   #nav{
     margin: 0;
     padding: 0;
     position: fixed;
     z-index: 149;
-    color: silver;
+    color: black;
-    background:rgba(40,40,40,0.9);
+    background:rgba(200,200,200,0.9);
   }
 
   #nav a {
-    color: white;
+    color: black;
-    text-decoration: none;
     font-weight: bold;
   }
 
@@ -491,6 +522,8 @@ th {
   }
 
   #nav menu li a {
+    color: black;
+    font-weight: bold;
   }
 
   #nav ul li.active a { background: silver;}