/*
	design.css (extends core.css)
	contains all design specific colors, images and text formatting
	
	All style rule attributes in alpha-numeric order starting from 0-9 A-Z
	x = horizontal, y = vertical
	property: trbl, tb rl, t rl b, t r b l;
	
	-- START ALL STYLES --
*/


/* color glossary
-----------------------------------------------------------------------------
	
	#hex (desc)
	
*/

/* import additional sheets
----------------------------------------------------------------------------- */

@import url("core.css");

/* design specific presentational elements
----------------------------------------------------------------------------- */

body{
	background: #2C2C2C url(../images/bg/sandtile.gif) repeat 0 0;
	border-top: 2px solid #FFCA55;
	color: #333;
	font: normal normal 12px "Arial", Sans-Serif;
}

/* global text presentation
----------------------------------------------------------------------------- */

code, samp, kbd, var{ font-family: "Courier New", "Courier", Monospace; }

h1, h2, h3, h4, h5, h6, b, strong{ font-weight: bold; }
i, em, cite, dfn, ins{ font-style: italic; }
del, code, samp, kbd, var{ font-style: inherit; }

del{ text-decoration: line-through; }
ins{ text-decoration: none; }

abbr, acronym{ border: 0; cursor: help; text-decoration: none; }

h1{ font-size: 24px; }
h2{ font-size: 20px; }
h3{ font-size: 18px; }
h4{ font-size: 16px; color: #fff; font-weight: normal; margin-left: 15px; border-bottom: dashed 1px #454545; padding-bottom: 5px; margin-bottom: 5px; }
h5{ font-size: 14px; }
h6{ font-size: 13px; }

ul, dl{ list-style: square; }
ol{ list-style: decimal; }

li, dt, dd,
p, pre, address,
legend, label, input, textarea, 
select, option, optgroup,
th, td{ font: inherit; }

small{ font-size: 10px; } 	/* 2px smaller, than body base */
big{ font-size: 14px; } 	/* 2px larger, than body base */

img.left,
img.right{
	background: #333;
	border: 1px solid #111;
	margin: 20px 10px 0;
	padding: 3px;
}

img.left{ margin-left: 0; }
img.right{ margin-right: 0; }

/* hyperlinks
----------------------------------------------------------------------------- */

a{ text-decoration: underline; }
.no-decor a{ text-decoration: none; }

#content_wrap a:link, 
#content_wrap a:visited{ color: #FFCA55; }

#content_wrap a:hover, 
#content_wrap a:active{ color: #FFF; }

/* forms
----------------------------------------------------------------------------- */

form#contact_ian{ margin-left: 15px; }

label{
	color: #CCC;
	display: block;
	font-size: 12px;
	padding: 10px 0 5px;
}

input,
select,
textarea{
	background: #222;
	border: 1px solid;
	border-color: #111 #000 #000 #111;
	color: #CCC;
	padding: 3px 5px;
	width: 300px;
}

textarea{ height: 150px; width: 450px; }

select,
.button input,
.chad input{ width: auto; }

fieldset.button{ padding: 5px 0; }

	.button input{
		background: #000;
		border: 0;
		color: #FFF;
		text-transform: uppercase;
	}

	.chad input{ 
		background: transparent;
		border: 0;
		vertical-align: middle; 
	}

/* design specific presentational ID's
----------------------------------------------------------------------------- */

#wrap{
	margin: 0 auto;
	width: 880px;
}

#header{ 
	height: 100px;
	padding: 28px 0 0;
	position: relative; 
}

	#header h1{
		background: transparent url(../images/logo.gif) no-repeat 0 0;
		height: 62px;
		text-indent: -13000em;
		width: 334px;
	}
	
		#header h1 a:link,
		#header h1 a:visited{
			display: block;
			height: 62px;
			width: 334px;
		}

	#header ul{ 
		list-style: none;
		position: absolute;
		right: 0;
		top: 0; 
	}
	
		#header ul li{ float: left; margin-left: 15px; }
		
			#header ul li a:link,
			#header ul li a:visited{
				background: transparent url(../images/menu/home.gif) no-repeat 0 0;
				display: block;
				height: 78px;
				text-indent: -13000em;
				width: 68px;
			}
			
				#header ul li.bio a:link,
				#header ul li.bio a:visited{ 
					background-image: url(../images/menu/bio.gif);
					width: 50px;
				}
			
				#header ul li.design a:link,
				#header ul li.design a:visited{ 
					background-image: url(../images/menu/design.gif);
					width: 82px;
				}
			
				#header ul li.blog a:link,
				#header ul li.blog a:visited{ 
					background-image: url(../images/menu/blog.gif);
					width: 64px;
				}
			
				#header ul li.contact a:link,
				#header ul li.contact a:visited{ 
					background-image: url(../images/menu/contact.gif);
					width: 100px;
				}
			
			#header ul li a:hover,
			#header ul li a:active{ background-position: 0 -78px; }
			
			#header ul li a:link.act,
			#header ul li a:visited.act{ background-position: 0 -156px; }

