.mappopup {
  // attributes
  // &::psuedo elements
  // elements
  // .module-x-selector
  // &:psuedo
  // &.module-is-state
  // @media selectors

  margin-bottom: 0;
  padding-bottom: 10px;

  .leaflet-popup-content-wrapper {
    background: $color-light1;
    border-radius: $gridspacing / 2;
    box-shadow: 0 10px 20px 0 rgba($color-dark1, 0.2);
    padding: $gridspacing;
    width: auto;

    a {
      @include textstyle-h2-compact;
      color: $color-interactive1;

      &:hover {
        text-decoration: underline;
      }
    }
  }

  .leaflet-popup-content {
    margin: 0;
    text-align: center;
  }

  .mappopup-x-text {
    margin-top: 24px;
    color: $color-dark2;
    font-size: 16px;
    line-height: 24px;
  }

  &.leaflet-popup {
    a.leaflet-popup-close-button {
      display: none;
    }
  }

  .leaflet-popup-tip {
    box-shadow: 0 10px 20px 0 rgba($color-dark1, 0.2);
  }
}