.checkmeout {
	background: #44baa8;
	position: relative;
	height: 350px;
}

.text {
	position: absolute;
	left: 50%;
	color: yellow;
	font-size: 300px;
	font-family: Arial, Helvetica, sans-serif;
	filter: url(#gooey);
}
.text::before,
.text::after {
	position: absolute;
	opacity: 0;
	transform: translate(-50%, 0);
	animation-duration: 3.2s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	filter: blur(9px);
}
.text::before {
	content: "ME";
	animation-name: items-odd;
}
.text::after {
	content: "OUT";
	animation-name: items-even;
	animation-delay: 0.8s;
}

@keyframes items-odd {
	15.625% {
		opacity: 1;
	}
	25% {
		opacity: 1;
	}
	40.625% {
		opacity: 0;
	}
	50% {
		opacity: 0;
	}
	65.625% {
		opacity: 1;
	}
	75% {
		opacity: 1;
	}
	90.625% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
	0% {
		content: "YO";
	}
	49.9999% {
		content: "YO";
	}
	50% {
		content: "ME";
	}
	99.9999% {
		content: "ME";
	}
}
@keyframes items-even {
	15.625% {
		opacity: 1;
	}
	25% {
		opacity: 1;
	}
	40.625% {
		opacity: 0;
	}
	50% {
		opacity: 0;
	}
	65.625% {
		opacity: 1;
	}
	75% {
		opacity: 1;
	}
	90.625% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
	0% {
		content: "CHECK";
	}
	49.9999% {
		content: "CHECK";
	}
	50% {
		content: "OUT";
	}
	99.9999% {
		content: "OUT";
	}
}