diff --git a/docs/IgorFromUA/calculator.html b/docs/IgorFromUA/calculator.html
index fcec6720..069361f2 100644
--- a/docs/IgorFromUA/calculator.html
+++ b/docs/IgorFromUA/calculator.html
@@ -17,31 +17,35 @@
     </head>
     <body class="wrapper-all">
         <div class="wrapper">
-            <header class="header container">
-                <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
-                <nav class="navigation">
-                    <div class="navigation__menu-icon">
-                        <svg width="34" height="19" viewBox="0 0 34 19">
-                            <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                        </svg>
+            <header class="header">
+                <div class="container">
+                    <div class="header__wrapper">
+                        <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
+                        <nav class="navigation">
+                            <div class="navigation__menu-icon">
+                                <svg width="34" height="19" viewBox="0 0 34 19">
+                                    <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                </svg>
+                            </div>
+                            <ul class="navigation__list">
+                                <li class="navigation__item">
+                                    <a class="navigation__link navigation__link_active" href="./calculator.html">Calculator</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./games.html">Games</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./index.html">About</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./login.html">Login</a>
+                                </li>
+                            </ul>
+                        </nav>
                     </div>
-                    <ul class="navigation__list">
-                        <li class="navigation__item">
-                            <a class="navigation__link navigation__link_active" href="./calculator.html">Calculator</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./games.html">Games</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./index.html">About</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./login.html">Login</a>
-                        </li>
-                    </ul>
-                </nav>
+                </div>
             </header>
             <main class="container">
                 <h1 class="field__title">Calculate Games</h1>
@@ -80,36 +84,38 @@ <h1 class="field__title">Calculate Games</h1>
                 </div>
             </main>
         </div>
-        <footer class="footer wrapper container">
-            <div class="footer__link">
-                <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.instagram.com" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
+        <footer class="footer wrapper">
+            <div class="container">
+                <div class="footer__link">
+                    <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.instagram.com" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                </div>
+                <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
+                    Ihor
+                    Zapisochiy</p>
             </div>
-            <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
-                Ihor
-                Zapisochiy</p>
         </footer>
     </body>
     <script src="./scripts/script.js"></script>
diff --git a/docs/IgorFromUA/game.html b/docs/IgorFromUA/game.html
new file mode 100644
index 00000000..d11cc8a7
--- /dev/null
+++ b/docs/IgorFromUA/game.html
@@ -0,0 +1,92 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport"
+            content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+        <meta http-equiv="X-UA-Compatible" content="ie=edge">
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
+        <link rel="stylesheet" type="text/css" href="styles/styles.css">
+        <link rel="stylesheet" type="text/css" href="styles/header.css">
+        <link rel="stylesheet" type="text/css" href="styles/loading-spin.css">
+        <link rel="stylesheet" type="text/css" href="styles/game.css">
+        <link rel="stylesheet" type="text/css" href="styles/footer.css">
+        <title>GamesProject</title>
+    </head>
+    <body class="wrapper-all">
+        <div class="wrapper">
+            <header class="header">
+                <div class="container">
+                    <div class="header__wrapper">
+                        <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
+                        <nav class="navigation">
+                            <div class="navigation__menu-icon">
+                                <svg width="34" height="19" viewBox="0 0 34 19">
+                                    <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                </svg>
+                            </div>
+                            <ul class="navigation__list">
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./calculator.html">Calculator</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link navigation__link_active" href="./games.html">Games</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./index.html">About</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./login.html">Login</a>
+                                </li>
+                            </ul>
+                        </nav>
+                    </div>
+                </div>
+            </header>
+            <main class="container" data-game>
+                <div class="loading">
+                    <div class="loading__spin" data-loading></div>
+                </div>
+            </main>
+        </div>
+        <footer class="footer wrapper">
+            <div class="container">
+                <div class="footer__link">
+                    <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.instagram.com" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                </div>
+                <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
+                    Ihor
+                    Zapisochiy</p>
+            </div>
+        </footer>
+        <script src="./scripts/game.js">
+        </script>
+    </body>
+</html>
diff --git a/docs/IgorFromUA/games.html b/docs/IgorFromUA/games.html
index 076bf9f8..7878b13e 100644
--- a/docs/IgorFromUA/games.html
+++ b/docs/IgorFromUA/games.html
@@ -20,83 +20,89 @@
     </head>
     <body class="wrapper-all">
         <div class="wrapper">
-            <header class="header container">
-                <img class="header__logo" src="./src/logo.png" alt="logo masters academy">
-                <nav class="navigation">
-                    <div class="navigation__menu-icon">
-                        <svg width="34" height="19" viewBox="0 0 34 19">
-                            <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                        </svg>
+            <header class="header">
+                <div class="container">
+                    <div class="header__wrapper">
+                        <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
+                        <nav class="navigation">
+                            <div class="navigation__menu-icon">
+                                <svg width="34" height="19" viewBox="0 0 34 19">
+                                    <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                </svg>
+                            </div>
+                            <ul class="navigation__list">
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./calculator.html">Calculator</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link navigation__link_active" href="./games.html">Games</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./index.html">About</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./login.html">Login</a>
+                                </li>
+                            </ul>
+                        </nav>
                     </div>
