*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.backgroundAnimation{
	background-color: rgba(255, 255, 255, .85);
	backdrop-filter: blur(20px);
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	animation: opacityTwo 1.5s ease forwards;
	animation-delay: 4s;
	pointer-events: none;
}

.logoText{
	font-family: 'Raleway', sans-serif;
	font-weight: 800;
	color: white;
	font-size: 3.6rem;
	padding-top: 5px;
	padding-left: 3px;
	opacity: 0;
	animation: opacity 3s ease forwards;
	animation-delay: 1s;
}

.logo{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);	
}

#filled{
	filter: drop-shadow(3px 3px 5px rgba(0, 0, 0, .7));
	opacity: 0;
	animation: opacity 4s ease forwards;
	animation-delay: 0.75s;
}

#stroke{
	stroke-linecap: round;
	stroke-dasharray: 469;
	stroke-dashoffset: 469;
	animation: line-anim 1.5s ease forwards;
}

@keyframes line-anim{
	to{
		stroke-dashoffset: 0;
	}

}

@keyframes opacity{
	to{
		opacity: 1;
	}

}

@keyframes opacityTwo{
	to{
		opacity: 0;
	}
}