.controls {
	position: absolute;
	overflow:hidden;
	width:80px;
	height: 40px;
	right: 0;
	bottom: 200px;
	padding: 5px;
	text-align: right;
	background-color: #3D9A95;
	visibility: hidden;
	animation: vanboven 0.8s forwards;
	animation-delay: 1s;
	transition: all 1s ease;
}
@keyframes vanboven{
    from {visibility: visible;opacity: 0;bottom: 200px;}
    to{visibility: visible;opacity: 1;bottom: -40px;}
}
.controls.nonactief {visibility: hidden!important;opacity: 0!important;bottom: 200px!important;}
.controls[data-state=hidden] {display:none;}
.controls[data-state=visible] {display:block;}
.controls > * {
	width:30px;
	height:30px;
	display:inline-block;
}
.controls button {
	text-align:center;
	overflow:hidden;
	white-space:nowrap;
  	text-overflow:ellipsis;
  	border:none;
  	cursor:pointer;
  	text-indent:-99999px;
  	background:transparent;
  	background-size:contain;
  	background-repeat:no-repeat;
}
.controls button:hover, .controls button:focus {
	opacity:0.5;
}
.controls button[data-state="play"] {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' width='20' viewBox='0 0 640 640'%3E%3Cpath d='M320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576zM448 320L240 448L240 192L448 320z' fill='%23ffffff' /%3E%3C/svg%3E");
}
.controls button[data-state="pause"] {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' width='20' viewBox='0 0 640 640'%3E%3Cpath d='M320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576zM288 256L288 416L224 416L224 224L288 224L288 256zM416 256L416 416L352 416L352 224L416 224L416 256z' fill='%23ffffff' /%3E%3C/svg%3E");
}
.controls button[data-state="stop"] {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' width='20' viewBox='0 0 640 640'%3E%3Cpath d='M320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576zM416 224L416 416L224 416L224 224L416 224z' fill='%23ffffff' /%3E%3C/svg%3E");}