diff --git a/static/index.css b/static/index.css
index fcbe31a..466de4c 100644
--- a/static/index.css
+++ b/static/index.css
@@ -297,10 +297,10 @@
 
 .headerblock {
     width: clamp(60rem, 65% , 140rem);
-    height: clamp(10rem, 20%, 10rem);
+    height: 10rem;
     padding: 1rem;
-    margin-left: 0rem;
-    border-color: #000000;
+    margin-left: 0;
+    border-color: black;
     border-radius: 0;
     border: none;
     box-shadow: 1em 1em 0em 0px rgba(186, 65, 166, 0.7);
@@ -311,7 +311,6 @@
     flex-direction: column;
     background-color: rgb(0 0 0 / 85%);
     box-sizing: border-box;
-    margin-top: 2rem;
 }
 
 .headerblock:hover {
@@ -519,9 +518,14 @@
 body {
     background-image: url(/static/imgs/bg.gif);
     width: 100vw;
-    height: 100vh;
+    height: calc(100dvh - 2rem);
     margin: 0;
     background-size: cover;
+    padding-top: 2rem;
+}
+
+body > .container {
+    height: calc(100% - 12rem);
 }
 
 a {
diff --git a/templates/utils/_head.html b/templates/utils/_head.html
index cac95c9..da0cf11 100644
--- a/templates/utils/_head.html
+++ b/templates/utils/_head.html
@@ -2,6 +2,7 @@
     <link rel="stylesheet" href="{{ url_for('static', filename='index.css') }}">
     <script src="{{ url_for('static', filename='scripts/animation.js') }}"></script>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 {%- if request.path != url_for('index') %}
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/base16/ros-pine-moon.min.css">