.documents-list {
    --list-gutter: 0;
    --link-color: currentColor;
    --link-underline: underline;
    font-size: var(--button-font-size);
}

    .documents-list ul {
        list-style-type: none;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(21rem, 100%), 1fr));
        gap: 1rem 1.5rem;
    }

    .documents-list a {
        display: flex;
        gap: 1rem;
        text-wrap: pretty;
        text-underline-offset: 0.125rem;
    }

        .documents-list a::before {
            content: "";
            flex: 0 0 1rem;
            height: 1lh;
            background-size: 1rem auto;
            background-repeat: no-repeat;
            background-position: 50% 50%;
        }

        .documents-list a[href*=".pdf"]::before {
            background-image: url(../../../../../ResourcePackages/HighroadFramework/MVC/Images/DocumentsList/icon_pdf.svg);
        }

        .documents-list a[href*="events.q4inc.com"]::before,
        .documents-list a[href*=".mp4"]::before {
            background-image: url(../../../../../ResourcePackages/HighroadFramework/MVC/Images/DocumentsList/icon_play.svg);
        }