#masthead{}

#content_wrap{}

#sidebar,
#main_content{
	float: left;
}

#sidebar{
	width: 280px;
}

	#bio_box{
		background: transparent url(../images/bg/bio_box.png) repeat 0 0;
		padding: 0 0 1px;
	}
	
		#bio_box h3{
			border-bottom: 1px dashed #494949;
			color: #CFE09F;
			font-size: 13px;
			font-weight: normal;
			margin: 0 15px;
			padding: 15px 0 10px;
			text-transform: uppercase;
		}
		
		p,
		address{
			color: #CCCCCC;
			font: normal 11px/2 "Verdana", Sans-Serif;
			margin: 15px;
		}
		
		#bio_box p{ margin-top: 6px; }
		
	#related_links h3{
		background: #1A1A1A url(../images/ico/related.gif) no-repeat 95%;
		border: dashed #494949;
		border-width: 1px 0;
		color: #CFE09F;
		font-size: 13px;
		font-weight: normal;
		margin: 10px 0 0;
		padding: 10px;
		text-transform: uppercase;
	}
	
	#related_links ul{
		list-style: none;
		margin: 0;
	}
	
		#related_links ul li{
			background: transparent url(../images/li_marker.gif) no-repeat 10px 17px;
			border-bottom: 1px dashed #494949;
			font-size: 13px;
		}
		
			#related_links ul li:hover{ background-color: #343434; }
		
			#related_links ul li a:link,
			#related_links ul li a:visited{
				color: #FFCA55;
				display: block;
				padding: 15px 10px 15px 30px;
				text-decoration: none;
			}
			
			#related_links ul li a:hover,
			#related_links ul li a:active{ background: transparent url(../images/ico/related_arrow.gif) no-repeat 95%; color: #FFF; }

