* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
  }
  
  body {
    background: whitesmoke;
    color: beige;
  }
  
  a, span a {
    text-decoration: none;
    color: whitesmoke;
  }
  
  #menu {
    color: aliceblue;
    padding: 1em;
  }
  
  #menu ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    width: 80%;
    font-weight: bold;
    list-style: none;
  }
  
  #menu ul li a {
    color: aliceblue;
    margin-right: 35px;
    font-size: 0.9em;
    font-weight: bold;
  }
  
  #menu ul li a:hover {
    color: #2a98f9;
  }
  
  .logo-economic {
    background-color: #190eaf;
  }
  
  .logo-economic img {
    width: 75%;
    margin: 20px 0 0 10%;
    padding: 2em;
  }
  
  .logo-economic nav {
    position: fixed;
    top: 0;
    width: 100%;
    padding-top: 0;
    background-color: #190eaf;
    opacity: 0.9;
    z-index: 998;
  }
  
  .logo-economic ul {
    margin-left: 17%;
  }
  
  .company-name {
    position: relative;
    left: 13%;
    top: 25px;
    color: whitesmoke;
    opacity: 0;
    transition: opacity 0.5s;
  }
  
  .scrolled .company-name {
    opacity: 1;
  }
  
  .barra {
    display: none;
    width: 100%;
    background-color: rgb(0, 0, 175);
    height: 160px;
    text-align: center;
    padding-top: 1em;
  }
  
  .barra img {
    max-width: 95%;
    height: 80%;
  }
  
  @media (max-width: 750px) {
    .nav-fija {
      display: none;
    }
    .nav-pop, .navs {
      visibility: visible;
      width: 100%;
      background-color: rgba(0, 58, 159, 0.567);
    }
    .barra {
      display: block;
    }
  }
  
  .tit {
    text-align: center;
    font-weight: 900;
  }
  
  .texto {
    width: 75%;
    margin: 2em auto 0;
    background-color: rgb(0, 86, 198);
    border-radius: 10px;
    padding: 1em;
  }
  
  @media (max-width: 860px) {
    .texto {
      width: 95%;
      margin-left: 2.5%;
    }
  }
  
  .navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.3em;
    background-color:#190eaf;
    backdrop-filter: blur(10px);
    position: relative;
    top: -40px;

  }
  
  .navbar .toggle-btn {
    display: none;
    color: aliceblue;
    font-size: 0.5em;
    padding: 1.5em;
    margin-right: 2em;
  }
  
  /*.dropdown-menu {
    display: none;
    position: absolute;
    top: 250px;
    right: 4rem;
    width: 300px;
    height: 0px;
    line-height: 3em;
    border-radius: 10px;
    background: whitesmoke;
    backdrop-filter: blur(10px);
    overflow: hidden;
    transition: height 0.2s cubic-bezier(0.175, 0.882, 0.32, 1.275);
  }
    */
    .dropdown-menu {
      visibility: hidden; /* Ocultar visualmente el menú */
      opacity: 0; /* Hacer el menú transparente */
      position: absolute;
      top: 305px;
      right: 3rem;
      width: 280px;
      height: 0; /* Colapsar la altura del menú */
      line-height: 3em;
      border-radius: 10px;
      background: whitesmoke;
      backdrop-filter: blur(10px);

      overflow: hidden; /* Ocultar el contenido desbordado */
      transition: height 0.2s cubic-bezier(0.175, 0.882, 0.32, 1.275), opacity 0.2s ease, visibility 0.2s ease;
  }
  .dropdown-menu li {
    padding: 0;
    text-align: center;
  }
  
  /*.dropdown-menu.open {
    height: 420px;
  }
    */
    .dropdown-menu.open {
      visibility: visible; /* Hacer el menú visible */
      opacity: 1; /* Hacer el menú opaco */
      height: 420px; /* Expandir la altura del menú */
      width: 250px;
  }
  
  @media (max-width: 860px) {
    .navbar .toggle-btn {
      display: block;
      cursor: pointer;
      margin-left: auto;
    }
    #menu {
      display: none;
    }
  }
  @media(max-width:630px){
    .dropdown-menu {
      top: 250px;
    }
  }
  @media(max-width:360px){
    .dropdown-menu {
      top: 200px;
    }
  }
  .footer {
    width: 100%;
    background-color: darkblue;
    margin-top: 25px;
  }
  
  .footer .grupo1 {
    width: 100%;
    max-width: 1200px;
    margin: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 50px;
    padding: 10px 0;
  }
  
  .footer .box figure {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .footer .box figure img {
    width: 160%;
  }
  
  .footer .box h2, .footer .box h3, .footer .box h4, .footer .box p {
    font-family: 'Montserrat', sans-serif;
    color: aliceblue;
    margin-top: 25px;
  }
  
  .footer .box h2 {
    font-size: 25px;
  }
  
  .footer .box h3 {
    font-size: 20px;
  }
  
  .footer .box h4 {
    font-size: 50px;
    text-align: end;
    margin-left: -48%;
  }
  
  .footer .box p {
    font-size: 12px;
    text-align: justify;
  }
  
  @media (max-width: 800px) {
    .footer .grupo1 {
      width: 90%;
      grid-template-columns: 1fr;
      grid-gap: 30px;
      padding: 35px 0;
    }
    .footer .box figure img {
      width: 100%;
    }
    .footer .box p {
      text-align: left;
    }
  }
  
  .footer .grupo1 .num1 .texto2023 {
    text-align: justify;
  }
  
  .footer .grupo1 .num1 .politica {
    text-decoration: underline;
  }
  
  .caja {
    margin: 1.5em;
  }
  
  .fw-bold {
    color: white;
  }
.max {
  max-width: 80px;
  height: 80px;
}
.minibox {
  width: 100px;
  float: left;
  /*poner elementos a la izquierda*/
  height: 100px;
}
  body {
    font-family: 'Montserrat', sans-serif;
  }
  /* Estilos para el Navbar en dispositivos móviles */
@media (max-width: 860px) {
  .navbar .toggle-btn {
      display: block;
      cursor: pointer;
      margin-left: auto;
      font-size: 1.5em; /* Aumenta el tamaño del icono del menú */
      padding: 0.5em; /* Ajusta el padding para mayor usabilidad */
  }

  .dropdown-menu {
      display: block;
      width: 40%; /* Asegúrate de que el menú desplegable ocupe todo el ancho */
      background-color:whitesmoke; /* Aumenta la opacidad para mejor visibilidad */
      text-align: center; /* Centra los elementos del menú */
      padding: .5em; /* Añade padding para separar los elementos del menú */
      line-height: 25px;
  
    }

  .dropdown-menu li {
      padding: 1em 0; /* Aumenta el padding entre los elementos del menú */
      font-size: 1em; /* Aumenta el tamaño de la fuente para mejor legibilidad */
     
      font-weight: 800;
    }
    .dropdown-menu li a{
      color: rgb(0, 0, 101);
    }

  #menu {
      display: none; /* Oculta el menú principal en dispositivos móviles */
  }
}