@charset "UTF-8";

.loader {
    font-size: 10px;
    position: relative;
    position: fixed;
    top: 50%;
    left: 0;
    right: 0;
    -webkit-animation: load1 0.6s infinite linear;
    animation: load1 0.6s infinite linear;
    text-indent: -9999em;
    border-top: 3px solid transparent;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid #f6cc3a;
    -webkit-transition: 1s;
    transition: 1s;
    opacity: 0;
    margin: -50px auto;
}
@-webkit-keyframes load1 {
	0% {
		-webkit-transform: rotate(0deg);
		        transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}
@keyframes load1 {
	0% {
		-webkit-transform: rotate(0deg);
		        transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}
.loader, .loader:after {
    width: 100px;
    height: 100px;
    content: '';
    border-radius: 50%;
}
.loader.on {
    opacity: 1;
}