.i-am {
	font-size: 200px;
	text-align: center;
	margin-top: 50px;
	margin-bottom: 10px;
	color: rgb(80, 4, 4);
}

.random-line {
	font-size: 20px;
	color: #00000000;
	display: flex;
	max-width: 500px;
	text-align: center;
	text-shadow: 5px 5px 30px #4450f0;
	transition:  0.3s ease-in 0s;
}

.random-line:hover {
	color: #000000;
	transform: scale(1.1);
	opacity: 100%;
	text-shadow: 5px 5px 0px #00000000;
	filter: blur(0px);
	transition:  0.1s ease-in 0s;
}

@keyframes idle {
	0% {
		filter: drop-shadow(5px 5px 15px 5px #FFE213);
	}

	100% {
		filter: drop-shadow(5px 5px 15px 5px #FFE213);
	}
}


.pop-in {
	animation-duration: 0.5s;
	animation-name: pop-in;
	animation-delay: 0s;
	animation-timing-function: ease-out;
	animation-iteration-count: 1;
}



.refresh:hover {
	transform: scale(1) rotate(30deg);
	opacity: 100%;
}


.refresh-holder {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.refresh {
	max-width: 80px;
	flex: 1;
	filter: drop-shadow(5px 5px 0px #6d030341);
	margin-bottom: 20px;

	transition: transform 0.3s ease, opacity 0.3s ease;
}


@keyframes pop-in {
	from {
		scale: 0;
	}

	to {
		scale: 1;
	}
}




.i-am-container {
	position: relative;
	width: 100%;
	min-height: 500px;
	margin-bottom: 200px;
}


.random-container {
	position: absolute;
	animation-name: idle;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}