/*********************************************************************SETTiNGS*/
.window{
	position:relative;
	margin:auto;
	top:221px;
	width:1282px;
	color:#C8C8C8;
	font-family:arial;
	font-size:12px;
	font-weight:normal;
}
.window.main{
	height:55px;
}
.window.main .body-content{
	height:721px;
	background:url(../player/playerxy.png) left;
	border-bottom:1px solid black;
	border-left:1px solid black;
	border-right:1px solid black;
}
.window.main .controls{
	position:absolute;
	top:0px;
	left:0px;
	width:1280px;
	height:30px;
	border-top:1px solid black;
	border-left:1px solid black;
	border-bottom:1px solid black;
	background:url(../player/player.png) -1px -1px;
}
/**********************************************************************BUTTONS*/
.controls .button{
	margin:auto;
	display:inline-block;
	width:35px;
	height:30px;
	background:url(../player/player.png);
	margin-right:1px;
	cursor:pointer;
}
/*********************************************************************PREViOUS*/
.controls .button.previous{
	background-position:-1px -63px;
}
.controls .button.previous:hover{
	background-position:-1px -93px;
}
/****************************************************************SEEK*BACKWARD*/
.controls .button.seek-backward{
	background-position:-36px -63px;
}
.controls .button.seek-backward:hover{
	background-position:-36px -93px;
}
/*************************************************************************PLAY*/
.controls .button.play{
	background-position:-71px -63px;
}
.controls .button.play:hover{
	background-position:-71px -93px;
}
/************************************************************************PAUSE*/
.controls .button.pause{
	background-position:-176px -63px;
}
.controls .button.pause:hover{
	background-position:-176px -93px;
}
/*****************************************************************SEEK*FORWARD*/
.controls .button.seek-forward{
	background-position:-106px -63px;
}
.controls .button.seek-forward:hover{
	background-position:-106px -93px;
}
/*************************************************************************NEXT*/
.controls .button.next{
	background-position:-141px -63px;
}
.controls .button.next:hover{
	background-position:-141px -93px;
}
/************************************************************************TiTLE*/
.window.main .title{
	position:absolute;
	top:0px;
	left:180px;
	width:903px;
	height:25px;
	padding-top:7px;
	padding-left:10px;
	font-size:14px;
	font-weight:normal;
	z-index:1;
}
/**********************************************************************SHUFFLE*/
.controls .button.shuffle{
	background-position:-446px -63px;
	width:59px;
	float:right;
}
.controls .button.shuffle:hover{
	background-position:-446px -93px;
}
.controls .button.shuffle.off{
	background-position:-387px -63px;
}
.controls .button.shuffle.off:hover{
	background-position:-387px -93px;
}
/***********************************************************************REPEAT*/
.controls .button.repeat.none{
	background-position:-210px -63px;
	width:59px;
	float:right;
}
.controls .button.repeat.none:hover{
	background-position:-210px -93px;
}
.controls .button.repeat.one{
	background-position:-269px -63px;
	width:59px;
	float:right;
}
.controls .button.repeat.one:hover{
	background-position:-269px -93px;
}
.controls .button.repeat.all{
	background-position:-329px -63px;
	width:59px;
	float:right;
}
.controls .button.repeat.all:hover{
	background-position:-329px -93px;
}
/***********************************************************************VOLUME*/
.controls .button.volume {
	float:right;
	background:none;
	width:52px;
	height:22px;
	padding-top:8px;
	padding-left:11px;
}
.controls input.volumeSlider{
	background:none;
	width:42px;
}
/******************************************************************ACTiVE*TiME*/
.window.main .currentTime{
	float:left;
	width:40px;
}
/*********************************************************************SEEK*BAR*/
.window.main .progress{
	position:absolute;
	height:22px;
	top:30px;
	left:0px;
	width:1270px;
	padding-top:10px;
	padding-left:10px;
	border-bottom:1px solid black;
	border-left:1px solid black;
	background:url(../player/player.png) -1px -30px;
}
.window.main input.seek{
	padding-left:6px;
	width:1168px;
	background:none;
}
/*******************************************************************TOTAL*TiME*/
.window.main .totalTime{
	float:right;
	width:34px;
}
/*********************************************************************PLAYLiST*/
.window.playlist{
	position:relative;
	margin-top:229px;
	top:5px;
	left:0px;
	width:1280px;
	height:648px;
}
.window.playlist tr{
	cursor:pointer;
}
.window.playlist tr:hover{
	background:rgba(255,255,255,.05);
}
.window.playlist tr.currentlyPlaying{
	background:rgba(0,0,0,.25);
}
.window.playlist td{
	color:#C8C8C8;
	font-size:11px;
	font-weight:normal;
	padding-left:5px;
	padding-right:5px;
}
.window.playlist td.n{
	width:1182px;
	height:5px;
}
.window.playlist td.d{
	padding:1px;
	padding-top:2px;
	padding-bottom:2px;
	padding-right:9px;
}
.window.playlist .body-content{
	position:absolute;
	width:100%;
	height:100%;
	padding-left:5px;
	padding-right:12px;
	box-sizing:border-box;
	overflow-y:scroll;
	overflow-x:hidden;
}
.window.playlist .body-right{
	position:absolute;
	right:0px;
	width:20px;
	height:100%;
	background:url(../player/playery.png) repeat-y;
}
.window.playlist .scroller{
	position:absolute;
	width:12px;
	height:12px;
	right:9px;
	background:url(../player/player.png) -507px -63px;
	cursor:pointer;
}
/******************************************************************************/