title: Media Queries Not Working in WordPress
body: <p>First post here:</p>
  
  <p>Writing custom code for a WordPress site. The PHP and CSS working fine (both are custom pages created from scratch but properly "plugged in" to WordPress and rendering fine.) Time to start coding for various sizes via Media Queries. But first, a test -- that I can't make work. I've placed media queries inside all ready-confirmed working stylesheet. Things tried/confirmed are not the problem:</p>
  
  <p>• I have the "viewport" code in the head (WordPress's header.php file)</p>
  
  <p>• My media query is AFTER "default" CSS code (see below)</p>
  
  <p>• Tried min-width along with mid-device-width along with @media only screen and @media screen - neither work (nor do its various combinations)</p>
  
  <p>• Triple checked spelling and syntax errors</p>
  
  <p>• Tried putting space around colon (min-width: 1200px) vs (min-width : 1200px) - nothing</p>
  
  <p>• Pre-existing media queries elsewhere within the site are rendering fine in the browser (ie - the header.php, style.css, etc) - but my code is all custom, using unique selectors so shouldn't conflict - just saying "its not the browser"</p>
  
  <p>• Researched on this site and Google answers but nothing appears to work (I am aware of viewport vs device width issues as stated above) -- These "usual suspects" all seem to be non-issue. </p>
  
  <p>So.</p>
  
  <p>What am I missing/doing wrong?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.formtitle {
    font-size: 2.5em;
    color: #000;
    font-weight: bold;
    text-align: center;
    margin-bottom: .5%;
  }
  
  @media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .formtitle {
      font-size: 2.5em;
      color: #f24950;
      font-weight: bold;
      text-align: center;
      margin-bottom: .5%;
    }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="smallform"&gt;
    &lt;span class="formtitle"&gt;Contact Us Today!&lt;/span&gt; [contact-form-7 id="12016" title="DitL Form"]
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>