/*
Theme Name: Stringshot v3.0
Theme URI: http://www.stringshot.com/
Description: Description: Stringshot is a Wordpress theme developed specifically for stringshot.com, the blog and portfolio of Nathan Spainhour.
Version: 1.0
Author: Nathan Spainhour
Author: http://www.stringshot.com/
*/


/********************* MEYER RESET **********************/	
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}


/********************* 960 GRID SYSTEM **********************/	
.container_12,.container_16{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16{display:inline;float:left;margin-left:10px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{width:340px}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:'.';display:block;visibility:hidden;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}


/********************* 

STRINGSHOT CSS FILE WELCOME MESSAGE

Hey there. You've reached the css file (at least the one that counts) for Stringshot.com. 
The other css files are Eric Meyer's reset file, and the 960 grid system framework file (lifesavers). 
This one was mostly written by me, Nathan Spainhour, except for some techniques 
that I got from various places online.
Anyway, have fun looking around, and if this css can help YOU out in anyway, be my guest.
Thanks for stopping by :)

**********************/

.displace {
	position: absolute;
	left: -5000px;
	}

body{
	font-size: small;
	font-family: Arial, sans-serif;
	color: #000000;
	}

body.home{
	background: #ffffff url(images/backgroundPattern.jpg) repeat-x;
	}

body.blog, body.single, body.archive{
	background: #ffffff url(images/headerBG.jpg) repeat-x;
	}

body.contact, body.page-template-Stringshot_Contact-php{
	background: #ffffff url(images/headerBG.jpg) repeat-x;
	}
	
#header{
	padding: 3px 0 0 0;
	height: 51px;
	}	
	
a {
	color: #666666;
	text-decoration: none;
}

a:hover {
	color: #ff0906;
}

h2, h3, h4, h5{
	font-weight: normal;
	font-size: 90%;
}

/********************* "g" ICON **********************/	
		
a.icon {
	display: block;
	width: 52px;
	height: 51px;
	text-decoration: none;
	background: url(images/stringshoticon.png);
	}

a.icon:hover {
	background-position: 0 -51px;
	}

a.icon:active {
	background-position: 0 -102px;
	}
	
	
/********************* MAIN NAV **********************/	
	
	
/*
*	NAVIGATION SETUP
*/
ul.mainNav {
	list-style: none;
	padding: 0px;
	height:30px;
	margin: -3px 0 0 0
	}
	
ul.mainNav li {
	margin: 0 0 0 33px;
	float: left; 
	}

/*
*	Home Link
*/
ul.mainNav li.home a {
	display: block;
	width: 39px;
	height: 30px;
	text-decoration: none;
	background: url(images/navHome_btn.png);
	}

ul.mainNav li.home a:hover {
	background-position: 0px -30px;
	}

ul.mainNav li.home a:active {
	background-position: 0px -60px;
	}
	
body.home ul.mainNav li.home a {
	background-position: 0px -90px;
	}	
	
/*
*	Blog Link
*/
ul.mainNav li.blog a {
	display: block;
	width: 34px;
	height: 30px;
	text-decoration: none;
	background: url(images/navBlog_btn.png);
	}

ul.mainNav li.blog a:hover {
	background-position: 0px -30px;
	}

ul.mainNav li.blog a:active {
	background-position: 0px -60px;
	}
	
body.blog ul.mainNav li.blog a, body.single ul.mainNav li.blog a, body.archive ul.mainNav li.blog a{
	background-position: 0px -90px;
	}	
	
/*
*	Portfolio Link
*/
ul.mainNav li#portfolio a {
	display: block;
	width: 72px;
	height: 30px;
	text-decoration: none;
	background: url(images/navPortfolio_btn.png);
	}

ul.mainNav li#portfolio a:hover {
	background-position: 0px -30px;
	}

ul.mainNav li#portfolio a:active {
	background-position: 0px -60px;
	}
	
body li#portfolio ul.mainNav li.portfolio a {
	background-position: 0px -90px;
	}	
	
/*
*	Contact Link
*/
ul.mainNav li.contact a {
	display: block;
	width: 60px;
	height: 30px;
	text-decoration: none;
	background: url(images/navContact_btn.png);
	}

ul.mainNav li.contact a:hover {
	background-position: 0px -30px;
	}

ul.mainNav li.contact a:active {
	background-position: 0px -60px;
	}
	
