/*
Theme Name: random($foo)
Theme URI: http://randomfoo.net/
Description: Theme for randomfoo.net
Version: 1.0
Author: Leonard Lin
Author URI: http://randomfoo.net/
Tags: fixed width, two columns 
*/

/*** Global ***/

body {
  margin: 0 20px; border: 0; padding: 0; 
  color: #333;
  font-family: Helvetica, Verdana, sans-serif;
  font-size: 10pt;
}

#skipnav {
  display: none;
}

#page {
  margin: 0 auto; 
  max-width: 800px;
  width:expression(document.body.clientWidth > 800? "800px": "auto" );
}

h1 {
  margin: 0;
  border-top: 6px solid #333;
  padding-top: 24px;
  font-size: 24px;
  font-weight: normal;
}

h1 a {
  color: #333;
}

h3 {
  margin-top: 0;
  margin-bottom: 0;
}

#content {
  margin-top: 20px;
  position: relative;
}

#announce {
  color: #999;
}

a { 
  color: #149ce0; 
  text-decoration: none;
}

a:hover {
  background-color: #eee; 
}

img {
  border: 0;
}

blockquote {
  border-left: 8px solid #eee;
  padding-left: 10px;
  margin-left: 10px;
}


*[title] {
  border-bottom:1px dotted silver;
  cursor:help;
}

.alignright {
  float: right;
  padding-left: 5px;
}

.alignleft {
  float: right;
  padding-right: 5px;
}


/* Navigation */
.navigation {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  margin-top: -60px;

  font-size: 10px;
}
.navigation-bottom {
  display: block;
  text-align: right;
  margin: 20px 0;
  font-size: 10px;
  height: 60px;
}

.previous {
  float: left; margin-right: 20px
}

.next {
	float: right;
}

/* Content */
.narrowcolumn {
  width: 480px;
}

/* Blog */
#blog {
  margin:20px 0;
  width: 480px;
  overflow: hidden;
}

.entry {
  line-height: 1.5em;
}

.postmetadata {
  font-size: 10px;
}


#blog .post {
  margin-bottom: 40px;
}

.body {
  line-height: 1.5em;
}

.date {
  margin-top: 5px;
  margin-bottom: 20px;
  color: #666;
}

pre {
  margin: 0 20px 12px 20px;
  padding: 5px;
  background-color: #111; 
  color: #eee;
  overflow: auto;
  font-size: 10pt;
}

pre.devcodeblock, pre.devcode {
  background-color: white;
}

#blog img {
  overflow: auto;
  margin: 0 10px;
}

#archives {
  text-align: right;
}

#obama {
  margin-bottom: 60px;
}

ul.music {
  list-style: none;
}

ul.music li {
  font-size: 8pt;
  margin-bottom: 12px;
}


/*** Right Column ***/

#sidebar {
  margin: 0; padding: 0;
  position: absolute;
  top: 0; right: 0;
  width: 280px;
  padding-left: 40px;
  background: white;
  overflow: hidden;
}

#friendfeed {
  margin: 0;
  padding: 0;
}

#friendfeed li {
  margin: 0; padding: 0;
  margin-bottom: 20px;
  list-style: none;
  font-size: 9pt;
}

#friendfeed h3 {
  margin: 0 0 4px 0;
  color: #999;
}

#friendfeed img {
  border: 0;
}

#friendfeed .icon {
  padding-right: 6px;
}

#friendfeed .item {
  margin-top: 8px;
  margin-left: 8px;
}

#friendfeed .item div+div {
  color: #999;
  margin-top: 4px;
  font-size: 8pt;
}

#friendfeed .item ul {
  margin-top: 10px;
  padding-left: 8px;
  margin-left: 0;
}


/* Feeds */
#feeds {
  margin-top: 40px;
}
#feeds h2 { 
  font-size: 14pt; 
  margin-bottom: 20px;
}
#feeds p { font-size: 11pt; }
#feeds small { font-size: 9pt; }

#linklog, #audioscrobbler {
  width: 30%;
  float: left;
  padding-right: 5%;
}

#upcoming {
  width: 30%;
  float: left;
}

/* flickr_favorites */
#flickr_favorites {
  width: 530px;
  text-align: left;
}

/* User Card */
#usercard {
  border-top: 6px solid #333;
  border-bottom: 2px solid #333;
  padding: 12px 0 16px 0;
  margin-bottom: 30px;
}

#usercard p {
  font-size: 12px;
  margin: 0; padding: 0;
  margin-left: 80px;  line-height: 1.5em;
}

#usercard img.bio { 
  float: left; 
  width: 60px;
  border: 1px solid #333;
  margin: 5px 8px;
}

/* Election Special */
#electionday {
  padding: 0 20px;
  border-bottom: 2px solid #333;
  margin-bottom: 30px;
}

#electionday h2 {
  margin: 0px;
  font-size: 60px;
  color: #2575ad;
}
#electionday h2 small {
  font-size: 24px;
}



/*** Blog Post Types ***/

/* Flickr Favorites */

#flickr_favorites a {
  border: 0;
}

#flickr_favorites .photo_container {
  display: inline;
  float: left;
  margin: 2px;
  padding: 0;
  line-height: 0;
}

#flickr_favorites img {
  margin: 0;
}

.photo_container {position:relative;}
#flickr_favorites .photo_container a.pc_link img {
  border:none;position:absolute;
  height:11px;left:2px;top:64px;width:11px;
}


.clearfix {
  clear: both;
}

/* Individual Posting Page */

#sidebar {
  margin: 0; padding: 0;
  float: right;
  top: 0; right: 0;
  width: 280px;
  padding-left: 40px;
  background: white;
  overflow: hidden;
}

.node {
}


/* MP3 Playlists */

ul.playlist {
 list-style-type:none;
 margin:0px;
 padding:0px;
}

ul.playlist li {
 margin-bottom:2px;
 border:2px solid #444;
 background-color:#444;
 -moz-border-radius:3px;
 -webkit-border-radius:3px;
 border-radius:3px;
 padding:2px 2px 2px 0;
 color: #111;
 font-weight: bold;
}

ul.playlist li a,
ul.playlist li a.sm2_link {
 text-decoration: none;
 display:inline-block;
 color:#fff;
}

ul.playlist li a.sm2_link {
 padding-left:22px;
}
ul.playlist li a:hover {
  background-color: #666;
}

ul.playlist li a.sm2_link {
 /* safari 3.1+ fun (or, proprietary crap. TBD.) */
 -webkit-transition-property: hover;
 -webkit-transition: all 0.15s ease-in-out;
}

ul.playlist li a.sm2_link:hover {
 background:#444 url(/music/icon_play.png) no-repeat 0px 50%;
 _background-image:url(/music/icon_play.gif); /* IE 6 */
 border-color:#444;
}

ul.playlist li.sm2_paused {
 background:#666 url(/music/icon_pause.png) no-repeat 0px 50%;
 _background-image:url(/music/icon_pause.gif);
 border-color:#666;
}

ul.playlist li.sm2_paused a.sm2_link:hover {
 background-image:url(/music/icon_play.png);
 _background-image:url(/music/icon_play.gif);
}

ul.playlist li.sm2_playing,
ul.playlist li.sm2_playing a.sm2_link:hover {
 background:#149ce0 url(/music/icon_pause.png) no-repeat 0px 50%;
 _background-image:url(/music/icon_pause.gif);
 border-color:#149ce0;
}