diff --git a/app/blogpost/layout.tsx b/app/blogpost/layout.tsx
index cf89c29..a9bb4ac 100644
--- a/app/blogpost/layout.tsx
+++ b/app/blogpost/layout.tsx
@@ -9,7 +9,7 @@ import MainFooter from "@/components/footer/main";
 
 export default function RootLayout({ children }: { children: React.ReactNode }) {
   return (
-    <div className="m-auto text-base 2xl:w-3xl xl:w-3xl md:w-full">
+    <div className="m-auto text-base 2xl:w-4xl xl:w-3xl md:w-full">
       {children}
     </div>
   );
diff --git a/app/globals.css b/app/globals.css
index b48c6f8..6417721 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -15,7 +15,7 @@
 body {
   color: var(--foreground);
   background: var(--background);
-  font-family: "JetBrains Mono", monospace;
+  font-family: "Open Sans", sans-serif;
 }
 
 .dark {
diff --git a/app/layout.tsx b/app/layout.tsx
index 71dfdca..8ea897e 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -32,7 +32,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
   return (
     <html className="dark" lang="en">
       <body className={`bg-black text-white dark:bg-white dark:text-black font-sans`}>
-        <div className="text-xl 2xl:mx-72 xl:mx-36 md:mx-6">
+        <div className="text-xl 2xl:mx-80 xl:mx-36 md:mx-6">
           <MainHeader />
           {children}
           <MainFooter />
