/*  
Theme Name: Simple 1Percenter Design
Theme URI: http://1percenter.com/
Description: Simple 1Percenter design
Version: 1.0b
Author: Roben Kleene
Author URI: http://1percenter.com/
*/
@import "css/rounded_corners.css";
@import "css/resume_download.css";

/* 
============================================
 	Title: Simple 1Percenter
 	Author: Roben Kleene
	Website: http://www.1percenter.com
	Contact: info@1percenter.com
============================================
*/

/* CSS Structure
==============================================
Hacks
Site Look: Layout
	=General
	=Header
	=Sidebar
	=Content
	=Footer
Site Look: Text Formatting
Site Look: Image Replacement
Site Look: Behavior

Content: Text Formatting
	=General
	=Post
	=Comments
	=Comment Form
	=Footnotes
	=Gallery
Content: =Behavior

Page Specific Style
	=Feeds Page
	=Portfolio Page
============================================*/
/* Hacks
============================================*/

/* The following three import commands are to correct CSS handling in some browsers. The import code is from David Shea @ mezzoblue.com Via others */

/* The file below is read by ALL browsers
	but the hacks contained within it further target 
	IE5-6 for Windows. See file for details. */

@import "css/ie6win.css";


/* The file below is ONLY read by IE5/Win.
	Makes use of the Mid Pass Filter: 
	http://tantek.com/CSS/Examples/midpass.html */

@media tty {
 i{content:"\";/*" "*/}} @import 'css/ie5win.css'; /*";}
}/* */


/* The file below is ONLY read by IE5/Mac.
	Makes use of the Band Pass Filter: 
	http://www.stopdesign.com/examples/ie5mac-bpf/ */

/*\*//*/
  @import "css/ie5mac.css";
/**/

/* Site Look: Layout
============================================*/
/* =General
--------------------------------------------*/
body {
	background-color: #fffddf;
	margin: 0px;
	padding: 0px;
	}
#container {
	margin-left: auto;
	margin-right: auto;
	margin-top: 22px;
	width: 700px;
	padding: 0px;
	}
.pagetitle {
	vertical-align: bottom;

	margin: 0px 0px 10px -1px;
	padding: 9px 0px 0px 0px;

/*
	margin: 9px 0px 15px -1px;
	padding: 0px;
*/
	}
hr.hide {
/*	FIXME color: #fffddf;
	background-color: #fffddf; Get rid of? */

	clear: both;
	width: 1px; 
	height: 1px;
	border: none;
/*
	padding: 10px;

	margin: 10px;
	border: 1px solid #999;
*/

}
.pagetitle A {
	color: #959191;
	text-decoration: none;
}
A.rss_link, .content A.rss_link, .content A.rss_link:hover {
	border-spacing: 0px;
	line-height: 0;
	font-family: Arial;
	padding: 0px 2px;
	margin: 0px;
	background-color: #FFA631;
	font-size: 11px;
	color: #FFFFFF;
    vertical-align: super;
	border-top: 1px solid #FDB95F;
	border-left: 1px solid #FDB95F;
	border-right: 1px solid #E99B30;
	border-bottom: 1px solid #E99B30;
	font-weight: bold;
}
img {
	border: 4px double #DDD;
	margin: 0px 6px;
}
img.borderless, a:hover img.borderless {
	border: none;
}
img.centered {
	margin: 0px;
}
a img {
	border-left: 4px solid #E1EBF6;
	border-top: 4px solid #E1EBF6;
	border-right: 4px solid #C9D9E9;
	border-bottom: 4px solid #C9D9E9;
}

/* =Header 
--------------------------------------------*/
#header {
	float: left; /* Floating an element assures that its width will size to its contents width, instead of to its parent's width */
	background: #848383 url("images/header_background.jpg") top center repeat-x;
	margin-bottom: 30px;
	z-index: -1;
	}
#header h1 {
	padding: 45px 0px 45px 24px;
	margin: 0px;
	}
#nav UL {
	padding: 0px;
	margin: 0px;
	list-style: none;	
	position: absolute;
	}
#nav LI {
	float: left;
	display: block;
	}
#nav a {
	display: block;
	padding: 4px 12px 4px 12px;
	margin-right: 10px;
	background-color: #575757;
	}
