/*-----------------------------------------------------------------------------------
//
//	Paul Maher - Portfolio
//
//	Date: August 2010
//
//	styles.css - http://www.paulmaher.com/resources/css/default.css
//	by Paul Maher - http://www.paulmaher.com
//
// --------------------------------------------------------------------------------- 
// 
// 	TABLE OF CONTENTS
// 
// 	01	LAYOUT
// 	02 	NAVIGATION
// 	03 	FONT EMBED
// 	04 	PORTFOLIO
// 
--------------------------------------------------------------------------------- */

html * div, body { 
	margin:0; 
	padding:0;
	}

body { 
	background: #fff; 
	font: .9em "FRanklin Gothic Book", Arial, Helvetica, sans-serif;
	line-height: 2em; 
	color:#555;
	}

div#wrapper { 
	margin:0 auto; 
	padding: 20px; 
	width:760px; 
	height:auto;
	}
	
p {
	margin-bottom: 20px;
	line-height: 1.3em;
	}

a {
	color:#2F96BF;
	}

a:hover {
	color: #333;
	}

/*---------------------------------------------------------------------------------
01  LAYOUT
--------------------------------------------------------------------------------- */

div#logo { 
	float: left;
	padding:0; 
	}

div#logo a { 
	width:243px;
	height:36px;
	display:block;	
	background:url(../img/template-img/paul-maher.gif) top;
	}

div#logo a:hover { 
	background:url(../img/template-img/paul-maher.gif) bottom;
	}

div#navigation { 
	float: right;
	text-align: right;
	padding:0;
	margin-top: 25px;
	}

div#photo { 
	float: left;
	padding:0;
	margin-top: 20px;
	width:760px;
	height: 200px;
	}









/* 404 Error image */

div#fourohfourwrap {
	float: left;
	width:760px;
	clear:both;
	margin-bottom:30px;
	}

div#fourohfour { 
	float: left;
	width:760px;
	}

div#yargh {
	float: left;
	background:url(../img/template-img/404-speech.gif) no-repeat;
	padding:5px 0 0 20px;
	margin:20px 0 0 280px;
	width:500px;
	height: 84px;
	}
	
div#yargh p.intro {font: 18px/0px 'HattoriHanzoLight', Arial, sans-serif; margin-bottom: 10px}	



div#photo-shadow { 
	float: left;
	padding:0;
	margin:0;
	width:760px;
	height: 68px;
	background: url(../img/template-img/photo-shadow.jpg)
	}
		
div#content { 
	float: left;
	margin: 0 10px;
	margin-top: -30px;
	width:740px;
	}
	
div#home-content { 
	float: left;
	margin: 0;
	width: 550px;
	}
	
div#right-content { 
	float: right;
	margin: 0;
	margin-left: 40px;
	width: 150px;
	}
	
div#footer { 
	float: left;
	width:720px; 
	padding:0 20px;
	background:url(../img/template-img/bg.jpg); 
	border: 1px dashed #ccc;
	margin:30px 0 0 0;	
	}
	
#twitter_div {}
ul#twitter_update_list {	
	margin: 0;
	padding: 20px 0;
	}	
	
ul#twitter_update_list li {
	padding-bottom: 20px;
	padding-left: 73px;
	list-style-type: none;
	background: url(../img/template-img/social/twitter-bird.gif) no-repeat 10px 0px;
	height: 36px;
	font: 18px/27px 'HattoriHanzoLight', Arial, sans-serif;
	}	
	
ul.social-links {
	margin: 0;
	padding: 0;
	float:right;
	width: 150px;
	}

ul.social-links li {
	border-bottom: 1px dashed #CCC;
	list-style-type: none;
	}
	
ul.social-links li a {
	text-decoration: none;
	display: block;
	padding-left: 36px;
	}

