<div class="button">
  Download it!
  <span>
    <span></span>
  </span>
</div>

@import "bourbon";

$btn-color: #3CA2A2;

@include keyframes( orbit ) {
  0% {
    @include transform( rotateY(90deg) rotate(0deg) );
  }
  60% {
    @include transform( rotateY(90deg) rotate( -180deg ) );
  }
  100% {
    @include transform( rotateY(90deg) rotate( -360deg ) );
  }
}
body {
  margin: 100px auto;
  text-align: center;
}
.button {
  display: inline-block;
  border-radius: 10px;
  border: 1px solid rgba(#000, 0.05);
  position: relative;
  padding: 20px 30px 20px 70px;
  background: rgba($btn-color, 0.6);
  color: rgba(#000, 0.5);
  cursor: pointer;
  @include transform-style( preserve-3d );
  @include transition( all 500ms ease-in-out);
  &:hover {
    @include transform( translateY(-5px));
    color: rgba(#000, 0.8);
    background: rgba($btn-color, 0.8);
    > span {
      @include transition( all 800ms ease-in-out);
      @include transform( rotateY(90deg) rotate( -360deg ) );
     }
  }
  > span {
    width: 80px;
    display: block;
    position: absolute;
    left: 0;
    top: -40px;
    bottom: -40px;
    border-radius: 50%;
    @include transform-style( preserve-3d );
    @include transform( rotateY(90deg) rotate(0deg) );
    > span {
      position: absolute;
      background: rgba(0,0,0,0.6);
      width: 16px;
      height: 17px;
      left: 0;
      top: 50px;
      @include transform( rotateY(-90deg) );
      &::before {
        position: absolute;
        content: '';
        top: 100%;
        left: 0;
        margin-left: -7px;
        border: {
          top: 16px solid rgba(0,0,0,0.6);
          bottom: 0 solid transparent;
          left: 15px solid transparent;
          right: 15px solid transparent;
        }
      }
    }
  }
}