.play { display: block; outline: none; cursor: pointer; }
.pause { display: none; outline: none; cursor: pointer; }

.playing .play { display: none; }
.playing .pause { display: block; }


.buffer { display: none; opacity: .2; }

.buffering .pause { display: none; }
.buffering .buffer { display: block; }


.previous { display: block; outline: none; cursor: pointer; }
.next { display: block; outline: none; cursor: pointer; }

.previous_disabled .previous { opacity: .1; cursor: default; }
.next_disabled .next { opacity: .1; cursor: default; }
.buttons { display: inline-block; margin-right: 20px; }
.buttons .main_button{
  padding: 0px 5px;
}
.scrubber{  width: 170px;}
.scrubber.max{ width: 580px}



/* -- SCRUBBER: -------------------------------------------------------------------------------; */


.controller .scrubber {
  display: inline-block;
  outline: none;
  cursor: pointer;
  position: relative;
  height: 16px;
  background-color: rgba(0,0,0,.2);
  overflow: hidden;
  -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
  -moz-box-shadow: 0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
  -ms-box-shadow: 0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
  box-shadow: 0 1px 0 rgba(255,255,255,.03),inset 0 1px 0 rgba(0,0,0,.1);
}


.scrubber .loaded {
  position: absolute;
  width: 50%;
  float: left;
  height: 100%;
  background-color: rgba(255,255,255,.1);
}

.scrubber .loaded .animation {
  position: absolute;
  width: 100%;
  height: 100%;
  background: url(../../images/widgets/kbal_player/animation.gif) top left repeat-x;
  opacity: .1;
}


.scrubber .played {
  position: absolute;
  width: 25%;
  height: 100%;
  margin-right: -50px;
  background-image: linear-gradient(bottom, rgb(58,113,165) 0%, rgb(77,162,223) 100%);
  background-image: -o-linear-gradient(bottom, rgb(58,113,165) 0%, rgb(77,162,223) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(58,113,165) 0%, rgb(77,162,223) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(58,113,165) 0%, rgb(77,162,223) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(58,113,165) 0%, rgb(77,162,223) 100%);
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(58,113,165)), color-stop(1, rgb(77,162,223)));
  -webkit-box-shadow: inset 0 10px 0 rgba(255,255,255,.1);
  -moz-box-shadow: inset 0 10px 0 rgba(255,255,255,.1);
  -ms-box-shadow: inset 0 10px 0 rgba(255,255,255,.1);
  box-shadow: inset 0 10px 0 rgba(255,255,255,.1);
}

.song_details{
  display: inline-block;
}
.song_details .title{
  font-size: 18px;
  font-family: "HelveticaNeue-CondensedBold", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  margin-bottom: 5px;
}
.song_details .volume{
  display: inline-block;
  width: 35px;
  height: 3px;
  background: none;
  background-color: #d7d7d7;
  top: -6px;
  margin-left: 20px;
}
.song_details .ui-slider-handle{
  width: 4px;
  top: -6px;
  height: 14px;
  background: none;
  background-color: #2d83c7;
  margin-left: -3px;
}