html, body {
    height: 100%;
    width: 100%;
    margin: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
}

#map {
    height: 100%;
    background: #C19F74;
    display: inline-block;
    flex-grow: 1;
}

.hexcoord {
    opacity: 0.7;
    color: white;
    font-size:12pt;
    font-weight:bolder;
    text-align: center;
    display: table-cell;
    vertical-align: bottom;
    line-height: 40px;
    text-shadow:
            -1px -1px 0 #000,
            1px -1px 0 #000,
            -1px 1px 0 #000,
            1px 1px 0 #000;
    width: 400px !important;
    margin-left: -200px !important;
}

.zcss2 > .leaflet-map-pane > .leaflet-marker-pane > .hexcoord  {
    font-size:76pt;
}

.zcss1 > .leaflet-map-pane > .leaflet-marker-pane > .hexcoord  {
    font-size:48pt;
}

.zcss0 > .leaflet-map-pane > .leaflet-marker-pane > .hexcoord  {
    font-size:24pt;
}

.zcss-1 > .leaflet-map-pane > .leaflet-marker-pane > .hexcoord  {
    font-size:11pt;
}

.zcss-2 > .leaflet-map-pane > .leaflet-marker-pane > .hexcoord  {
    font-size:8pt;
}

.zcss-3 > .leaflet-map-pane > .leaflet-marker-pane > .hexcoord {
    font-size:6pt;
}

/* Change cursor when mousing over clickable layer */
.leaflet-clickable {
    cursor: crosshair !important;
}
/* Change cursor when over entire map */
.leaflet-container {
    cursor: crosshair !important;
}

.extra-marker i {
    margin-top: 11px;
    margin-left: 0px;
    font-size:14pt;
}


.leaflet-popup-content-wrapper, .leaflet-popup-tip {
    background: #5c4b35;

}

.leaflet-popup-content-wrapper {
    padding: 1px;
    text-align: left;
    border-radius: 0;
    background-color: beige;
    border: 1px solid #5c4b35;
    color: #5c4b35;
}

.leaflet-popup-content {
    margin-right: 5px;
}

.leaflet-container a.leaflet-popup-close-button {

     color: #5c4b35;

 }

.poi-title {
    font-size: 12pt;
    font-weight: bold;
    padding-right: 20px;
}
.poi-desc {
    overflow-y:auto;
    max-height:200px;
    margin-right: 8px;
    padding-right: 5px;
}
.poi-notes {
    text-align: left;
    color: #9a7d59;
}
.journal-date {
    padding-top: 10px;
    font-weight: bolder;
}
.journal-text {
    font-style: italic;
    text-align: left;
    color: #9a7d59;
}
.journal-sign {
    font-style: italic;
    text-align: right;
    color: #9a7d59;
    font-size: smaller;
    padding-right: 5px;
}

::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}
::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}
::-webkit-scrollbar-thumb {
    background: #9a7d59;
    border: 0px none #ffffff;
    border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
    background: #9a7d59;
}
::-webkit-scrollbar-thumb:active {
    background: #5c4b35;
}
::-webkit-scrollbar-track {
    background: #C19F74;
    border: 0px none #ffffff;
    border-radius: 50px;
}
::-webkit-scrollbar-track:hover {
    background: #C19F74;
}
::-webkit-scrollbar-track:active {
    background: #C19F74;
}
::-webkit-scrollbar-corner {
    background: transparent;
}

.leaflet-control-hexedit {

}

.hexedit-button {
    position: relative;
    width: 44px !important;
    height: 44px !important;
    padding-top: 4px;
}
.hexedit-button:hover{
    background: #eee !important;
}
.hexedit-button.selected, .hexedit-button.selected:hover {
    background: #ddd !important;
}

.hexedit-button.disabled > img{
    opacity: 0.5 !important;
}

.hexedit-button-img {
    width: 40px;
    height: 40px;
}

.hexedit-menu {
}


.hexedit-menu-item {

}

.edit-region-dialog {
    text-align:right;
    display:block;
}

.regionlabel {
    background: none;
    border: 0;
    font-weight: bold;
    color: black;
    font-size: 14pt;
    box-shadow: 0 0 0px;
    text-shadow: -1px 0 1px white, 0 -1px 1px white, 1px 0 1px white,  0 1px 1px white;
}

.zcss2 > .leaflet-map-pane > .leaflet-tooltip-pane > .regionlabel  {
    font-size:90pt;
}

.zcss1 > .leaflet-map-pane > .leaflet-tooltip-pane > .regionlabel  {
    font-size:60pt;
}

.zcss0 > .leaflet-map-pane > .leaflet-tooltip-pane > .regionlabel  {
    font-size:30pt;
}

.zcss-1 > .leaflet-map-pane > .leaflet-tooltip-pane > .regionlabel  {
    font-size:20pt;
}

.zcss-2 > .leaflet-map-pane > .leaflet-tooltip-pane > .regionlabel  {
    font-size:14pt;
}

.zcss-3 > .leaflet-map-pane > .leaflet-tooltip-pane > .regionlabel {
    font-size:8pt;
}