body {
	margin:0;
	overflow:hidden;
	padding:0;
}


.audio_player {
	width:100%;
    position: relative;
	overflow:hidden;
	display:block;

	
}






.audio_player_type {
	
    display: flex;
}

.punishpl_pading {
 	position: relative;
    width: 100%;
    background-color: #d9d9d9;
	
    overflow: hidden;
}




.audio_player_in {
	float: left;
	width:100%;
    max-width: calc(100% - 159px);
    display: block;
    position: relative;
}






.audio_player .audio_player_type button,
.audio_player .audio_player_type button.active {
    font-size: 14px;
    height: 110px;
    width: 100%;
	min-width:100px;
    text-align: center;
    text-transform: uppercase;
	color:#b3bec7;
	margin: auto 1px;
	border: 0;
    border-radius: 0;
    outline: none;
    padding: 0;
	cursor:pointer;
}


.audio_player .audio_player_type button.active,
.audio_player .audio_player_type button.active:hover,
.audio_player .audio_player_type button.active:active {
	background-color:#ccc;
	color:#2e3e4b;
	
}

.audio_player .audio_player_type button {
	background-color:#2e3e4b;
	transition: background-color 0.3s ease,
				color 0.3s ease;
}




.audio_player .audio_player_type button:hover {
	background-color:#374958;
	color:#fff;
}
.audio_player .audio_player_type button:active {
	background-color:#2e3e4b;
}

.audio_player .audio_player_type button::before {
    background: url(../images/icons.svg) left top;
    content: ' ';
    display: block;
    height: 22px;
    margin: 0 auto 5px;
    width: 70px;
}



.audio_player .audio_player_type button::before  {
    background-size: auto 300px;
    height: 45px;
}


.audio_player .audio_player_type button[value="drums"]::before {
    	background-position: -39px -48px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="drums"]::before {
    	background-position: -39px -106px;
    	width: 70px;
	}
	
	
	.audio_player .audio_player_type button[value="guitar"]::before {
    	background-position: -132px -51px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="guitar"]::before {
		background-position: -132px -109px;
		width: 70px;
	}


	.audio_player .audio_player_type button[value="bass"]::before {
    background-position: -228px -51px;
    width: 70px;
	}

	.audio_player .audio_player_type button.active[value="bass"]::before {
    background-position: -228px -109px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="synth"]::before {
    background-position: -331px -50px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="synth"]::before {
    background-position: -331px -108px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="fullmix"]::before {
    background-position: -431px -51px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="fullmix"]::before {
     background-position: -431px -109px;
	 width: 70px;
	}




.audio_player .audio_player_presets {
    display: flex;
}

.audio_player .audio_player_presets button {
	height: 45px;
	width: 100%;
	min-width:100px;
	
	background-color: #405261;
	transition: background-color 0.3s ease,
				color 0.3s ease;
	
    color: #b3bec7;
	font-size:14px;
    text-align: center;
    text-transform: uppercase;
	margin: 1px;
    border: 0;
    border-radius: 0;
    outline: none;
    padding: 0;
	cursor:pointer;
}
.audio_player .audio_player_presets button:hover {
	background-color: #4d6172;
	color:#fff;
}
.audio_player .audio_player_presets button:active {
	background-color: #405261;
}
.audio_player .audio_player_presets button.active {
	background-color: #405261;
	color:#fff;
}





/*controls play stop*/
.audio_player_control {
	float: left;
    display: block;
    position: relative;
    width: 159px;
}


.audio_player .audio_player_control .preloader,
.audio_player .audio_player_control .play,
.audio_player .audio_player_control .pause,
.audio_player .audio_player_control_mobile .play,
.audio_player .audio_player_control_mobile .pause
{
	width:159px;
}




.audio_player .audio_player_control .preloader,
.audio_player .audio_player_control .pause,
.audio_player .audio_player_control_mobile .pause {
	display:none;
}


.audio_player .audio_player_control .preloader,
.audio_player .audio_player_control .play,
.audio_player .audio_player_control .pause,
.audio_player .audio_player_control_mobile .play,
.audio_player .audio_player_control_mobile .pause
 {
    
	height: 203px;
    text-align: center;
	background-color:#2e3e4b;
	
		transition: background-color 0.3s ease,
				color 0.3s ease;
	
	/*margin: auto 1px;*/
	border: 0;
    border-radius: 0;
    outline: none;
    padding: 0;
	cursor:pointer;
}


.audio_player .audio_player_control .play:hover,
.audio_player .audio_player_control .pause:hover,
.audio_player .audio_player_control_mobile .play:hover,
.audio_player .audio_player_control_mobile .pause:hover
 {
	background-color:#374958;	
}

