.mainpage-romashka g {
    cursor: pointer;
}

.mainpage-romashka path {
    pointer-events: none;
}

.mainpage-romashka path.modeus {
    pointer-events: initial;
    cursor: pointer;
}

.mainpage-romashka g[opacity="0.3"] {
    transition: 1.5s;
}

.mainpage-romashka g[opacity="0.3"] path {
    pointer-events: initial;
}

.mainpage-romashka g[opacity="0.3"]:hover,
.mainpage-romashka:not(:hover) g[opacity="0.3"].active,
.mainpage-romashka g[opacity="0.3"]:hover + path + path + path[opacity="0.7"],
.mainpage-romashka g[opacity="0.3"].active + path + path + path[opacity="0.7"] {
    opacity: 1 !important;
}

.mainpage-romashka:not(:hover) g[opacity="0.3"].active + path + path + path + g > path,
.mainpage-romashka g[opacity="0.3"]:hover + path + path + path + g > path {
    fill: #00FFFF !important;
    /* stroke: #00FFFF; */
}

.mainpage-romashka:not(:hover) g[opacity="0.3"].active + path + path + path + g path.stroke,
.mainpage-romashka g[opacity="0.3"]:hover + path + path + path + g path.stroke {
    fill: transparent !important;
    stroke: #00FFFF;
    stroke-width: 2;
}

.hero-mainpage-row__romashka {
    width: calc(60% - 15px);
}

.hero-mainpage-row__romashka svg {
    max-width: 100%;
}

@media (max-width: 991px) {
    .mainpage-romashka {
        width: 100%;
        height: auto;
    }
}

@media (max-width: 767px) {
    .hero-mainpage-row__romashka {
        width: 100%;
        flex: 0 0 100%;
    }
}