/* Header styles moved from application.css */

/* Header */
.site-header {
  background: #347ec9;
  color: #ffffff;
  flex: 0 0 auto;
}

.header-inner {
  height: 64px;
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 0 1.5rem;
}

.header-inner {
  position: relative;
  justify-content: space-between;
}

/* Logo */
.site-logo {
  color: #ffffff;
  text-decoration: none;
  font-family: "Times New Roman", Times, serif;
  font-weight: 700;
  font-size: 1.6rem;
  white-space: nowrap;
}

.site-logo:hover {
  text-decoration: underline;
}

/* Nav */
.site-nav {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

/* Make nav take remaining space so auth links can align right */
.site-nav {
  flex: 1 1 auto;
}

.nav-link {
  color: #ffffff;
  text-decoration: none;
  font-size: 1rem;
  padding: 0.35rem 0.25rem;
}

.nav-link:hover {
  text-decoration: underline;
}

.site-header {
  /* keep header visible at the top while allowing the page to scroll */
  position: sticky;
  top: 0;
  z-index: 300;
}

/* Dropdown container */
.nav-dropdown {
  position: relative;
  display: inline-block;
}

.nav-dropdown::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 1rem;
}

/* Bridge small vertical gap between button and dropdown so pointer stays within
   the menu/widget when moving from the button to the menu. */
.user-menu::after,
.manage-menu::after,
.nav-dropdown::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 8px;
}

.nav-dropdown-toggle {
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
}

.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 160px;
  padding: 8px 0;
  border-radius: 8px;
  background: white;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
  z-index: 320;
}

.nav-dropdown-item {
  display: block;
  padding: 8px 12px;
  text-decoration: none;
  color: #111;
  white-space: nowrap;
}

.nav-dropdown-item:hover {
  background: rgba(0,0,0,0.06);
}

/* Show on hover + keyboard focus within */
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
  display: block;
}

/* Make user menu show on hover/focus like nav-dropdown */
.user-menu:hover .user-menu-dropdown,
.user-menu:focus-within .user-menu-dropdown {
  display: block;
}

/* When a menu is force-hidden (e.g., clicked to close while hovered), override hover/focus styles */
.nav-dropdown.force-hide .nav-dropdown-menu,
.user-menu.force-hide .user-menu-dropdown {
  display: none !important;
}

.nav-caret {
  margin-left: 6px;
}

/* Auth area */
.auth-links {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

/* Shared menu button */
.menu-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 0;
  padding: 0.25rem 0.6rem;
  cursor: pointer;
  font: inherit;
  border-radius: 999px;
  transition: background-color 150ms ease, transform 120ms ease, box-shadow 150ms ease;
  text-decoration: none;
}

/* icons inside menu buttons */
.menu-button .fa,
.menu-button .fas,
.menu-button .far,
.menu-button .fal,
.menu-button .fab {
  display: inline-block;
  width: 18px;
  text-align: center;
  font-size: 0.95rem;
}

/* Display buttons immediately right of the logo */
.display-buttons {
  display: inline-flex;
  gap: 0.5rem;
  margin-left: 0.75rem;
  align-items: center;
}

.display-button {
  /* match Manage color but with a semi-rectangular shape */
  background: #3ea0e9;
  color: #ffffff;
  border-radius: 8px;
  padding: 0.28rem 0.7rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700; /* make the text bolder */
  text-decoration: none;
}

.display-button:hover,
.display-button:focus {
  background: #145ea8;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  text-decoration: none;
}

/* Make the active display button match the hover/focus visual state */
.display-button.active,
.display-button.active:focus {
  background: #145ea8;
  color: #ffffff;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  text-decoration: none;
}

.display-button .fa,
.display-button .fas,
.display-button .far,
.display-button .fal,
.display-button .fab {
  width: 18px;
  text-align: center;
}

.display-text {
  font-weight: 700;
}

/* specific appearances */
.user-button {
  background: #eaf6ff; /* light-blue pill background */
  color: #0b4e85;
}

.manage-button {
  background: #3ea0e9; /* slightly lighter than header */
  color: #ffffff;
}

/* Hover/active state: darker blue pill, no underline */
.menu-button:hover,
.menu-button:focus {
  transform: translateY(-1px);
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
}

.user-menu.open .menu-button,
.nav-dropdown.open .menu-button,
.menu-button:active {
  /* keep the hover styling visible while the dropdown is open/clicked */
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
}

