fix width

client/src/components/JoinMCDi.tsx

@@ -164,8 +164,7 @@ const JoinMCDi: React.FC = () => {
   contentLabel="Join MCDi Membership Form"
   className="modal"
   overlayClassName="overlay"
-        style={{content: {overflow: 'hidden'}}}
-        >
+>
   <div className="h-full flex flex-col">
     <h2 className="text-2xl font-bold text-[#8C1D40] mb-4">Join MCDi Membership Form</h2>
     <div className="flex-grow overflow-y-auto">
@@ -183,7 +182,7 @@ const JoinMCDi: React.FC = () => {
       Close
     </button>
   </div>
-        </Modal>
+</Modal>
 
       </motion.div>
       {isLoading && (

client/src/index.css

@@ -117,9 +117,10 @@ html {
   background-color: white;
   padding: 20px;
   border-radius: 8px;
-  width: 60vw;
-  height: 60vh;
-  overflow-y: hidden;
+  width: 80%;
+  max-width: 1000px;
+  height: 90vh;
+  overflow: hidden;
 }
 
 .overlay {
@@ -129,4 +130,5 @@ html {
   right: 0;
   bottom: 0;
   background-color: rgba(0, 0, 0, 0.75);
+  overflow-y: auto;
 }