body {
  padding: 0;
  margin: 0;
}

#map {
  height: 100vh;
  font: 10pt "Helvetica Neue", Arial, Helvetica, sans-serif;
  padding: 4px; 
  border-color: black;
  border-radius: 7px;
  border-style: solid;
  border-width: 5px;
  width: 100vh;
}

.lorem {
  font-style: italic;
  text-align: justify;
  color: #AAA;
}

.info {
    background:#fff;
    position:absolute;
    width:260px;
    top:10px;
    right:10px;
    border-radius:2px;
    }
    .info .item {
      display:block;
      border-bottom:1px solid #eee;
      padding:10px;
      text-decoration:none;
      }
      .info .item small { color:#888; }
      .info .item:hover,
      .info .item.active { background:#f8f8f8; }
      .info .item:last-child { border-bottom:none; }

.leaflet-popup-content {
  width: 41vh !important;
}

.tabs {
    position:relative;
    margin:25px 0;
}
.tab {
    float:left;
    display: none;
}
.tab:first-of-type {
    display: inline-block;
}
.tabs-link {
    position: relative;
    top: -14px;
    height: 20px;
    left: -40px;
  	width: 50vh;
}
.tab-link {
    background:#eee;
    display: inline-block;
    padding:10px;
    border:1px solid #ccc;
    margin-left:-1px;
    position:relative;
    list-style-type: none;
    left:1px;
    top:1px;
    cursor:pointer;
}
.tab-link {
    background:#f8f8f8;
}
.content {
    background:white;
    position:absolute;
    top:28px;
    left:0;
    right:0;
    padding:20px;
    border:1px solid #ccc;
  	height:63vh;
  	width:87vh;
  	overflow: scroll;
    overflow-x: hidden;
  	overflow-y: auto;
  	color: black;
}
.content a {
  color: blue;
}
.tab:target {
    display: block;
}

.leaflet-popup-content-wrapper {
  	height: 71vh;
    width: 91vh;
}

@media only screen and (max-width: 768px) {
  #map {
		width: 100vw;
  }
}