Иконка-трансформер, шаг 4 [25/29]

Какая-то проблема с заданием. Вроде бы выполнила все как по заданию, а проверк не прохожу(
вот кусок текста где делала работу:

.menu-icon-open span {
transition:all .7s ease-in-out;
transform: rotate(180deg);
}

.menu-icon-open span::before,
.menu-icon-open span::after {
transition:all .7s ease-in-out;
width: 60%;
}

дак написано же menu-icon а вы даете свойства menu-icon-open

Подскажите пожалуйста никак не пойму.В CSS прописан класс .menu-icon-open span, а в HTML коде его вовсе нет. Откуда он берется.

Куда делась вторая группа стрелок?В третьем задании они были,в 4 исчезли, хотя класс menu-icon-open span остался (см. второй скрин)

В третьем задании вам показано, как будет выглядеть иконка в открытом состоянии. Для этого был создан еще один точно такой же блок, но с классом .menu-icon-open, для наглядности.
А в четвертом показывается, что этот класс будет у первого блока, добавляется он с помощью js, когда вы нажимаете на иконку.