3D Photos / style.css

body {  
  padding: 0px;  
  margin: 0px;  
}  
  
.stage {  
  width: 100%;  
  height: 100%;  
  -webkit-transform-style: preserve-3d;  
  -webkit-transform: rotateX(-45deg);  
  -webkit-perspective: 400;  
}  
  
.rotate {  
  -webkit-transform-style: preserve-3d;  
  -webkit-transform: rotateX(-40deg);  
  -webkit-animation: spinY 8s infinite linear;  
}  
  
.image {  
  position: absolute;  
  left: 120px; /* = (320-80)/2 */  
  height: 80px;  
  width: 80px;  
  border: 10px solid #888;  
  opacity: 0.8;  
}  
  
.image1 {  
  -webkit-transform: rotateY(0deg) translateZ(100px);  
}  
  
.image2 {  
  -webkit-transform: rotateY(72deg) translateZ(100px);  
}  
  
.image3 {  
  -webkit-transform: rotateY(144deg) translateZ(100px);  
}  
  
.image4 {  
  -webkit-transform: rotateY(216deg) translateZ(100px);  
}  
  
.image5 {  
  -webkit-transform: rotateY(288deg) translateZ(100px);  
}  
  
@-webkit-keyframes spinY {  
    0% { -webkit-transform: rotateY(0deg); }  
   50% { -webkit-transform: rotateY(180deg); }  
  100% { -webkit-transform: rotateY(360deg); }  
}  
body {   padding: 0px;   margin: 0px; }  .stage {   width: 100%;   height: 100%;   -webkit-transform-style: preserve-3d;   -webkit-transform: rotateX(-45deg);   -webkit-perspective: 400; }  .rotate {   -webkit-transform-style: preserve-3d;   -webkit-transform: rotateX(-40deg);   -webkit-animation: spinY 8s infinite linear; }  .image {   position: absolute;   left: 120px; /* = (320-80)/2 */   height: 80px;   width: 80px;   border: 10px solid #888;   opacity: 0.8; }  .image1 {   -webkit-transform: rotateY(0deg) translateZ(100px); }  .image2 {   -webkit-transform: rotateY(72deg) translateZ(100px); }  .image3 {   -webkit-transform: rotateY(144deg) translateZ(100px); }  .image4 {   -webkit-transform: rotateY(216deg) translateZ(100px); }  .image5 {   -webkit-transform: rotateY(288deg) translateZ(100px); }  @-webkit-keyframes spinY {     0% { -webkit-transform: rotateY(0deg); }    50% { -webkit-transform: rotateY(180deg); }   100% { -webkit-transform: rotateY(360deg); } }                  $(document).ready(function() {   dp.SyntaxHighlighter.HighlightAll('code'); });