<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<nav class="navbar navbar-expand-lg it-1 navbar-dark bg-dark shadow-sm">
<div class="container">
<a href="#" class="navbar-brand">
<img src="https://indior.tours/images-static/indior_transperent%20cropped.png" width="85" alt="Indior Tours" class="d-inline-block align-middle mr-2">
<span class="text-uppercase font-weight-bold">The World is Our Family</span>
</a>
<button type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation" class="navbar-toggler"><span class="navbar-toggler-icon"></span></button>
<div id="navbarSupportedContent" class="collapse navbar-collapse">
<ul class="navbar-nav ml-auto">
<li class="nav-item active"><a href="#" class="nav-link">Home <span class="sr-only">(current)</span></a></li>
<li class="nav-item"><a href="#" class="nav-link">About</a></li>
<li class="nav-item"><a href="#" class="nav-link">Services</a></li>
<li class="nav-item"><a href="#" class="nav-link">Contact</a></li>
</ul>
</div>
</div>
</nav>
<section class="it-1">
<div class="container it-1">
<ol class="pt-3">
<li class="it-2">Add your logo image inside<code>a.navbar-brand</code></li>
<li class="it-3">You can set the logo width and height by<code>width=""</code>,<code>height=""</code> attributes.</li>
<li class="it-4">Add one of <code>.align-top .align-middle .align-bottom</code> classes to vertically adapt adjacent text with the image.</li>
</ol>
