html{
	color: #EEE;
	background: #000;
	font: 62.5% "Lucida Sans Unicode", Tahoma, sans-serif;
}

body{
	margin: 0;
	padding: 0;
	font-size: 1.1em;
}

h1, h2, h3{
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: -1px;
	margin: 0;
}

a{
	color: #FFF;
}

#page{

}

#top{
	background: #333 url(img/top.png) no-repeat center bottom;
	padding: 30px;
}

	#top h1{
		width: 100px;
		height: 40px;
		background: #333 url(img/h1.png) no-repeat;
		margin: 0;
		
		text-indent: -100em;
		overflow: hidden;
	}
	
#content{
	padding: 30px;
}

	.software{
		width: 250px;
		padding: 20px;
		margin: 0 30px 30px 0;
		height: 12em;
		float: left;
		position: relative;
		
		border: 1px solid #333;
	}
	
		.software h2{
			padding-left: 40px;
			background-color: #000;
			background-repeat: no-repeat;
			background-position: left center;
		}
		
		.software h2#moonmoon{
			background-image: url(img/moonmoon.png);
		}
		
		.software h2#fortunes{
			background-image: url(img/fortunes.png);
		}
		
		.software h2#blog{
			background-image: url(img/blog.png);
		}
	
		.software h2 a{
			color: #FFF;
			text-decoration: none;
		}
		
		.software h2 span{
			display: block;
			font: normal 0.6em "Lucida Sans Unicode", Tahoma, sans-serif;
		}
		
		.software .description{
			color: #CCC;
		}
		
		.software .more{
			
		}
		
			.software .more a{
				text-align: right;
				position: absolute;
				bottom: -1px;
				right: 1em;
				
				display: block;
				padding: 5px;
				overflow: hidden;
			
				text-decoration: none;
				border: 1px solid #333;
				border-bottom: 0;
			}
				
				.software .more a span{
					position: absolute;
					top: -100em;
				}

#footer{
	color: #CCC;
	border-top: 1px solid #222;
	margin: 0 30px;
	padding: 10px 0;
	clear: both;
}

	#footer a{
		color: #CCC;
		text-decoration: none;
	}