diff --git a/website/artist.html b/website/artist.html
index b97911a..82f3449 100644
--- a/website/artist.html
+++ b/website/artist.html
@@ -4,7 +4,8 @@
 	<head>
 		<meta charset="UTF-8" />
 		<title>Maloja - KEY_ARTISTNAME</title>
-		<script src="javascript/rangeselect.js" async></script>
+		<script src="javascript/cookies.js"></script>
+		<script src="javascript/rangeselect.js"></script>
 	</head>
 
 	<body>
@@ -35,10 +36,10 @@
 					<h2><a href='/pulse?artist=KEY_ENC_ARTISTNAME&step=year&trail=1'>Pulse</a></h2>
 
 
-					<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
-		      			| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
-		      			| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
-		      			| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
+					<span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
+		      			| <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
+		      			| <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
+		      			| <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
 
 		      			<br/><br/>
 
@@ -50,10 +51,10 @@
 				<td>
 					<!-- We use the same classes / function calls here because we want it to switch together with pulse -->
 					<h2><a href='/performance?artist=KEY_ENC_CREDITEDARTISTNAME&step=year&trail=1'>Performance</a></h2>
-					<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
-		      			| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
-		      			| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
-		      			| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
+					<span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
+		      			| <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
+		      			| <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
+		      			| <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
 
 		      			<br/><br/>
 
diff --git a/website/javascript/cookies.js b/website/javascript/cookies.js
index 6d92425..7ccfee0 100644
--- a/website/javascript/cookies.js
+++ b/website/javascript/cookies.js
@@ -1,27 +1,57 @@
 apikeycorrect = false;
 
