/* =====================================
	Main CSS for HERE
	Created by Tumblize
======================================== */

@import "reset.css";

/* Gilder/Levin image replacement
In the unlikely event of css on images off you still get text */
.replace,
	div#secondary-content h2,
	div#secondary-content h3,
	div#search-form label
{ 
	padding: 0;
	position: relative; 
	overflow: hidden; 
} 

	.replace span,
		div#secondary-content h2 span,
		div#secondary-content h3 span,
		div#search-form label span
	{
		display: block; 
		position: absolute; top: 0px; left: 0px; 
		z-index: 1; /*for Opera 5 and 6*/ 
	} 
/* end image replacement */


/* general styles */
html{
	background: #ead3ab url('../images/bkg-body.jpg') repeat 0 0; /* brown paper bag */
}

body {
	background: transparent url('../images/bkg-body-top.jpg') repeat-x 0 0;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-size: 62.5%;
	line-height: 1.3;
}

a {
	color: #a51f03; /* dark red */
	font-weight: bold;
	text-decoration: none;
}

	a:hover{
		color: black;
	}
	
p, img, 
	div.audio_player, 
	div.video_player, 
	div.caption, 
	div.description,
	div.text
{
	margin-bottom: 1em;
}

strong{
	font-weight: bold;
}

em {
	font-style: italic;
}

ul, ol{
	margin-left: 25px;
	margin-bottom: 1em;
}
	li{
		margin-bottom: 0.25em;
	}

	ul li{
		list-style-type: disc;
	}
	
	ol li{
		list-style-type: decimal;
	}

/* basic box layout elements */
div#page {	
	font-size: 1.3em;
	margin: 0px auto;
	padding: 15px 0 0;
	width: 700px;
}

div#primary-content {
	display: inline; /* for IE double-margin float bug */	
	float: left;
	margin-left: 15px;
	width: 400px;
}


div#secondary-content {
	display: inline; /* for IE double-margin float bug */
	float: right;
	font-size: 0.85em; /* 11px */
	margin-right: 15px;
	width: 235px;
}

/* primary content section styles
================================= */	
div#primary-content h1#logo{
	font-size: 11.13em;
	font-weight: bold;
	letter-spacing: -3px;
	line-height: 0.75;
	margin-bottom: 10px;
}
	
	h1#logo, h1#logo span{ 
		height: 189px; 
		width: 400px; 
		background-image: url('../images/here-logo.jpg'); 
	} 
	
	h1#logo a{
		color: black;
	}

	div#primary-content p#tagline
	{
		font-size: 1.08em;
		font-weight: bold;
		font-style: italic;
	}
	
		p#tagline, p#tagline span{ 
			height: 16px; 
			width: 400px; 
			background-image: url('../images/tagline.gif'); 
		} 
		
div#primary-content h2.tagged-heading{
	background-color: black;
	color: white;
	font-weight: normal;
	margin-bottom: 1em;
	padding: 0.25em 5px;
}

div#primary-content div.post {
	background-image: url('../images/divider-horizontal.gif');
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-bottom: 18px;
	margin-bottom: 10px;
}

	div.post p.date{
		font-size: 0.85em;
		margin-bottom: 8px;
	}
	
	div.post p.post-details{
		font-size: 11px;
		margin-bottom: 0;
	}
	
/* Quote */

div.quote blockquote{
	color: #a51f03; /* dark red */
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size: 1.85em;
}	

	div.quote blockquote p{
		margin-bottom: 0.5em;
	}
	
		div.quote blockquote p a{
			font-weight: normal;
		}

		div.quote blockquote p span{
			color: black;
		}
		
div.quote cite{
	color: black;
	display: block;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-style: normal;
}
	
/* Link */
div.link p.link-wrapper{
	color: #a51f03; /* dark red */
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size: 1.85em;
	margin-bottom: 0.5em;
	text-align: left;
}

/* Audio */
div.audio div.caption{
	margin-bottom: 1em;
}
	
/* Chat */
div.chat h2{
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size: 1.85em;
	line-height: 1.1;
	margin-bottom: 0.25em;
	text-align: left;
}

div.chat ol{
	border-left: 9px solid #a51f03; /* dark red */
	margin-bottom: 1.5em;
	margin-left: 0;
}

	div.chat ol li{
		border-left: 1px solid #ebd5b0; /* light tan */
		list-style: none;
		margin-bottom: 0;
		padding: 8px;
	}

		div.chat ol li.odd{
			background-color: #d4c09e; /* beige */
		}	

		div.chat ol li.even{
			background-color: #ebe0cb; /* tan */
		}
		
			div.chat ol li cite{
				font-style: normal;
				font-weight: bold;
			}
	
			div.chat ol li blockquote,
				div.chat ol li blockquote p
			{
				display: inline;
			}

