/*
  css/alertsLeaflet.css 20200913
   20200913  add zoneCountyMap definitions
   20190123  apply styling on advisory maps to details maps
   20180524  support for alerts changes to JSON
   20180516  restyling to fix larger browser windows

  alert map definitions / overrides if we are using leaflet
 */



#advisoryMap,
#homeAdvisoryMap,
#zoneCountyMap,
.nwsAlertsText > #map,
.nwsAlertsText > #detailsMap
{
  height: 100ex;
  max-height: 80vh;
}

.nwsAlertsText > #map,
.nwsAlertsText > #detailsMap
{
  /* this is needed for leaflet - or it will not position the map correctly */
  position: relative;
}

/* map popups */
.leafletAlertMapPopup
{
  font-family: verdana, helvetica, arial, sans-serif;
  font-weight: bold;
  font-size: 75%;
  margin: 0;
  padding: 0;
  background-color: #F3F2EB;
}

#advisoryMap .leaflet-popup-content,
#homeAdvisoryMap .leaflet-popup-content,
#zoneCountyMap .leaflet-popup-content,
.nwsAlertsText #detailsMap .leaflet-popup-content
{
  margin: 1ex 1em;
}

#advisoryMap .leaflet-popup-content-wrapper,
#homeAdvisoryMap .leaflet-popup-content-wrapper,
#zoneCountyMap .leaflet-popup-content-wrapper,
.nwsAlertsText #detailsMap .leaflet-popup-content-wrapper
{
  text-align: center;
}


/* at 700px we go to smaller screen mode */
@media screen and (max-width: 700px)
{
  #advisoryMap,
  #homeAdvisoryMap,
  #zoneCountyMap,
  .nwsAlertsText > #map,
  .nwsAlertsText > #detailsMap
  {
    height: 55ex;
  }
}

@media screen and (max-width: 600px)
{
  #advisoryMap,
  #homeAdvisoryMap,
  #zoneCountyMap,
  .nwsAlertsText > #map,
  .nwsAlertsText > #detailsMap
  {
    height: 40ex;
  }
}