hacksu · matteomessmer · Oct 8, 2020
diff --git a/countdown.html b/countdown.html
@@ -0,0 +1,50 @@
+<!doctype html>
+
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+
+  <title>The HTML5 Herald</title>
+  <meta name="description" content="The HTML5 Herald">
+  <meta name="author" content="SitePoint">
+<link href="https://fonts.googleapis.com/css2?family=Special+Elite&display=swap" rel="stylesheet">
+
+  <link rel="stylesheet" href="css/styles.css?v=1.0">
+
+</head>
+
+<body>
+<div id="halloween"></div>
+
+<script>
+// Set the date we're counting down to
+var countDownDate = new Date("Oct 31, 2020 00:00:00").getTime();
+
+// Update the count down every 1 second
+var x = setInterval(function() {
+
+  // Get today's 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("halloween").innerHTML = days + (days==1?" day":" days ") + "</br>" + hours + (hours==1?" hour":" hours ")
+  + "</br>" + minutes + (minutes==1?" minute":" minutes ") + "</br>" + seconds + (seconds==1?" second":" seconds");
+
+  // If the count down is finished, write some text
+  if (distance < 0) {
+    clearInterval(x);
+    document.getElementById("halloween").innerHTML = '<image src="https://officialpsds.com/imageview/7y/3l/7y3llp_large.png?1590397937"/>';
+  }
+}, 1000);
+</script>
+</body>
+</html>
diff --git a/css/styles.css b/css/styles.css
@@ -0,0 +1,23 @@
+body {
+
+  background: url('https://i.pinimg.com/originals/fb/87/77/fb8777dca71c1ce1763b72335f2b1a32.jpg') no-repeat center center fixed;
+
+  -webkit-background-size: cover;
+  -moz-background-size: cover;
+  -o-background-size: cover;
+  background-size: cover;
+}
+#halloween {
+
+    position: absolute;
+    margin: auto;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    width: fit-content;
+    font-size: 5em;
+    height: fit-content;
+	color:#dc0909;
+	font-family: 'Special Elite', cursive;
+}