/* Regular text post */
div.text h2{
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size: 1.85em;
	line-height: 1.1;
	margin-bottom: 0.25em;
	text-align: left;
}

div.text blockquote{
	font-style: italic;
	margin: 0 0.5em;
}

/* paging links */
ul#navigation{
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 0.92em;
	font-weight: bold;
	margin-top: 1em;
	margin-bottom: 1.5em;
	margin-left: 0;
}

	ul#navigation li{
		display: inline;
		float: right;
		margin-bottom: 0;
	}
	
		ul#navigation li.first-child{
			display: inline;
			float: left;
		}
		
			ul#navigation li a{
				border-color: #a51f03; /* dark red */
				border-style: solid;
				border-right-width: 9px;
				color: black;
				display: block;
				padding: 10px;
			}
			
				ul#navigation li.first-child a{
					border-right-width: 0px;
					border-left-width: 9px;
				}
			
				ul#navigation li a:hover{
					border-color: black;
					color: #a51f03; /* dark red */
				}
		
/* Footer (subscribe links) */
p#footer{
	font-size: 1.69em;
	font-weight: bold;
	line-height: 1.1;
}
			
/* secondary content section styles
================================= */
div#secondary-content div#promotional img{
	margin-bottom: 25px;
}

div#secondary-content div#description{
	margin-bottom: 2.7em;
}
	
div#secondary-content h2,
	div#search-form label
{
	display: block;
	font-size: 1.4em;
	font-weight: bold;
	margin-bottom: 0.5em;
	text-align: center;
	text-transform: uppercase;
}

	h2#about, h2#about span{ 
		height: 18px; 
		width: 56px; 
		background-image: url('../images/heading-about.gif'); 
	}
	
	div#search-form label, div#search-form label span{ 
		height: 18px; 
		width: 64px; 
		background-image: url('../images/heading-search.gif'); 
	}
	
	h2#photos, h2#photos span{ 
		height: 21px; 
		width: 64px; 
		background-image: url('../images/heading-photos.gif'); 
	}

div#secondary-content h3{
	font-size: 1.27em;
	font-weight: bold;
	margin-bottom: 0.3em;
	text-transform: uppercase;
}

	div#secondary-content h4{
		margin-top: 1em;
		margin-bottom: 0.25em;
	}

	h3#here-works, h3#here-works span{ 
	   height: 17px; 
	   width: 100px; 
	   background-image: url('../images/heading-here-works.gif'); 
	}
	 
	h3#currently-reading, h3#currently-reading span{ 
	   height: 16px; 
	   width: 145px; 
	   background-image: url('../images/heading-currently-reading.gif'); 
	}
	 
	h3#seminal-reading, h3#seminal-reading span{ 
	   height: 18px; 
	   width: 130px; 
	   background-image: url('../images/heading-seminal-reading.gif'); 
	}
	 
	h3#information, h3#information span{ 
	   height: 18px; 
	   width: 100px; 
	   background-image: url('../images/heading-information.gif'); 
	}
	 
	h3#friends, h3#friends span{ 
		height: 18px; 
		width: 71px; 
		background-image: url('../images/heading-friends.gif'); 
	}

div#secondary-content ul{
	margin-bottom: 2em;
	margin-left: 15px;
}
		
	div#secondary-content ul li{
		line-height: 1.1;
		margin-bottom: 0.4em;
	}
	
/* search form */
div#search-form{
	margin-bottom: 0.5em;
}

	div#search-form input{
		background: #a51f03 url('../images/bkg-input.gif') repeat-x 0 0; /* dark red */
		border: none;
		border-bottom: 1px solid #991d03;
		color: white;
		font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
		font-size: 1.09em;
		font-weight: bold;
		margin-right: 3px;
		padding: 5px 4px 5px;
		text-transform: uppercase;
		width: 95%;
	}
		
/* Search results */
div.searchresultbox{ 
	background-color: #1a1a1a;
}

	div.searchresultrow{
		background-color: white;
		border-bottom: 1px solid #333;
		margin: 0;
		overflow: hidden;
		padding: 5px;
	}
	
		div.searchexcerpt{
			color: #333;
		}

	p#subnav{
		font-size: 0.9em;
		font-weight: bold;
		margin-bottom: 2.5em;
		text-transform: uppercase;
	}

/* Quick Tags */
div#quick-tags{
	margin-bottom: 2.5em;
}

	div#quick-tags h3{
		font-size: 1em;
		margin-bottom: 0em;
	}
	
	div#quick-tags ul,
		div#quick-tags li
	{
		list-style-type: none;
		margin-left: 0px;
	}

/* Flickr photos */
div#flickr{
	margin-bottom: 2.5em;
}

	div#flickr a {
		float: left;
		margin-right: 2px;
		margin-bottom: 2px;
	}

	div#flickr a img{
		display: block;
		margin: 0;
	}