diff --git a/src/components/CardStages/CardStage4.js b/src/components/CardStages/CardStage4.js
index 6eee967..b4684e9 100644
--- a/src/components/CardStages/CardStage4.js
+++ b/src/components/CardStages/CardStage4.js
@@ -53,19 +53,12 @@ const CardStage4 = ({ setStage, data, setData, req, setReq }) => {
                 dropdown ? "data-dropdown docs active" : "data-dropdown docs"
               }
             >
-              <div className="text-block">
-                {locale === "TUK"
-                  ? parser
-                      .parseFromString(req.tuk, "text/html")
-                      .getElementsByTagName("p")[0]
-                      .innerText.split(". ")
-                      .map((el, i) => <p key={i}>- {el}</p>)
-                  : parser
-                      .parseFromString(req.rus, "text/html")
-                      .getElementsByTagName("p")[0]
-                      .innerText.split(". ")
-                      .map((el, i) => <p key={i}>- {el}</p>)}
-              </div>
+              <div
+                className="text-block"
+                dangerouslySetInnerHTML={{
+                  __html: locale === "TUK" ? req.tuk : req.rus,
+                }}
+              ></div>
             </div>
           </div>
         </div>
diff --git a/src/components/CreditStages/CreditStage1.js b/src/components/CreditStages/CreditStage1.js
index d80e584..bb5135f 100644
--- a/src/components/CreditStages/CreditStage1.js
+++ b/src/components/CreditStages/CreditStage1.js
@@ -20,7 +20,6 @@ const CreditStage1 = ({ setStage, data, setData, creditData, id, setId }) => {
     one: false,
     two: false,
   });
