Stylesheet-Auswahl nach breite des Bildschirms

Guten Morgen!

Ich habe für ein Unternehmen eine Website mit Themplate aus eigener Hand gestaltet, die über Wordpress läuft. Da diese Seite nun aber auch auf mobilen Endgeräten passend dargestellt werden soll, versuche ich im Head-Abschnitt eine Weiche für die beiden Stylesheets (style.css & stylem.css) einzubauen.

Momentan sieht das ganze so aus:

<meta name="viewport" content="width=device-width; initial-scale=1.0;" />


<link rel="stylesheet" href="wp-content/themes/OfficialBöhm/style.css" type="text/css" media="screen and (min-width: 1200px") />
<link rel="stylesheet" href="wp-content/themes/OfficialBöhm/stylem.css" type="text/css" media="screen and (max-width: 1200px)" />

Ich habe diese Variante in einem leeren PHP-Dokument (zu Testzwecken) ausprobiert, auch mit den beiden CSS-Dateien, da hat es funktioniert.

Besteht die Möglichkeit, dass Wordpress diese Aktion unterbindet, oder einfach nicht bemerkt?

Vielen Dank, LG

Ivan

Ich habe es wie oben auf der eigentlichen Seite hinterlegt, danach mit den Entwicklerwerkzeugen in Firefox getestet, ob er die Stylesheets wechselt, sobald das Fenster kleiner als 1200 px ist, jedoch zieht er die Informationen weiterhin aus der Style.css anstatt der Stylem.css.

Ja die Seite ist online, erreichbar unter http://www.boehm-ottenschlag.at

Die Stylesheets sind nicht in der functions eingebunden, weil es für mich der einfachste weg war, sie direkt im header zu implementieren.

Den Großteil der Fehler habe ich behoben (Vielen Dank fürs Aufzeigen!), jedoch löst das nicht das vorhandene Problem. :-(