Advertisement
Guest User

Untitled

a guest
Dec 18th, 2014
177
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.18 KB | None | 0 0
  1. #siteTable {
  2. perspective: 1000px;
  3. }
  4.  
  5. #siteTable > .thing {
  6. margin-top: 20px;
  7. margin-bottom: 20px;
  8. width: 200px;
  9. height: 200px;
  10. left: 50%;
  11. position: relative;
  12. display: inline-block;
  13. margin-right: 100px;
  14. transform-style: preserve-3d;
  15. animation: spincube 10s ease-in-out infinite;
  16. -webkit-animation: spincube 10s ease-in-out infinite;
  17. -moz-animation: spincube 10s ease-in-out infinite;
  18. left: 50px;
  19. }
  20.  
  21. #siteTable .clearleft {
  22. display: none;
  23. }
  24.  
  25. body #siteTable .thing > * {
  26. width: 200px;
  27. height: 200px;
  28. display: block;
  29. position: absolute;
  30. border: 2px solid black;
  31. margin: 0;
  32. padding: 0;
  33. }
  34.  
  35. #siteTable .thing > * {
  36. background-color: white;
  37. }
  38.  
  39. #siteTable .thing > * .arrow {
  40. transform: scale(3);
  41. }
  42.  
  43. #siteTable .thing > * .arrow.up, #siteTable .thing > * .arrow.upmod {
  44. margin-top: 18px;
  45. }
  46.  
  47. #siteTable .thing > .entry .flat-list {
  48. position: absolute;
  49. bottom: 0;
  50. }
  51.  
  52. #siteTable .thing > *:nth-child(5) {
  53. transform: rotateY( 0deg ) translateZ( 100px );
  54. }
  55.  
  56. #siteTable .thing > *:nth-child(2) {
  57. transform: rotateX( 180deg ) translateZ( 100px ) rotateZ(180deg);
  58. }
  59.  
  60. #siteTable .thing > *:nth-child(3) {
  61. transform: rotateY( 90deg ) translateZ( 100px );
  62. font-size: 82pt;
  63. }
  64.  
  65. #siteTable .thing > *:nth-child(4) {
  66. transform: rotateY( -90deg ) translateZ( 25px ) scale(4);
  67. width: 47px;
  68. height: 47px;
  69. margin-top: 77px;
  70. }
  71.  
  72. #siteTable .thing > *:nth-child(1) {
  73. transform: rotateX( 90deg ) translateZ( 100px );
  74. }
  75.  
  76. #siteTable .thing > *:nth-child(6) {
  77. transform: rotateX( -90deg ) translateZ( 100px );
  78. }
  79.  
  80. #siteTable .thing > *:nth-child(7) {
  81. visibility: hidden;
  82. }
  83.  
  84. @keyframes spincube {
  85. 0% {
  86. transform: rotateY(-90deg);
  87. }
  88.  
  89. 50% {
  90. transform: rotateY(90deg);
  91. }
  92.  
  93. 100% {
  94. transform: rotateY(-90deg);
  95. };
  96. }
  97.  
  98. @-webkit-keyframes spincube {
  99. 0% {
  100. transform: rotateY(-90deg);
  101. }
  102.  
  103. 50% {
  104. transform: rotateY(90deg);
  105. }
  106.  
  107. 100% {
  108. transform: rotateY(-90deg);
  109. };
  110. }
  111.  
  112. @-moz-keyframes spincube {
  113. 0% {
  114. transform: rotateY(-90deg);
  115. }
  116.  
  117. 50% {
  118. transform: rotateY(90deg);
  119. }
  120.  
  121. 100% {
  122. transform: rotateY(-90deg);
  123. };
  124. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement