login animations

React/src/app/styles.css

@@ -1,17 +1,29 @@
-
+/* styles.css */
 @keyframes fadeIn {
-    0% {
-      opacity: 0;
-    }
-    100% {
-      opacity: 1;
-    }
+  from {
+    opacity: 0;
   }
-  
-  .animate-fadeIn {
-    animation: fadeIn 1s ease-in-out;
+  to {
+    opacity: 1;
   }
-  
+}
+
+.animate-fadeIn {
+  animation: fadeIn 1s ease-in-out forwards;
+}
+
+.delay-0 {
+  animation-delay: 0s;
+}
+
+.delay-1 {
+  animation-delay: 1s;
+}
+
+.delay-2 {
+  animation-delay: 2s;
+}
+
 
   body {
     font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", sans-serif;