title: IE9 ignoring media queries
body: <p>This is my first attempt at developing a responsive site. It's working fine in all browsers but IE9. I know that IE9 is compatible with media queries. I checked to see if compatibility mode was turned off and I don't see the icon visible so I believe that it is. My media queries are listed below the base styles. I'll just paste in a few media queries below so that I don't exceed any character limits. Let me know if you need to see more. Note: The doc type is for html5.</p>
  
  <p><strong>Media Queries:</strong></p>
  
  <pre><code>@media only screen and (max-width: 479px) {
    /* 320 =================================================== */
  
    header .logo a {
      background:url(../images/logo-320.png) no-repeat;
      width:213px;
      height:69px;
      float:left;
      margin-top:35px;
      display:block;
  }
  
  }
  
  @media only screen and (max-width: 480px) {
      header {min-width:100%;}
  
      .main-link-wrap {
      width:100%;
      margin:0 auto;
  }
  
      .featured-prod {
          width:100%; 
      }
  
      footer {
          min-width:100%;
  }
  
  }
  
  @media only screen and (min-width: 480px) {
    /* 480 =================================================== */
  
      header .logo a {
      background:url(../images/logo-480.png) no-repeat;
      width:310px;
      height:94px;
      float:left;
      margin-top:5px;
      display:block;
  }
  
  .featured-prod .product-box {
      width:185px;    
      margin-left:1.8%;
      margin-right:1.8%;
      text-align:left;
      color:#282828;
      font-size:12px;
      font-size:1.2rem;
      line-height:13px;
      float:left;
  }
  
  footer .address {
      font-size:22px;
      line-height:32px;   
  }
  
  }
  </code></pre>