2 files changed, 88 insertions, 36 deletions

diff --git a/site/assets/css/css.css b/site/assets/css/css.css
index 7a1d881a..e21b46ea 100644
--- a/site/assets/css/css.css
+++ b/site/assets/css/css.css
@@ -72,23 +72,25 @@ header .site_name {
   line-height: 11px;
   letter-spacing: 3px;
 }
-header .splash{
+header .page_name {
   font-size: 22px;
   font-weight: 400;
   color: #eee;
-  /*padding-left: 8px;*/
   opacity: 0;
   transition: 0.3s opacity cubic-bezier(0,0,1,1);
   margin-left:18px;
-  /*line-height: 22px;*/
 }
-.scrolled header .splash {
+.scrolled header .page_name {
   opacity: 1;
 }
-header .links{
+header .links {
   font-size: 18px;
   line-height: 18px;
 }
+.home header .links a {
+  background-color: rgba(0,0,0,0.9);
+  padding: 3px;
+}
 header .sub {
   margin-left: 4px;
   margin-top: 2px;
@@ -123,18 +125,18 @@ header .links a {
 }
 header .links a.active {
   color: #fff;
-  border-bottom: 2px solid rgba(255,255,255,255);
+  border-bottom: 2px solid rgba(255,255,255,1);
 }
 .desktop header .links a:hover {
   color: #fff;
-  border-bottom: 2px solid rgba(255,255,255,255);
+  border-bottom: 2px solid rgba(255,255,255,1);
 }
 .desktop header .links a.active:hover {
   color: #fff;
-  border-bottom: 2px solid rgba(255,255,255,255);
+  border-bottom: 2px solid rgba(255,255,255,1);
 }
-header .links.splash{
-  font-size:22px;
+header .links.splash {
+  font-size: 22px;
   font-weight: 400;
 }
 
@@ -165,39 +167,32 @@ footer > div:nth-child(2) {
 footer a {
   display: inline-block;
   color: #ccc;
-  transition: color 0.1s cubic-bezier(0,0,1,1);
-  border-bottom:1px solid #555;
+  transition: all 0.1s cubic-bezier(0,0,1,1);
+  border-bottom: 1px solid #555;
   padding-bottom: 1px;
   text-decoration: none;
 }
-
-footer a:hover{
-  color: #ccc;
+.desktop footer a:hover {
+  color: #fff;
   border-bottom:1px solid #999;
 }
-footer ul{
-  margin:0;
+footer ul {
+  margin: 0;
 }
-footer ul li{
-  color: #bbb;
-  margin: 0 5px 0 0;
+footer div {
+  color: #888;
   font-size: 12px;
-  display: inline-block;
-}
-footer ul li:last-child{
-  margin-right:0px;
 }
-footer ul.footer-left{
-  float:left;
-  margin-left:40px;
+footer ul li:last-child {
+  margin-right: 0px;
 }
-footer ul.footer-right{
-  float:right;
-  margin-right:40px;
+footer div:first-child > a {
+  margin-right: 5px;
 }
 .desktop footer a:hover {
-  color: #ddd;
+  color: #fff;
 }
+
 /* headings */
 
 h1 {
@@ -273,6 +268,36 @@ th, .gray {
   font-size: 9pt;
 }
 
+/* splash teaser */
+
+.teaser {
+  position: absolute;
+  top: 50%;
+  left: 25%;
+  transform: translateY(-50%);
+}
+.teaser b {
+  font-family: 'Roboto', sans-serif;
+  font-weight: 500;
+  color: #fff;
+  font-size: 40px;
+  display: block;
+}
+.teaser tt {
+  font-family: 'Roboto Mono', monospace;
+  color: #ddd;
+  font-size: 16px;
+  display: block;
+  max-width: 400px;
+}
+.teaser .btn {
+  color: #ddd;
+  background: #444;
+  padding: 5px 10px;
+  font-size: 20px;
+  border-radius: 4px;
+}
+
 /* content */
 
 .content {
@@ -874,6 +899,9 @@ section.fullwidth .image {
 .desktop .dataset-list .sort-options li:hover {
   background: #888;
 }
+.desktop .dataset-list .sort-options li.active:hover {
+  background: #fff;
+}
 .dataset_list .applet {
   margin-bottom: 15px;
 }
@@ -967,13 +995,17 @@ page-specific formatting
 
 ul.map-legend{
   display: inline-block;
-  margin:0;
-  font-size:14px;
+  margin: 0;
+  font-size: 14px;
 }
-ul.map-legend li{
+ul.map-legend li {
   margin-right: 10px;
-  padding-top:4px;
+  padding-top: 4px;
   display: inline-block;
+  cursor: pointer;
+}
+.desktop ul.map-legend li:hover {
+  text-decoration: underline;
 }
 ul.map-legend li:before {
   content: '';
@@ -982,6 +1014,10 @@ ul.map-legend li:before {
   height: 10px;
   margin-right: 6px;
 }
+ul.map-legend li.active {
+  text-decoration: underline;
+  color: #fff;
+}
 ul.map-legend li.edu:before {
   background-color: #f2f293;
 }
diff --git a/site/assets/css/mobile.css b/site/assets/css/mobile.css
index 6a742277..d6ded8d6 100644
--- a/site/assets/css/mobile.css
+++ b/site/assets/css/mobile.css
@@ -1,7 +1,17 @@
 /* MOBILE - iphone/ipad css */
 
+softbr {
+  display: none;
+}
+
 @media all and (max-device-width: 1024px) {
+  softbr {
+    display: block;
+    height: 10px;
+  }
+
   /* header / footer */
+
   .slogan {
     padding-left: 10px;
   }
@@ -59,7 +69,13 @@
     height: 360px;
   }
 
-  /* MOBILE datasets page */
+
+  .content td a {
+    text-overflow: ellipsis;
+    max-width: 100%;
+    overflow: hidden;
+    display: inline-block;
+  }
 }
 
 /* iphone-specific */