Streaming live at 10am (PST)

How do we remove the Browser blue focus on TAB line once we have restyled our focus states?

Focus state is important for WCAG 2.4.7 accessibility.
I have created my own states for links within the design style of the website, but when I TAB through the page, the browser blue focus line is still visible. This destroys my beautiful design!

From http://www.outlinenone.com/ I tried putting:

:focus {
outline: 0;
}

into the Project Settings > Custom Code > Head code, but this just put the code as text at the top of the page.

Clearly I need to keep the TAB focus, but I want it styled my way.
I’m using Chrome, if that makes any difference.


Here is my site Read-Only: https://preview.webflow.com/preview/experiencecommunity?utm_medium=preview_link&utm_source=designer&utm_content=experiencecommunity&preview=bcc8f92f8ceae471cb5d25629b14d403&pageId=5da8a928c2248f235b6d3df7&mode=preview

SOLVED
I needed to add the style tags!

/* remember to define focus styles! */ :focus { outline: 0; }