.windows8 {
  position:relative;
  width:78px;
  height:78px;
  margin:auto;
  padding-top:50px;
}

.windows8 .wBall {
  position:absolute;
  width:74px;
  height:74px;
  opacity:0;
  transform:rotate(225deg);
  -o-transform:rotate(225deg);
  -ms-transform:rotate(225deg);
  -webkit-transform:rotate(225deg);
  -moz-transform:rotate(225deg);
  animation:orbit 6.96s infinite;
  -o-animation:orbit 6.96s infinite;
  -ms-animation:orbit 6.96s infinite;
  -webkit-animation:orbit 6.96s infinite;
  -moz-animation:orbit 6.96s infinite;
}

.windows8 .wBall .wInnerBall {
  position:absolute;
  width:10px;
  height:10px;
  background:rgb(0,0,0);
  left:0px;
  top:0px;
  border-radius:10px;
}

.windows8 #wBall_1 {
  animation-delay:1.52s;
  -o-animation-delay:1.52s;
  -ms-animation-delay:1.52s;
  -webkit-animation-delay:1.52s;
  -moz-animation-delay:1.52s;
}

.windows8 #wBall_2 {
  animation-delay:0.3s;
  -o-animation-delay:0.3s;
  -ms-animation-delay:0.3s;
  -webkit-animation-delay:0.3s;
  -moz-animation-delay:0.3s;
}

.windows8 #wBall_3 {
  animation-delay:0.61s;
  -o-animation-delay:0.61s;
  -ms-animation-delay:0.61s;
  -webkit-animation-delay:0.61s;
  -moz-animation-delay:0.61s;
}

.windows8 #wBall_4 {
  animation-delay:0.91s;
  -o-animation-delay:0.91s;
  -ms-animation-delay:0.91s;
  -webkit-animation-delay:0.91s;
  -moz-animation-delay:0.91s;
}

.windows8 #wBall_5 {
  animation-delay:1.22s;
  -o-animation-delay:1.22s;
  -ms-animation-delay:1.22s;
  -webkit-animation-delay:1.22s;
  -moz-animation-delay:1.22s;
}

@keyframes orbit {
  0% {
    opacity:1;
    z-index:99;
    transform:rotate(180deg);
    animation-timing-function:ease-out;
  }
  7% {
    opacity:1;
    transform:rotate(300deg);
    animation-timing-function:linear;
    origin:0%;
  }
  30% {
    opacity:1;
    transform:rotate(410deg);
    animation-timing-function:ease-in-out;
    origin:7%;
  }
  39% {
    opacity:1;
    transform:rotate(645deg);
    animation-timing-function:linear;
    origin:30%;
  }
  70% {
    opacity:1;
    transform:rotate(770deg);
    animation-timing-function:ease-out;
    origin:39%;
  }
  75% {
    opacity:1;
    transform:rotate(900deg);
    animation-timing-function:ease-out;
    origin:70%;
  }
  76% {
    opacity:0;
    transform:rotate(900deg);
  }
  100% {
    opacity:0;
    transform:rotate(900deg);
  }
}

