max width and height for player.php video

player.php

@@ -15,8 +15,10 @@ $loop = ($_GET['loop'] != "0");
         <a id="loop0" href="<?php echo $params; ?>&amp;loop=0"<?php if (!$loop) echo ' style="font-weight: bold"'; ?>>[play once]</a>
         <a id="loop1" href="<?php echo $params; ?>&amp;loop=1"<?php if ($loop) echo ' style="font-weight: bold"'; ?>>[loop]</a>
     </div>
-    <video controls<?php if ($loop) echo ' loop'; ?> src="<?php echo htmlspecialchars($_GET['v']); ?>">
+    <div id="playercontent">
-        Your browser does not support HTML5 video.
+        <video controls<?php if ($loop) echo ' loop'; ?> src="<?php echo htmlspecialchars($_GET['v']); ?>">
-    </video>
+            Your browser does not support HTML5 video. <a href="<?php echo htmlspecialchars($_GET['v']); ?>">[Download]</a>
+        </video>
+    </div>
 </body>
 </html>

playerstyle.css

@@ -1,19 +1,38 @@
 body {
     background: black;
     color: white;
-}
+    margin: 0px;
-video {
-    display: block;
-    margin-left: auto;
-    margin-right: auto;
 }
 #playerheader {
+    position: absolute;
+    left: 0px;
+    right: 0px;
+    top: 0px;
+    height: 24px;
+    padding: 0px 4px;
     text-align: right;
+    font-size: 16px;
 }
 #playerheader a {
     color: white;
     text-decoration: none;
 }
-span.settings {
+span.settings div {
-    position: relative;
+    background: black;
+    z-index: 1;
+    padding-right: 4px;
+}
+#playercontent {
+    position: absolute;
+    left: 0px;
+    right: 0px;
+    top: 24px;
+    bottom: 0px;
+}
+video {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    max-width: 100%;
+    max-height: 100%;
 }

settings.js

@@ -17,7 +17,7 @@ setDefault("videomuted", false);
 var settingsMenu = document.createElement("span");
 settingsMenu.className = "settings";
 settingsMenu.innerHTML = '<span>[Settings]</span>'
-    + '<div style="display: none; text-align: left; position: absolute; right: 0px; margin-left: -999em;">'
+    + '<div style="display: none; text-align: left; position: absolute; right: 0px; margin-left: -999em; margin-top: -1px;">'
     + '<label><input type="checkbox" name="videoexpand">Expand videos inline</label><br>'
     + '<label><input type="checkbox" name="videohover">Play videos on hover</label><br>'
     + '<label><input type="checkbox" name="videomuted">Open videos muted</label><br>'