/*COLORS*/

body{ 
background-color: #000000;
overflow-x:hidden;}

#myVideo {
	width:1920px;
	height:113vh;
	position: absolute;
	top:-50px;
	left:50%;
	transform: translate(-50%, 0%);
	z-index:10;
}
#canvas {
	height:100%;
	position: fixed;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
}
.main {
	z-index:10;
}
#footer{
	position: absolute;
	bottom: 10px;
	width: 100%;
	height:25px;
	margin: auto;
	text-align: center;
	z-index: 20;
	color: #000000;
	font-family: 'Trebuchet MS', sans-serif;
	font-size: 10px;}
/**//**//**//**//**//**//**//**//**//**/


/**//**//**//**//**//**//**//**//**//**/
/*Main*/


#mainiframe{
	margin: 0;
	position: absolute;
}
	
	
/**//**//**//**//**//**//**//**//**//**/
/*NAVIGATION*/


#navContainer{
	margin: 0;
	position: absolute;
	top: 90%;
	left: 50%;
	min-width: 615px;
	margin: auto;
	height:50px;
	transform: translate(-50%, -50%);
	z-index:20;}


.navtext a{
	color: #ffffff;
	font-family: 'Trebuchet MS', sans-serif;
	text-align:center;
	font-size:20px;
	text-decoration: none;
	}
.navtext a:hover{
	color: #ff61b0;
}
#char{
	position: relative;
	display: inline-block;
	padding: 1rem 1rem;
	vertical-align: middle;
	animation-name: texton;
	animation-timing-function: ease-out;
	animation-duration: 3s;
	animation-iteration-count: 1;
	animation-delay: -0.75s;
	cursor:pointer;
}


#di{
	display: inline-block;
	padding: 1rem 1rem;
	vertical-align: middle;
	animation-name: texton;
	animation-timing-function: ease-out;
	animation-duration: 3s;
	animation-iteration-count: 1;
	animation-delay: -0.25s;
	cursor:pointer;
}
#contact{
	display: inline-block;
	padding: 1rem 1rem;
	vertical-align: middle;
	animation-name: texton;
	animation-timing-function: ease-out;
	animation-duration: 3s;
	animation-iteration-count: 1;
	animation-delay: 0s;
	cursor:pointer;}
	
#visual{
	display: inline-block;
	padding: 1rem 1rem;
	vertical-align: middle;
	animation-name: texton;
	animation-timing-function: ease-out;
	animation-duration: 3s;
	animation-iteration-count: 1;
	animation-delay: -0.5s;
	cursor:pointer;
}

@-moz-keyframes flicker {
0% {
		opacity: 1;
	}
	10% {
		opacity: 1;
	}
	15% {
		opacity: 0.0;
	}
	22.5% {
		opacity: 0.3;
	}
	25% {
		opacity: 0.1;
	}
	27.5% {
		opacity: 0.05;
	}
	30% {
		opacity: 0.15;
	}
	32.5% {
		opacity: 0.07;
	}
	35% {
		opacity: 0.1;
	}
	37.5% {
		opacity: 0.05;
	}
	40% {
		opacity: 0.15;
	}
	42.5% {
		opacity: 0.07;
	}
	45% {
		opacity: 0.1;
	}
	47.5% {
		opacity: 0.05;
	}
	50% {
		opacity: 0.15;
	}
	52.5% {
		opacity: 0.07;
	}
	55% {
		opacity: 0.1;
	}
	57.5% {
		opacity: 0.05;
	}
	60% {
		opacity: 0.1;
	}
	70% {
		opacity: 0.05;
	}
	100% {
		opacity: 0.0;
	}
}
@-webkit-keyframes flicker {
0% {
		opacity: 1;
	}
	10% {
		opacity: 1;
	}
	15% {
		opacity: 0.0;
	}
	22.5% {
		opacity: 0.3;
	}
	25% {
		opacity: 0.1;
	}
	27.5% {
		opacity: 0.05;
	}
	30% {
		opacity: 0.15;
	}
	32.5% {
		opacity: 0.07;
	}
	35% {
		opacity: 0.1;
	}
	37.5% {
		opacity: 0.05;
	}
	40% {
		opacity: 0.15;
	}
	42.5% {
		opacity: 0.07;
	}
	45% {
		opacity: 0.1;
	}
	47.5% {
		opacity: 0.05;
	}
	50% {
		opacity: 0.15;
	}
	52.5% {
		opacity: 0.07;
	}
	55% {
		opacity: 0.1;
	}
	57.5% {
		opacity: 0.05;
	}
	60% {
		opacity: 0.1;
	}
	70% {
		opacity: 0.05;
	}
	100% {
		opacity: 0.0;
	}
}
@-o-keyframes flicker {
0% {
		opacity: 1;
	}
	10% {
		opacity: 1;
	}
	15% {
		opacity: 0.0;
	}
	22.5% {
		opacity: 0.3;
	}
	25% {
		opacity: 0.1;
	}
	27.5% {
		opacity: 0.05;
	}
	30% {
		opacity: 0.15;
	}
	32.5% {
		opacity: 0.07;
	}
	35% {
		opacity: 0.1;
	}
	37.5% {
		opacity: 0.05;
	}
	40% {
		opacity: 0.15;
	}
	42.5% {
		opacity: 0.07;
	}
	45% {
		opacity: 0.1;
	}
	47.5% {
		opacity: 0.05;
	}
	50% {
		opacity: 0.15;
	}
	52.5% {
		opacity: 0.07;
	}
	55% {
		opacity: 0.1;
	}
	57.5% {
		opacity: 0.05;
	}
	60% {
		opacity: 0.1;
	}
	70% {
		opacity: 0.05;
	}
	100% {
		opacity: 0.0;
	}
}
@keyframes flicker {
0% {
		opacity: 1;
	}
	10% {
		opacity: 1;
	}
	15% {
		opacity: 0.0;
	}
	22.5% {
		opacity: 0.3;
	}
	25% {
		opacity: 0.1;
	}
	27.5% {
		opacity: 0.05;
	}
	30% {
		opacity: 0.15;
	}
	32.5% {
		opacity: 0.07;
	}
	35% {
		opacity: 0.1;
	}
	37.5% {
		opacity: 0.05;
	}
	40% {
		opacity: 0.15;
	}
	42.5% {
		opacity: 0.07;
	}
	45% {
		opacity: 0.1;
	}
	47.5% {
		opacity: 0.05;
	}
	50% {
		opacity: 0.15;
	}
	52.5% {
		opacity: 0.07;
	}
	55% {
		opacity: 0.1;
	}
	57.5% {
		opacity: 0.05;
	}
	60% {
		opacity: 0.1;
	}
	70% {
		opacity: 0.05;
	}
	100% {
		opacity: 0.0;
	}
}


@keyframes texton {
0% {
		opacity: 0;
		transform: translateY(20px);
	}
	70% {
		opacity: 0;
		transform: translateY(20px);
	}
	90% {

		transform: translateY(0px);
	}
	100% {
		opacity: 1;
		top:0px;
		transform: translateY(0px);
	}
}