Update screenshots with new UI, iPhone/iOS.

Update the screenshots to show the new user interface and mobile
device support.

Move the old demo videos to the bottom and shrink them slightly.

screenshots.html

@@ -56,58 +56,71 @@
     <p>See <a href="index.html">homepage</a> and
        <a href="http://github.com/kanaka/noVNC/blob/master/README.md">README</a> for more info.
 
-    <p> noVNC is designed to be easily integrated into other websites
-    so my focus is on function with minimal fluff. So yes, my
-    screenshots are pretty boring. If you have a cool shot of noVNC in
-    action, put it on flickr (or wherever) and let
-    <a href="http://github.com/inbox/new/kanaka">me</a> know and if
-    I like it I'll add it here. </p>
+<br/>
+<br/>
 
+<img src="img/noVNC-5.png"><br/>
+The default theme.
+
+<br/>
+<br/>
 <br/>
 
-<object width="615" height="480"><param name="movie" value="http://www.youtube.com/v/icVpGOvh4tc&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/icVpGOvh4tc&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="615" height="480"></embed></object><br/>
-A very quick 42 second demo.
+<img src="img/noVNC-6.png"><br/>
+The black/green theme showing the settings menu.
+
+<br/>
+<br/>
+<br/>
+
+<img src="img/noVNC-7.jpg"><br/>
+Connected to <em>Xtightvnc</em> running an Ubuntu Gnome desktop with
+firefox, gnomine, gnome-terminal, and AisleRiot/sol (Klondike). Yes,
+that's firefox running "inside" of Chrome. The hand button in the
+upper left appears when using viewport cliping. Clicking the hand
+enables viewport panning.
 
 <br/>
 <br/>
 <br/>
 
-<object width="853" height="480"><param name="movie" value="http://www.youtube.com//v/i9GauBAaQXI&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com//v/i9GauBAaQXI&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="853" height="480"></embed></object><br/>
-A longer (2:15) demo that shows downloading the noVNC repository, installing tightvncserver, creating an SSL certificate, and some of the noVNC settings that are available.
+<img src="img/noVNC-8.jpg"><br/>
+Connected to the same remote system using an iPad 2. Notice the mouse and
+keyboard buttons in the upper left for selecting the active mouse
+button and for toggling the on-screen keyboard.
 
 <br/>
 <br/>
 <br/>
 
-<img src="img/noVNC-1.jpg"><br/>
-The default (boring) style. After loading noVNC before connecting to anything.
+<img src="img/noVNC-9.jpg"><br/>
+Flipping the iPad to portrait mode while connected. noVNC
+automatically adjusts.
 
 <br/>
 <br/>
 <br/>
 
-<img src="img/noVNC-2.jpg"><br/>
-noVNC is connected to <em>Xtightvnc</em> running a Ubuntu Gnome desktop with
-firefox, gnomine, gnome-terminal, and AisleRiot/sol (Klondike). Yes,
-that's firefox running "inside" of Chrome.
+<img src="img/noVNC-10.png"><br/>
+Connected to the same remote system using an iPhone 3G. It's slow and
+the screen real-estate is constrained (lots of viewport panning) but
+noVNC on the iPhone is fully functional.
 
 <br/>
 <br/>
 <br/>
 
-<img src="img/noVNC-3.png"><br/>
-noVNC using the black styling from
-<a href="http://github.com/kevinykchan">Kevin Chan</a>. Not connected.
+<object width="615" height="480"><param name="movie" value="http://www.youtube.com/v/icVpGOvh4tc&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/icVpGOvh4tc&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="615" height="480"></embed></object><br/>
+A very quick 42 second demo. The version of noVNC shown here is over
+a year old. The current version has a much better interface and
+styling.
 
 <br/>
 <br/>
 <br/>
 
-<img src="img/noVNC-4.png"><br/>
-noVNC using the black style. Connected to tty1 via <em>linuxvnc</em>
-(exports a tty/console to VNC clients). The console has github loaded
-in <em>lynx</em>. The glitching near the bottom is due to
-<em>linuxvnc</em>.
+<object width="711" height="400"><param name="movie" value="http://www.youtube.com//v/i9GauBAaQXI&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com//v/i9GauBAaQXI&amp;hl=en_US&amp;fs=1?rel=0&amp;border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="711" height="400"></embed></object><br/>
+A longer (2:15) demo that shows downloading the noVNC repository, installing tightvncserver, creating an SSL certificate, and some of the noVNC settings that are available. Again this is an old version of noVNC.
 
 <br/>
 <br/>