/* .container {
  display: flex;
  height: 72%!important;
  width: 68%!important;
  align-items: center;
  justify-content: center;
 
} */

.escritorio{
  height: 72%;
  width: 70%;
}
.escritorio2{
  height: 72%;
  width: 70%;
}
.bento{
  height: 100%;
  width: 100px;;
}


.container3 {
  display: flex;
  height: 65%;
  width: 100%;
  align-items: center;
  justify-content: center;
 
}

.grid {
  display: grid;
  height: 100%;
  width: 100%;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(5, 1fr);
  gap: 4px;
  padding: 8px;

}

.grid div {
  font-family: 'M PLUS 2 Variable', sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  
}

.contenedor-cuadrante {
  grid-column: span 4; /* Hace que ocupe todo el ancho de la cuadrícula */
  background-color: rgba(173, 216, 230, 0.5);
  padding: 16px;
  /* border-radius: 8px; */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.1);
}

.caja2 {
  display: flex;
  align-items: center;
  justify-content: center;
  /* border-radius: 8px; */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.1);
  padding: 10px;
  background-color: #fff;
}

.caja2.proyecto1 {
  background-color: rgba(255, 182, 193, 0.5);
}

.caja2.proyecto2 {
  background-color: rgba(173, 255, 47, 0.5);
}
.caja:hover .text-holder {
  opacity: 1; 
}

@media (max-width: 768px) {
  .container2 {
    display: flex;
    height: 50%;
    width: 90%;
    align-items: center;
    justify-content: center;
   
  }
 .escritorio{
  height: 40%;
  width: 95%;
 }
 .escritorio2{
  height: 50%;
  width: 95%;
  padding-left: 0px;
  padding-right: 0px;
  }
  .movil{
    margin-top: 95vh;
   }
   
}
/* @media (max-width: 480px) {
  .container2 {
    display: flex;
    height: 50%;
    width: 100%;
    align-items: center;
    justify-content: center;
  }
  .escritorio {
    height: 40%;
    width: 95%;
  }
  .escritorio2 {
    height: 50%;
    width: 95%;
    padding-left: 0px;
    padding-right: 0px;
  }
  .movil {
    margin-top: 70vh;
  }
} */
