diff --git a/src/css/style.css b/src/css/style.css
index 9a21c9d..9dd210c 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -188,4 +188,9 @@ pre {
 
 .section-header {
     text-align: center;
+}
+
+.centered {
+    text-align: center;
+    width: 100%;
 }
\ No newline at end of file
diff --git a/src/flow/code-1.html b/src/flow/code-1.html
index d820959..a89a80a 100644
--- a/src/flow/code-1.html
+++ b/src/flow/code-1.html
@@ -55,17 +55,11 @@
                         <div class="card-stacked">
                             <div class="card-content">
                                 <h6>1. Build the Authorization URL</h6>
-        
-                                <pre class="code-block"><code><span id="baseUrl"></span>?
-            &<span id="responseType"></span>
-            &<span id="clientId"></span>
-            &<span id="redirectUri"></span>
-            &<span id="scope"></span>
-            &<span id="state"></span></code></pre>
+                                <pre class="code-block"><code id="requestUriExample"></code></pre>
                                 <h6>Let's break it down...</h6>
                                 <ul class="collection">
                                     <li class="collection-item">
-                                        <p><b><span id="baseUrlExpl"></span></b>
+                                        <p><b><span id="baseUrl"></span></b>
                                         </p>
                                         <p>URL of the authorization endpoint on the server. How is this path constructed will
                                             differ between OAuth providers (such as Keycloak or Okta). to
@@ -75,31 +69,31 @@
                                         </p>
                                     </li>
                                     <li class="collection-item">
-                                        <p><b><span class="emphasis">response_type</span>=<span id="responseTypeExpl"></span></b></p>
+                                        <p><b><span class="emphasis">response_type</span>=<span id="responseType"></span></b></p>
                                         <p>OAuth 2.0 response type. In this case, we are using the Authorization Code flow, so
                                             we are requesting the authorization code.</p>
                                     </li>
                                     <li class="collection-item">
-                                        <p><b><span class="emphasis">client_id</span>=<span id="clientIdExpl"></span></b></p>
+                                        <p><b><span class="emphasis">client_id</span>=<span id="clientId"></span></b></p>
                                         <p>Client ID of the application. This is a public identifier for the client, and it is
                                             used by the authorization server to identify the application
                                             when redirecting the user back to the client.</p>
                                     </li>
                                     <li class="collection-item">
-                                        <p><b><span class="emphasis">redirect_uri</span>=<span id="redirectUriExpl"></span></b></p>
+                                        <p><b><span class="emphasis">redirect_uri</span>=<span id="redirectUri"></span></b></p>
                                         <p>Redirect URI of the client. This is the URL that the authorization server will
                                             redirect the user back to after the user has logged in and
                                             granted permissions. The redirect URI must match one of the URIs registered for the
                                             client ID.</p>
                                     </li>
                                     <li class="collection-item">
-                                        <p><b><span class="emphasis">scope</span>=<span id="scopeExpl"></span></b></p>
+                                        <p><b><span class="emphasis">scope</span>=<span id="scope"></span></b></p>
                                         <p>Scopes requested by the client. Scopes are used to limit the access of the access
                                             token. In this case, we are requesting the offline_access scope,
                                             which allows the client to obtain a refresh token.</p>
                                     </li>
                                     <li class="collection-item">
-                                        <p><b><span class="emphasis">state</span>=<span id="stateExpl"></span></b></p>
+                                        <p><b><span class="emphasis">state</span>=<span id="state"></span></b></p>
                                         <p>State parameter. This is an optional parameter that the client can use to maintain
                                             state between the request and callback. The authorization
                                             server includes this parameter when redirecting the user back to the client,
@@ -116,10 +110,13 @@
                     </div>
                 </div>
             </div>
+            <div class="section centered">
+                <a href="/">[ Take me home ]</a>
+            </div>
         </div>
     </main>
     <footer class="page-footer"></footer>
-    <script src="js/load-layout.js"></script>
+    <script src="../js/load-layout.js"></script>
     <script>
         function setCookie(name, value, minutes) {
             const date = new Date();
@@ -143,6 +140,23 @@
                 + "&" + "state=" + state;
         }
 
+        function fillExample() {
+            const requestExample = baseUrl + "\n"
+                + "    ?response_type=" + responseType + "\n"
+                + "    &client_id=" + clientId + "\n"
+                + "    &redirect_uri=" + redirectUri + "\n"
+                + "    &scope=" + scope + "\n"
+                + "    &state=" + state;
+            
+            $("#requestUriExample").text(requestExample);
+            $("#baseUrl").text(baseUrl);
+            $("#responseType").text(responseType);
+            $("#clientId").text(clientId);
+            $("#redirectUri").text(redirectUri);
+            $("#scope").text(scope);
+            $("#state").text(state);
+        }
+
         function getRedirectUri() {
             return window.location.protocol + "//" + window.location.host + "/flow/code-2";
         }
@@ -154,22 +168,8 @@
         const scope = "offline_access";
         const state = generateSessionState();
 
-console.debug(window.location);
-
+        fillExample();
         $("#sendRequestBtn").attr("href", constructRequestUrl());
-
-        $("#baseUrl").text(baseUrl);
-        $("#baseUrlExpl").text(baseUrl);
-        $("#responseType").text("response_type=" + responseType);
-        $("#responseTypeExpl").text(responseType);
-        $("#clientId").text("client_id=" + clientId);
-        $("#clientIdExpl").text(clientId);
-        $("#redirectUri").text("redirect_uri=" + redirectUri);
-        $("#redirectUriExpl").text(redirectUri);
-        $("#scope").text("scope=" + scope);
-        $("#scopeExpl").text(scope);
-        $("#state").text("state=" + state);
-        $("#stateExpl").text(state);
     </script>
 </body>
 </html>
diff --git a/src/flow/code-2.html b/src/flow/code-2.html
index 63cf2f2..188328b 100644
--- a/src/flow/code-2.html
+++ b/src/flow/code-2.html
@@ -85,10 +85,13 @@
                     </div>
                 </div>
             </div>
+            <div class="section centered">
+                <a href="/">[ Take me home ]</a>
+            </div>
         </div>
     </main>
     <footer class="page-footer"></footer>
-    <script src="js/load-layout.js"></script>
+    <script src="../js/load-layout.js"></script>
     <script>
         $("#queryParams").text(window.location.search)
 
diff --git a/src/flow/code-3.html b/src/flow/code-3.html
index 5e7f549..26f9e81 100644
--- a/src/flow/code-3.html
+++ b/src/flow/code-3.html
@@ -97,10 +97,13 @@
                     </div>
                 </div>
             </div>
+            <div class="section centered">
+                <a href="/">[ Take me home ]</a>
+            </div>
         </div>
     </main>
     <footer class="page-footer"></footer>
-    <script src="js/load-layout.js"></script>
+    <script src="../js/load-layout.js"></script>
     <script>
         const tokenEndpoint = 'https://sso.rumbuddy.cz/realms/OAuthPlayground/protocol/openid-connect/token';
         const clientID = 'oauth-playground';
diff --git a/src/js/load-layout.js b/src/js/load-layout.js
index b47dd02..60bfff8 100644
--- a/src/js/load-layout.js
+++ b/src/js/load-layout.js
@@ -1,2 +1,2 @@
-$(".page-footer").load("layout/footer.html");
-$("#page-header").load("layout/header.html");
\ No newline at end of file
+$(".page-footer").load("/layout/footer.html");
+$("#page-header").load("/layout/header.html");
\ No newline at end of file
diff --git a/src/layout/footer.html b/src/layout/footer.html
index 19fb74c..3b38310 100644
--- a/src/layout/footer.html
+++ b/src/layout/footer.html
@@ -1,38 +1,44 @@
-<div class="container">
-    <div class="row">
-        <div class="col l6 s12">
-            <h5 class="white-text">OAuth Playground</h5>
-            <p class="grey-text text-lighten-4">This playground serves as an interactive platform designed to
-                familiarize developers and students with the
-                intricacies of OAuth authentication processes. Beyond just theoretical knowledge, this playground
-                provides practical insights into the OAuth token exchange,
-                callback handling, and potential pitfalls or challenges one might face during real-world
-                integrations. The ultimate aim is to bolster
-                understanding and confidence in implementing OAuth, ensuring secure and efficient user
-                authentication and authorization
-                in modern web applications.
-            </p>
+<div>
+    <footer class="page-footer">
+        <div class="container">
+            <div class="row">
+                <div class="col l6 s12">
+                    <h5 class="white-text">OAuth Playground</h5>
+                    <p class="grey-text text-lighten-4">This playground serves as an interactive platform designed to
+                        familiarize developers and students with the
+                        intricacies of OAuth authentication processes. Beyond just theoretical knowledge, this playground
+                        provides practical insights into the OAuth token exchange,
+                        callback handling, and potential pitfalls or challenges one might face during real-world
+                        integrations. The ultimate aim is to bolster
+                        understanding and confidence in implementing OAuth, ensuring secure and efficient user
+                        authentication and authorization
+                        in modern web applications.
+                    </p>
+                </div>
+                <div class="col l4 offset-l2 s12">
+                    <h5 class="white-text">Links</h5>
+                    <ul>
+                        <li><a class="grey-text text-lighten-3" href="https://www.oauth.com/" target="_blank">OAuth 2.0
+                                Simplified</a></li>
+                        <li><a class="grey-text text-lighten-3" href="https://en.wikipedia.org/wiki/OAuth"
+                                target="_blank">OAuth
+                                Wikipedia</a></li>
+                        <li><a class="grey-text text-lighten-3" href="https://www.ietf.org/rfc/rfc6749.txt"
+                                target="_blank">OAuth 2.0 RFC</a></li>
+                    </ul>
+                </div>
+            </div>
         </div>
-        <div class="col l4 offset-l2 s12">
-            <h5 class="white-text">Links</h5>
-            <ul>
-                <li><a class="grey-text text-lighten-3" href="https://www.oauth.com/" target="_blank">OAuth 2.0
-                        Simplified</a></li>
-                <li><a class="grey-text text-lighten-3" href="https://en.wikipedia.org/wiki/OAuth" target="_blank">OAuth
-                        Wikipedia</a></li>
-                <li><a class="grey-text text-lighten-3" href="https://www.ietf.org/rfc/rfc6749.txt"
-                        target="_blank">OAuth 2.0 RFC</a></li>
-            </ul>
+        <div class="footer-copyright">
+            <div class="container">
+                © 2023 Y Soft Corporation (
+                <a class="grey-text text-lighten-4" style="color:#FF6600 !important; font-weight:bold;"
+                    href="https://github.com/m0rsalis" target="_blank">m0rsalis</a> and
+                <a class="grey-text text-lighten-4" style="color:#FF6600 !important; font-weight:bold;"
+                    href="https://github.com/xRodney/" target="_blank">xRodney</a> )
+                <a class="grey-text text-lighten-4 right" style="color:#FF6600 !important; font-weight:bold;"
+                    href="https://www.daretothinkbyg.com" target="_blank">Join us today!</a>
+            </div>
         </div>
-    </div>
-</div>
-<div class="footer-copyright">
-    <div class="container">
-        © 2023 Y Soft Corporation (
-            <a class="grey-text text-lighten-4" style="color:#FF6600 !important; font-weight:bold;" href="https://github.com/m0rsalis" target="_blank">m0rsalis</a> and 
-            <a class="grey-text text-lighten-4" style="color:#FF6600 !important; font-weight:bold;"
-                href="https://github.com/xRodney/" target="_blank">xRodney</a>)
-        <a class="grey-text text-lighten-4 right" style="color:#FF6600 !important; font-weight:bold;"
-            href="https://www.daretothinkbyg.com" target="_blank">Join us today!</a>
-    </div>
+    </footer>
 </div>