<style>


.logo {
  display: inline-block;
  margin-bottom: 0px;
  margin-top: 122px;
}

.mi_logo {
  margin-top: -28px;
}

.barra_superior_menu {
 /* background-color: #0AABDF;*/
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 background-color: #FF7F28;
 z-index: 1001;
 j
 
}

.cabecera {
  /*background-color: #0AABDF;*/
  background-color: #ffffff;
   padding-top:2.4rem;
  position: fixed;
  width: 100%;
  z-index: 1000;

}

.cabecera_movil { 
  padding-top: 0rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
  background-color: #1e2269;
}

.maximo_menu
{
  max-width: 1366px;
  margin: 0 auto;
 
}

.menu-item {
  margin-left: auto;

}

.pico-fondo {
  position: relative;
  clip-path: polygon(100% 0%, 100% 20%, 100% 100%, 100%);
  height: 100%;
}

nav {
  margin-left: auto;
}

nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  padding-right: 0rem;
  padding-top: 1rem;



}

nav ul li {
  margin-right: 38px;
  position: relative;
  margin-top: 0.5rem;
}

nav ul li a {
  text-decoration: none;
  /*color: white;*/
  color:#000000;
  transition: color 0.4s;
  font-weight: 400;
  font-size: 1.1rem;
  font-weight: 600;

}

nav ul li:hover > a {
  color: #333333;
  font-weight:700;
  
}

.submenu {

  position: fixed; /* Cambiado a posición fija para centrar en la pantalla */
   left: 10%; /* Colocado en la mitad de la pantalla horizontalmente */
  width: 80%;
  background-color: #fbfbfb;

  visibility: hidden;
  /*transition: opacity 0.3s, visibility 0.3s, margin-top 0.3s; /* Duración de la transición ajustada a 1 segundo */
  padding-left: 2rem;
  padding-right: 2rem;
  z-index: 10;
  border-radius: 8px; 

  margin-top: 1rem; /* termina de elevar el submenu */
  padding-top: 1.3rem;


}


.submenu a {

  color: #fbfbfb ;
  font-weight: 600;
}

.submenu li {

  color: #646468;
  margin-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;


  border-radius: 8px; /* Agregado para bordes redondeados */

  
}

nav ul li:hover > .submenu {
  display: block;
  opacity: 1;
  visibility: visible;
  margin-top: 0.2rem;/* posicion caja submenu */

}





.submenu2 {

  position: fixed; /* Cambiado a posición fija para centrar en la pantalla */
   left: 10%; /* Colocado en la mitad de la pantalla horizontalmente */
  width: 80%;
  background-color: #fbfbfb;
  visibility: hidden;
  /*transition: opacity 0.3s, visibility 0.3s, margin-top 0.3s; /* Duración de la transición ajustada a 1 segundo */
  padding-left: 2rem;
  padding-right: 2rem;
  z-index: 10;
  border-radius: 8px; 

  margin-top: 1rem; /* termina de elevar el submenu */
  padding-top: 1.3rem;
}


.submenu2 a {

  color: #af8f5b;
  font-weight: 600;

}

.submenu2 li {

  color: #af8f5b;
  margin-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;

  background-color: #222222;
  border-radius: 8px; /* Agregado para bordes redondeados */


  
}

nav ul li:hover > .submenu2 {
  display: block;
  opacity: 1;
  visibility: visible;
  margin-top: 1.3rem;/* posicion caja submenu */
  color: #FBFBFB;

}




#botonBusqueda {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-size: 1rem;
  color: #000;
  margin-left: 8px; /* Añadido este estilo para ajustar la posición del botón */
}

#cajaBusqueda {
  display: none; /* Oculta la caja de búsqueda inicialmente */
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-left: 8px;
  font-size: 0.8rem;
  margin-top: -10px;
  padding-top: -10px;
  width: 60%;

}


#contenedorBusqueda {

  display: flex;
  align-items: center;
  justify-content: flex-end; /* Alinea los elementos al final del contenedor */

}


  .fija {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
  }


  #scrollBtn {

  }
  
  #scrollBtn:hover {
    background-color: #0056b3;
  }




  #miCabecera .navbar-nav {
    max-height: 700px; /* Establece la altura máxima de la lista */
    overflow-y: auto; /* Agrega una barra de desplazamiento vertical si la lista excede la altura máxima */
  }





</style>



