/*

Theme Name: Jeff Porro Blog
Description: Simple, modern, lightweight
Version: 1.0
Author: Vitamin
Author URI: http://www.vitaminisgood.com

*/

* { 
	padding: 0;
	margin: 0;
}

body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 15px;
	background: #232323 url("./images/body-bg-tile.jpg") repeat-x top;	
	text-align: center;
	color: #c6c6c6;
}

.clear {
	clear: both;
}

.float-left {
	position: relative;
	float: left;
}

.float-right {
	position: relative;
	float: right;
}

.break-dotted {
	clear: both;
	border-top: 2px dotted #3f3f3f;
	padding-bottom: 10px;
}


/* Framing */

#wrapper {
	margin: 0 auto;
	width: 100%;
	text-align: left;
}

		#header {
			position: relative;
			margin: 0 auto;
			width: 940px;
			height: 181px;
		}
		
			
			#header h1 img {
				position: absolute;
				top: 94px;
				left: -4px;			
			}
			
			
			
			#main-nav {
				list-style: none;
				position: absolute; 
				top: 96px;
				right: -7px;
				width: 580px;
				height: 41px;
			}
			
					#main-nav li {
						position: relative; 
						float: left;
						padding-left: 5px;
					}
					
					#nav-about a { width: 80px; height: 41px; background: transparent url("./images/nav-about.jpg") no-repeat 0 0; display: block; }
					#nav-blog a { width: 65px; height: 41px; background: transparent url("./images/nav-blog.jpg") no-repeat 0 0; display: block; }
					#nav-contact a { width: 90px; height: 41px; background: transparent url("./images/nav-contact.jpg") no-repeat 0 0; display: block; }

					#nav-services a { width: 96px; height: 41px; background: transparent url("./images/nav-services.jpg") no-repeat 0 0; display: block; }
					#nav-whatsnew a { width: 125px; height: 41px; background: transparent url("./images/nav-whatsnew.jpg") no-repeat 0 0; display: block; }
					#nav-toolkit a { width: 154px; height: 41px; background: transparent url("./images/nav-toolkit.jpg") no-repeat 0 0; display: block; }			
					#nav-clients a { width: 91px; height: 41px; background: transparent url("./images/nav-clients.jpg") no-repeat 0 0; display: block; }			
					#nav-results a { width: 89px; height: 41px; background: transparent url("./images/nav-results.jpg") no-repeat 0 0; display: block; }
					
					#nav-about a:hover,
					#nav-services a:hover,
					#nav-whatsnew a:hover,
					#nav-blog a:hover,
					#nav-toolkit a:hover,
					#nav-clients a:hover,
					#nav-results a:hover,
					#nav-contact a:hover {
						background-position: 0 -41px;
					}
					
					#nav-about a.active,
					#nav-services a.active,
					#nav-whatsnew a.active,
					#nav-blog a.active,
					#nav-toolkit a.active,
					#nav-clients a.active,
					#nav-results a.active,
					#nav-contact a.active {
						background-position: 0 -82px;
					}
						
					#main-nav li a span {
						display: none;
					}
					
			#header #utility{
				height: 39px;
				width: 220px;
				background: url('./images/nav-utility-bg.jpg') no-repeat 0 0 ;
				position: absolute;
				right: 0;
				top: 0;
			}
			
				#header #utility ul{
					list-style: none;
					font-size: 13px;
					margin-top: 10px;
					margin-left: 10px;
					
				}
				
					#header #utility ul li{
						float: left;
						margin-left: 10px;	
						display: inline;					
					}
					
						#header #utility ul li a{
							color: #e39494;
						}
						
							#header #utility ul li a:hover{
								text-decoration: none;
								color: white;
							}
						
						#header #utility ul li a span{
							display: none;
						}
						#header #utility ul li a#facebook-btn,
						#header #utility ul li a#twitter-btn{
							width: 16px;
							height: 15px;
							position: relative;
							display: block;
							overflow: hidden;
							margin-top: 1px;
						}
						
						#header #utility ul li a#facebook-btn{
							background: url('./images/nav-utility-fb.jpg') no-repeat 0 0 ;
							margin-left: 4px;
						}

							#header #utility ul li a#facebook-btn:hover{
								background-position: 0 -16px;
							}

						#header #utility ul li a#twitter-btn{
							background: url('./images/nav-utility-tw.jpg') no-repeat 0 0 ;
						}					
							
							#header #utility ul li a#twitter-btn:hover{
								background-position: 0 -16px;
							}
			


					
