html, body{
    margin:0;
    padding:0;
    height:100%;
    font-family:Arial, sans-serif;
}

#map{
    width:100%;
    height:100vh;
}

.legend{
    position:absolute;
    top:20px;
    right:20px;

    background:white;
    padding:15px;

    border-radius:8px;
    box-shadow:0 2px 10px rgba(0,0,0,.2);

    z-index:999;
}

.legend div{
    margin-top:8px;
}

.legend span{
    display:inline-block;
    width:15px;
    height:15px;
    margin-right:8px;
}

.raaf{
    background:#d32f2f;
}

.rnzaf{
    background:#1976d2;
}

.pngdf{
    background:#43a047;
}