html, body, .row, .map-wrapper {
    height: 100%
}

.container-fluid {
    height: 85%;
}

.item-list {
    height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
}

.list-item {
    cursor: pointer;
}

.map {
    width: 100%;
    height: 100%;
}

.elevLegend {
    background-color: #F0F0F0;
    border: 1px solid black;
    margin: 10px;
}

.map-legend-color {
    border: 1px solid black;
    height: 10px;
    width: 10px;
    opacity: 0.6;
    display: inline-block;
    margin-left: 5px;
}

.legend-title {
    text-align: center;
}

.legend-row {
    margin-left: 5px;
    margin-right: 5px;
}

.navbar-toggler {
    margin-bottom: 5px;
}

.red {
    background-color: red;
}

.yellow {
    background-color: yellow;
}

.green {
    background-color: green;
}

/* Solution for making KnockoutJS binds work with Bootstrap button groups */
/* Sourced from: https://volaresystems.com/blog/post/2013/12/09/Using-Bootstrap-3-radio-button-groups-with-Knockout-3-data-bindings */
label.btn > input[type='radio'] {
    display: none;
}
label.btn > input[type='checkbox'] {
    display: none;
}