html {
	background-color: #595959;
	background: repeating-linear-gradient(-45deg, #2b2b2b 0%, #2b2b2b 10%, #222222 0%, #222222 50%) 0 / 15px 15px;
}
#footer {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 1;
}

#centerFooter {
	width: 100%;
	display: grid;
	align-items: center;
	justify-content: center;
}
#site {
	padding: 10px 10px 20px 10px;
	transform: scale(2.5);
	margin: 40px;
	float: none;
}
@media screen and (min-aspect-ratio: 9/16) {
	#centerFooter {
		width: 60%;
		margin: auto;
		display: flex;
	}
	#site {
		padding: 0px 20px 20px 20px;
		transform: scale(1.0);
		margin: auto;
		float: left;
	}
}

#video-bg {
	position: fixed;
	top: 0; 
	right: 0; 
	bottom: 0; 
	left: 0;
	overflow: hidden;
}
#video-bg > video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#svg {
	fill: white;
	height: 50px;
	width: 50px;
}
#svg:hover {
	fill: #C8C8C8;
}

/* 1. No object-fit support: */
@media (min-aspect-ratio: 16/9) {
	#video-bg > video { 
		height: 300%; 
		top: -100%; 
	}
}
@media (max-aspect-ratio: 16/9) {
	#video-bg > video { 
		width: 300%; 
		left: -100%; 
	}
}
/* 2. If supporting object-fit, overriding (1): */
@supports (object-fit: cover) {
	#video-bg > video {
		top: 0; 
		left: 0;
		width: 100%; 
		height: auto;
		min-width: 10%;
		object-fit: cover;
	}
}
