.map-container {
    max-height: 820px;
    overflow: hidden;
    position: relative;
    width: calc(100% + 150px);
    height: 820px;
    right: -10px;
    top: -180px;

    @media screen and (max-width: 1440px) {
        right: 0;
        width: 100%;
    }
    @media screen and (max-width: 992px) {
        top: 0;
        height: 700px;
    }
    @media screen and (max-width: 768px) {
        top: 0;
        height: 420px;
    }
}

section.map-section {
    .map-box {
        position: relative;
    }
    .map-container {
        width: 100%;
        height: 100%;
        top: 0;
        position: absolute;
        right: 20px;
        min-height: 610px;
        @media screen and (max-width: 1440px) {
            right: 0;
            width: 100%;
            top: -120px;
        }
        @media screen and (max-width: 1200px) {
            top: 0;
            height: 360px;
            min-height: auto;
        }
        @media screen and (max-width: 768px) {
            top: 0;
            height: 420px;
            position: relative;
        }
    }
}



#map {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
}

.map-switch {
    right: -150px;
    top: 4px;

    @media screen and (max-width: 1440px) {
        right: 0;
        top: 0;
    }
}

.location-box-grid-left p {
    max-width: 100%;
}
.location-box-grid-left address {
    font-family: 'Synonym';
    font-weight: 500;
    font-size: 1rem;
    line-height: 2rem;
    letter-spacing: 0px;
    color: var(--light-text);
    max-width: 190px;
    font-style: normal;
}

.markert, .marker {
    background-image: url("/assets/templates/images/map-icon.png");
    //background: blue;
    background-size: 100%;
    width: 20px;
    height: 20px;

    &:hover {
        background-image: url("/assets/templates/images/map-icon-active.png");
    }
}
.marker-region {
    background-image: url("/assets/templates/images/map-marker.svg");
    border-radius: 50%;
    background-size: 100%;
    width: 20px;
    height: 20px;
    transition: all 0.3s ease;

    &:hover {
        opacity: 0.8;
    }
}
.mapboxgl-marker {
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    font-size: 34px;
    cursor: pointer;
    color: red;
}

.map-search {
    margin-top: 4rem;
}

@media screen and (max-width: 992px) {
    .map-grid-view {
        flex-direction: column;
    }

    .map-grid-view-info {
        margin-top: 0;
    }
    .location-box {
        margin-top: 40px;
    }
    
    .map-search {
        margin-top: 2rem;
    }
}


div[class$="--SearchBox"] {
    box-shadow: none;
}
div[class$="--SearchIcon"] {
    display: none;
}

div[class$="--ActionIcon"] {
    display: none !important;
}

input[class$="--Input"]::placeholder {
    color: white !important;
}

.mapbox-info-text {
    color: #F3F8F040;
    margin-bottom: 25px;
}
.search-box-sm.search-box input {
    background-image: url(/assets/templates/images/search-icon-primary.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - 20px);
    background-size: 20px;
}