.absolute {
    position: absolute;
}

.img-country-map{
    display: flex;
    justify-content: center;
    padding-bottom: 32px;
}

.icon-forecast {
    width: 56px;
    height: 56px;
}

.northVol {
    margin-top: 0%;
    margin-left: 10%;
}

.northEastVol {
    margin-top: 0%;
    margin-left: 76%;
}

.eastVol {
    margin-top: 32%;
    margin-left: 74%;
}

.centralVol {
    margin-top: 29%;
    margin-left: 16%;
}

.southWestVol {
    margin-top: 59%;
    margin-left: 18%;
}

.southEastVol {
    margin-top: 59%;
    margin-left: 66%;
}
.waterVolumn {
    font-size: 0.75rem;
}

.text-orange {
    color: coral !important;
}

.font-small-bold{
    font-family: var(--noto-serif) !important;
    font-size: 14px !important;
    line-height: 23px !important;
    font-weight: 500;
}

@media (min-width: 768px) and (max-width: 992px) {
    .img-country-map > img {
        max-width: 55%;
        max-height: 720px;
    }

    .northVol {
        margin-top: 0%;
        margin-left: 8%;
    }

    .northEastVol {
        margin-top: 0%;
        margin-left: 76%;
    }

    .eastVol {
        margin-top: 34%;
        margin-left: 78%;
    }

    .centralVol {
        margin-top: 32%;
        margin-left: 12%;
    }

    .southWestVol {
        margin-top: 63%;
        margin-left: 12%;
    }

    .southEastVol {
        margin-top: 67%;
        margin-left: 66%;
    }
}

@media (min-width: 576px) and (max-width: 768px) {
    .img-country-map > img {
        max-width: 55%;
        max-height: 720px;
    }

    .country-map .font-normal {
        font-size: 14px !important;
        line-height: 24px;
    }

    .icon-forecast {
        max-width: 48px;
        max-height: 48px;
    }

    .northVol {
        margin-top: 0%;
        margin-left: 8%;
    }

    .northEastVol {
        margin-top: 0%;
        margin-left: 75%;
    }

    .eastVol {
        margin-top: 37%;
        margin-left: 78%;
    }

    .centralVol {
        margin-top: 32%;
        margin-left: 12%;
    }

    .southWestVol {
        margin-top: 75%;
        margin-left: 12%;
    }

    .southEastVol {
        margin-top: 68%;
        margin-left: 66%;
    }
}

@media (min-width: 415px) and (max-width: 576px) {
    .img-country-map > img {
        max-width: 80%;
        max-height: 460px;
    }

    .img-country-map {
        padding-bottom: 0px;
    }

    .country-map .font-normal {
        font-size: 12px !important;
        line-height: 18px;
    }

    .icon-forecast {
        max-width: 32px;
        max-height: 32px;
    }

    .northVol {
        margin-top: 0%;
        margin-left: 2%;
    }

    .northEastVol {
        margin-top: 0%;
        margin-left: 75%;
    }

    .eastVol {
        margin-top: 38%;
        margin-left: 72%;
    }

    .centralVol {
        margin-top: 35%;
        margin-left: 2%;
    }

    .southWestVol {
        margin-top: 75%;
        margin-left: 8%;
    }

    .southEastVol {
        margin-top: 75%;
        margin-left: 66%;
    }
}

@media  (max-width: 414px) {
    .img-country-map > img {
        max-width: 80%;
        max-height: 460px;
    }

    .img-country-map {
        padding-bottom: 0px;
    }

    .country-map .font-normal {
        font-size: 12px !important;
        line-height: 16px;
    }

    .icon-forecast {
        max-width: 32px;
        max-height: 32px;
    }

    .northVol {
        margin-top: 0%;
        margin-left: 1%;
    }

    .northEastVol {
        margin-top: 1%;
        margin-left: 67%;
    }

    .eastVol {
        margin-top: 55%;
        margin-left: 72%;
    }

    .centralVol {
        margin-top: 46%;
        margin-left: 1%;
    }

    .southWestVol {
        margin-top: 96%;
        margin-left: 3%;
    }

    .southEastVol {
        margin-top: 98%;
        margin-left: 66%;
    }
}