#container {
  margin-top: 20px;
  margin-left: 30px;
  position: relative;
  background: green;
}

.pulse {
  width: 10px;
  height: 10px;
  border: 2px solid green;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  background-color: rgb(102,205,77);
  z-index: 10;
  position: absolute;
}

.dot {
  border: 10px solid rgb(102,205,77);
  background: transparent;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  border-radius: 60px;
  height: 50px;
  width: 50px;
  -webkit-animation: pulse 3s ease-out;
  -moz-animation: pulse 3s ease-out;
  animation: pulse 3s ease-out;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  position: absolute;
  top: -25px;
  left: -25px;
  z-index: -12;
  opacity: 0;
}

@-moz-keyframes pulse {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}

@-webkit-keyframes "pulse" {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 0.5;}
    100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}