/* Lecteur audio */

.haudio, .audio {
margin:25px 0;
text-align: left;
line-height:1.5em;
width:auto;
padding:4px 15px 16px 20px;
background:#eeeeee;	
border-radius:30px;
}

.audio:after {
clear:both;
}

.lecture{
float:left;
}

.controles{
float:left;
margin-left: 15px;
width:80%;
}

.controles .track.sans_titre{
height:1em;
}

.controles .track {
margin: 0 0 5px 0;
font-family:helvetica,arial,sans-serif;
}

.controles .descriptif{
text-align: left;
line-height:1em;
font-size:small;
}

.controles .lesinfos {
font-size: 13px;
line-height: 1.3em;
margin: 0 0 10px 75%;
color:#999999;
}
.controles .lesinfos .file {
display:none;
}

.time, .duration, .file{
display:inline;
font-family:helvetica,arial,sans-serif;
}

.progress_bar{
float:left;
height:15px;
width:70%;
position:relative;
border-radius:0;
border:0;
padding:0;
background:#ffffff;
cursor:pointer;
}

.progress_bar .position{
background:#990000;
height: 15px;
position: absolute;
width:0px;
}

.ui-progressbar-value{
position:absolute;
height: 15px;
}

.progress_bar .loading{
height: 15px;
cursor:pointer;
background:#000000;
width:0px;
}

.controles .ui-widget-header {
margin:0;
background: #333333;
border:0;
border-radius:0;
}

.lecture button.play {
background: #eeeeee;
border:0;
margin:2px 0 0 0;
cursor: pointer;
display: inline-block;
margin-right: 0.1em;
overflow: visible;
padding: 0;
position: relative;
text-align: center;
text-decoration: none !important;
}

.lecture button.play span{
position:relative;
top:auto;
left:auto;
width:45px;
height:41px;
display: block;
overflow: hidden;
text-indent: -99999px;
margin:6px 0 0 0;
}

.lecture button.play .ui-icon-play {
background:url("https://www.entre2morin.fr/plugins/soundmanager/skins/playpause.png") no-repeat 0 0;
}

.lecture button.play:hover .ui-icon-play {
background:url("https://www.entre2morin.fr/plugins/soundmanager/skins/playpause.png") no-repeat -45px 0;
}

.lecture button.play .ui-icon-pause {
background:url("https://www.entre2morin.fr/plugins/soundmanager/skins/playpause.png") no-repeat -90px 0;
}

.lecture button.play:hover .ui-icon-pause {
background:url("https://www.entre2morin.fr/plugins/soundmanager/skins/playpause.png") no-repeat -135px 0;
}

.lecture button.play .ui-button-text {
padding:0;
}


/* #Mobile (Portrait)
================================================== */

/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
   .lecture, .controles, .progress_bar{
   float:none;
   }
   .controles .lesinfos{
   	 margin:10px 0 10px 0%;
   	}
   .controles .track.sans_titre{
   	height:0;
   	}
   	.controles{
   		width:100%;
   	}
   	.haudio, .audio{
   	padding:15px 15px 0px;
   	}
}	