title: What is the difference between these two media queries?
body: <p>I am new to using media queries and searched for this on google but i just found websites referring to this but no description of what they actually mean.  </p>
  
  <p>What is the difference between this: </p>
  
  <pre><code>@media screen and (max-width: 767px),
  screen and (max-device-width: 767px)
  </code></pre>
  
  <p>And: </p>
  
  <pre><code>@media screen and (max-width: 767px) 
  </code></pre>
  
  <p>What is the difference between these two? Does the first one target page content width and device width or all orientations (horizontal or vertical)? I am confused here.</p>