/* Creating map container to fill the entire screen*/
.map-container {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
}

/* Setting up header to be positioned top left corner on top of map*/
.header{
    position: absolute;
    top: 0px;
    left: 12px;
    width: 510px;
    z-index: 1;
    background-color: rgb(18, 132, 132);
    font-size: 14px;
    color: white;
    padding-left: 22px;
    border: 5px rgb(17, 16, 16);
    border-radius: 12px;
}


/* Creating a legend underneath the header with space in between*/
.legend{
    position: absolute;
    top: 250px;
    left: 12px;
    z-index: 1;
    background-color: rgb(9, 9, 9);
    font-size: 14px;
    color: white;
    border: 5px rgb(0, 0, 0);
    border-radius: 8px;
    width: 160px;
    padding-left: 25px;   
    height: 170px;
}

/*Making button look nicer and more round*/
.visualize_button{
    color:rgb(9, 9, 9);
    border: 5px rgb(22, 20, 20);
    border-radius: 12px;
}