#map {
    width: 100%;
    min-height: 250px;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 10px;
    margin-top: 10px;
}

@media (max-width: 576px) {
    #map {
        height: 350px;
    }
}

@media (max-width: 768) {
    #map {
        height: 420px;
    }
}

@media (max-width: 992) {
    #map {
        height: 500px;
    }
}

@media (min-width: 992.02px) {
    #map {
        height: 600px;
    }
}

.marker {
    position: absolute;
    margin-top: -25px;
    border-radius: 50%;
    border: 8px solid #FF0000;
    width: 8px;
    height: 8px;
}
.marker::after {
    position: absolute;
    content: '';
    width: 0px;
    height: 0px;
    bottom: -25px;
    left: -4px;
    border: 8px solid transparent;
    border-top: 17px solid #FF0000;
}