diff --git a/inji-web/src/modals/ModalWrapper.tsx b/inji-web/src/modals/ModalWrapper.tsx
index 6ed314fb..e194633e 100644
--- a/inji-web/src/modals/ModalWrapper.tsx
+++ b/inji-web/src/modals/ModalWrapper.tsx
@@ -5,7 +5,7 @@ export const ModalWrapper:React.FC<ModalWrapperProps> = (props) => {
 
     return <>
         <div data-testid={"ModalWrapper-Outer-Container"} className={`justify-center items-center flex overflow-x-hidden overflow-y-auto fixed inset-0 ${props.zIndex == 50 ? 'z-50': 'z-40'} outline-none focus:outline-none`}>
-            <div className={`relative w-auto my-6 mx-auto ${props.size === '3xl' ? 'max-w-3xl' : 'max-w-sm'}`}>
+            <div className={`relative w-auto my-6 mx-auto sm:mx-5 ${props.size === '3xl' ? 'max-w-3xl' : 'max-w-sm'}`}>
                 <div data-testid={"ModalWrapper-Inner-Container"} className="border-0 rounded-lg shadow-lg relative flex flex-col w-full bg-iw-background outline-none focus:outline-none">
                     {props.header}
                     {props.content}