/*  
  Theme Name: Streamline
  Description: A no-nonsense WordPress theme for Makario Lewis's personal website.
  Author: Makario Lewis
  Author URI: http://makariolewis.com/
  Version: 1.0
  Tags: Comma-separated tags that describe your theme
  Copyright 2010 Makario Lewis. All rights reserved.
*/


@font-face {
	font-family: 'MisoRegular';
	src: url('miso-webfont.eot');
	src: local('☺'), url('miso-webfont.woff') format('woff'), url('miso-webfont.ttf') format('truetype'), url('miso-webfont.svg#webfontHdt0KkqF') format('svg');
	font-weight: normal;
	font-style: normal;
}


* {
	margin: 0px;
	padding: 0px;
}

a {color: #555;}
p {margin-bottom: 20px;}

body {
	background: #f0f0f0 url('images/bg.png') repeat-y;
	font: normal 12px/1.5em Arial, Helvetica, sans-serif;
	color: #555;
}

h2 {
	font: normal 32px/1em MisoRegular, Myriad Web Pro Condensed, Segoe UI, sans-serif;
	text-transform: uppercase;
	margin-bottom: 10px;
	color: #999;
}

h3 {
	font: normal 24px/1em MisoRegular, Myriad Web Pro Condensed, Segoe UI, sans-serif;
	text-transform: uppercase;
	margin: 30px 0px 10px;
	color: #999;
}

h2 a {
	text-decoration: none;
	color: #999;
}



input {
	border: 1px solid #ccc;
	color: #757575;
	padding: 5px;
	font: normal 12px Arial, Helvetica, sans-serif;
	margin-right: 5px;
}

textarea {
	padding: 5px;
	color: #757575;
	font: normal 11px Arial, Helvetica, sans-serif;
	border: 1px solid #ccc;
}

button {
	padding: 5px;
	color: #757575;
	font: normal 10px arial;
	text-transform: uppercase;
	border: 1px solid #ccc;
	background: #fff;
}

button:hover {cursor: pointer;}

.clear {
	clear: both;
	margin: 0px 0px -20px;
}

.pad {padding-bottom: 20px;}

#container {
	background: #f0f0f0 url('images/container_bg.png') repeat-y;
	width: 900px;
	margin: 0px auto;
}

/** sidebar **/
#sidebar {
	float: left;
	height: 900px;
	width: 150px;
	padding: 40px 20px 10px;
	background: #fff;
	border-right: 1px solid #ddd;
}

#sidebar #stuff {float: right;}

#sidebar img#mugshot {
	width: 150px;
	height: 150px;
	background: #eee;
	float: right;
	margin-bottom: 25px;
}

#sidebar #title {
	font: normal 32px/1em MisoRegular, Myriad Web Pro Condensed, Segoe UI, sans-serif;
	color: #999;
	text-align: right;
	margin: 10px 0 20px;
	text-transform: uppercase;
}

#sidebar ul {
	list-style: none;
}

#sidebar ul li {
	text-align: right;
	font: normal 32px/1.2em MisoRegular, Myriad Web Pro Condensed, Segoe UI, sans-serif;
	text-transform: uppercase;
	color: #999;
}

#sidebar ul li a {
	text-decoration: none;
	color: #ccc;
}

#sidebar ul li a:hover {
	color: #999;
}

#sidebar ul li a:active {
	color: #999;
}

/** content **/

#content {
	width: 650px;
	background: #f0f0f0;
	float: left;
	padding: 40px 0px 10px 20px;
	border-left: 1px solid #f8f8f8;
}

#content .the_date {
	float: right;
	width: 80px;
	text-align: left;
	margin-top: 10px;
	color: #999;
	font: normal 30px MisoRegular, Myriad Web Pro Condensed, Segoe UI, sans-serif;
	text-transform: uppercase; 
}

.clear { /* generic container (i.e. div) for floating buttons */
    overflow: hidden;
    width: 100%;
}

#content img {
	border: 0px;
	margin-bottom: 10px;
	border: 5px solid #eee;
}

#content ul {
	margin: 20px;
}

.post {
	width: 500px;
	background: #fff;
	padding: 20px;
	padding-bottom: 0px;
	border-left: 3px solid #e16969;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	margin-bottom: 20px;
}

