changing the bootstrap navbar break point

1<nav class="navbar navbar-light navbar-expand-md">
2  <a class="navbar-brand" href="#">Navbar</a>
3  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar1">
4    <span class="navbar-toggler-icon"></span>
5  </button>
6  <div class="collapse navbar-collapse" id="navbar1">
7    <ul class="navbar-nav mr-auto">
8      <li class="nav-item active">
9        <a class="nav-link" href="#">Home</a>
10      </li>
11      <li class="nav-item">
12        <a class="nav-link" href="#">Link</a>
13      </li>
14    </ul>
15  </div>
16</nav>
17
18<!---- As you can see from the code above, the navbar-expand-md class in the nav would make this Navbar collapse vertically (and show the toggler icon) at the medium (md) breakpoint of 768px.
19To change to a different breakpoint, we’d just need to swap out navbar-expand-md
20to any of these navbar-expand = never collapses vertically (remains horizontal)
21navbar-expand-sm = collapses below sm widths <576px
22navbar-expand-md = collapses below md widths <768px
23navbar-expand-lg = collapses below lg widths <992px
24navbar-expand-xl = collapses below xl widths <1200px ----!>