@keyframes loading-animation {
	from {
	  transform: translate(0, 0);
	}
	to {
	  transform: translate(0, 54px);
	}
}

@keyframes loading-shadow-animation {
	from {
		transform: scale(0.5, 0.5);
	}
	to {
		transform: scale(1, 1);
	}
}

.loading-animation {
	display: flex;
	height: 90px;
	align-items: center;
	flex-direction: column;
	justify-content: space-between;
}

.loading-ball {
	width: 36px;
	height: 36px;
	background-image: url('/assets/ball.png');
	background-size: contain;
	animation: loading-animation 0.5s ease-in alternate infinite;
	z-index: 1;
}

.loading-shadow {
	bottom: 0;
	width: 36px;
	height: 7px;
	border-radius: 50%;
	background-color: #00000080;
	animation: loading-shadow-animation 0.5s ease-in alternate infinite;
}

.loading {
	display: flex;
	align-items: center;
	padding: 15px;
	flex: 1;
}

.loading-text {
	margin: 15px;
    font-size: 18px;
}