/*REQUIRED FOR ALL HTMLS, WEBSITE WILL BREAK X_X*/
/*ALL USE THE SAME KEYFRAMES, they just need separate classes for duration speed. '<'*/
/*WHY ARE WE ALL SCREAMINNGG AAAAA*/

/*Fonts & Link stuff are at bottom*/

/*----BODY GENERAL----*/
/*Body Stuff*/
body {
	/*This is very important, Do NOT delete this.*/
	border: 2px ridge rgb(255,255,255,0);
	font-family:monospace;
	font-weight:bold;
	font-size:16px;
	width:auto;
	height:auto;
	margin:0px;
	margin-top:0px;
}

/*----BG General----*/
/*BG Body*/
	.bg {
		border: 0px ridge rgb(255,255,255);
		width:100%;
		height:100%;
		position:fixed;
		object-fit:cover;
	}
/*BG SUB*/
		.bgpos {
			position:fixed;
			left:50%;
			top: -7.5%;
			transform: translateX(-50%);
			height:115%;
			min-width:139vw;
			min-height:116vh;
			object-fit:cover;
			
		}
		
		
/*--touch prevention--*/
	.nohighlight {
		-webkit-user-select:none;
	}

	.notouchy {
		pointer-events: none;
	}
/*Point on Click*/
	.clickme {
		cursor: pointer;
	}
/*Opacity for Unused*/
	.unused {
		opacity:0.5;
	}
/*-IMAGE SIZE FIXER (Images inside of divs, ex:pencil,button)-*/	
	
	.fixImgSize {
	width:100%;
	height:100%
	object-fit:contain;
}
/*-For images that stretch-*/
	.stretchy {
		width:100%;
		height:100%;
	}

/*-----ANIMATIONS-----*/
/*-Simple General-*/
.poof {
	animation-name:poof;
	animation-duration:2s;
	animation-timing-function:linear;
	animation-delay:2s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
}
	@keyframes poof {
		0%   {opacity:.5;}
		99%  {opacity:0;}
		100% {display:none;}
	}
.fadein:hover {
	animation-name:fadein;
	animation-duration:2s;
	animation-timing-function:linear;
	animation:iteration-count:1;
	animation-fill-mode:forwards;
}
	@keyframes fadein {
		0% {opacity:0.1;}
		100% {opacity:1;}
	}
/*----C = FIELD Cloud Animations----THE FIELD SECTION----*/
/*C5--------*/
	.c5move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:200s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
		animation-fill-mode:;
		opacity:1;
	}
	
	.c5move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:200s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*C4--------*/
	.c4move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:250s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
		animation-fill-mode:;
		opacity:1;
	}
	
	.c4move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:250s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*C3--------*/
	.c3move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:300s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
		animation-fill-mode:;
		opacity:1;
	}
	
	.c3move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:300s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*C2--------*/
	.c2move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:500s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
		animation-fill-mode:;
		opacity:1;
	}
	
	.c2move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:500s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*C1--------*/
	.c1move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:1000s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
		animation-fill-mode:;
		opacity:1;
	}
	
	.c1move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:1000s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}	
	
/*----F+M+B = UNCANNY Cube Animations----THE UNCANNY SECTION----*/
/*F3--------*/
	.f3move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:300s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}

	.f3move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:300s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*F2--------*/
	.f2move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:600s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
	
	.f2move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:600s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*F1--------*/
	.f1move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:700s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
	
	.f1move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:700s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*M3--------*/
	.m3move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTestrev;
		animation-duration:1000s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
	
	.m3move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTestrev1;
		animation-duration:1000s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*M2--------*/
	.m2move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:900s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
	
	.m2move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:900s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*M1--------*/
	.m1move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTestrev;
		animation-duration:800s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
	
	.m1move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTestrev1;
		animation-duration:800s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*B2--------*/
	.b2move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:1500s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}

	.b2move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:1500s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*B1--------*/
	.b1move {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest;
		animation-duration:1500s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}	

	.b1move1 {
		position:fixed;
		left:50%;
		top: -7.5%;
		transform: translateX(-50%);
		height:115%;
		min-width:139vw;
		min-height:116vh;
		object-fit:cover;
		
		animation-name: moveTest1;
		animation-duration:1500s;
		animation-timing-function:linear;
		animation-delay: 0s;
		animation-iteration-count:infinite;
	}
/*----END OF CUBE----*/

/*----BG Keyframes----*/
	@keyframes moveTest {
		0%   {transform: translateX(-50%);}
		50%  {transform: translateX(-100%);}
		100% {transform: translateX(-150%);}
		/*Save just cause: -35.5% left side and -64.5% right side*/
		
	}
	@keyframes moveTest1 {
		0%   {transform: translateX(49.97%);}
		50%  {transform: translateX(-0.03%);}
		100%  {transform: translateX(-50.03%);}
	}
	@keyframes moveTestrev {
		0%   {transform: translateX(-50%);}
		50%  {transform: translateX(0%);}
		100% {transform: translateX(50%);}
	}
	@keyframes moveTestrev1 {
		0%   {transform: translateX(-149.98%);}
		50%  {transform: translateX(-99.98%);}
		100% {transform: translateX(-49.98%);}
	}


/*----Custom Fonts----*/
	@font-face {
		font-family:Dabufont;
		src: url(../fonts/Dabufont-Regular.ttf);
	}

/*----Link Style----*/
	a:link {
		color: blue;
		text-decoration:none;
	}

	a:active {
		color: yellow;
	}

	a:hover {
		color: rgb(100,100,255);
		text-decoration:underline;
		
	}

	a:visited {
		color: rgb(100,100,100);
		text-decoration:none;
	}