title: How to fix blurry image
body: <p>I created this test landing page using bootstrap: <a href="http://ubersnap.netai.net" rel="nofollow">http://ubersnap.netai.net</a></p>
  
  <p>If you visit the site and look at the iPhone screenshot you will see you can hardly read the text on the screen.</p>
  
  <p>However, if you just resize the browser window and maximize the windows back to its original size, it is 100% sharp.</p>
  
  <p>Why is this happening? Is there any way to make the picture be sharp the first time it loads instead of resizing the browser window?</p>
  
  <p>The image is a GIF if that makes any difference.</p>