.map-section-container {
    width: 100%;
    color: #e3e3e3;
}
.map-section-container a {
    color: #f2c200;
}
.map-section-container a:hover {
    color: #f2c200;
}
.map-heading {
    padding: 20px;
    text-align: center;
    padding-bottom: 10px;
}
.map-heading h2 {
    font-size: 55px;
}
.heading .map-heading > h2 {
    font-size: 40px;
}
.container-map svg {
    width: 80%;
    margin: 0 auto;
    display: block;
}
g {
    position: relative;
}
.st0 {
    fill: #f0f0f0;
    stroke-width: 1px;
    stroke: #1b1b1b38;
    z-index: 0;
}
.st0:hover {
    stroke-width: 1px;
    transition: 1s ease-out all;
    z-index: 2;
    left: 0;
    top: 0;
}
.our-work {
    cursor: pointer;
}
.our-work:hover {
    fill: rgba(0, 0, 0, 0.6);
}

.detail .content {
    display: none;
}
.map-section-container path:hover, .map-section-container circle:hover {
    stroke: #6cbf03 !important;
    fill: #6cbf03 !important;
}
#myModal {
    background: #000000b3;
}
.orange{
    fill: #FAB902 !important;
}
.vert1{
    fill: #78B72A !important;
}
.vert2{
    fill: #14713F !important;
}

@media only screen and (max-width: 900px) {
    .container {
        margin: auto;
        display: block;
        width: 95%;
    }
    .container-map svg {
        width: auto;
        height: auto;
        margin: 0 auto 40px;
        padding-right: 40px;
        position: relative;
        padding-bottom: 0px;
    }
    .note {
        padding: 10px;
    }
}