Advertisement
nlozovan

Untitled

Jul 29th, 2014
239
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.33 KB | None | 0 0
  1.  
  2. #loading_ {
  3. clear: both;
  4. }
  5.  
  6. .windows8 {
  7. position: relative;
  8. width: 90px;
  9. height:90px;
  10. margin: auto;
  11. }
  12.  
  13. .windows8 .wBall {
  14. position: absolute;
  15. width: 86px;
  16. height: 86px;
  17. opacity: 0;
  18. -moz-transform: rotate(225deg);
  19. -moz-animation: orbit 7.15s infinite;
  20. -webkit-transform: rotate(225deg);
  21. -webkit-animation: orbit 7.15s infinite;
  22. -ms-transform: rotate(225deg);
  23. -ms-animation: orbit 7.15s infinite;
  24. -o-transform: rotate(225deg);
  25. -o-animation: orbit 7.15s infinite;
  26. transform: rotate(225deg);
  27. animation: orbit 7.15s infinite;
  28. }
  29.  
  30. .windows8 .wBall .wInnerBall{
  31. position: absolute;
  32. width: 11px;
  33. height: 11px;
  34. background: #60bbfc;
  35. left:0px;
  36. top:0px;
  37. -moz-border-radius: 11px;
  38. -webkit-border-radius: 11px;
  39. -ms-border-radius: 11px;
  40. -o-border-radius: 11px;
  41. border-radius: 11px;
  42. }
  43.  
  44. .windows8 #wBall_1 {
  45. -moz-animation-delay: 1.56s;
  46. -webkit-animation-delay: 1.56s;
  47. -ms-animation-delay: 1.56s;
  48. -o-animation-delay: 1.56s;
  49. animation-delay: 1.56s;
  50. }
  51.  
  52. .windows8 #wBall_2 {
  53. -moz-animation-delay: 0.31s;
  54. -webkit-animation-delay: 0.31s;
  55. -ms-animation-delay: 0.31s;
  56. -o-animation-delay: 0.31s;
  57. animation-delay: 0.31s;
  58. }
  59.  
  60. .windows8 #wBall_3 {
  61. -moz-animation-delay: 0.62s;
  62. -webkit-animation-delay: 0.62s;
  63. -ms-animation-delay: 0.62s;
  64. -o-animation-delay: 0.62s;
  65. animation-delay: 0.62s;
  66. }
  67.  
  68. .windows8 #wBall_4 {
  69. -moz-animation-delay: 0.94s;
  70. -webkit-animation-delay: 0.94s;
  71. -ms-animation-delay: 0.94s;
  72. -o-animation-delay: 0.94s;
  73. animation-delay: 0.94s;
  74. }
  75.  
  76. .windows8 #wBall_5 {
  77. -moz-animation-delay: 1.25s;
  78. -webkit-animation-delay: 1.25s;
  79. -ms-animation-delay: 1.25s;
  80. -o-animation-delay: 1.25s;
  81. animation-delay: 1.25s;
  82. }
  83.  
  84. @-moz-keyframes orbit {
  85. 0% {
  86. opacity: 1;
  87. z-index:99;
  88. -moz-transform: rotate(180deg);
  89. -moz-animation-timing-function: ease-out;
  90. }
  91.  
  92. 7% {
  93. opacity: 1;
  94. -moz-transform: rotate(300deg);
  95. -moz-animation-timing-function: linear;
  96. -moz-origin:0%;
  97. }
  98.  
  99. 30% {
  100. opacity: 1;
  101. -moz-transform:rotate(410deg);
  102. -moz-animation-timing-function: ease-in-out;
  103. -moz-origin:7%;
  104. }
  105.  
  106. 39% {
  107. opacity: 1;
  108. -moz-transform: rotate(645deg);
  109. -moz-animation-timing-function: linear;
  110. -moz-origin:30%;
  111. }
  112.  
  113. 70% {
  114. opacity: 1;
  115. -moz-transform: rotate(770deg);
  116. -moz-animation-timing-function: ease-out;
  117. -moz-origin:39%;
  118. }
  119.  
  120. 75% {
  121. opacity: 1;
  122. -moz-transform: rotate(900deg);
  123. -moz-animation-timing-function: ease-out;
  124. -moz-origin:70%;
  125. }
  126.  
  127. 76% {
  128. opacity: 0;
  129. -moz-transform:rotate(900deg);
  130. }
  131.  
  132. 100% {
  133. opacity: 0;
  134. -moz-transform: rotate(900deg);
  135. }
  136.  
  137. }
  138.  
  139. @-webkit-keyframes orbit {
  140. 0% {
  141. opacity: 1;
  142. z-index:99;
  143. -webkit-transform: rotate(180deg);
  144. -webkit-animation-timing-function: ease-out;
  145. }
  146.  
  147. 7% {
  148. opacity: 1;
  149. -webkit-transform: rotate(300deg);
  150. -webkit-animation-timing-function: linear;
  151. -webkit-origin:0%;
  152. }
  153.  
  154. 30% {
  155. opacity: 1;
  156. -webkit-transform:rotate(410deg);
  157. -webkit-animation-timing-function: ease-in-out;
  158. -webkit-origin:7%;
  159. }
  160.  
  161. 39% {
  162. opacity: 1;
  163. -webkit-transform: rotate(645deg);
  164. -webkit-animation-timing-function: linear;
  165. -webkit-origin:30%;
  166. }
  167.  
  168. 70% {
  169. opacity: 1;
  170. -webkit-transform: rotate(770deg);
  171. -webkit-animation-timing-function: ease-out;
  172. -webkit-origin:39%;
  173. }
  174.  
  175. 75% {
  176. opacity: 1;
  177. -webkit-transform: rotate(900deg);
  178. -webkit-animation-timing-function: ease-out;
  179. -webkit-origin:70%;
  180. }
  181.  
  182. 76% {
  183. opacity: 0;
  184. -webkit-transform:rotate(900deg);
  185. }
  186.  
  187. 100% {
  188. opacity: 0;
  189. -webkit-transform: rotate(900deg);
  190. }
  191.  
  192. }
  193.  
  194. @-ms-keyframes orbit {
  195. 0% {
  196. opacity: 1;
  197. z-index:99;
  198. -ms-transform: rotate(180deg);
  199. -ms-animation-timing-function: ease-out;
  200. }
  201.  
  202. 7% {
  203. opacity: 1;
  204. -ms-transform: rotate(300deg);
  205. -ms-animation-timing-function: linear;
  206. -ms-origin:0%;
  207. }
  208.  
  209. 30% {
  210. opacity: 1;
  211. -ms-transform:rotate(410deg);
  212. -ms-animation-timing-function: ease-in-out;
  213. -ms-origin:7%;
  214. }
  215.  
  216. 39% {
  217. opacity: 1;
  218. -ms-transform: rotate(645deg);
  219. -ms-animation-timing-function: linear;
  220. -ms-origin:30%;
  221. }
  222.  
  223. 70% {
  224. opacity: 1;
  225. -ms-transform: rotate(770deg);
  226. -ms-animation-timing-function: ease-out;
  227. -ms-origin:39%;
  228. }
  229.  
  230. 75% {
  231. opacity: 1;
  232. -ms-transform: rotate(900deg);
  233. -ms-animation-timing-function: ease-out;
  234. -ms-origin:70%;
  235. }
  236.  
  237. 76% {
  238. opacity: 0;
  239. -ms-transform:rotate(900deg);
  240. }
  241.  
  242. 100% {
  243. opacity: 0;
  244. -ms-transform: rotate(900deg);
  245. }
  246.  
  247. }
  248.  
  249. @-o-keyframes orbit {
  250. 0% {
  251. opacity: 1;
  252. z-index:99;
  253. -o-transform: rotate(180deg);
  254. -o-animation-timing-function: ease-out;
  255. }
  256.  
  257. 7% {
  258. opacity: 1;
  259. -o-transform: rotate(300deg);
  260. -o-animation-timing-function: linear;
  261. -o-origin:0%;
  262. }
  263.  
  264. 30% {
  265. opacity: 1;
  266. -o-transform:rotate(410deg);
  267. -o-animation-timing-function: ease-in-out;
  268. -o-origin:7%;
  269. }
  270.  
  271. 39% {
  272. opacity: 1;
  273. -o-transform: rotate(645deg);
  274. -o-animation-timing-function: linear;
  275. -o-origin:30%;
  276. }
  277.  
  278. 70% {
  279. opacity: 1;
  280. -o-transform: rotate(770deg);
  281. -o-animation-timing-function: ease-out;
  282. -o-origin:39%;
  283. }
  284.  
  285. 75% {
  286. opacity: 1;
  287. -o-transform: rotate(900deg);
  288. -o-animation-timing-function: ease-out;
  289. -o-origin:70%;
  290. }
  291.  
  292. 76% {
  293. opacity: 0;
  294. -o-transform:rotate(900deg);
  295. }
  296.  
  297. 100% {
  298. opacity: 0;
  299. -o-transform: rotate(900deg);
  300. }
  301.  
  302. }
  303.  
  304. @keyframes orbit {
  305. 0% {
  306. opacity: 1;
  307. z-index:99;
  308. transform: rotate(180deg);
  309. animation-timing-function: ease-out;
  310. }
  311.  
  312. 7% {
  313. opacity: 1;
  314. transform: rotate(300deg);
  315. animation-timing-function: linear;
  316. origin:0%;
  317. }
  318.  
  319. 30% {
  320. opacity: 1;
  321. transform:rotate(410deg);
  322. animation-timing-function: ease-in-out;
  323. origin:7%;
  324. }
  325.  
  326. 39% {
  327. opacity: 1;
  328. transform: rotate(645deg);
  329. animation-timing-function: linear;
  330. origin:30%;
  331. }
  332.  
  333. 70% {
  334. opacity: 1;
  335. transform: rotate(770deg);
  336. animation-timing-function: ease-out;
  337. origin:39%;
  338. }
  339.  
  340. 75% {
  341. opacity: 1;
  342. transform: rotate(900deg);
  343. animation-timing-function: ease-out;
  344. origin:70%;
  345. }
  346.  
  347. 76% {
  348. opacity: 0;
  349. transform:rotate(900deg);
  350. }
  351.  
  352. 100% {
  353. opacity: 0;
  354. transform: rotate(900deg);
  355. }
  356.  
  357. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement