.loading {
    position: absolute;
    box-sizing: border-box;
    /* background: url(../../static/imgs/loading-b.gif) no-repeat center; */
    width: 100vw;
    height: 100vh;
    z-index: 1;
    top: 0;
}

.loadingCircle{
	width: 45px;
	height: 45px;
	position: absolute;
	left: 46%;
	top: 42%;
	/* margin: 0 auto; */
	background-color: #fff;
}
.loadingCircle span{
	width: 9px;
	height: 9px;
	background-color: #5d5b5b;
	position: absolute;
	border-radius: 50%;
	-webkit-animation: load 1.04s ease infinite;
}
@-webkit-keyframes load {
    0% {
        -webkit-transform: scale(1.2);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(.3);
        opacity: 0.5;
    }
}
.loadingCircle span:nth-child(1){
	left: 0;
	top: 50%;
	margin-top: -4px;
	-webkit-animation-delay: 0.13s;
}
.loadingCircle span:nth-child(2){
	left: 5px;
	top:5px;
	-webkit-animation-delay: 0.26s;
}
.loadingCircle span:nth-child(3){
	left: 50%;
	top:0;
	margin-left: -4px;
	-webkit-animation-delay: 0.39s;
}

.loadingCircle span:nth-child(4){
	right: 5px;
	top:5px;
	-webkit-animation-delay: 0.52s;
}
.loadingCircle span:nth-child(5){
	right: 0;
	top: 50%;
	margin-top: -4px;
	-webkit-animation-delay: 0.65s;
}
.loadingCircle span:nth-child(6){
	right: 5px;
	bottom:5px;
	-webkit-animation-delay: 0.78s;
}
.loadingCircle span:nth-child(7){
	left: 50%;
	bottom:0;
	margin-left: -4px;
	-webkit-animation-delay: 0.91s;
}
.loadingCircle span:nth-child(8){
	left: 5px;
	bottom:5px;
	-webkit-animation-delay: 1.04s;
}