title: css getting changed when applying css media queries for responsive design
body: <p>I am applying css media queries for my website to work both in mobile as well laptop.
  I m using following media query for mobile </p>
  
  <pre><code>@media only screen and (min-device-width : 321px) and (max-device-width:480px)
  </code></pre>
  
  <p>and following for laptop</p>
  
  <pre><code>@media only screen and (min-device-width: 1100px)
  </code></pre>
  
  <p>Issue is when i apply my first query for mobile,and second one for laptop,mobile UI is correct but the laptop UI is showing different results.When i remove mobile css from my list,and keeps only second query css.laptop UI is correct.</p>
  
  <p>Please guide me where i m doing wrong...</p>