/*

Title:      Andrew Simpson. Design + Consulting. Main style sheet.
Author:     Andrew Simpson
			www.andrewsimpsondesign.com
			andrew@andrewsimspondesign.com

*/




/* Global Elements
--------------------------------------------- */

body {
	background: #ccc url(images/bg.jpg);
	position: absolute;
	width: 100%;
	height: 100%;
	}

	.hide {
		display: none;
		}

	ul, ol, li {
		list-style:none;
		}



/*	tools	*/

* {
	padding:0;
	margin:0;
	}
	
.floatright {
	float: right;
	clear: none;
	}

.floatleft {
	float: left;
	clear: none;
	}
	
	.floatleftli li {
		float: left;
		clear: none;
		}
	
.reset {
	clear:both;
	}
	
.clearright {
	clear: right;
	}

.clearleft {
	clear: left;
	}

.clearnone {
	clear: none;
	}

.clearboth {
	clear: both;
	} 
	
.left{ float:left; 	}
.right{ float:right; }
.clear{ clear:both; height:1px; font-size:1px; line-height:1px;	}
a img{ border:none; }

/* Main Layout
--------------------------------------------- */


#top {
	background: url(images/top.jpg) repeat-x;
	min-width: 700px;
	overflow: hidden;
	overflow-x: hidden;
	}

.page {
		width: 945px;
/*		padding-top: 16px;*/
	}

	.index {
		margin-bottom: 50px;
		}

	.leftcol {
		position: absolute;
		float: left;
		clear: left;		
		width: 150px;
		margin: 1.5em 66px 0 50px;
		}

	.leftfront {
		width: 200px;
		margin: 0 55px 0 55px;
		}

	.rightcol {
		position: relative;
		clear: none;
		left: 265px;
		width: 635px;
		margin: 0 0 0 0px;	
		}

	.rightfront {
		left: 340px;
		width: 635px;
		}


	/*	Menu Bar	*/
	
	#bar {
		clear: none;
		width: 100%;
		min-height: 6em;
		margin: 7.5em 0 0 250px;
		}
	
		.barfront {
			margin: 12em 0 0 325px !important;
			}

		#bar li {
			padding-right: 20px;
			}

		.barbottom {
			margin-top: 1px !important;
			}

		.blue {
			width: 7px;
			height: 6em;
			float: left;
			background-color: #0099FF;
			}

		.bluebottom {
			width: 7px;
			height: 10px;
			margin-bottom: 6px;
			float: left;
			background: url(images/bluebottom.jpg);
			}

		.blank {
			width: 5px;
			height: 6em;
			float: left;
			background: url(images/bg.jpg);
			}

		.blankbottom {
			width: 5px;
			height: 10px;
			float: left;
			background: url(images/bg.jpg);
			}

		.menu {
			height: 6em;
			width: 100%;
			min-width: 710px;
			background-color: #333;
			color: #fff;
			}

			.menubottom {
				width: 100%;
				min-width: 710px;
				min-height: 8px;
				background: url(images/menubottom.jpg) repeat-x;
				z-index: 1;
				}

			.menu li {
				margin-top: 2.666em;
				}

			.menu a {
				color: #fff;
				}

			.menu .as {
				margin: 2.2em 2.5em 0 2.2em;
				}

			.menu .search {
				margin-right: 1.5em;
				}
			
		
		/*	Slide Bar	*/			
			
		#slidebar {
			position: relative;
			left: 25px;
			top: 5px;
			width: 100%;
			height: 25px;
			margin-bottom: 0.5em;
			}

			#slidebar li {
				float: left;
				position: relative;
				top: 10px;
				margin: 0 20px 0 15px;
				}

				#slidebar li a {
					position: absolute;
					width: 100%;
					height: 100%;
					}

				#slidebar li a:hover {
					border-bottom: 1px dotted grey;
					background: none;
					}
				
				.rilli {
					width: 50px;
					height: 25px;
					background: url(images/rilli.png) no-repeat;
					}	
					
		.arrow {
			position: relative;
			top: 10px;
			height: 25px;
			width: 100px;
			padding: 0px 0 0 36px;
			cursor: pointer;
			background: url(images/arrow.gif) no-repeat;
			}

			#slidebarToggle {
				display: block;
				left: 15px;
				}		

	/*	Page Specific	*/
	
	.posts {
		position: absolute;
		left: 400px;
		width: 500px;
		}

	.casestudies {
		margin-left: 14px;
		margin-bottom: 18px;
		}

	.latest h3  {
		margin: 0 0 1.3em 0;		
		color: #333;
		border-bottom: 1px dotted #666;	
		}

	.content .shelfari img {
		background: none;
		padding: 0;
		border: 0;
			}
	




/* Content Pages
--------------------------------------------- */


/*	Front Page	*/

.lastpost {
	margin: 4.5em 0 0 0;
	}

	.weeza {
		float: left;
		clear: none;
		width: 150px;
		height: 125px;
		margin: 0px 0 0 110px;
		}

	.read-on{
		background: url(images/readon_black.gif) 100% 60% no-repeat;
		padding-right: 20px;
		text-align: right;
		display: block;
		}
		
