body{
	width:320px;
	height:300px;
	background:url('images/background.jpg') #D2D2D2;
	margin:auto;
	padding-top:5px;
	padding-bottom:5px;
	color:white;
}

img{
	border:0px;
	vertical-align:middle;
}

a, a:hover, a:visited{
	color:inherit;
	border:none;
	text-decoration:none;
}

.clear{clear:both; width:0; height:0;}

.marque{width:300px; height:60px; padding:10px; background:#5a9aa8; border-bottom:1px solid #0089cf;}
.marque .logo{width:60px; float:left;}
.marque .nom{width:230px; float:left; margin-left:10px; font-size:26px; color:#FFFFFF; font-family: 'Roboto', sans-serif; line-height:60px; font-weight: 700; text-align:center;}

.previous{width:300px; height:60px; padding:6px 10px; background:#FFFFFF; border-bottom:1px solid #0089cf;}
.previous .pochette{width:60px; float:left;}
.previous .pochette img{width:60px; height:60px; opacity:0.6;}
.previous .titre{width:230px; float:left; margin-left:10px; font-size:14px; color:#0089cf; font-family: 'Roboto', sans-serif; line-height:20px; padding-top:6px;}
.previous .titre .artiste{font-weight: 700;}
.previous .titre .chanson{margin-top:4px;}

.current{width:300px; height:120px; padding:10px; background:#5a9aa8; border-bottom:1px solid #0089cf; position:relative;}
.current .pochette{width:120px; float:left;}
.current .pochette img{width:120px; height:120px;}
.current .titre{width:150px; float:left; margin-left:10px; font-size:16px; color:#FFFFFF; font-family: 'Roboto', sans-serif; line-height:25px; padding-top:6px;}
.current .titre .artiste{font-weight: 700;}
.current .titre .chanson{margin-top:4px;}
.current .vote_plus{position:absolute; right:-50px; top:20px; cursor:pointer;}
.current .vote_moins{position:absolute; right:-50px; top:75px; cursor:pointer;}

#player{
	width:320px;
}

#controleur{
	width:320px; height:50px; background:#FFFFFF;
}
#timing{float:right; margin-top:15px;  color:#0089cf; font-family: 'Roboto', sans-serif; margin-right:5px;}
#volume{ margin-left:10px; float:left; width:160px; margin-top:17px;}
#bouton{float:left; width:50px;}

#encemoment{
	color:#e2f2ff;
	font-size:18px;
	text-decoration:underline;
}

#titre{
	margin-top:15px;
	color:#74defc;
	font-size:12px;
	font-weight:bold;
}

#mp3{
	margin-top:25px;
}

#actu{
	font-family: 'Times New Roman';
	margin-top:10px;
	height:30px;
	width:270px;
	text-align:justify;
	color:#17424e;
	font-size:12px;
	overflow:hidden;
}

#actu h1{
	margin:0px;
	padding:0px;
	font-size:12px;
	color:#74defc;
	margin-bottom:5px;
}

.home{margin-top:6px;}
.facebook{width:155px; float:left; height:50px; margin-top:6px;}
.twitter{width:155px; float:left; height:50px; margin-left:10px; margin-top:6px;}

#notifications{position:fixed; bottom:5px; right:10px;}
#notifications .messageok{background:#9BFFB9; width:240px; border-radius:4px; border:1px solid #03BF3B; padding:5px; font-size:11px; margin-bottom:3px; color:#000000;}
#notifications .messageko{background:#FFA7B4; width:240px; border-radius:4px; border:1px solid #BF031C; padding:5px; font-size:11px; margin-bottom:3px; color:#000000;}
#notifications .messageinfo{background:#C9E0E8; width:240px; border-radius:4px; border:1px solid #0D6C93; padding:5px; font-size:11px; margin-bottom:3px; color:#000000;}