diff --git a/src/core/components/CustomModal.tsx b/src/core/components/CustomModal.tsx
index c8f9b1250a14b5b0c2a4e0911bebef5dc83edaeb..e6e01192c0268c37aab67e2f55695fb26c805a8b 100644
--- a/src/core/components/CustomModal.tsx
+++ b/src/core/components/CustomModal.tsx
@@ -8,21 +8,21 @@ interface ICustomModalProps {
   isOpen: boolean;
   setIsOpen: Dispatcher<boolean>;
   children: React.ReactNode;
-  customStyle: { backgroundColor?: string; padding?: string };
+  customStyle: { backgroundColor?: string; padding?: string; width?: string };
 }
 
 const useStyles = makeStyles((theme) => ({
-  modal: {
+  modal: (customStyle: ICustomModalProps['customStyle']) => ({
     backgroundColor: 'transparent',
     margin: '7% auto',
     padding: 'none',
     border: 'none',
-    width: '85%',
-    [theme.breakpoints.down('sm')]: {
+    width: customStyle.width || '85%',
+    [theme.breakpoints.down(700)]: {
       margin: '3% auto',
       width: '95%',
     },
-  },
+  }),
   modalContent: (customStyle: ICustomModalProps['customStyle']) => ({
     ...{
       backgroundColor: customStyle.backgroundColor || 'theme.palette.background.paper',
diff --git a/src/core/components/ProfileModal.tsx b/src/core/components/ProfileModal.tsx
index 26edd64152fe5daaeb35821fb43ce2760e17cc81..8d442d6206b6d1926afa9336bd0ba279ba10b469 100644
--- a/src/core/components/ProfileModal.tsx
+++ b/src/core/components/ProfileModal.tsx
@@ -14,7 +14,7 @@ export const ProfileModal = ({ isOpen, setIsOpen }: IProfileModalProps) => {
     <CustomModal
       isOpen={isOpen}
       setIsOpen={setIsOpen}
-      customStyle={{ backgroundColor: 'white', padding: '10px' }}
+      customStyle={{ backgroundColor: 'white', padding: '10px', width: '650px' }}
     >
       {placeHolder}
     </CustomModal>