CSS style sheet: @import url('https://fonts.googleapis.com/css?family=Padauk'); .color-box { width: 100%; height: 333px; background-image: url(https://happy-everything.com/Custom/Files/2020/03/5e73c8ff8d286.jpg); position: relative; margin: 0; padding: 0; } .color-box-countdown { /* Center in box */ position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); margin: 8; padding: 8; text-align: center; /* Font style */ color: white; font-size: 50px; line-height: 50px; font-weight: 600; font-family: 'Padauk', sans-serif; font-style: thin; } HTML:

JAVA SCRIPT: // Set the date we're counting down to var countDownDate = new Date("March 21, 2020 00:00:00").getTime(); // Update the count down every 1 second var x = setInterval(function() { // Get todays date and time var now = new Date().getTime(); // Find the distance between now and the count down date var distance = countDownDate - now; // Time calculations for days, hours, minutes and seconds var days = Math.floor(distance / (1000 * 60 * 60 * 24)); var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((distance % (1000 * 60)) / 1000); // Display the result in the element with id="demo" document.getElementById("demo").innerHTML = days + " days " + hours + " hours " + minutes + " minutes " + seconds + " seconds "; // If the count down is finished, write some text if (distance < 0) { clearInterval(x); document.getElementById("demo").innerHTML = "EXPIRED"; } }, 1000);