.mxd-header__logo,
.mxd-header__logo .mxd-logo {
  overflow: visible;
}

.mxd-header__logo .mxd-logo__image.logo-bubble--playing {
  position: relative;
  z-index: 20;
  transform-origin: center;
  will-change: transform;
  animation: cit-logo-bubble 2500ms cubic-bezier(.2, .85, .25, 1) both;
}

@keyframes cit-logo-bubble {
  0% { transform: translateX(0) scale(1); }
  22% { transform: translateX(12px) scale(2.35); }
  34% { transform: translateX(8px) scale(2.12); }
  46%, 72% { transform: translateX(10px) scale(2.25); }
  80% { transform: translateX(10px) scale(2.25); }
  87% { transform: translateX(4px) scale(1.55); animation-timing-function: cubic-bezier(.7, 0, 1, .6); }
  94% { transform: translateX(0) scale(1.08); animation-timing-function: cubic-bezier(.2, .85, .25, 1); }
  100% { transform: translateX(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .mxd-header__logo .mxd-logo__image.logo-bubble--playing {
    animation: none;
  }
}