/*--------------------------------------------------------------
Navigation Marker
--------------------------------------------------------------*/

.leaflet-marker-icon {

    overflow: visible !important;

}

.nav-marker {

    position: relative;

    display: inline-block;

    overflow: visible;

}

.nav-icon {

    display: block;

    width: 100%;
    height: 100%;

    pointer-events: none;

}

/*--------------------------------------------------------------
Navigation Lamp
--------------------------------------------------------------*/

.nav-lamp {

    position: absolute;

    width: 8px;
    height: 8px;

    left: 50%;
    top: -6px;

    transform: translateX(-50%);

    border-radius: 50%;

    opacity: 0;

    pointer-events: none;

    transition: opacity 40ms linear;

    z-index: 1000;

}

.nav-lamp.on {

    opacity: 1;

}

.nav-lamp.white {

    background: #ffffff;

    box-shadow:
        0 0 4px #ffffff,
        0 0 8px #ffffff,
        0 0 16px #ffffff;

}

.nav-lamp.red {

    background: #ff4040;

    box-shadow:
        0 0 4px #ff4040,
        0 0 8px #ff4040,
        0 0 16px #ff4040;

}

.nav-lamp.green {

    background: #00ff66;

    box-shadow:
        0 0 4px #00ff66,
        0 0 8px #00ff66,
        0 0 16px #00ff66;

}

.nav-lamp.yellow {

    background: #ffd500;

    box-shadow:
        0 0 4px #ffd500,
        0 0 8px #ffd500,
        0 0 16px #ffd500;

}