-                    <ul class="navigation__list">
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./calculator.html">Calculator</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link navigation__link_active" href="#">Games</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./index.html">About</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./login.html">Login</a>
-                        </li>
-                    </ul>
-                </nav>
-            </header>
-            <form action="" class="filter container" data-form-filters name="filter-form">
-                <div class="filter-select-wrapper">
-                    <label for="filter__select">
-                        <select id="filter__select" name="genre" data-filter-select="genre" class="filter__select">
-                            <option class="select__option" selected value="genre">Genre</option>
-                            <option class="select__option" value="strategy">Strategy</option>
-                            <option class="select__option" value="shooter">Shooter</option>
-                            <option class="select__option" value="arpg">ARPG</option>
-                            <option class="select__option" value="fighting">Fighting</option>
-                            <option class="select__option" value="mmorpg">MMORPG</option>
-                            <option class="select__option" value="card">Card Game</option>
-                            <option class="select__option" value="action-rpg">Action RPG</option>
-                            <option class="select__option" value="open-world">Open-world</option>
-                            <option class="select__option" value="sports">sports</option>
-                            <option class="select__option" value="racing">racing</option>
-                            <option class="select__option" value="social">social</option>
-                            <option class="select__option" value="superhero">superhero</option>
-                            <option class="select__option" value="horror">horror</option>
-                            <option class="select__option" value="military">military</option>
-                            <option class="select__option" value="action">action</option>
-                            <option class="select__option" value="space">space</option>
-                            <option class="select__option" value="tank">tank</option>
-                            <option class="select__option" value="sailing">sailing</option>
-                            <option class="select__option" value="3d">3d</option>
-                            <option class="select__option" value="2d">2d</option>
-                        </select>
-                    </label>
-                    <label for="filter__platform">
-                        <select name="platform" id="filter__platform" data-filter-select="platform" class="filter__select">
-                            <option class="select__option" selected value="all">Platform</option>
-                            <option class="select__option" value="pc">PC</option>
-                            <option class="select__option" value="browser">Browser</option>
-                        </select>
-                    </label>
-                </div>
-                <div>
-                    <input type="radio" data-age-games="new" class="radio-input" name="age" id="age-1">
-                    <label for="age-1" class="radio-text    ">
-                        New first
-                    </label>
-                    <input type="radio" data-age-games="old" class="radio-input" name="age" id="age-2">
-                    <label for="age-2" class="radio-text">
-                        Old first
-                    </label>
                 </div>
-                <div class="filter-search-wrapper">
-                    <label for="filter__search">
-                        <input type="text" data-filter-search id="filter__search" class="filter__search"
-                            placeholder="Search" name="filter-search">
-                    </label>
-                    <button type="button" class="filter__btn" name="filter-button" data-filter-button>Apply</button>
+            </header>
+            <form action="" class="filter" data-form-filters name="filter-form">
+                <div class="container filter__wrapper">
+                    <div class="filter-select-wrapper">
+                        <label for="filter__select">
+                            <select id="filter__select" name="genre" data-filter-select="genre" class="filter__select">
+                                <option class="select__option" selected value="genre">Genre</option>
+                                <option class="select__option" value="strategy">Strategy</option>
+                                <option class="select__option" value="shooter">Shooter</option>
+                                <option class="select__option" value="arpg">ARPG</option>
+                                <option class="select__option" value="fighting">Fighting</option>
+                                <option class="select__option" value="mmorpg">MMORPG</option>
+                                <option class="select__option" value="card">Card Game</option>
+                                <option class="select__option" value="action-rpg">Action RPG</option>
+                                <option class="select__option" value="open-world">Open-world</option>
+                                <option class="select__option" value="sports">sports</option>
+                                <option class="select__option" value="racing">racing</option>
+                                <option class="select__option" value="social">social</option>
+                                <option class="select__option" value="superhero">superhero</option>
+                                <option class="select__option" value="horror">horror</option>
+                                <option class="select__option" value="military">military</option>
+                                <option class="select__option" value="action">action</option>
+                                <option class="select__option" value="space">space</option>
+                                <option class="select__option" value="tank">tank</option>
+                                <option class="select__option" value="sailing">sailing</option>
+                                <option class="select__option" value="3d">3d</option>
+                                <option class="select__option" value="2d">2d</option>
+                            </select>
+                        </label>
+                        <label for="filter__platform">
+                            <select name="platform" id="filter__platform" data-filter-select="platform" class="filter__select">
+                                <option class="select__option" selected value="all">Platform</option>
+                                <option class="select__option" value="pc">PC</option>
+                                <option class="select__option" value="browser">Browser</option>
+                            </select>
+                        </label>
+                    </div>
+                    <div>
+                        <input type="radio" data-age-games="new" class="radio-input" name="age" id="age-1">
+                        <label for="age-1" class="radio-text    ">
+                            New first
+                        </label>
+                        <input type="radio" data-age-games="old" class="radio-input" name="age" id="age-2">
+                        <label for="age-2" class="radio-text">
+                            Old first
+                        </label>
+                    </div>
+                    <div class="filter-search-wrapper">
+                        <label for="filter__search">
+                            <input type="text" data-filter-search id="filter__search" class="filter__search"
+                                placeholder="Search" name="filter-search">
+                        </label>
+                        <button type="button" class="filter__btn" name="filter-button" data-filter-button>Apply</button>
+                    </div>
                 </div>
             </form>
             <main class="container">
@@ -107,36 +113,38 @@ <h1 class="title">Study project "Games"</h1>
                 </div>
             </main>
         </div>
-        <footer class="footer wrapper container">
-            <div class="footer__link">
-                <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.instagram.com" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
+        <footer class="footer wrapper">
+            <div class="container">
+                <div class="footer__link">
+                    <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.instagram.com" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                </div>
+                <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
+                    Ihor
+                    Zapisochiy</p>
             </div>
