@import url("apml.css");
@import url("scroll.css");

body { 
	background: #303b47 url(../img/bg.gif); 
	color: #fff;   
	text-align: center;
}

html, body {
	height: 100%;
}

* {
	margin: 0;
	padding: 0;
}

img {
	border: 0;
}

.alignright {
	float: right;
	margin: 0 0 10px 20px;
	-moz-border-radius: 8px;
 	-webkit-border-radius: 8px;
 	-webkit-box-shadow: #000 0 0 8px;
}

hr { 
	clear: both;
	border: 0; 
	color: #716743; 
	background-color: #716743;
	height: 1px;
	margin: 0 0 14px;
}

.clr {
	clear: both;
}

.pdf { 
	background: url(../img/pdf.gif) no-repeat left 50%; 
	padding: 0 0 0 20px;
	display: block;
}

#shadow {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../img/shadow2.png) 50% 10%;
	z-index: 1;
}

div#shiv {
	width: 100%;
	height: 50%;
	margin-top: -320px;
	float: left;
}


#footer {
	position: absolute;
	top: 520px;
	left: 0;
	width: 980px;
	text-align: center;
	line-height: 22px;
}

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

#fsi { 
	position: relative;
	width: 980px;
	height: 500px;
	clear: both;
	margin: 0 auto;
	text-align: left;
	z-index: 2;
}

#fsi_area {
	position: absolute;
	top: 80px;
	width: 998px;
	height: 378px;
}

#fsi_shadow {
	width: 978px;
	height: 368px;
	margin: 1px;
	padding: 4px 9px;
	background: url(../img/area_shadow.png) no-repeat;
}

#fsi_content {
	position: relative;
	width: 960px;
	height: 360px;
	background: #a69a8e;
	text-align: left;
	text-shadow: #000 0 0 0;
	-moz-opacity: .99;
	overflow: auto;
}

#mainmenu {
	position: absolute;
	top: 448px;
	width: 100%;
}


#fsi_area .start {
	background: url(../img/start.jpg) no-repeat;
}

#fsi_area .bio {
	background: url(../img/bio.jpg) no-repeat;
}

#fsi_area .aida {
	background: url(../img/aida.jpg) no-repeat;
}

#fsi_area .pics {
	background: url(../img/pics.jpg) no-repeat;
}

#fsi_area .pics2 {
	background: #000;
}

#fsi_area .journal {
	background: url(../img/journal.jpg) no-repeat;
	color: #222;
}

#fsi_area .music {
	background: url(../img/music.jpg) no-repeat;
}

#fsi_area .contact {
	background: url(../img/contact.jpg) no-repeat;
}



/* Typography		 ------------------------------------ */

body, input, select, textarea {
	font: 70%/1.5em arial, sans-serif;
}

a:link 			{ color: #fff; }
a:visited 		{ color: #fff; }
a:visited:hover { color: #b42727; }
a:hover 		{ color: #e00d0d; }
a:active 		{ color: #e00d0d; }

#content a {
	text-decoration: none;
}

#content a:link { 
	color: #eeead2;
	border-bottom: 1px solid #716743; 
}

#content a:visited { 
	color: #eeead2;
}

#content a:hover, #content a:visited:hover { 
	color: #f33c00;
	border-bottom: 1px solid #716743;
}

h2 {
	font-size: 1.5em;
	line-height: 100%;
	margin: 0 0 1em;
}

h3 {
	font-size: 1.5em;
	margin: 0 0 1em; 
}

h4 {
	font-size: 1.3em;
	margin: 0 0 8px; 
	color: #eeead2;
}

h5 {
	font-size: 1.2em;
	margin: 0 0 8px; 
	color: #eeead2;
}

p { 
	margin: 0 0 12px;
}

blockquote { 
	margin: 0 0 12px;
	font-style: italic;
}

ul, ol {
	margin: 0 0 12px 16px;
}

.date {
	font-size: 93%;
}




/* Menu				 ------------------------------------ */

#menu { 
	position: relative;
	text-align: center;
	list-style: none;
	text-transform: uppercase;
	-moz-opacity: .99; /* bugfix ff-mac */
}

#menu li {
}

#menu li a { 
	position: relative;
	display: block;
	height: 19px;
	overflow: hidden;
}

#menu li.current a img, #menu li a:hover img { 
	position: relative;
	top: 0px;
}

#menu li a:active img { 
	position: relative;
	top: 1px;
}

#menu li a img { 
	position: relative;
	top: -21px;
}


#home {
	position: absolute;
	top: 20px;
	left: 10px;
}

#bio {
	position: absolute;
	top: 20px;
	left: 57px;
}

#pics {
	position: absolute;
	top: 20px;
	left: 137px;
}

#journal {
	position: absolute;
	top: 20px;
	left: 707px;
}

#media {
	position: absolute;
	top: 20px;
	left: 773px;
}

#contact {
	position: absolute;
	top: 20px;
	left: 875px;
}

