diff --git a/pages/index.tsx b/pages/index.tsx
index 7b0d73e..8a6b7b3 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -64,8 +64,8 @@ export default function Home() {
         </div>
       </div>}
       {showModal && (
-        <div className=''>
-          <div style={{height: '100vh'}} className="laptop:px-24 absolute z-10 p-10 bg-black bg-opacity-30  overflow-y-auto flex flex-row justify-center">
+        <div style={{height: '100vh'}} className="laptop:px-24 absolute z-10 p-10 overflow-y-auto flex flex-row justify-center">
+          <div className=' bg-black bg-opacity-40'>
             <div className=" laptop:w-1/2 z-20 bg-black bg-opacity-90 text-white rounded">
               <div className="w-full flex flex-row justify-end p-4">
                 <span className="cursor-pointer" onClick={() => setShowModal(false)}>X</span>