/* Footer motto: soft fade between texts. A sound status replaces the motto while it is shown. */
.motto{display:inline-block;transition:opacity .7s ease}
.motto.motto-out{opacity:0}
#sound-message:empty{display:none}
#sound-message:not(:empty)~.motto{display:none}
.motto a{color:inherit;text-decoration:underline;text-decoration-color:rgba(135,144,156,.5);text-underline-offset:.3em;transition:color .2s ease}
.motto a:hover,.motto a:focus-visible{color:#bcc3cc;text-decoration-color:currentColor}
.motto a:focus-visible{outline:1px solid #778395;outline-offset:4px}
@media(prefers-reduced-motion:reduce){.motto,.motto a{transition:none}}