.TaiChi {
  font-size: 0;
  width: 400px;
  height: 400px;
  border-radius: 50%;
  overflow: hidden; }
  .TaiChi .half {
    position: relative;
    display: inline-block;
    height: 100%;
    width: 50%; }
    .TaiChi .half:before, .TaiChi .half:after {
      position: absolute;
      content: ''; }
    .TaiChi .half:before {
      width: 25%;
      height: 12.5%;
      border-radius: 50%;
      z-index: 2; }
    .TaiChi .half:after {
      width: 100%;
      height: 50%;
      border-radius: 50%;
      z-index: 1;
      background: inherit; }
  .TaiChi .black {
    background: #000; }
    .TaiChi .black:before {
      top: 25%;
      right: 0;
      transform: translate3d(50%, -50%, 0);
      background: #fff; }
    .TaiChi .black:after {
      left: 50%; }
  .TaiChi .white {
    background: #fff; }
    .TaiChi .white:before {
      left: 0;
      bottom: 25%;
      transform: translate3d(-50%, 50%, 0);
      background: #000; }
    .TaiChi .white:after {
      bottom: 0;
      right: 50%; }

.TaiChi {
  margin: 100px auto;
  animation: rotate 3s linear infinite; }

@keyframes rotate {
  0% {
    transform: rotateZ(0); }
  100% {
    transform: rotateZ(360deg); } }