diff --git a/src/app/auth/login/page.tsx b/src/app/auth/login/page.tsx
index d6af802..54ef1ab 100644
--- a/src/app/auth/login/page.tsx
+++ b/src/app/auth/login/page.tsx
@@ -3,10 +3,10 @@ import { authOptions } from "@/authOptions";
 import { signIn } from "next-auth/react";
 
 const LoginPage = () => {
-	const providers = authOptions.providers;
+	const provider = authOptions.providers[0];
 
 	return (
-		<div className="flex flex-col h-screen items-center justify-center bg-gradient-to-br from-green-700 to-green-950 bg-[length:200%_200%] animate-gradient-x">
+		<div className="flex flex-col h-screen items-center justify-center bg-gradient-to-br from-green-700 to-green-950 bg-[length:200%_200%] animate-gradient-x text-white">
 			<div className="flex flex-col justify-center items-center w-1/2 gap-6 bg-black bg-opacity-40 p-4 rounded-md">
 				<div className="flex items-center w-full gap-5">
 					<div className="border-t border-white flex-grow"></div>
@@ -26,16 +26,14 @@ const LoginPage = () => {
 
 				<h3 className="font-bold text-xl">Via</h3>
 				<ul>
-					{providers.map((provider) => (
-						<li key={provider.id}>
-							<button
-								className="bg-white text-black p-2 rounded-md"
-								onClick={() => signIn(provider.id)}
-							>
-								{provider.name}
-							</button>
-						</li>
-					))}
+					<li key={provider.id}>
+						<button
+							className="bg-white text-black p-2 rounded-md"
+							onClick={() => signIn(provider.id)}
+						>
+							{provider.name}
+						</button>
+					</li>
 				</ul>
 			</div>
 		</div>
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 8b0e731..a466eed 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -8,7 +8,7 @@ export default function RootLayout({
 }) {
 	return (
 		<html lang="en">
-			<body className="text-white">
+			<body>
 				<SessionProviderWrapper>{children}</SessionProviderWrapper>
 			</body>
 		</html>
