title: How is the main image height always approximately 75% of the window size?
body: <p><a href="http://www.apple.com/sg/" rel="nofollow">http://www.apple.com/sg/</a></p>
  
  <p>there is a giant image that will autosize such that it is always approximately 75% of the window height.</p>
  
  <p>How is this done?</p>
  
  <p>I found a css media query, but I can only discover this one:</p>
  
  <pre><code>@media only screen and (max-width: 1068px), only screen and (max-height: 800px) {
     .page-home .billboard.evergreen {
         height: 50%;
         min-height: 630px;
      }
  }
  </code></pre>
  
  <p>How do I find out about the other media queries for different resolutions?</p>