@import url('https://fonts.googleapis.com/css?family=Indie+Flower');

.c-PageLoader {
	// margin-top: 50%;	
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.3);  
    width: 100%;  
    height: 100%;  
    position: fixed;  
    top:0px;  
    left:0px;  
    z-index: 20;

	// .is-animate {
	// 		background: #ffb200;
	// 		box-sizing: border-box;
	// 		font-size: 66px;
	// 		display: -webkit-inline-box;
	// 		padding: 14px;
	// 		border-radius: 7px;
	// }
	// .is-animate > div {
	// 		animation-name: style;
	// 		display: -webkit-inline-box;
	// 		color: #fff;
	// 		padding: 9px;
	// 		background: #ffb200;
	// 		font-family: 'Indie Flower', cursive;
	// 		box-shadow: 2px 2px 9px 2px;
	// }
	// .l{
	// 	animation: letterspacing 1s infinite alternate cubic-bezier(.2, 0, 0, 1);
	// }
	
	// .is-animate > div {
	// 	animation-duration: 1s;
	// 	animation-fill-mode: both;
	// 	animation-iteration-count: infinite;
	// }
	
	// .is-animate > div:nth-child(1) { animation-delay: 0.0s }
	// .is-animate > div:nth-child(2) { animation-delay: 0.1s }
	// .is-animate > div:nth-child(3) { animation-delay: 0.2s }
	// .is-animate > div:nth-child(4) { animation-delay: 0.3s }
	// .is-animate > div:nth-child(5) { animation-delay: 0.4s }
	// .is-animate > div:nth-child(6) { animation-delay: 0.5s }
	// .is-animate > div:nth-child(7) { animation-delay: 0.6s }
	
	
	// @keyframes style {
	// 	from {
	// 		transform: scale3d(1, 1, 1);
	// 	}
	// 	30% {
	// 		box-shadow: 0px 0px 0px 0px;
	// 		transform: scale3d(1.25, 0.75, 1);
	// 	}
	// 	40% {
	// 		transform: scale3d(0.75, 1.25, 1);
	// 	}
	// 	50% {
	// 		transform: scale3d(1.15, 0.85, 1);
	// 	}
	// 	65% {
	// 		transform: scale3d(.95, 1.05, 1);
	// 	}
	// 	75% {
	// 		transform: scale3d(1.05, .95, 1);
	// 	}
	// 	to {
	// 		transform: scale3d(1, 1, 1);
	// 	}
	// }
	
	
	// @keyframes letterspacing {
	// 	0% {
	// 		filter: blur(0.1rem);
	// 	}      
	// 	100% {
	// 		filter: blur(0.5rem);
	// 	}
	// 	to {
	// 		letter-spacing: none;
	// 		filter: blur(0rem);
	// 	}
	// }


	.c-PageLoader__lds-ripple {
		display: inline-block;
		position: relative;
		width: 80px;
		height: 80px;
		div {
			position: absolute;
			border: 4px solid #fff;
			opacity: 1;
			border-radius: 50%;
			animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
			&:nth-child(2) {
				animation-delay: -0.5s;
			}
		}
	}
	
	@keyframes lds-ripple {
		0% {
			top: 36px;
			left: 36px;
			width: 0;
			height: 0;
			opacity: 1;
		}
		100% {
			top: 0px;
			left: 0px;
			width: 72px;
			height: 72px;
			opacity: 0;
		}
	}
}
