.play-pause-container {
      border: 0px solid black;
      height: 50px;
      position: absolute;
	  top: 25%;
      left: 50%;
    }
	
  #player-container:hover #play-pause-btn {
    opacity: 1;
  }
  
  #play-pause-btn{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 100; 
	transform: translate(-50%, -50%);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 5px;
    padding: 8px 12px;
    cursor:pointer;
  }
  
  #play-pause-btn-ini{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 100; 
	transform: translate(-50%, -50%);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 5px;
    padding: 8px 12px;
    cursor:pointer;
  }
  
  #fullscreen {
    position: absolute;
    top: 30px;
    right: 60px;
    z-index: 100;
	transform: translate(-50%, -50%);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 5px;
    padding: 8px 12px;
    cursor: pointer;
  }
  
   #btn_restart {
    position: absolute;
    top: 30px;
    left: 50%;
    z-index: 100; 
	transform: translate(-50%, -50%);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 5px;
    padding: 8px 12px;
    cursor: pointer;
  }
  
   #muteButton {
    position: absolute;
    top: 3%;
    right: -1%;
    z-index: 100;
	transform: translate(-50%, -50%);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 5px;
    padding: 8px 12px;
    cursor: pointer;
  }

	#skip-btn {
	position: absolute;
    top: 30px;
    left: 50%;
    z-index: 100; 
	transform: translate(-50%, -50%);
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 5px;
    padding: 8px 12px;
    cursor: pointer;
  }
  
  @media screen and (max-width: 600px) {
   #muteButton{
    top: 90%;
    right: -2%;
  }
  
 
}
  
  
 

