@import url('http://fonts.googleapis.com/css?family=Arvo:regular,bold');

html, body {
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	background: #CBC8C6 url(../img/bg-tile.gif);
	font-family: Helvetica, arial, serif;
	font-size: 1em;
	overflow: hidden;
	color: #333333;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}

p, h1, h2, ul, li {
	padding: 0;
	margin: 0;
	list-style: none;
}

a {
	outline: none;
	color: #888;
	text-decoration: none;
	color: #333333;
}

a, p, span, h1 {
	font-family: 'Arvo', arial, serif;
}

	a:hover {
		text-decoration: underline;
	}

h1 {
	width: 432px;
	height: 90px;
	margin-top: 175px;
	font-size: 4em;
	text-transform: uppercase;
	letter-spacing: -4px;
}

	h1 a:hover {
		text-decoration: none;
	}

.sprite,
#portfolio-pagination li a {
	background-image: url(../img/full-sprites.png);
	background-repeat: no-repeat;
}

#wrapper {
	background: url(../img/bg-1.gif) 0 0 no-repeat;
	position: relative;
	padding: 20px 0;
	height: 1000px;
}

#content {
	background: url(../img/me.png) 0 0 no-repeat;
	position: relative;
	padding: 1px 0 100px 280px;
	width: 580px;
	margin: 0 auto 0 180px;
}

#portfolio-cont {
	clear: both;
	width: 580px;
	height: 400px;
	position: relative;
}

#portfolio-wrapper {
	overflow: hidden;
	position: relative;
	width: 580px;
	height: 400px;
	background-color: #333;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	box-shadow: 0 1px 0 #fff;
	-moz-box-shadow: 0 1px 0 #fff;
	-webkit-box-shadow: 0 1px 0 #fff;
}

#portfolio {
	height: 400px;
	width: 9000px;
	position: absolute;
	top: 0;
	left: 0;
}

	#portfolio li {
		float: left;
		padding: 4px;
		width: 572px;
	}
	
	#portfolio li a img {
		border: 0;
		display: block;
	}
	
	#portfolio li div.pDesc {
		margin: 10px 15px 0;
	}
	
		#portfolio li div.pDesc p {
			font-size: .8em;
			padding: 4px 0 0;
			text-transform: uppercase;
		}

		#portfolio li div.pDesc h3 {
			padding: 0;
			margin: 0;
			font-size: 1.2em;
			font-weight: normal;
		}
		
	#portfolio li img {
	}
	
#portfolio-pagination,
#caption {
	position: absolute;
	top: 420px;
	left: 0;
	width: 580px;
}
	
	#portfolio-pagination li {
		width: 22px;
		height: 22px;
		position: absolute;
	}
	
		#portfolio-pagination li a {
			width: 22px;
			height: 22px;
			display: block;
			text-indent: -9000em;
		}
		
		#portfolio-pagination li.ppBack {
			right: 30px;
		}
		
			#portfolio-pagination li.ppBack a {
				background-position: -379px -325px;
			}
		
		#portfolio-pagination li.ppNext {
			right: 0;
		}
		
		#portfolio-pagination li.ppNext a {
			background-position: -407px -325px;
		}
		
	#caption {
	}
	
		#caption h2 {
			font-size: 1.1em;
			font-weight: normal;
		}
		
		#caption p {
			margin-top: 5px;
			font-size: .8em;
			text-transform: uppercase;
		}

#last-slide {
	color: #fff;
}

#oskar-says {
	display: block;
	width: 233px;
	height: 127px;
	background-position: 0 0;
	position: absolute;
	top: 85px;
	left: -160px;
}

	#oskar-says span {
		display: block;
		width: 213px;
		height: 100px;
		margin: 15px 0 0;
		background-position: -524px 0;
		background-repeat: no-repeat;
		position: relative;
	}

	#oskar-says em {
		display: block;
		height: 20px;
		width: 105px;
		background-position: -250px -70px;
		position: absolute;
		left: 50px;
	}

	#oskar-says em.osTop {
		top: 0;
	}

	#oskar-says em.osBottom {
		background-position: -250px -91px;
		bottom: 0;
	}
	
ul.general {
	height: 40px;
	font-family: 'Arvo', arial, serif;
}

	ul.general li {
		height: 40px;
	}
	
	ul.general li a {
		color: #BD3A00;
		
	}



ul.social {
	width: 340px;
	height: 40px;
	margin: 0 0 15px;
}

	ul.social li {
		padding: 0 7px 7px 0;
		float: left;
	}

	ul.social a {
		background-image: url(../img/full-sprites.png);
		position: relative;
		height: 44px;
		width: 44px;
		top: -60px;	
		display: block;
		text-indent: -9000em;
		outline: none;
		background-color: #333;
		border-radius: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
		box-shadow: 0 1px 0 #fff;
		-moz-box-shadow: 0 1px 0 #fff;
		-webkit-box-shadow: 0 1px 0 #fff;
		-webkit-transition: background-color 0.2s;
		-o-transition: background-color 0.2s;
		-moz-transition: background-color 0.2s;
	}

ul.social .twitter a {
	background-position: 0 -302px;
}

	ul.social .twitter a:hover {
		background-color: #3ACBF4;
	}

ul.social .facebook a {
	background-position: -50px -302px;
}

	ul.social .facebook a:hover {
		background-color: #3B5998;
	}

ul.social .flickr a {
	background-position: -100px -302px;
}

	ul.social .flickr a:hover {
		background-color: #FF0084;
	}

ul.social .lastfm a {
	background-position: -150px -302px;
}

	ul.social .lastfm a:hover {
		background-color: #D3170D;
	}

ul.social .dribbble a {
	background-position: -200px -302px;
}

	ul.social .dribbble a:hover {
		background-color: #F875A5;
	}
	
ul.social .forrst a {
	background-position: -250px -302px;
}

	ul.social .forrst a:hover {
		background-color: #5B9A68;
	}