.container {
    margin: 8px;
    padding: 8px;
    border: 2px solid #36454F;
    border-radius: 8px;
    overflow:auto;
}

.header {
    background-color: #36454F;
    margin: 8px;
    padding: 8px;
    border: 2px solid #36454F;
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center; 
}

#header h2{
    color: #FCF5E5;
    background-color: #36454F;
    border: 2px solid #36454F;
    margin:0;
}

#user-guide {
    float: right;
    color: #FCF5E5;
    font-weight: bold;
    font-size: 16px;
}



.table {
    background-color: #f5f5f5;
}

.table_row:nth-child(even) {
    background-color: #e5e5e5;
}


.table_header {
    text-align: left;
}

.table_cell {
    padding: 8px;
}

#table-container {
    display: none;

}


#toggle-table, #download-csv {
    font-size: 16px;
    margin: 8px;
    padding: 8px;
}


#mapid, #search-and-chart-container {
    display: inline-block;
    vertical-align: top;
    height: 500px;
    box-sizing: border-box;
    padding: 8px;
}

#mapid {
    width: 66%;
    float:left;  
}

#search-and-chart-container {
    width: 33%;  
    background-color: #faebd7;
    padding: 8px;
    float:right;
} 

#search {
    position: relative;
    z-index: 1;
    height: 40px;
}

#search-box {
    padding: 8px;
    font-size: 16px;
    box-sizing: border-box;
    width: 100%;
    background-color:aliceblue;
}


#autocomplete-dropdown {
    position: absolute;
    width: 70%;
    left: 0;
    top:100%;
    z-index: 2;
    background-color: #c4b9b9;

}

#autocomplete-dropdown div {
    padding: 8px;
    cursor: pointer;
}

#autocomplete-dropdown div:hover {
    background-color: #dedbdb;
}

#chart {
    position: relative;
    z-index: 0;
    padding: 8px;
    box-sizing: border-box;
    max-height: 90%;
    width: 99%;
    overflow-y: auto;

}

#chart svg {
    width: 100%;
    height: 80%;
    margin-top: 0;
    padding-top: 0;
    margin-bottom: 0;
    padding-bottom: 0;

}