.user-button:hover {
  background: #cdeeff;
  color: #0b4e85;
}

.manage-button:hover {
  background: #145ea8; /* darker, more blue on hover */
}

.updates-button {
  background: #2b5fa0; /* darker than header */
  color: #ffffff;

  position: relative;
  min-width: 140px;
  padding-left: 18px; /* space for icon */
  padding-right: 12px;
  justify-content: center;
}

.updates-button i {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  text-align: center;
}

/* About button mirrors Updates button sizing and icon positioning */
.about-button {
  background: #2b5fa0; /* same darker background as updates */
  color: #ffffff;
  position: relative;
  min-width: 140px;
  padding-left: 18px; /* space for icon */
  padding-right: 12px;
  justify-content: center;
}

.about-button i {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  text-align: center;
}

.about-button:hover,
.about-button:focus {
  background: #346fb7; /* same brighter hover as updates */
  color: #ffffff;
  text-decoration: none;
}

.updates-button:hover,
.updates-button:focus {
  background: #346fb7; /* slightly brighter on hover */
  color: #ffffff;
  text-decoration: none;
}

.user-menu {
  position: relative;
  display: inline-block;
}

.avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
  display: inline-block;
}

.username {
  max-width: 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-menu-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 180px;
  padding: 6px 0;
  border-radius: 8px;
  background: white;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
  z-index: 320;
}

.user-menu.open .user-menu-dropdown {
  display: block;
}

.user-menu .nav-dropdown-item {
  color: #111;
}

/* Ensure Manage dropdown has the same spacing from its button as the user menu */
.manage-menu .nav-dropdown-menu,
.manage-menu-dropdown {
  top: calc(100% + 6px);
}

/* Keep the hover appearance while the menus are open/clicked */
.user-menu.open .user-button {
  background: #cdeeff;
  color: #0b4e85;
}

.nav-dropdown.open .manage-button,
.manage-menu.open .manage-button {
  background: #145ea8;
  color: #ffffff;
}

/* Sign up button as a rounded pill */
.signup-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3rem 0.9rem;
  background: #dff6ff;
  color: #0b4e85;
  border-radius: 999px;
  border: 1px solid rgba(11,78,133,0.08);
  text-decoration: none;
  transition: background-color 140ms ease, transform 120ms ease;
}

.signup-button:hover,
.signup-button:focus {
  background: #c9efff;
  text-decoration: none;
  transform: translateY(-1px);
}

/* make click-toggle show dropdown when parent has .open */
.nav-dropdown.open .nav-dropdown-menu {
  display: block;
}

/* Manage dropdown specific link color */
.manage-menu-dropdown .nav-dropdown-item {
  color: #111;
}

/* Admin link in Manage menu: prominent red */
.manage-menu-dropdown .nav-dropdown-item.admin-link {
  color: #c62828;
  font-weight: 700;
}

/* Style the Sign out button inside the user menu dropdown to look like a link */
.user-menu-dropdown .inline-form {
  margin: 0;
  /* ensure the inline delete form fills the dropdown width */
  display: block;
  width: 100%;
}

.user-menu-dropdown .inline-form input[type="submit"],
.user-menu-dropdown .inline-form button {
  background: transparent;
  border: none;
  appearance: none;
  -webkit-appearance: none;
  color: #111; /* match dropdown link color */
  width: 100%;
  box-sizing: border-box;
  text-align: left;
  padding: 8px 12px;
  cursor: pointer;
  font: inherit;
  display: block;
}

.user-menu-dropdown .inline-form input[type="submit"]:hover,
.user-menu-dropdown .inline-form button:hover {
  text-decoration: none;
  background: rgba(0,0,0,0.06);
}

.user-menu-dropdown .inline-form .nav-dropdown-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  text-align: left;
}