#subnav UL {	
	padding: 1px 10px 0px 30px; /* 30 px for right and left, but each LI already has a right margin of 20px; */
	margin-top: 0px; 
	margin-bottom: 0px;
	margin-left: 0px;
	list-style: none;
	}
#subnav LI {
	float: left;
	margin-right: 24px;
	}
hr.section_break {
	color: #FFFFFF;
	border: none;
	padding: 7px 0px;
}
/* =Sidebar
--------------------------------------------*/
	
#sidebar {
	margin-left: 553px;
	background: url("images/categories_header_background.jpg") top center repeat-x;
	background-color: #838182;
/*	width: 124px; */ /* 144 px - 20 px for padding */
/*	padding-left: 20px;
	padding-bottom: 2px; FIXME */

	}
#sidebar UL {

/*	padding: 0px 0px 2px 10px; */
/*	padding: 0px; FIXME */
	padding: 0px;
	margin: 0px 0px 0px 10px;
	padding-bottom: 0px;
	}
#categories H2 {
	padding-top: 16px;
	margin-bottom: 0px;
	margin-left: 19px;
	/*	position: relative; FIXME
		top: 7px;
		left: 10px; */

}
#categories H2 {
	padding-top: 16px;
	padding-bottom: 7px;
	margin-bottom: 0px;
	margin-left: 19px;
	/*	position: relative; FIXME
		top: 7px;
		left: 10px; */

}
#sidebar li {
	line-height: 1.0em;
	margin-bottom: 0px;
	padding:0px 0px 10px 0px;
}
/* =Content
--------------------------------------------*/
#fullcolumn {
/*	clear: both; FIXME not necessary? *//* This prevents the floated header from appearing to the left of the pagetitle heading */
	}
#narrowcolumn {
	float: left;
	width: 500px;
	}
/*
#firstcolumn *, #secondcolumn * {
	border: 1px solid #999;
}
*/
#firstcolumn {
	float: left;
	width: 341px;
	}
#secondcolumn {
	margin-left: 358px;
/*	margin-left: 358px; */ /* 16px buffer between first- and second- columns */
	width: 341px;
	}
.content {
	margin: 0px;
	background-color: #FFFFFF;
	border: 4px solid #E8E4D6;
	padding: 13px 18px;
	}
sup {
	line-height: 0px;
	}
/* =Footer
--------------------------------------------*/
#footer P {
	line-height: 1.0em;
	padding-top: 5px;
	margin: 0px 0px 20px 0px;

	clear: both;
}

/* Site Look: Text Formatting
============================================*/
#nav li a, #subnav li a, #sidebar li a {
	font-family: helvetica, sans-serif;
	color: #FFFFFF;
	text-decoration: none;
	}
#nav li a {
	font-weight: bold;
	font-size: 140%;
	}
#subnav li a {
	font-size: 100%;
	}
#sidebar li a {
	line-height: 1.0em;
	font-size: 93%;
	}
#header .description {
	display: none;
	}
.pagetitle {
	font-family: helvetica, sans-serif;
	font-weight: bold;
	font-size: 230%;
	color: #959191;
	}
#sidebar ul {
	list-style: none;
	}
#footer P {
	font-family: helvetica, sans-serif;
	color: #8D8B8B;
	font-size: 100%;
	}
	
/* Site Look: Image Replacement
============================================*/
#header h1 span {
	display: block;
	overflow: hidden;
	height: 0px;
	width: auto;
	padding-top: 36px;
	line-height: 2.0em;
	}
#header h1 a {
	display: block;
	background: url("images/title_and_icon.gif") center center no-repeat;
	width: 339px;
	height: 36px;
	}
#categories h2 span {
	display: block;
	overflow: hidden;
	height: 0px;
	width: auto;
	padding-top: 16px;
	}
#categories h2 {
	display: block;
	background: url("images/categories.gif") center left no-repeat;
	width: 83px;
	height: 16px;
	}

/* =Site Look: Behavior
============================================*/
#nav li.selected a {
	background-color: #848383;
}
#nav li a:hover {
	background-color: #848383;
}
#nav li.selected a, #subnav li.selected a, #sidebar li.selected a {
	color: #FBFE63;
}
#nav li a:hover, #subnav li a:hover, #sidebar li a:hover {
	color: #FECF6E;
	}
