Пример:

...

Весь код адаптивного меню:

Код прижат к низу страницы с помощью тега:

<div class="pressing"></div>

Теперь разберем код подробнее:

Если про "pressing" все понятно, то начнем с footer.
Как правило подвал всегда пишется в конце кода перед закрывающим тегом
<body>
В нашем случае, тег "pressing" неотъемлемая часть нашего подвала, так как она прижимает его к самому низу.
Так же не забываем указать ссылку в тег head, которая дает доступ к нашим иконкам соц-сетей.
footer-container - задает контейнер, где и будут распологаться все наши элементы.
В теге Logo задаем размеры нашего логотипа
В теге social-media назначаем параметры для наших иконок соц.сетей
txtb - несет в себе параметры Search Bar
Тег btn задает необычный внешний вид нашей кнопке submit
Ну и в конце задается @media для адаптивности нашего подвала под разные размеры экрана.