Далее нужно сделать выпадающее меню при нажатии на иконку гамбургера. Для этого вставим следующий код:
Пункты меню на широких экранах располагались по середине в строчку. Однако на маленьких экранах пункты меню нужно расположить вертикально и с правой стороны. Для расположения справа применим text-align: left в классе menu. А чтобы расположить пункты вертикально применим свойство display: block в классе .menu li.
Для того чтобы скрыть меню применим transform: translatex(-150%).
Для того чтобы меню появлялась плавно применяем transition: transform 1s.
И отступим 50 пикселей сверху для того чтобы поместился крестик закрытия: padding-top: 50px.