Картинка в вопросе не отображается.
Сначала сделайте стандартное бутстраповское меню по функционалу приближенное к вашему.
Потом на корневой элемент меню добавьте собственный класс и, опираясь на него, перепишите внешний вид в соответствии с дизайном. Если понадобится, добавляйте свои классы на дочерние элементы меню. Не нужно переопределять бутстраповские стили напрямую, это неправильно. Нужно исходить от собственного класса, чтобы он был как скин: поставил на стандартный .navbar — менюшка перекрасилась. Но бутстрап при этом целым остался.
По такому алгоритму работать со всеми компонентами:
голый бутстрап → собственный класс → новый собственный скин