#main_content{
	margin-right: 20px;
	width: 580px;
}

	#featured a:link.feature,
	#featured a:visited.feature{
		display: block;
		height: 285px;
		margin-left: -8px;
		position: relative;
		width: 282px;
	}
	
		#featured .feature img{
			left: 9px;
			position: absolute;
			top: 8px;
			z-index: 1;
		}
	
		#featured .feature span{
			background: transparent url(../images/image_overlay.png) no-repeat 0 0;
			height: 285px;
			left: 0;
			position: absolute;
			top: 0;
			width: 282px;
			z-index: 10;
		}
		
	#story{
		float: left;
		margin-left: 10px;
		padding-top: 10px;
		width: 290px;
	}
	
		#story h2,
		#page h2{
			background: transparent url(../images/bg/bio_box.png) repeat 0 0; 
			border: dashed #383838;
			border-width: 1px 0;
			color: #CFE09F;
			font: normal 22px "Georgia", Serif;
			margin: 10px 0;
			padding: 10px;
			text-align: center;
		}
		
			#page h2{
				margin: 21px 0 10px;
				text-align: left;
			}
		
			#story h2 span,
			#page h2 span{
				color: #CCCCCC;
				display: block;
				font: normal 13px "Arial", Sans-Serif;
				text-transform: uppercase;
			}
			
				#story h2 span em,
				#page h2 span em{
					font: italic 11px "Georgia", Serif;
					text-transform: none;
				}
				
				#story h2 a:link,
				#story h2 a:visited{
					color: #CFE09F;
					text-decoration: none;
				}

				#story h2 a:hover,
				#story h2 a:active{
					color: #FFF;
				}
				
				
		#page h3{
			background: transparent url(../images/ico/news_small.gif) no-repeat 0 0;
			color: #CFE09F;
			font-size: 14px;
			font-weight: normal;
			margin-left: -23px;
			padding-left: 23px;
		}
		
			#page h3.design{ background-image: url(../images/ico/design.gif); }
		
			#page h3 span{
				color: #666;
				font-size: 11px;
				padding-right: 10px;
			}
			
		#wrap #page p.date{
			background: #222;
			border-bottom: 1px dashed #444;
			color: #666;
			margin: -10px 0 0;
			padding: 5px 10px;
			text-transform: uppercase;
		}
				
		#story p{ 
			line-height: 2;
			margin: 15px 10px; 
		}
		
			#story p span{
				display: block;
				float: left;
				font: normal 72px/0.9 "Georgia", Serif;
				margin: 0 5px 0 0;
			}
	
			#story p.fancy_title{
				background: transparent url(../images/feature_head.gif) no-repeat center;
				color: #CCCCCC;
				font-size: 11px;
				letter-spacing: 1.3px;
				line-height: 1.3;
				margin: 0;
				text-align: center;
			}

	#most_recent{
		border-top: 1px dashed #494949;
		margin-top: 20px;
		padding: 15px 0 0;
	}

		#most_recent h2{
			background: transparent url(../images/ico/news.gif) no-repeat 0 0;
			font-size: 14px;
			font-weight: normal;
			margin: 0 15px;
			padding: 7px 10px 5px 35px;
			text-transform: uppercase;
		}
	
			#most_recent h2 a:link,
			#most_recent h2 a:visited{ text-decoration: none; }
			
		#most_recent p.date{ 
			color: #999999;
			font: italic 13px "Georgia", Serif;
		}

		#most_recent ul{
			border-top: 1px dashed #494949;
			list-style: none;
			margin: 0;
		}
	
			#most_recent ul li{
				background: transparent url(../images/ico/news_small.gif) no-repeat 15px 8px;
				border-bottom: 1px dashed #494949;
				font-size: 13px;
				padding: 10px 15px 10px 35px;
				position: relative;
				text-transform: uppercase;
			}
		
				#most_recent ul li a:link,
				#most_recent ul li a:visited{
					color: #CFE09F;
					text-decoration: none;
				}
			
					#most_recent ul li a:link.read_more,
					#most_recent ul li a:visited.read_more{
						background: transparent url(../images/btn/read_more.gif) no-repeat 0 0;
						display: block;
						height: 20px;
						position: absolute;
						right: 15px;
						top: 7px;
						text-indent: -130000em;
						width: 129px;
					}
				
				#most_recent ul li a:hover,
				#most_recent ul li a:active{ color: #FFF; }
				
				#most_recent ul li a:hover.read_more,
				#most_recent ul li a:active.read_more{ background-position: 0 -20px; }

#footer{
	border-top: 1px solid #444;
	margin: 50px 0;
	padding: 10px 5px 100px;
}

	#footer p{ line-height: 1.3; margin: 0; padding: 0; }

	#footer ul{ list-style: none; }
		
		#footer ul li{ display: inline; margin-right: 5px; }

			#footer ul li a:link,
			#footer ul li a:visited{
				color: #CCC;
				text-decoration: none;
			}

			#footer ul li a:hover,
			#footer ul li a:active{ color: #FFF; }
	

/* design specific presentational classes
----------------------------------------------------------------------------- */

.half_box{ float: left; width: 250px; }

.excerpt{
	border-bottom: 1px dashed #494949;
	margin: 25px 0;
}

.vcard{ 
	border: solid #444;
	border-width: 0 0 1px 1px;
	float: right; 
	padding: 0 0 10px 10px;
}

.org{ font-weight: bold; }

.success{
	background: #222;
	border: 1px solid #CCC;
	padding: 8px;
}

	.success p{ margin: 0; }
	
.alt,
.alt2{
	border-bottom: 1px dashed #494949;
	margin-bottom: 25px;
}
	
.alt h5,
.alt2 h5{
	color: #CFE09F;
}

/*
	-- /END ALL STYLES --
	
	- Please do not steal my code!
	- "I cannot abide useless people"
	- Thank you, I appreciate it.
*/