What does an asterisk (*) do in a CSS selector?

It is a wildcard, this means it will select all elements within that portion of the DOM.

For example, if I want apply margin to every element on my entire page you can use:

* {
    margin: 10px;
}

You can also use this within sub-selections, for example the following would add a margin to all elements within a paragraph tag:

p * {
    margin: 10px;
}

Your example is doing some css trickery to apply consecutive borders and margins to elements to give them multiple coloured borders. For example, a white border surrounded by a black border.