.base {
  height: 9em;
  left: 50%;
  margin: -7.5em;
  padding: 3em;
  position: absolute;
  top: 50%;
  width: 9em;
  transform: rotateX(45deg) rotateZ(45deg);
  transform-style: preserve-3d;
}

.cube,
.cube:after,
.cube:before {
  content: '';
  float: left;
  height: 3em;
  position: absolute;
  width: 3em;
}

/* Top */
.cube {
  background-color: #cb9f4f;
  position: relative;
  transform: translateZ(3em);
  /*-ms-transform:translateZ(3em);*/ 	
		/*-moz-transform:translateZ(3em); 	/* Firefox */
	/*-webkit-transform:translateZ(3em);  Safari 和 Chrome */
	/*-o-transform:translateZ(3em); 	 Opera */
  transform-style: preserve-3d;
  transition: .25s;
  box-shadow: 13em 13em 1.5em rgba(0, 0, 0, 0.1);
  animation: anim 1s infinite;
  /* -webkit-animation:anim 1s infinite; Safari 和 Chrome */
}
.cube:after {
  background-color: #BE9853;
  transform: rotateX(-90deg) translateY(3em);
  /*-ms-transform:rotateX(-90deg) translateY(3em); 	 IE 9 */
		/*-moz-transform:rotateX(-90deg) translateY(3em);  Firefox */
	/* -webkit-transform:rotateX(-90deg) translateY(3em); Safari 和 Chrome */
  transform-origin: 100% 100%;
}
.cube:before {
  background-color: #AD8E55;
  transform: rotateY(90deg) translateX(3em);
  /*-ms-transform:rotateX(-90deg) translateY(3em); 	 IE 9 */
		/*-moz-transform:rotateX(-90deg) translateY(3em);  Firefox */
	/*-webkit-transform:rotateX(-90deg) translateY(3em);  Safari 和 Chrome */
  transform-origin: 100% 0;
}
.cube:nth-child(1) {
  animation-delay: 0.05s;
  /*-moz-animation-delay: 0.05s;  Firefox */
	/*-webkit-animation-delay: 0.05s;  Safari 和 Chrome */
}
.cube:nth-child(2) {
  animation-delay: 0.1s;
  /*-moz-animation-delay:  0.1s;  Firefox */
	 /* -webkit-animation-delay:  0.1s;Safari 和 Chrome */
}
.cube:nth-child(3) {
  animation-delay: 0.15s;
 /* -moz-animation-delay: 0.15s;  Firefox */
	/*-webkit-animation-delay: 0.15s;  Safari 和 Chrome */
}
.cube:nth-child(4) {
  animation-delay: 0.2s;
 
}
.cube:nth-child(5) {
  animation-delay: 0.25s;
 
}
.cube:nth-child(6) {
  animation-delay: 0.3s;
  
}
.cube:nth-child(7) {
  animation-delay: 0.35s;

}
.cube:nth-child(8) {
  animation-delay: 0.4s;

}
.cube:nth-child(9) {
  animation-delay: 0.45s;
 
}

@keyframes anim {
  50% {
    transform: translateZ(0.5em);
  }
}
@-webkit-keyframes anim {
  50% {
    transform: translateZ(0.5em);
  }
}
#loading{
	width: 100%;
	height:100%;
	/*position: absolute;*/
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.5);
	display: none;
}

