  <?php
?>
<!DOCTYPE html>
<html>
<head>
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<link rel="stylesheet" type="text/css" href="css/sidenav.css">
	<script type="text/javascript" src="a.js"></script>
</head>
<body>
  <div class="sidenav">
  	<center>
  	<img src="images/logo.png" style="height: 100px; width: 100px; border-radius: 50%"/><h1 style="text-align: center; color: white; font-family: 'Tw Cen MT';">Kapaleshwar<br>Bhajan</h1></center>
  <a href="main.php">Home</a>
  <a href="disp_bhajans.php">Bhajan List</a>
  <a href="add_bhajan.php">Add Bhajan</a>
  <!-- <button class="dropdown-btn">Add/Remove<i class="fa fa-caret-down"></i></button>
  <div class="dropdown-container">
    <a href="add_mer.php">Add Client</a>
  </div> -->
  <a href="logout.php">Logout</a>
</div>
<script type="text/javascript">
	var dropdown1 = document.getElementsByClassName("dropdown-btn");
	var i;
for (i = 0; i < dropdown1.length; i++)
{
  dropdown1[i].addEventListener("click", function() {
  this.classList.toggle("active");
  var dropdownContent = this.nextElementSibling;
  if (dropdownContent.style.display === "block") {
  dropdownContent.style.display = "none";
  } else {
  dropdownContent.style.display = "block";
  }
  });
}
</script>
</body>
</html>