/* Responsive: narrow screens (stacked header) — applied at 980px and below */
@media (max-width: 980px) {
  .header-inner {
    flex-direction: column;
    align-items: stretch;
    height: auto;
    padding: 0.6rem 1rem;
    gap: 0.6rem;
  }

  /* Top row: logo on the left, display buttons tight to the right */
  .header-left {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    order: 1;
    gap: 0.5rem;
  }

  .display-buttons {
    margin-left: 0;
  }

  .display-button {
    padding: 0.22rem 0.5rem;
    font-weight: 700;
    border-radius: 6px;
    min-width: 0;
  }

  .site-logo {
    font-size: 1.25rem;
  }

  /* Second row: search full width */
  .header-center {
    position: static;
    left: auto;
    transform: none;
    width: 100%;
    order: 2;
    padding: 0;
    margin-bottom: 0.4rem;
  }

  .search-container {
    width: 100%;
  }

  .search-input {
    width: 100%;
    box-sizing: border-box;
  }

  /* Third row: nav / dropdown buttons side-by-side and wrapping */
  .header-right {
    width: 100%;
    order: 3;
    display: block;
  }

  /* Ensure the nav container aligns its content to the right, and
     keep the auth links right-aligned even when they wrap */
  .header-right .site-nav {
    display: flex;
    justify-content: flex-end;
  }

  .auth-links {
    margin-left: 0;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    padding: 0.25rem 0;
  }

  .menu-button,
  .signup-button,
  .about-button,
  .updates-button {
    flex: 0 1 auto;
    min-width: 0;
  }

  .user-menu,
  .manage-menu {
    flex: 0 0 auto;
  }

  /* prevent the header-center absolute centering interfering */
  .header-center,
  .header-left,
  .header-right {
    padding-left: 0;
    padding-right: 0;
  }

  /* Slightly reduce shadows/transforms to prevent overflow on small screens */
  .nav-dropdown-menu,
  .user-menu-dropdown {
    min-width: 160px;
  }

  /* When dropdowns live in the right-side header area, anchor them to the
     right (open leftwards) to avoid overflowing the viewport on narrow screens. */
  .header-right .nav-dropdown-menu,
  .header-right .manage-menu-dropdown,
  .header-right .user-menu-dropdown {
    right: 0;
    left: auto;
  }
}

/* Icon-only circle buttons for header-right at narrow widths */
@media (max-width: 980px) {
  /* hide textual labels and carets for compact buttons */
  .header-right .about-text,
  .header-right .updates-text,
  .header-right .username,
  .header-right .display-text,
  .header-right .nav-caret {
    display: none !important;
  }

  /* make the header-right action buttons circular and icon-centered */
  .header-right .about-button,
  .header-right .updates-button,
  .header-right .manage-button,
  .header-right .user-button {
    min-width: 0 !important;
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
  }

  /* ensure icons are visible (cover multiple FA class variants) */
  /* hide plain text inside the manage button but keep the icon visible */
  .header-right .manage-button { font-size: 0; }

  .header-right .manage-button .fa,
  .header-right .manage-button .fas,
  .header-right .manage-button .fa-solid,
  .header-right .manage-button .far,
  .header-right .manage-button .fal,
  .header-right .manage-button .fab,
  .header-right .about-button .fa,
  .header-right .about-button .fas,
  .header-right .about-button .fa-solid,
  .header-right .about-button .far,
  .header-right .about-button .fal,
  .header-right .about-button .fab,
  .header-right .updates-button .fa,
  .header-right .updates-button .fas,
  .header-right .updates-button .fa-solid,
  .header-right .updates-button .far,
  .header-right .updates-button .fal,
  .header-right .updates-button .fab {
    font-size: 1.05rem;
    width: auto;
  }

  /* ensure manage icon is exactly centered (block-level centering) */
  .header-right .manage-button i,
  .header-right .manage-button .fa,
  .header-right .manage-button .fas,
  .header-right .manage-button .fa-solid,
  .header-right .manage-button i {
    display: inline-block;
    margin: 0;
    line-height: 1;
    text-align: center;
  }

  /* remove the inherited gap so the single icon sits perfectly centered */
  .header-right .manage-button { gap: 0; justify-content: center; }

  /* avatar size inside the circular user button */
  .header-right .user-button .avatar {
    width: 22px;
    height: 22px;
  }

  /* ensure hover/active states still look good in compact mode */
  .header-right .about-button:hover,
  .header-right .updates-button:hover,
  .header-right .manage-button:hover,
  .header-right .user-button:hover {
    transform: none;
    box-shadow: 0 6px 18px rgba(0,0,0,0.10);
  }

  /* keep the signup link readable (don't force circle) */
  .header-right .signup-button {
    display: inline-flex;
    padding: 0.25rem 0.6rem;
  }
}

/* Remove left margin from display buttons earlier so they align flush
   on medium/narrow viewports (1208px and below) */
