.motta-progress {
	text-align: center;
	@include font-size(14);
	line-height: 2.6667;
	color: $color__dark;
}

.motta-progress__inner {
	position: relative;
	display: inline-block;
	border-bottom: 2px solid #dadfe3;
	padding: 0 4.19em;

	.motta-progress__count-bar {
		position: absolute;
		bottom: -2px;
		left: 0;
		background-color: #000000;
		height: 2px;
	}
}

.motta-pagination--loading {
	display: flex;
	align-items: center;
	flex-direction: column;
}

.motta-pagination--loading-dots {
	display: flex;
	width: 23px;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 auto;

	span {
		display: inline-block;
		width: 8px;
		height: 8px;
		border-radius: 100%;
		background-color: $color__dark;
		margin-bottom: 6px;
		transition: .3s;
		animation: mottaLoading .8s linear infinite;

		&:nth-child(1) {
			animation-delay: 0s;
		}

		&:nth-child(2) {
			animation-delay: 0.2s;
		}

		&:nth-child(3) {
			animation-delay: 0.4s;
		}

		&:nth-child(4) {
			animation-delay: 0.6s;
		}
	}
}

.motta-pagination--loading-text {
	@include font-size(14);
	line-height: 1.8;
	color: $color__dark;
}