title: How do I combine two media queries?
body: <p>How do I combine two media queries? One is for smaller devices and one for bigger devices, but only in portrait mode!</p>
  
  <pre><code> @media only screen 
  and (min-device-width : 320px) 
  and (max-device-width : 480px) 
  and (orientation : landscape){
  #div {margin-top: 20px;}
  }
  
  }
  @media only screen 
  and (min-device-width : 481px) 
  and (max-device-width : 1024px) 
  and (orientation : portrait){
  {margin-top: 20px;}
  }
  </code></pre>