.player-container {
	/*display: flex;*/
	flex: 0 0 auto;
	align-items: center;
	color: #999;
  z-index: 500;
}
.mubert-player {
  display: flex;
  flex-direction: row;
  flex: 0 0 auto;
  align-items: center;
  height: 60px;
  background-color: #fff;
  z-index: 500;
}
.mubert-player__stream-avatar {
  margin: 0 0 0 30px;
  background-color: #232323;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: none;
}
.mubert-player__controls {
  display: flex;
  flex: 0 0 auto;
  flex-direction: row;
  width: 120px;
  height: 60px;
  margin-left: 10px;
  align-items: center;
}
.mubert-player__play {
  height: 30px;
  width: 30px;
  margin: 0 5px;
  background-image: url('images/player/play_2-play.svg');
  background-size: 50px;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
}
.mubert-player__play:hover {
  opacity: 1;
  cursor: pointer;
}
.mubert-player__play.pause {
  background-image: url('images/player/play_1-pause.svg');
  background-size: 50px;
  opacity: 1;
}
.mubert-player__play.pause:hover {
  opacity: 1;
  cursor: pointer;
}
.mubert-player__play.loading {
  background-image: url(./images/mubert/uploader.loading.svg);
  background-size: 20px 10px;
  opacity: 1;
}
.mubert-player__play.loading:hover {
  background-image: url(./images/mubert/uploader.loading.svg);
  opacity: 1;
  cursor: pointer;
}
.mubert-player__reload {
  height: 30px;
  width: 30px;
  margin: 0 5px;
  background-image: url('images/player/play_3-reload.svg');
  background-size: 50px;
  background-repeat: no-repeat;
  background-position: center;
}
.mubert-player__reload:hover {
  opacity: 1;
  cursor: pointer;
}
.mubert-player__like {
  height: 30px;
  width: 30px;
  margin: 0 5px;
  background-image: url('images/player/play_7-like.svg');
  background-size: 62px;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
}
.mubert-player__like:hover {
  opacity: 1;
  cursor: pointer;
}
.mubert-player__stream-title {
  flex: 1 1 auto;
  font-size: 13px;
  line-height: 60px;
  height: 60px;
  font-family: 'Supply';
  font-weight: 400;
  font-size: 12px;
  color: #131313;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0 0 0 20px;
  text-transform: uppercase;
  cursor: default;
  
}
.mubert-player__tools {
  flex: 0 0 auto;
  background: #c9cad0;
  width: 34px;
  height: 34px;
  border-radius: 5px;
  margin: 0 5px;
}
.mubert-player__tools.enabled {
  opacity: 1;
}
.mastering {
  background: url(./images/mastering.png);
  background-repeat: no-repeat;
  background-size: 34px;
  background-position: center;
  opacity: .4;
}
.mastering:hover {
  cursor: pointer;
}
.mubert-player__volume {
  display: flex;
  align-self: stretch;
  align-items: center;
  -webkit-appearance: none;    
  width: auto;
  margin-left: auto;
}
.mubert-player__volume-icon {
  background-image: url('images/player/play_4-full.svg');
  background-repeat: no-repeat;
  background-position: center;
  width: 30px;
  height: 30px;
  margin: 0 10px;
  opacity: 1;
  background-size: 50px;
  opacity: 1;
}
.mubert-player__volume-icon.mute {
  background-image: url('images/player/play_6-mute.svg');
  background-size: 50px;
}
.mubert-player__volume-icon:hover {
  opacity: 1;
  cursor: pointer;
}
.mubert-player__volume-input {
  -webkit-appearance: none;
  width: 100%;
  background: transparent;
  cursor: pointer;
      margin-right: 20px;
}
.mubert-player__volume-input:focus {
  outline: none;
}
.mubert-player__volume-input::-ms-track {
  width: 100%;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
.mubert-player__volume-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  background-color: #131313;
  height: 13px;
  width: 13px;
  border-radius: 50%;
  margin-top: -6px;
  padding: 7px;
  
 }
.mubert-player__volume-input:hover::-webkit-slider-thumb {
  background-color: #000 ;
}
.mubert-player__volume-input::-moz-range-thumb {
  background-color: #131313;
  height: 13px;
  width: 13px;
  border-radius: 50%;
}
.mubert-player__volume-input:hover::-moz-range-thumb {
  background-color: #232323;
}
.mubert-player__volume-input::-ms-thumb {
  background-color: #131313;
  height: 13px;
  width: 13px;
  border-radius: 50%;
}
.mubert-player__volume-input:hover::-ms-thumb {
  background-color: #232323;
}
.mubert-player__volume-input::-webkit-slider-runnable-track {
  height: 1px;
  border-radius: 10px;
  background-color: #aaa;
}
.mubert-player__volume-input:hover::-webkit-slider-runnable-track {
  background-color: #999;
}

