diff --git a/assets/custom-functions.js b/assets/custom-functions.js
index dcf03049c309b84833c0820b5a600af9e13e0368..7b327fb4601766d555e04ec0560544f3f6730886 100644
--- a/assets/custom-functions.js
+++ b/assets/custom-functions.js
@@ -101,3 +101,27 @@ $(document).ready(function () {
                 });
 });
 
+// Add logos for the animated gifs
+$(document).ready(function () {
+	$(document).on('click', "#slider-graph", function () {
+		const logos = document.getElementById('logos');
+		if(!logos) {
+			var img = new Image();
+			img.src = './assets/images/logoline.png';
+			img.style.position = 'absolute';
+			img.style.width = '40rem';
+			img.style.height = '5rem';
+			img.style.top = '0';
+			img.style.left = '23rem';
+			img.style.zIndex = '999';
+			img.setAttribute('id','logos');
+			img.style.display = 'none';
+
+			// Get the element to overlay the image on
+			var div = document.querySelectorAll('.leaflet-map-pane')[0];
+
+			// Append the image to the element
+			div.appendChild(img);
+		}
+	});
+});
diff --git a/assets/download-img.js b/assets/download-img.js
index 0094ffd63fcc483e2429a1e5b4a36425b13eb38f..fa7e0b3769b3351bae44dda5b2ab6d9f6d33aa98 100644
--- a/assets/download-img.js
+++ b/assets/download-img.js
@@ -1,5 +1,7 @@
 $(document).ready(function () {
     $(document).on('click', "#btn-frame-download", function () {
+		//first add the logos
+		addLogos();
         var element = document.getElementById("graph-collection"); // global variable
         if (element == null) {
            element = document.getElementById("prob-graph"); // global variable
@@ -8,6 +10,7 @@ $(document).ready(function () {
            }
         }
         getCanvas(element);
+		removeLogos();
     });
 });
 
@@ -50,3 +53,35 @@ function saveAs(uri, filename) {
     window.open(uri);
   }
 }
+
+//Add logos top map for screen shot
+function addLogos() {
+	const logos = document.getElementById('logos');
+	if (logos){
+		logos.style.display = 'inline';
+	} else {
+		var img = new Image();
+		img.src = './assets/images/logoline.png';
+		img.style.position = 'fixed';
+		img.style.maxWidth = '35%';
+		img.style.width = 'auto';
+		img.style.maxHeight = '10%';
+		img.style.height = 'auto';
+		img.style.top = '6';
+		img.style.marginTop = '7px';
+		img.style.right = '1%';
+		img.style.zIndex = '999';
+		img.setAttribute('id','logos');
+
+		// Get the element to overlay the image on
+		var div = document.querySelectorAll('.leaflet-map-pane')[0];
+
+		// Append the image to the element
+		div.appendChild(img);
+	};
+}
+
+function removeLogos() {
+	var logos = document.getElementById('logos');
+	logos.remove();
+};
diff --git a/assets/images/logoline.png b/assets/images/logoline.png
new file mode 100644
index 0000000000000000000000000000000000000000..5f54046533da0968ba4402c955b6fe2d0f8ed05a
Binary files /dev/null and b/assets/images/logoline.png differ
diff --git a/js/create_model_loop.js b/js/create_model_loop.js
index 18dd5363a60973b2f51a769ffacb289389c0165e..c70102a39b39e52d56d31e607c6895a0cec2332e 100644
--- a/js/create_model_loop.js
+++ b/js/create_model_loop.js
@@ -167,7 +167,11 @@ const RunCluster = async (anim, curmodel, seldate, variable) => {
       }
       }, '.leaflet-bar');
 
-      //await page.waitForSelector(".graph-with-slider");
+	  //reveal logos 
+      process.stdout.write("REVEALING LOGOS" + "\n");
+	  let logos = await page.$('#logos');
+	  await logos.evaluate((el) => el.style.display = 'inline');
+
       const outputFile = './tmp/' + variable.toLowerCase() + '/' + seldate + '_' + curmodel + '_' + num + '.png';
       process.stdout.write("TAKE SCREENSHOT => " + outputFile + "\n");
       await graph.screenshot({ path: outputFile });