/*
style-title: Tutorials on the Web
style-url: 
style-author: Andreas Lagerkvist
style-author-url: http://exscale.se
style-date: Hmm
style-info: A very long time ago i created (and destroyed not long after) a site called "Tutorials on the Web". This is the design i used for it.
*/
body {
	margin: 0;
	padding: 10px;
	height: 100%;

	background: #f8f8f8;

	font-family: Verdana;
	font-size: 10px;
	color: #333;
}

input, select, textarea {
	font-family: Verdana;
	font-size: 10px;
}

h1, h2, h3, h4, h5, h6 {
	font-family: Verdana;
	font-size: 10px;
	color: #135;
	font-weight: bold;
	margin: 10px 0;
}

h2 {
	background: #555;
	color: #fff;

	padding: 2px;
	margin: 0 0 10px 0;

	border: 1px solid #000;
}

p {
	margin: 10px 0;
}

ul, ol {
	margin: 0 0 0 30px;
	padding: 0;
}

a {
	color: #000;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

hr, #header p, #navigation h2, #skip-navigation {
	display: none;
}

img.small {
	float: left;
	margin: 0 5px 5px 0;
}

/***************************/

#header h1 {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent none;
}

	#header h1 a {
		background: url("gfx/logo.gif");

		display: block;
		width: 500px;
		height: 60px;

		text-decoration: none;
		text-indent: -10000px;
	}

#navigation ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

	#navigation ul li {
		display: inline;
		margin-right: 10px;
	}

		#navigation ul li a {
			background: url("gfx/nav.gif") left 50% no-repeat;
			padding-left: 12px;
		}

		#recent-articles-page #navigation a[href="/"], 
		#archives-page #navigation a[href="/archives/"], 
		#article-page #navigation a[href="/archives/"], 
		#search-page #navigation a[href="/archives/"], 
		#article-listing-page #navigation a[href="/archives/"], 
		#about-page #navigation a[href="/about/"], 
		#styles-page #navigation a[href="/styles/"] {
			background: url("gfx/nav-sel.gif") left 50% no-repeat;
			color: #f90;
		}

#content, #sub-content div {
	background: #fff url("gfx/bg.gif") repeat-y;

	padding: 2px;
	margin-top: 10px;

	border: 1px solid #000;
}

#content {
	width: 75%;
	float: left;
	margin-bottom: 5px;
}

#sub-content {
	width: 23%;
	float: right;
}

#footer {
	clear: both;

	width: 75%;

	height: 15px;
	background: #555;
	color: #999;

	padding: 2px;
	margin: 2px 0 0 0;

	border: 1px solid #000;
}

	#footer a {
		color: #999;
	}

	#footer p {
		margin: 0;
			display: inline;
	}

	#footer ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
		display: inline;
	}

		#footer ul li {
			display: inline;
			margin: 0 3px;
		}

