diff --git a/assets/leaflet.groupedlayercontrol.css b/assets/leaflet.groupedlayercontrol.css
index df179ab..b6e8977 100644
--- a/assets/leaflet.groupedlayercontrol.css
+++ b/assets/leaflet.groupedlayercontrol.css
@@ -1,7 +1,6 @@
 .leaflet-control-layers-group-name {
   font-weight: bold;
-  margin-bottom: .2em;
-  display: block;
+  margin-bottom: .4em;
 }
 
 .leaflet-control-layers-group {
diff --git a/data/timeline.js b/data/timeline.js
index 368e912..f7df0ed 100644
--- a/data/timeline.js
+++ b/data/timeline.js
@@ -55,6 +55,7 @@ $(document).ready(function() {
   $('#animate-control').on('click', this, function () {
     if (playing === false) {
       $("#icon-target").attr("src","images/pause.png");
+      map.closePopup();
       window.animate = setInterval(function() {
         incrementYear(1);
         year = getYear();
diff --git a/style.css b/style.css
index db3bfdb..1ee6216 100644
--- a/style.css
+++ b/style.css
@@ -84,3 +84,27 @@ html,body {
   max-height: 30px;
   max-width: 30px;
 }
+
+.leaflet-control-layers-group .ui-widget {
+	font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
+  font-weight: bold;
+}
+
+.leaflet-control-layers-group .ui-state-default {
+  background: #EFEFEF;
+}
+
+.leaflet-control-layers-group .ui-state-hover {
+  background: #DADADA;
+}
+
+.leaflet-control-layers-group .ui-corner-all {
+  border-bottom-left-radius: 0px;
+  border-bottom-right-radius: 0px;
+  border-top-left-radius: 0px;
+  border-top-right-radius: 0px;
+}
+
+.ui-button-text-only .ui-button-text {
+  padding: 0.4em 0.75em;
+}
\ No newline at end of file