/*	Content	*/
	
.content {
	padding: 1.5em 0 0 3em;
	}

	.content img {
		margin: 0em 0 1.5em 0;
		}

	.content img.casestudy {
		padding: 1.5em 0 1.5em 0;
		}

	.center {
		width: 620px;
		margin: 0 0 20px;
		}
		
.leftcol .featured p{
	border-bottom: 1px solid #333333;
	border-top:  1px solid #333333;
	padding: 0.5em 0 0.6em 0;
	line-height: 1.5em;
	margin: 1em 0 0 0;
	}

	.leftcol .featured dl{
		margin:  0 0;
		border-bottom: 1px solid #333333;
		padding: 0.5em 0 0.6em 0;
		}
	.leftcol dt{
		display: inline;
		margin: 0;
		padding: 0;
		color: #AAA;
		}
	.leftcol dd{
		display: inline;
		margin: 0;
		padding: 0;
		}
		
	#nav {
		clear: left;
		padding-top: 18px;
		border-bottom: 1px dotted #333;
		}	

/*	About Pages	*/
	
.about {
	margin: 180px 0;
	}

	#info li {
		float: right;
		position: relative;
		right: 70px;
		width: 200px;
		margin: 0;
		}

	#info h2 {
		size: 12px;
		margin: 0px 0 .0em 0 ;
		}

	#info p {
		margin: 0em 0 1em;
		}


/* Projects
--------------------------------------------- */


#project img.preview {
	padding: 0;
	border: 0px;
		}

.content img {
	background: white;
	padding: 8px;
	border: 1px #ccc solid;
		}

	.content a img:hover {
		border: 1px #999 solid !important;
			}


#project h1 {
	margin-bottom: 10px;
		}


/* Comments
--------------------------------------------- */

#commentschunk {
	margin-top: 36px;
	}

#postacomment {
	clear: right;
	}

#postform {
	clear: both;
	}

ol#comments {
	list-style-type:none;
	margin: 0;
	}

	ol#comments li {
		list-style-type:none;
		margin: 0 0 18px 0;
		}

	#comments cite {
		float:left;
		width:30.6% !important;
		font-style:normal;
		text-align:right;
		}
	
		#comments cite span { display:block; }
		#comments cite .author { font-size: 1.25em; line-height: 1.25em;	}
		#comments cite .date { font-size: 1em; line-height: 1.5em; }
		#comments cite .author a { text-decoration:none; }
		#comments cite .admin-tools{ margin:5px 0; }
		#comments cite .admin-tools a{
			float:right;
			margin:0 5px;
			padding:0px 3px 3px;
			background:#666;
			border:1px solid #999;
			text-decoration:none;
			}

	#comments .mycontent{
		float:left;
		width:60%;
		margin-left:1.9%;
		border-left:1px dotted #868686;
		padding: 0 0 0 2%;
		}

	#comments .otherscontent{
		float:left;
		width:60%;
		margin-left:1.9%;
		border-left:1px dotted #868686;
		padding: 0 0 0 2%;
		}

	#comments .content h3{
		margin:0;
		font-size:1em;
		}

	#comment-form {
		clear: left;
		margin: 4em 0 0;
		padding-top: 1.5em;
		width: 36em;
		}

		#comment-form p {
			padding-top: 18px;
			}

	input.textfield{
		width: 15em;
		}
		
	textarea.commentbox{
		width:28em;
		height:10em;
		padding:0.25em;
		margin:5px 0;
		font-size:1.25em;
		font-family:Arial, Helvetica, sans-serif;
		}
		
	label.text{
		margin-left: 10px;
		}
		
	.formactions input.submit{ 
		float:right; 
		margin:-1em 0 0 0;
		padding:0 0.5em;
		}
		
	.formactions .spinner{
		float:right;
		margin:-8px -20px 0 0;
		}
		
#errors{ color:#FF0000; font-weight:bold; 	}	


/* Preview Sections
--------------------------------------------- */

ul.dates, ul.counts, ul.blogroll ul, ul.pages{
	list-style-type: none;
	margin: 1.5em 0 2em 0;
		}

ul.dates li, ul.counts li, ul.blogroll ul li, ul.pages li{
	list-style-type:none;
	margin: 0;
	padding: 0.5em 0;
	border-bottom: 1px dotted #999;
		}

ul.counts .count{
	float:right;
		}

ul.pages ul{
	margin:0;
		}

ul.pages ul li{
	border:none;
	margin-left:2em;
	list-style-type:square;
		}

.dates li {
	width: 260px;
	height: 18em;
	margin-bottom: 3em !important;
		}
	
	.dates .left a {
		display: block;
		padding-bottom: 5px;
			}
	
	.dates .previewImage {
		display: block;	
		clear: left;
			}

		.dates .previewImage a {
			margin: 0;
			padding-bottom: 0 !important;
			display: inline !important;
				}
				
		.dates .previewImage img {
			display: block;
			max-width: 250px;
			max-height: 175px;
			border: 1px solid #ccc;
			padding: 5px;
			background: white;
				}

			.dates .previewImage img.preview {
				max-width: 260px;
				padding: 0;
				border: none;
					}
			
				.dates .previewImage a img:hover {
					border: 1px #999 solid !important;
						}	

				.dates .previewImage a img.preview:hover {
					margin: -1px;
					border: 1px #999 solid !important;
						}	
				