.audio_player .audio_player_control .play:active,
.audio_player .audio_player_control .pause:active,
.audio_player .audio_player_control_mobile .play:active,
.audio_player .audio_player_control_mobile .pause:active {
	background-color:#2e3e4b;	
}



.audio_player .audio_player_control .play::before,
.audio_player .audio_player_control .pause::before,
.audio_player .audio_player_control_mobile .play::before,
.audio_player .audio_player_control_mobile .pause::before {
	
    background: url(../images/icons.svg) left top;
    content: ' ';
    display: block;
    height: 22px;
    margin: 0 auto 5px;
    width: 70px;
	
	background-size: auto 440px;
    height: 120px;
	
}


.audio_player .audio_player_control .play::before,
.audio_player .audio_player_control_mobile .play::before {
    background-position: -68px -1137px;
    width: 100px;
}
.audio_player .audio_player_control .pause::before, 
.audio_player .audio_player_control_mobile .pause::before {
    background-position: -188px -1137px;
    width: 100px;
}




.preloader {
	border: 0;
	border-radius: 0;
    outline: none;
    padding: 0;
	cursor:pointer;
}

.preloader_style {
	width:31px;
	height:31px;
	border: 0;
    
	
}





.audio_player_progress-bar {
	
    display: block;
	background-color:#ccc;
	width:99.9%;
	height:45px;
	margin-top:1px;
	margin-left:1px;
}
.pnlWaves {
	position: relative;
    width: 100%;
    
    display: block;
}


.waveForm {
	display:block;
	position:relative;
	overflow:hidden;
}
.playerProgress {
	height:45px;
	margin-top:-45px;
	position:relative;
	z-index:180;
	background-color:#93a5b4;
    -webkit-transition: width linear .25s;
    transition:width linear .25s;
}

.noTransition {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

.playerProgressHover {
	height:45px;
	margin-top:-45px;
	position:relative;
	z-index:170;
	transition:width linear .25s;
    width: 0;
	background-color:#a1b4c4;
}
.playerNormal {
	height:45px;
	
	position:relative;
	z-index:150;
}
.playerHead {
	display:none;
	bottom: 0;
    height: 93px;
    position: absolute;
    right: 0;
    width: 1px;
    z-index: 888;
	border-right:1px solid #94a5b3;
	
}







/*safari 9*/
@supports (overflow:-webkit-marquee) and (justify-content:inherit) 
{
	
	@media only screen and (max-width: 620px), only screen and (max-device-width: 480px) {

	.audio_player .audio_player_type button[value="drums"]::before {
    	background-position: -48px -48px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="drums"]::before {
    	background-position: -44px -106px;
    	width: 70px;
	}

	}

.audio_player .audio_player_type button::before  {
    background-size: auto 300px;
    height: 45px;
}


.audio_player .audio_player_type button[value="drums"]::before {
    	background-position: -44px -48px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="drums"]::before {
    	background-position: -44px -106px;
    	width: 70px;
	}
	
	
	.audio_player .audio_player_type button[value="guitar"]::before {
    	background-position: -136px -51px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="guitar"]::before {
		background-position: -136px -109px;
		width: 70px;
	}


	.audio_player .audio_player_type button[value="bass"]::before {
    background-position: -233px -51px;
    width: 70px;
	}

	.audio_player .audio_player_type button.active[value="bass"]::before {
    background-position: -233px -109px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="synth"]::before {
    background-position: -337px -50px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="synth"]::before {
    background-position: -337px -108px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="fullmix"]::before {
    background-position: -436px -51px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="fullmix"]::before {
     background-position: -436px -109px;
	 width: 70px;
	}



}




@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
.audio_player .audio_player_type button::before  {
    background-size: auto 300px;
    height: 45px;
}


.audio_player .audio_player_type button[value="drums"]::before {
    	background-position: -44px -48px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="drums"]::before {
    	background-position: -44px -106px;
    	width: 70px;
	}
	
	
	.audio_player .audio_player_type button[value="guitar"]::before {
    	background-position: -137px -51px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="guitar"]::before {
		background-position: -137px -109px;
		width: 70px;
	}


	.audio_player .audio_player_type button[value="bass"]::before {
    background-position: -232px -51px;
    width: 70px;
	}

	.audio_player .audio_player_type button.active[value="bass"]::before {
    background-position: -232px -109px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="synth"]::before {
    background-position: -337px -50px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="synth"]::before {
    background-position: -337px -108px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="fullmix"]::before {
    background-position: -435px -51px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="fullmix"]::before {
     background-position: -435px -109px;
	 width: 70px;
	}

}




.audio_player_control_mobile {
	display:none;
}