@media (max-width: 1208px) {
  .display-buttons {
    margin-left: 0;
  }
}
.site-filter {
	position: fixed;
	left: 0;
	right: 0;
	top: var(--header-height, 64px);
	background: rgba(59, 138, 217, 0.92);
	padding: 8px 1.5rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.04);
	overflow: visible;
	transition: padding 240ms ease, border-bottom 240ms ease, max-height 260ms ease;
	z-index: 100;
}

.filter-row {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}

.filter-dropdown {
	position: relative;
	min-width: 260px;
}

.filter-button {
	background: white;
	border: 1px solid #ddd;
	padding: 8px 12px;
	border-radius: 6px;
	cursor: pointer;
	min-width: 220px;
	text-align: left;
	position: relative;
}

.filter-button .filter-label {
	display: inline-block;
	padding-right: 48px;
}

.filter-button .filter-caret {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	color: #666;
}

.filter-button .filter-badge {
	display: none;
	position: absolute;
	right: 34px;
	top: 50%;
	transform: translateY(-50%);
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #0b6fff;
	color: #fff;
	font-size: 12px;
	line-height: 18px;
	text-align: center;
}

.filter-button .filter-badge.visible {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.filter-button[aria-expanded="true"] {
	background: #e9e9e9;
}

.filter-menu {
	display: none;
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	min-width: 300px;
	max-height: 320px;
	overflow: auto;
	background: white;
	border: 1px solid rgba(0, 0, 0, 0.08);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
	border-radius: 8px;
	z-index: 150;
}

.filter-list {
	list-style: none;
	margin: 0;
	padding: 8px;
}

.filter-item { padding: 4px 0; }

.filter-clear { margin-left: 8px; }

.filter-item-label {
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	padding: 6px 8px;
	border-radius: 6px;
}

.filter-item-label:hover {
	background: rgba(0, 0, 0, 0.03);
}

.filter-item-check {
	margin-left: auto;
	color: transparent;
	font-weight: 700;
}

.filter-item-label.selected .filter-item-text {
	color: #0b5a2f;
}

.filter-item-label.selected .filter-item-check {
	color: #0b5a2f;
}

/* Sliding panel - allow dropdowns to overflow when expanded, but hide when collapsed */
.filter-panel {
	overflow: visible;
	transition: max-height 260ms cubic-bezier(.2, .8, .2, 1), opacity 240ms ease, padding 240ms ease;
	max-height: 400px;
	opacity: 1;
}

.filter-panel.collapsed {
	max-height: 0;
	opacity: 0;
	padding-top: 0;
	padding-bottom: 0;
	overflow: hidden;
}

/* When the outer filter container is collapsed, remove its footprint so content below sits flush under header */
.site-filter.collapsed {
	padding-top: 0;
	padding-bottom: 0;
	border-bottom: none;
	max-height: 0;
	pointer-events: none;
}

/* Keep the toggle clickable even when collapsed */
.site-filter.collapsed .filter-toggle {
	pointer-events: auto;
}

/* Toggle button */
.filter-toggle {
	position: absolute;
	right: 46px;
	top: calc(100% + 10px);
	bottom: auto;
	transform: none;
	background: #000;
	border: 0;
	width: 32px;
	height: 32px;
	padding: 0;
	border-radius: 50%;
	cursor: pointer;
	font-size: 0.9rem;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
	z-index: 175;
	display: flex;
	align-items: center;
	justify-content: center;
	-webkit-tap-highlight-color: transparent;
}

.filter-toggle:focus {
	outline: 2px solid rgba(11, 111, 255, 0.25);
}

.filter-toggle .filter-toggle-caret {
	color: #fff !important;
	display: inline-block;
	transform: rotate(0deg);
	transition: transform 180ms ease;
	font-size: 20px;
	line-height: 1;
}

.filter-toggle[aria-expanded="true"] .filter-toggle-caret {
	transform: rotate(180deg);
}

.filter-toggle:active {
	background: #000;
}

.filter-toggle:active .filter-toggle-caret {
	color: #fff !important;
}

@media (max-width: 900px) {
	.filter-dropdown {
		min-width: 200px;
	}

	.filter-button {
		min-width: 160px;
	}

	.filter-menu {
		min-width: 220px;
	}
}
/*


*/

/* Prevent scrolling and make layout fit viewport */
html, body {
  height: 100%;
  overflow: hidden; /* prevent page-level scrollbars; use .site-main for scrolling */
}

body.site {
  margin: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.site-main {
  flex: 1 1 auto;
  min-height: 0; /* important for no-overflow flex layouts */
  /* allow the main area to scroll independently between header/footer when
     necessary; keep some bottom padding so content won't butt up against a
     sticky footer on small screens */
  display: flex;
  flex-direction: column;
  overflow: auto;
}

/* Hero area w/ background image placeholder */
.home-hero {
  /* make hero fill the available space inside .site-main without forcing
     a 100% height (which can cause overflow). Using flex lets it grow to the
     remaining area between header and footer */
  flex: 1 0 auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;

  /* Background image placeholder (swap later) */
  background-color: #3b5998;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Text overlay */
.home-tagline {
  color: #ffffff;
  font-size: 1.5rem;
  line-height: 1.4;
  max-width: 900px;
  text-align: center;

  /* Shadow for readability over images */
  text-shadow: 0 4px 14px rgba(0,0,0,0.78), 0 1px 3px rgba(0,0,0,0.5);
  margin: 0;
  padding: 1rem 1.25rem;
}

/* Footer pinned to bottom */
.site-footer {
  /* keep footer visible at the bottom of the viewport while still remaining
     in-flow so it stays below content when appropriate */
  position: sticky;
  bottom: 0;
  flex: 0 0 auto;
  background: #347ec9;
  color: #ffffff;
  z-index: 250;
}

.footer-inner {
  padding: 0.9rem 1.5rem;
  font-size: 0.95rem;
  line-height: 1.3;
  text-align: center;
}

/* Small screens: wrap nav nicely */
@media (max-width: 640px) {
  .header-inner {
    height: auto;
    padding: 0.9rem 1rem;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
  }

  .site-nav {
    flex-wrap: wrap;
    gap: 0.6rem 1rem;
  }

  .home-tagline {
    font-size: 1.25rem;
  }
}

.home-content {
  text-align: center;
  max-width: 1000px;
}

/* Main title over hero image */
.home-title {
  color: #ffffff;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1rem;

  /* Stronger shadow for readability */
  text-shadow: 0 6px 20px rgba(0, 0, 0, 0.85), 0 2px 6px rgba(0,0,0,0.6);
}

/* Existing tagline (slightly tuned) */
.home-tagline {
  color: #ffffff;
  font-size: 1.4rem;
  line-height: 1.45;
  margin: 0;

  text-shadow: 0 4px 14px rgba(0, 0, 0, 0.78), 0 1px 3px rgba(0,0,0,0.5);
}

/* Responsive tweak */
@media (max-width: 640px) {
  .home-title {
    font-size: 2rem;
  }

  .home-tagline {
    font-size: 1.2rem;
  }
}

/* Hide footer on narrow screens except on the About page (pages#about).
   Using the controller-action body class added in the layout (e.g.
   `pages-about`) allows an exception for the about page. */
@media (max-width: 980px) {
  .site-footer {
    display: none;
  }

  /* Exception: pages-about should still show the footer */
  .pages-about .site-footer {
    display: block;
  }
}

/* Dropdown container */
.mapbox-map {
  width: 100%;
  height: 100%;
}
.mapbox-map {
  width: 100%;
  height: 100%;
}

/* Make inline delete form sit beside links */
.inline-form {
  display: inline-block;
  margin: 0;
}

.inline-form input[type="submit"] {
  background: transparent;
  border: 0;
  color: inherit;
  padding: 0 0.5rem;
  cursor: pointer;
  font: inherit;
}

/* Style the Sign out button inside the user menu dropdown to look like a link */
.user-menu-dropdown .inline-form {
  margin: 0;
}

.user-menu-dropdown .inline-form input[type="submit"],
.user-menu-dropdown .inline-form button {
  background: transparent;
  border: none;
  appearance: none;
  -webkit-appearance: none;
  color: #111; /* match dropdown link color */
  width: 100%;
  text-align: left;
  padding: 8px 12px;
  cursor: pointer;
  font: inherit;
  display: block;
}

.user-menu-dropdown .inline-form input[type="submit"]:hover,
.user-menu-dropdown .inline-form button:hover {
  text-decoration: none;
  background: rgba(0,0,0,0.06);
}

.user-menu-dropdown .inline-form .nav-dropdown-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  text-align: left;
}


/* Publication map marker + hover popup */
.pub-marker {
  position: relative;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(0,122,255,0.95);
  box-shadow: 0 1px 3px rgba(0,0,0,0.3);
  cursor: pointer;
  display: inline-block;
}

/* Make all Bootstrap buttons have rounded corners */
.btn {
  border-radius: 0.5rem !important;
}