.muni-app{
  position: relative;
  background-color: white;
}
.ifgr_map_wrapper{
  position: relative;
}
.leyenda-wrapper{
  position: relative;
  width: 400px;
  height: 60px;
  margin: auto;
}

.cambia-msg{
  position: absolute;
  width: 100%;
  top: 47px;
  background: white;
  padding: 20px;
  display: none;
}
.cambia-msg span{
  font-size: 1.4em;
  line-height: 1.3em;
}

div#leyenda{
  height: 60px;
}
div#leyenda svg.menu{
  margin-left: 0 !important;
  padding: 0;
}
.wrapper-ui {
  position: absolute;
  z-index: 333;
  top: 15vh;
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;

}

div#geocoder{
  position: relative;
  margin-top: 10px;
  width: 350px;
  top:0;
  right: 15px;
}

nav#menu {
  position: relative;
  display: flex;
  top: initial;
  left: 50px;
  margin: 0;
  height: 49px;
}
nav#menu button{
  font-size: 1.3rem;
  width: 33.3%;
}
.mapboxgl-popup{
  top: 13rem;
  right: 15px;
}
.mapboxgl-popup-content .data{
  vertical-align: top;
  min-height: 106px;
  overflow-wrap: anywhere;
}
.nav-mapa{
  position: absolute;
  top: 250px;
  left: 50px;
  z-index: 44;
}
.nav-mapa button{
  width: 40px;
  height: 40px;
  background-color: antiquewhite;
  display: block;
  margin: 10px 0;
  text-indent: -1000px;
  border-radius: 6px;
  border: 1px solid black;
  cursor: pointer;
  background-position-x: -4px;
}
.nav-mapa button:hover{
  opacity: .8;
}
.nav-mapa button.active{
  box-shadow: 0px 0px 2px black inset;
}
.icon-map-peninsula{
  background-image: url('https://css2.rtve.es/css/rtve.2023.noticias/cadaveres-hormigon/i/Icon_Spain-000000.svg');
  background-size: cover;
}
.icon-map-canarias{
  background-image: url('https://css2.rtve.es/css/rtve.2023.noticias/cadaveres-hormigon/i/Icon_Canarias-000000.svg');
  background-size: cover;
}
button#fit{
  z-index: -1;
}
button.cerrar-msg{
  display: none !important;
}
@media screen and (max-width: 968px) {
  nav#menu{
    left: 0;
  }
  nav#menu button {
    font-size: 1rem;
  }
  .leyenda-wrapper{
    width: 302px;
  }
  .wrapper-ui {
    right: 0;
    left: 6%;
    top: 7vh;
    width: 90%;
    height: auto;
    display: block;
  }
  .nav-mapa{
    top: initial;
    left: 0;
    bottom: 0;
    display: flex;
    gap: 4px;
  }
  div#leyenda{
    border-bottom: 0px;
  }
  div#geocoder{
    width: 100%;
    right: 0;
  }
  .mapboxgl-popup{
    top: auto;
    bottom: 7px;
    margin-left: 50%;
    left: -143px;
    z-index: 999;
    right: initial;
  }
  div#map.mapboxgl-map{
    height: calc(100vh - 9rem);
  }
  button.cerrar-msg {
    position: absolute;
    display: block !important;
    top: 5px;
    right: 0;
    background: white !important;
    width: 40px !important;
    height: 40px !important;
  }
  .cambia-msg span{
    font-size: 1.2em;
    width: 82%;
    display: block;
  }
}

@media screen and (min-width: 1024px) {
  .ifgr_map_wrapper{
    left: calc(-1* (((100vw + 2rem) - 108rem) / 2));
    width: calc(100vw);
    position: relative;
    margin-right: calc(-1* (((100vw + 2rem) - 108rem) / 2));
    margin-bottom: 2rem;
    padding-bottom: 6rem;
  }
}

/* @media (min-width: 768px) and (max-width: 1023px) {
  .ifgr_map_wrapper{
    left: calc(-1* (((100vw + 2rem) - 98rem) / 2));
    width: calc(100vw);
    position: relative;
    margin-right: calc(-1* (((100vw + 2rem) - 108rem) / 2));
    margin-bottom: 2rem;
    padding-bottom: 6rem;
  }
} */