.spinner {
	width: 120px;
	height: 120px;
	text-align: center;
	line-height: 120px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	white-space: nowrap;
}

.spinner:before,
.spinner:after {
	content: "";
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: #1abc9c;
	opacity: 0.6;
	position: absolute;
	top: 0;
	left: 0;
	animation: bounce 2s infinite ease-in-out;
}

.spinner:after {
	animation-delay: -1s;
}

@keyframes bounce {

	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(2);
	}
}

@keyframes loading {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}