Forward_Station_Server/nav.php

<style type="text/css">
  @media screen and (min-width: 1500px) {
  div.forward {
   margin-right: 280px;
   font-size: 15px;
  }
}

</style>
<header class="main-header">
   
    <!-- Header Navbar: style can be found in header.less -->
    <nav class="navbar navbar-static-top">
      <!-- Sidebar toggle button-->
      <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
        <span class="sr-only">Toggle navigation</span>
      </a>

      <!-- <div class="navbar-custom-menu"> -->
        <ul class="nav navbar-nav pull-right"> 
          <li>
    <div class="forward" style="font-size:25px;color:#fff;font-family:'Lobster', helvetica, arial;">Forward Station Server
    </div></li>
    <li style="width: 120px;"></li>
          <li class="dropdown user user-menu pull-right">
            <a href="#" class="dropdown-toggle mind" data-toggle="dropdown">
              <img src="dist/img/profile.jpg" class="user-image" alt="User Image">
              <span class="hidden-xs" style="color: white;">Admin</span>
            </a>
            <ul class="dropdown-menu">
              
              <li class="user-header">
                <img src="dist/img/profile.jpg" class="img-circle" alt="User Image">

                <p>
                  
                  <small>Member since Nov. 2012</small>
                </p>
              </li>
             
              <li class="user-footer">
                <div class="pull-left">
                  <a href="#" class="btn btn-default btn-flat">Profile</a>
                </div>
                <div class="pull-right">
                  <a href="logout.php" class="btn btn-default btn-flat">Sign out</a>
                </div>
              </li>
            </ul>
          </li>
        </ul>
      <!-- </div> -->
    </nav>
  </header>
  <!-- Left side column. contains the logo and sidebar -->
  <aside class="main-sidebar">
    <section class="sidebar">
      <!-- Sidebar user panel -->
      <div class="user-panel">
        <div class="pull-left image">
            <img src="dist/img/Autoleum Logo.jpg" class="-circle" alt="User Image">
        </div>
        <div class="pull-left info">
          <p style="color: #1fb9bb;margin-top: 10px;font-size:25px;font-family: 'Lobster', helvetica, arial;">Autoleum</p>
        </div>
      </div>
      <ul class="sidebar-menu" data-widget="tree" style="" id="mainNavMenu">
        <!-- <li class="header">MAIN NAVIGATION</li> -->
        <br>
        <li class="active treeview" >
          <a href="#"  style="margin-bottom: 20px;">
            <i class="fa fa-calculator " style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp; <span>Operations</span>
            <span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>
          </a>  
          <ul class="treeview-menu" id="mainSubMenu">
            <li style="margin-top: 20px;"><a href="#" class="collapse-item" onclick="changePages('shifts.php');">  <i class="far fa-calendar-alt" style="font-size:15px;"></i>&nbsp; Shifts</a></li>
            <li> <a href="#" class="collapse-item" onclick="changePages('sales.php');"><i class="fa fa-industry">  </i>&nbsp; Sales</a></li>
            <li><a href="#" class="collapse-item" onclick="changePages('changePrices.php');">
              <i class="fas fa-money-check-alt"></i>&nbsp; Update Prices</a></li>
            <li><a href="#" class="collapse-item" onclick="changePages('deliveries.php');">
              <i class="fas fa-truck"></i>&nbsp; Deliveries</a></li>
            <li> <a href="#" class="collapse-item" onclick="changePages('about.php');">
              <i class="fas fa-award"></i>&nbsp; About</a></li>
          </ul>   
        </li>
        <li class="treeview">
          <a href="#">
            <i class="fa fa-pie-chart" style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp;
            <span>Reports</span>
            <span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>
          </a>
          <ul class="treeview-menu" id="mainSubMenu">
            <li><a class="collapse-item" href="#" onclick="changePages('shiftPumpReport.php');"><i class="fas fa-gas-pump"></i>&nbsp;Shift Pump Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('shiftSaleReport.php');"><i class="fas fa-bars"></i>&nbsp;Shift Sale Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('shiftTankReport.php');"><i class="fas fa-sort-amount-up"></i>&nbsp;Shift Tank Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('shiftGradeReport.php');"><i class="fas fa-chart-bar"></i>&nbsp;Shift Grade Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('creditSaleReport.php');"><i class="fas fa-align-center"></i>&nbsp;Credit Sale Report</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('reconciliationReport.php');"><i class="fas fa-book"></i>&nbsp;Reconciliation Report</a></li>
          </ul>
        </li>
        <li class="treeview">
          <a href="#">
            <i class="fa fa-users" style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp;
            <span>Admin</span>
            <span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>
          </a>
          <ul class="treeview-menu" id="mainSubMenu">
              <li><a class="collapse-item" href="#" onclick="changePages('customers.php');"><i class="fas fa-users"></i>&nbsp;Customers</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('suppliers.php');"><i class="fas fa-user-tie"></i>&nbsp;Suppliers</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('users.php');"><i class="fas fa-grin"></i>&nbsp;User</a></li>
          </ul>
        </li>
        <hr style="border:1px solid #a0c5c5;display: block;"></hr>
        <li class="treeview">
            <a href="#">
              <i class="fa fa-wrench" style="font-size: 21px;"></i>&nbsp; &nbsp;&nbsp;
              <span>Configurations</span>
              <span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>
            </a>
            <ul class="treeview-menu" id="mainSubMenu">
              <li><a class="collapse-item" href="#" onclick="changePages('configurations.php');"><i class="far fa-calendar-alt" style="font-size:15px;"></i>&nbsp; Configurations</a></li>
              <li><a class="collapse-item" href="#" onclick="changePages('fuelPoints.php');"><i class="fa fa-industry"></i>&nbsp;Fuel Points</a></li>
            </ul>
        </li>
        <li class="exit"><a href="logout.php"><i class="fas fa-fw fa-table"></i>&nbsp; &nbsp;&nbsp;&nbsp; <span>Exit</span></a></li>
      </ul>
    </section>
    <!-- /.sidebar -->
  </aside>