diff --git a/README.md b/README.md
index dbf544c..ced53cc 100644
--- a/README.md
+++ b/README.md
@@ -37,3 +37,10 @@ The admin panel has been provided by `Payload CMS`, you can access it by visitin
 ```
 http://localhost:3000/admin
 ```
+
+Credential:
+
+```
+e-mail: rankrunners@gmail.com
+pw: Iloveskyrim99
+```
diff --git a/env b/env
index d7eb772..8bf5180 100644
--- a/env
+++ b/env
@@ -4,12 +4,12 @@ SERVICE_SUPABASEANON_KEY=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJzdXBhYm
 
 SUPABASE_URL=https://supabasekong-n00g8kwoos4skc0gw44k8sks.dev3vds1.link
 
-<!-- Payload -->
+# payload
 
-DATABASE_URI=your-connection-string-here
-PAYLOAD_SECRET=YOUR_SECRET_HERE
-S3_BUCKET=YOUR_BUCKET
-S3_ACCESS_KEY_ID=YOUR_ACCESS_KEY
-S3_SECRET_ACCESS_KEY=YOUR_SECRET
-S3_REGION=YOUR_REGION
-S3_ENDPOINT=YOUR_ENDPOINT
+DATABASE_URI=postgresql://postgres.jswmbraeandqttpcdfmj:qDY4C35XaRsmW6dW@aws-0-ap-southeast-1.pooler.supabase.com:5432/postgres
+PAYLOAD_SECRET=1b7204f9ed5f7ab09706fc51
+S3_BUCKET=cochise-bucket
+S3_ACCESS_KEY_ID=97394cd503ae9973efa25168ed980e51
+S3_SECRET_ACCESS_KEY=9b4e412850582aab32ffdadbe23bb7ea972b39aaf79c34da0c19d3fcafe11dd0
+S3_REGION=ap-southeast-1
+S3_ENDPOINT=https://jswmbraeandqttpcdfmj.supabase.co/storage/v1/s3
diff --git a/src/app/(main)/blog/[slug]/page.tsx b/src/app/(main)/blog/[slug]/page.tsx
index 10745bc..434afcb 100644
--- a/src/app/(main)/blog/[slug]/page.tsx
+++ b/src/app/(main)/blog/[slug]/page.tsx
@@ -6,12 +6,9 @@ import { RichText } from "@payloadcms/richtext-lexical/react";
 import { Metadata } from "next";
 import Image from "next/image";
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { slug: string };
-}): Promise<Metadata> {
-  const blog = await fetchBlogDetail(params.slug);
+export async function generateMetadata({ params }: { params: Promise<{ slug: string }> }): Promise<Metadata> {
+  const slug = (await params).slug;
+  const blog = await fetchBlogDetail(slug);
 
   if (!blog) {
     return {
@@ -38,11 +35,7 @@ export async function generateMetadata({
   };
 }
 
-export default async function SingleBlogPage({
-  params,
-}: {
-  params: Promise<{ slug: string }>;
-}) {
+export default async function SingleBlogPage({ params }: { params: Promise<{ slug: string }> }) {
   const slug = (await params).slug;
   const data = await fetchBlogDetail(slug);
 
@@ -50,50 +43,36 @@ export default async function SingleBlogPage({
 
   return (
     <>
-      <section
-        className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
-        id="home"
-      >
+      <section className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden">
         {/* <!-- Background Shape --> */}
-        <div className="bg-shape-1 wow fadeIn">
-          <Image
-            src="/assets/images/demo-fancy/bg-shape-1.svg"
-            width={1443}
-            height={844}
-            alt=""
-          />
+        <div className="bg-shape-1 opacity-003">
+          <Image src="/assets/images/demo-fancy/bg-shape-1.svg" width={1443} height={844} alt="" />
         </div>
         {/* <!-- End Background Shape --> */}
 
         <div className="container position-relative pt-sm-40 text-center">
           <div className="row">
             <div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
-              <h1 className="hs-title-10 mb-10 wow fadeInUp">
-                {data.data.title}
-              </h1>
+              <h1 className="hs-title-10 mb-10 wow fadeInUp">{data.data.title}</h1>
               {/* Author, Categories, Comments */}
-              <div
-                className="blog-item-data mb-0 wow fadeIn"
-                data-wow-delay="0.2s"
-              >
+              <div className="blog-item-data mb-0 wow fadeIn" data-wow-delay="0.2s">
                 <div className="d-inline-block me-3">
                   <a href="#">
                     <i className="mi-clock size-16" />
-                    <span className="visually-hidden">Date:</span>{" "}
-                    {data.createdAt}
+                    <span className="visually-hidden">Date:</span> {data.createdAt}
                   </a>
                 </div>
-                <div className="d-inline-block me-3">
+                {/* <div className="d-inline-block me-3">
                   <i className="mi-folder size-16" />
-                  <span className="visually-hidden">Categories:</span>{" "}
-                  <a href="#">Design</a>, <a href="#">Branding</a>
-                </div>
+                  <span className="visually-hidden">Categories:</span> <a href="#">Design</a>, <a href="#">Branding</a>
+                </div> */}
               </div>
               {/* End Author, Categories, Comments */}
             </div>
           </div>
         </div>
       </section>
+
       <>
         {/* Section */}
         <section className="page-section">
@@ -105,13 +84,7 @@ export default async function SingleBlogPage({
                 <div className="blog-item mb-80 mb-xs-40">
                   <div className="blog-item-body">
                     <div className="mb-40 mb-xs-30">
-                      <Image
-                        src={data.imgUrl}
-                        alt="Image Description"
-                        width={1350}
-                        height={759}
-                        className="round"
-                      />
+                      <Image src={data.imgUrl} alt="Image Description" width={1350} height={759} className="round" />
                     </div>
                     <div>
                       <RichText data={data.data.content} />
diff --git a/src/app/(main)/blog/page.tsx b/src/app/(main)/blog/page.tsx
index a7cc3af..b691373 100644
--- a/src/app/(main)/blog/page.tsx
+++ b/src/app/(main)/blog/page.tsx
@@ -10,27 +10,16 @@ export const metadata = {
   description: "Blogs | Cochise Oncology",
 };
 
-export default async function BlogPage({
-  searchParams,
-}: {
-  searchParams?: { page?: string };
-}) {
-  const page = sanitizePageNumber(searchParams?.page);
+export default async function BlogPage({ searchParams }: { searchParams?: Promise<{ page?: string }> }) {
+  const paramsPage = (await searchParams)?.page;
+  const page = sanitizePageNumber(paramsPage);
 
   return (
     <>
-      <section
-        className="page-section bg-gradient-gray-light-1 bg-scroll overflow-hidden"
-        id="home"
-      >
+      <section className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden">
         {/* <!-- Background Shape --> */}
-        <div className="bg-shape-1 wow fadeIn">
-          <Image
-            src="/assets/images/demo-fancy/bg-shape-1.svg"
-            width={1443}
-            height={844}
-            alt=""
-          />
+        <div className="bg-shape-1 opacity-003">
+          <Image src="/assets/images/demo-fancy/bg-shape-1.svg" width={1443} height={844} alt="" />
         </div>
         {/* <!-- End Background Shape --> */}
 
@@ -38,17 +27,11 @@ export default async function BlogPage({
           <div className="row">
             <div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
               <h1 className="hs-title-10 mb-10 wow fadeInUp">Blog</h1>
-
-              <p
-                className="section-descr mb-0 wow fadeInUp"
-                data-wow-delay="0.2s"
-              >
-                Explore captivating web design solutions.
-              </p>
             </div>
           </div>
         </div>
       </section>
+
       <section className="page-section" id="blog">
         <Blogs page={page} />
       </section>