.galeria{

 margin: 20px;

 justify-content: center;

}



.galeria h2{

 text-align: center;

 font-size: 36px;

 color: var(--primary-color);

 

}



.galeria h3{

    text-align: center;    

    color: var(--text-color-hover);

   }



.grid-container{

    display: grid;

    grid-template-columns: repeat(auto-fill, 300px);

    gap: 10px;

    justify-content: center;

    margin: 0 auto;

}



.grid-container2{

    display: grid;

    grid-template-columns: repeat(auto-fill, 300px);

    gap: 10px;

    justify-content: center;

    margin: 0 auto;

}



.grid-item {

    

    margin-bottom: 40px;

    border-radius: 15px;

    cursor: zoom-in;

    background-color: lightgray;

}



.grid-item2 {

    

    margin-bottom: 40px;

    border-radius: 15px;

    cursor: zoom-in;

    background-color: lightgray;

}



.grid-item:hover{

    filter: opacity(0.9);



}



.grid-item2:hover{

    filter: opacity(0.9);



}



#modal {

    display: none;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(0, 0, 0, 0.7);

    z-index: 999;

    

  }

  

  #imagen-ampliada {

    

    position: absolute;

    top: 55%;

    left: 50%;

    transform: translate(-50%, -50%);

    max-width: 90%;

    max-height: 90%;

  }