.post a {
	color:  #e16969;
	text-decoration: none;
}

/** twitter **/
.twitter {
	border-left-color: #fff;
	border: 1px solid #ddd;
	padding-left: 25px;
	font-style: italic;
}

p.timestamp {
	text-align: right;
	margin-top: -20px;
	color: #999;
}

/** flickr **/

.flickr {
	border-left-color: #ff7fc1;
}

.flickr a {
	color: #ff7fc1;
}

/** video **/
.video, .video-2 {
	border-left-color: #66CC9A;
}

.video, .video-2 a {
	color: #66CC9A;
}

/** links **/
.links {
	border-left-color: #5790DE;
}

.links a {
	color: #999;
	color: #5790DE;
}

.links a:hover {
	color: #5790DE;
}


a.more-link {
	background: #e16969;
	padding: 3px;
	font-size: 9px;
	text-transform: uppercase;
	color: #fff;
}

.small {
	background: #f0f0f0;
	padding: 5px 10px;
	xfont-size: 11px;
	color: #999;
	margin-top: -20px;
	margin-bottom: 20px;
}

.small a {
	color: #757575;
}

.small a:hover {
	border-bottom: 1px dotted #757575;
}

.small .tags {
	margin: 0px;
	float: left;
}

.small .comments {
	float: right;
}

#comments {
	width: 500px;
	background: #fff;
	padding: 20px;
	padding-bottom: 0px;
	border-left: 5px solid #ddd;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	margin-bottom: 20px;
}

#comments a {
	color:  #757575;
	text-decoration: none;
}

.commentmetadata {
	color: #999;
}

#comments .c {
	display: none;
}

#comments ol {
	list-style: none;
	margin-bottom: 50px;
}

#comments li {
	padding: 20px 10px 10px;
	 
	border-top: 1px dotted #999;
}

#comments .alt {
	background: #f7f7f7;
}

/** about **/

#about {
	width: 500px;
	background: #fff;
	padding: 20px;
	padding-bottom: 0px;
	border-left: 5px solid #5EAFCA;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	margin-bottom: 20px;
}

#about a, #about h2 {
	color:  #5EAFCA;
	text-decoration: none;
}

/** work **/
.folio {
	width: 500px;
	background: #fff;
	padding: 20px;
	padding-bottom: 0px;
	border-left: 5px solid #ddd;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	margin-bottom: 20px;
}

.folio a {
	color: #999;
}

.folio .screenshot {
	border: 5px solid #eee;
	width: 500px;
	height: 200px;
	text-indent: -9999px;
}

.folio:hover .screenshot {
	background-position: 0 200px;
}

/** archives **/
#archives {
	width: 500px;
	background: #fff;
	padding: 20px;
	border-left: 5px solid #ddd;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	margin-bottom: 20px;
}

#archives a {
	color: #e16969;
	font-weight: bold;
	text-decoration: none;
}

#archives a.links {color: #5790DE;}
#archives a.flickr {color: #ff7fc1;}
#archives a.video, #archives a.video-2 {color: #66CC9A;}
#archives ul {
	list-style: none;
}

#archives li {
	padding: 7px 0;
	border-bottom: 1px solid #dfdfdf;
}

#archives .the_day {
	color: #bbb;
	text-transform: uppercase;
	margin-right: 5px;
}

/** contact **/
#contact {
	width: 500px;
	background: #fff;
	padding: 20px;
	border-left: 5px solid #9FBF72;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	margin-bottom: 20px;
}

#contact h2 {
	color: #9FBF72;
}

#contact a {
	color: #999;
}

#contact p {
	margin: 20px 0 5px;
}

#contact label {
	font: normal 18px/1em MisoRegular, Myriad Web Pro Condensed, Segoe UI, sans-serif;
	text-transform: uppercase;
	margin: 30px 0px 10px;
	color: #999;
}

#contact input {
	width: 250px;
}
#contact textarea {
	width: 480px;
	height: 100px;
	margin-bottom: 10px;
}


#footer {
	clear: both;
	width: 550px;
	margin-top: 40px;
	border-top: 1px solid #ccc;
}

#footer p {
	padding: 5px;
	font-size: .9em;
	color: #999;
}