body { color:#eee; background-color:black; }

a { cursor:pointer; text-decoration:none; }

a:hover { text-decoration:none; }

h1,h2,h3 { padding:10px 0; font-weight : bold; color:#fff; }

p { font-size: 1.2rem; text-align:justify;}

/* Video Background */
videobg {
	position:fixed;top:0px;right:0px;bottom:0px;left:0px;z-index:-1;
	background-color:black;
}
videobg > div {
	display: flex;
	height: 100vh;
  align-items: center;
}
videobg > div > video { width : 100%; }
/* Video Background */

/* Responsive */
@media screen and (orientation:landscape) {
	.portrait { display:none; }

	videobg > div > video { height:80vh; }
}
@media screen and (orientation:portrait) {
	.landscape { display:none; }
}
/* Responsive */

.dframe {position:relative;}
.dframe > img {min-width:100%;width:100vw;max-width:100%;}
.dframe > iframe {width:calc(100% - 20px);height:calc(100% - 20px);position:absolute;top:10px;right:10px;bottom:10px;left:10px;z-index:+1;}
.dframe > section {width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;z-index:+1;}

/* waist */
	waist { width:100%; display:block; color:white; }

	waist a,
	waist h2,
	waist h3 { color:white; }
	waist a:hover { color:#ccc; text-decoration:none; }
	waist ul { list-style-type:none; }
	waist img { margin:0 16px 16px 0; padding:3px; background-color:#fff; border:1px solid #99bece; }
/* waist */

header { position:fixed;top:15px;width:100vw;z-index:+2; }
header > div {
	margin:0 auto;
	border:solid 1px black;
	background-color:white;
	width:220px;
}

footer { position:fixed;right:20px;bottom:20px;z-index:+2; }
footer > div,
.nav-item {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

footer > div {
	border:solid 1px white;
	background-color:black;
	width:150px;
}

footer > div > a { color:white;text-decoration:none;font-size:2rem; }

footer > div:hover { background-color:white; }
footer > div:hover > a { color:black; }

/* Carousel */
#carousel {
	position:fixed;
	top:0;right:0;bottom:0;left:0;
}

#carousel > div#carousel-index {
	display: flex;
	height: 100vh;
  align-items: center;
}
/* Carousel */

/* Navigator */
#menu {
	z-index:+9;
	display:none;
	position:fixed;
	top:0;right:0;bottom:0;left:0;
	background-color:rgba(0,0,0,0.8);
}

#menu > div {
	width:500px;
	max-width:100%;
	height:100vh;
	margin:0 auto;
	display: flex;
	height: 100vh;
  align-items: center;
}

#menu:target {
	display:unset;

	animation-name: fadeIn;
	animation-duration: 1s;
	animation-fill-mode: forwards;
}

.navbar img {
	width:175px;
	max-width:30vw;
}

.nav-link:hover {
	color:red !important;
}

.nav-item { font-size:1.3rem; }
.nav-item:hover {	background-color:rgba(255,255,255,0.8); }

.fadein {
	animation-name: fadeIn;
	animation-duration: 1s;
	animation-fill-mode: forwards;
}

	@keyframes fadeIn {
		from { opacity:0; }
		to { opacity:1; }
	}

.fadeout {
	animation-name: fadeOut;
	animation-duration: 1s;
	animation-fill-mode: forwards;
}

	@keyframes fadeOut {
		from { opacity:1; }
		to { opacity:0; }
	}
/* Navigator */