diff --git a/src/shared/modal-form/ModalForm.module.scss b/src/shared/modal-form/ModalForm.module.scss
index 72a1f0258..41b30f745 100644
--- a/src/shared/modal-form/ModalForm.module.scss
+++ b/src/shared/modal-form/ModalForm.module.scss
@@ -33,6 +33,3 @@
   }
 }
 
-.modal-hide {
-  display: none;
-}
diff --git a/src/shared/modal-form/ModalForm.tsx b/src/shared/modal-form/ModalForm.tsx
index 88699e282..2f5171ded 100644
--- a/src/shared/modal-form/ModalForm.tsx
+++ b/src/shared/modal-form/ModalForm.tsx
@@ -1,5 +1,4 @@
 import React, { ReactNode, MouseEvent } from 'react';
-import cn from 'clsx';
 import s from './ModalForm.module.scss';
 
 type ModalFormProps = {
@@ -8,9 +7,9 @@ type ModalFormProps = {
   onClose?: (event: MouseEvent<HTMLButtonElement>) => void;
 };
 
-export const ModalForm = ({ visible = true, onClose, children }: ModalFormProps) => {
-  return (
-    <div id="myModal" className={cn(s.modal, { [s['modal-hide']]: !visible })}>
+export const ModalForm = ({ visible = true, onClose, children }: ModalFormProps) =>
+  !!visible && (
+    <div className={s.modal}>
       <div className={s['modal-content']}>
         <span className={s.close} onClick={onClose}>
           &times;
@@ -19,4 +18,3 @@ export const ModalForm = ({ visible = true, onClose, children }: ModalFormProps)
       </div>
     </div>
   );
-};