.customMarker {
  position: absolute;
  cursor: pointer;
  /*background: #fba511;*/
  background: #ff6600;  /*edit by Nan 20190110*/
  width: 50px;
  height: 50px;
  margin-left: -25px;
  /* -width/2 */
  margin-top: -60px;
  /* -height + arrow */
  border-radius: 50%;
  padding: 0px;
}

.customMarker:after {
  content: "";
  position: absolute;
  bottom: -7px;
  left: 16px;
  border-width: 10px 10px 0;
  border-style: solid;
  /*border-color: #fba511 transparent;*/
  border-color: #ff6600 transparent; /*edit by Nan 20190110*/
  display: block;
  width: 0;
}
.customMarker img {
  width: 40px;
  height: 40px;
  margin: 5px;
  border-radius: 50%;
}

.customMarkerOld {
  position: absolute;
  cursor: pointer;
  background: #dcdcdc;
  width: 50px;
  height: 50px;
  margin-left: -25px;
  /* -width/2 */
  margin-top: -60px;
  /* -height + arrow */
  border-radius: 50%;
  padding: 0px;
}
.customMarkerOld:after {
  content: "";
  position: absolute;
  bottom: -7px;
  left: 16px;
  border-width: 10px 10px 0;
  border-style: solid;
  border-color: #dcdcdc transparent;
  display: block;
  width: 0;
}
.customMarkerOld img {
  width: 40px;
  height: 40px;
  margin: 5px;
  border-radius: 50%;
}

.circle-ripple {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  animation: ripple 0.7s linear infinite;
}
@keyframes ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(51, 214, 149, 0.3), 0 0 0 0.5em rgba(51, 214, 149, 0.3), 0 0 0 1em rgba(51, 214, 149, 0.3), 0 0 0 2em rgba(51, 214, 149, 0.3);
  }
  100% {
    box-shadow: 0 0 0 0.5em rgba(51, 214, 149, 0.3), 0 0 0 1em rgba(51, 214, 149, 0.3), 0 0 0 1.5em rgba(51, 214, 149, 0.3), 0 0 0 2em rgba(51, 214, 149, 0);
  }
}