/**
 * Node style: Homepage (includes touts in right column)
 */

/* =========================================================
 * Markup strategy
 * ---------------------------------------------------------

   Hero items
     h2.fly-title
     p.headline (w/ <strong>)
     div.rubric (w/ paragraphs inside)

   Touts
     p.fly-title
     p.headline
     div.rubric (w/ paragraphs inside)
     div.link

   Highlights
     h3.fly-title
     p.headline (w/ <strong>)
     div.rubric (w/ paragraphs inside)

   News packages
     h3.fly-title
     p.headline (w/ <strong>)
     p.rubric
     h4.link

   Multimedia (A/V) player
     h3.fly-title

 * --------------------------------------------------------- */



/* =========================================================
 * Homepage-wide styles
 * --------------------------------------------------------- */
div.tout .fly-title,
div.homepage-highlight .fly-title,
div.homepage-package .fly-title,
#audiovideo .fly-title {
  margin-bottom: 5px;
  font-size: 1.1em;
  line-height: 1.3em;
}
div.tout .headline,
div.homepage-highlight .headline,
div.homepage-package .headline {
  font-size: 1.4em;
  font-weight: bold;
  line-height: 1.3em;
}
div.tout .rubric,
div.homepage-highlight .rubric,
div.homepage-package .rubric {
  font-size: 1.1em;
  font-weight: normal;
  line-height: 1.3em;
}
div.tout .link,
div.homepage-package .link {
  font-weight: bold;
}
#audiovideo #video {
  height: 478px;
}
/* ---------------------------------------------------------
 * end Homepage-wide styles
 * ========================================================= */


/* =========================================================
 * Super Hero
 * --------------------------------------------------------- */
div#page div#superhero {
  margin-bottom: 15px;
  background: #f0f0f0;
  box-shadow: 0px 5px 5px #ccc;
}
div#superhero .hero-superhero {
  float: left;
}
div#superhero .hero-superhero a {
  outline: none;
}

div#superhero .hero-superhero ul {
  height: 266px;
  padding: 0px;
  position: relative;
  width: 728px;
}
  div#superhero .hero-superhero .hero-media {
    left: 0;
    position: absolute;
    top: 0;
  }
  div#superhero .hero-superhero .hero-media img {
    display: block;
    width: 473px;
    height: 266px;
   }
  div#superhero .hero-superhero .hero-item {
    background: none repeat scroll 0 0 #FFFFFF;
    border-top: 1px solid #F0F0F0;
    border-left: medium none;
    color: #4A4A4A;
    height: auto;
    left: 473px;
    padding: 0;
    position: absolute;
    width: auto;
  }
    div#superhero .hero-superhero .hero-item a.hero-tab {
        color: #4A4A4A;
        display: block;
        height: 41px;
        padding: 12px 10px 13px;
        text-decoration: none;
        width: 233px;
    }
      div#superhero .hero-superhero .hero-item .hero-comment {
        position: absolute;
        top: 12px;
        right: 10px;
      }
        div#superhero .hero-superhero .hero-item .hero-comment a.comment-icon {
          margin: 0;
        }
        div#superhero .hero-superhero .hero-item .hero-comment span {
          background-color: #FFFFFF;
          color: #4a4a4a;
        }
      div#superhero .hero-superhero .hero-item .fly-title {
        width: 199px;
        font: bold 14px/20px Arial,Helvetica,Sans-serif;
        margin: 0px;
      }
      div#superhero .hero-superhero .hero-item .headline {
        font: 18px Georgia,Times,Serif;
      }

  div#superhero .hero-superhero div.hero-item-1 {
    top: 0;
  }
  div#superhero .hero-superhero  div.hero-item-2 {
    top: 67px;
  }
  div#superhero .hero-superhero  div.hero-item-3 {
    top: 134px;
  }
  div#superhero .hero-superhero  div.hero-item-4 {
    top: 201px;
  }
    div#superhero .hero-superhero  div.hero-item-4 a.hero-tab {
      padding: 11px 10px 12px;
    }


  div#superhero .hero-superhero li.selected .hero-item {
    background: #568a9f;
    border-color: #568a9f;
  }
    div#superhero .hero-superhero li.selected .hero-item a {
      color: #FFFFFF;
    }
    div#superhero .hero-superhero li.selected .hero-item .hero-comment span {
      background-color: #568a9f;
    }
    div#superhero .hero-superhero li.selected .hero-item .hero-comment span,
    div#superhero .hero-superhero li.selected .hero-item .fly-title,
    div#superhero .hero-superhero li.selected .hero-item .headline {
      color: #FFFFFF;
    }