#nav li a:active, #subnav li a:active, #sidebar li a:active {
	color: #F9FB62;
}


/* Content: Text Formatting
============================================*/
/* =General
--------------------------------------------*/
body {
	font-family: Arial, Helvetica, sans-serif;
	color:#333;
	line-height:1.4em;
	font-size: small; /* Specifying the font-size small is similar to setting the default font for the page to 12px. The rest of the fonts on the page will be sized by percentages in order to allow all users to resizes their fonts with their web browser. */
	}
#container {
	font-size: 95%;
	}
.content a, p a {
	color: #4A7FB8;
	border-bottom: 1px dotted #CFCCC2;
	text-decoration: none;
	}
h2 {
	font-family: verdana, sans-serif;
	font-size: 135%;
	padding: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	color: #959191;
	}
h3 {
	font-family: verdana, sans-serif;
	font-size: 125%;
	padding: 0px;
	margin-top: 10px;
	margin-bottom: 4px;
	color: #959191;
	}
h4 {
	font-family: verdana, sans-serif;
	font-size: 100%;
	padding: 0px;
	margin-top: 13px;
	margin-bottom: 4px;
	}
.content p {
	margin: 8px 0px 7px 0px;
}
.content h2  {
	line-height: 1.35em;
}
code {
	font-family: 'Lucida Console', Monaco, monospace;
	font-size: 120%;
}
/* =Post
--------------------------------------------*/
small {
	font-family: helvetica, sans-serif;
	color: #837E7E;
	font-size: 80%;
	font-weight: bold;
	}
.postmetadata {
	font-size: 90%;
	color: #aaa;
	}
/* =Comments
--------------------------------------------*/
.commentlist .postmetadata {
	padding-bottom: 10px;
	padding-left: 10px; 
	margin: 0px 0px;
}
.post .postmetadata, .photo_thumb .postmetadata {
	padding-bottom: 15px;
}
.postmetadata {
	border-top: 1px #ddd solid;
	}
h3#comments {
	font-family: arial, sans-serif;
	color: #959191;
	font-size: 140%;
	font-weight: bold;
	margin-bottom: 6px;
}
ol.commentlist {
	list-style: none;
	padding: 0px;
	margin: 0px;
}
.commentlist li {
	padding: 0px;
	margin: 0px;
	}
.commentlist li cite {
	font-family: helvetica, sans-serif;
	font-style: normal;
	font-size: 110%;
	color: #959191;
}
.commentlist p {
	padding: 2px 0px 8px 0px;
	margin: 0px;
}
div.comment {
	background-color: #F6F1FD;
	padding: 5px 10px 0px 10px;
	margin: 0px 0px 0px 0px;
}
/* =Comment Form
--------------------------------------------*/
h3#respond {
	font-family: arial, sans-serif;
	color: #959191;
	font-size: 120%;
	font-weight: bold;
	margin-bottom: 6px;
}
textarea#comment {
	width: 100%
}
/* FIXME Need this?
#commentform p {
	
	
}
*/
/* =Footnotes
--------------------------------------------*/
.footnote {
	border-top: 1px solid #999;
	padding-left: 17px;
}


/* =Gallery
--------------------------------------------*/
div#widecolumn div.photo_thumb {
	width: 240px;
	padding: 0px 23px 20px 49px;
	float: left;
	text-align: center;
	}
