Background Video

<?php
//Id of youtube video
$YVideoId = "KPkKXnOMwxQ";//https://www.youtube.com/watch?v=KPkKXnOMwxQ

?>
	<style>
		iframe {
			width: 100%;
			height: 100%;
			min-width: 1280px;
			min-height: 720px;
			margin-top: -100px;
			margin-left: calc(50% - 640px);
		}
	</style>
	<div id="player" style="position:fixed; z-index: -99; width: 100vw; height: 100vh; top:0px;left:0px;"></div>
	<script>
		var tag = document.createElement('script');
		tag.src = "http://www.youtube.com/player_api";
		var firstScriptTag = document.getElementsByTagName('script')[0];
		firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
		var player;

		function onYouTubePlayerAPIReady() {
			player = new YT.Player('player', {
				playerVars: {
					'autoplay': 1,
					'controls': 0,
					'showinfo': 0,
					'autohide': 1,
					'nosound': 1,
					'rel': 0,
					'controls': 0,
					'showinfo': 0,
					'loop': 1,
					'rel': 0,
					'enablejsapi': 1,
					'autoplay': 1,
					'controls': 0,
					'showinfo': 0,
					'loop': 1,
					'iv_load_policy': 3
				},
				videoId: '<?=$YVideoId;?>',
				events: {
					'onReady': onPlayerReady
				}
			});
		}

		function onPlayerReady(event) {
			event.target.mute();
		}
	</script>
	<div style="position:fixed; z-index: -99; width: 100vw; height: 100vh; top:0px;left:0px;background: rgba(0,0,0,0);z-index:10;">
	</div>