diff --git a/formats/HtmlFormat.php b/formats/HtmlFormat.php
index fefabf03..687c1f4f 100644
--- a/formats/HtmlFormat.php
+++ b/formats/HtmlFormat.php
@@ -95,6 +95,7 @@ EOD;
+
{$title}
diff --git a/static/HtmlFormat.css b/static/HtmlFormat.css
index 5b9fd2e1..4ebc79e9 100644
--- a/static/HtmlFormat.css
+++ b/static/HtmlFormat.css
@@ -96,3 +96,20 @@ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockq
button:hover {
background: #49afff;
}
+
+@media screen and (max-width: 767px) {
+
+ section {
+ width: 100%;
+ padding: 0;
+
+ }
+
+ button {
+ display: inline-block;
+ width: 40%;
+ padding: 5px auto;
+ margin: 3px auto 0;
+ }
+
+}
diff --git a/static/style.css b/static/style.css
index 4abf9f96..7fd1ee40 100644
--- a/static/style.css
+++ b/static/style.css
@@ -199,6 +199,7 @@ form {
.parameters label {
text-align: right;
+ line-height: 1.5em;
}
.parameters label::before {
@@ -303,3 +304,54 @@ h5 {
.advice > li {
text-align: left;
}
+
+@media screen and (max-width: 767px) {
+ body {
+ font-size: 75%;
+ }
+
+ header > section.warning {
+ width: 90%;
+ }
+
+ header > section.critical-warning {
+ width: 90%;
+ }
+
+ .searchbar {
+ width: 90%;
+ margin: 0 auto;
+ }
+
+ section {
+ width: 90%;
+ margin: 10px auto;
+ overflow: hidden;
+ }
+
+ button {
+ display: inline-block;
+ width: 40%;
+ padding: 5px auto;
+ margin: 3px auto 0;
+ }
+
+ @supports (display: grid) {
+
+ .parameters {
+ grid-template-columns: auto auto;
+ grid-column-gap: 5px;
+ }
+
+ .parameters label {
+ line-height: 2em;
+ word-break: break-word;
+ }
+
+ } /* @supports (display: grid) */
+
+ .secure-warning {
+ width: 100%;
+ }
+
+}
\ No newline at end of file