 <meta name="viewport" content="width=device-width, initial-scale=1">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<div class="col-sm-8" style="color :white; padding-top: 5%;">
 <div class="h1 display-4 text-left" >The Devon Bird Reserves</div>
</div>
<div class="col-sm-4" style="padding-top: 10px; padding-bottom: 10px;">
     <nav class="float-right navbar navbar-expand-md navbar-dark">
	<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleMenu">
    <span class="navbar-toggler-icon"></span>
  </button>
	 <div class="btn-group-vertical btn-group-sm collapse navbar-collapse" id="collapsibleMenu"  role="group" aria-label="Button Group">
	 <ul class="navbar-nav flex-column" style="width: 140px;">
		 <li class="nav-item">
         <a class="btn btn-primary" id="buttons" href="#" role="button">Login</a>
		 </li>
		 <li class="nav-item">
	     <a class="btn btn-primary" id="buttons" href="member_reg.php" role="button">Register</a>
		 </li> 	 
	</ul>
	 </div>
    </nav>
	</div>
