.submenuContent {
  display: none;
  padding: 10px 12px;
  border: 1px solid #ccc;
  border-top: none;
/*  background: #f9f9f9;*/
margin-bottom:5px;    
}

.submenuContent.open {
  display: block;
}

.submenu h3 {
  cursor: pointer;
  background-color: #f0f0f0;
  padding: 10px 12px;
  margin: 0;
  border: 1px solid #ccc;
  font-size: 15px;
  font-weight: bold;
  position: relative;
  user-select: none;
  transition: background-color 0.2s ease;
}

.submenu h3:hover {
  background-color: #e0e0e0;
}

.submenu h3::after {
  content: '▼';
  position: absolute;
  right: 12px;
  transition: transform 0.2s ease;
    color: #1fd32e;
}

.submenu h3.open::after {
  transform: rotate(180deg);
    color: red;
}

#alternativeMaps {
  font-family: sans-serif;
}

.other-title {
  cursor: pointer;
  font-weight: bold;
  padding: 6px 0;
  display: block;
}

.other-title i {
  font-style: normal;
  margin-right: 6px;
}


#mapSearchBox {
  font-size: 0.9em;
  background-color: white; /* fallback */
  transition: background 0.2s ease;
}
@keyframes stripedFill {
  0%   { background-size: 0% 100%; }
  100% { background-size: 100% 100%; }
}

.search-loading {
  background-image: repeating-linear-gradient(
    45deg,
    #88dd88,
    #88dd88 10px,
    #7acc7a 10px,
    #7acc7a 20px
  );
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 0% 100%;
  animation: stripedFill 3s linear infinite;
}

.map-highlight {
  border-left: 4px solid #28a745;
  padding-left: 6px;
  background-color: #f6d1a6;
  margin-left: -10px;
}
.mapcolouring {
        text-decoration: none;
}