Tengo un botón
<button class='btn-activa'>MOSTRAR DIV</button>
Que activa este div oculto
<div class='div-oculto' style='display: none; background: red; width: 400px; height: 400px;'>MOSTRANDO DIV</div>
En el css se activa con focus y llamando la clase
<style>
/* al dar click al boton activa el div */
.btn-activar:focus + .div-oculto {
display: block !important;
}
</style>
Lo que quiero lograr es que el :focus siga seleccionado al dar click en cualquier parte de la página ya que normalmente se pierde cuando se da click en cualquier lado y pues desaparece el div con la información, cosa que no quiero.
Cómo puedo hacerlo?