Как создать вертикальный блок с кнопками в правом верхнем углу на bootstrap?

Добавил в

 .navbar-expand-lg .navbar-nav { 

Я сделал лого слева, добавил стиль logo1 и прописал в html.

При скролле конечно же оно вываливается, но это понятно как исправить, вопрос другой, как сделать, что бы при скролле работала другая картинка?

ну т.е на главной logo1.jpg при скролле logo1scroll.jpg условно, через скрипт?

Можно скриптом.

Через CSS, если правильно понял задачу, можно выцепить как соседний элемент:

не получилось через css, поставил сейчас display:none при скролле, но суть в том, что бы лого которое изначально на странице, менялось на другое при прокрутке

обновил ссылку может так понятнее будет, что я пытаюсь сделать

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

Потому что на ней в js висит обработчик с event.preventDefault()

И вас никак не смущает что бутстрап как раз и нужен чтоб не париться с флексами и делать любую адаптивность классами?

Sly32, никак.

Бутстрап, как любая универсальная штука не позволяет сделать многое из того, что иногда надо делать. Поэтому надо исходитьиз принципа разумной достаточности. Если проще делать на бс. делаем на бс. Если видно, что на бутстрапе будет или очень сложно или очень криво, делаем тем инструментарием, который позволяет сделать легко и просто.

Как это можно исправить? подскажите пожалуйста