/*___________________________________________________________________________________________________________________________________________________
 _ jquery.mb.components                                                                                                                             _
 _                                                                                                                                                  _
 _ file: miniplayer.css                                                                                                                             _
 _ last modified: 05/06/15 20.22                                                                                                                    _
 _                                                                                                                                                  _
 _ Open Lab s.r.l., Florence - Italy                                                                                                                _
 _                                                                                                                                                  _
 _ email: matteo@open-lab.com                                                                                                                       _
 _ site: http://pupunzi.com                                                                                                                         _
 _       http://open-lab.com                                                                                                                        _
 _ blog: http://pupunzi.open-lab.com                                                                                                                _
 _ Q&A:  http://jquery.pupunzi.com                                                                                                                  _
 _                                                                                                                                                  _
 _ Licences: MIT, GPL                                                                                                                               _
 _    http://www.opensource.org/licenses/mit-license.php                                                                                            _
 _    http://www.gnu.org/licenses/gpl.html                                                                                                          _
 _                                                                                                                                                  _
 _ Copyright (c) 2001-2015. Matteo Bicocchi (Pupunzi);                                                                                              _
 ___________________________________________________________________________________________________________________________________________________*/

@charset "UTF-8";
.mbMiniPlayer .map_controls, .mbMiniPlayer .playerTable span.map_volumeLevel {
  overflow: hidden;
  white-space: nowrap
}

@font-face {
  font-family: mb_audio_fontRegular;
  src: url(font/mbAudioFont/mbaudio_font.eot);
  src: local('?'), url(font/mbAudioFont/mbaudio_font.woff) format('woff'), url(font/mbAudioFont/mbaudio_font.ttf) format('truetype'), url(font/mbAudioFont/mbaudio_font.svg#webfontywr4YLri) format('svg');
  font-weight: 400;
  font-style: normal
}

@font-face {
  font-family: DroidSansMonoRegular;
  src: url(font/DroidSansMono/DroidSansMono.eot);
  src: local('?'), url(font/DroidSansMono/DroidSansMono.woff) format('woff'), url(font/DroidSansMono/DroidSansMono.ttf) format('truetype'), url(font/DroidSansMono/DroidSansMono.svg#webfontGzFJ3WpO) format('svg');
  font-weight: 400;
  font-style: normal
}

.map_params {
  display: none !important
}

a.audio {
  display: none
}

.mbMiniPlayer:focus {
  outline: 0
}

.mbMiniPlayer * {
  box-sizing: content-box
}

.jp-progress, .mbMiniPlayer * {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box
}

.mbMiniPlayer {
  vertical-align: baseline !important
}

.mbMiniPlayer span {
  font-family: mb_audio_fontRegular !important;
  font-size: 20px;
  line-height: 20px !important
}

.mbMiniPlayer .playerTable, .mbMiniPlayer .playerTable > div {
  vertical-align: middle;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important
}

.mbMiniPlayer .playerTable {
  -moz-border-radius: 5px !important;
  -webkit-border-radius: 8px !important;
  border-radius: 5px !important;
  border: 1px solid #fff !important;
  color: #777;
  background: #fff;
  width: auto !important;
  display: inline-block
}

.mbMiniPlayer:focus .playerTable {
  box-shadow: 0 0 5px rgba(93, 146, 192, .8) !important
}

.mbMiniPlayer.shadow .playerTable {
  -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .4);
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .4);
  box-shadow: 0 0 3px rgba(0, 0, 0, .4)
}

.mbMiniPlayer .playerTable > div {
  border: none !important;
  display: table-cell
}

.jp-progress {
  position: relative;
  background-color: #fff;
  height: 8px;
  margin: 0 2px 2px;
  top: -2px;
  box-sizing: content-box;
  cursor: pointer
}

.jp-load-bar {
  background-color: #e9e6e6;
  box-sizing: content-box
}

.jp-load-bar, .jp-play-bar {
  height: 6px;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box
}

.jp-play-bar {
  background-color: #000;
  box-sizing: content-box
}

