/*css
//==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>==>>>
//
// CssHidex v1.16 [ Commercial Version ]
// Copyright (c) phpkobo.com ( http://www.phpkobo.com/ )
// Email : admin@phpkobo.com
// ID : HDXCS-116
// URL : http://www.phpkobo.com/csshidex
//
//==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<==<<<
*/
/* screen-cover */
.screen-cover{
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	xbackground-color:rgba(0,0,0,0.3);
	z-index:100000;
}
.screen-cover.screen-cover-on{
	display:block;
}
/* spinner */
.spinner{
	display:none;
	position:relative;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:100px;
	height:100px;
	line-height:0;
	font-size:0;
}
.spinner.spinner-on{
	display:block;
}
/* spinner-ring & spinner-ring-inner */
.spinner-ring,
.spinner-ring-inner {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/* spinner-ring */
.spinner-ring {
	animation-name:kf-spinner-ring;
	animation-iteration-count:infinite;
	animation-duration:6s;
	animation-timing-function:linear;
	animation-play-state:paused;
}
.spinner-ring-1 {
	animation-delay:0s;
}
.spinner-ring-2 {
	animation-delay:-2s;
}
.spinner-ring-3 {
	animation-delay:-4s;
}
.spinner-on .spinner-ring{
	animation-play-state:running;
}
@keyframes kf-spinner-ring{
	25% {
		transform:translateX(-10px);
	}
	75% {
		transform:translateX(10px);
	}
}
/* spinner-ring-inner */
.spinner-ring-inner {
	border-width:5px;
	border-style:solid;
	border-radius:50%;
	transition:border-width .5s;
}
.spinner-ring-inner {
	animation-name:kf-spinner-ring-inner;
	animation-iteration-count:infinite;
	animation-duration:1.5s;
	animation-timing-function:linear;
	animation-play-state:paused;
}
.spinner-ring-1 .spinner-ring-inner {
	border-color:rgba(255,255,0,0.6);
	animation-delay:0s;
}
.spinner-ring-2 .spinner-ring-inner {
	border-color:rgba(0,255,255,0.5);
	animation-delay:-1s;
}
.spinner-ring-3 .spinner-ring-inner {
	border-color:rgba(255,0,255,0.4);
	animation-delay:-2s;
}
.screen-cover-on .spinner-ring-inner {
	border-width:10px;
	animation-play-state:running;
}
@keyframes kf-spinner-ring-inner{
	0% {
		transform:rotateZ(0) scale(1.2,1);
		opacity:1;
	}
	50% {
		opacity:0.5;
	}
	100% {
		transform:rotateZ(360deg) scale(1.2,1);
		opacity:1;
	}
}