core: Make RSS-Bridge more usable via mobile devices

Adds styles for display sizes smaller than 768px where
elements are currently hardly usable. Note that RSS-Bridge
is not designed for mobile use, but some users may want
to try things on their mobile phone before using it in
real life applications.

Resolves #796

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%;
+	}
+
+}