/*
Theme Name: 4ptOh
Theme URI: http://www.droppixel.com/
Description: droppixel.com theme
Version: 4.0
Author: Ryan Minard (c) All rights reserved
Author URI: http://www.droppixel.com
*/

/* ==Reset== */
html, body, div, span, object, iframe, img, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, a, blockquote, pre, form, fieldset, table, tr, td, sup, strong, small { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; }

html { height: 101%; }


/* ==Stand.Styles== */
body { font-family: "Helvetica Neue", Arial, sans-serif; font-size: 13px; line-height: 19px; color: #3D3D3D; background: #FAFAFA; height: 100%; }

a { font-weight: bold; }
a:link { color: #a0a0a0; text-decoration: none; }
a:visited { color: #a0a0a0; text-decoration: none; }
a:active { color: #2F9C1C; text-decoration: none;  position: relative; top: 1px; }
a:hover { color: #2F9C1C; text-decoration: none; }
a:focus { color: #2F9C1C; text-decoration: none; }

p { margin: 0 10px 10px 0; }

ol, ul { margin: 0 0 20px 0; }
ol li, ul li { line-height: 20px; list-style-type: none; }

h2, h3, h4, h5 { color: #191717; font-weight: normal; }

h1 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 34px;  line-height: 34px; color: #191717; font-weight: bold; padding-bottom: 20px; }
h1.title a:hover { color: #2F9C1C; text-decoration: none; }

h2 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-transform: lowercase; font-size: 18px; line-height: 24px; padding-bottom: 10px; }

h3 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; font-weight: bold; line-height: 18px; }

h2.title a { font-weight: bold; color: #191717; text-transform: capitalize; text-decoration: none; }
h2.title a:hover, h2.title a:focus { color: #2F9C1C; text-decoration: none; }

hr {display: none; }

/* ==Spec.Styles== */
span.amp { font-family:  Baskerville, "Baskerville old face", "Hoefler Text", Garamond, "Times New Roman", serif; }
p.intro { font-weight: lighter; font-size: 34px; line-height: 36px; display: table-cell;  vertical-align: middle; }
p.more { margin: -10px 0 20px 0; font-size: 14px; }
span.more { margin: -10px 0 20px 0; font-size: 14px; }
p.footer {font-size: 12px; line-height: 16px; padding-top: 10px; }

blockquote { margin:20px 0px; padding:3px; color:#3d3d3d; padding: 20px 20px 20px 65px; background: #e8e8e8 url("../images/blockquote.png") no-repeat 15px 10px; }

#key li { float: left; display: inline; list-style-type: none; }

/* ==Nav.Styles== */
#nav {  margin: 10px 0 0 0px; float: left; width: 960px; }
#nav li { list-style-type: none; }

#nav li a {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform: lowercase;
	font-weight: normal;
	font-size: 14px;
	margin: -5px 20px 0 0;
	padding: 10px 0 0 0;
	display: block;
	position: relative;
	float: left; }
	
#nav li a:hover, #nav li a:focus { color: #2F9C1C; } 
#nav li a:active { color: #2F9C1C; text-decoration: none;  position: relative; top: 1px; }
#nav li#current a { font-weight: bold; color: #171919; top: -2px; float: left; }

/* ==PostNavSprite.Styles== */
#post-nav span { display: none; }
#post-nav { margin: 0 0 14px 30px; float: left; width: 300px; }
#post-nav li { float: left; list-style-type: none; margin: 0 6px 0 0; }
#post-nav li a { height: 25px; display: block; }
#post-nav li#next a { width: 20px; background: url(../images/post-navbutton.png) 0px 0px no-repeat; }
#post-nav li#previous a { width: 20px; background: url(../images/post-navbutton.png) -20px 0px no-repeat; }
#post-nav li#all a { width: 45px; background: url(../images/post-navbutton.png) -40px 0px no-repeat; }
#post-nav li#next a:hover, #post-nav li#next a:focus { width: 20px; background: url(../images/post-navbutton.png) 0px -25px no-repeat; }
#post-nav li#previous a:hover, #post-nav li#previous a:focus { width: 20px; background: url(../images/post-navbutton.png) -20px -25px no-repeat; }
#post-nav li#all a:hover, #post-nav li#all a:focus { width: 45px; background: url(../images/post-navbutton.png) -40px -25px no-repeat; }

#footernav { margin: -40px 0 0 0px; float: right; }
#footernav li { float: left; margin: 0 auto; list-style-type: none; }

#footernav li a {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform: lowercase;
	font-weight: normal;
	font-size: 12px;
	display: inline;
	position: relative; }

/* ==Header.Styles== */
#header { width: 960px; height: 50px; margin: 0 auto; margin-bottom: 30px;} 

#logo {	margin: 25px 0 0 0; float: right; }
#logo a { width: 182px; height: 45px; float: right; padding: 0px 5px; background: url(../images/logo.png) 0 0 no-repeat; }
#logo a:hover, #logo a:focus { background-position: 0px -45px; }
#logo span { display: none; }

#intro { width: 960px; margin-top: 20px; margin-bottom: 40px; float: left; }
.introtext { width: 940px; }

/* ==Cont.Styles== */
#content { width: 960px; margin: 0 auto; }
#contentnp { width: 640px; margin: 0 auto; float: left; }

#portrait { height: 175px; width: 175px; margin-left: 10px; float: left; }
#portrait span { display: none; }

#footer { width: 100%; margin-top: 25px; float: left; clear: both; border-top: #3d3d3d 1px solid; }

.grid-5-1 { width: 192px; float: left; }
.grid-5-2 { width: 384px; float: left; }
.grid-5-3 { width: 576px; float: left; }
.grid-5-3a { width: 576px; float: left; margin-top: -20px; }
.grid-5-4 { width: 768px; float: left; }
.grid-5-5 { width: 950px; float: left; }

.grid-5-2-2 { width: 320px: float: left; margin-left: 20px; }
.grid-5-2-1 { width: 90px; float: left; margin-right: 5px; }

#social { width: 384px; float: left; margin: 0px; padding: 0; }
#social li { width: 150px; float: left; margin-right: 10px; padding: 0;}

/* ==WorkSample.Styles== */
#hp-sample { float: left;	width: 576px; margin: 0 auto; padding-bottom: 15px; }
.hp-thumb {	margin: 5px; float: left; width: inherit; padding: 1px; cursor: pointer; border: 2px solid #191717; }
.hp-thumb:hover, .hp-thumb:focus {border: 2px solid #2f9c1c;}

.port-sample { margin-right: 6px; float: left; width: 175px; padding: 1px; cursor: pointer; border: 2px solid #191717; }
.port-sample:hover, .port-sample:focus { border: 2px solid #2f9c1c; }

/* ==Notepad.Styles== */
.grid-np-1 { width: 300px; float: right; }
.grid-np-1-1 { width: 270px; float: left; padding-left: 30px; }
.grid-np-1-2 { width: 150px; float: left; margin-top: 20px; }
.grid-np-post { width: 320px; min-height: 320px; float: left; }
.grid-np-2 { width: 320px; float: left; margin-bottom: 20px; }
.grid-np-4 { width: 640px; float: left; }

#teaser { float: left; position: relative; width: 300px; padding: 1px; border: 2px solid #191717 }
#post { width: 220px; position: relative; padding: 15px 0 0 60px; top: 150px; left: 0px; background: #FAFAFA url(../images/postbkg.png)  0 0 no-repeat;; }
#post h2 { margin-top: -20px; float: left; margin-top: -20px; position: relative; top: -177px; left: -15px; }
.nppostdate { width: 40px; height: 60px; position: relative; top: -6px; left: -65px; }
.npost { float: left; margin-top: -20px; position: relative; top: -165px; left: -15px; }

.post { float: left; width: 300px; }

.np-thumb { margin: 0 10px 10px 0; width: inherit; padding: 1px; cursor: pointer; border: 2px solid #191717; }
.np-thumb:hover, .np-thumb:focus { border: 2px solid #2f9c1c;}
.np-thumb:active { color: #2F9C1C; text-decoration: none;  position: relative; top: -1px; }

#sidebar { width: 310px; min-height: 640px; float: right; margin-left: 10px; }

#twitterbox { width: 300px; float: left; position: relative; }
#twitterbox h2 { position: absolute; display: table; }
#twitterbox a { width: 300px; height: 150px; float: left; background: url(../images/twitterbox.png)  0 0 no-repeat; }
#twitterbox a:hover, #twitterbox a:focus { background-position: 0px -150px; }
#twitterbox span { display: none; }
.tweet { width: 300px; margin-top: 55px; display: table; position: absolute; }
.tweet a:hover { font-weight: bold; background: none; }

#flickrbox { width: 320px; float: left; position: relative; margin-top: 20px; }
#flickrbox span { display: none; }
.flickr { height: 90px; width: 90px; float: left; margin: -20px 5px 0 0; padding: 1px; display: table; border: 2px solid #191717 }
.flickr:hover { border: 2px solid #2f9c1c; }
h2.flicks a { font-weight: bold; color: #a0a0a0; text-transform: lowercase; text-decoration: none; }
h2.flicks a:hover, h2.flicks a:focus { color: #2F9C1C; text-decoration: none; }

#topic ul { float: left; width: 320px; list-style: none; }
#topic li { float: left; display: block; margin-right: 30px; }

#archive ul { float: left; width: 320px; margin: 0; list-style: none; }
#archive li { float: left; width: 50px; text-transform: lowercase; }

p.introarchive { font-weight: lighter; text-transform: lowercase; font-size: 34px; line-height: 36px; display: table-cell;  vertical-align: middle; }

#pagination { float: left; width: 960px; margin-top: 10px; }
#pagination.left { float: left; }
#pagination.right { float: right; }

#rss { width: 384px; float: right; position: relative; }
#rss span { display: none; }
.rss { width: 20px; min-height: 18px; float: left; }
.rss a { background: url(../images/rss2.png)  0 0 no-repeat; }
.rss a:hover, .rss a:focus {background-position: 0px -20px }

#rss-np { width: 320px; float: right; position: relative; margin: 20px 0 10px 0; }
#rss-np span { display: none; }

/* =DateSprite.Styles= */
.postdate { width: 40px; height: 60px; float: left; padding-right: 10px; }

.month, .day, .year { text-indent: -1000em; background-image: url(../images/date_img.png); background-repeat: no-repeat; }
    
.day { width: 40px; height: 22px;}
.month { width: 40px; height: 25px; }
.year { width: 40px; height: 20px;}

.m-01 { background-position: 0 0px;}
.m-02 { background-position: 0 -30px;}
.m-03 { background-position: 0 -60px;}
.m-04 { background-position: 0 -90px;}
.m-05 { background-position: 0 -120px;}
.m-06 { background-position: 0 -150px;}
.m-07 { background-position: 0 -180px;}
.m-08 { background-position: 0 -210px;}
.m-09 { background-position: 0 -240px;}
.m-10 { background-position: 0 -270px;}
.m-11 { background-position: 0 -300px;}
.m-12 { background-position: 0 -330px;}

.d-01 { background-position: -40px 0;}
.d-02 { background-position: -40px -30px;}
.d-03 { background-position: -40px -60px;}
.d-04 { background-position: -40px -90px;}
.d-05 { background-position: -40px -120px;}
.d-06 { background-position: -40px -150px;}
.d-07 { background-position: -40px -180px;}
.d-08 { background-position: -40px -210px;}
.d-09 { background-position: -40px -240px;}
.d-10 { background-position: -40px -270px;}
.d-11 { background-position: -40px -300px;}
.d-12 { background-position: -40px -330px;}
.d-13 { background-position: -40px -360px;}
.d-14 { background-position: -40px -390px;}
.d-15 { background-position: -40px -420px;}
.d-16 { background-position: -40px -450px;}
.d-17 { background-position: -80px -0px;}
.d-18 { background-position: -80px -30px;}
.d-19 { background-position: -80px -60px;}
.d-20 { background-position: -80px -90px;}
.d-21 { background-position: -80px -120px;}
.d-22 { background-position: -80px -150px;}
.d-23 { background-position: -80px -180px;}
.d-24 { background-position: -80px -210px;}
.d-25 { background-position: -80px -240px;}
.d-26 { background-position: -80px -270px;}
.d-27 { background-position: -80px -300px;}
.d-28 { background-position: -80px -330px;}
.d-29 { background-position: -80px -360px;}
.d-30 { background-position: -80px -390px;}
.d-31 { background-position: -80px -420px;}

.y-2010 { background-position: -120px 0;}
.y-2011 { background-position: -120px -30px;}
.y-2012 { background-position: -120px -60px;}
.y-2013 { background-position: -120px -90px;}
.y-2014 { background-position: -120px -120px;}
.y-2015 { background-position: -120px -150px;}

/* ==Form.Styles== */
form#form label { font-family: "Helvetica Neue", Arial, sans-serif; font-size: 15px; line-height: 22px; float: left; width: 100px; }

form#form input#name, form#form input#email {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	width: 384px;
	padding: 3px;
 	border: #a0a0a0 1px solid;
    color: #3D3D3D;
 	margin: 0 0 15px 0;
 	float: left; }

form#form textarea#message {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	width: 384px;
	height: 124px; 
	overflow: auto;
	padding: 3px;
 	border: #a0a0a0 1px solid;
    color: #3D3D3D;
 	margin: 0 0 10px 0; }

form#form input#submitbutton {	
	font-size: 11px;
	width: 60px;
	padding: 2px 0 2px 0;
	background-color: #3D3D3D;
	color: #ffffff;
	cursor: pointer;
	border: none;
	margin: 0 0 20px 0px; }
	
.error {color:#FF0000; margin:0 0 10px 0; }
.accept {color:#339966;	margin:0 0 10px 0; }


/* =search= */	
#search {float: left; font-family: "Helvetica Neue", Arial, sans-serif; font-size: 12px; color: #3D3D3D; }

#searchsubmit {
	font-size: 11px;
	width: 60px;
	padding: 2px 0 2px 0;
	background-color: #3D3D3D;
	color: #ffffff;
	cursor: pointer;
	border: none;
	margin: 0 0 20px 5px; }

/* =comment= */
#respond h3 { margin-top: 20px; padding-top: 10px; border-top: #a0a0a0 1px solid; }

#commentform { margin: 10px 0 0 0; }

#commentform input { width: 200px; padding: 2px; margin: 5px 5px 1px 0; }

#commentform textarea {	width: 100%; padding: 2px; }

#respond:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

#commentform #submit {
	font-size: 11px;
	width: 60px;
	padding: 2px 0 2px 0;
	background-color: #3D3D3D;
	color: #ffffff;
	cursor: pointer;
	border: none; }

.commentlist li .avatar { float: right;	border: border: 2px solid #191717; padding: 1px; background: #FAFAFA; }

.commentmetadata { font-weight: normal;	}