<div class="col-sm-12">
  <div class="card">
    <div class="card-block">
      <ul class="nav nav-pills">
        <li class="nav-item dropdown">
          <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Service</a>
          <div class="dropdown-menu">
            <a class="dropdown-item" href="/service">Service Page</a>
            <a class="dropdown-item" href="/subservice">Sub Service</a>
          </div>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="/promo">Promotion</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="/about">About</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="/contact">Contact</a>
        </li>
      </ul>
    </div>
  </div>
</div>