#banner {
	position: relative;
	margin: 0 auto;
	width: 940px;
	height: 96px;
	border-bottom: 3px solid #393939;
	margin-bottom: 20px;
}


	#banner h1 {
		font-family: Helvetica, Arial, sans-serif;
		font-size: 30px;
		line-height: 30px;
		position: absolute;
		top: 46px;
	}
	
	#banner h1.head-blog-title a { 
		background: transparent url("./images/head-banner-blogtitle.gif") no-repeat 0 0;
		display: block;
		width: 366px;
		height: 33px;
	}
					
	#banner h1 a span {
		display: none;
	}
				

	#content-wrapper {
			position: relative;
			margin: 0 auto;
			width: 940px;
		}			
			
			
			#content {
				position: relative;
				width: 940px;
			}
							
													
							#content span {
								display: none;
							}
													
							#content p a {
								color: #72d3e7;
								text-decoration: none;
							}
							
							#content p a:hover {
								color: #8ce3f5;
								text-decoration: underline;
							}
					
							
			#content #left-col {
				position: relative;
				float: left;
				width: 580px;
				margin-bottom: 40px;
			}							
				
				
					#left-col .article blockquote {
					  margin: 0 20px;
					  padding: 0 15px;
					  border-left: 5px solid #a8aaab;
					  background: none;
					}
					
					#left-col h2.header {
						font-size: 23px;
						line-height: 28px;
						font-weight: normal;		
						color: #8ce3f5;
						margin-bottom: 0;
					}
					
					#left-col h2.header a {
						color: #8ce3f5;
						text-decoration:none;
					}

					#left-col h2.header a:hover {
						color: #8ce3f5;
						text-decoration: underline;
					}

					
					#left-col h3 {
						font-size: 19px;
						line-height: 22px;
						font-weight: bold;		
						color: #ebebeb;
						margin: 12px 40px 10px 0;
					}
					
					#left-col h3.pagetitle {
						margin-top: 0;
					}
						
						#left-col p {
							line-height: 22px;
							margin-bottom: 18px;
							color: #cacaca;
						}
						
						#left-col p.byline {
							color: #a8aaab;
						}
						
						#left-col p strong {
							color: #cacaca;
						}
						
						#left-col p.continue {
							position: relative;
							padding-bottom: 18px;
							margin-bottom: 0;
						}
						
						#left-col .article_footer {
							padding-bottom: 10px;
							margin-bottom: 0;
						}
						
						#left-col .article_footer p {
							margin: 0;
							padding: 0;
						}
								
										
						#left-col ul {
							width: 580px;
							list-style: none;
							margin-bottom: 18px;
						}									
								
								#left-col ul li {
									padding: 5px 15px;
									font-size: 15px;
									color: #a8aaab;
								}
								
								#left-col ul.no-bullets { 
									margin-left: 0;
								}
								
								#left-col ul.no-bullets li {
									padding: 5px 0;
								}
								
								#left-col ul li { 
									background: transparent url("./images/nav-arrow-active.gif") no-repeat 0 50%;
								}
								
								#left-col ul li a {
									color: #72d3e7;
									text-decoration: none;
								}
								
								#left-col ul li a:hover {
									color: #8ce3f5;
									text-decoration: underline;
								}

						#left-col .entry ol {
							margin-bottom: 18px;
							width: 560px;
						}									
								
								#left-col .entry ol li {
									margin-left: 24px;
									padding: 5px 0;
									font-size: 15px;
									color: #a8aaab;
								}

					#content #right-col {
						position: relative;
						float: right;
						width: 320px;
						padding-top: 197px;
					}
								
									#note-card {
										 position: absolute;
										 top: -86px;
										 left: -20px;
										 width: 340px;
										 height: 283px;
										 background: transparent url("./images/img-note-card.jpg") no-repeat 0 0;
										 z-index: 100;
									}
					
									#right-col p {
										font-size: 13px;
										line-height: 24px;
										margin: 0 20px 18px 20px;
										color: #a8aaab;
									}
							
									#right-col h3.fpo-head {
										width: 250px;
										height: 35px;
										background: transparent url("/images/head-fpo.gif") no-repeat;
										margin-left: 20px;
										display: block;
									}
									
												
							#search-mod {
								position: relative;
								width: 320px;
								background: transparent url("./images/subs-bg-mid.jpg") repeat-y;
								margin-bottom: 15px;
							}
							
							
									#search-mod-top {
										padding-top: 20px;
										position: relative;
										width: 320px;
										background: transparent url("./images/subs-bg-top.jpg") no-repeat top;
									}
									
									
									#search-mod-bottom {
										position: relative;
										width: 320px;
										background: transparent url("./images/subs-bg-bottom.jpg") no-repeat bottom;
									}								
											
											
											#search-mod h3,
											.mod-typ h3 {
												position: relative;
												width: 275px;
												height: 28px;
												display: block;
												margin-left: 18px;
												padding-bottom: 10px;
											}
									
											
											h3.subs-search { background: transparent url("./images/head-subs-search.gif") no-repeat 0 0; }
											h3.subs-recent { background: transparent url("./images/head-subs-recent.gif") no-repeat; }
											h3.subs-recommends { background: transparent url("./images/head-subs-recommend.gif") no-repeat; }
											h3.subs-cats { background: transparent url("./images/head-subs-cats.gif") no-repeat; }
											h3.subs-syndicate { background: transparent url("./images/head-subs-syndicate.gif") no-repeat; }	
											
											
											
											#search-mod p {
												font-size: 13px;
												line-height: 17px;
												margin-bottom: 15px;
											}
											
											#search-mod p.quote {
												font-size: 17px;
												line-height: 22px;
												margin-bottom: 12px;
												color: #a8aaab;
											}
											
											#search-mod p strong {
												color: #ebebeb;
												font-weight: normal;
											}																				

											.linkcat,
											.categories {
												list-style: none;
												margin: 0;
												padding: 0;
											}
						
						
							.mod-typ {
								position: relative;
								width: 320px;
								background: transparent url("./images/mod-bg-middle.jpg") repeat-y;
								margin-bottom: 16px;
							}
							
							
									.mod-typ-top {
										padding-top: 20px;
										position: relative;
										width: 320px;
										background: transparent url("./images/mod-bg-top.jpg") no-repeat top;
									}
									
									.mod-typ-bottom {
										position: relative;
										width: 320px;
										background: transparent url("./images/mod-bg-bottom.jpg") no-repeat bottom;
									}

																		
											.mod-typ ul {
												position: relative;
												list-style: none;
												padding-bottom: 12px;
												margin: 0 20px;
											}
																						
											.mod-typ ul li {
												position: relative;
												list-style: none;
												padding: 10px 15px;
												font-size: 15px;
												border-top: 1px dotted #3f3f3f;
												background: transparent url("./images/nav-arrow-inactive.gif") no-repeat 0 50%;
											}
											
											.mod-typ ul li.last {
												border-bottom: none;
												margin-bottom: 8px;
											}
											
											.mod-typ ul li a {
												color: #72d3e7;
												text-decoration: underline;
											}
											
											.mod-typ ul li a:hover {
												color: #8ce3f5;
												text-decoration: none;
												
											}
											
											.mod-typ p {
												padding: 0 0 24px 0;
											}
											
											.mod-typ p a {
												font-size: 15px;
												text-decoration: underline;
											}
											
											.mod-typ p a:hover {
												text-decoration: none;
											}
											
									#search-mod input,	
									#search-mod textarea,	
									.mod-typ input,
									.mod-typ textarea {
										position: relative;
										float: left;
										margin-left: 18px;
										height: 18px;
										width: 218px;
										padding: 5px;
										background-color: #3c3c3c;
										font-size: 13px;
										font-family: Helvetica, Arial, sans-serif;
										color: #cacaca;
										border: none;								
									}	
									
									#search-mod input.submit,
									.mod-typ input.submit {
										position: relative;
										float: left;
										background: transparent url("./images/btn-search-submit.jpg") no-repeat 0 0;
										width: 30px;
										height: 31px;
										cursor: pointer;
										border: none;
									}
									
									#searchform {
										position:relative;
										height: 60px;
										margin-bottom: 16px;
									}
									
									
									img.rss-icon {
										position: relative;
										float: left;
										padding-right: 8px;
									}
										
								
			
			#footer {
				position: relative;
				margin: 0 auto;
				width: 940px;
				border-top: 3px solid #393939;
				margin-top: 20px;
				padding-top: 12px;
				padding-bottom: 40px;
			}
			
					#footer p {
						font-size: 13px;
						color: #a8aaab;
					}
					
					#footer p.float-left {
						/*width: 800px;*/
						width: 806px;
					}
					
					#footer p strong {
						font-weight: normal;
						color: #72d3e7;
					}
					
					#footer p span {
						color: #3b3b3b;
						display: inline!important
					}
					
					#footer a {
						color: #a8aaab;
						text-decoration: underline;
					}
					
					#footer a:hover {
						text-decoration: none;
					}
					
