@charset "UTF-8";
/******************************************************************************
 ** BrightTALK Dot Com
 ** Copyright BrightTALK Ltd, 2008.
 ** All Rights Reserved.
 ** $Id: carousel.css 14548 2010-07-21 13:33:42Z kshahzad $
 ******************************************************************************/
/*
 This style sheet is for the carousel on the home page that promotes webcasts.
 */
#carousel {
  position: relative;
  top: 0px;
  visibility: hidden;
}

.items {
  width: 20000em;
  position: absolute;
  clear: both;
  left: 0px; /* IE7 requires this else centers in our layout */
  height: 240px;
  padding-left: 50px;
}

/* next/prev buttons */
.navi {
  background-image: url(images/carousel.png);
  background-position: 0 -7px;
  width: 30px;
  height: 41px;
  float: left;
  margin-top: 93px;
  margin-right: 4px;
}

.navi:hover {
  background-position: 0 -108px;
}

.navi:active {
  background-position: 0 -209px;
}

.next {
  background-position: -86px -7px;
  clear: right;
  margin-left: 18px;
}

.next:hover {
  background-position: -86px -108px;
}

.next:active {
  background-position: -86px -209px;
}

.navi.disabled {
  visibility: hidden;
}

/* the thumbnail scrollable */
#thumbnails {
  position: relative;
  overflow: hidden;
  float: left;
  width: 676px;
  height: 240px;
  margin: 0px 15px;
}

#thumbnails .items div {
  padding: 5px;
  float: left;
}

#thumbnails .items div.page {
  padding: 0px;
  float: none;
}

#thumbnails .items .item canvas, #thumbnails .items .item img + img {
  position: relative;
  top: 5px;
}

#thumbnails .items .slide, #thumbnails .items .tooltip .slide a {
  height: 78px;
  width: 107px;
}

#thumbnails .items .slide, #thumbnails .items .tooltip .slide {
  background: url('images/carousel.png') no-repeat -405px -163px;
}


/** ACTION **/

#thumbnails .action .slide {
  background: url('images/carousel.png') no-repeat -40005px -300px; /* -256px -300px; */
}

#thumbnails .items .action .slide {
  margin-top: 18px;
  color: #66CC00;
}

#thumbnails .action .slide a {
  display: block;
  width: 85px;
  height: 60px;
  color: #909090;
  font-size: 9.5pt;
  padding: 10px;
  text-decoration: none;
  text-align: center;
}

#thumbnails .action .slide a:hover {
  color: #6C0;
}


/*********/

#thumbnails .items .item {
  margin-right: 9px;
  padding-top: 56px;
}

#thumbnails .items .item .slide {
  clear: both;
}

#thumbnails .items .item .slide img {
  width: 100px;
  height: 75px;
  overflow: hidden;
}

#thumbnails .items .start, #thumbnails .items .item .item-rating {
  position: relative;
  clear: both;
  padding: 0;
  margin: 0px;
}

#thumbnails .items .start {
  font-size: 8pt;
  padding-left: 9px;
  top: 3px;
}

#thumbnails .items .recorded .start abbr {
  color: #909090;
}

#thumbnails .items .live .start {
  text-indent: -3000px;
  overflow: hidden;
  position: relative;
  background: url('images/carousel.png') no-repeat -403px -123px;
  width: 90px;
}

#thumbnails .items .item .item-rating {
  position: relative;
  top: -3px;
  left: 11px;
}

#thumbnails .items div.rating-stars {
  margin: 0px;
}

#carousel .rating-stars.maxrating5 {
  width: 69px;
}

#carousel .rating-stars.maxrating5,
#carousel .rating-stars .stars span {
  height: 12px;
}

#carousel .rating-stars {
  background: transparent;
}

#carousel .rating-stars .stars span {
  background: url('images/carousel.png') no-repeat -405px 0px;
}

/******** Mouse over ******************/
/* by default display nothing */
#carousel .tooltip {
  display: none;
  height: 240px;
  width: 200px;
  background: transparent url('images/carousel.png') no-repeat -163px 0px;
  border: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}

#carousel .item {
  z-index: 50;
}

#carousel .tooltip {
  z-index: 500;
}

.tooltip .item-rating {
  position: absolute;
  left: -12px;
  top: 0px;
}

.tooltip.upcoming .item-rating, .tooltip.live .item-rating {
  display: none;
}

#thumbnails .items .tooltip .start {
  position: absolute;
  top: 13px;
  text-indent: 0px;
  margin-left: 2px;
}

#thumbnails .items .tooltip.processing .start, #thumbnails .items .tooltip.recorded .start {
  font-size: 9pt;
  left: 108px;
}

#thumbnails .items .tooltip.upcoming .start, #thumbnails .items .tooltip.live .start {
  left: 1px;
  font-size: 11pt;
  font-weight: bold;
  width: 210px;
}

#thumbnails .items .tooltip.live .start {
  color: #FF0000;
  text-indent: 43px;
  background-position: -403px -122px;
}

#thumbnails .items .tooltip.upcoming .start abbr {
  color: #66CC00;
  font-weight: bold;
}

#thumbnails .items .tooltip.live .start abbr {
  color: #FF0000;
  font-weight: bold;
}

.tooltip .title {
  position: absolute;
  top: 27px;
  left: 7px;
  font-size: 10.5pt;
  height: 30px;
  overflow: hidden;
  margin-right: 11px;
}

.tooltip .title a:hover, .tooltip .summits a:hover {
  text-decoration: underline;
}

.tooltip a {
  text-decoration: none;
  outline: none;
}

/* v.specific selector to allow override of background */
#thumbnails .items .tooltip .slide {
  background: transparent;
  left: 39px;
  position: absolute;
  top: 67px;
}

#thumbnails .items .tooltip .slide a {
  color: transparent;
}

.tooltip .presenter, .tooltip .summits {
  font-size: 8.5pt;
  left: 7px;
  position: absolute;
  width: 178px;
}

.tooltip .presenter {
  top: 152px;
  color: #909090;
}

#thumbnails .items .summits div {
  padding: 0px;
}

.tooltip .summits, .tooltip .summits div {
  width: 180px;
}

.tooltip .summits {
  top: 190px;
}

.tooltip .duration {
  position: relative;
  top: 129px;
  left: 35px;
  font-size: 7.5pt;
  background: url(images/carousel.png) no-repeat -404px -56px;
  text-indent: 8px;
  width: 45px;
  white-space: nowrap;
}

.tooltip.upcoming .duration, .tooltip.live .duration {
  top: 130px;
}

.upcoming .item-rating, .live .item-rating {
  display: none;
}
