.cssload-loader {
	position: relative;
	left: calc(50% - 31px);
	/*width: 62px;
	height: 62px;*/
	border-radius: 50%;
		-o-border-radius: 50%;
		-ms-border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
	/*perspective: 780px;*/
        width: 64px;
	height: 64px;
        perspective: 640px;
}

.cssload-inner {
	position: absolute;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
	border-radius: 50%;
		-o-border-radius: 50%;
		-ms-border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;	
}

.cssload-inner.cssload-one { /*RED*/
	left: 0%;
	top: 0%;
	animation: cssload-rotate-one 1s linear infinite;
		-o-animation: cssload-rotate-one 1s linear infinite;
		-ms-animation: cssload-rotate-one 1s linear infinite;
		-webkit-animation: cssload-rotate-one 1s linear infinite;
		-moz-animation: cssload-rotate-one 1s linear infinite;
        border-right: 3px solid rgb(235,11,134);
}

.cssload-inner.cssload-two { /*BLUE*/
	right: 0%;
	top: 0%;
	animation: cssload-rotate-two 1s linear infinite;
		-o-animation: cssload-rotate-two 1s linear infinite;
		-ms-animation: cssload-rotate-two 1s linear infinite;
		-webkit-animation: cssload-rotate-two 1s linear infinite;
		-moz-animation: cssload-rotate-two 1s linear infinite;
	border-top: 3px solid rgb(117,144,202);
}

.cssload-inner.cssload-three { /*YELLOW*/ 
	right: 0%;
	bottom: 0%;
	animation: cssload-rotate-three 1s linear infinite;
		-o-animation: cssload-rotate-three 1s linear infinite;
		-ms-animation: cssload-rotate-three 1s linear infinite;
		-webkit-animation: cssload-rotate-three 1s linear infinite;
		-moz-animation: cssload-rotate-three 1s linear infinite;	
        border-bottom: 3px solid rgb(251,239,3);
}







@keyframes cssload-rotate-one {
	0% {
		transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
	}
	100% {
		transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
	}
}

@-o-keyframes cssload-rotate-one {
	0% {
		-o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
	}
	100% {
		-o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
	}
}

@-ms-keyframes cssload-rotate-one {
	0% {
		-ms-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
	}
	100% {
		-ms-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
	}
}

@-webkit-keyframes cssload-rotate-one {
	0% {
		-webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
	}
	100% {
		-webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
	}
}

@-moz-keyframes cssload-rotate-one {
	0% {
		-moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
	}
	100% {
		-moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
	}
}

@keyframes cssload-rotate-two {
	0% {
		transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
	}
	100% {
		transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
	}
}

@-o-keyframes cssload-rotate-two {
	0% {
		-o-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
	}
	100% {
		-o-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
	}
}

@-ms-keyframes cssload-rotate-two {
	0% {
		-ms-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
	}
	100% {
		-ms-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
	}
}

@-webkit-keyframes cssload-rotate-two {
	0% {
		-webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
	}
	100% {
		-webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
	}
}

@-moz-keyframes cssload-rotate-two {
	0% {
		-moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
	}
	100% {
		-moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
	}
}

@keyframes cssload-rotate-three {
	0% {
		transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
	}
	100% {
		transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
	}
}

@-o-keyframes cssload-rotate-three {
	0% {
		-o-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
	}
	100% {
		-o-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
	}
}

@-ms-keyframes cssload-rotate-three {
	0% {
		-ms-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
	}
	100% {
		-ms-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
	}
}

@-webkit-keyframes cssload-rotate-three {
	0% {
		-webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
	}
	100% {
		-webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
	}
}

@-moz-keyframes cssload-rotate-three {
	0% {
		-moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
	}
	100% {
		-moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
	}
}




/*----------------------- v2 ---------------------*/
.wrapper-cssload-loader2 {
    
	padding-left: 0em;
	padding-right: 0em;
	/*margin: 17px auto;*/
	display: block;
	/*width: 70px;*/
        float: left;
        margin-top: -14px;
}
.cssload-loader2 {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	margin: 1em;
	display: inline-block;
	position: relative;
	vertical-align: middle;
}
.cssload-loader2 {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	margin: 1em;
	display: inline-block;
	position: relative;
	vertical-align: middle;
	background-color: rgb(255,255,255);
}
.cssload-loader2,
.cssload-loader2:before,
.cssload-loader2:after {
	animation: 0.7s infinite ease-in-out;
		-o-animation: 0.7s infinite ease-in-out;
		-ms-animation: 0.7s infinite ease-in-out;
		-webkit-animation: 0.7s infinite ease-in-out;
		-moz-animation: 0.7s infinite ease-in-out;
}
.cssload-loader2:before,
.cssload-loader2:after {
	width: 100%; 
	height: 100%;
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 0;
}
.cssload-loader2:before,.cssload-loader2:after {content: "";}
.cssload-loader2:before {
		content: "";
		width: 8px;
		height: 8px;
		margin: 0 0 0 -4px;
		background-color: rgb(30,30,30);
		top: auto;
		bottom: 0;
		left: 50%;
		transform-origin: 50% 0%;
		-o-transform-origin: 50% 0%;
		-ms-transform-origin: 50% 0%;
		-webkit-transform-origin: 50% 0%;
		-moz-transform-origin: 50% 0%;
		animation: cssload-animation2 0.7s infinite linear;
		-o-animation: cssload-animation2 0.7s infinite linear;
		-ms-animation: cssload-animation2 0.7s infinite linear;
		-webkit-animation: cssload-animation2 0.7s infinite linear;
		-moz-animation: cssload-animation2 0.7s infinite linear;
}
@keyframes cssload-animation2 {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}
@-o-keyframes cssload-animation2 {
	0% { -o-transform: rotate(0deg); }
	100% { -o-transform: rotate(360deg); }
}
@-ms-keyframes cssload-animation2 {
	0% { -ms-transform: rotate(0deg); }
	100% { -ms-transform: rotate(360deg); }
}
@-webkit-keyframes cssload-animation2 {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes cssload-animation2 {
	0% { -moz-transform: rotate(0deg); }
	100% { -moz-transform: rotate(360deg); }
}

/*-------------------------- v3 ----------------------------*/
.logo-load {
    width: 64px;
    height: 64px;
}
.logo-red-load{
    fill:#ff0483;
    transform-origin: center;
    animation: logo-red-load 1s linear infinite;
}
.logo-blue-load{
    fill:#6a91cc;
    transform-origin: center;
    animation: logo-blue-load 1s linear infinite;
}
.logo-yellow-load{
    fill:#fe0;
    transform-origin: center;
    animation: logo-yellow-load 1s linear infinite;
}


@keyframes logo-red-load {
    0% {
        transform: rotateX(75deg) rotateY(330deg) rotateZ(85deg);
    }
    100% {
        transform: rotateX(75deg) rotateY(330deg) rotateZ(-275deg);
    }
}
@keyframes logo-blue-load {
    0% {
        transform: rotateX(105deg) rotateY(30deg) rotateZ(265deg);
    }
    100% {
        transform: rotateX(105deg) rotateY(30deg) rotateZ(-95deg);
    }
}
@keyframes logo-yellow-load {
    0% {
        transform: rotateX(0deg) rotateY(105deg) rotateZ(-180deg);
    }
    100% {
        transform: rotateX(0deg) rotateY(105deg) rotateZ(180deg)
    }
}