div#superhero .cover-image-container {
  float: right;
  position: relative;
  width: 233px;
}
  div#superhero .cover-image-container .cover-image {
    box-shadow: 5px 5px 5px #CCCCCC;
    display: block;
    height: 217px;
    margin: 14px auto 0;
    width: 165px;
  }
    div#superhero .cover-image-container .cover-image img {
      display: block;
    }
  div#superhero .cover-image-container .link-social {
    background: url("/sites/all/themes/econfinal/images/icons/share_icons/gen-share.png") no-repeat scroll 0 0 transparent;
    bottom: 31px;
    position: absolute;
    right: 42px;
    width: 25px;
    cursor: pointer;
    height: 24px;
    text-indent: -9999px;
  }
  div#superhero .cover-image-container ul {
    color: #4a4a4a;
    font-family: Arial, Helvetica, Sans-serif;
    font-size: 14px;
    line-height: 18px;
    margin: 5px auto 0;
    padding: 0px;
    width: 165px;
  }
    div#superhero .cover-image-container li {
      float: left;
    }
    div#superhero .cover-image-container li.last {
      float: right;
    }
    div#superhero .cover-image-container a {
      color: #4a4a4a;
    }
/* ---------------------------------------------------------
 * END Super Hero
 * ========================================================= */


/* =========================================================
 * Left column (highlights)
 * --------------------------------------------------------- */
  div.homepage-highlight {
    margin-bottom: 15px;
  }
      div.homepage-highlight div.rubric p {
        margin-bottom: 10px;
      }
      div.homepage-highlight div.rubric p:last-of-type {
        margin-bottom: 0;
      }

  /* Freeform text */
    div.highlight-text h3.fly-title {
      color: #FF0000;
    }
      div.highlight-text div.rubric a {
        color: #08526D;
      }

  /* Article */
    div.highlight-article-inner {
      padding: 10px 8px 8px 8px;
      background-color: #D9E4E6;
    }
      div.highlight-article h3.fly-title {
        color: #666666;
      }
    div.highlight-article img {
      display: block;
      margin: 0 auto;
    }
/* ---------------------------------------------------------
 * END Left column (highlights)
 * ========================================================= */


/* =========================================================
 * Center column
 * --------------------------------------------------------- */
  #homepage-center-inner {
    padding-left: 9px;
    border-left: 1px solid #E6E6E6;
  }
/* ---------------------------------------------------------
 * END Center column
 * ========================================================= */


/* =========================================================
 * Center column: A/V
 * --------------------------------------------------------- */

#audiovideo {
  border-top: 3px solid #DAE3E8;
  margin-top: 20px;
  margin-bottom: 15px;
  padding-top: 10px;
}

  #audiovideo h3.fly-title {
    margin-bottom: 10px;
  }
    #audiovideo h3.fly-title a {
      color: #FF0000;
    }

  #audiovideo-player {
    margin-bottom: 2px;
  }
    #audiovideo-player object {
      display: block;
      margin: 0 auto;
    }
    #audioedition img {
      display: block;
      margin: 0 auto;
    }
/* ---------------------------------------------------------
 * END Center column: A/V
 * ========================================================= */

/* =========================================================
 * Hero: Video
 * --------------------------------------------------------- */
div#superhero img.video-still {
  position: absolute;
  display: block;
  width: 473px;
  height: 266px;
}
div#superhero .video-overlay {
  position: absolute;
  display: block;
  width: 473px;
  height: 266px;
  background: url('/sites/all/themes/econfinal/images/play-button-gray-65.png') no-repeat center center;
}
div#superhero .video-overlay:hover {
  cursor: pointer;
  background: url('/sites/all/themes/econfinal/images/play-button-gray-80-glow.png') no-repeat center center;
}
html.js div#superhero .video-overlay-loading {
  background: url('/sites/all/themes/econfinal/images/icons/ajax-loader-medium.gif') no-repeat center center !important;
  background-color: #FFF !important;
  opacity: 0.3;
}
/* =========================================================
 * END Hero: Video
 * --------------------------------------------------------- */


/* =========================================================
 * END Hero: Economist Asks
 * --------------------------------------------------------- */