-            <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
-                Ihor
-                Zapisochiy</p>
         </footer>
         <script src="./scripts/games.js"></script>
     </body>
diff --git a/docs/IgorFromUA/index.html b/docs/IgorFromUA/index.html
index c813e82d..617420a5 100644
--- a/docs/IgorFromUA/index.html
+++ b/docs/IgorFromUA/index.html
@@ -16,31 +16,35 @@
     </head>
     <body class="wrapper-all">
         <div class="wrapper">
-            <header class="header container">
-                <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
-                <nav class="navigation">
-                    <div class="navigation__menu-icon">
-                        <svg width="34" height="19" viewBox="0 0 34 19">
-                            <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                        </svg>
+            <header class="header">
+                <div class="container">
+                    <div class="header__wrapper">
+                        <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
+                        <nav class="navigation">
+                            <div class="navigation__menu-icon">
+                                <svg width="34" height="19" viewBox="0 0 34 19">
+                                    <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                </svg>
+                            </div>
+                            <ul class="navigation__list">
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./calculator.html">Calculator</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./games.html">Games</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link navigation__link_active" href="./index.html">About</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./login.html">Login</a>
+                                </li>
+                            </ul>
+                        </nav>
                     </div>
-                    <ul class="navigation__list">
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./calculator.html">Calculator</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./games.html">Games</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link navigation__link_active" href="#">About</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./login.html">Login</a>
-                        </li>
-                    </ul>
-                </nav>
+                </div>
             </header>
             <main class="container">
                 <div class="wrapper__about">
@@ -69,36 +73,38 @@ <h1 class="about__title">About me</h1>
                 </div>
             </main>
         </div>
-        <footer class="footer wrapper container">
-            <div class="footer__link">
-                <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.instagram.com" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
+        <footer class="footer wrapper">
+            <div class="container">
+                <div class="footer__link">
+                    <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.instagram.com" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                </div>
+                <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
+                    Ihor
+                    Zapisochiy</p>
             </div>
-            <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
-                Ihor
-                Zapisochiy</p>
         </footer>
     </body>
 </html>
diff --git a/docs/IgorFromUA/login.html b/docs/IgorFromUA/login.html
index e0beb89c..0e7a3e5a 100644
--- a/docs/IgorFromUA/login.html
+++ b/docs/IgorFromUA/login.html
@@ -17,31 +17,35 @@
     </head>
     <body class="wrapper-all">
         <div class="wrapper">
-            <header class="header container">
-                <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
-                <nav class="navigation">
-                    <div class="navigation__menu-icon">
-                        <svg width="34" height="19" viewBox="0 0 34 19">
-                            <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                            <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
-                        </svg>
+            <header class="header">
+                <div class="container">
+                    <div class="header__wrapper">
+                        <img class="header__logo" src="./src/logo.png" width="55" height="58" alt="logo masters academy">
+                        <nav class="navigation">
+                            <div class="navigation__menu-icon">
+                                <svg width="34" height="19" viewBox="0 0 34 19">
+                                    <rect width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="8" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                    <rect y="16" width="34" height="3.5" rx="1" fill="#FFF"></rect>
+                                </svg>
+                            </div>
+                            <ul class="navigation__list">
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./calculator.html">Calculator</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./games.html">Games</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link" href="./index.html">About</a>
+                                </li>
+                                <li class="navigation__item">
+                                    <a class="navigation__link navigation__link_active" href="./login.html">Login</a>
+                                </li>
+                            </ul>
+                        </nav>
                     </div>
-                    <ul class="navigation__list">
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./calculator.html">Calculator</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./games.html">Games</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link" href="./index.html">About</a>
-                        </li>
-                        <li class="navigation__item">
-                            <a class="navigation__link navigation__link_active" href="./login.html">Login</a>
-                        </li>
-                    </ul>
-                </nav>
+                </div>
             </header>
             <main class="container">
                 <section class="login">
@@ -62,36 +66,38 @@ <h1 class="login__title">Login page</h1>
                 </section>
             </main>
         </div>
