How to cut a transparent circle in a block and place a round block in it?

Question

css

The gist of the question has been conveyed. Here is a sample , you need the black stroke of the circle to be transparent and moreover cut off the fill of the block #navigation, thus "isolating" the circle from the rest of the block. How to implement it correctly? There was an idea to add ::before/::after c with border-radiusthe desired color, but it seems to me that this is not the best option.

Answer 1

radial-gradient
https://jsfiddle.net/yw64rg6j/4/