#pulsing-dot-holder {
  display: inline;
  margin: 0;
  width: 50px;
  height: 50px;
  position: relative;
  bottom: 4px;
}
#pulsing-dot-holder .dot {
  width: 10px;
  height: 10px;
  border: 5px solid #59a3ef;
  border-radius: 30px;
  background-color: #716f42;
  z-index: 10;
  position: absolute;
  left: 10px;
  top: 10px;
  animation: dot 3s ease;
  animation-iteration-count: infinite;
}
#pulsing-dot-holder .pulse {
  border: 10px solid #017eff;
  background: transparent;
  border-radius: 60px;
  height: 50px;
  width: 50px;
  animation: pulse 3s linear;
  animation-iteration-count: infinite;
  position: absolute;
  top: -10px;
  left: -10px;
  z-index: 1;
  opacity: 0;
}
@keyframes dot {
 0% {
  transform: scale(1.0);
  opacity: 1.0;
 }
 50% {
  transform: scale(0.84);
  opacity: 0.7;
 }
 100% {
  transform: scale(1.0);
  opacity: 1.0;
 }
}
@keyframes pulse {
 0% {
  transform: scale(0);
  opacity: 0.0;
 }
 10% {
  transform: scale(0);
  opacity: 0.1;
 }
 50% {
  transform: scale(0.1);
  opacity: 0.3;
 }
 75% {
  transform: scale(0.5);
  opacity: 0.5;
 }
 100% {
  transform: scale(1);
  opacity: 0.0;
 }
}