Added first-run infographic screens for IT2Me and Me2Me.

remoting/webapp/main.css

 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file.
  */
 
 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
 blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
 font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl,
 dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,
 tfoot, thead, tr, th, td, button {
@@ skipping 201 matching lines @@
 }
 
 h1.icon-label {
   vertical-align: 14px;
   margin-bottom: 60px;
   font-size: 28px;
   font-weight: 300;
   color: #aaa;
   font-family: "Open sans", "Ariel", sans-serif;
   line-height: 24px;
+  display: inline-block;
+  margin-__MSG_@@bidi_start_edge__: 10px;
 }
 
 h2 {
   font-size: 16px;
   line-height:24px;
   font-weight: normal;
   color: #222;
 }
 
 section > h2 {
@@ skipping 16 matching lines @@
 }
 
 section {
   width: 690px;
   margin: 30px auto;
   border: 1px solid #e5e5e5;
   background: #f9f9f9;
   padding: 20px 30px 20px 30px;
   border-radius: 3px;
   box-shadow: 0 2px 5px rgba(0,0,0,0.07);
+  position: relative;
 }
 
 
 .access-code-digit-group {
   /*
     Used for each of the four-digit components of the access code as
     displayed by the host.
   */
   padding: 0px 6px;
 }
@@ skipping 29 matching lines @@
 .error-state {
   background-image: url('icon_warning.png');
   background-repeat: no-repeat;
   background-position: top __MSG_@@bidi_start_edge__;
   padding-__MSG_@@bidi_start_edge__: 30px;
   padding-top: 5px;
   color: #900;
 }
 
 .expiring {
-    color: #900 !important;
+  color: #900 !important;
 }
 
-.icon-label {
-  display: inline-block;
-  vertical-align: top;
-  margin-__MSG_@@bidi_start_edge__: 10px;
+.infographic {
+  position: absolute;
+  right: 22px;
+  top: 24px;
 }
 
+.infographic-description {
+  height: 80px;
+  width: 400px;
+  padding-top: 2em;
+};
+
 .information-box {
   background-color: #f9edbe;
   border: 1px solid #f0c36d;
   -webkit-border-radius: 2px;
   -webkit-box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
   color: #222;
   padding: 8px 16px;
   text-align: center;
   font-size: 12px;
 }
@@ skipping 188 matching lines @@
   box-sizing: border-box;
 }
 
 /*
  * Setting hidden on elements that match some rule overriding 'display' doesn't
  * do what you would expect unless this is made explicit (and !important).
  */
 [hidden] {
   display: none !important;
 }