body.contact, body.page-template-Stringshot_Contact-php ul.mainNav li.contact a {
	background-position: 0px -90px;
	}	
			
/********************* HOME PAGE FLASH **********************/		

#flash {
	height:192px;
	width:960px;
}

#flash h1 {
	font-weight: normal;
	font-size: 150%;
	color: #ff0906;
	margin: 30px auto 0 auto;
	text-align: center;
}

#flash p{
	margin: 5px auto 0 auto;
	text-align: center;
	font-size: 90%;
	line-height: 140%;
}

#flash p a{
	text-decoration: underline;
}

/********************* LATEST BLOG ENTRY (HOME PAGE) **********************/

#recentPost{
	margin-bottom: 32px;
}

#recentPost p{
	font-size: 90%;
	line-height: 18px;
}

#recentPost h2{
	margin-top: 51px;
}

h2#recentPostHeader {
	float: left;
	display: block;
	width: 580px;
	height: 22px;
	text-decoration: none;
	background: url(images/LatestBlogEntry2_text.gif) no-repeat;
	}

#rssIcon{
	position: absolute;
	display: block;
	margin: 47px 0 0 560px;
	width: 21px;
	height:21px;
	}

#archiveIndicator{
	position: absolute;
	display: block;
	margin: 33px 0 0 280px;
	width: 300px;
	height:21px;
	text-transform: uppercase;
	text-align: right;
	color:#666666;
	}
	
/********************* FEATURED WORK (HOME PAGE) **********************/	

#featuredWork{}

#featuredWork img{
	margin-top: 4px; 
	margin-bottom: 8px;
	border: none;
}

#featuredWork p{
	font-size: 90%;
	line-height: 18px;
}
	
#featuredWork h2{
	margin-top: 51px;
}

h2#featuredWorkHeader {
	float: left;
	display: block;
	width: 280px;
	height: 22px;
	text-decoration: none;
	background: url(images/FeaturedWork_text.gif) no-repeat;
	}

#featuredWork h3{
	margin-top: 33px;
	color: #666666;
	text-transform: uppercase;
	font-size: 110%;
}	

/********************* ABOUT ME (HOME PAGE) **********************/

#aboutMe{}

#aboutMe p{
	font-size: 90%;
	line-height: 18px;
}

#aboutMe h2{
	margin-top: 51px;
	margin-bottom: 10px;
}

h2#aboutMeHeader {
	float: left;
	display: block;
	width: 580px;
	height: 22px;
	text-decoration: none;
	background: url(images/AboutMe_text.gif) no-repeat;
	}

/********************* OTHER PLACES TO FIND ME (HOME PAGE) **********************/

#otherPlaces{}

#otherPlaces p{
	font-size: 90%;
	line-height: 18px;
}

#otherPlaces img{
	margin-top: 15px;
	margin-right: 2px;
	border: solid #cccccc 2px;
}

#otherPlaces img:hover{
	border: solid #ff0906 2px;
}

#otherPlaces h2{
	margin-top: 51px;
}

h2#otherPlacesHeader {
	float: left;
	display: block;
	width: 280px;
	height: 22px;
	text-decoration: none;
	background: url(images/FlickrFeed_text.gif) no-repeat;
	}	
	
/********************* BLOG POSTS **********************/	

#postContainer{
	margin-bottom: 37px;
}

#postContainer p{
	font-size: 90%;
	line-height: 20px;
}

#postContainer h2{
	margin-top: 30px;
}

#postContainer #rssIcon{
	position: absolute;
	display: block;
	margin: 27px 0 0 560px;
	width: 21px;
	height:21px;
	}

h2#postHeader {
	float: left;
	display: block;
	width: 580px;
	height: 22px;
	text-decoration: none;
	background: url(images/StringshotBlog_text.gif) no-repeat;
	}
	
#postTitle {
	margin-top: 32px;
}

#postTitle h3{
	color: #666666;
	text-transform: uppercase;
	font-size: 110%;
}	

#postTitle p {
	text-align: right;
	font-size: 80%;	
	margin-top: 2px;
}

#postImage{
	margin-top: 8px;
	margin-bottom: 8px;
	width: 580px; 
	height: 265px; 
	border: #666666 solid 1px;
}

#post p.continueReading{
	margin-top: 10px;
	font-size: 110%;
	text-transform: capitalize;
}

