text: /**
   * Copyright (c) 2014 Famous Industries, Inc.
   * 
   * Permission is hereby granted, free of charge, to any person obtaining a 
   * copy of this software and associated documentation files (the "Software"), 
   * to deal in the Software without restriction, including without limitation 
   * the rights to use, copy, modify, merge, publish, distribute, sublicense, 
   * and/or sell copies of the Software, and to permit persons to whom the 
   * Software is furnished to do so, subject to the following conditions:
   * 
   * The above copyright notice and this permission notice shall be included in 
   * all copies or substantial portions of the Software.
   * 
   * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 
   * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 
   * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 
   * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 
   * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 
   * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS 
   * IN THE SOFTWARE.
   *
   * @license MIT
   */
  
  
  /**
   * Surface
   * ---------
   *
   * A Famo.us Surface is loosely coupled to an HTML <div> on screen. A Surface
   * can take in any valid HTML as content.
   *
   * A popular question to ask is, when should I create multiple surfaces, versus
   * populating a single surface with more HTML content? The answer hinges on animating
   * content, versus static content. If your content is dynamically changing, create
   * a Surface for it. If your content is static (or rarely changing) HTML,
   * populate a Surface with it.
   *
   * In this example, a single surface with
   * some properties is set and add to the render tree.
   */
  define(function(require, exports, module) {
      var Engine  = require("famous/core/Engine");
      var Surface = require("famous/core/Surface");
  
      var mainContext = Engine.createContext();
  
      var surface = new Surface({
          size: [200, 200],
          content: "Hello World",
          classes: ["red-bg"],
          properties: {
              lineHeight: "200px",
              textAlign: "center"
          }
      });
  
      mainContext.add(surface);
  });
  