title: font-size on mobile
body: <p>I am using the HTML5 BoilerPlate.</p>
  
  <p>I want to make the font-size of a certain block small ONLY on mobile devices.</p>
  
  <p>I tried this, but it didn't work:</p>
  
  <pre><code>.searchresult {
      font-size: 0.5em;
      line-height: 1.4;
  }
  @media only screen and (min-width: 480px) {
      .search-result {
          font-size: 1em;
      }
  }
  @media only screen and (min-width: 768px) {
      .search-result {
          font-size: 1em;
      }
  }
  @media only screen and (min-width: 1140px) {
      .search-result {
          font-size: 1em;
      }
  }
  </code></pre>
  
  <p>I thought making it ordinary size under the <code>@media</code> would work, but the font is small on my Mac and mobile.</p>
  
  <p>I'd appreciate any help, thanks!</p>