diff --git a/responsive.less b/responsive.less
index 700bdc10..4bddc4ed 100644
--- a/responsive.less
+++ b/responsive.less
@@ -4,105 +4,107 @@
 	left for it.
 */
 
-div#mw-head {
-	position: static !important; /* stylelint-disable-line declaration-no-important */
-	margin-top: 0.5em;
-}
+@media screen and ( max-width: @deviceWidthTablet ) {
+	div#mw-head {
+		position: static !important; /* stylelint-disable-line declaration-no-important */
+		margin-top: 0.5em;
+	}
 
-/* Move the panel to the bottom and display it as in-line lists */
-div#mw-navigation {
-	div#mw-panel {
-		display: table;
-		position: static;
-		table-layout: fixed;
-		width: 100%;
-		overflow: hidden;
-		font-size: 150%;
-
-		.portal {
-			display: block;
+	/* Move the panel to the bottom and display it as in-line lists */
+	div#mw-navigation {
+		div#mw-panel {
+			display: table;
+			position: static;
+			table-layout: fixed;
 			width: 100%;
-		}
+			overflow: hidden;
+			font-size: 150%;
 
-		ul li {
-			list-style: none;
+			.portal {
+				display: block;
+				width: 100%;
+			}
+
+			ul li {
+				list-style: none;
+			}
 		}
 	}
-}
 
-/* Hide the logo and tabs */
-div#p-logo {
-	display: none;
-}
-
-/* Rearrange various page elements to fill the now-available space */
-body div#footer {
-	margin-left: 0;
-	padding-top: 0;
-
-	/* don't need these in the footer either... */
-	li#footer-info-lastmod,
-	li#footer-info-viewcount {
+	/* Hide the logo and tabs */
+	div#p-logo {
 		display: none;
 	}
-}
-div#p-personal {
-	display: table;
-	position: relative;
-	width: 100%;
-	top: inherit;
-	left: inherit;
-	right: inherit;
 
-	ul {
+	/* Rearrange various page elements to fill the now-available space */
+	body div#footer {
+		margin-left: 0;
+		padding-top: 0;
+
+		/* don't need these in the footer either... */
+		li#footer-info-lastmod,
+		li#footer-info-viewcount {
+			display: none;
+		}
+	}
+	div#p-personal {
+		display: table;
+		position: relative;
+		width: 100%;
+		top: inherit;
+		left: inherit;
+		right: inherit;
+
+		ul {
+			padding-left: 0;
+		}
+	}
+	div#right-navigation {
+		position: absolute;
+		top: inherit;
+		right: 0;
+		margin-top: 0;
+		float: none;
+	}
+	div#left-navigation {
+		position: absolute;
+		top: inherit;
+		margin: 0;
+		display: block;
+		float: none;
+	}
+	div#p-namespaces,
+	div#p-views,
+	div#p-variants {
+		position: relative;
+		top: 2.5em;
+	}
+	div#p-namespaces {
 		padding-left: 0;
 	}
-}
-div#right-navigation {
-	position: absolute;
-	top: inherit;
-	right: 0;
-	margin-top: 0;
-	float: none;
-}
-div#left-navigation {
-	position: absolute;
-	top: inherit;
-	margin: 0;
-	display: block;
-	float: none;
-}
-div#p-namespaces,
-div#p-views,
-div#p-variants {
-	position: relative;
-	top: 2.5em;
-}
-div#p-namespaces {
-	padding-left: 0;
-}
-div#p-cactions {
-	top: 2.5em;
-	float: right;
-}
-div#p-search {
-	float: none;
-	position: absolute;
-	right: 0;
-	width: 100vw;
-	margin: 0;
-}
-div#simpleSearch {
-	margin: 0 3em;
-	width: 80vw;
-	padding: 0;
-}
-div.vectorMenu div.menu {
-	left: inherit;
-	right: -1px;
-}
-div#content {
-	/* Hide the 1px blue border on the left side */
-	border-left: 0;
-	margin-left: 0;
+	div#p-cactions {
+		top: 2.5em;
+		float: right;
+	}
+	div#p-search {
+		float: none;
+		position: absolute;
+		right: 0;
+		width: 100vw;
+		margin: 0;
+	}
+	div#simpleSearch {
+		margin: 0 3em;
+		width: 80vw;
+		padding: 0;
+	}
+	div.vectorMenu div.menu {
+		left: inherit;
+		right: -1px;
+	}
+	div#content {
+		/* Hide the 1px blue border on the left side */
+		border-left: 0;
+		margin-left: 0;
+	}
 }
diff --git a/skin.json b/skin.json
index ea745a9e..9f09a939 100644
--- a/skin.json
+++ b/skin.json
@@ -45,11 +45,9 @@
 		"skins.vector.styles.responsive": {
 			"targets": [ "desktop", "mobile" ],
 			"position": "top",
-			"styles": {
-				"responsive.less": {
-					"media": "screen and (max-width: 768px)"
-				}
-			}
+			"styles": [
+				"responsive.less"
+			]
 		},
 		"skins.vector.js": {
 			"scripts": [