From 7bb937b6d5825d408792f40d8471d619c806a56b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yann=20M=C3=B6lle?= <hxcde@noreply.localhost>
Date: Mon, 29 May 2023 15:06:02 +0200
Subject: [PATCH] =?UTF-8?q?=E2=80=9Ecss/back.css=E2=80=9C=20hinzuf=C3=BCge?=
 =?UTF-8?q?n?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/back.css | 42 ++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 42 insertions(+)
 create mode 100644 css/back.css

diff --git a/css/back.css b/css/back.css
new file mode 100644
index 0000000..c5e5476
--- /dev/null
+++ b/css/back.css
@@ -0,0 +1,42 @@
+@keyframes rotate {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+.gradient {
+  --size: 250px;
+  --speed: 50s;
+  --easing: cubic-bezier(0.8, 0.2, 0.2, 0.8);
+
+  width: var(--size);
+  height: var(--size);
+  filter: blur(calc(var(--size) / 5));
+  background-image: linear-gradient(hsl(158, 82, 57, 85%), hsl(252, 82, 57));
+  animation: rotate var(--speed) var(--easing) alternate infinite;
+  border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@media (min-width: 720px) {
+  .gradient {
+    --size: 500px;
+  }
+}
+
+body {
+  background-color: #222;
+  position: absolute;
+  inset: 0;
+  display: flex;
+  place-content: center;
+  align-items: center;
+  overflow: hidden;
+}
+
+/* This is just to transition when you change the viewport size. */
+* {
+  transition: all 0.25s ease-out;
+}
\ No newline at end of file