$n: 12

$s: 2.5em

*

  &, &:before, &:after

    margin: 0

    padding: 0

    +box-sizing(border-box)

  &:before, &:after

    content: ''

html, body

  height: 100%

body

  position: relative

  overflow: hidden

.container

  &, *, *:before, *:after

    position: absolute

    top: 0

    right: 0

    bottom: 0

    left: 0

    margin: auto

    +transform-style(preserve-3d)

  +filter(contrast(40))

  background: #555

.thing, .thingy

  width: $s

  height: $s

  +border-radius(50%)

  +filter(blur(1em))

  background: #fff

.thing

  @for $i from 0 to $n

    &:nth-child(#{$i + 1})

      +transform(rotateZ($i * 360deg / $n)translateX($s * 5))

.thingy

  animation: thingy 10s linear infinite

+keyframes(thingy)

  0%

    +transform(rotateZ(0deg)translateX($s * 5))

  100%

    +transform(rotateZ(360deg)translateX($s * 5))