/* audio css
	released on 18-may */
/* ===STATIC jQ MP3 PL.===1086 */
			/* Обвертка аудио */
.playerWrap{position:static;top:0px;bottom:0px;right:0px;left:0px;margin:20px;border-bottom:1px solid #ddd;width:800px;height:564px;background:#fff;margin-top:60px;z-index:5}
.posFixed{position:fixed;}

			/* Основной аудио сектор */
.audioSector { float: left; width: 800px; position: relative; color: #333; font-family: 'Arial', sans-serif; -webkit-font-smoothing: subpixel-antialiased;}
.audioContent, .tempContent { width: 100%; position: relative; overflow: hidden; box-shadow: 0px 1px 3px rgba(0,0,0,0.3); box-sizing: border-box; }

			/* Верхний блок (Аудио навигация или Плеер) */
.musicNavPanel { position:relative; width: 100%; height: 44px; }
.inNavPanel { position:absolute; top:0; z-index:8; width:800px; height: 30px; background-color:#F0F1F2; box-shadow: 0px 1px 2px rgba(123,154,165,0.5); padding: 7px 0; }

.player{ color:#333; width:798px;/* width:522px;  */height:30px; position:relative; z-index:10; float:left; display:inline-block;}
	.player_nav{ display: inline-block; float: left; width: 130px; margin-left: 22px;/* margin-left: 6px; */}
	.player_nav div{ width:16px; height:16px; margin-top: 1px; float:left; cursor:pointer; padding: 5px; border-radius: 4px; background-color: #4aaf66; color: #fff; border: 1px solid #3f9858; box-shadow: 0px 1px 1px rgba(0,0,0,0.1); margin-right: 3px; background-image: linear-gradient(to top, rgba(0,0,0,.10), rgba(255,255,255,.15)); }
	.player_nav div:hover i { opacity: 1; }
	.player_nav div:hover {  background-image: linear-gradient(to top, rgba(0,0,0,.02), rgba(255,255,255,.30)); }
	#pausePZ{ display: none; }
	.player_data{width:476px;/* width:276px; */ height:22px; margin:4px 14px; display:inline-block; position:relative; float:left;}
		.name_pz{height: 14px;overflow: hidden;position:absolute; top:0; left:0; width:425px;/* width:186px; */ font-size: 11px;}
		.time_pz{position:absolute; top:0; right:0; width:50px;	text-align:right; font-size: 11px;}
		.polzunok{width:386px;/* width:186px; */	height:5px;	position:absolute; border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px; background:#d4d7cf; bottom:0; left:0;cursor:pointer}
		
		
		/* id="player_progress_load_bar_2" -> id="load_bar" */
		#load_bar{height:5px;background:#fff;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px}
		#load_bar{background:#bac7d4}
		
		/* id="player_progress_play_bar_2" -> id="play_bar" */
		#volume_bar_2, #play_bar{width:0;	height:5px; position:relative; background:#5AB950; cursor:pointer;border-radius:3px; -moz-border-radius:3px;-webkit-border-radius:3px}
		
		.in_polzunok{width:0;	height:5px; position:relative; border-radius:3px; background:#5AB950; cursor:pointer;}
		.roler_polzunka{position:absolute; right:-6px; top:-2px; width: 12px; height:9px; border-radius:3px; background:#5A8850; display:none;}
		.mute_zp{width:84px; height:30px; display:inline-block; position:absolute; top:4px; right:0px;}
		#proMuteZP{position:absolute; width:80px; height:5px; left:2px; top:12px; top:12.5px; background:#d4d7cf; border-radius:3px;cursor:pointer;}

	

			/* Правый блок (Блок для вывода всех аудио) */
.audioContainer, .tempContainer { float: right; width: 545px; padding: 10px; min-height: 500px; background-color: white; }
	.song{width:100%; height:30px; position:relative; cursor:pointer; overflow:hidden;padding: 0; margin-bottom: 3px; }
	.song:hover{background:#e6ebed;}
	.song_hover{background:#e6ebed !important;}
	.song_hover .soundEdit{display:block;}	
	.song_hover .sound_time span{display:none;}
	.song_hover .soundDel{display:block;}
	.song_hover .soundAdd{display:block;}
	.song_hover .soundAdded{display:block;}
	/* .seek{background:url(img/load.gif) !important;}  */
	.soundEdit{height:14px;	width:14px;	margin:1px;	background: url(/images/4_audio/edit_audio.png) center center no-repeat; background-size: cover; display:none;}
	.soundEdit:hover{background-image: url(/images/4_audio/edit_audio_write.png);}
	.soundDel{width:14px; height:14px; margin: 1px 9px; background: url(/images/4_audio/delp_a.png); background-size: cover;  display: none; }
	.soundDel:hover{background-image: url(/images/4_audio/delp_write.png);}
	.soundAdd {width: 14px !important;height: 14px !important;margin: 1px 9px;background: url(/images/4_audio/add.png) no-repeat;display: none;}
	.soundAdded {width: 14px !important;height: 14px !important;margin: 1px 9px;background: url(/images/4_audio/delp_a.png) no-repeat;background-size: cover;display: none;}
	
	.play_nzp, .pause_nzp, #errorZP{ width:16px; height:16px; margin-top: 1px; float:left; cursor:pointer; padding: 5px; border-radius: 4px; background-color: #4aaf66; color: #fff; border: 1px solid #3f9858; box-shadow: 0px 1px 1px rgba(0,0,0,0.1); margin-right: 3px; background-image: linear-gradient(to top, rgba(0,0,0,.10), rgba(255,255,255,.15)); }
	.play_nzp:hover, .pause_nzp:hover, #errorZP:hover{ background-image: linear-gradient(to top, rgba(0,0,0,.02), rgba(255,255,255,.30)); }
	.pause_nzp{  display:none;}
	
	.sound_name_zp{
		width: 400px;
		/* width:68%;  */
		height:22px; 
		float:left; 
		margin:4px;
		font-size: 11px;
		/* font-weight: bold; */
		position:relative;
		line-height:22px; 
		overflow:hidden; 
		text-align:left;
		color: #333;
		padding: 0!important;
	}
	.alignSong{
		max-width: 300px;
		display: inline-block;
		vertical-align: top;
		overflow: hidden;
		-o-text-overflow: ellipsis;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.sound_opt_zp{height:16px; position:absolute; right:4px; top:7px;}
	.sound_opt_zp div{float:left;}
	.sound_time{ font-size: 11px; font-weight: bold; width:32px; text-align:center; color:#393939; line-height:16px;padding: 0!important}
	.drag_hover .sound_time span{display:none;}

.loadMore{padding:9px;text-align:center;/* background:rgb(233, 237, 241);  */color:rgb(106, 121, 137);cursor:pointer;margin-top:10px}	
	
			/* Левый блок (Блок для вывода аудио друзей) */
.mini_container{  width:214px; position: absolute; background: #f4f6f6; height: 100%; border-right: 1px solid #dfe7e7; padding: 10px;padding-top: 0; }
.mini_container .sound_name_zp{
    font-size: 11px !important;
    height: 22px;
    width: 140px !important;
}
.inMinCont{position:absolute; z-index:4;  width:214px;}
/* .inMinCont p{margin: 10px 0} */

.searchMusic { margin: 5px 10px; width:192px; padding:5px 10px; height:17px; border:1px solid #ccc; display:inline-block; float: left; border-radius: 4px; color: rgb(193, 202, 208);}

.muzSearchBox{
	background-color: #e6ebeb;
	height: 39px;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
	margin: 0 -10px 10px -10px;
}

			/* --Иконки-- */
i {font-style: normal;}
.i-audio { display: inline-block; height: 16px; width: 16px; background: url('http://www.weua.info/img/newimages/iconsDark.png') -291px -229px no-repeat; vertical-align: top; opacity: 0.5; transition: all .3s; }
.i-audio-play { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -291px -229px no-repeat; vertical-align: top; opacity: 1; transition: all .3s; }
.i-audio-prev { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -201px -229px no-repeat; vertical-align: top; opacity: 1; transition: all .3s; }
.i-audio-next { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -320px -230px no-repeat; vertical-align: top; opacity: 1; transition: all .3s; }
.i-audio-pause { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -261px -229px no-repeat; vertical-align: top; opacity: 1; transition: all .3s; }
.i-audio-repeat { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -21px -258px no-repeat; vertical-align: top; opacity: .5; transition: all .3s; }
.i-audio-random { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -81px -259px no-repeat; vertical-align: top; opacity: .5; transition: all .3s; }
.i-audio-on { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -141px -229px no-repeat; vertical-align: top; opacity: .5; transition: all .3s; }
.i-audio-off { display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -171px -229px no-repeat; vertical-align: top; opacity: 1; transition: all .3s; }
.i-folder{  display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -141px -19px no-repeat; vertical-align: top; opacity: 1; transition: all .3s;}
.i-plus{ display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -201px -170px no-repeat; vertical-align: top; opacity: 1; transition: all .3s;}
.i-key{ display: inline-block; height: 16px; width: 16px; background: url('/images/3_icons/set5.png') -20px -229px no-repeat; vertical-align: top; opacity: 1; transition: all .3s;}
.i-add_user {display: inline-block;height: 16px;width: 16px;background: url('/images/3_icons/set5.png') -231px -79px no-repeat;vertical-align: bottom;opacity: 1;transition: all .3s;}
.i-remove_user {display: inline-block;height: 16px;width: 16px;background: url('/images/3_icons/set5.png') -201px -79px no-repeat;vertical-align: bottom;opacity: 1;transition: all .3s;}
.i-photo {display: inline-block;height: 16px;width: 16px;background: url('/images/3_icons/set5.png') -21px -109px no-repeat;vertical-align: top;opacity: 1;transition: all .3s;}
.i-photo2 {display: inline-block;height: 16px;width: 16px;background: url('/images/3_icons/set5.png') -51px -109px no-repeat;vertical-align: top;opacity: 1;transition: all .3s;}
.i-photos {display: inline-block;height: 16px;width: 16px;background: url('/images/3_icons/set5.png') -81px -109px no-repeat;vertical-align: top;opacity: 1;transition: all .3s;}
			/* --Иконки-- */


			/* --Мини преер-- */
.miniPlayer{background:rgba(0,0,0,0.7);padding:12px;padding-bottom:7px;color:#e3e9ea;}
.miniPlayer small{color:#b7c3c5;margin-left:5px; font-size: 11px;}
.mini {position:fixed;top:200px;border-radius:6px;width: 166px;}		
.mini #volume_bar_2{ position: absolute;/* margin-left: 58px; margin-top: 13px; */height:4px; background: #fff;}


.mPrev{background:url("/images/3_icons/set4.png") no-repeat;width:12px;
height:12px;float:left;cursor:pointer;opacity:0.8;margin-top:10px}
.mPlay{background:url("/images/3_icons/set4.png") no-repeat -28px 0px;width:7px;
height:12px;float:left;margin-left:10px;margin-top:9px;cursor:pointer;opacity:0.8}
.mPause{background:url("/images/3_icons/set4.png") no-repeat -37px 0px;width:12px;
height:12px;float:left;margin-left:8px;margin-right:-3px;margin-top:9px;cursor:pointer;opacity:0.8;display:none}
.mNext{background:url("/images/3_icons/set4.png") no-repeat -14px 0px;width:12px;height:10px;float:left;margin-left:10px;margin-top:10px;cursor:pointer;opacity:0.8;}

.mRepeat{background:url("/images/3_icons/set4.png") no-repeat 0px -15px;width:13px;height:11px;float:left;margin-left: 61px;margin-top: 9px;cursor:pointer;opacity:0.8}
.mRandom{background:url("/images/3_icons/set4.png") no-repeat -16px -14px;width:14px;height:12px;float:left;margin-left:8px;margin-top:9px;cursor:pointer;opacity:0.8}
.mTranslate{background:url("/images/3_icons/set4.png") no-repeat -51px 0px;width:11px;height:11px;float:left;margin-left:8px;margin-top:9px;cursor:pointer;opacity:0.8}

.mPrev:hover, .mPlay:hover, .mPause:hover, .mNext:hover, 
.mRepeat:hover, .mRandom:hover, .mTranslate:hover{opacity:1}


.mTrackname {position: absolute;width: 250px; margin-top:-7px;}
.mTitle {float: left;height: 15px;margin-right: 3px;max-width: 130px;overflow: hidden;}
.mTitle div{width:1000px}
.mVolumeBar{height:4px;width:50px;background:#9aadc5;position: absolute;margin-left: 58px; margin-top: 13px;cursor:pointer}




/* --Сам преер--нужно распределить */
.activeSong{background:#cecece;}
.activeSong:hover{background:#cecece !important;}

.audioFrame{position:fixed;/* position: absolute; */top:0px;bottom:0px;right:0px;left:0px;margin:20px;border:1px solid #ddd;width:475px;height:504px;background:#fff;margin-top:60px;z-index:5}














/* --Песня друзей-- */
.friend_audio {
	display: block;
	cursor: pointer;
	height: 30px;
	padding: 4px 10px;
	line-height: 0;
	white-space: nowrap;
	position: relative;
	/* background: #F7F7F7; */
	margin: 0 -10px; 
	overflow: hidden;
	width: 100%;
}
.friend_audio:hover {
	background: #EDF1F5;
	background: none repeat scroll 0 0 rgba(219, 227, 235, 0.5);
}
	.item_opacity{margin-left: 4px; opacity:0}
	.friend_audio:hover .item_opacity{opacity:1;transition: .5s;}
	.friend_audio:hover .sound_opt_zp {display:none}

.friend_audio_ava {
width: 30px;
height: 30px;
background: 0 0 no-repeat;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
float: left;
}

.friend_audio_name:hover, .friend_audio_now:hover {
text-decoration: none;
}
.friend_audio_name, .friend_audio_now {

line-height: 1.36em;
padding: 0 0 0 8px;
white-space: nowrap;
/* display: block; */
width: 165px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
float: left;
}
.no_music_status{
	line-height: 2.72em; 
}

.friend_audio_now {
height: 1.36em;
font-size: 0.9em;
}

.friend_audio:hover .friend_audio_status {
color: #6A798A;
}
.friend_audio_status {
color: #777;
}
.fa-folder:hover::before{
	content: "\f04b";
	margin-left: 2px;
}
/* --Песня друзей-- */