-  const parser = new DOMParser();
 
   useEffect(() => {
     if (input !== "" && creditData) {
@@ -98,7 +97,9 @@ const CreditStage1 = ({ setStage, data, setData, creditData, id, setId }) => {
             </div>
             <div
               className={
-                dropdown.one ? "data-dropdown active" : "data-dropdown"
+                dropdown.one
+                  ? "data-dropdown grid active"
+                  : "data-dropdown grid"
               }
             >
               <div className="dropdown-inner bottom">
@@ -226,21 +227,12 @@ const CreditStage1 = ({ setStage, data, setData, creditData, id, setId }) => {
                   : "data-dropdown docs"
               }
             >
-              <div className="text-block">
-                {
-                  locale === "TUK"
-                    ? parser
-                        .parseFromString(req.tuk, "text/html")
-                        .getElementsByTagName("p")[0]
-                    : // .innerText.split(". ")
-                      // .map((el, i) => <p key={i}>- {el}</p>)
-                      parser
-                        .parseFromString(req.rus, "text/html")
-                        .getElementsByTagName("p")[0]
-                  // .innerText.split(". ")
-                  // .map((el, i) => <p key={i}>- {el}</p>)
-                }
-              </div>
+              <div
+                className="text-block"
+                dangerouslySetInnerHTML={{
+                  __html: locale === "TUK" ? req.tuk : req.rus,
+                }}
+              ></div>
             </div>
           </div>
         </div>
diff --git a/src/components/CreditStages/CreditStage5.js b/src/components/CreditStages/CreditStage5.js
index d9e6b35..be32fe9 100644
--- a/src/components/CreditStages/CreditStage5.js
+++ b/src/components/CreditStages/CreditStage5.js
@@ -65,6 +65,7 @@ const CreditStage5 = ({ setStage, data, setData }) => {
             <input
               id="file"
               type="file"
+              accept=".jpg, .jpeg, .docx, .doc, .pdf, .png"
               onChange={(e) => {
                 setFiles([...files, e.target.files[0]]);
                 e.target.value = "";
@@ -97,6 +98,12 @@ const CreditStage5 = ({ setStage, data, setData }) => {
               })
             : null}
         </ul>
+        <p className="alert">
+          {locale === "TUK"
+            ? "Hemme faýllar diňe görkezilen formatda bolmaly: "
+            : "Все файлы должны быть следующих форматов: "}
+          <span className="red">.jpg, .jpeg, .doc, .docx, .pdf, .png</span>
+        </p>
         <div className="cu-bottom card-stage-4-bottom">
           <button
             type="button"
@@ -128,7 +135,7 @@ const CreditStage5 = ({ setStage, data, setData }) => {
             }}
           >
             <div>
-              <h3>{locale === "TUK" ? "Продолжить" : "Продолжить"}</h3>
+              <h3>{locale === "TUK" ? "Dowam et" : "Продолжить"}</h3>
               <div className="btn-img">
                 <img src={next} alt="logout" />
               </div>
diff --git a/src/components/credits/CreditModal.js b/src/components/credits/CreditModal.js
index cf49f82..4f4674f 100644
--- a/src/components/credits/CreditModal.js
+++ b/src/components/credits/CreditModal.js
@@ -88,9 +88,7 @@ const CreditModal = ({
               <div className={stage > 2 ? "icon-block active" : "icon-block"}>
                 <Img3 className="modal-icon" />
                 <h3 className="icon-title">
-                  {locale === "TUK"
-                    ? "Karz üçin maglumat"
-                    : "Данные для кредита"}
+                  {locale === "TUK" ? "Şahsy maglumatlar" : "Личные данные"}
                 </h3>
               </div>
               <div className={stage > 3 ? "line-block active" : "line-block"}>
@@ -101,8 +99,8 @@ const CreditModal = ({
                 <Img4 className="modal-icon" />
                 <h3 className="icon-title">
                   {locale === "TUK"
-                    ? "Talaplar we resminamalar"
-                    : "Требования и документы"}
+                    ? "Karz üçin maglumat"
+                    : "Данные для кредита"}
                 </h3>
               </div>
               <div className={stage > 4 ? "line-block active" : "line-block"}>
@@ -113,8 +111,8 @@ const CreditModal = ({
                 <Img5 className="modal-icon" />
                 <h3 className="icon-title">
                   {locale === "TUK"
-                    ? "Karz üçin talaplar"
-                    : "Требования для кредита"}
+                    ? "Talaplar we resminamalar"
+                    : "Требования и документы"}
                 </h3>
               </div>
               <div className={stage > 5 ? "line-block active" : "line-block"}>
@@ -143,17 +141,15 @@ const CreditModal = ({
                   <Img2 className="modal-icon" />
                   <h3 className="icon-title">
                     {locale === "TUK"
-                      ? "Калькулятор кредита"
-                      : "Karzyň kalkulýatory"}
+                      ? "Karzyň kalkulýatory"
+                      : "Калькулятор кредита"}
                   </h3>
                 </div>
               ) : stage === 3 ? (
                 <div className="icon-block active">
                   <Img3 className="modal-icon" />
                   <h3 className="icon-title">
-                    {locale === "TUK"
-                      ? "Karz üçin maglumat"
-                      : "Данные для кредита"}
+                    {locale === "TUK" ? "Şahsy maglumatlar" : "Личные данные"}
                   </h3>
                 </div>
               ) : stage === 4 ? (
@@ -161,8 +157,8 @@ const CreditModal = ({
                   <Img4 className="modal-icon" />
                   <h3 className="icon-title">
                     {locale === "TUK"
-                      ? "Talaplar we resminamalar"
-                      : "Требования и документы"}
+                      ? "Karz üçin maglumat"
+                      : "Данные для кредита"}
                   </h3>
                 </div>
               ) : stage === 5 ? (
@@ -170,8 +166,8 @@ const CreditModal = ({
                   <Img5 className="modal-icon" />
                   <h3 className="icon-title">
                     {locale === "TUK"
-                      ? "Karz üçin talaplar"
-                      : "Требования для кредита"}
+                      ? "Talaplar we resminamalar"
+                      : "Требования и документы"}
                   </h3>
                 </div>
               ) : stage === 6 ? (
diff --git a/src/components/global/LoggedNav.js b/src/components/global/LoggedNav.js
index dfb4b72..9c1e898 100644
--- a/src/components/global/LoggedNav.js
+++ b/src/components/global/LoggedNav.js
@@ -125,13 +125,13 @@ const LoggedNav = ({ sideOpen, setSideOpen }) => {
                         : "Данные профиля"}
                     </Link>
                   </li>
-                  <li>
+                  {/* <li>
                     <Link to="/home/recovery">
                       {locale === "TUK"
                         ? "Açar sözüni çalyşmak"
                         : "Смена пароля"}
                     </Link>
-                  </li>
+                  </li> */}
                   <li>
                     <button
                       type="button"
diff --git a/src/components/global/Side.js b/src/components/global/Side.js
index e67eaf9..816c248 100644
--- a/src/components/global/Side.js
+++ b/src/components/global/Side.js
@@ -1,5 +1,5 @@
 // IMPORT MODULES
-import React, { useState, useEffect, useContext, useRef } from "react";
+import React, { useState, useEffect, useContext, useRef, useMemo } from "react";
 import { Link } from "react-router-dom";
 import { UserContext } from "../../backend/UserContext";
 import { deleteUser } from "../../backend/deleteUser";
@@ -15,13 +15,21 @@ import user from "../../icons/user-square.svg";
 import arrow from "../../icons/arrow-back.svg";
 import close from "../../icons/close.svg";
 
+// HOOKS
+import useMediaQuery from "../../hooks/useMediaQuery";
+
 const Side = ({ sideOpen, setSideOpen }) => {
   const inner = useRef();
   const { locale } = useContext(LanguageContext);
   const { setUser } = useContext(UserContext);
   const [linkStage, setLinkStage] = useState(0);
-
+  const [closeOnInteract, setCloseOnInteract] = useState(false);
   const location = window.location.href;
+  const viewPortWidth = useMediaQuery("(max-width: 1300px)");
+
+  useEffect(() => {
+    setCloseOnInteract(viewPortWidth);
+  }, [viewPortWidth]);
 
   useEffect(() => {
     if (location.includes("cards")) {
@@ -70,7 +78,14 @@ const Side = ({ sideOpen, setSideOpen }) => {
                   setLinkStage(1);
                 }}
               >
-                <Link to="/home/cards">
+                <Link
+                  to="/home/cards"
+                  onClick={() => {
+                    if (closeOnInteract) {
+                      setSideOpen(true);
+                    }
+                  }}
+                >
                   <div className="link-img">
                     <img src={card} alt="link" />
                   </div>
@@ -85,7 +100,14 @@ const Side = ({ sideOpen, setSideOpen }) => {
                   setLinkStage(2);
                 }}
               >
-                <Link to="/home/credits">
+                <Link
+                  to="/home/credits"
+                  onClick={() => {
+                    if (closeOnInteract) {
+                      setSideOpen(true);
+                    }
+                  }}
+                >
                   <div className="link-img">
                     <img src={credit} alt="link" />
                   </div>
@@ -98,7 +120,14 @@ const Side = ({ sideOpen, setSideOpen }) => {
                   setLinkStage(3);
                 }}
               >
-                <Link to="/home/contact-us">
+                <Link
+                  to="/home/contact-us"
+                  onClick={() => {
+                    if (closeOnInteract) {
+                      setSideOpen(true);
+                    }
+                  }}
+                >
                   <div className="link-img">
                     <img src={mail} alt="link" />
                   </div>
@@ -120,7 +149,14 @@ const Side = ({ sideOpen, setSideOpen }) => {
                   setLinkStage(4);
                 }}
               >
-                <Link to="/home/profile">
+                <Link
+                  to="/home/profile"
+                  onClick={() => {
+                    if (closeOnInteract) {
+                      setSideOpen(true);
+                    }
+                  }}
+                >
                   <div className="link-img">
                     <img src={user} alt="link" />
                   </div>
@@ -135,7 +171,14 @@ const Side = ({ sideOpen, setSideOpen }) => {
                   setLinkStage(5);
                 }}
               >
-                <Link to="/home/recovery">
+                <Link
+                  to="/home/recovery"
+                  onClick={() => {
+                    if (closeOnInteract) {
+                      setSideOpen(true);
+                    }
+                  }}
+                >
                   <div className="link-img">
                     <img src={password} alt="link" />
                   </div>
@@ -160,7 +203,15 @@ const Side = ({ sideOpen, setSideOpen }) => {
               </li>
             </ul>
           </div>
-          <Link to="/" className="side-footer">
+          <Link
+            to="/"
+            className="side-footer"
+            onClick={() => {
+              if (closeOnInteract) {
+                setSideOpen(true);
+              }
+            }}
+          >
             <div className="footer-img">
               <img src={arrow} alt="arrow" />
             </div>
diff --git a/src/components/sign/RegForm.js b/src/components/sign/RegForm.js
index e9eaa3b..03d0bc7 100644
--- a/src/components/sign/RegForm.js
+++ b/src/components/sign/RegForm.js
@@ -230,7 +230,7 @@ const RegForm = () => {
                   <span>*</span>
                 </label>
                 <CustomSelect
-                  items={["I", "A", "E"]}
+                  items={["I", "II", "III", "IV"]}
                   blockName={"select-block"}
                   elName={"select-el"}
                   customId={"serie"}
diff --git a/src/hooks/useMediaQuery.js b/src/hooks/useMediaQuery.js
new file mode 100644
index 0000000..3368d84
--- /dev/null
+++ b/src/hooks/useMediaQuery.js
@@ -0,0 +1,19 @@
+import { useState, useEffect } from "react";
+
+const useMediaQuery = (query) => {
+  const [matches, setMatches] = useState(false);
+
+  useEffect(() => {
+    const media = window.matchMedia(query);
+    if (media.matches !== matches) {
+      setMatches(media.matches);
+    }
+    const listener = () => setMatches(media.matches);
+    window.addEventListener("resize", listener);
+    return () => window.removeEventListener("resize", listener);
+  }, [matches, query]);
+
+  return matches;
+};
+
+export default useMediaQuery;
diff --git a/src/pages/Base.js b/src/pages/Base.js
index f3161b2..0a50f77 100644
--- a/src/pages/Base.js
+++ b/src/pages/Base.js
@@ -139,60 +139,62 @@ const Base = () => {
                 {user
                   ? user.online_card.length !== 0
                     ? user.online_card.map((el, i) => {
-                        return (
-                          <tr key={i}>
-                            <td>#{el.id}</td>
-                            <td>{el.selected_card}</td>
-                            <td>{el.date}</td>
-                            <td
-                              className={
-                                el.status === "5"
-                                  ? "red"
-                                  : el.status === "4" || el.status === "2"
-                                  ? "green"
-                                  : ""
-                              }
-                            >
-                              {el.status === "1"
-                                ? locale === "TUK"
-                                  ? "Ugradyldy"
-                                  : "Отправлено"
-                                : el.status === "2"
-                                ? locale === "TUK"
-                                  ? "Kabul edildi"
-                                  : "Принята"
-                                : el.status === "3"
-                                ? locale === "TUK"
-                                  ? "Görülyar"
-                                  : "На стадии рассмотрения"
-                                : el.status === "4"
-                                ? locale === "TUK"
-                                  ? "Kart çykaryldy"
-                                  : "Карта выпущена"
-                                : el.status === "5"
-                                ? locale === "TUK"
-                                  ? "Ret edildi"
-                                  : "Отказано"
-                                : ""}
-                            </td>
-                            <td>
-                              {el.status === "5" ? (
-                                <div className="reject">
-                                  <div className="reason">
-                                    <h4>{el.action}</h4>
+                        if (el.payed) {
+                          return (
+                            <tr key={i}>
+                              <td>#{el.id}</td>
+                              <td>{el.selected_card}</td>
+                              <td>{el.date}</td>
+                              <td
+                                className={
+                                  el.status === "5"
+                                    ? "red"
+                                    : el.status === "4" || el.status === "2"
+                                    ? "green"
+                                    : ""
+                                }
+                              >
+                                {el.status === "1"
+                                  ? locale === "TUK"
+                                    ? "Ugradyldy"
+                                    : "Отправлено"
+                                  : el.status === "2"
+                                  ? locale === "TUK"
+                                    ? "Kabul edildi"
+                                    : "Принята"
+                                  : el.status === "3"
+                                  ? locale === "TUK"
+                                    ? "Görülyar"
+                                    : "На стадии рассмотрения"
+                                  : el.status === "4"
+                                  ? locale === "TUK"
+                                    ? "Kart çykaryldy"
+                                    : "Карта выпущена"
+                                  : el.status === "5"
+                                  ? locale === "TUK"
+                                    ? "Ret edildi"
+                                    : "Отказано"
+                                  : ""}
+                              </td>
+                              <td>
+                                {el.status === "5" ? (
+                                  <div className="reject">
+                                    <div className="reason">
+                                      <h4>{el.action}</h4>
+                                    </div>
+                                    <img src={allert} alt="reject" />
                                   </div>
-                                  <img src={allert} alt="reject" />
-                                </div>
-                              ) : el.status !== "4" && el.status !== "2" ? (
-                                <div>
-                                  <img src={nul} alt="null" />
-                                </div>
-                              ) : (
-                                ""
-                              )}
-                            </td>
-                          </tr>
-                        );
+                                ) : el.status !== "4" && el.status !== "2" ? (
+                                  <div>
+                                    <img src={nul} alt="null" />
+                                  </div>
+                                ) : (
+                                  ""
+                                )}
+                              </td>
+                            </tr>
+                          );
+                        }
                       })
                     : null
                   : null}
diff --git a/src/pages/Cards.js b/src/pages/Cards.js
index 133322c..d96af77 100644
--- a/src/pages/Cards.js
+++ b/src/pages/Cards.js
@@ -24,6 +24,7 @@ const Cards = () => {
   const [loader, setLoader] = useState(false);
   const [modalOpen, setModalOpen] = useState(false);
   const [stage, setStage] = useState(1);
+  console.log(user);
   useEffect(() => {
     if (modalOpen) {
       document.body.style.overflowY = "hidden";
@@ -104,60 +105,62 @@ const Cards = () => {
                 {user ? (
                   user.online_card.length !== 0 ? (
                     user.online_card.map((el, i) => {
-                      return (
-                        <tr key={i}>
-                          <td>#{el.id}</td>
-                          <td>{el.selected_card}</td>
-                          <td>{el.date}</td>
-                          <td
-                            className={
-                              el.status === "5"
-                                ? "red"
-                                : el.status === "4" || el.status === "2"
-                                ? "green"
-                                : ""
-                            }
-                          >
-                            {el.status === "1"
-                              ? locale === "TUK"
-                                ? "Ugradyldy"
-                                : "Отправлено"
-                              : el.status === "2"
-                              ? locale === "TUK"
-                                ? "Kabul edildi"
-                                : "Принята"
-                              : el.status === "3"
-                              ? locale === "TUK"
-                                ? "Görülyar"
-                                : "На стадии рассмотрения"
-                              : el.status === "4"
-                              ? locale === "TUK"
-                                ? "Kart çykaryldy"
-                                : "Карта выпущена"
-                              : el.status === "5"
-                              ? locale === "TUK"
-                                ? "Ret edildi"
-                                : "Отказано"
-                              : ""}
-                          </td>
-                          <td>
-                            {el.status === "5" ? (
-                              <div className="reject">
-                                <div className="reason">
-                                  <h4>{el.action}</h4>
+                      if (el.payed) {
+                        return (
+                          <tr key={i}>
+                            <td>#{el.id}</td>
+                            <td>{el.selected_card}</td>
+                            <td>{el.date}</td>
+                            <td
+                              className={
+                                el.status === "5"
+                                  ? "red"
+                                  : el.status === "4" || el.status === "2"
+                                  ? "green"
+                                  : ""
+                              }
+                            >
+                              {el.status === "1"
+                                ? locale === "TUK"
+                                  ? "Ugradyldy"
+                                  : "Отправлено"
+                                : el.status === "2"
+                                ? locale === "TUK"
+                                  ? "Kabul edildi"
+                                  : "Принята"
+                                : el.status === "3"
+                                ? locale === "TUK"
+                                  ? "Görülyar"
+                                  : "На стадии рассмотрения"
+                                : el.status === "4"
+                                ? locale === "TUK"
+                                  ? "Kart çykaryldy"
+                                  : "Карта выпущена"
+                                : el.status === "5"
+                                ? locale === "TUK"
+                                  ? "Ret edildi"
+                                  : "Отказано"
+                                : ""}
+                            </td>
+                            <td>
+                              {el.status === "5" ? (
+                                <div className="reject">
+                                  <div className="reason">
+                                    <h4>{el.action}</h4>
+                                  </div>
+                                  <img src={allert} alt="reject" />
                                 </div>
-                                <img src={allert} alt="reject" />
-                              </div>
-                            ) : el.status !== "4" && el.status !== "2" ? (
-                              <div>
-                                <img src={nul} alt="null" />
-                              </div>
-                            ) : (
-                              ""
-                            )}
-                          </td>
-                        </tr>
-                      );
+                              ) : el.status !== "4" && el.status !== "2" ? (
+                                <div>
+                                  <img src={nul} alt="null" />
+                                </div>
+                              ) : (
+                                ""
+                              )}
+                            </td>
+                          </tr>
+                        );
+                      }
                     })
                   ) : (
                     <tr>
diff --git a/src/scss/_credit-modal.scss b/src/scss/_credit-modal.scss
index cba44fc..4f254cb 100644
--- a/src/scss/_credit-modal.scss
+++ b/src/scss/_credit-modal.scss
@@ -3,7 +3,6 @@
   flex-direction: column;
   justify-content: flex-start;
   gap: 1.4rem;
-  max-width: 42rem;
   width: 100%;
 
   label {
@@ -11,7 +10,6 @@
   }
 
   .cs-1-top-block {
-    max-width: 42rem;
     width: 100%;
   }
 }
@@ -46,6 +44,10 @@
 }
 
 .data-dropdown {
+  &.grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+  }
   .text-block {
     padding: 4rem 2rem;
   }
@@ -294,7 +296,8 @@
   .cs-1-middle {
     gap: 1rem;
   }
-  .data-dropdown {
+  .data-dropdown,
+  .data-dropdown.grid {
     display: grid;
     grid-template-columns: 1fr;
 
diff --git a/src/scss/_custom-select.scss b/src/scss/_custom-select.scss
index 0c8d2ee..b029bc0 100644
--- a/src/scss/_custom-select.scss
+++ b/src/scss/_custom-select.scss
@@ -3,6 +3,9 @@
   display: inline-block;
 
   input {
+    &:read-only {
+      background-color: #fff !important;
+    }
     width: 100%;
     padding: 2rem;
     border-radius: 0.5rem;
diff --git a/src/scss/_modal-form.scss b/src/scss/_modal-form.scss
index 796df59..46bbc1c 100644
--- a/src/scss/_modal-form.scss
+++ b/src/scss/_modal-form.scss
@@ -3,6 +3,10 @@
   margin: auto 0;
 }
 
+.alert {
+  font-size: 1.2rem;
+}
+
 .modal {
   display: flex;
   justify-content: center;
@@ -19,6 +23,10 @@
   overflow-y: auto;
   z-index: 10000;
 
+  input:read-only {
+    background: #f2f2f2;
+  }
+
   &.active {
     opacity: 1;
     pointer-events: all;