/* Your custom css code goes here */

/* The phone number and e-mail address in the top bar and in the footer are
   wrapped in tel:/mailto: links so they are tappable on mobile. Keep them the
   colour of the surrounding text rather than the global link colour, so the
   header and footer look exactly as before; underline on hover/focus makes
   them discoverable. */
.probootstrap-top-quick-contact-info a,
.probootstrap-footer .probootstrap-contact-info a {
  color: inherit;
}

.probootstrap-top-quick-contact-info a:hover,
.probootstrap-top-quick-contact-info a:focus,
.probootstrap-footer .probootstrap-contact-info a:hover,
.probootstrap-footer .probootstrap-contact-info a:focus {
  color: inherit;
  text-decoration: underline;
}

/* Contact-page map (Leaflet + Mapy.com tiles). Leaflet needs an explicit
   height on its container or the map collapses to zero and renders nothing. */
#map {
  height: 450px;
  width: 100%;
  max-width: 100%;
  margin-bottom: 30px;
  background: #e8e8e8;
}

/* Mapy.com require their logo over the map, min. 30px tall and clickable. */
.mapy-logo {
  line-height: 0;
  margin-left: 8px !important;
  margin-bottom: 8px !important;
}

.mapy-logo img {
  height: 30px;
  display: block;
}

/* Shown instead of the map when no Mapy.com API key has been set yet. */
#map.map-fallback {
  height: auto;
  background: none;
  border: 1px solid #e0e0e0;
  padding: 20px;
}

#map.map-fallback p {
  margin: 0;
}