* {
      box-sizing: border-box;
    }

    body {
      margin: 0;
      font-family: Arial, sans-serif;
    }

    nav {
      background-color: #002f6c;
	  background-image: url("/images/banner2.jpg");
      color: white;
      display: flex;
      justify-content: space-between;
      align-items: center;
      /*padding: 0 1rem;*/
      height: 60px;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 999;
	  
	  background-position: 70% 50%;
    /*
	border-bottom: 1px solid #0a2f5c;
    box-shadow: -3px 4px 2px -2px gray;
	*/
	  
    }

    .logo {
      font-size: 1.2rem;
	  height: -webkit-fill-available;
    }

    .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
    }

    .hamburger span {
      height: 3px;
      width: 25px;
      background: white;
    }

    .menu {
      display: flex;
      margin-left: auto;
    }

    .menu a {
      color: white;
      text-decoration: none;
      padding: 1rem;
      display: block;
    }

    .menu-item {
      position: relative;
    }

    .dropdown {
      display: none;
      position: absolute;
      top: 60px;
      left: 0;
      background-color: white;
      color: black;
      min-width: 150px;
      box-shadow: 0 2px 5px rgba(0,0,0,0.2);
      z-index: 1000;
    }

    .dropdown a {
      color: black;
      padding: 0.75rem 1rem;
      text-decoration: none;
      display: block;
      white-space: nowrap;
    }

    .menu-item:hover .dropdown {
      display: block;
    }

    @media (max-width: 768px) {
      nav {
        flex-wrap: wrap;
        height: 74px;
        /*padding: 0 10px;*/
      }

      .hamburger {
        display: flex;
		padding-right: 20px;
      }

      .menu {
        display: none;
        flex-direction: column;
        width: 100%;
        background-color: #002f6c;
      }

      .menu.show {
        display: flex;
        /*margin-top: 10px;*/
      }

      .menu-item {
        width: 100%;
      }

      .menu a {
        border-top: 1px solid rgba(255, 255, 255, 0.1);
      }

      .menu-item:hover .dropdown {
        display: none; /* disable hover dropdown on mobile */
      }

      .dropdown {
        position: static;
        background-color: #003d91;
        box-shadow: none;
        display: none;
        flex-direction: column;
      }

      .menu-item.active .dropdown {
        display: flex;
      }

      .dropdown a {
        color: white;
        padding-left: 2rem;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
      }
    }



#menu-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh; /* Full screen height */
  background-color: rgba(0, 0, 0, 0.95); /* Optional dark overlay */
  z-index: 1000;
  display: none; /* Start hidden */
}

#menu-container.show {
  display: block;
}









/*
nav
{
	background-color: #002f6c;
	background-image: url("banner2.jpg");

	color: white;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 1rem;
	height: 60px;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
	background-position: 70% 50%;
	border-bottom: 1px solid #0a2f5c;
	box-shadow: -3px 4px 2px -2px gray;
	
	
	
}

    .logo
	{
		
      position:relative;
	  top:7px
    }

    .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
    }

    .hamburger span {
      height: 3px;
      width: 25px;
      background: white;
    }

    .menu {
      display: flex;
      gap: 1rem;
      margin-left: auto;
    }

    .menu a {
      color: white;
      text-decoration: none;
      padding: 1rem;
      display: block;
    }

    .menu-item {
      position: relative;
    }

    .dropdown {
      display: none;
      position: absolute;
      top: 60px;
      left: 0;
      background-color: white;
      color: black;
      min-width: 150px;
      box-shadow: 0 2px 5px rgba(0,0,0,0.2);
      z-index: 1000;
    }

    .dropdown a {
      color: black;
      padding: 0.75rem 1rem;
      text-decoration: none;
      display: block;
      white-space: nowrap;
    }

    .menu-item:hover .dropdown {
      display: block;
    }

    @media (max-width: 768px) {
      nav {
        flex-wrap: wrap;
        height: auto;
        
      }

      .hamburger {
        display: flex;
      }

      .menu {
        display: none;
        flex-direction: column;
        width: 100%;
        background-color: #002f6c;
      }

      .menu.show {
        display: flex;
       
      }

      .menu-item {
        width: 100%;
      }

      .menu a {
        border-top: 1px solid rgba(255, 255, 255, 0.1);
      }

      .menu-item:hover .dropdown {
        display: none; 
      }

      .dropdown {
        position: static;
        background-color: #003d91;
        box-shadow: none;
        display: none;
        flex-direction: column;
      }

      .menu-item.active .dropdown {
        display: flex;
      }

      .dropdown a {
        color: white;
        padding-left: 2rem;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
      }
    }
	*/