@media only screen and (max-width: 700px), only screen and (max-device-width: 480px){

.audio_player_control {
	width: 118px !important;	
}
.audio_player .audio_player_control .preloader, .audio_player .audio_player_control .play, .audio_player .audio_player_control .pause, .audio_player .audio_player_control_mobile .play, .audio_player .audio_player_control_mobile .pause {
    width: 118px !important;
}

.audio_player_in {
	
    max-width: calc(100% - 118px)!important;

}


	
}




@media only screen and (max-width: 620px), only screen and (max-device-width: 480px) {
	
	.audio_player_in {
		max-width: inherit !important;
		width: 99.9% !important;
		min-width:200px;
	}




	.audio_player_control {
		display:none;
	}
	
	.audio_player .audio_player_control_mobile .play,
	.audio_player .audio_player_control_mobile .pause,
	.audio_player .audio_player_control_mobile .preloader {
    	height: 399px;
	}
	.audio_player_control_mobile {
		display: block;
		float:left;
		width: 34%;
		
		
		position: relative !important;
		left: 0 !important;
		top: 0 !important;
		transform: inherit !important;
		z-index: 2 !important;
	}
	
	.audio_player .audio_player_control_mobile .play,
	.audio_player .audio_player_control_mobile .pause,
	.audio_player .audio_player_control_mobile .preloader {
    	width: 100% !important;
	}
	
	
	.audio_player .audio_player_control_mobile .pause,
	.audio_player .audio_player_control_mobile .preloader {
		display:none; 
	}
	
	
	
	.audio_player .audio_player_control_mobile .preloader {
	background-color:#2e3e4b;
	}
	
	
	
	
	.audio_player .audio_player_type button,
	.audio_player .audio_player_type button.active,
	.audio_player .audio_player_presets button,
	.audio_player .audio_player_presets button.active  {
		font-size: 14px !important;
		min-width:inherit !important;
	}
	
	
	
	
	
	
	.audio_player .audio_player_type {
		float:left;
		display: block;
		width: 33%;
	}

	.audio_player .audio_player_type button,
	.audio_player .audio_player_type button.active {
		width: 99.5% !important;
    	display: initial;
		border-right: 2px solid #d9d9d9;
		border-bottom:1px solid #d9d9d9;
		height:80px;
	}
	
	


	.audio_player .audio_player_type button:last-of-type {
		border-bottom:1px solid #d9d9d9;
	}
	
	

	
	.audio_player .audio_player_type button::before {
		background-size: auto 300px;
		height: 45px !important;
	}
	
	
	
	.audio_player .audio_player_type button[value="drums"]::before {
    	background-position: -42px -48px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="drums"]::before {
    	background-position: -42px -106px;
    	width: 70px;
	}
	
	
	.audio_player .audio_player_type button[value="guitar"]::before {
    	background-position: -135px -51px;
    	width: 70px;
	}
	.audio_player .audio_player_type button.active[value="guitar"]::before {
		background-position: -135px -109px;
		width: 70px;
	}


	.audio_player .audio_player_type button[value="bass"]::before {
    background-position: -232px -51px;
    width: 70px;
	}

	.audio_player .audio_player_type button.active[value="bass"]::before {
    background-position: -232px -109px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="synth"]::before {
    background-position: -335px -50px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="synth"]::before {
    background-position: -335px -108px;
    width: 70px;
	}



	.audio_player .audio_player_type button[value="fullmix"]::before {
    background-position: -435px -51px;
    width: 70px;
	}
	.audio_player .audio_player_type button.active[value="fullmix"]::before {
     background-position: -435px -109px;
	 width: 70px;
	}
	
	
	
	
	
.audio_player .audio_player_control .play::before,
.audio_player .audio_player_control_mobile .play::before {
    background-position: -68px -1137px;
    width: 90px !important;
}
.audio_player .audio_player_control .pause::before, 
.audio_player .audio_player_control_mobile .pause::before {
    background-position: -188px -1137px;
    width: 90px !important;
}

	
	
	
	
	

	
	.playerHead {
		display:none;
		bottom: 0;
		height: 93px;
		position: absolute;
		right: 0;
		width: 0px;
		z-index: 888;
		border-right:0px ;
		
	}


	.audio_player .audio_player_presets {
    	display: block;
		float:right;
		width: 33%;

	}

	.audio_player .audio_player_presets button {
		height: 80px !important;
		width: 99.9% !important;
    	margin: 0 !important;
		display: initial;
		border-left: 2px solid #d9d9d9;
		border-bottom:1px solid #d9d9d9;
		
	}
	
		
	
	.audio_player_type, .audio_player .audio_player_presets, 
	.audio_player_progress-bar {
	 display:inline-block;	
	}

	

}