section.level3 {
    display: grid;
    grid-template-columns: minmax(12em, 0.2fr) 1fr;
}

section.level3 h3 {
    grid-column: 1;
    grid-row: 9999 span;
    color: #666666;
    margin: 1em;
    border-right: 4px solid gray;
    display: block;
    width: auto;
    height: calc(100% - 1em);
    display: flex;
    align-items: center;
    justify-content: right;
    padding-right: 1em;
    font-weight: 400;
    text-transform: uppercase;
    font-size: max(0.8em, 16px);
}

section.level4 h4 {
    font-size: 1em;
}

@media only screen and (max-width: 480px) {
    section.level3 {
        display: grid;
        grid-template-columns: unset;
        background-color: rgb(246, 246, 246);
        padding-left: 1em;
        margin-bottom: 1em;
    }

    section.level3 h3 {
        grid-column: 1;
        grid-row: unset;
        border-right: unset;
    }
}

.content ul li:has(a:first-child:last-child) i {
    margin-right: 0.25em;
}

.content ul li:has(a:first-child:last-child) {
    list-style-image: none;
    width: auto;
    display: inline-block;
    padding: 0.4em 1em;
    margin-left: -1.5em;
    margin-right: calc(1.5em + 5px);
    margin-bottom: 5px;
    border-radius: 0.25em;
    font-size: 0.9em;
}

.content ul li:has(a:first-child:last-child i) {
    background-color: grey;
}

.content ul li:has(a:first-child:last-child) a:has(i) {
    color: white;
    text-decoration: none;
}

.content ul li:has(a:first-child:last-child i.fa-gitlab),
.content ul li:has(a:first-child:last-child i.fa-file-code),
.content ul li:has(a:first-child:last-child i.fa-file-zipper) {
    background-color: var(--fuchsia);
}

.content ul li:has(a:first-child:last-child i.fa-video),
.content ul li:has(a:first-child:last-child i.fa-play),
.content ul li:has(a:first-child:last-child i.fa-code) {
    background-color: var(--mahogany);
}

.content ul li:has(a:first-child:last-child i.fa-chalkboard-user) {
    background-color: var(--fern);
}

.content ul li:has(a:first-child:last-child i.fa-file-pdf) {
    background-color: var(--mahogany);
}

.content ul li:has(a:first-child:last-child i.fa-file),
.content ul li:has(a:first-child:last-child i.fa-globe) {
    background-color: var(--cerulean);
}

a code {
    background-color: unset !important;
}
