make melon wiggle

home/index.html

@@ -12,7 +12,7 @@
     <div id="main">
     <div id="title">
         <div>
-            <img src="../static/site/logo.png">
+            <img src="../static/site/logo.png" id="melon">
         </div>
         <div>
             <h1>Pick something?</h1>

home/styles.css

@@ -54,3 +54,16 @@ p{
 #image-container {
     transition: opacity 0.5s ease; /* Fade transition */
 }
+
+
+@keyframes wiggle {
+    0% { transform: rotate(0deg); }
+    25% { transform: rotate(10deg); }
+    50% { transform: rotate(-10deg); }
+    75% { transform: rotate(10deg); }
+    100% { transform: rotate(0deg); }
+  }
+  
+#melon {
+animation: wiggle 2s ease infinite; /* Adjust duration and timing function for desired effect */
+}