html, body {position: relative; width: 100%; height: 100%; min-height: 400px;}
body {
	font-family: 'Open Sans', sans-serif;
	font-size: 14pt;
	color: #ccc;
	line-height: 1.5;
	background-color: #000;
}

.bkg {position: absolute; width: 100%; height: 100%; overflow: hidden; z-index: 1;}
.bkg video, .bkg img {width: 100%; min-width: 1000px; height: auto;}
.bkg img {display: none;}
.mobile .bkg video {display: none;}
.mobile .bkg img {display: block;}

.content {position: relative; padding: 2% 4%; z-index: 2;}
h1, h2 {font-weight: 800; font-size: 18pt; margin-bottom: 2.2%;}
p {margin-bottom: 2.2%;}
a {color: #69f; text-decoration: underline;}
a:hover {color: #0ff;}

@media screen and (orientation: portrait) {
	.bkg video, .bkg img {width: auto; height: 100%; min-width: 0px; margin-left: -25%; margin-top: 20%;}
}
@media screen and (orientation: portrait) and (max-width: 400px) {
	.bkg video, .bkg img {margin-top: 35%;}
}
@media screen and (orientation: portrait) and (max-width: 450px) {
	.bkg video, .bkg img {margin-top: 30%;}
}

@media screen and (max-aspect-ratio: 2/3) {
	.bkg video, .bkg img {margin-left: -45%;}
}
@media screen and (max-aspect-ratio: 1/2) {
	.bkg video, .bkg img { margin-left: -60%;}
}
@media screen and (max-aspect-ratio: 2/5) {
	.bkg video, .bkg img { margin-left: -80%;}
}