-        <footer class="footer wrapper container">
-            <div class="footer__link">
-                <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
-                <a href="https://www.instagram.com" target="_blank">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
-                        <circle cx="21" cy="21" r="21" fill="white"></circle>
-                        <path
-                            d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
-                            fill="#EF4934"></path>
-                    </svg>
-                </a>
+        <footer class="footer wrapper">
+            <div class="container">
+                <div class="footer__link">
+                    <a href="https://www.facebook.com/profile.php?id=100001989712819" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M29.9 11H12.1C11.8083 11 11.5285 11.1159 11.3222 11.3222C11.1159 11.5285 11 11.8083 11 12.1V29.9C11 30.1917 11.1159 30.4715 11.3222 30.6778C11.5285 30.8841 11.8083 31 12.1 31H21.68V23.25H19.08V20.25H21.68V18C21.6261 17.4718 21.6885 16.9381 21.8627 16.4365C22.0369 15.9349 22.3188 15.4775 22.6885 15.0964C23.0582 14.7153 23.5068 14.4196 24.0028 14.2302C24.4989 14.0408 25.0304 13.9623 25.56 14C26.3383 13.9952 27.1163 14.0353 27.89 14.12V16.82H26.3C25.04 16.82 24.8 17.42 24.8 18.29V20.22H27.8L27.41 23.22H24.8V31H29.9C30.0445 31 30.1875 30.9715 30.321 30.9163C30.4544 30.861 30.5757 30.78 30.6778 30.6778C30.78 30.5757 30.861 30.4544 30.9163 30.321C30.9715 30.1875 31 30.0445 31 29.9V12.1C31 11.9555 30.9715 11.8125 30.9163 11.679C30.861 11.5456 30.78 11.4243 30.6778 11.3222C30.5757 11.22 30.4544 11.139 30.321 11.0837C30.1875 11.0285 30.0445 11 29.9 11Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.linkedin.com/in/ihor-zapisochnyi-751b9424b/" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M28.7778 11C29.3671 11 29.9324 11.2341 30.3491 11.6509C30.7659 12.0676 31 12.6329 31 13.2222V28.7778C31 29.3671 30.7659 29.9324 30.3491 30.3491C29.9324 30.7659 29.3671 31 28.7778 31H13.2222C12.6329 31 12.0676 30.7659 11.6509 30.3491C11.2341 29.9324 11 29.3671 11 28.7778V13.2222C11 12.6329 11.2341 12.0676 11.6509 11.6509C12.0676 11.2341 12.6329 11 13.2222 11H28.7778ZM28.2222 28.2222V22.3333C28.2222 21.3727 27.8406 20.4513 27.1613 19.772C26.482 19.0927 25.5607 18.7111 24.6 18.7111C23.6556 18.7111 22.5556 19.2889 22.0222 20.1556V18.9222H18.9222V28.2222H22.0222V22.7444C22.0222 21.8889 22.7111 21.1889 23.5667 21.1889C23.9792 21.1889 24.3749 21.3528 24.6666 21.6445C24.9583 21.9362 25.1222 22.3319 25.1222 22.7444V28.2222H28.2222ZM15.3111 17.1778C15.8062 17.1778 16.281 16.9811 16.631 16.631C16.9811 16.281 17.1778 15.8062 17.1778 15.3111C17.1778 14.2778 16.3444 13.4333 15.3111 13.4333C14.8131 13.4333 14.3355 13.6312 13.9833 13.9833C13.6312 14.3355 13.4333 14.8131 13.4333 15.3111C13.4333 16.3444 14.2778 17.1778 15.3111 17.1778ZM16.8556 28.2222V18.9222H13.7778V28.2222H16.8556Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                    <a href="https://www.instagram.com" target="_blank">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="42" height="42" viewBox="0 0 42 42" fill="none">
+                            <circle cx="21" cy="21" r="21" fill="white"></circle>
+                            <path
+                                d="M21 17.6714C19.1571 17.6714 17.6714 19.1714 17.6714 21C17.6714 22.8286 19.1714 24.3286 21 24.3286C22.8286 24.3286 24.3286 22.8286 24.3286 21C24.3286 19.1714 22.8286 17.6714 21 17.6714ZM31 21C31 19.6143 31 18.2571 30.9286 16.8714C30.8571 15.2714 30.4857 13.8429 29.3143 12.6857C28.1429 11.5143 26.7286 11.1429 25.1286 11.0714C23.7429 11 22.3857 11 21 11C19.6143 11 18.2571 11 16.8714 11.0714C15.2714 11.1429 13.8429 11.5143 12.6857 12.6857C11.5143 13.8571 11.1429 15.2714 11.0714 16.8714C11 18.2571 11 19.6143 11 21C11 22.3857 11 23.7429 11.0714 25.1286C11.1429 26.7286 11.5143 28.1571 12.6857 29.3143C13.8571 30.4857 15.2714 30.8571 16.8714 30.9286C18.2571 31 19.6143 31 21 31C22.3857 31 23.7429 31 25.1286 30.9286C26.7286 30.8571 28.1571 30.4857 29.3143 29.3143C30.4857 28.1429 30.8571 26.7286 30.9286 25.1286C31.0143 23.7571 31 22.3857 31 21ZM21 26.1286C18.1571 26.1286 15.8714 23.8429 15.8714 21C15.8714 18.1571 18.1571 15.8714 21 15.8714C23.8429 15.8714 26.1286 18.1571 26.1286 21C26.1286 23.8429 23.8429 26.1286 21 26.1286ZM26.3429 16.8571C25.6857 16.8571 25.1429 16.3286 25.1429 15.6571C25.1429 14.9857 25.6714 14.4571 26.3429 14.4571C27.0143 14.4571 27.5429 14.9857 27.5429 15.6571C27.5465 15.8136 27.5179 15.9692 27.4589 16.1142C27.4 16.2592 27.3118 16.3905 27.2 16.5C27.0905 16.6118 26.9592 16.7 26.8142 16.7589C26.6692 16.8179 26.5136 16.8465 26.3571 16.8429L26.3429 16.8571Z"
+                                fill="#EF4934"></path>
+                        </svg>
+                    </a>
+                </div>
+                <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
+                    Ihor
+                    Zapisochiy</p>
             </div>
-            <p class="footer__text">Made with 💗 on course 'Frontend for beginners' from Masters Academy in 2023, by
-                Ihor
-                Zapisochiy</p>
         </footer>
         <script src="./scripts/script-login.js"></script>
     </body>
