rpg page has well-behaved footer

src/static/css/demo.css

@@ -8,25 +8,27 @@
 a {
     text-decoration: none;
 }
+    p {
+        text-indent: 2em;
+    }
 .nav-grid img {
     height: 100%;
     width: 100%;
 }
 
-#wrap {
-    padding-bottom: 2.5rem;
-}
-
 footer {    
+    padding: 1px;
     position: absolute;
-  bottom: 0;
-  width: 100%;
-  height: 2.5rem;
-    color: aqua;
+    bottom: 1em;
+    right: 1em;
+    width: auto;
+    text-align: right;
+    color: #df85a5;
+    background-color: transparent;
 }
 
 .grid {
-    height: 100vh;
+    height: auto;
     width: 100vw;
     display: grid;
     position: relative;

src/views/demo.tpl

@@ -16,6 +16,7 @@
             <div class="center"><h2>what about blessfrey?</h2>
             <img src="/static/img/prom/BlessFREY_logo.png" alt="(link: BLESSFREY" class="logo">
             jump to <a href="#demo">demo</a> • <a href="#controls">controls</a> • <a href="#system">system</a> • <a href="#story">story</a> • <a href="#characters">characters</a> • <a href="#info">info</a><br>
+            <br>
             <p>Blessfrey is a 2D dungeoncrawling action rpg for PC developed by me (chimchooree) in Godot Engine inspired by Guild Wars 1 and Magic: The Gathering. I'll share any release demos on this page. <br></p>
             <!--<h2>controls</h2>
             <ul>

src/views/footer.tpl

@@ -1,6 +1,4 @@
 <!--Footer-->
     <footer>
-        <div class="footer-content">
             &#169; chimchooree 2020-{{year}}<br>
-        </div>
     </footer>

src/views/frame.tpl

@@ -17,10 +17,10 @@
 
 {{!base}}
 
-</div>
-
 % include('footer.tpl')
 
+</div>
+
 </body>
 
 </html>