@media all {
    /* for off screen HTML that still needs to be read as part of the flow */
    .off_screen { position:absolute !important; height:1px; width: 1px; overflow:hidden; clip:rect(1px 1px 1px 1px); clip:rect(1px, 1px, 1px, 1px); }

    /*-- general WCAG --*/
    /*
    :focus:not(button) { border-bottom:1px var(--color-black) solid; }
    :focus-visible { outline:none; }
    */

    :focus-visible,
    input:focus,
    select:focus,
    textarea:focus { text-decoration:none !important; outline: 3px solid var(--color-cyan); outline-offset: var(--spacing-3S); border-radius: var(--spacing-5S); }

    .link_as_button,
    .input_button,
    input:focus,
    select:focus,
    textarea:focus { outline-offset:0px; }

    input:focus::placeholder,
    select:focus::placeholder,
    textarea:focus::placeholder  { color:var(--color-dark-gray) !important; }

    /*-- on-demand links --*/
    /*
        a:not(.link_as_button):focus { text-decoration:underline !important; }
        a.link_as_button:focus { text-decoration:underline !important; border-radius:0px; }
    */

    a.link_on_focus_only { top:0px; left:-9999px; position:absolute; overflow:hidden;  color:var(--color-blue); background-color:var(--color-white); z-index:-999; }
    a.link_on_focus_only:focus,
    a.link_on_focus_only:active { color:var(--color-white) !important; background-color:var(--color-dark-blue);  top:50px; left:0px; margin:0px; padding:14px 20px; text-align:center; font-weight:400; z-index:99999; text-decoration:underline; line-height:1; }  
}