@charset "utf-8";

html, body{
	margin: 0;
	overflow: hidden;
	width: 100vw;
	height: 100vh;
	background-color: black;
}

#navbarPopupContainer video{
	width: 100%;
  	position: fixed;
	margin: 0;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	opacity: 0;
}

#navElements{
	width: 95%;
	position: absolute;
	margin: auto;
	transition: .25s;
	height: 25vh;
	left: 0;
	right: 0
}

#navElements a{
	display: flex;
	align-items: center;
	position: relative;
	float: left;
	width: 33%;
	height: 100%;
}

#printer {
	position: relative;
	width: 100%;
	height: 75%;
	z-index: 5;
}

#camera {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 4;
}

#cube {
	position: relative;
	width: 100%;
	height: 90%;
	z-index: 6;
}

#Foreground {
	transform: translate(-50%, -50%);
	position: absolute;
	top: 50%;
	left: 50%;
	right: 0;
	bottom: 0;
	min-width: 100%;
	min-height: 100%;
	height: 170%;
	z-index: 1;
}

#Background {
	position: fixed;
	right: 0;
	bottom: 0;
	min-width: 100%;
	min-height: 100%;
}

#preloaderContainer{
	position: fixed;
	right: 0;
	bottom: 0;
	width: 100vw;
	height: 100vh;
	background-color: black;
	z-index: 70;
	opacity: 1;
	transition: opacity 1s ease-in-out;
}

#Preloader{
	width: 100%;
	height: 100%;	
}


#printer:hover, #camera:hover, #cube:hover{
	cursor: pointer;
	opacity: 1;
}