
#audio1{display:none;}
a:link,a:hover,a:active{border:none;text-decoration:none;outline:none;}
img{border:none;}

#content_player_html{width:100%; background:white;margin:0 auto;margin-bottom:50px; margin-top:5%;padding-bottom:50px; border:2px solid black}

#content_player_html_2{}

.bouton_play{display:block; background:url('../img/bg_menu.png') no-repeat 10px center #5C5C5C; padding-left: 45px; text-transform:uppercase; color:white;position:relative; margin:45px auto;height:35px; width:115px;padding-top:12px;}
.alignement{display:inline-block; vertical-align:top;}

/*page_player*/
#player{position:relative;width:100%; height:100%;}
#player h1{width:100%; height:70px; background:black; text-align:center; color:#b81b24;padding-top:22px; font-size:24px; }

#content_player {
position:relative;
width:100%; 
padding-top:10px;
padding-left:30px;
padding-right:30px;
}


#cwrap {
position:relative;
width:100%; 
}

#cwrap h2{display:block; height:35x; width:115px; padding:10px; background:black; color:#b81b24; font-size:14px; text-align:center;text-transform:uppercase;}

#content_top{width:100%; height:100px; text-align:center;}
#nowPlay{display:inline-block; text-align:center;color:black; text-transform:uppercase;}
#nowPlay h3{font-size:100px;font-family: 'NHaasGroteskDSPro-25Th';}

#player_but{position:relative; z-index:80;text-align:center;width:300px; margin:0 auto;}
#extraControls {  position:relative;width:100%;  left:0; height:70px;padding-top:5px;}


#btnPrev.ctrlbtn {
width: 52px;
height:52px; 
background:url('../img/prev_3.png') no-repeat left 17px;
cursor: pointer;
border:none;
z-index:80;outline:none;}

#btnNext.ctrlbtn {
width: 52px;
height:52px;  
background:url('../img/next_3.png') no-repeat right 17px ;
cursor: pointer;
border:none;
z-index:80;outline:none;}



#btnPrev2.ctrlbtn2 {
width: 52px;
height:52px; 
background:url('../img/prev_3.png') no-repeat left center;
cursor: pointer;
border:none;
z-index:80;outline:none;}

#btnNext2.ctrlbtn2{
width: 52px;
height:52px;  
background:url('../img/next_3.png') no-repeat right center ;
cursor: pointer;
border:none;
z-index:80;outline:none;}




#audiowrap { width:100%; position:relative; left:90px;top:-25px; text-align: center;z-index:3;}

#npTitle {
text-align:left;
font-family:'arial';
font-size:12px;

display:block; 
width:100%;
padding-left:10px; padding-right:10px;
margin:0 auto;
margin-bottom:10px;
}



#plwrap {
font-size: 16px;
width:100%;
max-height:400px;
color:black;
margin-top:30px;
padding-top:15px;
padding-bottom:15px; 
padding-right:10px;
overflow-y: hidden;overflow:auto;
font-family: 'NHaasGroteskDSPro-25Th'!important;

}

#cache{width:100%;  height:50px;}


.alignement_player{display:inline-block;vertical-align:top;}
.alignement_vol{display:inline-block;vertical-align:bottom;}
a{text-decoration:none;}
audio.audio {}

.no-audio {display: none;}


#plUL {list-style: none;	margin: 0;}
#plUL li {
cursor: pointer;

font-size:20px;
text-align:left;

}

#plUL {list-style: none;	margin: 0;}


#plUL li:hover {color:#ff1c20;}
}

p.plus10 {padding-left: 10px;}

.plHead, .plItem {position: relative;background:transparent; width:90%;}

.plHead {text-align: center;}

.plHeadTitle, .plTitle {
position: absolute;
top: 0;
right: 5px;
left: 60px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align:left;

}

.plHeadNum, .plNum {width: 25px;padding-left:5px;}

.plHeadNum, .plNum, .plLength {text-align: center;}


.plHeadLength, .plLength { 
position: absolute;
top: 0;
right: 5px;
width: 60px;}

.plSel, .plSel:hover {
cursor: default !important;
color:#ff1c20;
padding-bottom:3px;
}




.is-audio, #audio0 {
	/*display: none;*/
}

.js.audio .is-audio {
	display: block;
	
}

.js #audio0 {
	display: block;
}


[class^="icon-"],[class*=" icon-"] {   display: inline-block;  width: 21px;  height: 18px;  margin-top: 1px;  margin-right: 3px;  line-height: 14px; vertical-align: text-top;  background:black;  background-position: center center;  background-repeat: no-repeat;}

.icon-play {background:url('../img/play_3_03_2.png') no-repeat center center;  background-size:57% auto; height:55px; width:52px;}
.icon-pause {background:url('../img/pause_3.png') no-repeat left center;  background-size:57% auto; height:52px; width:52px;}
.icon-stop {background:url('../img/stop_3.png') no-repeat right center;  background-size:57% auto; height:52px; width:52px;}

.icon-volume-down{background:url('../img/down_03.png') no-repeat 3px bottom; height:19px; width:23px;opacity:0.8;}
.icon-volume-up{background:url('img/up_03.png') no-repeat right bottom; height:19px; width:23px;opacity:0.8;}

.icon-volume-down:hover{background:url('../img/down_03.png') no-repeat 3px bottom; height:19px; width:23px;opacity:1;}
.icon-volume-up:hover{background:url('../img/up_03.png') no-repeat right bottom; height:19px; width:23px;opacity:1;}

 .volume {width:100%; position:relative; height:35px;text-align:center;padding-top:6px;background:black;}
 .volume > .slider{position:relative;top:0;border-radius:5px;background:black;border:1px solid #5c5c5c; width:90px;height:10px;display:inline-block;}
 .volume > .slider > .knob{position:absolute;top:0;left:0;background:white;border-radius:10px; width:8px; height:8px;cursor:pointer;}
 
 
 @media (max-width:450px){
	 



#content_top{width: 95%;
height: 80px;
margin-top:-35px;
text-align: center;
}
#nowPlay h3{font-size:94px;font-family: 'NHaasGroteskDSPro-25Th'}
#plUL li{font-size:16px;}	 

.icon-play {background:url('../img/play_3_03_2.png') no-repeat center center; background-size:65% auto; height:35px; width:35px;}
.icon-pause {background:url('../img/pause_3.png') no-repeat left center;background-size:65% auto; height:35px; width:35px;}
.icon-stop {background:url('../img/stop_3.png') no-repeat right center;background-size:65% auto; height:35px; width:35px;}

#content_player {
position:relative;
width:100%; 
padding-top:10px;
padding-left:0px;
padding-right:0px;
}

#btnPrev.ctrlbtn {

background:url('../img/prev_3.png') no-repeat left 10px;
cursor: pointer;
border:none;
z-index:80;outline:none;
background-size:65% auto; height:35px; width:35px;}

#btnNext.ctrlbtn {

background:url('../img/next_3.png') no-repeat right 10px;
cursor: pointer;
border:none;
z-index:80;outline:none;
background-size:65% auto; height:35px; width:35px;}

#extraControls{width:100%!important;}
#player_but{width:100%!important;}


.plHeadTitle, .plTitle {
position: absolute;
top: 0;
right: 5px;
left: 40px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align:left;

}


	 
 }

