.vcsbot * {
  display: none;
  z-index: 9 !important;
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.vcsbot .chat-button-theme-bubble {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 0px;
  height: 60px;
}

.vcsbot .chat-button {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 100%;
  cursor: pointer;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.vcsbot svg.chat-icon {
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  margin: 12px 0 0 13px;
  width: 36px;
  height: 36px;
}

.vcsbot #loading {
  font: 300 2em/100% Impact;
}

/* loading dots */

.vcsbot .loading:after {
  color: rgba(0, 255, 200, 0);
  content: " •";
  animation: dots 1s steps(5, end) infinite;
}

@keyframes dots {
  0%,
  20% {
    color: rgba(255, 147, 0, 0);
    text-shadow: 0.25em 0 0 rgba(0, 0, 0, 0), 0.5em 0 0 rgba(0, 0, 0, 0);
  }
  40% {
    color: rgba(255, 147, 0, 0);
    text-shadow: 0em 0 0 rgba(12, 188, 194, 0.29), 0.5em 0 0 rgba(0, 0, 0, 0);
  }
  50% {
    color: rgba(0, 225, 255, 0.42);
    text-shadow: 0.25em 0 0 rgba(15, 171, 192, 0.47), 0.5em 0 0 rgba(0, 0, 0, 0);
  }
  80%,
  100% {
    color: rgba(21, 197, 188, 0.42);
    text-shadow: 1.025em 0 0 rgba(4, 188, 201, 0.58),
      0.5em 0 0 rgba(10, 196, 196, 0.47);
  }
}