A bunch of changes to make the design more responsive to all screen sizes - mobile, desktop and tablet.

* Start with a slight refactor of the CSS and DOM.
* Vertical center content when content is smaller than the screen size.
* Constrain email addresses and show ellipsis if emails overflow box width.  Make sure width is updated when browser window size changes or user changes the screen direction of their device.
* If form/email address list is taller than available form area, show scroll bar on desktop or expand contents so that entire app must be scrolled on mobile.
* If dialog opened on a tablet or large desktop window, add a gradient to the left size of the white area that matches the gradient on the arrow.
* On mobile, footer should always be at the very bottom of the screen unless contents overflow screen height, where it will be pushed off the bottom of the screen.

Things to test and be aware of:
* Dialog should respond to various screen sizes when resizing browser window on desktop.
* IE8 does not support media queries so narrowing the browser window will not force the dialog into "mobile" mode.
* Contents in the "form area", wait, delay, or error screens should always be vertically centered.
* IE6/IE7 should still see the unsupported dialog with the correct layout (untested on checkin due to #1390)
* Wide emails should always be constrained to the screen width on mobile or box width on desktop.  The layout should respond to changes in device orientation.
* The box surrounding the emails should show a scroll bar on desktop/tablet if there are more emails the available screen height.  On mobile, the entire screen height should expand so that the entire app must be scrolled.
* On mobile, the footer should always be at the very bottom of the screen unless the form area takes up more vertical space than the device height.

issue #1101
issue #1317