/* == Global == */
body {
  margin: 0;
  background: #141414;
  color: #AAA;
  font: 75%/1.4 Helvetica, Arial, sans-serif;
}

a {
  color: #E02D35;
}

a:hover {
  color: #FFF;
}

strong {
  color : #FFF;
}

a img {
  border: 0;
}


h1, h2, h3, h4 {
  color : #FFF;
  font-family: Lucida Sans, Lucida Sans Unicode, Arial, sans-serif;
  font-weight: normal;
}

/* == Header == */
#header {
  background: #86141A url(/images/header_bg.gif) repeat-x top;
}

#logo {
  background: url(/images/blaster.gif) no-repeat;
  text-align: right;
  margin: 0;
}

#logo img {
  vertical-align : top;
}

#search {
  position: absolute;
  top: 0;
  right: 0;
  text-align: right;
  padding: 22px 40px;
}

#search label img {
  margin: 3px 5px 0 0;
}

#search input {
  background: #DBDBDB;
}

#content {
  padding: 3em 40px;
}

/* == Article == */
.articles {
  width: 70%;
  float: left;
}

.article {
  position: relative;
  margin-bottom: 4em;
  font-size: 1.2em;
}

.article p.post-info {
  background: #93141C url(/images/cal_bg.gif) top right no-repeat;
  position: absolute;
  left: 0;
  top: 0;
  margin: 0.5em 0 0 0;
  padding: 1.6em 0.8em 0.2em 0.8em;
  text-align: center;
  font-size: 0.8em;
  color: #FFF;
}

.article p.article-footer {
  font-size: 0.8em;
  color: #FFF;
  margin-top: 2em;
  margin-left: 7.6em;
  border-top: 1px solid #222;
  padding: 0.3em;
  clear: left;
  line-height: 2em;
}

.article p.post-info em {
  font-style: normal;
  display: block;
  font-size: 1.7em;
  line-height: 0.8;
}

.article h2, .article h1 {
  font-size: 1.6em;
  margin: 0 0 0.4em 3.8em;
}

.article h2 a {
  color : #FFF;
  text-decoration: none;
}

.article h3 {
  margin-left: 5.1em;
}

.article h4 {
  margin-left: 6.1em;
}

.article h2 a:hover {
  text-decoration: underline;
}

.article p, .article ol {
  margin: 0 3em 1em 6.1em;
}

.article ul {
  margin: 0 3em 1em 6em;
  list-style-image: url(/images/bullet.gif);
}

.article pre {
  font-size: 1.1em;
  margin: 0 3em 1em 6.6em;
  padding: 1em;
  background: #000;
  overflow: auto;
}

.article code {
  color: #FFF;
  background: #000;
  font-family: Monaco, Courier, monotype;
}

.article blockquote {
  margin : 1em 1em 1em 7em;
}

.article cite {
  margin : 1em 1em 1em 6em;
}

.article img {
  float: left;
  margin: 0 1em 1em 0;
}


.article p.mugshot {
  position: absolute;
  left: 0;
  top: 0;
  margin: 0 0 0 -0.8em;
}

/* == Mods == */
#content .mod {
  margin-left: 70%;
}

.mod {
  margin: 0 0 2em 0;
  background: #0B0B0B;
  padding: 1em;
  position: relative;
}

.mod-content {
  margin: 1em;
}

.mod h2 {
  color: #FFF;
  font-weight: normal;
  margin: 0 0 0.4em 0;
  font-size: 1.6em;
}  

.mod p {
  margin-top: 0;
  color: #AAA;
}

.mod img.feed-icon {
  vertical-align : middle;
}

/* == Archive Mod == */

.mod ul.archive {
  display: inline;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.mod ul.archive li {
  display: inline;
}

/* == Link List Mod == */

.mod ul.ll {
  margin: 0;
  padding: 0;
  list-style-type: none;
  color: #AAA;
}

.mod ul.ll li {
  margin-bottom: 0.5em;
}

/* == Vinyl Mod == */

.mod ul.vinyl li {
  clear: left;
  padding: 1em;
  background: #292828 url(/images/vinyl_bg.gif) no-repeat top right;
  color: #FFF;
  margin-bottom: 1em;
}

.mod ul.vinyl {
  margin: 0.7em 3em 0 0;
  padding: 0;
  list-style-type: none;
}

.mod ul.vinyl img {
  float: left;
  margin-bottom: 1em;
}

.mod ul.vinyl span {
  display: block;
  color: #AAA;
  margin: 0 0 0.1em 75px;
}

.mod ul.vinyl a {
  color: #FFF;
}

.mod ul.vinyl span.track {
  display: inline;
  margin-left: 20px;
  color: #FFF;
  font-weight: bold;
}

.mod ol.chart {
  margin: 0.7em 3em 0 0;
  padding: 0;
  color: #AAA;
  list-style-type: none;
}

.mod ol.chart li.ch1 {
  background: #141414 url(/images/chart_1.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch2 {
  background: #141414 url(/images/chart_2.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch3 {
  background: #141414 url(/images/chart_3.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch4 {
  background: #141414 url(/images/chart_4.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch5 {
  background: #141414 url(/images/chart_5.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch6 {
  background: #141414 url(/images/chart_6.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch7 {
  background: #141414 url(/images/chart_7.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch8 {
  background: #141414 url(/images/chart_8.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch9 {
  background: #141414 url(/images/chart_9.gif) no-repeat 0 48%;
}

.mod ol.chart li.ch10 {
  background: #141414 url(/images/chart_10.gif) no-repeat 0 48%;
}

.mod ol.chart li {
  padding: 0.3em 0.3em 0.3em 4em;
  margin: 0 0 0.6em 0;
}

.mod .icons {
  display : block;
  position : absolute;
  top: 0.7em;
  right: 1em;
} 

.icons a img {
  border: 0;
}

/* == Related Links Mod == */

.related-links ul {
  background:  #141414;
  margin: 0;
  padding: 1em;
  list-style-type: none;
}

.related-links h3 {
  display: inline;
  color: #AAA;
  padding: 0.5em;
  font-size:  1em;
}

.related-links h3.selected {
  color: #FFF;
  background:  #141414;
}

.related-links h3.tab {
  cursor: pointer;
}

/* == Footer == */
#footer {
  clear: left;
  background: #1E1E1E url(/images/footer_bg.gif) repeat-x top;
  padding: 5em 40px 0 40px;
}

