.lhp-map {
  height: 100%;
  width: auto;
  background: #F7F7F7;
}

#map-warnungen {
	background: #6E6E6E !important;
}

/* .leaflet-container
{
  background: #FFF !important;
}
*/

.infoControl {
  padding: 6px 8px;
  font-family: "fira sans", sans-serif;
  font-size: 14px;
  font-weight: 300;
  background: white;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
}

.logoControl {
    background-image: url("../images/logo_lhp2024.svg");
    background-size:contain; 
    background-repeat: no-repeat;
    width: 100px;
    height: 52px;
}

.logoControlBefore {
    background-image: url("../images/logo_lhp2024.svg");
    background-size:contain; 
    background-repeat: no-repeat;
    width: 100px;
    height: 52px;
    position: absolute;
    left: 80px;
    top: -60px;
}

/* icon für staedte eo1 */
.city-eo1-icon {
  width: 8px;
  height: 8px;
  background: #262626;
  border: 0.75px solid #fff;
}
.nachbar-label1 {
  /* position: absolute; */
  font-size: 9.5px;
  font-weight: bold;
  text-shadow: 1px 1px #fff;
}
/* labels für staedte basemap*/
.city-label1 {
  position: absolute;
  font-size: 10.5px;
  font-weight: bold;
  text-shadow: 1px 1px #fff;
}

.city-label2 {
  position: absolute;
  font-size: 9.5px;
  text-shadow: 1px 1px #fff;
}

.city-label3 {
  position: absolute;
  font-size: 9px;
  text-shadow: 1px 1px #fff;
}

.leaflet-tooltip.city-label1, .leaflet-tooltip.city-label2, .leaflet-tooltip.city-label3, .leaflet-tooltip.nachbar-label1 {
  background-color: transparent;
  border: transparent;
  box-shadow: none;
}
/*Popup Warngebiete ohne border oben/unten*/
.leaflet-popup-scrolled{
  border-bottom: none !important;
  border-top: none !important;
}
/*Kurzinformationen/ Infotext der bundeslaender oder Warnungstext*/
.lhp-info h4 {
  margin: 0 0 5px;
  color: #7b7b7b;
}

.lhp-info {
  padding: 6px 8px;
}

/* Legenden*/
.legende-title {
  color: #404040;
}

.legende {
  font-family: "fira sans", sans-serif;
  font-size: 11px;
  font-weight: 300;
  background: white;
/*  background: rgba(206, 206, 206, 0.3); */
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
}

.legende h1 {
  font-size:12px;
  margin-bottom: 3px;
}

.legende-pegel {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  opacity: 0.7;
  border:1px solid #262626;
}
.legende-laender {
  width: 12px;
  height: 12px;
  display: inline-block;
  margin-right: 8px;
  margin-bottom: -5px;
  opacity: 0.25;
  border: black 1px solid;
}

.legende-ezg {
  width: 12px;
  height: 12px;
  display: inline-block;
  margin-right: 8px;
  margin-bottom: 0px;
  opacity: 0.6;
  border: black 1px solid;
}

.legende-warnungen {
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 8px;
  margin-bottom: -5px;
  opacity: 0.7;
  border: gray 1px solid;
}
/*infoseite legende der warnungen*/
#lhp-legende-info{
padding: 10px;
}
.legende-warnungen-info {
  width: 28px;
  height: 28px;
  display: inline-block;
  margin-right: 8px;
  margin-bottom: -5px;
  margin-left: 10px;
  opacity: 0.7;
  border: gray 1px solid;
}
/* Lagebrichte > SVG Ubersichtskarte DE*/
/* .land {
  fill: #cecece;
  fill-opacity: 1.0;
  stroke: #000;
  stroke-width: 0.4;
} */

/* .land:hover {
  fill: #404040;
  fill-opacity: 1.0;
  stroke: #fff;
  stroke-width: 0.4;
} */

/* .land:active {
  fill: #A7A7A7;
  fill-opacity: 1.0;
  stroke: #fff;
  stroke-width: 0.4;
}

.landclick {
  fill: #A7A7A7;
  fill-opacity: 1.0;
  stroke: #fff;
  stroke-width: 0.4;
} */

/*Kurzinformationen der Länder (Infobox oben rechts) in Aktuelle Situation*/
.info {
    /* padding: 1px 1px; */
/*     font: 12px "fira sans", sans-serif; */
    font: 12px arial, sans-serif;
    background: white;
    background: rgba(255,255,255) ; /*  ,0.8);*/
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
    /* width: auto;
    height: auto; */
}
.info h4 {
    margin-bottom: 3px;
    color: #777;
}
.info-title {
  color: #404040;
}
#land-info{
margin: 1px 0;
}


.popup-pegel {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  opacity: 0.7;
  border:1px solid #262626;
}

/* leaflet-search > animate a red circle over location found */
.leaflet-overlay-pane {
    z-index: 648;
} 

/* Collapsible für Warnhinweise innerhalb des Popup
 * Quelle: https://www.w3schools.com/howto/howto_js_collapsible.asp
/*

/* Style the button that is used to open and close the collapsible content */
.lhp-collapsible {
  background-color: #fff;
  color: #0078a8;
  cursor: pointer;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
}
.lhp-collapsible:hover {text-decoration:underline }

/* Style the collapsible content. Note: hidden by default */
.lhp-collapsible-content {
  padding: 4px 8px;
  margin-top: 4px;
  display: none;
  overflow: hidden;
  background-color: #f1f1f1;
} 

.ezglegende {
  width: 100px; 
  margin-bottom: 6px;
}