-function insertAPIKeyFromCookie() {
-	cookies = decodeURIComponent(document.cookie).split(';');
-	for(var i = 0; i <cookies.length; i++) {
-		cookies[i] = cookies[i].trim()
-		if (cookies[i].startsWith("apikey=")) {
-			document.getElementById("apikey").value = cookies[i].replace("apikey=","")
-			checkAPIkey()
-		}
+var cookies = {};
+
+function getCookies() {
+	cookiestrings = decodeURIComponent(document.cookie).split(';');
+	for(var i = 0; i <cookiestrings.length; i++) {
+		cookiestrings[i] = cookiestrings[i].trim();
+		[key,value] = cookiestrings[i].split("=");
+		cookies[key] = value;
+	}
+}
+
+// always on document load, but call specifically when needed early
+document.addEventListener("load",getCookies);
+
+function setCookie(key,val) {
+	cookies[key] = val;
+	document.cookie = encodeURIComponent(key) + "=" + encodeURIComponent(val);
+}
+function saveCookies() {
+	for (var c in cookies) {
+		document.cookie = encodeURIComponent(c) + "=" + encodeURIComponent(cookies[c]);
 	}
 }
 
 
+
+/// RANGE SELECTORS
+
+// in rangeselect.js
+
+
+/// API KEY
+
+
+
+function insertAPIKeyFromCookie() {
+	getCookies();
+	key = cookies["apikey"];
+	document.getElementById("apikey").value = key;
+	checkAPIkey()
+}
+
 function saveAPIkey() {
-	key = document.getElementById("apikey").value
-	document.cookie = "apikey=" + encodeURIComponent(key)
+	key = APIkey()
+	setCookie("apikey",key)
 }
 
 
 
 function checkAPIkey() {
-	saveAPIkey()
-	url = "/api/test?key=" + document.getElementById("apikey").value
+
+	url = "/api/test?key=" + APIkey()
 	var xhttp = new XMLHttpRequest();
 	xhttp.onreadystatechange = function() {
 		if (this.readyState == 4 && (this.status == 204 || this.status == 205)) {
@@ -41,6 +71,9 @@ function checkAPIkey() {
 		document.getElementById("apikey").style.backgroundColor = "red"
 		apikeycorrect = false
 	}
+	if (apikeycorrect) {
+		saveAPIkey();
+	}
 }
 
 function APIkey() {
diff --git a/website/javascript/rangeselect.js b/website/javascript/rangeselect.js
index da9c2c5..4ea4eed 100644
--- a/website/javascript/rangeselect.js
+++ b/website/javascript/rangeselect.js
@@ -25,4 +25,21 @@ function showRange(identifier,unit) {
 	for (var i=0;i<reactivate.length;i++) {
 		reactivate[i].setAttribute("style","opacity:0.5;")
 	}
+
 }
+
+function showRangeManual(identifier,unit) {
+	showRange(identifier,unit);
+	setCookie("rangeselect_" + identifier,unit);
+}
+
+
+
+document.addEventListener('DOMContentLoaded',function() {
+	getCookies();
+	for (c in cookies) {
+		if (c.startsWith("rangeselect_")) {
+			showRange(c.slice(12),cookies[c]);
+		}
+	}
+})
diff --git a/website/media/record_gold.png b/website/media/record_gold.png
index 631b31a..c620560 100644
Binary files a/website/media/record_gold.png and b/website/media/record_gold.png differ
diff --git a/website/media/record_gold_original.png b/website/media/record_gold_original.png
new file mode 100644
index 0000000..631b31a
Binary files /dev/null and b/website/media/record_gold_original.png differ
diff --git a/website/start.html b/website/start.html
index 81c91dd..43ec20c 100644
--- a/website/start.html
+++ b/website/start.html
@@ -4,10 +4,12 @@
 	<head>
 		<meta charset="UTF-8" />
 		<title>Maloja</title>
-		<script src="javascript/rangeselect.js"></script>
+
 		<script>document.addEventListener('DOMContentLoaded',function() {
 			KEY_JS_INIT_RANGES
 		})</script>
+		<script src="javascript/cookies.js"></script>
+		<script src="javascript/rangeselect.js"></script>
 	</head>
 
 
@@ -23,10 +25,10 @@
 
 
 
-		<span onclick="showRange('topartists','week')" class="stat_selector_topartists selector_topartists_week">This Week</span>
-      			| <span onclick="showRange('topartists','month')" class="stat_selector_topartists selector_topartists_month">This Month</span>
-      			| <span onclick="showRange('topartists','year')" class="stat_selector_topartists selector_topartists_year">This Year</span>
-      			| <span onclick="showRange('topartists','alltime')" class="stat_selector_topartists selector_topartists_alltime" style="opacity:0.5;">All Time</span>
+		<span onclick="showRangeManual('topartists','week')" class="stat_selector_topartists selector_topartists_week">This Week</span>
+      			| <span onclick="showRangeManual('topartists','month')" class="stat_selector_topartists selector_topartists_month">This Month</span>
+      			| <span onclick="showRangeManual('topartists','year')" class="stat_selector_topartists selector_topartists_year">This Year</span>
+      			| <span onclick="showRangeManual('topartists','alltime')" class="stat_selector_topartists selector_topartists_alltime" style="opacity:0.5;">All Time</span>
 
 		<br/><br/>
 
@@ -42,9 +44,9 @@
 
 
 		<span onclick="showRange('toptracks','week')" class="stat_selector_toptracks selector_toptracks_week">This Week</span>
-      			| <span onclick="showRange('toptracks','month')" class="stat_selector_toptracks selector_toptracks_month">This Month</span>
-      			| <span onclick="showRange('toptracks','year')" class="stat_selector_toptracks selector_toptracks_year">This Year</span>
-      			| <span onclick="showRange('toptracks','alltime')" class="stat_selector_toptracks selector_toptracks_alltime" style="opacity:0.5;">All Time</span>
+      			| <span onclick="showRangeManual('toptracks','month')" class="stat_selector_toptracks selector_toptracks_month">This Month</span>
+      			| <span onclick="showRangeManual('toptracks','year')" class="stat_selector_toptracks selector_toptracks_year">This Year</span>
+      			| <span onclick="showRangeManual('toptracks','alltime')" class="stat_selector_toptracks selector_toptracks_alltime" style="opacity:0.5;">All Time</span>
 
 		<br/><br/>
 
@@ -81,10 +83,10 @@
       			<a href="/pulse?step=year&trail=1">Years</a>
       			-->
 
-      			<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
-      			| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
-      			| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
-      			| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
+      			<span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
+      			| <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
+      			| <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
+      			| <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
       			<!--
       			### this is for extra views of the current canonical week / month / year
       			<br/>
diff --git a/website/track.html b/website/track.html
index c657a06..16d2f94 100644
--- a/website/track.html
+++ b/website/track.html
@@ -4,7 +4,8 @@
 	<head>
 		<meta charset="UTF-8" />
 		<title>Maloja - KEY_TRACKTITLE</title>
-		<script src="javascript/rangeselect.js" async></script>
+		<script src="javascript/cookies.js" ></script>
+		<script src="javascript/rangeselect.js"></script>
 	</head>
 
 	<body>
@@ -30,10 +31,10 @@
 			<tr>
 				<td>
 					<h2><a href='/pulse?KEY_SCROBBLELINK&step=year&trail=1'>Pulse</a></h2>
-					<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
-		      			| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
-		      			| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
-		      			| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
+					<span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
+		      			| <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
+		      			| <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
+		      			| <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
 
 		      			<br/><br/>
 
@@ -44,10 +45,10 @@
 				</td>
 				<td>
 					<h2><a href='/performance?KEY_SCROBBLELINK&step=year&trail=1'>Performance</a></h2>
-					<span onclick="showRange('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
-		      			| <span onclick="showRange('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
-		      			| <span onclick="showRange('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
-		      			| <span onclick="showRange('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
+					<span onclick="showRangeManual('pulse','days')" class="stat_selector_pulse selector_pulse_days">7 days</span>
+		      			| <span onclick="showRangeManual('pulse','weeks')" class="stat_selector_pulse selector_pulse_weeks">12 weeks</span>
+		      			| <span onclick="showRangeManual('pulse','months')" class="stat_selector_pulse selector_pulse_months" style="opacity:0.5;">12 months</span>
+		      			| <span onclick="showRangeManual('pulse','years')" class="stat_selector_pulse selector_pulse_years">10 years</span>
 
 		      			<br/><br/>
 
