#app:not(:empty) + .sk-cube-grid {
	  	display: none;
	}

	.sk-cube-grid{
	  	width 			: 100%;
	  	height 			: 100%;
	  	position 		: fixed;
	  	display 		: flex;
	  	top 			: 0px;
	  	left 			: 0px;  
	  	z-index 		: 10000;  
	  	align-items 	: center;
	  	justify-content : center;  	
	  	overflow 		: hidden; 
	  	opacity 		: 1;
	  	animation-name 		: cube-start;
	    animation-duration  : 0.8s;
	}
	.sk-cube-grid .sk-cube {
	  	width 			: 10px;
	  	height 			: 10px;
	  	background-color: #27C49E;
	  	float 			: left;
	  	animation 		: sk-cubeGridScaleDelay 1s infinite ease-in-out;
	  	margin 			: 0px 5px;
	  	border-radius 	: 50%; 
	}
	.sk-cube-grid .sk-cube1 {
	  	animation-delay: 0.2s;
	}

	.sk-cube-grid .sk-cube2 {
	  	animation-delay: 0.3s;
	}
	.sk-cube-grid .sk-cube3 {
	  	animation-delay: 0.4s;
	}
	@keyframes cube-start{
	    from{
	        opacity: 0;
	    }
	    to{
	        opacity: 1;
	    }
	}
	@keyframes sk-cubeGridScaleDelay{
	  	0%,
	  	70%,
	  	100%{ ransform : scale3D(1, 1, 1);}
	  	35% { transform: scale3D(0, 0, 1);}
	}

	.loading-bg{
		width 			: 100%;
	  	height 			: 100%;
	  	position 		: fixed;
	  	top 			: 0px;
	  	left 			: 0px; 
	  	z-index 		: 10000;  
	  	background-color 	: #edf5fb;
	  	animation-name 		: bg-start;
	    animation-duration  : 0.8s;
	    animation-timing-function: ease-in-out;
	}
	@keyframes bg-start{
	    from{
	        height 	: 0%;
	        z-index : 10001; 
	    }
	    to{
	        height  : 100%;
	        z-index : 10000; 
	    }
	}

	.bg-end{
	    height 				: 0px;
	    animation-name 		: bg-end;
	    bottom				: 0px;
	    top 				: auto;
	    animation-duration  : 1s;
	}
	@keyframes bg-end{
	    from{
	        height :100%;
	    }
	    to{
	        height : 0px;
	    }
	}