bootstrap 2 rows menu

1<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
2    <div class="container">
3        <button class="navbar-toggler navbar-toggler-right align-self-center mt-3" type="button" data-toggle="collapse" data-target="#navbarCollapse">
4            <span class="navbar-toggler-icon"></span>
5        </button>
6        <h1 class="py-2 ml-lg-2 mx-3"><a href="#"><i class="fa fa-envelope-o fa-lg mt-2" aria-hidden="true"></i></a></h1>
7        <div class="collapse navbar-collapse flex-column ml-lg-0 ml-3" id="navbarCollapse">
8            <ul class="navbar-nav">
9                <li class="nav-item active">
10                    <a class="nav-link" href="#">Home</a>
11                </li>
12                <li class="nav-item">
13                    <a class="nav-link" href="#">Product</a>
14                </li>
15                <li class="nav-item">
16                    <a class="nav-link" href="#">Shop</a>
17                </li>
18                <li class="nav-item">
19                    <a class="nav-link" href="#">About</a>
20                </li>
21                <li class="nav-item">
22                    <a class="nav-link" href="#">Events</a>
23                </li>
24            </ul>
25            <ul class="navbar-nav flex-row mb-2">
26                <li class="nav-item">
27                    <a class="nav-link py-1 pr-3" href="#"><i class="fa fa-facebook"></i></a>
28                </li>
29                <li class="nav-item">
30                    <a class="nav-link py-1 pr-3" href="#"><i class="fa fa-instagram"></i></a>
31                </li>
32                <li class="nav-item">
33                    <a class="nav-link py-1 pr-3" href="#"><i class="fa fa-twitter"></i></a>
34                </li>
35            </ul>
36        </div>
37    </div>
38</nav>
39