/* player */

#player {
	position: absolute;
	top: 14px;
	left: 318px;
	width: 344px;
	height: 28px;
	background: url(../img/player/bg_player.png) no-repeat;
	text-shadow: #000 0 1px 2px;
	opacity: .99;
}

	#nowplaying {
		position: absolute;
		top: 5px;
		left: 80px;
	}


/* track select */

#trackselect {
	position: absolute;
	display: none;
	top: 70px;
	left: 100px;
	width: 780px;
	height: 390px;
	background: rgba(0,0,0,2);
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}


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

#footer img {
	position: relative;
	top: 3px;
}

#footer {
	color: #bcbcbc;
}

#footer a {
	color: #8c8c8c;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 93%;
	font-weight: bold;
	text-shadow: #000 0 1px 2px;
	opacity: .99;
}

#footer a:hover {
	color: #fff;
	border-bottom: 1px solid #50504e;
}




/* Box layout		 ------------------------------------ */

.box {
	padding: 40px 50px;
}


/* Biography		 ------------------------------------ */

.bio {
	line-height: 1.7em;
}

.biocol1 {
	float: left;
	width: 300px;
	margin-right: 60px;
}

.biocol2 {
	float: left;
	width: 300px;
	margin-right: 60px;
}

/* 
.biocol1 {
	float: left;
	width: 240px;
	margin-right: 60px;
}

.biocol2 {
	float: left;
	width: 240px;
	margin-right: 60px;
}

.biocol3 {
	float: left;
	width: 240px;
} */


/* Photos			 ------------------------------------ */

.pics ul {
	list-style: none;
}

.pics li a {
	position: relative;
	display: block;
	height: 19px;
	overflow: hidden;
}

.pics li a img {
	position: relative;
	top: 0;
}

.pics li a:hover img {
	top: -19px;
}

li.canada {
	position: absolute;
	top: 121px;
	left: 396px;
}

li.scand {
	position: absolute;
	top: 73px;
	left: 513px;
}

li.italy {
	position: absolute;
	top: 115px;
	left: 607px;
}

li.dubai {
	position: absolute;
	top: 163px;
	left: 680px;
}

li.malaysia {
	position: absolute;
	top: 178px;
	left: 769px;
}

/* seperate picture galleries */

#fsi_content2 {
	position: relative;
	width: 960px;
	height: 360px;
	background: #a69a8e;
	text-align: left;
	text-shadow: #000 0 0 0;
	-moz-opacity: .99;
	overflow: auto;
}

#piclibrary {
	position: relative;
	height: 345px;
	width: auto;
	overflow-x: auto;
	overflow-y: hidden;
}


#piclibrary .intro {
	float: left;
	width: 260px;
	padding: 45px 20px 20px;
	color: #d0cbc5;
}

#piclibrary .intro h1 {
	margin: 0 0 1em;
	color: #d0cbc5;
}


#piclibrary img {
	float: left;
	line-height: 0;
	margin-right: 1px;
}

/* Music and video	 ------------------------------------ */

.col_music {
	position: absolute;
	left: 40px;
	top: 40px;
	width: 440px;
}

#moremusic {
	position: absolute;
	right: 470px;
	bottom: 20px;
}

.album {
	float: left;
	width: 130px;
	margin-right: 15px;
}

.col_video {
	position: absolute;
	left: 560px;
	top: 40px;
	width: 380px;
}

#morevideo {
	position: absolute;
	right: 20px;
	bottom: 20px;
}

.clip {
	float: left;
	width: 130px;
	margin-right: 15px;
}

.album img, .clip img {
	margin-left: 0px;
}

.album h5 img, .clip h5 img {
	margin: 0;
}

/* The CSS for albums is put is seperate style sheets */

/* Compilations		 ------------------------------------ */

.compilations {
	list-style: none;
	margin: 0;
}

.compilations li {
	float: left;
	width: 30%;
	padding: 0 0 8px;
	margin: 0 3% 8px 0;
}

.compilations h3 {
	margin: 0;
	font-size: 1.2em;
}

.compilations h3 a {
	text-decoration: none;
}

.back {
	font-size: 1.2em;
}


/* Contact			 ------------------------------------ */

#cinfo {
	position: absolute;
	left: 520px;
	top: 195px;
}



/* Downloads		 ------------------------------------ */

.wallp {
	position: relative;
	top: -20px;
	left: -4px;
	margin-bottom: -20px;
}




/* Buy music		 ------------------------------------ */

.cdcover {
	position: absolute;
	top: -15px;
	right: 25px;
}


/* Blog comments	 ------------------------------------ */

.blogmenu {
	position: absolute;
	left: 40px;
	top: 40px;
	width: 160px;
	margin: 0;
	list-style: none;
}

.blogmenu a {
	color: #333;
}

.blogmenu a:hover {
	color: #666;
}

.blog {
	margin: 40px 40px 20px 260px;
}