/*-----------------------------------------------------------------------------

  Wordpress Specific Stuff - Elements that weren't in my original stylesheet

-----------------------------------------------------------------------------*/

ol.commentlist {
	list-style: none;
	width: 580px;
	font-size: 15px;
	line-height: 22px;
	margin: 0;
	padding: 0;
}

ol.commentlist li {
	margin: 0;
	padding: 10px 15px;
}

ol.commentlist li.alt {
	background-color: #333333;
	margin: 0;
	padding: 10px 15px;
}

cite a {
	color: #72d3e7;
	text-decoration: none;
}

cite a:hover {
	text-decoration: underline;
}

input#author,
input#email,
input#url {
	border: none;
	padding: 5px;
	background-color: #3c3c3c;
	font-size: 13px;
	font-family: Helvetica, Arial, sans-serif;
	color: #cacaca;
}

textarea#comment {
	width: 570px;
	border: none;
	padding: 5px;
	background-color: #3c3c3c;
	font-size: 13px;
	font-family: Helvetica, Arial, sans-serif;
	color: #cacaca;
}

#commentform #submit {
	position: relative;
	background: transparent url("./images/btn-submit.jpg") no-repeat 0 0;
	width: 136px;
	height: 39px;
	cursor: pointer;
	border: none;	
	display: block;
}

