/* GENERAL ------------------------------------------
 *
 */
#takeover {
  float:left;
  clear:both;
  padding:0;
  margin:0 0 100px 0;
  width:901px;
}
#takeover div.grid {
  float:left;
  clear:both;
  width:100%;
}
#takeover div.grid div.row {
  float:left;
  clear:both;
  width:100%;
}
#takeover div.grid div.row div.wide {
  float:left;
  width:590px;
  padding:0;
  margin:0 20px 0 0;
}
#takeover div.grid div.row div.narrow {
  float:left;
  width:290px;
  padding:0;
  margin:0;
}

a#apply-link {
  padding-top: 8px;
  display: block;
  float: left;
}

/* ARTICLES ------------------------------------------
 *
 */
#takeover div.article {
  float:left;
  clear:both;
  width:100%;
  border-top:2px solid black;
  padding-top:10px;
}
#takeover div.article h3 {
  /* overrides */
  margin:0;
  padding:0;
  width:100%;
  background-image:none;
  font-size:100%;
  line-height:18px;
  height:18px;

  /* true styles */
  font-weight:bold;
  text-transform:uppercase;
  margin-bottom:10px;
}

/* BOXES ------------------------------------------
 *
 */
#takeover div.box {
  /* overrides */
  background: none;
  margin: 0;
  padding: 0;

  /* true styles */
  float:left;
  clear:both;
  width:100%;
}

/* DECK ------------------------------------------
 *
 */
#deck {
  float:left;
  clear:both;
  width:100%;
  margin-top:20px;
}
#deck h2 {
  font-size:16px;
  margin-bottom:20px;
}
#deck p {
  font-size:16px;
  line-height:24px;
  color:#333;
}

/* PROMO ------------------------------------------
 *
 */
#promo {
  float:left;
  clear:both;
  width:250px;
  padding:15px 20px 10px 20px;
  margin:25px 0 20px 0;
  background: none repeat scroll 0 0 #eaeaea;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
#promo p {
  margin-bottom:7px;
  font-size:12px;
  line-height:14px;
}
#promo img {
  float:left;
  width:110px;
  height:83px;
  margin-right:10px;
}

/* BLOG ------------------------------------------
 *
 */
#blog {
  float:left;
  clear:both;
  width:100%;
  margin-bottom:20px;
}
#blog div.entry {
  float:left;
  clear:both;
  width:100%;
  padding-bottom:15px;
  border-bottom:1px dotted #666;
  margin-bottom:20px;
}
#blog div.entry div.art {
  float:left;
  width:200px;
  margin-right:15px;
}
#blog div.entry div.art img {
  width:200px;
  /* height:150px; */
  border:none;
}
#blog div.entry div.copy {
  float:left;
  width:325px;
  padding-right:50px;
}
#blog div.entry div.copy h5 a {
  color:black;
}

/* TWITTER ------------------------------------------
 *
 */
#twitter {
  float:left;
  clear:both;
  width:100%;
  margin-bottom:20px;
}
#twitter ul {
  list-style-type:none;
  float:left;
  clear:both;
  width:100%;
  padding:0;
  margin:0;
}
#twitter ul li.tweet {
  display:block;
  float:left;
  width:285px;
  padding-bottom:10px;
  border-bottom:1px dotted #ccc;
}
#twitter ul li.tweet span.timestamp {
  color:#ccc;
  font-size:11px;
}
#twitter ul li.tweet.odd {
  margin-right:20px;
}
#twitter span.more {
  display:block;
  float:left;
  width:250px;
  background: url("../../../TED2012/images/twitter-icon.png") no-repeat scroll 0 3px white;
  padding-left:20px;
}

/* QUOTES ------------------------------------------
 *
 */
#takeover div.quote {
  float: left;
  clear:both;
  width:100%;
  margin-bottom:20px;
}
#takeover div.quote span.quotation {
  font-size:52px;
  margin-top:13px;
  margin-right:5px;
}
#takeover div.quote span.text {
  font-size:16px;
  font-weight:bold;
  width:233px;
}
#takeover div.quote div.transcription {
  float:left;
  clear:both;
  width:260px;
  padding:15px 20px 20px 10px;
  background: none repeat scroll 0 0 #eaeaea;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
#takeover div.quote div.transcription span {
  display:block;
  float:left;
}
#takeover div.quote div.attribution {
  float:left;
  clear:both;
  width:215px;
  margin:0px 0 0 60px;
  padding:5px 0 0 30px;
  font-style:italic;
  background: url("../../../TED2012/images/quote-tail.png") no-repeat 0 0 white;
}

.quote em {
  float: right;
  font-size:.8em;
  font-weight: normal;
}

#hidden-quotes {
  display: none;
}

/* AD ------------------------------------------
 *
 */
div.box#ad {
  margin-bottom: 20px;
}
#ad img {
  width:290px;
  height:350px;
  margin:0;
}

