/*------------------------------------------------------------------------
# JOOFORGE.com - Il Web All'Italiana
# ------------------------------------------------------------------------
# Copyright © 2004-2009 JOOFORGE.com. Tutti i diritti riservati.
# Website:  http://www.jooforge.com/
-------------------------------------------------------------------------*/

div#jf-jpod {
	position: relative;
	width: 145px;
	height: 242px;
	margin: 0 auto;
}

div#jf-jpod div.display {
	position: absolute;
	top: 13px; left: 13px;
	width: 119px;
	height: 89px;
	overflow: hidden;
}

div#jpod-rail1 {
	position: absolute;
	top: 0; left: 0;
	width: 238px;
	height: 89px;
}

div#jf-jpod div.menuscreen {
	position: relative;
	width: 119px;
	height: 89px;
	overflow: hidden;
	background-color: #000;
	float: left;
}

div#jf-jpod div.playscreen {
	position: relative;
	width: 119px;
	height: 89px;
	overflow: hidden;
	float: left;
}

div#jf-jpod div.header {
	width: 119px;
	height: 12px;
	position: absolute;
	top: 0; left: 0;
	background: #FFF url(../../images/menu.png) no-repeat 0 0;
	z-index: 1;
}

div#jpod-rail2 {
	width: 119px;
	height: 308px;
	overflow: hidden;
	position: absolute;
	top: 12px; left: 0;
}

div#jf-jpod div.track {
	position: relative;
	width: 119px;
	height: 77px;
	background-color: #FFF;
}

div#jf-jpod div.thumb {
	float: left;
	margin: 4px 0 0 3px;
}

div#jf-jpod div.info {
	float: left;
	width: 52px;
	margin: 5px 0 0 3px;
	line-height: 0em;
}

div#jf-jpod div.info div.artist {
	color: #000;
	font-size: 11px;
}

div#jf-jpod div.info div.title {
	color: #666;
	font-size: 9px;
	margin-top: 3px;
}

div#jf-jpod div.info div.tracks {
	position: absolute;
	bottom: 3px; right: 5px;
	color: #000;
	font-size: 8px;
	margin-top: 8px;
}

div#jf-jpod div.player {
	position: absolute;
	bottom: 0; left: 0;
}

div#jf-coverbg1,
div#jf-coverbg2 {
	position: absolute;
	top: 0; right: 0;
	background-repeat: no-repeat;
	background-position: -76px 0;
	width: 44px;
	height: 89px;
}

div#jf-coverbg2,
div#jf-notfound {
	opacity: 0;
	filter: alpha(opacity=0);
}

div#jf-notfound {
	position: absolute;
	top: 0; right: 0;
	width: 44px;
	height: 89px;
	background: url(../../images/notfound.png) no-repeat 50% 50%;
}

div#jf-jpod div.cover1 {
	position: absolute;
	top: 0; left: 0;
	width: 14px;
	height: 242px;
	z-index: 2;
}

div#jf-jpod div.cover2 {
	position: absolute;
	top: 0; left: 14px;
	width: 117px;
	height: 14px;
	z-index: 2;
}

div#jf-jpod div.cover3 {
	position: absolute;
	top: 0; right: 0;
	width: 14px;
	height: 242px;
	z-index: 2;
}

div#jf-jpod div.cover4 {
	position: absolute;
	bottom: 0; left: 14px;
	width: 117px;
	height: 141px;
	z-index: 2;
}

/* Grey */
div#jf-jpod.grey div.cover1 {
	background: url(../../images/grey/l.png) no-repeat 0 0;
}

div#jf-jpod.grey div.cover2 {
	background: url(../../images/grey/t.png) no-repeat 0 0;
}

div#jf-jpod.grey div.cover3 {
	background: url(../../images/grey/r.png) no-repeat 0 0;
}

div#jf-jpod.grey div.cover4 {
	background: url(../../images/grey/b.png) no-repeat 0 0;
}

/* Black */
div#jf-jpod.black div.cover1 {
	background: url(../../images/black/l.png) no-repeat 0 0;
}

div#jf-jpod.black div.cover2 {
	background: url(../../images/black/t.png) no-repeat 0 0;
}

div#jf-jpod.black div.cover3 {
	background: url(../../images/black/r.png) no-repeat 0 0;
}

div#jf-jpod.black div.cover4 {
	background: url(../../images/black/b.png) no-repeat 0 0;
}

div#jf-jpod div.shadow {
	width: 12px;
	height: 89px;
	position: absolute;
	top: 0; left: 75px;
	background: url(../../images/shadow.png) repeat-y 0 0;
}

div#jf-jpod ul.menu {
	width: 75px;
	height: 77px;
	padding: 12px 0 0 0;
	background: #FFF url(../../images/menu.png) no-repeat 0 -34px;
	list-style: none;
	margin: 0;
}

div#jf-jpod ul.menu li {
	position: relative;
	color: #000;
	font-size: 9px;
	height: 16px;
	width: 73px;
	overflow: hidden;
	line-height: 16px;
	padding-left: 2px;
	cursor: pointer;
	overflow: hidden;		background: none;
}

div#jf-jpod ul.menu li.selected {
	background: url(../../images/menu.png) no-repeat 0 -15px;
}

div#jf-jpod span.override1 {
	display: block;
	position: absolute;
	top: 0; right: 0;
	height: 16px;
	width: 2px;
	background-color: #FFF;
}

div#jf-jpod span.override2 {
	display: block;
	position: absolute;
	top: 0; right: 0;
	height: 16px;
	width: 12px;
	background: url(../../images/menu.png) no-repeat -63px -15px; 
}

div#jf-jpod span.name {
	display: none;
}

div#jf-jpod span.w {
	color: #FFF;
	display: block;
	height: 9px;
	padding-top: 4px;
	width: 117px;
}

div#jf-jpod span.b {
	display: block;
	height: 9px;
	padding-top: 4px;
	width: 117px;
}

div#jf-jpod div.controls a {
	display: block;
	cursor: pointer;
	position: absolute;
	z-index: 3;		background: none;
}

a#jpodmenu {
	bottom: 101px; left: 54px;
	width: 35px;
	height: 15px;
}

a#jpodplay {
	bottom: 27px; left: 54px;
	width: 35px;
	height: 15px;
}

a#jpodnext {
	bottom: 63px; left: 88px;
	width: 35px;
	height: 15px;
}

a#jpodprev {
	bottom: 63px; left: 19px;
	width: 35px;
	height: 15px;
}