diff --git a/docs/IgorFromUA/scripts/game.js b/docs/IgorFromUA/scripts/game.js
new file mode 100644
index 00000000..4e4074fd
--- /dev/null
+++ b/docs/IgorFromUA/scripts/game.js
@@ -0,0 +1,134 @@
+function loadingSwitch(switching) {
+    const LOADING_ELEMENT = document.querySelector('[data-loading]');
+    LOADING_ELEMENT.style.visibility = switching ? 'visible' : 'hidden';
+}
+
+function getGameId() {
+    const currentUrl = window.location.href;
+    return currentUrl.split('?').at(-1);
+}
+
+function getGame(id) {
+    const url = 'https://mmo-games.p.rapidapi.com/game?id=';
+    const optionsGamesUrl = {
+        method: 'GET',
+        headers: {
+            'X-RapidAPI-Key': '1c3169c707mshb51bff34cbc9ff6p1749b9jsn648a19134256',
+            'X-RapidAPI-Host': 'mmo-games.p.rapidapi.com',
+        },
+    };
+    return fetch(`${url}${id}`, optionsGamesUrl)
+        .then((response) => {
+            if (response.status < 200 || response.status >= 300) {
+                throw new Error(response.status);
+            } else {
+                return response.json();
+            }
+        });
+}
+
+function createGameCardStr(game) {
+    const {
+        title,
+        thumbnail,
+        status,
+        game_url: gameUrl,
+        minimum_system_requirements: minSys = {},
+        description,
+        genre,
+        platform,
+        publisher,
+        developer,
+        release_date: releaseDate,
+        screenshots,
+    } = game;
+    return `        <div class="card-header">
+                    <button class="back-btn" data-back-btn>&lt BECK</button>
+                    <h1 class="description__title" data-description-title>${title}</h1>
+                    <span class="semiBold"><a class="card-header__link" href=${gameUrl} target="_blank">Game site</a></span>
+                    </div>
+                    <div class="card-section">
+                        <div class="img-container">
+                            <img class="card__img" data-card-img src="${thumbnail}" alt="game picture">
+                            <ul class="card__actors">
+                                <li class="card__actor" data-status>
+                                    <span class="semiBold">Status:</span>    ${status}
+                                </li>
+                                <li class="card__actor" data-genre>
+                                    <span class="semiBold">Genre:</span>    ${genre}
+                                </li>
+                                <li class="card__actor" data-platform>
+                                    <span class="semiBold">Platform:</span>    ${platform}
+                                </li>
+                                <li class="card__actor" data-publisher>
+                                    <span class="semiBold">Publisher:</span>    ${publisher}
+                                </li>
+                                <li class="card__actor" data-developer>
+                                    <span class="semiBold">Developer:</span>    ${developer}
+                                </li>
+                                <li class="card__actor" data-release-date>
+                                    <span class="semiBold">Release_date:</span>    ${releaseDate}
+                                </li>
+                            </ul>
+                        </div>
+
+                        <div class="card__description">
+                            <p class="description__text" data-description-text>${description}</p>
+                        </div>
+                    </div>
+                    <div class="screenshots">
+                        ${screenshots.reduce((prev, val, indx) => `
+                            ${prev}<div class="screenshot" id="${val.id}">
+                                       <img src="${val.image}" alt="Screenshot ${indx + 1}">
+                                   </div>
+                       `, '')}
+
+                    </div>
+                    <div><span class="semiBold">minimum system requirements:</span>
+                        <ul class="card__actors">
+                            <li class="card__actor"><span class="semiBold">OS:</span>    ${minSys.os || '-'}</li>
+                            <li class="card__actor"><span class="semiBold">memory:</span>    ${minSys.memory || '-'}</li>
+                            <li class="card__actor"><span class="semiBold">storege:</span>    ${minSys.storege || '-'}</li>
+                            <li class="card__actor"><span class="semiBold">processor:</span>    ${minSys.processor || '-'}</li>
+                            <li class="card__actor"><span class="semiBold">graphics:</span>    ${minSys.graphics || '-'}</li>
+                        </ul>
+                    </div>
+    `;
+}
+
+function createCardGame(game) {
+    const cardContent = document.createElement('div');
+    cardContent.classList.add('card-content');
+    cardContent.insertAdjacentHTML('afterbegin', createGameCardStr(game));
+    return cardContent;
+}
+
+function goGamesPage() {
+    const currentUrl = window.location.href;
+    const endUrl = currentUrl.split('/');
+    endUrl[endUrl.length - 1] = 'games.html';
+    window.location.href = endUrl.join('/');
+}
+
+function initBackBtn() {
+    const BACK_BTN = document.querySelector('[data-back-btn]');
+    BACK_BTN.addEventListener('click', goGamesPage);
+}
+
+async function createCard(gameProm) {
+    const GAME_ELEMENT = document.querySelector('[data-game]');
+    loadingSwitch(true);
+    const game = await gameProm;
+    const card = document.createElement('div');
+    card.classList.add('card');
+    card.appendChild(createCardGame(game));
+    loadingSwitch(false);
+    GAME_ELEMENT.insertAdjacentElement('afterbegin', card);
+    initBackBtn();
+}
+
+function init() {
+    createCard(getGame(getGameId()));
+}
+
+init();
diff --git a/docs/IgorFromUA/scripts/games.js b/docs/IgorFromUA/scripts/games.js
index a765965d..7bea9869 100644
--- a/docs/IgorFromUA/scripts/games.js
+++ b/docs/IgorFromUA/scripts/games.js
@@ -1,3 +1,135 @@
+const mocGames = [
+    {
+        id: 1136,
+        title: 'Overwatch 2',
+        thumbnail: 'https://www.mmobomb.com/g/1136/thumbnail.jpg',
+        short_description: 'Big changes come to the Overwatch formula in this sequel...and so does PvE content, eventually.',
+        game_url: 'https://www.mmobomb.com/open/overwatch-2',
+        genre: 'Shooter',
+        platform: 'PC (Windows)',
+        publisher: 'Activision Blizzard King',
+        developer: 'Blizzard Entertainment',
+        release_date: '2022-10-04',
+        profile_url: 'https://www.mmobomb.com/overwatch-2',
+    },
+    {
+        id: 523,
+        title: 'Lost Ark',
+        thumbnail: 'https://www.mmobomb.com/g/523/thumbnail.jpg',
+        short_description: 'Journey throughout the realm of Arkesia and do battle against a demon invasion in Smilegate\'s free-to-play ARPG Lost Ark!',
+        game_url: 'https://www.mmobomb.com/open/lost-ark',
+        genre: 'ARPG',
+        platform: 'PC (Windows)',
+        publisher: 'Amazon Games',
+        developer: 'Smilegate',
+        release_date: '2022-02-11',
+        profile_url: 'https://www.mmobomb.com/lost-ark',
+    },
+    {
+        id: 1113,
+        title: 'PUBG: BATTLEGROUNDS',
+        thumbnail: 'https://www.mmobomb.com/g/1113/thumbnail.jpg',
+        short_description: 'Battle the odds in a 100v1 death match in PUBG: Battlegrounds, the classic free-to-play battle royale experience.',
+        game_url: 'https://www.mmobomb.com/open/pubg',
+        genre: 'Shooter',
+        platform: 'PC (Windows)',
+        publisher: 'KRAFTON, Inc.',
+        developer: 'KRAFTON, Inc.',
+        release_date: '2022-01-12',
+        profile_url: 'https://www.mmobomb.com/pubg',
+    },
+    {
+        id: 508,
+        title: 'Enlisted',
+        thumbnail: 'https://www.mmobomb.com/g/508/thumbnail.jpg',
+        short_description: 'Step into the most famous battles of World War II in Enlisted, a free-to-play shooter from the makers of War Thunder. Experience squad-based combat from the ground level, as you command your troops, outfitted with era-authentic weapons and gear, in massive battles with over a hundred soldiers apiece.',
+        game_url: 'https://www.mmobomb.com/open/enlisted',
+        genre: 'Shooter',
+        platform: 'PC (Windows)',
+        publisher: 'Gaijin Entertainment',
+        developer: 'Darkflow Software',
+        release_date: '2021-04-08',
+        profile_url: 'https://www.mmobomb.com/enlisted',
+    },
+    {
+        id: 1120,
+        title: 'Fall Guys',
+        thumbnail: 'https://www.mmobomb.com/g/1120/thumbnail.jpg',
+        short_description: 'Fall Guys is a free-to-play massively multiplayer party royale game.',
+        game_url: 'https://www.mmobomb.com/open/fall-guys',
+        genre: 'Battle Royale',
+        platform: 'PC (Windows)',
+        publisher: 'Mediatonic',
+        developer: 'Mediatonic',
+        release_date: '2020-08-04',
+        profile_url: 'https://www.mmobomb.com/fall-guys',
+    },
+    {
+        id: 340,
+        title: 'Game Of Thrones Winter Is Coming',
+        thumbnail: 'https://www.mmobomb.com/g/340/thumbnail.jpg',
+        short_description: 'Fame and glory await you in Westeros, in Game of Thrones: Winter Is Coming, the officially licensed free-to-play browser game based on the epic fantasy series by George R.R. Martin.',
+        game_url: 'https://www.mmobomb.com/open/game-of-thrones-winter-is-coming',
+        genre: 'Strategy',
+        platform: 'Web Browser',
+        publisher: 'GTArcade',
+        developer: 'YOOZOO Games ',
+        release_date: '2019-11-14',
+        profile_url: 'https://www.mmobomb.com/game-of-thrones-winter-is-coming',
+    },
+    {
+        id: 427,
+        title: 'Drakensang Online',
+        thumbnail: 'https://www.mmobomb.com/g/427/thumbnail.jpg',
+        short_description: 'Drakensang Online is a free to play 3D action RPG game that features extraordinary 3D graphics and effects and heralds the next generation of free-to-play online browser games. With the ability to customize your character, skills and magic powers like never before, join your comrades to wage a brutal war against evil.',
+        game_url: 'https://www.mmobomb.com/open/drakensang-online',
+        genre: 'MMORPG',
+        platform: 'Web Browser',
+        publisher: 'Bigpoint',
+        developer: 'Bigpoint',
+        release_date: '2011-08-08',
+        profile_url: 'https://www.mmobomb.com/drakensang-online',
+    },
+    {
+        id: 380,
+        title: 'Dark Orbit Reloaded',
+        thumbnail: 'https://www.mmobomb.com/g/380/thumbnail.jpg',
+        short_description: 'Take part in huge intergalactic battles and take on the whole galaxy in DarkOrbit, the free-to-play browser-based space combat MMO from Bigpoint -- now in 3-D! Choose your faction and your ship, each with their own strengths, and take off into adventure!',
+        game_url: 'https://www.mmobomb.com/open/darkorbit',
+        genre: 'Shooter',
+        platform: 'Web Browser',
+        publisher: 'Bigpoint',
+        developer: 'Bigpoint',
+        release_date: '2006-12-11',
+        profile_url: 'https://www.mmobomb.com/darkorbit',
+    },
+    {
+        id: 1122,
+        title: 'MultiVersus',
+        thumbnail: 'https://www.mmobomb.com/g/1122/thumbnail.jpg',
+        short_description: 'Match up in 1v1, 2v2 co-op, or 4-person free-for-all modes in this free-to-play Smash-Style Brawler!',
+        game_url: 'https://www.mmobomb.com/open/multiversus',
+        genre: 'Fighting',
+        platform: 'PC (Windows)',
+        publisher: 'Warner Bros. Games',
+        developer: 'Player First Games',
+        release_date: '2022-07-19',
+        profile_url: 'https://www.mmobomb.com/multiversus',
+    },
+    {
+        id: 5,
+        title: 'Crossout',
+        thumbnail: 'https://www.mmobomb.com/g/5/thumbnail.jpg',
+        short_description: 'Trick out your ride and take to the post-apocalyptic roads for battle in Crossout, the free-to-play vehicular combat game from Gaijin Entertainment! Featuring a vehicle design system with endless customization and fast-paced, armor-crunching combat, Crossout offers high-octane excitement in brief and explosive matches.',
+        game_url: 'https://www.mmobomb.com/open/crossout',
+        genre: 'Shooter',
+        platform: 'PC (Windows)',
+        publisher: 'Targem',
+        developer: 'Gaijin',
+        release_date: '2017-05-30',
+        profile_url: 'https://www.mmobomb.com/crossout',
+    },
+];
 function createGameCardStr(game) {
     const {
         title,
@@ -37,7 +169,14 @@ function createGameCardStr(game) {
 
 function createCardElement(game) {
     const cardElement = document.createElement('li');
+    cardElement.setAttribute('id', game.id);
     cardElement.classList.add('card');
+    cardElement.addEventListener('click', (event) => {
+        const currentUrl = window.location.href;
+        const endUrl = currentUrl.split('/');
+        endUrl[endUrl.length - 1] = `game.html?${event.currentTarget.id}`;
+        window.location.href = endUrl.join('/');
+    });
     cardElement.insertAdjacentHTML('afterbegin', createGameCardStr(game));
     return cardElement;
 }
@@ -51,6 +190,27 @@ function filterGames(gamesArr) {
     });
 }
 
+function saveFilter() {
+    localStorage.setItem('filters', JSON.stringify({
+        genre: document.querySelector('[data-filter-select="genre"]').value,
+        platform: document.querySelector('[data-filter-select="platform"]').value,
+        isNewGame: document.querySelector('[data-age-games="new"]').checked,
+        isOldGame: document.querySelector('[data-age-games="old"]').checked,
+        searchTerm: document.querySelector('[data-filter-search]').value,
+    }));
+}
+
+function loadFilter() {
+    const storedFilters = JSON.parse(localStorage.getItem('filters'));
+    if (storedFilters) {
+        document.querySelector('[data-filter-select="genre"]').value = storedFilters.genre;
+        document.querySelector('[data-filter-select="platform"]').value = storedFilters.platform;
+        document.querySelector('[data-age-games="new"]').checked = storedFilters.isNewGame;
+        document.querySelector('[data-age-games="old"]').checked = storedFilters.isOldGame;
+        document.querySelector('[data-filter-search]').value = storedFilters.searchTerm;
+    }
+}
+
 function markedSearchText(search, originString) {
     if (search === '') return originString;
     const regex = new RegExp(search, 'ig');
@@ -97,16 +257,17 @@ function getGames(url, place) {
                 return response.json();
             }
         })
