diff --git a/index.html b/index.html
index c3431d65..dfcf39c1 100644
--- a/index.html
+++ b/index.html
@@ -23,7 +23,7 @@
     #initial {fill: none; stroke: black; pointer-events: none;}
     #init-rose {animation: 20s infinite spin; opacity: .7; transform-origin: center;}
     @keyframes spin {0% {transform: rotate(0deg);} 100% {transform: rotate(359deg);}}
-    #loading {opacity:1; color:#fff5da; text-align:center; text-shadow:0px 1px 4px #4c3a35; width:80%; max-width:600px; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); pointer-events:none;}
+    #loading {opacity:1; font-size: 11px; color:#fff5da; text-align:center; text-shadow:0px 1px 4px #4c3a35; width:80%; max-width:600px; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); pointer-events:none;}
     #loading-text {font-size: 1.8em; margin: 0.2em 0 0 1em;}
     #title_name {text-align: left;font-size: 3em;margin-left: 5%;}
     #title {font-size: 7em;margin: -12px 0 -6px 0;}
diff --git a/main.js b/main.js
index 8e0be171..41f43a1f 100644
--- a/main.js
+++ b/main.js
@@ -123,10 +123,10 @@ oceanPattern.append("rect").attr("fill", "url(#oceanic)").attr("x", 0).attr("y",
 oceanLayers.append("rect").attr("id", "oceanBase").attr("x", 0).attr("y", 0).attr("width", graphWidth).attr("height", graphHeight);
 
 void function removeLoading() {
-  d3.select("#loading").transition().duration(5000).style("opacity", 0).remove();
-  d3.select("#initial").transition().duration(5000).attr("opacity", 0).remove();
+  d3.select("#loading").transition().duration(4000).style("opacity", 0).remove();
+  d3.select("#initial").transition().duration(4000).attr("opacity", 0).remove();
   d3.select("#optionsContainer").transition().duration(3000).style("opacity", 1);
-  d3.select("#tooltip").transition().duration(3000).style("opacity", 1);
+  d3.select("#tooltip").transition().duration(4000).style("opacity", 1);
 }()
 
 // decide which map should be loaded or generated on page load