hr{
	border: none;
	display: block;
	width:580px;
	height:2px;
	margin-top: 15px;
	padding-bottom: 10px;
	background: url(images/dottedDivider.gif) no-repeat;
}

/********************* FORWARD AND REVERSE GUIDES **********************/

#guideContainer{
	font-size: 110%;
	text-transform: uppercase;
}

#previousPost{
	text-align: center;
}

#nextPost{

}

/********************* COMMENTS TEMPLATE **********************/

#comments{
	clear:both;
}

.comments-template ol {
list-style: none;
width: 450px;
margin-top: 20px;
}

.comments-template ol li {
line-height: 18px;
margin: 0px 0px 10px 0px;
padding: 10px;
border: 1px solid #d2d2d2;
background-color: #ffffff;
}

.commentmetadata {
font-size: 12px;
margin: 10px 0px;
}

.commentmetadata a {
color: #2279a6;
}

.comments-template small {
font-size: 11px;
}

.comments-template p.nocomments {
padding: 0;
}

.comments-template textarea#comment {
margin: 15px 0;
}

.comments-template input#author, .comments-template input#email, .comments-template input#url {
margin: 10px 5px 5px 0px;
height: 16px;
width: 300px;
}

span.comment-text p {
padding: 10px 0;
}

#captchaImgDiv{
margin-bottom: 15px;
}


/********************* RIGHT COLUMN OR SIDEBAR **********************/	

#floatingG{
	position: absolute;
	display: block;
	margin: -25px 0 0 255px;
	width: 31px;
	height:29px;
	}

#sidebar{
	width: 278px;
	margin-top: 28px;
	margin-bottom: 30px;
	padding-bottom: 40px;
	background: url(images/sidebarBG.jpg) repeat;
	border-top: 7px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
}

#sidebar img{
	margin-top: 13px; 
	margin-bottom: 8px;
	border: none;
}

#sidebar p{
	font-size: 90%;
	line-height: 18px;
}
	
#sidebar h2{
	margin-top: 30px;
	margin-bottom: 10px;
	float: left;
	display: block;
	margin-left: 60px;
	width: 160px;
	height: 22px;
	text-decoration: none;
}

#sidebar h2#sidebarCategories {
	background: url(images/Categories_text.png) no-repeat;
	}

#sidebar h2#sidebarArchives {
	background: url(images/Archives_text.png) no-repeat;
	}

#sidebar h2#sidebarLinks {
	background: url(images/SidebarLinks_text.png) no-repeat;
	}
	
#sidebar h2#sidebarNetworks {
	background: url(images/Networks_text.png) no-repeat;
	}	

#sidebar ul.sidebarActionItems{
	margin-left: 60px;
	width: 160px;
	font-size: 90%;
}

#sidebar ul.sidebarActionItems li{
	line-height: 20px;
}


/********************* CONTACT PAGE **********************/

h2#contactHeader {
	margin-bottom: 30px;
	float: left;
	display: block;
	width: 580px;
	height: 22px;
	text-decoration: none;
	background: url(images/contactMe_text.gif) no-repeat;
	}




/********************* LOWER HALF CONTAINER **********************/

/*
Home Page
*/
body.home #lowerHalf{
	background: url(images/LowerHomeBG.png) no-repeat;
	height: 53px;
	margin-top: 2px;
}

/*
Blog
*/
body.blog #lowerHalf, body.single #lowerHalf, body.archive #lowerHalf{
	background: url(images/LowerHomeBlogBG.jpg) no-repeat;
	height: 50px;
	margin-top: 2px;
}

/*
Contact
*/
body.contact, body.page-template-Stringshot_Contact-php #lowerHalf{
	background: url(images/LowerHomeBlogBG.jpg) no-repeat;
	height: 50px;
	margin-top: 2px;
}


/********************* FOOTER AND COPYRIGHT **********************/

#footer{
	margin-top: 70px;
	margin-bottom: 10px;
}

body.blog #footer, body.single #footer, body.contact #footer, body.page-template-Stringshot_Contact-php #footer, body.archive #footer{
	margin-top:30px;
	margin-bottom: 30px;
}

#footer p{
	font-size: 85%;
	height:40px;
}

#footer img{
	margin: 0 0 -9px 0;
	padding: 0 3px 0 3px;
}