#audioplayer{
    width: 20em;
    height: 3.1em;
    border:#00457e solid;
    margin-bottom:1em;
    
}

#pButton{
    margin-top:-0.2em;
    height:3em; 
    width: 3em;
    border: none;
    background-size: 50% 50%;
    background-repeat: no-repeat;
    background-position: center;
    float:left;
    outline:none;
}

.play{
    background: url('../img/play.png') ;
}
.pause{
    background: url('../img/pause.png') ;
}

#timeline{
    width: 15em;
    height: 1em;
    margin-top: 0.9em;
    float: left;
    border-radius: 15px;
    background: rgba(0,0,0,.3);
  
}
#playhead{
    width: 1em;
    height: 1em;
    border-radius: 50%;
    background: #00457e;

}

@media only screen and (max-width: 767px) { 
    #audioplayer{
        max-width:100%; 
    }   
    
    #timeline{ 
        max-width:65%;
    }
    

}