Как создать круг с четырьмя четвертями [дубликаты]

На этот вопрос уже есть ответ здесь:

Можно ли создать круг, используя только CSS с четырьмя четвертями в нем?

Я не могу получить дальше, чем:

.circle {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  colour: red;
}

<div class="circle">&nbsp;</div>