html{
	width: 100%;
	height: 100%;
}

#body{
	padding: 0px;
	margin: 0px;
	box-sizing: border-box;
	color: white;
	font-family: 'Russo One', monospace;
	animation: body-anm 3s forwards;
}

@keyframes body-anm{
	0%{
		opacity: 0%;
		background-color: #D0B9BF;
	}
	100%{
		background-color: #AA98A2;
	}
}

.navbar{
	background: #1F1D36;
	animation: navbar-anm 3s;
}

@keyframes navbar-anm{
	0%{
		opacity: 0%;
		transform: scale(2.0);
	}
	100%{
		opacity: 100%;
	}
}

.nav-head{
	list-style: none;
	display: flex;
	justify-content: space-evenly;
}

.nav-link{
	font-size: 15px;
}

/*.head-h1{
	font-weight: 500;
}*/

.head-row{
	background: linear-gradient(to right, #E9A6A6, #3F3351);
	animation: head-row-anm 3s;
}

@keyframes head-row-anm{
	0%{
		opacity: 0%;
		transform: translateY(100%);
	}
	100%{
		transform: translateY(0%);
	}
}

.head1-h3{
	font-family: 'VT323', monospace;
	font-size: 180px;
	font-weight: bold;
	text-shadow: 0px 15px black;
	margin-top: 120px;
	margin-left: 50px;
	animation: blinkingText1 1s steps(5, start) infinite;
}

@keyframes blinkingText1{
	to{
		visibility: hidden;
	}
}

.head1-a{
	text-decoration: none;
	color: #FFE863;
	position: absolute;
	top: 80%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 130px;
}

.head1-a:hover{
	color: #FFE863	
}

.head2-h3{
	font-family: 'VT323', monospace;
	font-size: 195px;
	font-weight: bold;
	margin-left: 35px;
	margin-top: -90px;
	color: #FFD524;
	text-shadow: 0px 15px black;
	animation: blinkingText2 1s steps(5, start) infinite;
}

@keyframes blinkingText2{
	to{
		visibility: hidden;
	}
}

.head2-a{
	text-decoration: none;
	color: #FFE863
}

.head2-a:hover{
	color: #FFE863	
}

.raiden{
	background-attachment: fixed;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: -40px;
	padding: 15px;
	height: 600px;
}

.desc{
	background: linear-gradient(to right, #FFE3E3, #1F1D36);
	animation: desc-anm 3s;
}

@keyframes desc-anm{
	0%{
		opacity: 0%;
		transform: translateY(100%);
	}
	100%{
		transform: translateY(0%);
	}
}


.arrow-img{
	width: 80px;
}

.desc-l1{;
	font-family: 'VT323', monospace;
	font-size: 50px;
	font-weight: 500;
	display: block;
	margin-top: 20px;
	padding: 15px;
	text-shadow: 0px 10px black;
}

.tech-border1{
	border: 2px solid white;
	margin-bottom: 20px;
	box-shadow: 0px 10px black;
}

.tech-border2{
	border: 2px solid white;
	margin-bottom: 20px;
	box-shadow: 0px 10px black;
}

.tech{
	padding: 10px;
	height: 100px;
}

.desc-p1{
	padding: 15px;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 22px;
	font-weight: 900;
	display: inline-block;
}

.orias{
	margin-top: 100px;
	padding: 15px;
	border: 5px solid;
	height: 480px;
	box-shadow: 10px 10px black;
}

.img-label{
	text-align: left;
	margin-bottom: 20px;
}

.ff7-img{
	padding: 2px;
	margin-bottom: -50px;
	width: 300px;
}

.loading-img{
	padding: 2px;
	margin-bottom: -80px;
	width: 250px;
}

.main-h3{
	font-family: 'VT323', monospace;
	font-size: 70px;
	font-weight: bold;
	text-align: center;
	color: #FFE863;
	/*text-shadow: 0px 10px black;*/
	padding: 15px;
	margin-top: -5px;
}

.main-row{
	
}

/*.card-title{
	margin: 6px;
	padding: 10px;
	color: black;
	text-align: center;
}

.card{
	background: #AA98A1;
	padding: 10px;
	border: 1px solid black;
}

.card-img{
	padding: 10px;
}

.card-body{
	text-align: center;
}

.card-btn{
	background: #EBCFC4;
	color: black;
}*/

/*.card{
	background: none;
	margin-left: auto;
	margin-right: auto;
	border: 0PX;
}*/

#project{
	animation: proj-anm 3s;
}

@keyframes proj-anm{
	0%{
		opacity: 0%;
		transform: translateY(100%);
	}
	100%{
		transform: translateY(0%);
	}
}


.x-div{
	/*background-image: url("imgs/field.jpg");*/
	text-align: center;
	width: 300px;
	height: 100%;
}

.x-img{
	height: 300px;
}

.x-link{
	text-decoration: none;
	color: #FFE863;
	font-size: 35px;
}

.x-link:hover{
	color: #FFE863;
}

.zero-div{
	/*background-image: url("imgs/field.jpg");*/
	text-align: center;
	width: 300px;
	height: 100%;
}

.zero-img{
	margin-top: 7px;
	height: 300px;
}

.zero-link{
	text-decoration: none;
	color: #FFE863;
	font-size: 35px;
}

.zero-link:hover{
	color: #FFE863;
}


.sigma-div{
	/*background-image: url("imgs/field.jpg");*/
	text-align: center;
	width: 300px;
	height: 100%;
}

.sigma-img{
	height: 330px;
	margin-bottom: -20px;
}

.sigma-link{
	text-decoration: none;
	color: #FFE863;
	font-size: 35px;
}

.sigma-link:hover{
	color: #FFE863;
}

#contact {
	animation: cntct-anm 3s;
}

@keyframes cntct-anm{
	0%{
		opacity: 0%;
		transform: translateY(100%);
	}
	100%{
		transform: translateY(0%);
	}
}


.form-h2{
	font-size: 70px;
	color: #FFE863;
	font-family: 'VT323', monospace;
	margin: 6px;
	padding: 12px;
	text-align: center;
	animation: form-h2 1s steps(5, start) infinite;
}

@keyframes form-h2{
	to{
		visibility: hidden;
	}
}

.form-label{
	font-family: 'VT323', monospace;
	color: #FFE863;
	font-size: 30px;
	margin: 6px;
	padding: 12px;
}

.form-control{
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}

.form-div{
	text-align: center;	
}

.form-row{
	background: linear-gradient(to right, #4D4C7D, #E9D5DA);
}

.form-row1{
	background-image: url("imgs/fireworks1.gif"), url("imgs/fireworks2.gif");
}

.form-btn{
	margin: 6px;
	text-align: center;
}

.btn{
	font-family: 'VT323', monospace;
	font-size: 20px;
	background: #EBCFC4;
	color: black;
}

iframe{
	padding: 12px;
	height: 300px;
	width: 300px;
}

.form-border{

}

.footer{
	animation: footer-anm 3s;
}

@keyframes footer-anm{
	0%{
		opacity: 0%;
		transform: scale(2.0);
	}
	100%{
	}
}


.footer-row{
	background: #1F1D36;
}

.footer-h3{
	margin: 6px;
	padding: 10px;
	text-align: center;
	font-size: 20px;
}

.footer-social{
	padding: 10px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: white;
}

.footer-contact{
	padding: 10px;
	display: block;
	text-align: center;
}