/*
Theme Name: Toby Benjamin Redux
Theme URI: http://tobybenjamin.com
Description: Simplified theme for TobyBenjamin.com - you know - now that I'm alive.
Version: TBRedux 0.1 (8/15/2012)
Author: Toby Benjamin
Author URI: http://tobybenjamin.com
Tags: clean, simple, alive

COLORS 
Dark Grey		#222
Mid Grey		#777
Light Grey		#CCC
Pink			#EC3F5D
*/


body { background: url(images/bg.jpg) fixed bottom left no-repeat #C9C9C9; background-size: 100% auto; font: 12px/20px 'Trebuchet MS', 'Gill Sans', Tahoma, Arial, sans-serif; color: #222; overflow-x: hidden; }

#shell { width: 960px; float: right; background: #FFF; padding-bottom: 40px; overflow: hidden; }

/*** HEADER & NAV ***/ 

#top { float: left; width: 240px; overflow: hidden; }

header { width: 240px; float: left; text-align: right; padding: 30px 0 0 0; }
	
h1 { float: right; margin: 0; padding: 0; font-size: 28px; }
	h1 a { color: #FFF; background: #EC3F5D; padding: 10px 20px 10px 0; float: right; width: 220px; }
	h1 a:hover { background: #777; }
	
header nav { float: right; padding: 40px 0 0; text-transform: lowercase; }	
	header nav ul { list-style: none; font-size: 20px; }	
	header nav li { float: right; clear: right; }
	header nav a { color: #CCC; float: left; padding: 0 20px 0 0; margin: 0 0 10px; width: 220px; }
		header nav a:hover { color: #777; }	
		header nav .current-menu-item a { color: #222; }	
	
/*** CONTENT ***/
		
article { float: right; width: 600px; padding: 40px 40px 0; }	

article a { color: #EC3F5D; padding: 0 3px; margin: 0 -3px; }
	article a:hover { color: #FFF; background: #EC3F5D; }
	
h2, h3, h6 { float: left; clear: both; width: 100%; }
	h2 em, h3 em, h6 em { color: #777; font-size: small; }

h2 { margin: 0 0 20px; color: #777; } 
	* + h2 { margin-top: 40px; } 
h3, h6 { margin: 0 0 5px; } 
	* + h3 { margin-top: 20px; } 
	h2 + h3 { margin-top: 0; } 

h6 { font-size: larger; color: #222; margin-bottom: 10px; }
	h6:hover { color: #EC3F5D; }
	h6 + div { float: left; clear: both; width: 100%; margin: 10px 0 20px; }

article p, article ul { float: left; clear: left; margin-bottom: 10px; }
	article ul { margin-left: 15px; }
	
/*** SIDEBAR ***/	
	
aside { float: left; clear: left; width: 240px; padding: 40px 0 0; }	
	
#menu-socialize { list-style: none; float: right; }
#menu-socialize li { float: right; padding-left: 8px; width: 32px !important; }
#menu-socialize a { height: 32px; width: 32px; text-indent: -81788px; float: left; }
	#menu-socialize a[href*="twitter"] { background: url('images/icons/twitter_d.png'); }
		#menu-socialize a[href*="twitter"]:hover { background: url('images/icons/twitter.png'); }
	#menu-socialize a[href*="linkedin"] { background: url('images/icons/linkedin_d.png'); }
		#menu-socialize a[href*="linkedin"]:hover { background: url('images/icons/linkedin.png'); }
	#menu-socialize a[href*="last.fm"] { background: url('images/icons/lastfm_d.png'); }
		#menu-socialize a[href*="last.fm"]:hover { background: url('images/icons/lastfm.png'); }
	#menu-socialize a[href*="porkchoppizzaburger"] { background: url('images/icons/pcpb_d.png'); width: 96px; }
		#menu-socialize a[href*="porkchoppizzaburger"]:hover { background: url('images/icons/pcpb.png'); }
		#menu-socialize li#menu-item-33 { width: 96px !important; }
	
/*** CONTACT ***/

.contact-form > div { width: 240px; margin-right: 40px; float: left; }
.contact-form > div.comment { width: 520px; }
	
.contact-form input, 
.contact-form textarea { width: 100% !important; border: 1px solid #CCC; font-size: 14px; padding: 5px; font-family: inherit; }
.contact-form textarea { height: 120px !important; }
.contact-form input:focus, .contact-form textarea:focus { border: 1px solid #777; }

p.contact-submit { clear: left; margin-bottom: 0 !important; }	
.contact-form input[type='submit'] { width: 170px !important; }
.contact-form input[type='submit']:hover { background-color: #777; color: #FFF; }

.contact-form label.form-error { color: #EC3F5D; }
.contact-form label.form-error + * { border-color: #FC9FCD; }
div.form-error { width: 58% !important; padding: 5px; margin-bottom: 20px; }
div[id*="contact-form"] blockquote { margin-top: 20px; }


/*** HOME TWEAKS ***/

body[class*="Home"] p { margin-bottom: 20px; }

/*** RESUME TWEAKS ***/

body[class*="Resum"] .column { min-width: 200px; }
body[class*="Resum"] .column ul { margin: 0 0 0 15px; }
body[class*="Resum"] h3 em, body[class*="Resum"] h6 em { display: inline-block; }
body[class*="Resum"] p { margin-bottom: 5px; }
body[class*="Resum"] .dates { color: #777; font-style: italic; margin-bottom: 0; }
body[class*="Resum"] div.a6-pane p { margin-bottom: 10px; }

/*** PORTFOLIO TWEAKS ***/

body[class*="Portfolio"] p { float: left; width: 280px;	clear: none; }
body[class*="Portfolio"] p + p { float: right; clear: right; margin-right: 20px; }
body[class*="Portfolio"] img { float: left; outline: 1px solid #777; width: 280px; }
body[class*="Portfolio"] p em { color: #777; }

/*** MEDIA QUERIES ***/

@media screen and (max-width:960px) { 
	#shell { width: 640px; }
	article { float: left; width: 280px; padding-left: 80px; }
	.contact-form > div.comment { width: 240px; }
	.column + .column { margin-top: 20px; }
	body[class*="Resum"] h3 em { display: block; }
	body[class*="Portfolio"] img { float: left; clear: left; margin-bottom: 10px; }
	body[class*="Portfolio"] p { clear: left; width: 100%; margin-right: 0; }
	body[class*="Portfolio"] p + p { float: left; }
	}

@media screen and (max-width:680px) { 
	#shell { width: 320px; }
	article { width: 280px; width: auto; float: left; margin-top: 20px; padding-left: 20px; padding-right: 20px; }
	}


/*** PRINT STYLES ***/

@media print {
	body { font: 11px/14px Helvetica, sans-serif !important; margin-top: -40px; }	
	body[class*="Resum"] article h2:last-of-type { display: none; }
	body[class*="Resum"] article h6 { display: none; }
	body[class*="Resum"] article .h6-pane { display: none; }
	body[class*="Resum"] article * + h2 { margin-top: 20px; }
	div.noprint { display: none !important; }
	}

