diff --git a/FrontEnd/src/index.module.css b/FrontEnd/src/index.module.css
index 14cb1cba..34e14b30 100644
--- a/FrontEnd/src/index.module.css
+++ b/FrontEnd/src/index.module.css
@@ -15,4 +15,4 @@ a {
   display: flex;
   scroll-behavior: smooth;
   font-family: 'Inter', sans-serif;
-}
\ No newline at end of file
+}
diff --git a/FrontEnd/src/pages/Authorization/LoginPage.module.css b/FrontEnd/src/pages/Authorization/LoginPage.module.css
index fbd98396..2146e1df 100644
--- a/FrontEnd/src/pages/Authorization/LoginPage.module.css
+++ b/FrontEnd/src/pages/Authorization/LoginPage.module.css
@@ -2,7 +2,7 @@
   display: flex;
   justify-content: center;
   width: 100vw;
-  min-height: var(--min-height-block-main);
+  flex-grow: 1;
   flex-shrink: 0;
   background: var(--light-seashell-background);
   padding: 80px 0;
diff --git a/FrontEnd/src/pages/SignUp/SignUp/ActivateProfileModalPage.jsx b/FrontEnd/src/pages/SignUp/SignUp/ActivateProfileModalPage.jsx
deleted file mode 100644
index c796b0ed..00000000
--- a/FrontEnd/src/pages/SignUp/SignUp/ActivateProfileModalPage.jsx
+++ /dev/null
@@ -1,70 +0,0 @@
-import { useState, useEffect } from 'react';
-import axios from 'axios';
-import { useParams } from 'react-router-dom';
-import LoginPage from '../../../pages/Authorization/LoginPage';
-import styles from './ActivateProfileModalPage.module.css';
-
-export function ActivateProfileModalPage() {
-  const { uid, token } = useParams();
-  const [activationStatus, setActivationStatus] = useState('');
-  const [modalVisible, setModalVisible] = useState(false);
-
-  const handleActivation = async () => {
-    try {
-      const response = await axios.post(
-        `${process.env.REACT_APP_BASE_API_URL}/api/auth/users/activation/`,
-        {
-          uid: uid,
-          token: token,
-        }
-      );
-
-      setActivationStatus(response.data.message);
-      setModalVisible(true);
-    } catch (error) {
-      setActivationStatus('Помилка активації');
-      setModalVisible(true);
-    }
-  };
-
-  useEffect(() => {
-    handleActivation();
-  }, []);
-
-  const closeModal = () => {
-    setModalVisible(false);
-  };
-
-  return (
-    <div>
-      <LoginPage />
-      {modalVisible && (
-        <div className={styles['modal']}>
-              <div className={styles['modal__header']}>
-                {activationStatus === 'Помилка активації'
-                  ? 'Помилка активації'
-                  : 'Реєстрація завершена!'}
-              </div>
-              <div className={styles['modal__content']}>
-                <p className={styles['modal__content--text']}>
-                  {activationStatus === 'Помилка активації'
-                    ? 'Під час активації сталася помилка. Спробуйте ще раз або зв\'яжіться з підтримкою.'
-                    : 'Ви успішно підтвердили вказану електронну адресу.'}
-                </p>
-              </div>
-              <div className={styles['modal__footer']}>
-                <div className={styles['button-container']}>
-                  <button
-                    className={styles['signup-page__button']}
-                    onClick={closeModal}
-                  >
-                    Закрити
-                  </button>
-                </div>
-              </div>
-        </div>
-      )}
-      {modalVisible && <div className={styles['blur-background']}></div>}
-    </div>
-  );
-}
diff --git a/FrontEnd/src/pages/SignUp/SignUp/ActivateProfilePage.jsx b/FrontEnd/src/pages/SignUp/SignUp/ActivateProfilePage.jsx
new file mode 100644
index 00000000..39af4584
--- /dev/null
+++ b/FrontEnd/src/pages/SignUp/SignUp/ActivateProfilePage.jsx
@@ -0,0 +1,57 @@
+import { useState, useEffect } from 'react';
+import axios from 'axios';
+import { useParams, Link } from 'react-router-dom';
+import styles from './ActivateProfilePage.module.css';
+
+export function ActivateProfilePage() {
+  const { uid, token } = useParams();
+  const [activationStatus, setActivationStatus] = useState('');
+
+  const handleActivation = async () => {
+    try {
+      const response = await axios.post(
+        `${process.env.REACT_APP_BASE_API_URL}/api/auth/users/activation/`,
+        {
+          uid: uid,
+          token: token,
+        }
+      );
+
+      setActivationStatus(response.data.message);
+    } catch (error) {
+      setActivationStatus('Помилка активації');
+    }
+  };
+
+  useEffect(() => {
+    handleActivation();
+  }, []);
+
+  return (
+    <div className={styles['activation-page']}>
+      <div  className={styles['activation-page__body']}>
+        <div  className={styles['activation-page__container']}>
+          <div className={styles['activation-page__header']}>
+            {activationStatus === 'Помилка активації'
+              ? 'Помилка активації'
+              : 'Реєстрація завершена!'}
+          </div>
+          <div className={styles['activation-page__content']}>
+            <p className={styles['activation-page__text']}>
+              {activationStatus === 'Помилка активації'
+                ? 'Під час активації сталася помилка. Спробуйте ще раз або зв\'яжіться з підтримкою.'
+                : 'Ви успішно підтвердили вказану електронну адресу.'}
+            </p>
+          </div>
+          <div className={styles['activation-page__footer']}>
+            <div className={styles['button-container']}>
+              <Link className={styles['signup-page__button']} to="/login">
+                Повернутися до входу
+              </Link>
+              </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/FrontEnd/src/pages/SignUp/SignUp/ActivateProfileModalPage.module.css b/FrontEnd/src/pages/SignUp/SignUp/ActivateProfilePage.module.css
similarity index 62%
rename from FrontEnd/src/pages/SignUp/SignUp/ActivateProfileModalPage.module.css
rename to FrontEnd/src/pages/SignUp/SignUp/ActivateProfilePage.module.css
index c570f5f1..2431389d 100644
--- a/FrontEnd/src/pages/SignUp/SignUp/ActivateProfileModalPage.module.css
+++ b/FrontEnd/src/pages/SignUp/SignUp/ActivateProfilePage.module.css
@@ -1,31 +1,39 @@
-.modal {
-  position: absolute;
-  top: 50%;
-  left: 50.5%;
-  float: left;
-  transform: translate(-50%, -50%);
-  width: 375px;
+.activation-page {
+  width: 100vw;
   border-radius: 8px;
-  z-index: 999;
+  background: var(--light-seashell-background);
+  padding: 80px 0;
+  display: flex;
+  flex-grow: 1;
+  justify-content: center;
 }
 
-.blur-background {
-  backdrop-filter: blur(3px);
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  z-index: 997;
+
+.activation-page__body {
+  display: flex;
+  align-self: center;
+  flex-direction: column;
+  align-items: center;
+  max-width: 572px;
+  min-width: 345px;
+  gap: 24px;
+
 }
 
-.modal__header {
+.activation-page__container {
   display: flex;
-  padding: 18px 24px;
+  width: 375px;
+  flex-direction: column;
   align-items: flex-start;
-  gap: 36px;
-  align-self: stretch;
+  border-radius: 6px;
   background: var(--main-white, #fff);
+}
+
+.activation-page__header {
+  display: flex;
+  align-self: stretch;
+  padding: 16px 24px;
+  box-shadow: 0px -1px 0px 0px #f0f0f0 inset;
   color: var(--character-title-85, rgba(0, 0, 0, 0.85));
   font-feature-settings: "calt" off;
   font-family: var(--font-main);
@@ -36,18 +44,27 @@
   letter-spacing: -0.16px;
 }
 
-.modal__content {
+.activation-page__footer {
   display: flex;
   padding: 16px 24px;
-  justify-content: flex-start;
   align-items: center;
   gap: 8px;
   align-self: stretch;
-  background: var(--main-white, #fff);
   box-shadow: 0px 1px 0px 0px #f0f0f0 inset;
 }
 
-.modal__content--text {
+.activation-page__content {
+  align-self: stretch;
+  flex-grow: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
+  gap: 10px;
+  padding: 24px;
+}
+
+.activation-page__text {
   font-family: var(--font-main);
   font-size: 14px;
   font-weight: 400;
@@ -57,16 +74,6 @@
   color: var(--main-text-color);
 }
 
-.modal__footer {
-  display: flex;
-  padding: 16px 24px;
-  align-items: center;
-  gap: 8px;
-  align-self: stretch;
-  background: var(--main-white, #fff);
-  box-shadow: 0px 1px 0px 0px #f0f0f0 inset;
-}
-
 .button-container {
   display: flex;
   align-items: flex-start;
@@ -93,7 +100,17 @@
 }
 
 @media only screen and (min-width: 768px) {
-  .modal {
+  .activation-page {
+    padding: 104px 0;
+  }
+
+  .activation-page__container {
     width: 572px;
   }
 }
+
+@media only screen and (min-width: 1512px) {
+  .activation-page {
+    padding: 120px 0;
+  }
+}
diff --git a/FrontEnd/src/pages/SignUp/SignUp/ResendActivationPage.module.css b/FrontEnd/src/pages/SignUp/SignUp/ResendActivationPage.module.css
index 11162078..7cf077ea 100644
--- a/FrontEnd/src/pages/SignUp/SignUp/ResendActivationPage.module.css
+++ b/FrontEnd/src/pages/SignUp/SignUp/ResendActivationPage.module.css
@@ -4,6 +4,7 @@
     background: var(--light-seashell-background);
     padding: 80px 0;
     display: flex;
+    flex-grow: 1;
     justify-content: center;
 }
 
diff --git a/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.jsx b/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.jsx
index a7653d0e..bf7a13cb 100644
--- a/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.jsx
+++ b/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.jsx
@@ -27,7 +27,7 @@ export function SignUpCompletionPage() {
             </div>
           </div>
         </div>
-        </div>
+      </div>
     </div>
   );
 }
diff --git a/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.module.css b/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.module.css
index 66caf7d1..c258ecc2 100644
--- a/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.module.css
+++ b/FrontEnd/src/pages/SignUp/SignUp/SignUpCompletionPage.module.css
@@ -4,6 +4,7 @@
   background: var(--light-seashell-background);
   padding: 80px 0;
   display: flex;
+  flex-grow: 1;
   justify-content: center;
 }
 
@@ -128,7 +129,7 @@
 }
 
 @media only screen and (min-width: 768px) {
-  .completion-page__body {
+  .completion-page {
     padding: 104px 0;
   }
 
@@ -138,7 +139,7 @@
 }
 
 @media only screen and (min-width: 1512px) {
-  .completion-page__body {
+  .completion-page {
     padding: 120px 0;
   }
 }
diff --git a/FrontEnd/src/routes/ClientRouter.jsx b/FrontEnd/src/routes/ClientRouter.jsx
index 7a8f2978..40ed8bdb 100644
--- a/FrontEnd/src/routes/ClientRouter.jsx
+++ b/FrontEnd/src/routes/ClientRouter.jsx
@@ -19,7 +19,7 @@ import ProfilePage from '../pages/ProfilePage/ProfilePage';
 import { SignUpPage } from '../pages/SignUp/SignUp/SignUpPage';
 import { SignUpCompletionPage } from '../pages/SignUp/SignUp/SignUpCompletionPage';
 import { ResendActivationPage } from '../pages/SignUp/SignUp/ResendActivationPage';
-import { ActivateProfileModalPage } from '../pages/SignUp/SignUp/ActivateProfileModalPage';
+import { ActivateProfilePage } from '../pages/SignUp/SignUp/ActivateProfilePage';
 import { SendEmailRestorePasswordPage } from '../pages/RestorePassword/Pages/SendEmailRestorePasswordPage';
 import { RestorePasswordPage } from '../pages/RestorePassword/Pages/RestorePasswordPage';
 import { RestorePasswordModalPage } from '../pages/RestorePassword/Pages/RestorePasswordModalPage';
@@ -85,7 +85,7 @@ function ClientRouter() {
         />
         <Route
           path="/activate/:uid/:token"
-          element={<ActivateProfileModalPage />}
+          element={<ActivateProfilePage />}
         />
         <Route
           path="/reset-password"