div#widecolumn div.photo_thumb h3 {
	font-size: 80%;
}
.photo_thumb a img, #flickr_galley a img {
	border-left: 3px solid #EAEAEA;
	border-top: 3px solid #EAEAEA;
	border-right: 3px solid #CFCFCF;
	border-bottom: 3px solid #CFCFCF;
}
.photo_large img {
	border-left: 5px solid #EAEAEA;
	border-top: 5px solid #EAEAEA;
	border-right: 5px solid #CFCFCF;
	border-bottom: 5px solid #CFCFCF;
}
#widecolumn {
	width: 655px;
}
.previous_link {
	margin-right: 17px;
	float: left;
}
.next_link {
}
.post_navigation {
	margin: 0px;
	padding: 0px;
	list-style: none;
	padding-bottom: 5px;
	height: 20px;
}
/* =Link List
--------------------------------------------*/
ul#blogroll_links h2 {
	padding: 0px;
	margin: 0px;
}
ul#blogroll_links {
	list-style: none;
	padding: 0px;
	margin: 0px;
}
#blogroll_links ul {
	list-style: none;
	padding: 0px 0px 10px 10px;
	margin: 0px;
}
#blogroll_links ul li {
	margin-top: 7px;
	margin-left: 15px;
	margin-right: 25px;
	margin-bottom: 12px;
}
#blogroll_links li p {
	margin-top: 5px;
	padding-bottom: 4px;
	border-bottom: 1px #ddd solid;
}
ul#blogroll_links li h3 {
	font-size: 100%;
	font-weight: normal;
}

/* Content: =Behavior
============================================*/
.content a:hover, #footer a:hover {
	color: #4895E9;
	border-bottom: 1px dotted #4895E9;
	}
.content a:active, #footer a:hover {
	color: #4A7FB8;
	}
.content a.underlineless, .content a.underlineless:hover, .content a.underlinesless:active {
	border-bottom: none;
}


/* Page Specific Style
============================================*/
/* =Feeds Page
--------------------------------------------*/
#feed_list ul li h4 {
	display:inline;
	padding: 0px;
	margin: 0px;
	color: #959191;
}
#feed_list ul {
	list-style:none;
	margin: 10px 0px 0px 0px;
	padding: 0px 0px 1px 10px;
}
#feed_list li {
	margin-bottom: 12px;
}
/* =Portfolio Page
--------------------------------------------*/
table.portfolio_metadata {
	margin: 0px;
	padding: 11px 0px 0px 0px;
}

table.portfolio_metadata th {
	width: 70px;
	color: #777777;	
	vertical-align: top;
	text-align: right;
	font-size:90%;
}
table.portfolio_metadata td {
	color: #646464;
}
.portfolio_thumbs {
	width: 680px; /* FIXME uber-hacks to get the little thumbnail on the portfolio page to line up with the big ones */
	margin-left: -9px;

	padding: 30px 0px;
}
.portfolio_thumbs div {
	width: 300px;
	padding-right: 27px;
	padding-left: 11px;
	padding-bottom: 20px;
	float: left;
}
.portfolio_thumbs img {
	padding: 0px;
	margin: 0px;
}
.portfolio_entry {
	border-bottom: 1px #ddd solid;
	padding-bottom: 9px;
	margin-bottom: 17px;
}

/* =Hiring Page
--------------------------------------------*/
ul#hiring_box {
	padding-left: 0px;
	width: 120px;
	list-style: none;
	float: right;
	margin-top: 22px;
	margin-right: 10px;
}
ul#hiring_box li {
	display: block;
	float: left;
}
#hiring_box img {
	border: 4px double #DDD;
	margin: 3px;
}
#hiring_box a {
	border: none;
}
#hiring_box a:hover img {
	border: 4px solid #CCC;
}


/*
style=""

style="{} :hover {border: 4px solid #DDD;}"

style="{border: 4px double #DDD; float: right;} :hover {border: 4px solid #DDD;}"

style="{border: 4px double #DDD; float: left;} :hover {border: 4px solid #DDD;}"

style="{border: 4px double #DDD; float: right;} :hover {border: 4px solid #DDD;}"
*/



/* =Old Style To Delete
--------------------------------------------*/	
.captioned_image a, .captioned_image a:hover, .photo_thumb p a, .photo_thumb p a:hover, .portfolio_thumb p a, .portfolio_thumb p a:hover {
	border-bottom: none; 
	/* FIXME Hacky solution to prevent a weird link type border from appearing beside captioned images */
}
/* FIXME Unused code below here, save  */
.captioned_image {
	float: right;
}
.captioned_image span {
	display: block;
	margin: 2px 6px 3px 6px;
	color: #000;
	line-height:1.2em;
	font-weight: bold;
	font-family: Trebuchet, Helvetica, sans-serif;
	font-size: 85%;
}
