.navbar{
  top: 40px; 
  width: 100%;
  background-color: rgb(32, 58, 83);
  overflow: hidden;
  z-index: 998;
}

.navbar.fixed {
  position: fixed;
  top: 0;
  width: 100%;
  box-shadow: 0px 4px 6px rgba(0,0,0,0.1); /* Optional shadow for depth */
  z-index: 999; /* Higher z-index to ensure it's on top */ 
}

/* For smaller screens */
.hamburger-menu {
  display: none;
  cursor: pointer;
  font-size: 24px;
  color: white;
  padding: 15px 8px;
  float: left;
}

@media (max-width: 913px) {
  .hamburger-menu {
    display: inline-block;
  }
}

@media (max-width: 913px) {
  .navbar a:not(:first-child),
  .navbar .dropdown {
    display: none; /* Hide all items except the first one */
  }
  
  .navbar.responsive a:not(:first-child),
  .navbar.responsive .dropdown {
    display: block;
    float: none; /* Stack items vertically */
    text-align: center;
  }
  
  .navbar.responsive .hamburger-menu {
    display: inline-block;
  }
}



.navbar a{
  float: right;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 18px 12px;
  text-decoration: none;
  font-size: 15px;
}

.navbar a:hover .dropdown:hover .dropbtn, .dropbtn:focus{
  background-color: rgb(48, 174, 162);
  color: white;
}

.dropbtn a:hover {
  background-color: gray;
}

.navbar a:hover {
  background-color: rgb(48, 174, 162);
  color: white;
}

.active-page{
  background-color: gray;
}

.dropdown {
  float: right;
  overflow: hidden;
}

.dropdown .dropbtn {
  cursor: pointer;
  font-size: 15px;  
  border: none;
  outline: none;
  color: white;
  padding: 18px 12px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgb(48, 174, 162);
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1000;
}

.dropdown-content a {
  float: none;
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: right;
}


.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown-content.show {
  display: block;
}


.firstnavbar{

  top: 0;
  width: 100%;
  z-index: 999; 
  overflow: hidden;
  align-items: center;
  padding: 7px 10px;
  height: 40px;
  background-color: white;
  display: flex;
  justify-content:space-around; 

}




.firstnavbar a {
  align-items: center;
  color: #333333;
  padding: 1px 1px;
  text-decoration: none;
  font-size: 14px;
  display: flex; 
  margin: 0 10px;
}

@media screen and (max-width: 913px) {

  .firstnavbar {
    position: relative;
    height: 55px;
  }
  .firstnavbar a {
    font-size: 9px;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  
  .firstnavbar img {
    width: 12px; 
  }
}

.firstnavbar img {
  display: inline-flex; 
  align-items: center;
  vertical-align: middle;
}

.phone-icon, .location-icon, .search-icon, .insta-logo, .telegram-logo {
  width: 20px;
  vertical-align: middle;
}

.phone-icon {
  margin-left: 7px;
}



.otherlang {
  padding: 5px 10px;
  text-decoration: none;
  color: #333333;
  font-size: 14px;

}

.search-box {
  font-family: Vazirmatn, sans-serif;
  font-size: 14px;
  border-radius: 70px;
  color: rgb(32, 58, 83);
  padding-right: 10px;
  padding: 3px 10px;
}

.navbar .icon{
  display: none;
}