.div-marker {
  .marker-name {
    font-size: 16px;
    color: #ffffff;
    font-weight: 600;
    text-shadow: 1px 1px 0px #000000;
    padding: 3px 13px;
    letter-spacing: 2px;
    border-radius: 14px;
  }

  .color-uav{
    background: linear - gradient(to bottom, rgba(135, 206, 235, 0.1), rgba(34, 232, 174, 1));  
    border: 1px solid #22E8AE;
    &:after{
      content: "";
      position: absolute;
      bottom: -73px;
      left: calc(50% - 2px);
      display: block;
      width: 3px;
      height: 70px;
      border-right: 3px solid #22E8AE;
  }
  }

  .color-school{
    background: linear - gradient(to bottom, rgba(135, 206, 235, 0.1), rgba(89, 249, 255, 1));  
    border: 1px solid #59F9FF;
    &:after{
      content: "";
      position: absolute;
      bottom: -73px;
      left: calc(50% - 2px);
      display: block;
      width: 3px;
      height: 70px;
      border-right: 3px solid #59F9FF;
  }
  }
  .color-park{
    background: linear - gradient(to bottom, rgba(135, 206, 235, 0.1), rgba(51, 224, 100, 1));  
    border: 1px solid #33E064;
    &:after{
      content: "";
      position: absolute;
      bottom: -73px;
      left: calc(50% - 2px);
      display: block;
      width: 3px;
      height: 70px;
      border-right: 3px solid #33E064;
  }
  }
 

  
  .marker-icon{
    display: block;
    margin: auto;
    margin-top:5px;
    width: 40px;
    height: 60px;
   
  }
}


