mapnav menuitem {
   position:relative;
   display:block;
   opacity:0;
   cursor:pointer;
   z-index: 2;
}

mapnav menuitem > menu {
   position: absolute;
   pointer-events:none;
   z-index: 2;
}
mapnav > menu { 
   display:flex; 
   z-index: 2;
}

mapnav > menu > menuitem { pointer-events: all; opacity:0.75; }
menu menuitem a { white-space:nowrap; display:block; }
menu menuitem input { white-space:nowrap; display:block; }
   
menuitem:hover > menu {
   pointer-events:initial;
}
menuitem:hover > menu > menuitem,
menu:hover > menuitem{
   opacity:1;
}
mapnav > menu > menuitem menuitem menu {
   transform:translateX(100%);
   top:0; right:0;
}
/* User Styles Below Not Required */
/* User Styles Below Not Required */
/* User Styles Below Not Required */

mapnav { 
   margin-top: 0px;
   margin-left: 10px;
}

mapnav a {
   background:white;
   color:black;
   font-size:16px;
   min-width:90px;
   transition: background 0.5s, color 0.5s, transform 0.5s;
   margin:4px 4px 0px 0px;
   padding:4px 4px;
   box-sizing:border-box;
   border-radius:2px;
   box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
   position:relative;
}

mapnav input {
   background:white;
   color:black;
   font-size:16px;
   min-width:90px;
   transition: background 0.5s, color 0.5s, transform 0.5s;
   margin:4px 4px 0px 0px;
   padding:4px 4px;
   box-sizing:border-box;
   border-radius:2px;
   box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
   position:relative;
}

/*
mapnav > menu > menuitem > a + menu:after{
   content: '';
   position:absolute;
   border:10px solid transparent;
   border-top: 10px solid black;
   left:12px;
   top: -40px;  
}
*/
mapnav menuitem > menu > menuitem > a + menu:after{ 
   content: '';
   position:absolute;
   border:1px solid transparent;
   border-left: 10px solid black;
   top: 20px;
   left:-180px;
   transition: opacity 0.6, transform 0s;
}

mapnav > menu > menuitem > menu > menuitem{
   transition: transform 0.6s, opacity 0.6s;
   transform:translateY(150%);
   opacity:0;
}
mapnav > menu > menuitem:hover > menu > menuitem,
mapnav > menu > menuitem.hover > menu > menuitem{
   transform:translateY(0%);
   opacity: 1;
}

menuitem > menu > menuitem > menu > menuitem{
   transition: transform 0.6s, opacity 0.6s;
   transform:translateX(195px) translateY(0%);
   opacity: 0;
} 
menuitem > menu > menuitem:hover > menu > menuitem,  
menuitem > menu > menuitem.hover > menu > menuitem{  
   transform:translateX(0) translateY(0%);
   opacity: 1;
}

.mapLabel-tag {
  background: transparent;
  color: white;
  font-size: 10px;
  position: relative;
}

.taxAddr-tag {
  /*background: rgba(0,0,0,0.5);*/
  background: black;
  border-radius: 2px;
  color: white;
  font-size: 10px;
  padding: 1px 1px;
  position: relative;
}
 
.taxAddr-tag::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, 0);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid black;
}
.marker-tag {
    /*background: rgba(0,0,0,0.5);
    border-radius: 2px;
    border:1px solid red;
    */
    background: rgba(0,0,0,0.0);
    width:30px;
    height:30px;
    }

.marker-tag::after {
  content: ""; /* Essential for pseudo-elements to render */
  display: block; /* Or inline-block, depending on desired layout */
  width: 4px; /* Adjust size as needed */
  height: 4px; /* Adjust size as needed */
  background-color: red;
  border-radius: 50%; /* Creates a perfect circle */
  /* Positioning (optional, for specific placement relative to the parent) */
  position: absolute;
  bottom: -5px;
  left: 13px;
}

