Untitled

<!DOCTYPE html
<html>
	<head>
		<title>Cool Background</title>

		<style type="text/css">

			* {
				margin: 0;
				padding: 0;
			}

			body {
				font-family: Calibri, sans-serif;
			}

			.backgroud-wrap {
				position: fixed;
				z-index: -1000;
				width: 100%;
				height: 100%;
				overflow: hidden;
				top: 0;
				left: 0;
			}

			#video-bg-elem {
				position: absolute;
				top: 0;
				left: 0;
				min-height: 100%;
				min-width: 100%;
			}

			.content {
				position: absolute;
				width: 100%;
				min-height: 100%;
				z-index: 1000;
				background-color: rgba(0,0,0,0.7);
			}
			.content h1{
				text-align: center;
				font-size: 65px;
				text-transform: uppercase;
				font-weight: 300;
				color: #fff;
				padding-top: 15%;
				margin-bottom: 10px;
			}
			.content p {
				text-align: center;
				font-size: 20px;
				letter-spacing: 3px;
				color: #aaa;
			}


		</style>


	</head>
	<body>
		<div class = "backgroud-wrap">

			<video id="video-bg-elem" preload="auto" autoplay="true" loop="loop" muted="muted">
				<source src="sarma.mp4" type="video/mp4">
				Video not supported
			</video>

		</div>

		<div class="content">

			<h1>Test</h1>
			<p>This is a test</p>
		</div>


	</body>
</html>