/* SHARING ------------------------------------------
 *
 */
#share-facebook {
  clear: left;
  padding: 0;
  margin: 0;
}
#share-facebook .connect_widget .connect_widget_sample_connection {
  padding-right: 1px !important;
  padding-top: 1px !important;
}

/* CAROUSEL ------------------------------------------
 *
 */
#carousel ul {
  margin:0 0 1em 0;
}
#carousel .col {
  float:left;
}

div.matrix.carousel {
  background: #000;
  margin-bottom: 30px;
}
div.matrix.carousel ul li {
  position: relative;
}
div.matrix.carousel .col {
  width: 50%;
  *width: 450px; /*ie 7*/
  margin:0;
}
div.matrix.carousel .col img {
  width: 100%;
}
div.matrix.carousel .col .brick {
  color: #fff;
  padding: 20px 72px 0 20px;
}
div.matrix.carousel.small .col .brick {
  padding: 14px 36px 0 16px;
}
div.matrix.carousel .brick p.extra {
  font-size:12px;
}
div.matrix.carousel .brick p.credit {
  font-size: 12px;
  color:gray;
  font-style:italic;
}
div.matrix.carousel a.prev,
div.matrix.carousel a.next {
  position: absolute;
  top: 0;
  display: block;
  width: 36px;
  height: 100%;
  border: 0;
  background: url("https://www.ted.com/css/i/iconArrowLeftWhite.png") no-repeat 50% 50%;
  background: rgba(0, 0, 0, 0.35) url("https://www.ted.com/css/i/iconArrowLeftWhite.png") no-repeat 50% 50%;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#59000000,endColorstr=#59000000)";
  /* IE8 */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#59000000,endColorstr=#59000000);
  /* IE6 & 7 */
  zoom: 1;
  text-indent: -5000px;
  overflow: hidden;
  z-index: 2; }
div.matrix.carousel a.prev:hover {
  background-color: rgba(0, 0, 0, 0.55);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#8C000000,endColorstr=#8C000000)";
  /* IE8 */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#8C000000,endColorstr=#8C000000);
  /* IE6 & 7 */ }
div.matrix.carousel a.next {
  right: 0;
  background: url("https://www.ted.com/css/i/iconArrowRightWhite.png") no-repeat 50% 50%;
  background: rgba(255, 255, 255, 0.15) url("https://www.ted.com/css/i/iconArrowRightWhite.png") no-repeat 50% 50%;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#26FFFFFF,endColorstr=#26FFFFFF)";
  /* IE8 */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#26FFFFFF,endColorstr=#26FFFFFF);
  /* IE6 & 7 */ }
div.matrix.carousel a.next:hover {
  background-color: rgba(255, 255, 255, 0.25);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3FFFFFFF,endColorstr=#3FFFFFFF)";
  /* IE8 */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#3FFFFFFF,endColorstr=#3FFFFFFF);
  /* IE6 & 7 */ }
div.matrix.carousel .brick h4 {
  padding: 0;
  margin: 0 0 10px 0;
  border: 0;
  font-size: 20px;
  font-weight:normal;
  color: #999;
}
div.matrix.carousel.small .brick h4 {
  font-size: 16px;
}
div.matrix.carousel .brick h3 {
  /* overrides */
  margin:0;
  padding:0;
  width:100%;
  background-image:none;
  font-size:100%;
  color:white;
  display:block;

  line-height:26px;
  font-size: 22px;
  padding: 0 0 30px 0;
  margin-bottom: 16px;
}
div.matrix.carousel.small .brick h3 {
  font-size: 18px;
}
div.matrix.carousel .brick p,
div.matrix.carousel .brick li {
  font-family: arial;
  font-size: 14px;
}
div.matrix.carousel.small .brick p,
div.matrix.carousel.small .brick li {
  font-size: 12px;
}
div.matrix.carousel .brick p.extra {
  font-size:12px;
}
div.matrix.carousel .brick p span {
  color: #999;
}
div.matrix.carousel ul.nav {
  position: absolute;
  bottom: 0px;
  left: 52.3%; }
div.matrix.carousel ul.nav li {
  float: left;
  display: inline;
  margin-right: 2px;
  padding: 0; }
div.matrix.carousel ul.nav li a {
  cursor: pointer;
  display: block;
  width: 10px;
  height: 10px;
  background: url("https://www.ted.com/images/reboot/hero_nav.gif") no-repeat;
  text-indent: -99999px;
}
div.matrix.carousel ul.nav li.selected a {
  cursor: default;
  background: url("https://www.ted.com/images/reboot/hero_nav.gif") no-repeat -10px 0;
}

#flickr_images {
  float:left;
  clear:both;
  width:100%;
  min-height:130px;
  margin-bottom:10px;
}
#flickr_images a img {
  display:block;
  float:left;
  width:71px;
  height:71px;
  margin-bottom:1px;
}

#takeover p span.photo-menu-item {
  color:#bbb;
}
