li {
    list-style: none;
    margin-top: 10px;
    padding: 10px;
    width: 100%;
    margin-left: -25px;
    background: rgba(var(--textRGB), .1);
    border-radius: 10px;
    transition: ease-in-out all .1s .06s;
}

li:hover {
    background: rgba(var(--textRGB), .9);
    color: var(--background);
    transform: translateX(10px);
}

li:active {
    transition: ease-in-out all .0s;
    background: var(--accent);
    transform: translateX(10px);
    color: var(--accent-fg);
}

footer {
    position: fixed;
    bottom: calc(0% + 4px);
    background-color: rgba(var(--backgroundRGB), 1);
    filter: contrast(.9);
    border-top: 1px solid rgba(var(--textRGB), .2);
    box-sizing: border-box;
    padding: 10px 10px;
    margin-left: -25px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#rss {
    border-radius: 5px;
    padding: 3px;
    border: 1px solid transparent;
    transition: ease .15s;
}

#rss > div {
    filter: invert(1);
    background-size: cover;
    background-image: url(./src/rss_dark.png);
    padding: 6px;
}

#rss:hover {
    border-color: rgb(255, 157, 0);
    background: rgb(255, 102, 0);
}

@media (prefers-color-scheme: light) {
    #rss > div {
        filter: invert(0);
    }

    #rss:hover > div{
        filter: invert(1);
    }
}