/**
 *
 * TABLE OF CONTENTS
 *
 * 1. Overall
 * 2. Side column
 *  2.1 Logo
 *  2.2 Info
 * 3. Content column
 *  3.1 Filter
 *  3.2 Photos
 *  3.3 Tweets
 *
 */

/**
 * 1. Overall
 */
html,
body {
  font: 12px/16px Verdana, Helvetica, Arial, Geneva, sans-serif;
  background: #ffffff;
  height: 100%;
}

a {
  color: #0085cc;
}

body.backchannel {
  overflow-y: hidden;
}

#container,
#backchannel {
  clear: both;
}

#powered-by {
  position: absolute;
  right: 10px;
  top: 10px;
}

#powered-by td {
  vertical-align: middle;
  padding: 0 0 0 20px;
}

/**
 * 2. Side column
 */

#side-column {
  width: 341px;
  float: left;
}
 
#side-column.iam-backchannel {
  width: 404px;
}

/**
 * 2.1 Logo
 */

#logo {
  width: 312px;
  margin: 0 auto;
}

#circles {
  margin: 40px 0;
}

/**
 * 2.2 Info
 */

#backchannel #info {
  padding: 20px;
}

#info {
  font-weight: bold;
  font-size: 14px;
  line-height: 20px;
  margin: 0 0 30px 0;
}

#side-column object {
  margin: 0 0 10px 0;
}

/**
 * 3 Content column
 */

#content-column {
  float: left;
}

.column {
  width: 384px;
  overflow: hidden;
  float: left;
  margin: 40px 18px 0 18px;
}

.column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.column li {
  border: 2px solid #f1eee8;
  padding: 10px;
  margin: 10px 0;
  background: #ffffff;
}

.column li.freshheads {
  background: url(../images/icon-fh.png) no-repeat right bottom #009fda;
}

.column .date {
  padding: 10px 0 0 0;
  clear: both;
  color: #cccccc;
}

.column li.freshheads .date {
  color: #ffffff;
}

.column .source-flickr {
  background-image: url(../images/icon-flickr.png);
}

.column .source-moby {
  background-image: url(../images/icon-moby.png);
}

.column .source-picasa {
  background-image: url(../images/icon-picasa.png);
}

.column .source-youtube {
  background-image: url(../images/icon-youtube.png);
}

.column .source-vimeo {
  background-image: url(../images/icon-vimeo.png);
}

/**
 * 3.1 Filter
 */

#filter {
  padding: 10px;
  background: #ffffff;
  width: 357px;
  float: right;
  margin: 0 20px 0 0;
}

#filter input {
  width: 285px;
  height: 22px;
  padding: 0 0 0 5px;
  margin: 0;
  border: 1px solid #cccccc;
}

input#filter-submit {
  border: none;
  width: 57px;
  height: 24px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  display: block;
  float: right;
  text-indent: 57px;
  line-height: 24px;
  background: url(../images/buttons.png) no-repeat;
}

/**
 * 3.2 Photos
 */

#photos {
}

#photos img {
  display: block;
}

#photos .image {
  width: 360px;
  background: url(../images/image-background.png) no-repeat;
}

#photos li.freshheads a {
  color: #ffffff;
}

#photos a[class|=source] {
  display: block;
  padding: 10px 20px 0 0;
  line-height: 16px;
  color: #000000;
  text-decoration: none;
  background-position: right center;
  background-repeat: no-repeat;
}

/**
 * 3.3 Tweets
 */

#tweets {
}

#tweets img {
  width: 48px;
  height: 48px;
  float: left;
}

#tweets .tweet {
  margin: 0 0 0 58px;
}

#tweets li.freshheads .tweet {
  color: #ffffff;
}

#tweets .tweet a {
  color: #0085cc;
  font-weight: bold;
  text-decoration: none;
}

#tweets li.freshheads .tweet a {
  color: #ffffff;
}

#tweets .tweet a.author {
  display: block;
}

#tweets .date a {
  color: #cccccc;
}

/**
 * 3.3 videos
 */

#videos {
}

#videos a[class|=source] {
  display: block;
  padding: 10px 20px 0 0;
  line-height: 16px;
  color: #000000;
  text-decoration: none;
  background-position: right center;
  background-repeat: no-repeat;
}