hi huma

index.html

@@ -104,6 +104,7 @@ <h4 class="info-title">State of the Game</h4>
     </main>
 
     <footer>
+        <img src="img/misc/huma.png" style="display: none;" id="hiddenhuma">
         <gu-footer></gu-footer>
     </footer>
 

js/homepage.js

@@ -104,4 +104,19 @@ function delayedLoop(delay) {
   }, delay)
 }
 
-delayedLoop(timeBetweenRotate);     
+delayedLoop(timeBetweenRotate);
+
+// Huma
+// ===============================================================================================================================
+
+const huma = document.getElementById("hiddenhuma")
+
+function hidehuma(){
+    let i = Math.round(Math.random() * 25)
+    console.log(i)
+    if (i == 1){
+        huma.style.display = "block"
+    }
+}
+
+hidehuma()

styles/main.css

@@ -293,4 +293,27 @@ Footer
 
 footer{
 	margin-top: 1.75rem;
+	position: relative;
+}
+
+#hiddenhuma{
+	position: absolute;
+	z-index: -1;
+	right: clamp(5%, 3vw, 0px);
+	top: -50%;
+	width: 150px;
+}
+
+@media only screen and (width < 1700px){
+
+	#hiddenhuma{
+		right: 0px;
+	}
+}
+
+@media only screen and (width < 1500px){
+
+	#hiddenhuma{
+		right: -150px;
+	}
 }