/* 
	stylesheet for anonymoushash.com
	copyright Mike Waters 2007
--------------------------------------------------------

	Notes:

		- margin-right property of #content-right must be equal (or >) to combined width and l/r margins of #content-left (>, by .5em, for testing leeway)
		- header row is 95 pixels high
		- logo image should be 445 pixels wide and 94 pixels high; 1 pixel is reserved for defining the border between header and content
		- we need to supply the actual width of the logo image to it's container div (#logo) so that #logo-suffix is positioned properly

	The idea:

		- the entire content area will be composed of block-level elements (div)
		- all text will be encapsulated in either a heading (h1,h2 etc) or a paragraph (p)
		- headings and paragraphs will be rigidly controlled; all required layout behavior will be controlled by these rules and specific exceptions to these rules.

TODO: 
	

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


/* base element styles
-------------------------------------------------------- */

* { 
	
	padding: 0; margin: 0; border: 0; 
	
} 

body {
	
	font-size: 76%;
	font-family: 'Lucida Sans Unicode',Verdana,Arial,sans-serif;
	text-align: center;
	font-size-adjust:none;
	font-stretch: normal;
	font-style:normal;
	font-variant:normal;
	font-weight:normal;
	line-height:normal;
	color: #000; 
	 
}

li { list-style: none; }
h1 { font-weight: 700; font-size: 2.0em;}
h2 { font-weight: 700; font-size: 1.45em;}
h3 { font-weight: 700; font-size: 1.15em;}
h4 { font-weight: 400; font-size: 1.1em;}
h5 { font-weight: 400; font-size: .9em;}
h6 { font-weight: 400; font-size: .8em;}
p { font-weight: 400; font-size: 1em; text-indent:3em;}


/* basic page layout containers
-------------------------------------------------------- */

#header-wrapper {
	height: 95px; width: 100%;
	overflow:hidden;
}

#content-wrapper {
	background: white;
	width: 100%;
	float: left;
	padding-bottom:15px;
}

#footer-wrapper {
	background: #1c253b url("images/back-bottom.gif") left top repeat-x;
	width: 100%;
	float: left;
}

#header, #content, #footer {
	
	width:  100%; 
	text-align: left;
	margin: 0 auto;
}

#content {
	
		padding: 2em 0;
}


/* header elements
-------------------------------------------------------- */
#logo-wrapper 
{
	/* logo uses a console font to display the IP address and the rest of the non-image based logo elements */
	font-size: 90%;
	font-family:'Lucida Console';
	height: 95px; width: 100%;
	background: url("images/back-header.gif") left top repeat-x;
	padding-left: 1.5em;
}

#logo-prefix 
{

	text-align: left;
	color: #336699;
	position: relative;
	
	top: 0; 
	width: auto; 
	float:left;
}
#logo {
	position: relative;
	top: 0; 
	width: 445px; height: 94px;
	background: url("images/ah-logo.jpg") no-repeat;
	float: left;
}
#logo-suffix {
	text-align: left;
	color: #336699; 
	position: relative;
	
	top: 0; 
	width: auto;

	float:left;
}

#logo a, #logo h2 {		/* ?????????????? */
	display: block;
	width: 445px; height: 94px;

}


/* content elements
-------------------------------------------------------- */

#content-left {

	background-color: transparent;
	position: relative;
	
	width: 11.5em; 
	float: left;

	line-height: 1.5em;
	letter-spacing: 2px;
	
	margin: 0px .5em 0px 1.5em;
	padding-bottom: 2em;
	/*border: 1px solid black;*/
	
}

#content-right {
	
	
	background-color: transparent;
	position: relative;
	
	width: auto;
	margin: 0px 1.5em 0px 14em;
	padding-bottom: 2em;
	z-index: 1;

}

#content a {
	color: #7f392f;	/*#692523;*/
	text-decoration: none;
	font-size:1em;
}

#content a:hover, #footer a:hover {
	color: #401D18;
	text-decoration:underline;
}
		

#footer p {
	color: #4c68a1;
	padding: 5px 1.5em;
	text-align: right;
}

#footer a { color: #4c68a1; }


/* node elements
-------------------------------------------------------- */

.node {
	padding-top: 20px;					/* separate nodes by 20px by padding the top of each node */
}

.first  {
	padding-top: 0px;					/* exempt the first node from the rule above */					
}

.node h1, .node h2, .node h3, .node h4, .node h5, .node h6, .node p {
	padding: 10px 15px;					/* pad every possible text container that appears inside/as the child of of a node*/	
}

.first h2.nodetitle {
	padding-top: 0px;					/* exempt the first node's title from part of the rule above */
}

.node h5.nodecats, .node h5.nodedate {
	padding: 0px 15px;					/* exempt all category and date containers from the rule above */
}

h2.nodetitle {
	letter-spacing:.5px;
	color:#29406e;
	
	padding-bottom:5px;
}

.nodebody {
	padding-bottom: 1.5em;
}

h5.nodecats {
	color:#968D8D;
}
h5.nodedate {
	color:#968D8D;
}
h5.nodetags {
	padding: 0px 15px 5px 60em; overflow:hidden;
	color:#968D8D;	
}
.nodefooter h5 {
	padding: 3px 15px 3px 5px;			/* the node footer has it's own behavior */
}
.nodefooter {
	border: 1px solid #968D8D;
	margin: 0px 15px 10px 15px;
	color:#29406e;
}
.nodedata {
	/* unused, for now; will be useful if we need to shift most of a node to the l or r */
}




/* utility classes
-------------------------------------------------------- */
.hide { display: none; }

 /* 'syntax coloring' for the header row/logo v1 */
.code-black { color:#000000; }
.code-blue { color:#2c297e;	}
.code-maroon { color:#660000; }
.code-green { color:#339900; font-style:italic; }
.ip { font-weight:bold; }






/*
div.left h3 {
	font-size: 1.4em;
	font-weight: normal;
	color: #69c2ff;
}
h4 {
	font-size: 1.2em;
	font-weight: normal;
	color: #69c2ff;
	padding-top: 1em;
}

.smalltext {

	font-size:.8em;
	padding:0px;
	margin:0px;
	line-height:1em;
}



#content-right p, #content-right li {
	padding-bottom: 1em;
	line-height: 1.4em;
}

#content-right li {
	background: url("images/bullet-arrow.gif") left 5px no-repeat;
	padding-left: 12px;

	position: relative;
	margin-left: 20px;
	padding-left: 20px;
}

#content-left h3 {
	border-bottom: 1px solid #3b5488;
	margin-bottom: 6px;
}

h1 {
	font-size: 1.4em;
	font-weight: normal;
	padding-bottom: 21px;
}
*/