diff --git a/aperisolve/static/css/aperisolve.css b/aperisolve/static/css/aperisolve.css
index 5ce52ed..3d9920b 100644
--- a/aperisolve/static/css/aperisolve.css
+++ b/aperisolve/static/css/aperisolve.css
@@ -492,7 +492,9 @@ footer {
 
 @media screen and (min-width: 1800px) {
     footer {
-        position: fixed;
+        margin: 20px;
+        z-index: 1;
+        position:relative ;
         bottom: 0;
         right: 0;
         left: auto;
@@ -518,13 +520,13 @@ footer a i {
     white-space: nowrap;
     text-decoration: none;
     color: inherit;
-    transform: translateY(-15px);
+    transform: translateY(0px);
 }
 
 .title-text-footer {
     color: #ccff66;
     text-shadow: 0 0 5px #ccff66;
-    font-size: 2.5rem;
+    font-size: 1.25rem;
     font-weight: 700;
     line-height: 1;
 }
diff --git a/aperisolve/templates/base.html b/aperisolve/templates/base.html
index 673e77b..014d9c1 100644
--- a/aperisolve/templates/base.html
+++ b/aperisolve/templates/base.html
@@ -12,8 +12,9 @@
   <link href="/static/css/aperisolve.css" rel="stylesheet" />
 </head>
 
-<body class="text-light">
-  <div id="three-bg"></div>
+<body class="text-light d-flex flex-column min-vh-100">
+<div id="three-bg"></div>
+<main class="flex-grow-1">
   <div class="container mt-5">
     <a class="title_link" href="/">
       <img src="/static/img/logo.svg" alt="logo" id="water-logo"/>
@@ -39,6 +40,7 @@
 	</script>
   <script type="module" src="/static/js/background.js"></script>
   {% block footer_content %} {% endblock %}
+</main>
   {% include "footer.html" %}
 </body>