/*魔方*/
.mofang {
	width:60px;
	height:60px;
	margin:0 auto;
	position:fixed;
	z-index:999;
	-webkit-perspective:1000px;
	perspective:1000px;
	right:0;
	bottom:0;
	-webkit-transform:translate(-80%,-80%);
	transform:translate(-80%,-80%)
}
.cube {
	width:100%;
	height:100%;
	position:absolute;
	-webkit-transform-style:preserve-3d;
	transform-style:preserve-3d;
	-webkit-transform:rotateX(-15deg) rotateY(-20deg) translateZ(-100px);
	transform:rotateX(-15deg) rotateY(-20deg) translateZ(-100px);
	-webkit-transform-origin:center center -100px;
	transform-origin:center center -100px;
	-webkit-animation:around 5s cubic-bezier(.94,-.6,.45,1.31) infinite;
	animation:around 5s cubic-bezier(.94,-.6,.45,1.31) infinite
}
.cube div {
	width:80px;
	height:80px;
	display:block;
	margin:0;
	position:absolute
}
.cube div a {
	color:#fff;
	text-decoration:none;
	text-align:center;
	position:fixed;
	top:50%;
	left:50%;
	-webkit-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
	line-height:normal;
	font-size:16px;
	letter-spacing:3px
}
.cube .front {
	-webkit-transform:rotateY(0) translateZ(40px);
	transform:rotateY(0) translateZ(40px);
	background-color:rgba(0,191,255,.7);
	border:2px solid rgba(0,191,255,.7)
}
.cube .back {
	-webkit-transform:rotateX(180deg) translateZ(40px);
	transform:rotateX(180deg) translateZ(40px);
	background-color:rgba(124,252,0,.7);
	border:2px solid rgba(124,252,0,.7)
}
.cube .left {
	-webkit-transform:rotateY(-90deg) translateZ(40px);
	transform:rotateY(-90deg) translateZ(40px);
	background-color:rgba(255,215,0,.7);
	border:2px solid rgba(255,215,0,.7)
}
.cube .right {
	-webkit-transform:rotateY(90deg) translateZ(40px);
	transform:rotateY(90deg) translateZ(40px);
	background-color:rgba(255,69,0,.7);
	border:2px solid rgba(255,69,0,.7)
}
.cube .top {
	-webkit-transform:rotateX(90deg) translateZ(40px);
	transform:rotateX(90deg) translateZ(40px);
	background-color:rgba(255,0,157,.7);
	border:2px solid rgba(255,0,157,.7)
}
.cube .xaimian {
	-webkit-transform:rotateX(-90deg) translateZ(40px);
	transform:rotateX(-90deg) translateZ(40px);
	background-color:rgba(184,111,220,.7);
	border:2px solid rgba(184,111,220,.7)
}
@-webkit-keyframes around {
	100% {
	-webkit-transform:rotateX(-15deg) rotateY(-380deg) translateZ(-100px);
	transform:rotateX(-15deg) rotateY(-380deg) translateZ(-100px)
}
}@keyframes around {
	100% {
	-webkit-transform:rotateX(-15deg) rotateY(-380deg) translateZ(-100px);
	transform:rotateX(-15deg) rotateY(-380deg) translateZ(-100px)
}
}@media only screen and (max-width:767px) {
	.mofang {
	width:40px;
	height:40px;
	-webkit-transform:translate(-100%,-100%);
	transform:translate(-100%,-100%);
}
.cube div {
	width:60px;
	height:60px
}
.cube div a {
	font-size:12px;
	letter-spacing:2px
}
.cube .front {
	-webkit-transform:rotateY(0) translateZ(30px);
	transform:rotateY(0) translateZ(30px);
}
.cube .back {
	-webkit-transform:rotateX(180deg) translateZ(30px);
	transform:rotateX(180deg) translateZ(30px)
}
.cube .left {
	-webkit-transform:rotateY(-90deg) translateZ(30px);
	transform:rotateY(-90deg) translateZ(30px)
}
.cube .right {
	-webkit-transform:rotateY(90deg) translateZ(30px);
	transform:rotateY(90deg) translateZ(30px)
}
.cube .top {
	-webkit-transform:rotateX(90deg) translateZ(30px);
	transform:rotateX(90deg) translateZ(30px)
}
.cube .xaimian {
	-webkit-transform:rotateX(-90deg) translateZ(30px);
	transform:rotateX(-90deg) translateZ(30px)
}
}