buckybox/webstore

@import "leaflet"

// Leaflet overrides

.leaflet-container
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif

.leaflet-control-attribution
  color: #008C8C
  a
    text-decoration: underline


// Our own CSS

html, body
  margin: 0
  padding: 0
  height: 100%
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif

.lightbox
  position: fixed
  width: 100%
  height: 100%
  z-index: 1E4 // looks like Leaflet uses z-index up to 1E3
  text-align: center
  background: #000
  opacity: 0.8
  color: #FFF
  display: flex
  align-items: center
  justify-content: center

  .wrapper
    display: flex
    flex-direction: column
    align-items: flex-end
    justify-content: center

    .content
      font-size: 14px

      ul
        list-style: none
        text-align: right
        border-right: 1px solid #FFF
        padding-right: 10px
        padding-top: 20px
        margin: 0 2px 0

  .fade-in
    opacity: 0.2
    transition: opacity 1s

    &.invisible
      opacity: 0

  .close
    position: absolute
    right: 16px
    top: 16px
    cursor: pointer

  a
    color: #FFF

  h1
    font-size: 32px
    margin: 0
    img
      margin-bottom: -10px
      margin-right: 10px

  footer
    position: absolute
    left: 0
    bottom: 10px
    width: 100%
    font-size: 18px