body {
    padding: 0;
    margin: 0;
    font-family: 'Roboto', sans-serif;
}

html, body, #container, #map {
    height: 100%;
    width: 100%;
}

#depthSlider {
    position: fixed;
    z-index: 500;
    height: 25%;
    bottom: 10.5%;
    left: 5%;
}

#timeSlider {
    position: fixed;
    z-index: 500;
    width: 30%;
    height: 2%;
    bottom: 5.75%;
    left: 6.5%;
}

.noUi-value-large{
    top: 1em;
    color: whitesmoke;
}

.noUi-horizontal .noUi-tooltip  {bottom: -130%;}

#depthLabel {
    position: fixed;
    color: white;
    font-size: 16px;
    z-index: 500;
    width: 35%;
    bottom: 38.5%;
    left: 3.5%;
}


#timeLabel {
    position: fixed;
    color: white;
    font-size: 16px;
    z-index: 500;
    width: 35%;
    bottom: 10%;
    left: 11%;
}

#timeLabel {
    position: fixed;
    color: white;
    font-size: 16px;
    z-index: 500;
    width: 35%;
    bottom: 10%;
    left: 11%;
}