/*MENU HAMBURGUESA*/
/* Estilos para mostrar la navegación */
nav {
    position: absolute;
    top: 0;
    left: -100%;
    width: 250px;
    height: 100vh;
    background: #fc670497;
    transition: 0.4s ease;
    z-index: 0;
    z-index: 9999; /* Establece un alto valor de z-index para asegurarte de que esté por encima de otros elementos */
  }
  
  .navigation {
    list-style: none;
  }
  
  .navigation li {
    border-bottom: 1px solid #fc6704dd;
  }
  
  .navigation a {
    color: #fff;
    display: block;
    text-decoration: none;
    padding: 10px 20px;
    transition: 0.4s ease;
  }
  
  .navigation a:hover {
    background: #f96d0ff3;
  }
  
  /* Clase que muestra la navegación */
  .show-navigation {
    left: 0;
  }
  
  /* Agrega un margen derecho para mover el icono a la derecha */
.menu-icon {
    margin-right: 10px;
    cursor: pointer;
    font-size: 10px;
    color: var(--main-color);
    position: absolute;
    left: 0;
    top: 0;
    padding: 6.5px 15px;
    transition: 0.2s ease;
    background: #fc67046e;
  
  }
  
  .menu-icon:hover {
    background: rgba(242, 58, 12, 0.959);
  
  }

  @media(max-width: 911px){
   
    .nav {
        height: 100vh;
    }
   
  
}