added more design using tailwind classes

frontend/src/Layout/Layout.tsx

@@ -8,7 +8,7 @@ type LayoutProps = {
 
 const Layout: React.FC<LayoutProps> = ({ children }) => {
   return (
-    <div className="min-h-screen bg-gradient-to-br from-blue-100 to-blue-300 flex flex-col">
+    <div className="min-h-screen bg-gradient-to-br from-blue-100 via-blue-200 to-blue-400 flex flex-col">
       <Header />
       <ToastContainer
         position="top-right"
@@ -22,7 +22,9 @@ const Layout: React.FC<LayoutProps> = ({ children }) => {
         pauseOnHover
         theme="dark"
       />
-      <main className="flex-1 container mx-auto px-4 py-8">{children}</main>
+      <main className="flex-1 container mx-auto px-4 py-8 flex flex-col items-center justify-center">
+        {children}
+      </main>
     </div>
   );
 };