.mbMiniPlayer div.map_controlsBar {
  background-color: #ccc;
  background-image: -ms-linear-gradient(bottom, #FFF 0, #FFF 60%, #DBDBDB 100%);
  background-image: -moz-linear-gradient(bottom, #FFF 0, #FFF 60%, #DBDBDB 100%);
  background-image: -o-linear-gradient(bottom, #FFF 0, #FFF 60%, #DBDBDB 100%);
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFF), color-stop(.6, #FFF), color-stop(1, #DBDBDB));
  background-image: -webkit-linear-gradient(bottom, #FFF 0, #FFF 60%, #DBDBDB 100%);
  background-image: linear-gradient(to top, #FFF 0, #FFF 60%, #DBDBDB 100%);
  margin: 0;
  padding: 0;
  cursor: default !important;
  box-shadow: inset 1px 1px 2px #999;
  -moz-box-shadow: inset 1px 1px 3px #999;
  -webkit-box-shadow: inset 1px 1px 2px #999
}

.mbMiniPlayer .map_controls {
  position: relative;
  margin: 1px;
  display: none;
  width: 1px;
  height: 100%
}

.mbMiniPlayer .playerTable span {
  margin: 0 !important;
  display: inline-block !important;
  padding: 3px !important;
  height: 20px !important;
  color: #fff;
  text-align: center !important;
  text-transform: none !important;
  vertical-align: middle
}

.mbMiniPlayer.gradientOverlay .playerTable span {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .3) 0, transparent 100%) !important
}

.mbMiniPlayer .playerTable span.map_title * {
  box-sizing: border-box
}

.mbMiniPlayer .playerTable span.map_title {
  position: relative;
  color: #333;
  font: 10px/12px DroidSansMonoRegular, sans-serif !important;
  text-shadow: none !important;
  letter-spacing: 0 !important;
  width: 100% !important;
  height: 17px !important;
  top: -2px !important;
  background: 0 0 !important;
  text-align: left !important;
  cursor: default !important;
  text-overflow: ellipsis;
  overflow: hidden;
  box-sizing: border-box
}

.mbMiniPlayer .map_info {
  display: none;
  background: #303030;
  color: #D1D1D1;
  padding: 1px 4px;
  position: absolute;
  z-index: 10
}

.mbMiniPlayer .playerTable span.map_rew {
  cursor: pointer !important
}

.mbMiniPlayer .playerTable span.map_volumeLevel a {
  position: relative !important;
  display: inline-block !important;
  margin: 0;
  border-right: 1px solid rgba(0, 0, 0, .4);
  width: 2px;
  padding: 0;
  background-color: #fff;
  height: 0;
  vertical-align: middle !important;
  opacity: .1;
  cursor: pointer !important
}

.mbMiniPlayer .playerTable span.map_volumeLevel a:hover {
  opacity: 1 !important
}

.mbMiniPlayer .playerTable span.map_time {
  width: 1px;
  font: 11px/20px DroidSansMonoRegular, sans-serif !important;
  overflow: hidden;
  white-space: nowrap;
  cursor: default !important;
  text-shadow: 1px -1px 1px rgba(0, 0, 0, .6) !important
}

.mbMiniPlayer .playerTable span.map_play {
  border-radius: 0 4px 4px 0 !important;
  cursor: pointer !important
}

.mbMiniPlayer[isplaying=true] .playerTable span.map_play {
  -webkit-animation: playing .7s infinite alternate;
  animation: playing .7s infinite alternate
}

@keyframes playing {
  from {
    opacity: 1
  }
  to {
    opacity: .5
  }
}

@-webkit-keyframes playing {
  from {
    opacity: 1
  }
  to {
    opacity: .5
  }
}

@-moz-keyframes playing {
  from {
    opacity: 1
  }
  to {
    opacity: .5
  }
}

.mbMiniPlayer .playerTable span.map_volume {
  border-radius: 4px 0 0 4px !important;
  cursor: pointer !important;
  padding-left: 6px !important;
  padding-right: 0 !important
}

.mbMiniPlayer .copy {
  font: 10px/12px DroidSansMonoRegular, sans-serif !important;
  color: #e0e0e0;
  padding-left: 10px;
  display: none
}

.mbMiniPlayer a.map_download, .mbMiniPlayer span.map_download {
  vertical-align: middle !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 5px !important;
  font-family: mb_audio_fontRegular !important;
  font-size: 50px !important;
  line-height: 22px !important;
  color: rgba(0, 0, 0, .2)
}

.mbMiniPlayer span.map_download {
  transition: color 1s;
  -moz-transition: color 1s;
  -webkit-transition: color 1s;
  -o-transition: color 1s
}

.mbMiniPlayer a.map_download {
  text-decoration: none;
  transition: color 1s;
  -moz-transition: color 1s;
  -webkit-transition: color 1s;
  -o-transition: color 1s
}

.mbMiniPlayer.black .playerTable span {
  background-color: #333
}

.mbMiniPlayer.black .playerTable span.map_play {
  border-left: 1px solid #000
}

.mbMiniPlayer.black .playerTable span.map_volume {
  border-right: 1px solid #333
}

.mbMiniPlayer.black .playerTable span.map_volume.mute {
  color: rgba(255, 255, 255, .5)
}

.mbMiniPlayer.black .map_download:hover {
  color: #000
}

.mbMiniPlayer.black .jp-load-bar {
  background-color: rgba(0, 0, 0, .1)
}

.mbMiniPlayer.black .jp-play-bar {
  background-color: #000
}

.mbMiniPlayer.gray .playerTable span {
  background-color: #ccc
}

.mbMiniPlayer.gray .playerTable span.map_play {
  border-left: 1px solid #9f9f9f
}

.mbMiniPlayer.gray .playerTable span.map_volume {
  border-right: 1px solid #bdbcbc
}

.mbMiniPlayer.gray .playerTable span.map_volume.mute {
  color: rgba(255, 255, 255, .5)
}

.mbMiniPlayer.gray .map_download:hover {
  color: #666
}

.mbMiniPlayer.gray .jp-load-bar {
  background-color: rgba(102, 102, 102, .2)
}

.mbMiniPlayer.gray .jp-play-bar {
  background-color: #9f9f9f
}

.mbMiniPlayer.blue .playerTable span {
  background-color: #09f
}

.mbMiniPlayer.blue .playerTable span.map_play {
  border-left: 1px solid #034383
}

.mbMiniPlayer.blue .playerTable span.map_volume {
  border-right: 1px solid #18a2fe
}

.mbMiniPlayer.blue .playerTable span.map_volume.mute {
  color: rgba(255, 255, 255, .5)
}

.mbMiniPlayer.blue .map_download:hover {
  color: #09f
}

.mbMiniPlayer.blue .jp-load-bar {
  background-color: rgba(0, 153, 255, .1)
}

.mbMiniPlayer.blue .jp-play-bar {
  background-color: #09f
}

.mbMiniPlayer.orange .playerTable span {
  background-color: #f90
}

.mbMiniPlayer.orange .playerTable span.map_play {
  border-left: 1px solid #8c5002
}

.mbMiniPlayer.orange .playerTable span.map_volume {
  border-right: 1px solid #fea827
}

.mbMiniPlayer.orange .playerTable span.map_volume.mute {
  color: rgba(255, 255, 255, .5)
}

.mbMiniPlayer.orange .map_download:hover {
  color: #f90
}

.mbMiniPlayer.orange .jp-load-bar {
  background-color: rgba(255, 153, 0, .2)
}

.mbMiniPlayer.orange .jp-play-bar {
  background-color: #f90
}

.mbMiniPlayer.red .playerTable span {
  background-color: #900
}

.mbMiniPlayer.red .playerTable span.map_play {
  border-left: 1px solid #5f0000
}

.mbMiniPlayer.red .playerTable span.map_volume {
  border-right: 1px solid #900
}

.mbMiniPlayer.red .playerTable span.map_volume.mute {
  color: rgba(255, 255, 255, .5)
}

.mbMiniPlayer.red .map_download:hover {
  color: #900 !important
}

.mbMiniPlayer.red .jp-load-bar {
  background-color: rgba(153, 0, 0, .21)
}

.mbMiniPlayer.red .jp-play-bar {
  background-color: #900
}

.mbMiniPlayer.green .playerTable span {
  background-color: #390
}

.mbMiniPlayer.green .playerTable span.map_play {
  border-left: 1px solid #360
}

.mbMiniPlayer.green .playerTable span.map_volume {
  border-right: 1px solid #38a700
}

.mbMiniPlayer.green .playerTable span.map_volume.mute {
  color: rgba(255, 255, 255, .5)
}

.mbMiniPlayer.green .map_download:hover {
  color: #390 !important
}

.mbMiniPlayer.green .jp-load-bar {
  background-color: rgba(51, 153, 0, .2)
}

.mbMiniPlayer.green .jp-play-bar {
  background-color: #390
}

.map_pl_container {
  margin: 10px 0;
  padding-left: 5px;
  border-left: 3px dotted rgba(0, 0, 0, .1)
}

.map_pl_container .pl_items_container {
  max-height: 300px;
  overflow: hidden;
  overflow-y: auto;
  width: 99%
}

.map_pl_container .pl_item {
  position: relative;
  margin: 5px 0;
  padding: 5px;
  border-bottom: 1px dotted #ccc;
  font: 14px/14px DroidSansMonoRegular, sans-serif !important;
  display: block
}

.map_pl_container .pl_item:hover {
  color: #999
}

.map_pl_container .pl_item span.map_download {
  position: absolute;
  right: 5px;
  top: 2px;
  display: block !important;
  vertical-align: middle !important;
  margin: 0 !important;
  padding: 0 2px !important;
  font-family: mb_audio_fontRegular !important;
  font-size: 34px !important;
  line-height: 22px !important;
  color: rgba(0, 0, 0, .2);
  transition: color 1s;
  -moz-transition: color 1s;
  -webkit-transition: color 1s;
  -o-transition: color 1s
}

.map_pl_container .pl_item span.map_download:hover {
  color: rgba(0, 0, 0, .8);
  transition: color .5s;
  -moz-transition: color .5s;
  -webkit-transition: color .5s;
  -o-transition: color .5s
}

.map_pl_container .pl_item.sel {
  color: #666;
  background: rgba(0, 0, 0, .1);
  border-radius: 8px
}

.map_album_infobox {
  margin-bottom: 10px
}

.map_item_title {
  font-weight: 600
}

.map_item_album {
  font-style: italic
}

.map_item_artist {
  display: block
}