.sav-orbit {
  width: 700px;
  height: 700px;
  position: relative;
  display: block;
  margin: 100px auto;
  overflow: visible;
}
.center-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
}
.center-logo img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 20px rgba(0,0,0,.25);
}
.orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  animation: spin 40s linear infinite;
}
.orbit .ring {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 2px solid #0E1A3D;
  pointer-events: none;
}
.orbit-outer { width:700px; height:700px; animation-duration:80s; }
.orbit-outer .ring { width:700px; height:700px; }

.planet {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80px;
  height: 80px;
  margin: -40px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 5px 20px rgba(0,0,0,.2);
}
@keyframes spin {
  from { transform: translate(-50%, -50%) rotate(0); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}