diff --git a/templates/media/index.html b/templates/media/index.html
index 962f60e..1ae15a1 100644
--- a/templates/media/index.html
+++ b/templates/media/index.html
@@ -2,10 +2,19 @@
 <html lang="en">
 <head>
     <title>media-roller</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"
           integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
+    <style>
+        body {
+            background-color: #43464a;
+        }
+        .container {
+            height: 100vh;
+        }
+    </style>
 </head>
-<body style="background-color: #43464a">
+<body>
 <div class="container d-flex flex-column text-light text-center">
     <div class="flex-grow-1"></div>
     <div class="jumbotron bg-transparent flex-grow-1">
diff --git a/templates/media/response.html b/templates/media/response.html
index 794a647..9b19516 100644
--- a/templates/media/response.html
+++ b/templates/media/response.html
@@ -2,10 +2,19 @@
 <html lang="en">
 <head>
     <title>media-roller</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"
           integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
+    <style>
+        body {
+            background-color: #43464a;
+        }
+        .container {
+            height: 100vh;
+        }
+    </style>
 </head>
-<body style="background-color: #43464a">
+<body>
 <div class="container d-flex flex-column text-light text-center">
     <div class="flex-grow-1"></div>
     <div class="jumbotron bg-transparent flex-grow-1">
