html, body, #viewDiv {
    padding: 0;
    margin: 0;
    height: 100%;
    width: 100%;
}

#statsDiv {
    height: 300px;
    overflow-y: scroll;
}

#infoDiv span {
    color: #f9c653;
    font-size: 12pt;
    font-weight: bolder;
}

img {
    width: 200px;
}

span#infected {
    color: #f9c653;
}

span#died {
    color: red;
}

span#healed {
    color: green;
}

.esri-expand__container .esri-expand__container--expanded {
    width: 29px;
    height: 10px;
}

.esri-legend .esri-widget--panel .esri-widget{
    width: 156px;
}


@media (max-height: 320px) {
    #logoDiv {
        position: absolute;
        bottom: 31px;
        background-color: white;
        right: 10px;
    }
    img {
        width: 200px;
    }
    #timeSlider {
        bottom: 30px;
        left: 20px;
    }
    #infoDiv {
        padding: 10px;
        width: 220px;
        height: 100px;
    }
}

@media (max-width: 630px) {
    #logoDiv {
        position: absolute;
        top: 15px;
        background-color: white;
        margin-left: 100px;
    }
    img {
        width: 150px;
    }
    #timeSlider {
        bottom: 30px;
    }
    #infoDiv {
        padding: 10px;
        width: 220px;
    }
    #viewDiv>div.esri-view-root>div.esri-ui>div.esri-ui-inner-container.esri-ui-corner-container>div.esri-ui-top-right.esri-ui-corner>div>div.esri-expand__container.esri-expand__container--expanded {
        width: 220px;
        height: 340px;
    }
}

@media (min-width: 631px) {
    #logoDiv {
        position: absolute;
        bottom: 31px;
        background-color: white;
        right: 10px;
    }
    img {
        width: 200px;
    }
    #timeSlider {
        bottom: 30px;
        left: 20px;
    }
    #infoDiv {
        padding: 10px;
        width: 220px;
    }
}