#footer #fm {
  width: 70%;
  float: left;
}

#footer #fm .mod {
  width: 50%;
  float: left;
}

#footer #fm .mod .icons {
  right: 2em;
  top: 0.1em;
}

#footer .mod {
  padding: 0;
  background: transparent;
  border-top: 0;
}

#footer #fm .mod ul, #footer #fm .mod ol {
  margin-bottom: 2em;
}

#footer #fm .mod p {
  margin-right: 2em;
}

#fm .mod h2 {
  clear: left;
}

#footer .last {
  margin-left: 70%;
}

#footer .c {
  clear: left;
  padding-top : 60px;
  background: url(/images/footer_footer_bg.gif) no-repeat right bottom;
}

#footer .badges {
  margin-top: 1.5em;
}

#footer .badges img {
  margin: 1em 1em 1em 0;
  vertical-align: middle;
}

#footer_footer {
  text-align: right;
  padding: 1em 1em;
  background: #0B0B0B;
  color: #A2A2A2;
  font-size: 0.95em;
}

#footer_footer img {
  vertical-align: middle;
}

/* == Comments == */
h2#comments {
  font-size : 1.6em;
  margin : 0 2em 2em 4.5em;
  border-bottom: 1px solid #222;
}

blockquote.comment {
  margin: 0 2.8em 0 6em;
  padding: 1em;
  background: #1E1E1E;
  font-size: 1.2em;
}

p.commenter {
  margin: 2.7em 0 3em 7.4em;
}

p.commenter img {
  vertical-align: middle;
  margin-left: 1em;
}

p.commenter cite {
  background: url(/images/comment_cite_bg.gif) top right no-repeat;
  padding: 3.5em 0.3em 1em 1em;
}

/* == Comment Form == */

h2#commentform-head {
  font-size : 1.6em;
  margin : 0 0 1em 4.6em;
  border-bottom: 1px solid #FFF;
}

#commentform fieldset {
  border: 0;
  padding: 0;
  margin: 0 0 4em 0;
  width: 50%;
  float: left;
}

#commentform fieldset div {
  margin-right: 3.5em;
}

#commentform fieldset#details div {
  margin: 0 4em 1em 7.5em;
}

#commentform label {
  display: block;
  color: #FFF;
  font-size: 1.2em;
}

#commentform input, #commentform textarea {
  border-width: 1px;
  width: 97%;
  background: #131313;
  padding: 0.5em;
  color: #FFF;
  font: 1.2em/1.4 Helvetica, Arial, sans-serif;
}

#commentform button {
  display: block;
  margin-top : 1em;
  border-width: 1px;
  background: #131313;
  color: #FFF;
}

#commentform .required {
  color: #E02D35;
  font-weight: bold;
}

#comment_body {
  height: 15em;
}

#commentform div.info {
  padding-top: 0.7em;
  text-align: right;
}

#footer div#preview {
  background: #0B0B0B;
  padding: 0.5em;
  font-size: 1.2em;
  margin-top: 2.8em;
}

#commentform p#comment-message {
  margin-left: 7.3em;
}

#commentform ul#comment_errors {
  margin: 0 3em 1em 6em;
  list-style-image: url(/images/bullet_footer.gif);
}

/* == Code Highlighting == */

/** RUBY / JAVASCRIPT **/
#content code span.comment {
	color: #BD48B3;
}

#content code span.string {
	color: #99FF00;
}

#content code span.brackets {
	
}

#content code span.symbol {
	color: #6BCFF7;
}

#content code span.keywords {
	color: #FF8400;
}

#content code span.erb {
	background: #333;
}

#content code span.symbol {
      color: #07DFFC;
}

/** HTML **/
code.html span.tag {
	color: #fff;
}

code.html span.attribute {
	color: #FFD500;
}

code.html span.string {
	color: #99FF00;
}

code.html span.comment {
	color: #999;
}

code.html span.doctype {
	color: #D7FF80;
}

h2#comments {
clear: both;
}

#barcamp2 img {
  background: white;
  padding: 1.5em;
}

.article .embed {
  margin: 3em 1em;
}

p.caption {
  clear: left;
}

p.article-footer .twitter-share-button {
  vertical-align: middle;
  margin-left: 10px;
}