/* .modal-loading *******************************/

.modal-loading {
	background-color: #fff;
	border-radius: 15px;
	display: none;
	padding: 40px 0px;
	text-align: center;
	width: 100%;

	.message {
		font-size: 0.9rem;
		font-weight: 300;

		h3 {
			font-size: 1.2rem;
			font-weight: 800;
			margin-bottom: 10px;
		}
	}

	img {
		height: 60px;
		width: auto;
	}

	.dots {
		align-items: center;
		display: none;
		gap: 10px;
		justify-content: center;
		width: 100%;

		.dot {
			animation: loading 1s linear forwards;
			animation-iteration-count: infinite;
			background-color: #ccc;
			border-radius: 20px;
			height: 20px;
			position: relative;
			width: 20px;
		}

		.dot2 {
			animation-delay: 250ms;
		}

		.dot3 {
			animation-delay: 500ms;
		}
	}
}

@keyframes loading {
	0% { top: 0; }
	25% { top: -5px; background-color: #999; }
	50% { top: 0; background-color: #666; }
	75% { top: 5px; background-color: #999; }
	100% { top: 0; background-color: #ccc; }
}