/* FOCUS VISIBILITY - THE SLICK CAROUSEL STYLESHEETS SWITCH THE FOCUS OUTLINE OFF ON
   THEIR OWN CONTROLS (outline: none IN slick.css AND slick-theme.css) AND NOTHING
   PUTS ONE BACK, SO A KEYBOARD USER CANNOT SEE WHICH ARROW OR DOT THEY ARE ON. THOSE
   TWO FILES BELONG TO THE PLUGIN, SO THE RING IS RESTORED HERE INSTEAD, LOADED AFTER
   THEM FROM libraries/includes/header.php. :focus-visible IS KEYBOARD ONLY - A MOUSE
   OR TOUCH VISITOR SEES NO CHANGE AT ALL. WCAG 2.4.7 FOCUS VISIBLE.
   THIS CAN BE FOLDED INTO main3.css AND DELETED WHENEVER THAT FILE IS NEXT TOUCHED */

.slick-prev:focus-visible,
.slick-next:focus-visible,
.slick-dots li button:focus-visible {
    /* WHITE NEXT TO THE CONTROL, THEN NAVY - VISIBLE OVER BOTH THE LIGHT PAGE
       BACKGROUND AND THE PHOTOGRAPHS THE SLIDERS SIT ON */
    outline: 3px solid var(--secondary-blue, #01304D);
    outline-offset: 2px;
    box-shadow: 0 0 0 2px #fff;
}