* { font-family: Minecraftia, Arial, sans-serif; }

header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  color: #fff;
  text-align: center;
  z-index: 900;
}

h1 {
  margin-bottom: 0;
}

h1 img {
  max-width: 40%;
  filter: drop-shadow(0px 5px 0px black);
  image-rendering: pixelated;
}

h2 {
  margin: 0;
  font-weight: normal;
  color: #ff0;
  text-shadow: .125em .125em #404000;
  transform: translate(min(75px,14vw),max(-30px, -6vw)) rotate(-30deg);
  animation: zoomy 1s infinite ease-in-out;
  --zoomy-scale: 1.3;
}

@keyframes zoomy {
  0%, 100% { font-size: min(18px, calc(1.8vw * var(--zoomy-scale))); }
  50% { font-size: min(16px, calc(1.6vw * var(--zoomy-scale))); }
}

img.compass {
  filter: drop-shadow(0px 3px 2px #0006);
  image-rendering: pixelated;
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip {
  background: rgba(16,0,16,.94);
  color: #fff;
  /*box-shadow*/
}

.leaflet-popup-content-wrapper {
  border-radius: 0;
  text-shadow: 0.125em 0.125em 0 #3f3f3f;
  font-size: 16px;
  word-spacing: 4px;
  white-space: nowrap;
}

.leaflet-popup-content-wrapper::before {
  content: "";
  position: absolute;
  top: .125em;
  right: -.125em;
  bottom: .125em;
  left: -.125em;
  border: .125em solid #100010;
  border-style: none solid;
  border-color: rgba(16,0,16,.94);
}

.leaflet-popup-content-wrapper::after {
  content: "";
  position: absolute;
  top: .125em;
  right: 0;
  bottom: .125em;
  left: 0;
  border: 0.125em solid #2d0a63;
  border-image: linear-gradient(rgba(80,0,255,.31),rgba(40,0,127,.31)) 1;
}

.leaflet-popup-content {
  margin: 0.375em;
  line-height: 1.25em;
  vertical-align: baseline;
}

.leaflet-container a.leaflet-popup-close-button {
  right: -22px;
  padding: 1px 0 3px;
  text-shadow: 0 1px #000;
  border-radius: 100%;
  background: #0008;
  color: #fff;
  opacity: .6;
}

.leaflet-container a.leaflet-popup-close-button:hover {
  background: #000;
  color: #fff;
  opacity: 1;
}

img.ov-marker[src*="crafatar.com"] {
  margin-left: auto;
  transform: translateX(-32%);
  width: 32px;
}

/* https://codepen.io/joexmdq/pen/EOMLzg */

.leaflet-control-zoom {
  border-radius: 0;
  padding: 2px;
}

.leaflet-touch .leaflet-bar.leaflet-control-zoom {
  border: 0;
}

.leaflet-control-zoom-in,
.leaflet-control-zoom-out,
.leaflet-touch .leaflet-control-zoom-in,
.leaflet-touch .leaflet-control-zoom-out {
  font-family: Minecraftia, Arial, sans-serif;
  font-size: 18px;
}

.leaflet-control-zoom a {
  position: relative;
  margin: 4px;
  background: #999 url("bgbtn.png") center / cover;
  image-rendering: pixelated;

  color: #DDD;
  border: 2px solid #000 !important;
  border-radius: 0 !important;
}

.leaflet-control-zoom a:not(.leaflet-disabled):hover {
  background-color: rgba(100, 100, 255, .45);
  color: #FFFFA0;
}

.leaflet-control-zoom a:not(.leaflet-disabled)::after:hover {
  text-shadow: .125em .125em #202013CC;
}

.leaflet-control-zoom a::before,
.leaflet-control-zoom a::after {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  text-shadow: .125em .125em #000A;
  font-family: Minecraftia, Arial, sans-serif;
}

.leaflet-control-zoom a::before {
  content: "";
  box-shadow: inset -2px -4px #0006, inset 2px 2px #FFF7;
}

.leaflet-control-zoom-in::after { content: "+"; }
.leaflet-control-zoom-out::after { content: "-"; }
/*.leaflet-control-zoom-out::after { content: "−"; }*/

.leaflet-control-zoom a:not(.leaflet-disabled):hover::before {
  background-color: rgba(100, 100, 255, .45);
}

.leaflet-control-zoom a:not(.leaflet-disabled):active::before {
  box-shadow: inset -2px -4px #0004, inset 2px 2px #FFF5;
}

.leaflet-control-zoom a.leaflet-disabled::before {
  box-shadow: inset -2px -4px #0006, inset 2px 2px #FFF3;
  background-color: rgba(0, 0, 0, .45);
}

.leaflet-control-zoom a.leaflet-disabled::after {
  color: #777;
}

.leaflet-bottom { padding: 10px }

.leaflet-container .coordbox {
  padding: 4px 8px;
  background: #0009;
  color: #fff;
  text-shadow: 0.125em 0.125em #3f3f3f;
  opacity: .8;
}

.leaflet-bottom.leaflet-right .leaflet-control {
  padding: 4px 8px;
  background: #0009;
  color: #fff;
  text-shadow: 0.125em 0.125em #3f3f3f;
  opacity: .8;
}

.leaflet-bottom.leaflet-right:hover .leaflet-control {
  opacity: 1;
}

.leaflet-control-attribution a {
  color: #66f;
}

.leaflet-touch .worldcontrol,
.leaflet-touch .leaflet-control-layers {
  border: 0;
  box-shadow: 0 0 0 3px rgba(0,0,0,.2);
}

.worldcontrol, .leaflet-control-layers {
  transform: translateX(calc(100% + 15px));
  transition: transform .3s;
}

.worldcontrol *, .leaflet-control-layers * {
  cursor: pointer;
}

.leaflet-top.leaflet-right:hover .worldcontrol,
.leaflet-top.leaflet-right:hover .leaflet-control-layers {
  transform: translateX(0);
}

.leaflet-top.leaflet-right::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 85px;
  z-index: 700;
  pointer-events: auto;
}

#mcmap {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABABAMAAABYR2ztAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAPUExURRcXFxYWFhkZGR0dHRsbG/IKcikAAAAJcEhZcwAADsEAAA7BAbiRa+0AAAC2SURBVEjHvZWLDcQgDEO9Aitkha7A/jMdOdc1DIAj9ZPyKqWOSQGMFUCteJ65oqoPBpAA+kRSQC8z6zwBMCXgZeMJoNMWinLxngBfSABAF6N0zl2sF78O2CZETtNkAJYkaYgfng4AKocA3uapZRlgjCPFLtZfqACwt0jbVmV/X3EZ4JhQWfSxl9c1AOwWtWEkUwZQQRrpR6Pk5cuAGiOBPFg5WnKAm+MfTA7wI2+gvvsKvg1U/QDsYwLI/aWXfQAAAABJRU5ErkJggg==");
  background-size: 32px;
}

.leaflet-pane.leaflet-map-pane {
  filter: drop-shadow(0px 4px 16px #0006) drop-shadow(0px 2px 3px #0008);
  image-rendering: pixelated;
}