ging/social_stream

@import "jplayer.blue.monday"


#jp_interface_audio_290
  border: none

.jp-progress
  width: 98.5% !important
  border-bottom: 2px solid #444 !important
  border-right: 2px solid #666 !important
  background-color: #333 !important
  div.jp-seek-bar
    background: none
    width: 100%
    border: 2px solid #555
    img
      height: 100%
      width: 100%

    div.jp-play-bar
      background: none $blue

div.jp-current-time
  width: 123px !important
  background-color: rgba(0, 0, 0, .1)
  @include border-radius(8px)
  color: rgba(245, 245, 245, 0.3)
  padding: 0 3px
  border-top: 1px solid #333

div.jp-interface
  border: none !important
  @include gradient-radial ($innerColor: #666, $outerColor: #333)


div.jp-playlist
  border: none

div.jp.audio
  color: #c9c9c9

div.jp.controls
  jp.play,
  jp.pause,
  jp.mute,
  jp.unmute
    margin-left: 10px

div.jp.volume-bar
  margin-left: 6px
  margin-top: 5px
  background: url("jplayer.blue.monday.png") 0 -250 repeat-x
  
  
div.jp-volume-bar-value
  background: url("jplayer.blue.monday.png") 0 -256 repeat-x

.play_over
  margin-top: 16px
  z-index: 30
  position: absolute
  width: 170px
  min-height: 96px
  background: url('jplayer.blue.monday.video.play.png') no-repeat center center
  &:hover
    background: url('jplayer.blue.monday.video.play.hover.png') no-repeat center center


a.jp-play
  background: url("jplayer.blue.monday.png") 0 0 no-repeat
a.jp-pause
  background: url("jplayer.blue.monday.png") 0 -42 no-repeat
a.jp-mute
  background: url("jplayer.blue.monday.png") 0 -186 no-repeat
a.jp-unmute
  background: url("jplayer.blue.monday.png") 0 -170 no-repeat