.container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.box {
border-radius: 20px;
background-color: #d3bee8;
box-shadow: 10px 10px 9px #cdecd0;
border-right: solid #fdfffe;
border-bottom: solid #fdfffe;
padding:20px;
overflow:auto; 
text-align: center;}

.titlebox img {
    width: 100%;
}

.photoalbum {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px; /* very small border */
}



.photoalbum img {
width: 100%;
  aspect-ratio: 1 / 1; /* forces perfect squares */
  object-fit: cover;  /* crops without distortion */
  display: block;
   filter: grayscale(100%);
  transition: filter 0.3s ease,
    transform 0.3s ease;
}

.photoalbum img:hover {
  filter: grayscale(0%);
  transform: scale(1.06);
}