Почему не меняется цвет?

Question

[fsociety_one]

Доброй ночи! Не понимаю один момент с CSS и SVG. Задал в SVG подключение к стилям, в стилях задал fill: red; Но изменения на странице не обнаружил, открыл SVG просто так (Он в файле), там цвет изменился. А на странице где я его задаю задним фоном - нет. Выручайте!)
SVG:

<?xml-stylesheet type="text/css" href="../css/style.css" ?><svg aria-hidden="true" focusable="false" data-prefix="fab" data-icon="css3" class="svg-inline--fa fa-css3 fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#222" d="M480 32l-64 368-223.3 80L0 400l19.6-94.8h82l-8 40.6L210 390.2l134.1-44.4 18.8-97.1H29.5l16-82h333.7l10.5-52.7H56.3l16.3-82H480z"></path></svg>

css:

.advantages-item::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: url('../img/advantages-1.svg') no-repeat center;
    background-size: auto 75%;
    z-index: -1;
}

.advantages-item:nth-child(2)::after {
    background-image: url('../img/advantages-2.svg');
}

.advantages-item:nth-child(3)::after {
    background-image: url('../img/advantages-3.svg');
}

.advantages-item:nth-child(4)::after {
    background-image: url('../img/advantages-4.svg');
}

path {
    fill: red;
}

Answer 1

[yarovikov]

Потому что fill,работает только элементов, вставленных инлайн.