-        .then((result) => result.slice(0, 50))
+        // .then((result) => result.slice(0, 50))
         .then((result) => result.map((game) => {
             const copyGame = { ...game };
             copyGame.small_description = `${game.short_description.slice(0, 52)}...`;
             return copyGame;
         }))
-        .catch((error) => {
-            place.insertAdjacentHTML('afterbegin', `<span class="error-message">Something went wrong! ERROR: ${error.message}</span>`);
-            console.log('get error', error);
-        })
+        .catch(() => mocGames.map((game) => {
+            const copyGame = { ...game };
+            copyGame.small_description = `${game.short_description.slice(0, 52)}...`;
+            return copyGame;
+        }))
         .finally(() => loadingSwitch(false));
 }
 
@@ -127,6 +288,8 @@ async function applyFilter(url, place) {
         renderCards(place, markedTextFilterArrGames);
     } catch (e) {
         console.log('filter error: ', e);
+    } finally {
+        saveFilter();
     }
 }
 
@@ -151,6 +314,8 @@ function attachHandlers(url, place) {
 async function init() {
     const urlGames = 'https://mmo-games.p.rapidapi.com/games';
     const CARDS_LIST = document.querySelector('[data-cards]');
+    loadFilter();
+    applyFilter(urlGames, CARDS_LIST);
     try {
         const games = await getGames(urlGames, CARDS_LIST);
         if (!Array.isArray(games)) throw new Error('is not Array');
diff --git a/docs/IgorFromUA/styles/filter.css b/docs/IgorFromUA/styles/filter.css
index c499b248..89ac5368 100644
--- a/docs/IgorFromUA/styles/filter.css
+++ b/docs/IgorFromUA/styles/filter.css
@@ -1,12 +1,16 @@
 .filter {
+  width: 100%;
+  color: #FFF;
+  background: #221F1F;
+}
+
+.filter__wrapper {
   display: flex;
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
   column-gap: 10px;
   row-gap: 20px;
-  color: #FFF;
-  background: #221F1F;
   padding-top: 12px;
   padding-bottom: 12px;
   font-size: 14px;
diff --git a/docs/IgorFromUA/styles/game.css b/docs/IgorFromUA/styles/game.css
new file mode 100644
index 00000000..4a4eafc9
--- /dev/null
+++ b/docs/IgorFromUA/styles/game.css
@@ -0,0 +1,168 @@
+.card {
+  width: 100%;
+  margin: 20px auto;
+  padding: 5px 10px;
+  background-color: #FFF;
+  border-radius: 8px;
+  box-shadow: 0 0 10px rgba(239, 73, 52, .5);
+}
+
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+}
+
+.card-header__link, .back-btn {
+  padding: 6px 10px;
+  font-size: 12px;
+  color: #FFF;
+  background: #EF4934;
+  border: none;
+  border-radius: 6px;
+  text-decoration: none;
+  white-space: nowrap;
+}
+
+.back-btn:hover, .card-header__link:hover {
+  box-shadow: 0 0 20px rgba(239, 73, 52, .8);
+}
+
+.img-container {
+  flex: 1 1 640px;
+}
+
+.card__img {
+  width: 100%;
+  height: auto;
+  border-radius: 4px;
+  object-fit: cover;
+}
+
+.description__title {
+  font-size: 24px;
+  color: #333;
+  text-align: center;
+}
+
+.status {
+  font-size: 16px;
+  color: #28A745;
+}
+
+.card__description {
+  flex: 1 2 480px;
+  font-size: 18px;
+  color: #555;
+  line-height: 1.6;
+}
+
+.card__actors {
+  flex-basis: 320px;
+  font-size: 12px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.card__actor {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  flex-wrap: nowrap;
+  border-radius: 4px;
+  background: #ECECEC;
+  padding: 8px;
+  flex-grow: 1;
+}
+
+.screenshots {
+  margin-top: 20px;
+}
+
+.screenshot {
+  flex-basis: calc(33.33% - 10px);
+  margin-bottom: 10px;
+  overflow: hidden;
+}
+
+.screenshot img {
+  width: 100%;
+  height: auto;
+  border-radius: 4px;
+  transition: transform .2s ease-in-out;
+  cursor: pointer;
+}
+
+.screenshot img:hover {
+  transform: scale(1.1);
+}
+
+@media (min-width: 480px) {
+
+  .card-content {
+    padding: 10px 20px;
+  }
+}
+
+@media (min-width: 768px) {
+
+  .back-btn, .card-header__link {
+    font-size: 16px;
+  }
+
+  .description__title {
+    font-size: 36px;
+  }
+
+  .img-container {
+    display: flex;
+    gap: 20px;
+  }
+
+  .card__actors {
+    font-size: 14px;
+    flex-direction: column;
+  }
+
+
+  .card__actor {
+    flex-direction: row;
+  }
+
+
+  .screenshots {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+  }
+}
+
+@media (min-width: 1024px) {
+
+  .card-section {
+    display: flex;
+    justify-content: space-around;
+    gap: 20px;
+  }
+
+  .img-container {
+    display: block;
+  }
+
+  .card__actors {
+    flex-direction: row;
+    font-size: 16px;
+    margin-top: 8px;
+  }
+
+  .card__actor {
+    flex-direction: column;
+  }
+
+  .card__description {
+    position: relative;
+    top: -25px;
+  }
+}
diff --git a/docs/IgorFromUA/styles/games.css b/docs/IgorFromUA/styles/games.css
index 854600fd..bb4a6fcd 100644
--- a/docs/IgorFromUA/styles/games.css
+++ b/docs/IgorFromUA/styles/games.css
@@ -25,6 +25,8 @@
 
 .card__img {
   width: 90px;
+  height: 90px;
+  object-fit: cover;
   margin: auto 0;
 }
 
diff --git a/docs/IgorFromUA/styles/header.css b/docs/IgorFromUA/styles/header.css
index 8cbe4b0f..ff623ff3 100644
--- a/docs/IgorFromUA/styles/header.css
+++ b/docs/IgorFromUA/styles/header.css
@@ -1,10 +1,13 @@
 .header {
   width: 100%;
+  background: #EF4934;
+}
+
+.header__wrapper {
   height: 80px;
   display: grid;
   grid-template-columns: min-content min-content;
   justify-content: space-between;
-  background: #EF4934;
 }
 
 .header__logo, .navigation {
diff --git a/docs/IgorFromUA/styles/loading-spin.css b/docs/IgorFromUA/styles/loading-spin.css
index 8ccd3ba1..16a207f3 100644
--- a/docs/IgorFromUA/styles/loading-spin.css
+++ b/docs/IgorFromUA/styles/loading-spin.css
@@ -5,6 +5,8 @@
 
 .loading__spin {
   display: inline-block;
+  position: relative;
+  top: 50px;
   width: 50px;
   height: 50px;
   border: 3px solid rgba(255, 213, 0, .3);
diff --git a/docs/IgorFromUA/styles/styles.css b/docs/IgorFromUA/styles/styles.css
index e550a978..670affe5 100644
--- a/docs/IgorFromUA/styles/styles.css
+++ b/docs/IgorFromUA/styles/styles.css
@@ -20,6 +20,8 @@ ul, li {
 }
 
 .container {
+  display: inherit;
+  max-width: 1280px;
   min-width: 400px;
   padding-left: 25px;
   padding-right: 25px;
