/*  =============================================================================
    Home Page Hero
    =============================================================================   */
header.hero {
  background: transparent url("//imgssl.constantcontact.com/lp/images/standard/bv2/devportal/hero_bg.jpeg") no-repeat left top;
  height: 280px;
  padding: 30px 40px 0;
  position: relative;
  z-index: 1;
  /* Hero content with CTA */
  /* Hero Featured Apps Carousel */ }
  header.hero div.left {
    width: 585px; }
    header.hero div.left h1 {
      color: white;
      font: 600 40px "myriad-pro", "Myriad Pro", Arial, sans-serif; }
    header.hero div.left h2 {
      color: #404040;
      font: 400 18px "myriad-pro", "Myriad Pro", Arial, sans-serif; }
    header.hero div.left .button {
      margin: 5px 0 0 30px;
      padding: 22px 30px 20px; }
  header.hero figure.right {
    background: transparent url("//imgssl.constantcontact.com/lp/images/standard/bv2/devportal/featuredapps_bg.png") no-repeat left top;
    height: 205px;
    margin-right: -31px;
    width: 325px;
    /* Carousel implementation styles */ }
    header.hero figure.right .carousel-screen {
      height: 100px;
      margin: 70px 0 0 36px;
      overflow: hidden;
      padding: 0;
      width: 250px; }
    header.hero figure.right ul.carousel-nav {
      list-style: none;
      margin: 5px 0 0 0;
      padding: 0;
      text-align: center; }
      header.hero figure.right ul.carousel-nav li {
        display: inline-block; }
        header.hero figure.right ul.carousel-nav li a {
          cursor: pointer;
          display: inline-block;
          background: #d8f2ff;
          border-radius: 6px;
          border: 2px solid #aaddf2;
          text-indent: -9000px;
          height: 8px;
          width: 8px; }
        header.hero figure.right ul.carousel-nav li.current a, header.hero figure.right ul.carousel-nav li a:hover {
          background: #aaddf2;
          border: 2px solid #aaddf2; }
        header.hero figure.right ul.carousel-nav li.current a {
          cursor: default; }
      header.hero figure.right ul.carousel-nav li + li {
        margin-left: 5px; }

/*  =============================================================================
    Home Page Content
    =============================================================================   */
div.content {
  padding: 0 40px 50px; }
  div.content ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    /* CTA Box - "What...", "Where...", "How..." */
    /* Icon list (escalate to widget) */ }
    div.content ul.box {
      border-radius: 5px;
      -webkit-box-shadow: 0px 0px 100px #ebf8fd inset;
      box-shadow: 0px 0px 100px #ebf8fd inset;
      background-color: white;
      border: 1px solid #e9e9e9;
      padding: 20px;
      position: relative;
      margin: -40px 0 50px;
      z-index: 1; }
      div.content ul.box li {
        color: #565656;
        font: 400 15px/21px "myriad-pro", "Myriad Pro", Arial, sans-serif;
        margin-right: 40px;
        max-width: 250px;
        text-align: center; }
        div.content ul.box li.last {
          margin-right: 0; }
    div.content ul.icon-list li {
      background: transparent url("//imgssl.constantcontact.com/lp/images/standard/bv2/devportal/arrows_blue.png") no-repeat left top;
      float: left;
      font: 14px/1.4 "myriad-pro", "Myriad Pro", Arial, sans-serif;
      line-height: 20px;
      margin: 0 0 20px 50px;
      padding-left: 25px;
      width: 145px; }
  div.content li {
    margin: 0;
    padding: 0; }