.mubert-player__logo {
  display: none;
  /*background-image: url('assets/icons/m.logo.svg');*/
  background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDMwMCA1MC43IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzMDAgNTAuNzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8Zz4KCTxwYXRoIGQ9Ik0xOS4yLDM4LjZ2MTEuMUgwVjBjNi4xLDAsMTIuNiwwLDE4LjcsMGw5LjksMTQuMkwzOC42LDBjNiwwLDEyLjYsMCwxOC43LDB2NDkuN0gzOC4yVjM4LjZsMC4xLTExLjVMMzIsMzguNmgtNi44TDE5LjMsMjcKCQlMMTkuMiwzOC42eiI+PC9wYXRoPgoJPHBhdGggZD0iTTg2LjEsMzQuOWMxLjgsMCwzLjUtMSwzLjUtMy4xVjBIMTA5djMxLjhjLTAuMSwxMi45LTExLjMsMTguOS0yMi45LDE4LjlzLTIyLjktNi0yMi45LTE4LjlWMGgxOS41djMxLjcKCQlDODIuNywzMy43LDg0LjQsMzQuOSw4Ni4xLDM0Ljl6Ij48L3BhdGg+Cgk8cGF0aCBkPSJNMTQ2LjIsMGM3LjQsMCwxMy4zLDYuMiwxMy4xLDEzLjZjLTAuMSw0LTIuMiw3LjctNi4xLDljNS45LDIuMyw5LDYuMSw4LjcsMTIuNmMtMC40LDguNS03LDE0LjQtMTUuOCwxNC40aC0zMS4yVjBIMTQ2LjJ6CgkJIE0xMzQuMiwxOC41aDMuNmMzLjMsMCwzLjUtNS4yLDAtNS4yaC0zLjZWMTguNXogTTEzNC4yLDM2LjFoNC44YzIuNSwwLDMuNS0xLjYsMy41LTMuMWMwLTEuNi0xLTMuMS0zLjUtMy4xaC00LjhWMzYuMXoiPjwvcGF0aD4KCTxwYXRoIGQ9Ik0xNjUuMywwYzEzLjMsMCwyNi42LDAsMzkuOCwwdjE0LjZoLTIwLjVWMThoMTkuN3YxMy44aC0xOS43djMuM2gyMC41djE0LjZjLTEzLjMsMC0yNi42LDAtMzkuOCwwVjB6Ij48L3BhdGg+Cgk8cGF0aCBkPSJNMjI5LjcsMzYuNXYxMy4yYy02LjUsMC0xMi45LDAtMTkuNCwwVjBjOC4xLDAsMTMuNCwwLDIxLjQsMGMxMi40LDAuMSwyNC40LDMuNSwyNC40LDE4LjNjMCw3LjItMi45LDExLjgtNy4zLDE0LjUKCQlsOC4xLDE1LjN2MS42aC0xOS41bC02LjMtMTMuMkMyMzEuMSwzNi41LDIyOS43LDM2LjUsMjI5LjcsMzYuNXogTTIzMi4yLDIxLjZjMy4yLTAuMSw0LjctMC45LDQuNy0zLjNjMC0yLjMtMS41LTMuNC00LjctMy40aC0yLjcKCQl2Ni43QzIyOS41LDIxLjYsMjMyLjIsMjEuNiwyMzIuMiwyMS42eiI+PC9wYXRoPgoJPHBhdGggZD0iTTI3MC4xLDQ5LjdWMTUuNWgtMTAuNlYwSDMwMHYxNS41aC0xMC42djM0LjJIMjcwLjF6Ij48L3BhdGg+CjwvZz4KPC9zdmc+);
  background-size: 100px;
  background-position: center;
  background-repeat: no-repeat;
  width: 140px;
  align-self: stretch;
}


@media only screen and ( max-width : 750px ) {
	
	.mubert-player__logo {
		background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDYwIDYwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA2MCA2MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOm5vbmU7c3Ryb2tlOiMwMDAwMDA7c3Ryb2tlLXdpZHRoOjM7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fQo8L3N0eWxlPgo8Y2lyY2xlIGNsYXNzPSJzdDAiIGN4PSIzMCIgY3k9IjMwIiByPSIxNSI+PC9jaXJjbGU+Cjwvc3ZnPg==);
		background-size: 50px;
		width: 60px;
		display: none;
	}
	
	.mubert-player__volume {
		width: auto;
	}
	
	.mubert-player__volume-input {
		display: none; 
	}
	
}