#map {
    height: 400px;
    margin-top: 15px;
    margin-bottom: 15px;
}

@media (max-width: 575px) {
    #map {
        height: 380px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    #map {
        height: 380px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

.play {
    display: inline-block;
    margin-left: 10px;
}

.pause {
    display: none;
    margin-left: 10px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
    line-height: 60px; /* Vertically center the text there */
}