ul.social-links li.facebook {background: url(../img/template-img/social/facebook.gif) no-repeat 5px 7px;}	
ul.social-links li.twitter {background: url(../img/template-img/social/twitter.gif) no-repeat 5px 7px;}	
ul.social-links li.lastfm {background: url(../img/template-img/social/lastfm.gif) no-repeat 5px 7px;}	
ul.social-links li.delicious {background: url(../img/template-img/social/delicious.gif) no-repeat 5px 7px;}	
ul.social-links li.flickr {background: url(../img/template-img/social/flickr.gif) no-repeat 5px 7px;}	
ul.social-links li.linkedin {background: url(../img/template-img/social/linkedin.gif) no-repeat 5px 7px;}
ul.social-links li.threadless {background: url(../img/template-img/social/threadless.gif) no-repeat 5px 7px;}	
ul.social-links li.foursquare {background: url(../img/template-img/social/foursquare.gif) no-repeat 5px 7px; border-bottom: 0;}	
		
/*****************************************************
02  NAVIGATION
******************************************************/
		
div#navigation ul { 
	padding:0; 
	margin:0; 
	list-style:none; 
	}

div#navigation ul li { 
	margin:0; 
	padding:0; 
	list-style:none; 
	display:inline; 
	border-right:1px solid #ccc;
	}

div#navigation ul li { 
	margin:0; 
	padding:0 10px; 
	list-style:none; 
	display:inline; 
	border:none;
	}

div#navigation ul li a { 
	text-decoration:none; 
	color:#000;
}

div#navigation ul li a.selected { 
	text-decoration:none; 
	color:#2F96BF;
	}

div#navigation ul li a:hover { 
	text-decoration:none;
	color:#2F96BF;
 	}


/*****************************************************
03  FONT EMBED
******************************************************/

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

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

h1.heading {font: 30px/0 'HattoriHanzoLight', Arial, sans-serif;letter-spacing: 0; margin-bottom:30px; color: #000;}
h2.heading {font: 20px/20px 'HattoriHanzoLight', Arial, sans-serif;letter-spacing: 0; margin-bottom:10px; color: #000;}
p.intro {font: 18px/27px 'HattoriHanzoLight', Arial, sans-serif; margin-bottom: 10px}

div#navigation ul {font: 16px/0px 'HattoriHanzoLight', Arial, sans-serif; text-transform:uppercase;}
ul.social-links {font: 20px/30px 'HattoriHanzoLight', Arial, sans-serif;}

/*****************************************************
04  PORTFOLIO
******************************************************/

.boxgrid { 
	width: 223px; 
	height: 180px; 
	float:left;
	overflow: hidden;
	position: relative; 
	padding-right: 10px;
	margin-right: 20px;
	padding-top:0px;
	}

.boxgrid img{ 
	position: absolute; 
	top: 0; 
	left: 0; 
	border: 0; 
	}
	
.boxgrid p{ 
	padding: 70px 0 0 10px;
	color:#000;
	line-height: 20px;
	width: 223px;
	}
	
.last {
	margin-right:0px;
	}
 
 .portfolio {
	margin:0;
	padding:0;
	overflow: hidden;
	}
	
.portfolio li {
	float: left;
	margin:0px 20px 7px 0px;
	padding: 0;
	position: relative;
	}

.portfolio li a:hover {
	border:none;
	}

.portfolio li.last {
	margin-right:0px;
	}
	
.galleryboxgrid { 
	width: 223px; 
	height: 215px; 
	float:left;
	overflow: hidden;
	position: relative; 
	padding-right: 10px;
	margin-right: 20px;
	padding-top:0px;
	}
	
.galleryboxgrid img{ 
	position: absolute; 
	top: 0; 
	left: 0; 
	border: 0; 
	}
	
.galleryboxgrid p{ 
	padding: 70px 0 0 10px;
	color:#000;
	line-height: 20px;
	width: 223px;
	}
	
 .gallery {
	margin:0;
	padding:0;
	overflow: hidden;
	}
	
.gallery li {
	float: left;
	margin:0px 20px 20px 0px;
	padding: 0;
	position: relative;
	}

.gallery li a:hover {
	border:none;
	}

.gallery li.last {
	margin-right:0px;
	}