#main p.comment_meta {
	margin:0;
	float:right;
}

/* Optional popup window (NOTE: popups make for bad UI IMHO) */
body#commentspopup {
	background:#FFF;
	padding:20px;
}

body#commentspopup a {
	color:#666;
}

body#commentspopup h1 a {
	position:relative;
	top:0;
	left:0;
}

body#commentspopup h3 {
	color:#555;
}

body#commentspopup p {
	margin:10px 0;
	color:#555;
}

body#commentspopup textarea {
	width:300px;
}

/* Image stuff for 2.6.1 */
.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.alignleft {
	float: left;
	margin-right: 20px;
}

.alignright {
	float: right;
	margin-left: 20px;
}

.wp-caption {
	border: 1px solid #333333;
	text-align: center;
	background-color: #333333;
	padding: 4px 0 0 0;
	margin-bottom: 10px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.wp-caption img {
	margin: 0;
	padding: 0;
}

.wp-caption p.wp-caption-text {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 12px;
	font-style: italic;
	color: #cacaca;
	text-align: left;
	padding: 5px 5px 0 5px;
	margin: 0;
}



p.entry_info {
	clear:both;
}

.navigation a {
	color: #72d3e7;
	text-decoration: none;
}

.navigation a:hover {
	text-decoration: underline;
}