#preloader {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 100px;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 9999;
}
.spinner {
	position: relative;
	width: 80px;
	height: 80px;
	margin: 10px;
	border: 3px solid transparent;
	border-top-color: #3498db;
	border-radius: 50% !important;
	animation: spin 1s linear infinite;
}
.spinner::before,
.spinner::after {
	content: "";
	position: absolute;
	border: 3px solid transparent;
	border-radius: 50% !important;
}
.spinner::before {
	top: 6px;
	left: 6px;
	right: 6px;
	bottom: 6px;
	border-top-color: #e74c3c;
	animation: spin 2s linear infinite reverse;
}
.spinner::after {
	top: 18px;
	left: 18px;
	right: 18px;
	bottom: 18px;
	border-top-color: #f39c12;
	animation: spin 0.5s linear infinite;
}
.center-dot {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 8px;
	height: 8px;
	background-color: #27ae60;
	border-radius: 50% !important;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
@keyframes spin {
	0%   { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}