#map {
    height: 100%; 
    width: 100%;
    border-radius: 3px;
}
.marker {
    height: 30px;
    width: 30px;
    cursor: pointer;
}
.marker-content {
    border-radius: 50% 50% 50% 0;
    height: 30px;
    left: 50%;
    margin: -15px 0 0 -15px;
    position: absolute;
    top: 50%;
    transform: rotate(-45deg);
    width: 30px;
}
.marker-content::before {
    background: #00b9aa;
    border-radius: 50%;
    content: "";
    height: 24px;
    margin: 3px 0 0 3px;
    position: absolute;
    width: 24px;
}

.mapboxgl-popup-content {
    padding: 1rem !important;
}