#notebook .dates li {
	height: 6em;
	font-family: Georgia, serif;
	font-style: italic;
	font-size: 1.5em;
	line-height: 27px;
		}

	#notebook .dates li a {
		display: block;
		width: 100%;
		height: 100%;
			}
		
		#notebook .dates li a:hover {
			background: none;
				}
			
	#notebook .dates .date {
		clear: both;
		margin-top: 9px;
		font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
		font-size: 12px;
		line-height: 18px;
		font-style: normal;
			}				

	
/* Search
--------------------------------------------- */

#searchbutton {
	float: left;
	margin: 3px 10px 0;
	}

#searchbar {
	float: left;
	}
		
	#search input{ 
		font-size: 0.85em; 
		background:#CCC;
		margin-top: 0px;
		}

		#search input:focus{
			background:#FFF;
			}

#searchform{
	margin:1em 0;
	}

	#searchform #s{
		background:#222;
		border:none;
		border-bottom:1px solid #333;
		width:30em;
		color:#666666;
		padding:0.25em;
		}
	#searchform #searchsubmit{
		background:#000;
		color:#666;
		border:none;
		font-size:0.9em;
		text-transform:uppercase;
		letter-spacing:0.25em;
		}


/* Footer
--------------------------------------------- */

#footer {
	width: 590px;
	left: 300px;
	margin-top: 75px;
	position: relative;
 	border-top: #999 1px dotted;
	padding: 5px;
	}
	
	#footer.front {
		left: 372px !important;
		}


/* Last.fm Widget
--------------------------------------------- */
table.lfmWidget0cb254964414869ce5919d6fca55e638 td {margin:0 !important;padding:0 !important;border:0 !important;	}
table.lfmWidget0cb254964414869ce5919d6fca55e638 tr.lfmHead a:hover {background:url(http://cdn.last.fm/widgets/images/en/header/quilt/artist_horizontal_grey.png) no-repeat 0 0 !important;	}
table.lfmWidget0cb254964414869ce5919d6fca55e638 tr.lfmEmbed object {float:left;	}
table.lfmWidget0cb254964414869ce5919d6fca55e638 tr.lfmFoot td.lfmConfig a:hover {background:url(http://cdn.last.fm/widgets/images/en/footer/grey.png) no-repeat 0px 0 !important;	}
table.lfmWidget0cb254964414869ce5919d6fca55e638 tr.lfmFoot td.lfmView a:hover {background:url(http://cdn.last.fm/widgets/images/en/footer/grey.png) no-repeat -85px 0 !important;	}
table.lfmWidget0cb254964414869ce5919d6fca55e638 tr.lfmFoot td.lfmPopup a:hover {background:url(http://cdn.last.fm/widgets/images/en/footer/grey.png) no-repeat -159px 0 !important;	}



/* Typography
--------------------------------------------- */
	
body {
	color:#666;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 18px;
}

a {
	color:#000;
	text-decoration: none;
}

a:hover {
	background: #dddddd;
}

p {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1em;
	line-height: 1.5em;
	margin: 0 0 1.5em 0;
}
	
h1 {
	font-family: Georgia, serif;
	font-style: italic;
	font-weight: 100;	
	size: 1.5em;
	line-height: 1em;
	margin: 0 0 1.33em 0;		
	color: #333;
}

h2 {
	font-family: Georgia, serif;
	font-style: italic;
	font-weight: 100;	
	size: 1.1667em;
	line-height: 1.286em;
	margin: 1.929em 0 0em 0;
/*	margin: 1.929em 0 .643em 0; */
	color: #000;	
}

h3 {	
	color: #808080;	
	font-family: Georgia, serif;
	font-style: italic;
	font-weight: 500;
	font-size: 1.5em;
}

	.rightfront h3 {
		padding-bottom: 5px;
		}

h4 {
	font-size: 10px;
	font-weight: normal;
	}

/* Exceptions */

.menu a:hover {
	border-bottom: 1px dotted white;
	background: none;
	color: #ffffff;
}

.dates {
	color: #999;
}

.dates .left a {
	display: block;
	padding-bottom: 5px;
	font-family: Georgia,serif;
	font-size: 16px;
	font-style: italic;
	}

ul.dates .date{
	color:#858585;
}

ul.counts .count{
	color:#858585;
}

ul.dates a, ul.counts a, ul.blogroll a, ul.pages a{
	color:#666;
	text-decoration:none;
}

#aside-content a{
	color: #FF9900;
}

ul.dates a:hover, ul.dates a:hover .date, ul.counts a:hover, ul.counts a:hover .count, ul.blogroll a:hover, ul.pages a:hover{ 
	color:#000;
}

label.text{
	color: #333;
}

#footer {
	font-family: Georgia, serif;
	font-style: italic;
	}

	#footer .license {
		font-size: 11px;
		font-family: "HelveticaNeue", Helvetica, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, Arial, sans-serif;
		font-style: normal;
		}