diff --git a/index.html b/index.html
new file mode 100644
index 0000000..f67742d
--- /dev/null
+++ b/index.html
@@ -0,0 +1,23 @@
+
+
+
+
+
+ Ramses Coffee - Now with NaN more coffee flavor!
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..11bb62e
--- /dev/null
+++ b/script.js
@@ -0,0 +1,49 @@
+ document.addEventListener(
+ "DOMContentLoaded",
+ function() {
+ const randomNeocat = document
+ .querySelector(".neocat");
+ const images = [
+ "neocat_floof_happy_2048.png",
+ "neocat_floof_owo_2048.png"
+ ];
+
+ randomNeocat.addEventListener(
+ "mouseover",
+ function() {
+ const randomIndex = Math
+ .floor(Math.random() *
+ images.length);
+ const randomImage =
+ images[randomIndex];
+
+ randomNeocat.src =
+ randomImage;
+ });
+
+ randomNeocat.addEventListener(
+ "mouseout",
+ function() {
+ randomNeocat.src =
+ "neocat_floof_mug_2048.png";
+ });
+ });
+
+ var icons = [
+ "neocat_floof_happy_2048.png",
+ "neocat_floof_owo_2048.png"
+ ];
+ var currentIndex = 0;
+
+ function changeFavicon() {
+ var favicon = document
+ .querySelector(
+ "link[rel*='icon']");
+ favicon.href = icons[
+ currentIndex];
+
+ currentIndex = (currentIndex +
+ 1) % icons.length;
+ }
+
+ setInterval(changeFavicon, 2000);
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..66686f0
--- /dev/null
+++ b/style.css
@@ -0,0 +1,83 @@
+:root {
+ --gradient-start: #FCAE4E;
+ --gradient-end: #FFC95C;
+ --neocat-scale: 0.2;
+ --footer-height: 100px;
+ --color-text-default: #000000;
+ --color-footer: #3d3d3d;
+}
+
+body {
+ margin: 0;
+ padding: 0;
+ font-family: monospace, sans-serif;
+ background: linear-gradient(to bottom, var(--gradient-start), var(--gradient-end));
+ background-size: 200% 200%;
+ animation: gradientAnimation 5s ease-in-out infinite;
+ color: var(--color-text-default);
+}
+
+@media (prefers-color-scheme: dark) {
+ body {
+ background: linear-gradient(to bottom, var(--gradient-end), var(--gradient-start));
+ color: #FFFFFF;
+ }
+}
+
+@keyframes gradientAnimation {
+ 0%, 100% {
+ background-position: 0% 0%;
+ }
+ 50% {
+ background-position: 100% 100%;
+ }
+}
+
+.container {
+ width: 100%;
+ min-height: 100vh;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ position: relative;
+ overflow: hidden;
+}
+
+.neocat {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%) scale(var(--neocat-scale));
+ animation: float 3s ease-in-out infinite;
+}
+
+@keyframes float {
+ 0%, 100% {
+ transform: translate(-50%, -50%) scale(var(--neocat-scale)) rotate(0deg);
+ }
+ 50% {
+ transform: translate(-50%, calc(-50% - 5%)) scale(var(--neocat-scale)) rotate(-5deg);
+ }
+}
+
+a {
+ color: var(--color-text-default);
+ text-decoration: none;
+ transition: color 0.3s;
+}
+
+a:hover,
+a:focus {
+ color: #FFC95C;
+}
+
+footer {
+ color: var(--color-footer);
+ position: absolute;
+ left: 0;
+ text-align: center;
+ bottom: 0;
+ height: var(--footer-height);
+ width: 100%;
+ overflow: hidden;
+}
\ No newline at end of file
+
+