diff --git a/.gitignore b/.gitignore
index 00a5148..7da3ca9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,6 @@
 *.png
 *.mp3
 *.jpg
-*.gif
\ No newline at end of file
+*.gif
+*.webm
+*.webp
\ No newline at end of file
diff --git a/index.html b/index.html
index e848992..228f865 100644
--- a/index.html
+++ b/index.html
@@ -8,8 +8,17 @@
   <link rel="stylesheet" href="styles.css">
 </head>
 <body>
-  <a href="home/">
-    <img src="./static/site/logo.png" class="logo">
-  </a>
+  <div id="main">
+    <div class="logo">
+      <a href="home/">
+        <img src="./static/site/logo.png" id="melon">
+      </a>
+    </div>
+    <div id="text">
+        <img src="ai_laptop_crying.png.webp">
+        <h1>Um... e-excuse me... T-this website... uses music a lot, so... um... please remember to turn autoplay on!</h1>
+    </div>
+  </div>
+  
 </body>
 </html>
diff --git a/styles.css b/styles.css
index 2748ed1..3af4464 100644
--- a/styles.css
+++ b/styles.css
@@ -1,21 +1,48 @@
 body, html {
-    height: 100%;
-    margin: 0;
-    overflow: hidden; /* Prevents scrollbar from appearing */
-  }
-  
+  height: 100%;
+  margin: 0;
+  overflow: hidden; 
+}
+#main{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+}
+
 body {
-display: flex;
-justify-content: center;
-align-items: center;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  }
+
+.logo img {
+  transition: transform 0.5s ease-in-out;
 }
 
-.logo {
-max-width: 100%;
-height: auto;
-transition: transform 0.3s, scale 0.3s;
+#text {
+  opacity: 0;
+  transition: opacity 0.5s ease-in-out;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 50vw;
 }
 
-.logo:hover {
-transform: scale(1.5) rotate(360deg); /* Rotates the logo 360 degrees */
+#main:hover .logo img {
+  transform: scale(1.5) rotate(360deg); /* Adjust the scale factor as needed */
+}
+
+#main:hover #text {
+  opacity: 1;
+}
+
+
+
+body, html{
+  font-family: CustomFont, sans-serif; /* Use the custom font as the fallback */
+}
+@font-face {
+  font-family: CustomFont;
+  src: url('static/fonts/c1-kenangan.regular.otf') format('truetype'); /* Change 'your-font.ttf' to the actual font file name */
 }
\ No newline at end of file
