/* --- --- --- RESET --- --- --- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent; }
body {
	overflow: hidden;
	background-color: #e8e8e8;
	line-height: 1; }
ol, ul {
	list-style: none; }
blockquote, q {
	quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none; }
:focus {
	outline: 0; }
ins {
	text-decoration: none; }
del {
	text-decoration: line-through; }
table {
	border-collapse: collapse;
	border-spacing: 0; }
	
/* --- --- --- ABSOLUTE & ALL in ALL STUFF --- --- --- */

p {	font:62.5%/2em "Lucida Sans Unicode", "Lucida Grande", Helvetica, Arial, Helvetica, Verdana, sans-serif; color: #9c9c9c; text-shadow: 1px 1px white; }
a { color: #797979; text-decoration: none; }
h1 { font-family: 'Lobster', Helvetica, Arial, sans-serif; font-size: 75px;	text-shadow: 2px 2px white; }

#topline {
	background-color: #f1f1f1;
	height: 25px; width: 3000px;
	position: fixed; }
#bottomline {
	background-color: #f1f1f1;
	bottom: 0;
	height: 25px; width: 3000px;
	position: fixed;
	z-index: 1; }
#rightline {
	background-color: #f1f1f1;
	height: 2000px; width: 25px;
	position: fixed;
	right: 0; }
#leftline {
	background-color: #f1f1f1;
	position: fixed;
	height: 2000px; width: 25px; }
#mug {
	background: url(../img/bg_coffee.png) no-repeat;
	bottom: 17px;
	height: 116px; width: 77px;
	position: absolute;
	right: 100px;
	z-index: 999; }
	#smoke {
		background: url(../img/smoke.png) no-repeat;
		bottom: -40px;
		height: 121px; width: 18px;
		right: 137px;
		position: absolute;
		z-index: 0;	}
		
/* --- --- --- RANDOMS --- --- --- */

#random1, #random2, #random3, #random4, #random5, #random6, #random7, #randomdefault { 
	display: none; }
	#random1 { color: #da55a0; }
	#random2 { color: #559dda; }
	#random3 { color: #da9a55; }
	#random4 { color: #55ccda; }
	#random5 { color: #55daa9; }
	#random6 { color: #da7755; }
	#random7 { color: #da55a0; }
	#randomdefault { color: #55daa9; }
	
/* --- --- --- MAINWRAPP --- --- --- */
	
#mainwrapp {
	background: url(../img/gradient.png) 50% 135px no-repeat;
	margin: 0px auto; 
	height: 470px; width: 800px;
	padding-top: 80px; }
	#mainwrapp ul {
		cursor: pointer;
		height: 17px; width: 225px; }
			#mainwrapp ul li {
				cursor: pointer;
				display: inline; }
					#mainwrapp ul li a {
						color: #8c8b8b;
						cursor: pointer;
						font-family: 'Droid Serif', Georgia, Times, serif;
						font-size: 15px;
						text-shadow: 1px 1px white;
						padding: 2px 9px 1px 10px;						
						text-decoration: none; }
							.margin {
								margin-right: 6px; }
#navigation {
	background: url(../img/bg_navigation.png) 50.3% no-repeat;
	height: 70px; width: 796px;
	margin-top: 60px;
	padding: 10px 0px 0px 2px; }
#contentwrapp {
	height: 405px; width: 800px; }
	
	/* --- SOCIAL --- */	

#social {
	display: none;
	float: left;
	margin-left: 316px; }
#socialcontentleft {
	float: left;
	height: 110px; width: 100px; }
	#socialcontentleft ol li {
		padding: 0px 0px 15px 25px; }
			#socialcontentleft .twitter {
				background: url(../img/twitter.png) no-repeat; }
			#socialcontentleft .dribbble {
				background: url(../img/dribbble.png) no-repeat; }
			#socialcontentleft .lastfm {
				background: url(../img/lastfm.png) no-repeat; }
				#socialcontentleft ol li a {
					color: #797979;
					font: 62.5%/1em "Lucida Sans Unicode", "Lucida Grande", Helvetica, Arial, Helvetica, Verdana, sans-serif; 
					text-shadow: 1px 1px white;
					text-decoration: none; }
#socialcontentright {
	float: right;
	height: 110px; width: 100px; }
	#socialcontentright ol li {
		padding: 0px 0px 15px 25px; }
		#socialcontentright .facebook {
			background: url(../img/facebook.png) no-repeat; }
		#socialcontentright .vimeo {
			background: url(../img/vimeo.png) no-repeat; }
		#socialcontentright .gowalla {
			background: url(../img/gowalla.png) no-repeat; }
			#socialcontentright ol li a {
				font: 62.5%/1em "Lucida Sans Unicode", "Lucida Grande", Helvetica, Arial, Helvetica, Verdana, sans-serif; 
				color: #797979;
				text-decoration: none;
				text-shadow: 1px 1px white; }
				
	/* --- ABOUT --- */
				
#myselfwrapp {
	display: none;
	margin: -5px 0px 0px 316px;
	width: 200px; }
	#myselfwrapp .heading {
		color: #797979;
		font-family: 'Droid Serif', arial, serif;
		font-size: 15px;
		text-shadow: 1px 1px white; }
	#myselfwrapp p {
		text-align: justify;
		width: 173px; }
#contactwrapp {
		display: none;
		margin-left: 340px;
		height: 225px; width: 200px; }
		#contactwrapp .id {
			background: url(../img/id.png) no-repeat; }
		#contactwrapp .phone {
			background: url(../img/phone.png) no-repeat; }
		#contactwrapp .mail {
			background: url(../img/mail.png) no-repeat; }
			#contactwrapp ol li {
				padding: 0px 0px 0px 25px; }
				#contactwrapp .bottom {
					padding: 0px 0px 11px 25px; }
				#contactwrapp ol li a {
					font: 62.5%/2em "Lucida Sans Unicode", "Lucida Grande", Helvetica, Arial, Helvetica, Verdana, sans-serif; 
					color: #797979;
					text-shadow: 1px 1px white;
					text-decoration: none; }