.alt-formats { .path, .mediaType {font-family: monospace;} &-hint { margin-block-end: 0; display: grid; place-items: start start; grid-template-columns: auto 1fr; &__text { place-self: center start; line-height: 1.5em; } &:before { content: ''; display: inline-block; background: var(--ui-overlay); background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9IndoaXRlIiBkPSJNOS44IDE0LjVoMS42bC44LTIuM2gzLjY1bC44IDIuM2gxLjU1bC0zLjQtOWgtMS42em0yLjg1LTMuNmwxLjMtMy43NWguMWwxLjMgMy43NXpNOCAxOHEtLjgyNSAwLTEuNDEyLS41ODdUNiAxNlY0cTAtLjgyNS41ODgtMS40MTJUOCAyaDEycS44MjUgMCAxLjQxMy41ODhUMjIgNHYxMnEwIC44MjUtLjU4NyAxLjQxM1QyMCAxOHptLTQgNHEtLjgyNSAwLTEuNDEyLS41ODdUMiAyMFY2aDJ2MTRoMTR2MnoiLz48L3N2Zz4=); width: 1em; height: 1em; padding: 0.25em; border-radius: 100em; background-repeat: no-repeat; background-size: 60%; background-position-x: 45%; background-position-y: 55%; margin-inline-end: 0.5em; } } .alt-formats-list { margin-block-start: 0; list-style: none; &-item { margin-block: 0; margin-inline-start: 2em; a {} } } }